Merge pull request #1778 from Camc314/migrate-to-ES6-66

Migration of logoScreenSaver and playAccessValidation to ES6 module

package.json

@@ -163,6 +163,8 @@
           "src/components/slideshow/slideshow.js",
           "src/components/sortmenu/sortmenu.js",
           "src/plugins/htmlVideoPlayer/plugin.js",
+          "src/plugins/logoScreensaver/plugin.js",
+          "src/plugins/playAccessValidation/plugin.js",
           "src/components/search/searchfields.js",
           "src/components/search/searchresults.js",
           "src/components/settingshelper.js",

src/plugins/logoScreensaver/plugin.js

@@ -1,165 +1,165 @@
-define(['pluginManager'], function (pluginManager) {
+import pluginManager from 'pluginManager';
-    return function () {
-        var self = this;
 
-        self.name = 'Logo ScreenSaver';
+export default function () {
-        self.type = 'screensaver';
+    const self = this;
-        self.id = 'logoscreensaver';
-        self.supportsAnonymous = true;
 
-        var interval;
+    self.name = 'Logo ScreenSaver';
+    self.type = 'screensaver';
+    self.id = 'logoscreensaver';
+    self.supportsAnonymous = true;
 
-        function animate() {
+    let interval;
-            var animations = [
 
-                bounceInLeft,
+    function animate() {
-                bounceInRight,
+        const animations = [
-                swing,
-                tada,
-                wobble,
-                rotateIn,
-                rotateOut
-            ];
 
-            var elem = document.querySelector('.logoScreenSaverImage');
+            bounceInLeft,
+            bounceInRight,
+            swing,
+            tada,
+            wobble,
+            rotateIn,
+            rotateOut
+        ];
 
-            if (elem && elem.animate) {
+        const elem = document.querySelector('.logoScreenSaverImage');
-                var random = getRandomInt(0, animations.length - 1);
 
-                animations[random](elem, 1);
+        if (elem && elem.animate) {
+            const random = getRandomInt(0, animations.length - 1);
+
+            animations[random](elem, 1);
+        }
+    }
+
+    function getRandomInt(min, max) {
+        return Math.floor(Math.random() * (max - min + 1)) + min;
+    }
+
+    function bounceInLeft(elem, iterations) {
+        const keyframes = [
+            { transform: 'translate3d(-3000px, 0, 0)', opacity: '0', offset: 0 },
+            { transform: 'translate3d(25px, 0, 0)', opacity: '1', offset: 0.6 },
+            { transform: 'translate3d(-100px, 0, 0)', offset: 0.75 },
+            { transform: 'translate3d(5px, 0, 0)', offset: 0.9 },
+            { transform: 'none', opacity: '1', offset: 1 }];
+        const timing = { duration: 900, iterations: iterations, easing: 'cubic-bezier(0.215, 0.610, 0.355, 1.000)' };
+        return elem.animate(keyframes, timing);
+    }
+
+    function bounceInRight(elem, iterations) {
+        const keyframes = [
+            { transform: 'translate3d(3000px, 0, 0)', opacity: '0', offset: 0 },
+            { transform: 'translate3d(-25px, 0, 0)', opacity: '1', offset: 0.6 },
+            { transform: 'translate3d(100px, 0, 0)', offset: 0.75 },
+            { transform: 'translate3d(-5px, 0, 0)', offset: 0.9 },
+            { transform: 'none', opacity: '1', offset: 1 }];
+        const timing = { duration: 900, iterations: iterations, easing: 'cubic-bezier(0.215, 0.610, 0.355, 1.000)' };
+        return elem.animate(keyframes, timing);
+    }
+
+    function swing(elem, iterations) {
+        const keyframes = [
+            { transform: 'translate(0%)', offset: 0 },
+            { transform: 'rotate3d(0, 0, 1, 15deg)', offset: 0.2 },
+            { transform: 'rotate3d(0, 0, 1, -10deg)', offset: 0.4 },
+            { transform: 'rotate3d(0, 0, 1, 5deg)', offset: 0.6 },
+            { transform: 'rotate3d(0, 0, 1, -5deg)', offset: 0.8 },
+            { transform: 'rotate3d(0, 0, 1, 0deg)', offset: 1 }];
+        const timing = { duration: 900, iterations: iterations };
+        return elem.animate(keyframes, timing);
+    }
+
+    function tada(elem, iterations) {
+        const keyframes = [
+            { transform: 'scale3d(1, 1, 1)', offset: 0 },
+            { transform: 'scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg)', offset: 0.1 },
+            { transform: 'scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg)', offset: 0.2 },
+            { transform: 'scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg)', offset: 0.3 },
+            { transform: 'scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg)', offset: 0.4 },
+            { transform: 'scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg)', offset: 0.5 },
+            { transform: 'scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg)', offset: 0.6 },
+            { transform: 'scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg)', offset: 0.7 },
+            { transform: 'scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg)', offset: 0.8 },
+            { transform: 'scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg)', offset: 0.9 },
+            { transform: 'scale3d(1, 1, 1)', offset: 1 }];
+        const timing = { duration: 900, iterations: iterations };
+        return elem.animate(keyframes, timing);
+    }
+
+    function wobble(elem, iterations) {
+        const keyframes = [
+            { transform: 'translate(0%)', offset: 0 },
+            { transform: 'translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg)', offset: 0.15 },
+            { transform: 'translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg)', offset: 0.45 },
+            { transform: 'translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg)', offset: 0.6 },
+            { transform: 'translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg)', offset: 0.75 },
+            { transform: 'translateX(0%)', offset: 1 }];
+        const timing = { duration: 900, iterations: iterations };
+        return elem.animate(keyframes, timing);
+    }
+
+    function rotateIn(elem, iterations) {
+        const keyframes = [{ transform: 'rotate3d(0, 0, 1, -200deg)', opacity: '0', transformOrigin: 'center', offset: 0 },
+            { transform: 'none', opacity: '1', transformOrigin: 'center', offset: 1 }];
+        const timing = { duration: 900, iterations: iterations };
+        return elem.animate(keyframes, timing);
+    }
+
+    function rotateOut(elem, iterations) {
+        const keyframes = [{ transform: 'none', opacity: '1', transformOrigin: 'center', offset: 0 },
+            { transform: 'rotate3d(0, 0, 1, 200deg)', opacity: '0', transformOrigin: 'center', offset: 1 }];
+        const timing = { duration: 900, iterations: iterations };
+        return elem.animate(keyframes, timing);
+    }
+
+    function fadeOut(elem, iterations) {
+        const keyframes = [
+            { opacity: '1', offset: 0 },
+            { opacity: '0', offset: 1 }];
+        const timing = { duration: 400, iterations: iterations };
+        return elem.animate(keyframes, timing);
+    }
+
+    function stopInterval() {
+        if (interval) {
+            clearInterval(interval);
+            interval = null;
+        }
+    }
+
+    self.show = function () {
+        import('css!' + pluginManager.mapPath(self, 'style.css')).then(() => {
+            let elem = document.querySelector('.logoScreenSaver');
+
+            if (!elem) {
+                elem = document.createElement('div');
+                elem.classList.add('logoScreenSaver');
+                document.body.appendChild(elem);
+
+                elem.innerHTML = '<img class="logoScreenSaverImage" src="assets/img/banner-light.png" />';
             }
-        }
 
-        function getRandomInt(min, max) {
-            return Math.floor(Math.random() * (max - min + 1)) + min;
-        }
-
-        function bounceInLeft(elem, iterations) {
-            var keyframes = [
-                { transform: 'translate3d(-3000px, 0, 0)', opacity: '0', offset: 0 },
-                { transform: 'translate3d(25px, 0, 0)', opacity: '1', offset: 0.6 },
-                { transform: 'translate3d(-100px, 0, 0)', offset: 0.75 },
-                { transform: 'translate3d(5px, 0, 0)', offset: 0.9 },
-                { transform: 'none', opacity: '1', offset: 1 }];
-            var timing = { duration: 900, iterations: iterations, easing: 'cubic-bezier(0.215, 0.610, 0.355, 1.000)' };
-            return elem.animate(keyframes, timing);
-        }
-
-        function bounceInRight(elem, iterations) {
-            var keyframes = [
-                { transform: 'translate3d(3000px, 0, 0)', opacity: '0', offset: 0 },
-                { transform: 'translate3d(-25px, 0, 0)', opacity: '1', offset: 0.6 },
-                { transform: 'translate3d(100px, 0, 0)', offset: 0.75 },
-                { transform: 'translate3d(-5px, 0, 0)', offset: 0.9 },
-                { transform: 'none', opacity: '1', offset: 1 }];
-            var timing = { duration: 900, iterations: iterations, easing: 'cubic-bezier(0.215, 0.610, 0.355, 1.000)' };
-            return elem.animate(keyframes, timing);
-        }
-
-        function swing(elem, iterations) {
-            var keyframes = [
-                { transform: 'translate(0%)', offset: 0 },
-                { transform: 'rotate3d(0, 0, 1, 15deg)', offset: 0.2 },
-                { transform: 'rotate3d(0, 0, 1, -10deg)', offset: 0.4 },
-                { transform: 'rotate3d(0, 0, 1, 5deg)', offset: 0.6 },
-                { transform: 'rotate3d(0, 0, 1, -5deg)', offset: 0.8 },
-                { transform: 'rotate3d(0, 0, 1, 0deg)', offset: 1 }];
-            var timing = { duration: 900, iterations: iterations };
-            return elem.animate(keyframes, timing);
-        }
-
-        function tada(elem, iterations) {
-            var keyframes = [
-                { transform: 'scale3d(1, 1, 1)', offset: 0 },
-                { transform: 'scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg)', offset: 0.1 },
-                { transform: 'scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg)', offset: 0.2 },
-                { transform: 'scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg)', offset: 0.3 },
-                { transform: 'scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg)', offset: 0.4 },
-                { transform: 'scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg)', offset: 0.5 },
-                { transform: 'scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg)', offset: 0.6 },
-                { transform: 'scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg)', offset: 0.7 },
-                { transform: 'scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg)', offset: 0.8 },
-                { transform: 'scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg)', offset: 0.9 },
-                { transform: 'scale3d(1, 1, 1)', offset: 1 }];
-            var timing = { duration: 900, iterations: iterations };
-            return elem.animate(keyframes, timing);
-        }
-
-        function wobble(elem, iterations) {
-            var keyframes = [
-                { transform: 'translate(0%)', offset: 0 },
-                { transform: 'translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg)', offset: 0.15 },
-                { transform: 'translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg)', offset: 0.45 },
-                { transform: 'translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg)', offset: 0.6 },
-                { transform: 'translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg)', offset: 0.75 },
-                { transform: 'translateX(0%)', offset: 1 }];
-            var timing = { duration: 900, iterations: iterations };
-            return elem.animate(keyframes, timing);
-        }
-
-        function rotateIn(elem, iterations) {
-            var keyframes = [{ transform: 'rotate3d(0, 0, 1, -200deg)', opacity: '0', transformOrigin: 'center', offset: 0 },
-                { transform: 'none', opacity: '1', transformOrigin: 'center', offset: 1 }];
-            var timing = { duration: 900, iterations: iterations };
-            return elem.animate(keyframes, timing);
-        }
-
-        function rotateOut(elem, iterations) {
-            var keyframes = [{ transform: 'none', opacity: '1', transformOrigin: 'center', offset: 0 },
-                { transform: 'rotate3d(0, 0, 1, 200deg)', opacity: '0', transformOrigin: 'center', offset: 1 }];
-            var timing = { duration: 900, iterations: iterations };
-            return elem.animate(keyframes, timing);
-        }
-
-        function fadeOut(elem, iterations) {
-            var keyframes = [
-                { opacity: '1', offset: 0 },
-                { opacity: '0', offset: 1 }];
-            var timing = { duration: 400, iterations: iterations };
-            return elem.animate(keyframes, timing);
-        }
-
-        function stopInterval() {
-            if (interval) {
-                clearInterval(interval);
-                interval = null;
-            }
-        }
-
-        self.show = function () {
-            require(['css!' + pluginManager.mapPath(self, 'style.css')], function () {
-                var elem = document.querySelector('.logoScreenSaver');
-
-                if (!elem) {
-                    elem = document.createElement('div');
-                    elem.classList.add('logoScreenSaver');
-                    document.body.appendChild(elem);
-
-                    elem.innerHTML = '<img class="logoScreenSaverImage" src="assets/img/banner-light.png" />';
-                }
-
-                stopInterval();
-                interval = setInterval(animate, 3000);
-            });
-        };
-
-        self.hide = function () {
             stopInterval();
-
+            interval = setInterval(animate, 3000);
-            var elem = document.querySelector('.logoScreenSaver');
+        });
-
-            if (elem) {
-                var onAnimationFinish = function () {
-                    elem.parentNode.removeChild(elem);
-                };
-
-                if (elem.animate) {
-                    var animation = fadeOut(elem, 1);
-                    animation.onfinish = onAnimationFinish;
-                } else {
-                    onAnimationFinish();
-                }
-            }
-        };
     };
-});
+
+    self.hide = function () {
+        stopInterval();
+
+        const elem = document.querySelector('.logoScreenSaver');
+
+        if (elem) {
+            const onAnimationFinish = function () {
+                elem.parentNode.removeChild(elem);
+            };
+
+            if (elem.animate) {
+                const animation = fadeOut(elem, 1);
+                animation.onfinish = onAnimationFinish;
+            } else {
+                onAnimationFinish();
+            }
+        }
+    };
+}

src/plugins/playAccessValidation/plugin.js

@@ -1,33 +1,26 @@
-define(['connectionManager', 'globalize'], function (connectionManager, globalize) {
+import connectionManager from 'connectionManager';
-    'use strict';
+import globalize from 'globalize';
 
-    function getRequirePromise(deps) {
+function showErrorMessage() {
-        return new Promise(function (resolve, reject) {
+    return import('alert').then(({default: alert}) => {
-            require(deps, resolve);
+        return alert(globalize.translate('MessagePlayAccessRestricted'));
-        });
+    });
-    }
+}
 
-    function showErrorMessage() {
+class PlayAccessValidation {
-        return getRequirePromise(['alert']).then(function (alert) {
+    constructor() {
-            return alert(globalize.translate('MessagePlayAccessRestricted')).then(function () {
-                return Promise.reject();
-            });
-        });
-    }
-
-    function PlayAccessValidation() {
         this.name = 'Playback validation';
         this.type = 'preplayintercept';
         this.id = 'playaccessvalidation';
         this.order = -2;
     }
 
-    PlayAccessValidation.prototype.intercept = function (options) {
+    intercept(options) {
-        var item = options.item;
+        const item = options.item;
         if (!item) {
             return Promise.resolve();
         }
-        var serverId = item.ServerId;
+        const serverId = item.ServerId;
         if (!serverId) {
             return Promise.resolve();
         }
@@ -44,7 +37,7 @@ define(['connectionManager', 'globalize'], function (connectionManager, globaliz
 
             return showErrorMessage();
         });
-    };
+    }
+}
 
-    return PlayAccessValidation;
+export default PlayAccessValidation;
-});