Merge pull request #1548 from Camc314/migrate-to-ES6-14

Migration of device and devices to ES6 modules

package.json

@@ -152,6 +152,8 @@
           "src/controllers/dashboard/networking.js",
           "src/controllers/dashboard/playback.js",
           "src/controllers/dashboard/plugins/repositories.js",
+          "src/controllers/dashboard/devices/devices.js",
+          "src/controllers/dashboard/devices/device.js",
           "src/controllers/dashboard/serveractivity.js",
           "src/elements/emby-tabs/emby-tabs.js",
           "src/elements/emby-scroller/emby-scroller.js",

src/controllers/dashboard/devices/device.js

@@ -1,5 +1,10 @@
-define(['loading', 'libraryMenu', 'dom', 'emby-input', 'emby-button'], function (loading, libraryMenu, dom) {
+import loading from 'loading';
-    'use strict';
+import libraryMenu from 'libraryMenu';
+import dom from 'dom';
+import 'emby-input';
+import 'emby-button';
+
+/* eslint-disable indent */
 
     function load(page, device, deviceOptions) {
         page.querySelector('#txtCustomName', page).value = deviceOptions.CustomName || '';
@@ -7,13 +12,13 @@ define(['loading', 'libraryMenu', 'dom', 'emby-input', 'emby-button'], function
     }
 
     function loadData() {
-        var page = this;
+        const page = this;
         loading.show();
-        var id = getParameterByName('id');
+        const id = getParameterByName('id');
-        var promise1 = ApiClient.getJSON(ApiClient.getUrl('Devices/Info', {
+        const promise1 = ApiClient.getJSON(ApiClient.getUrl('Devices/Info', {
             Id: id
         }));
-        var promise2 = ApiClient.getJSON(ApiClient.getUrl('Devices/Options', {
+        const promise2 = ApiClient.getJSON(ApiClient.getUrl('Devices/Options', {
             Id: id
         }));
         Promise.all([promise1, promise2]).then(function (responses) {
@@ -23,7 +28,7 @@ define(['loading', 'libraryMenu', 'dom', 'emby-input', 'emby-button'], function
     }
 
     function save(page) {
-        var id = getParameterByName('id');
+        const id = getParameterByName('id');
         ApiClient.ajax({
             url: ApiClient.getUrl('Devices/Options', {
                 Id: id
@@ -37,14 +42,15 @@ define(['loading', 'libraryMenu', 'dom', 'emby-input', 'emby-button'], function
     }
 
     function onSubmit(e) {
-        var form = this;
+        const form = this;
         save(dom.parentWithClass(form, 'page'));
         e.preventDefault();
         return false;
     }
 
-    return function (view, params) {
+    export default function (view, params) {
         view.querySelector('form').addEventListener('submit', onSubmit);
         view.addEventListener('viewshow', loadData);
-    };
+    }
-});
+
+/* eslint-enable indent */

src/controllers/dashboard/devices/devices.js

@@ -1,15 +1,25 @@
-define(['loading', 'dom', 'libraryMenu', 'globalize', 'scripts/imagehelper', 'date-fns', 'dfnshelper', 'emby-button', 'emby-itemscontainer', 'cardStyle'], function (loading, dom, libraryMenu, globalize, imageHelper, datefns, dfnshelper) {
+import loading from 'loading';
-    'use strict';
+import dom from 'dom';
+import libraryMenu from 'libraryMenu';
+import globalize from 'globalize';
+import imageHelper from 'scripts/imagehelper';
+import * as datefns from 'date-fns';
+import dfnshelper from 'dfnshelper';
+import 'emby-button';
+import 'emby-itemscontainer';
+import 'cardStyle';
+
+/* eslint-disable indent */
 
     function canDelete(deviceId) {
         return deviceId !== ApiClient.deviceId();
     }
 
     function deleteDevice(page, id) {
-        var msg = globalize.translate('DeleteDeviceConfirmation');
+        const msg = globalize.translate('DeleteDeviceConfirmation');
 
-        require(['confirm'], function (confirm) {
+        import('confirm').then(({default: confirm}) => {
-            confirm.default({
+            confirm({
                 text: msg,
                 title: globalize.translate('HeaderDeleteDevice'),
                 confirmText: globalize.translate('ButtonDelete'),
@@ -29,7 +39,7 @@ define(['loading', 'dom', 'libraryMenu', 'globalize', 'scripts/imagehelper', 'da
     }
 
     function showDeviceMenu(view, btn, deviceId) {
-        var menuItems = [];
+        let menuItems = [];
 
         if (canEdit) {
             menuItems.push({
@@ -47,7 +57,7 @@ define(['loading', 'dom', 'libraryMenu', 'globalize', 'scripts/imagehelper', 'da
             });
         }
 
-        require(['actionsheet'], function (actionsheet) {
+        import('actionsheet').then(({default: actionsheet}) => {
             actionsheet.show({
                 items: menuItems,
                 positionTo: btn,
@@ -66,15 +76,15 @@ define(['loading', 'dom', 'libraryMenu', 'globalize', 'scripts/imagehelper', 'da
     }
 
     function load(page, devices) {
-        var html = '';
+        let html = '';
         html += devices.map(function (device) {
-            var deviceHtml = '';
+            let deviceHtml = '';
             deviceHtml += "<div data-id='" + device.Id + "' class='card backdropCard'>";
             deviceHtml += '<div class="cardBox visualCardBox">';
             deviceHtml += '<div class="cardScalable">';
             deviceHtml += '<div class="cardPadder cardPadder-backdrop"></div>';
             deviceHtml += '<a is="emby-linkbutton" href="' + (canEdit ? 'device.html?id=' + device.Id : '#') + '" class="cardContent cardImageContainer">';
-            var iconUrl = imageHelper.getDeviceIcon(device);
+            const iconUrl = imageHelper.getDeviceIcon(device);
 
             if (iconUrl) {
                 deviceHtml += '<div class="cardImage" style="background-image:url(\'' + iconUrl + "');background-size: auto 64%;background-position:center center;\">";
@@ -124,10 +134,10 @@ define(['loading', 'dom', 'libraryMenu', 'globalize', 'scripts/imagehelper', 'da
         });
     }
 
-    var canEdit = ApiClient.isMinServerVersion('3.4.1.31');
+    const canEdit = ApiClient.isMinServerVersion('3.4.1.31');
-    return function (view, params) {
+    export default function (view, params) {
         view.querySelector('.devicesList').addEventListener('click', function (e) {
-            var btnDeviceMenu = dom.parentWithClass(e.target, 'btnDeviceMenu');
+            const btnDeviceMenu = dom.parentWithClass(e.target, 'btnDeviceMenu');
 
             if (btnDeviceMenu) {
                 showDeviceMenu(view, btnDeviceMenu, btnDeviceMenu.getAttribute('data-id'));
@@ -136,5 +146,6 @@ define(['loading', 'dom', 'libraryMenu', 'globalize', 'scripts/imagehelper', 'da
         view.addEventListener('viewshow', function () {
             loadData(this);
         });
-    };
+    }
-});
+
+/* eslint-enable indent */