From 9ae5d347c1c81bc573676b159b79e106e63a4506 Mon Sep 17 00:00:00 2001
From: Luke Pulverenti <luke.pulverenti@gmail.com>
Date: Sat, 11 Oct 2014 16:38:13 -0400
Subject: [PATCH] add device upload options

---
 app.config                            |   1 +
 dashboard-ui/devices.html             |  28 ++++++
 dashboard-ui/devicesupload.html       |  63 ++++++++++++
 dashboard-ui/metadatasubtitles.html   |   1 -
 dashboard-ui/scripts/devices.js       |  90 +++++++++++++++++
 dashboard-ui/scripts/devicesupload.js | 140 ++++++++++++++++++++++++++
 dashboard-ui/scripts/site.js          |   4 +
 packages.config                       |   2 +-
 8 files changed, 327 insertions(+), 2 deletions(-)
 create mode 100644 dashboard-ui/devices.html
 create mode 100644 dashboard-ui/devicesupload.html
 create mode 100644 dashboard-ui/scripts/devices.js
 create mode 100644 dashboard-ui/scripts/devicesupload.js
diff --git a/app.config b/app.config
index 8d7ee4f172..d66f0b626a 100644
--- a/app.config
+++ b/app.config
@@ -9,6 +9,7 @@
   
   
   
+  
 <webMarkupMin xmlns="http://tempuri.org/WebMarkupMin.Configuration.xsd">
 		<core>
 			<css>
diff --git a/dashboard-ui/devices.html b/dashboard-ui/devices.html
new file mode 100644
index 0000000000..10025c263b
--- /dev/null
+++ b/dashboard-ui/devices.html
@@ -0,0 +1,28 @@
+﻿<!DOCTYPE html>
+<html>
+<head>
+    <title>${TitleDevices}</title>
+</head>
+<body>
+    <div id="devicesPage" data-role="page" class="page type-interior devicesPage">
+
+        <div data-role="content">
+            <div class="content-primary">
+
+                <div data-role="controlgroup" data-type="horizontal" class="localnav" data-mini="true">
+                    <a href="#" data-role="button" class="ui-btn-active">${TabDevices}</a>
+                    <a href="devicesupload.html" data-role="button">${TabCameraUpload}</a>
+                </div>
+
+                <div class="readOnlyContent">
+                    <div class="devicesList">
+                        
+                        
+
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</body>
+</html>
diff --git a/dashboard-ui/devicesupload.html b/dashboard-ui/devicesupload.html
new file mode 100644
index 0000000000..1a13b93cd7
--- /dev/null
+++ b/dashboard-ui/devicesupload.html
@@ -0,0 +1,63 @@
+﻿<!DOCTYPE html>
+<html>
+<head>
+    <title>${TitleDevices}</title>
+</head>
+<body>
+    <div id="devicesUploadPage" data-role="page" class="page type-interior devicesPage">
+
+        <div data-role="content">
+            <div class="content-primary">
+
+                <div data-role="controlgroup" data-type="horizontal" class="localnav" data-mini="true">
+                    <a href="devices.html" data-role="button">${TabDevices}</a>
+                    <a href="#" data-role="button" class="ui-btn-active">${TabCameraUpload}</a>
+                </div>
+
+
+                <div class="readOnlyContent">
+
+                    <p>${HeaderCameraUploadHelp}</p>
+
+                    <p class="noDevices" style="display:none;color:red;">${MessageNoDevicesSupportCameraUpload}</p>
+
+                    <br />
+                    <form class="devicesUploadForm">
+
+                        <div class="devicesList">
+
+                        </div>
+
+                        <br /><br />
+                        <ul data-role="listview" class="ulForm">
+                            <li>
+                                <label for="txtUploadPath">${LabelUploadPath}</label>
+                                <div style="display: inline-block; width: 92%;">
+                                    <input type="text" id="txtUploadPath" data-mini="true" />
+                                </div>
+                                <button id="btnSelectUploadPath" type="button" data-icon="search" data-iconpos="notext" data-inline="true">${ButtonSelectDirectory}</button>
+                                <div class="fieldDescription">${LabelUploadPathHelp}</div>
+                            </li>
+
+                        </ul><br />
+                        <ul data-role="listview" class="ulForm">
+                            <li>
+                                <button type="submit" data-theme="b" data-icon="check">
+                                    ${ButtonSave}
+                                </button>
+                                <button type="button" onclick="Dashboard.navigate('dashboard.html');" data-icon="delete">
+                                    ${ButtonCancel}
+                                </button>
+                            </li>
+                        </ul>
+
+                    </form>
+                </div>
+            </div>
+        </div>
+        <script type="text/javascript">
+            $('.devicesUploadForm').off('submit', DevicesUploadPage.onSubmit).on('submit', DevicesUploadPage.onSubmit);
+        </script>
+    </div>
+</body>
+</html>
diff --git a/dashboard-ui/metadatasubtitles.html b/dashboard-ui/metadatasubtitles.html
index bfd0452245..949af3b935 100644
--- a/dashboard-ui/metadatasubtitles.html
+++ b/dashboard-ui/metadatasubtitles.html
@@ -56,7 +56,6 @@
                             <input type="password" id="txtOpenSubtitlePassword" data-mini="true" />
                         </li>
                     </ul>
