Migration of taskbutton and touchHelper to ES6 modules

package.json

@@ -154,6 +154,9 @@
           "src/plugins/bookPlayer/plugin.js",
           "src/plugins/bookPlayer/tableOfContents.js",
           "src/plugins/photoPlayer/plugin.js",
+          "src/scripts/settings/appSettings.js",
+          "src/scripts/settings/userSettings.js",
+          "src/scripts/settings/webSettings.js",
           "src/scripts/deleteHelper.js",
           "src/scripts/dfnshelper.js",
           "src/scripts/dom.js",
@@ -161,14 +164,13 @@
           "src/scripts/filesystem.js",
           "src/scripts/imagehelper.js",
           "src/scripts/inputManager.js",
+          "src/scripts/keyboardNavigation.js",
+          "src/scripts/taskbutton.js",
+          "src/scripts/touchHelper.js",
+          "src/scripts/themeLoader.js",
           "src/plugins/backdropScreensaver/plugin.js",
           "src/components/filterdialog/filterdialog.js",
-          "src/components/fetchhelper.js",
+          "src/components/fetchhelper.js"
-          "src/scripts/keyboardNavigation.js",
-          "src/scripts/settings/appSettings.js",
-          "src/scripts/settings/userSettings.js",
-          "src/scripts/themeLoader.js",
-          "src/scripts/settings/webSettings.js"
         ],
         "plugins": [
           "@babel/plugin-transform-modules-amd",

src/components/maintabsmanager.js

@@ -85,7 +85,7 @@ define(['dom', 'browser', 'events', 'emby-tabs', 'emby-button'], function (dom,
 
         require(['touchHelper'], function (TouchHelper) {
 
-            var touchHelper = new TouchHelper(view.parentNode.parentNode);
+            var touchHelper = new TouchHelper.default(view.parentNode.parentNode);
 
             events.on(touchHelper, 'swipeleft', onSwipeLeft);
             events.on(touchHelper, 'swiperight', onSwipeRight);

src/controllers/dashboard/mediaLibrary.js

@@ -372,7 +372,7 @@ define(['jQuery', 'apphost', 'scripts/taskbutton', 'loading', 'libraryMenu', 'gl
     pageIdOn('pageshow', 'mediaLibraryPage', function () {
         libraryMenu.setTabs('librarysetup', 0, getTabs);
         var page = this;
-        taskButton({
+        taskButton.default({
             mode: 'on',
             progressElem: page.querySelector('.refreshProgress'),
             taskKey: 'RefreshLibrary',
@@ -381,7 +381,7 @@ define(['jQuery', 'apphost', 'scripts/taskbutton', 'loading', 'libraryMenu', 'gl
     });
     pageIdOn('pagebeforehide', 'mediaLibraryPage', function () {
         var page = this;
-        taskButton({
+        taskButton.default({
             mode: 'off',
             progressElem: page.querySelector('.refreshProgress'),
             taskKey: 'RefreshLibrary',

src/controllers/livetvstatus.js

@@ -303,7 +303,7 @@ define(['jQuery', 'globalize', 'scripts/taskbutton', 'dom', 'libraryMenu', 'layo
     }).on('pageshow', '#liveTvStatusPage', function () {
         var page = this;
         reload(page);
-        taskButton({
+        taskButton.default({
             mode: 'on',
             progressElem: page.querySelector('.refreshGuideProgress'),
             taskKey: 'RefreshGuide',
@@ -311,7 +311,7 @@ define(['jQuery', 'globalize', 'scripts/taskbutton', 'dom', 'libraryMenu', 'layo
         });
     }).on('pagehide', '#liveTvStatusPage', function () {
         var page = this;
-        taskButton({
+        taskButton.default({
             mode: 'off',
             progressElem: page.querySelector('.refreshGuideProgress'),
             taskKey: 'RefreshGuide',

src/controllers/playback/videoosd.js

@@ -1533,7 +1533,7 @@ define(['playbackManager', 'dom', 'inputManager', 'datetime', 'itemHelper', 'med
         if (browser.touch) {
             (function () {
                 require(['touchHelper'], function (TouchHelper) {
-                    self.touchHelper = new TouchHelper(view, {
+                    self.touchHelper = new TouchHelper.default(view, {
                         swipeYThreshold: 30,
                         triggerOnMove: true,
                         preventDefaultOnMove: true,

src/scripts/taskbutton.js

@@ -1,119 +1,122 @@
-define(['events', 'userSettings', 'serverNotifications', 'connectionManager', 'globalize', 'emby-button'], function (events, userSettings, serverNotifications, connectionManager, globalize) {
+import events from 'events';
-    'use strict';
+import * as userSettings from 'userSettings';
+import serverNotifications from 'serverNotifications';
+import connectionManager from 'connectionManager';
+import globalize from 'globalize';
+import 'emby-button';
 
-    return function (options) {
+export default function (options) {
-        function pollTasks() {
+    function pollTasks() {
-            connectionManager.getApiClient(serverId).getScheduledTasks({
+        connectionManager.getApiClient(serverId).getScheduledTasks({
-                IsEnabled: true
+            IsEnabled: true
-            }).then(updateTasks);
+        }).then(updateTasks);
-        }
+    }
 
-        function updateTasks(tasks) {
+    function updateTasks(tasks) {
-            var task = tasks.filter(function (t) {
+        var task = tasks.filter(function (t) {
-                return t.Key == options.taskKey;
+            return t.Key == options.taskKey;
-            })[0];
+        })[0];
-
-            if (options.panel) {
-                if (task) {
-                    options.panel.classList.remove('hide');
-                } else {
-                    options.panel.classList.add('hide');
-                }
-            }
-
-            if (!task) {
-                return;
-            }
-
-            if (task.State == 'Idle') {
-                button.removeAttribute('disabled');
-            } else {
-                button.setAttribute('disabled', 'disabled');
-            }
-
-            button.setAttribute('data-taskid', task.Id);
-            var progress = (task.CurrentProgressPercentage || 0).toFixed(1);
-
-            if (options.progressElem) {
-                options.progressElem.value = progress;
-
-                if (task.State == 'Running') {
-                    options.progressElem.classList.remove('hide');
-                } else {
-                    options.progressElem.classList.add('hide');
-                }
-            }
-
-            if (options.lastResultElem) {
-                var lastResult = task.LastExecutionResult ? task.LastExecutionResult.Status : '';
-
-                if (lastResult == 'Failed') {
-                    options.lastResultElem.html('<span style="color:#FF0000;">(' + globalize.translate('LabelFailed') + ')</span>');
-                } else if (lastResult == 'Cancelled') {
-                    options.lastResultElem.html('<span style="color:#0026FF;">(' + globalize.translate('LabelCancelled') + ')</span>');
-                } else if (lastResult == 'Aborted') {
-                    options.lastResultElem.html('<span style="color:#FF0000;">' + globalize.translate('LabelAbortedByServerShutdown') + '</span>');
-                } else {
-                    options.lastResultElem.html(lastResult);
-                }
-            }
-        }
-
-        function onScheduledTaskMessageConfirmed(id) {
-            connectionManager.getApiClient(serverId).startScheduledTask(id).then(pollTasks);
-        }
-
-        function onButtonClick() {
-            onScheduledTaskMessageConfirmed(this.getAttribute('data-taskid'));
-        }
-
-        function onScheduledTasksUpdate(e, apiClient, info) {
-            if (apiClient.serverId() === serverId) {
-                updateTasks(info);
-            }
-        }
-
-        var pollInterval;
-        var button = options.button;
-        var serverId = ApiClient.serverId();
-
-        function onPollIntervalFired() {
-            if (!connectionManager.getApiClient(serverId).isMessageChannelOpen()) {
-                pollTasks();
-            }
-        }
-
-        function startInterval() {
-            var apiClient = connectionManager.getApiClient(serverId);
-
-            if (pollInterval) {
-                clearInterval(pollInterval);
-            }
-            apiClient.sendMessage('ScheduledTasksInfoStart', '1000,1000');
-            pollInterval = setInterval(onPollIntervalFired, 5000);
-        }
-
-        function stopInterval() {
-            connectionManager.getApiClient(serverId).sendMessage('ScheduledTasksInfoStop');
-
-            if (pollInterval) {
-                clearInterval(pollInterval);
-            }
-        }
 
         if (options.panel) {
-            options.panel.classList.add('hide');
+            if (task) {
+                options.panel.classList.remove('hide');
+            } else {
+                options.panel.classList.add('hide');
+            }
         }
 
-        if (options.mode == 'off') {
+        if (!task) {
-            button.removeEventListener('click', onButtonClick);
+            return;
-            events.off(serverNotifications, 'ScheduledTasksInfo', onScheduledTasksUpdate);
-            stopInterval();
-        } else {
-            button.addEventListener('click', onButtonClick);
-            pollTasks();
-            startInterval();
-            events.on(serverNotifications, 'ScheduledTasksInfo', onScheduledTasksUpdate);
         }
-    };
+
-});
+        if (task.State == 'Idle') {
+            button.removeAttribute('disabled');
+        } else {
+            button.setAttribute('disabled', 'disabled');
+        }
+
+        button.setAttribute('data-taskid', task.Id);
+        var progress = (task.CurrentProgressPercentage || 0).toFixed(1);
+
+        if (options.progressElem) {
+            options.progressElem.value = progress;
+
+            if (task.State == 'Running') {
+                options.progressElem.classList.remove('hide');
+            } else {
+                options.progressElem.classList.add('hide');
+            }
+        }
+
+        if (options.lastResultElem) {
+            var lastResult = task.LastExecutionResult ? task.LastExecutionResult.Status : '';
+
+            if (lastResult == 'Failed') {
+                options.lastResultElem.html('<span style="color:#FF0000;">(' + globalize.translate('LabelFailed') + ')</span>');
+            } else if (lastResult == 'Cancelled') {
+                options.lastResultElem.html('<span style="color:#0026FF;">(' + globalize.translate('LabelCancelled') + ')</span>');
+            } else if (lastResult == 'Aborted') {
+                options.lastResultElem.html('<span style="color:#FF0000;">' + globalize.translate('LabelAbortedByServerShutdown') + '</span>');
+            } else {
+                options.lastResultElem.html(lastResult);
+            }
+        }
+    }
+
+    function onScheduledTaskMessageConfirmed(id) {
+        connectionManager.getApiClient(serverId).startScheduledTask(id).then(pollTasks);
+    }
+
+    function onButtonClick() {
+        onScheduledTaskMessageConfirmed(this.getAttribute('data-taskid'));
+    }
+
+    function onScheduledTasksUpdate(e, apiClient, info) {
+        if (apiClient.serverId() === serverId) {
+            updateTasks(info);
+        }
+    }
+
+    var pollInterval;
+    var button = options.button;
+    var serverId = ApiClient.serverId();
+
+    function onPollIntervalFired() {
+        if (!connectionManager.getApiClient(serverId).isMessageChannelOpen()) {
+            pollTasks();
+        }
+    }
+
+    function startInterval() {
+        var apiClient = connectionManager.getApiClient(serverId);
+
+        if (pollInterval) {
+            clearInterval(pollInterval);
+        }
+        apiClient.sendMessage('ScheduledTasksInfoStart', '1000,1000');
+        pollInterval = setInterval(onPollIntervalFired, 5000);
+    }
+
+    function stopInterval() {
+        connectionManager.getApiClient(serverId).sendMessage('ScheduledTasksInfoStop');
+
+        if (pollInterval) {
+            clearInterval(pollInterval);
+        }
+    }
+
+    if (options.panel) {
+        options.panel.classList.add('hide');
+    }
+
+    if (options.mode == 'off') {
+        button.removeEventListener('click', onButtonClick);
+        events.off(serverNotifications, 'ScheduledTasksInfo', onScheduledTasksUpdate);
+        stopInterval();
+    } else {
+        button.addEventListener('click', onButtonClick);
+        pollTasks();
+        startInterval();
+        events.on(serverNotifications, 'ScheduledTasksInfo', onScheduledTasksUpdate);
+    }
+}

src/scripts/touchHelper.js

@@ -1,12 +1,12 @@
-define(['dom', 'events'], function (dom, events) {
+import dom from 'dom';
-    'use strict';
+import events from 'events';
 
-    function getTouches(e) {
+function getTouches(e) {
+    return e.changedTouches || e.targetTouches || e.touches;
+}
 
-        return e.changedTouches || e.targetTouches || e.touches;
+class TouchHelper {
-    }
+    constructor(elem, options) {
-
-    function TouchHelper(elem, options) {
 
         options = options || {};
         var touchTarget;
@@ -138,8 +138,7 @@ define(['dom', 'events'], function (dom, events) {
             passive: true
         });
     }
-
+    destroy() {
-    TouchHelper.prototype.destroy = function () {
 
         var elem = this.elem;
 
@@ -165,7 +164,7 @@ define(['dom', 'events'], function (dom, events) {
         this.touchEnd = null;
 
         this.elem = null;
-    };
+    }
+}
 
-    return TouchHelper;
+export default TouchHelper;
-});