-                    <br />
                     <ul data-role="listview" class="ulForm">
                         <li>
                             <button type="submit" data-theme="b" data-icon="check" data-mini="true">
diff --git a/dashboard-ui/scripts/devices.js b/dashboard-ui/scripts/devices.js
new file mode 100644
index 0000000000..e21751c07c
--- /dev/null
+++ b/dashboard-ui/scripts/devices.js
@@ -0,0 +1,90 @@
+﻿(function () {
+
+    function deleteDevice(page, id) {
+
+        var msg = Globalize.translate('DeleteDeviceConfirmation');
+
+        Dashboard.confirm(msg, Globalize.translate('HeaderDeleteDevice'), function (result) {
+
+            if (result) {
+                Dashboard.showLoadingMsg();
+
+                ApiClient.ajax({
+                    type: "DELETE",
+                    url: ApiClient.getUrl('Devices', {
+                        Id: id
+                    })
+
+                }).done(function () {
+
+                    loadData(page);
+                });
+            }
+        });
+    }
+
+    function load(page, devices) {
+
+        var html = '';
+
+        html += '<ul data-role="listview" data-inset="true" data-split-icon="minus">';
+
+        html += devices.map(function (d) {
+
+            var deviceHtml = '';
+            deviceHtml += '<li>';
+
+            deviceHtml += '<a href="#">';
+
+            deviceHtml += '<h3>';
+            deviceHtml += d.Name;
+            deviceHtml += '</h3>';
+
+            if (d.LastUserName) {
+                deviceHtml += '<p style="color:green;">';
+                deviceHtml += Globalize.translate('DeviceLastUsedByUserName', d.LastUserName);
+                deviceHtml += '</p>';
+            }
+
+            deviceHtml += '</a>';
+
+            deviceHtml += '<a href="#" data-icon="minus" class="btnDeleteDevice" data-id="' + d.Id + '">';
+            deviceHtml += Globalize.translate('Delete');
+            deviceHtml += '</a>';
+
+
+            deviceHtml += '</li>';
+            return deviceHtml;
+
+        }).join('');
+
+        html += '</ul>';
+
+        var elem = $('.devicesList', page).html(html).trigger('create');
+
+        $('.btnDeleteDevice', elem).on('click', function () {
+
+            deleteDevice(page, this.getAttribute('data-id'));
+        });
+    }
+
+    function loadData(page) {
+        Dashboard.showLoadingMsg();
+
+        ApiClient.getJSON(ApiClient.getUrl('Devices')).done(function (devices) {
+
+            load(page, devices);
+
+            Dashboard.hideLoadingMsg();
+        });
+    }
+
+    $(document).on('pageshow', "#devicesPage", function () {
+
+        var page = this;
+
+        loadData(page);
+
+    });
+
+})();
\ No newline at end of file
diff --git a/dashboard-ui/scripts/devicesupload.js b/dashboard-ui/scripts/devicesupload.js
new file mode 100644
index 0000000000..9063452f79
--- /dev/null
+++ b/dashboard-ui/scripts/devicesupload.js
@@ -0,0 +1,140 @@
+﻿(function () {
+
+    function load(page, devices, config) {
+
+        if (devices.length) {
+            $('.noDevices', page).hide();
+            $('.devicesUploadForm', page).show();
+        } else {
+            $('.noDevices', page).show();
+            $('.devicesUploadForm', page).hide();
+        }
+
+        $('#txtUploadPath', page).val(config.CameraUploadPath || '');
+
+        loadDeviceList(page, devices, config);
+    }
+
+    function loadDeviceList(page, devices, config) {
+
+        var html = '';
+
+        html += '<fieldset data-role="controlgroup">';
+
+        html += '<legend>';
+        html += Globalize.translate('LabelEnableCameraUploadFor');
+        html += '</legend>';
+
+        var index = 0;
+        html += devices.map(function (d) {
+
+            var deviceHtml = '';
+
+            var id = "chk" + index;
+
+            deviceHtml += '<label for="' + id + '">';
+            deviceHtml += d.Name;
+            deviceHtml += '</label>';
+
+            var isChecked = config.EnabledCameraUploadDevices.indexOf(d.Id) != -1;
+            var checkedHtml = isChecked ? ' checked="checked"' : '';
+
+            deviceHtml += '<input type="checkbox" id="' + id + '" class="chkDevice" data-id="' + d.Id + '"' + checkedHtml + ' />';
+
+            index++;
+
+            return deviceHtml;
+
+        }).join('');
+
+        html += '</fieldset>';
+
+        html += '<div class="fieldDescription">';
+        html += Globalize.translate('LabelEnableCameraUploadForHelp');
+        html += '</div>';
+
+        $('.devicesList', page).html(html).trigger('create');
+    }
+
+    function loadData(page) {
+
+        Dashboard.showLoadingMsg();
+
+        var promise1 = ApiClient.getNamedConfiguration("devices");
+        var promise2 = ApiClient.getJSON(ApiClient.getUrl('Devices', {
+
+            SupportsContentUploading: true
+
+        }));
+
+        $.when(promise1, promise2).done(function (response1, response2) {
+
+
+            load(page, response2[0], response1[0]);
+
+            Dashboard.hideLoadingMsg();
+        });
+    }
+
+    function save(page) {
+
+        ApiClient.getNamedConfiguration("devices").done(function (config) {
+
+            config.CameraUploadPath = $('#txtUploadPath', page).val();
+
+            config.EnabledCameraUploadDevices = $('.chkDevice:checked', page).get().map(function (c) {
+
+                return c.getAttribute('data-id');
+
+            });
+
+            ApiClient.updateNamedConfiguration("devices", config).done(Dashboard.processServerConfigurationUpdateResult);
+        });
+
+    }
+
+    $(document).on('pageinit', "#devicesUploadPage", function () {
+
+        var page = this;
+
+        $('#btnSelectUploadPath', page).on("click.selectDirectory", function () {
+
+            var picker = new DirectoryBrowser(page);
+
+            picker.show({
+
+                callback: function (path) {
+
+                    if (path) {
+                        $('#txtUploadPath', page).val(path);
+                    }
+                    picker.close();
+                },
+
+                header: Globalize.translate('HeaderSelectUploadPath')
+            });
+        });
+
+
+    }).on('pageshow', "#devicesUploadPage", function () {
+
+        var page = this;
+
+        loadData(page);
+
+    });
+
+    window.DevicesUploadPage = {
+
+        onSubmit: function () {
+
+            var form = this;
+            var page = $(form).parents('.page');
+
+            save(page);
+
+            return false;
+        }
+    };
+
+})();
\ No newline at end of file
diff --git a/dashboard-ui/scripts/site.js b/dashboard-ui/scripts/site.js
index ba1d50287d..632f45f432 100644
--- a/dashboard-ui/scripts/site.js
+++ b/dashboard-ui/scripts/site.js
@@ -678,6 +678,10 @@ var Dashboard = {
             name: Globalize.translate('TabServer'),
             href: "dashboard.html",
             selected: page.hasClass("dashboardHomePage")
+        }, {
+            name: Globalize.translate('TabDevices'),
+            href: "devices.html",
+            selected: page.hasClass("devicesPage")
         }, {
             name: Globalize.translate('TabUsers'),
             href: "userprofiles.html",
diff --git a/packages.config b/packages.config
index 7a472fe0d0..573abbdbdd 100644
--- a/packages.config
+++ b/packages.config
@@ -1,5 +1,5 @@
 ﻿<?xml version="1.0" encoding="utf-8"?>
 <packages>
   <package id="MediaBrowser.ApiClient.Javascript" version="3.0.249" targetFramework="net45" />
-  <package id="WebMarkupMin.Core" version="0.9.6" targetFramework="net45" />
+  <package id="WebMarkupMin.Core" version="0.9.7" targetFramework="net45" />
 </packages>
\ No newline at end of file
