update dialogs

dashboard-ui/bower_components/emby-webcomponents/.bower.json

@@ -15,12 +15,12 @@
   },
   "devDependencies": {},
   "ignore": [],
-  "version": "1.4.2",
+  "version": "1.4.5",
-  "_release": "1.4.2",
+  "_release": "1.4.5",
   "_resolution": {
     "type": "version",
-    "tag": "1.4.2",
+    "tag": "1.4.5",
-    "commit": "53a28dd7296648adfda6f62cf45012567b670186"
+    "commit": "da29c275857fd674c0946c5f3138d3eaef03cbc8"
   },
   "_source": "https://github.com/MediaBrowser/emby-webcomponents.git",
   "_target": "^1.2.0",

dashboard-ui/bower_components/emby-webcomponents/listview/listview.css

@@ -2,7 +2,7 @@
     display: flex;
     align-items: center;
     text-align: left;
-    padding: .1em .55em !important;
+    padding: .1em 1.25em !important;
     outline: none !important;
 }
 
@@ -12,7 +12,16 @@
 
 .listItemBody {
     flex-grow: 1;
-    padding: .35em .55em;
+    padding: .35em 1.25em;
+}
+
+    .listItemBody h3 {
+        margin: 0;
+        font-weight: normal;
+    }
+
+.listItemBodyText {
+    padding: .25em 0;
 }
 
 .listItemImage {
@@ -47,6 +56,12 @@
     transition: transform .2s ease-out;
 }
 
-.listItem:focus {
+    .listItem:focus {
-    transform: scale(1.025, 1.025);
+        transform: scale(1.025, 1.025);
-}
+    }
+
+.paperList {
+    padding: .5em 0;
+    margin: 12px auto;
+    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -2px rgba(0, 0, 0, 0.2);
+}

dashboard-ui/bower_components/emby-webcomponents/recordingcreator/recordingcreator.js

@@ -1,4 +1,4 @@
-define(['dialogHelper', 'globalize', 'layoutManager', 'mediaInfo', 'apphost', 'connectionManager', 'require', 'loading', 'scrollHelper', 'scrollStyles', 'paper-checkbox', 'emby-collapsible', 'emby-input', 'paper-icon-button-light', 'css!./../formdialog', 'css!./recordingcreator', 'html!./../icons/mediainfo.html', 'html!./../icons/nav.html'], function (dialogHelper, globalize, layoutManager, mediaInfo, appHost, connectionManager, require, loading, scrollHelper) {
+define(['dialogHelper', 'globalize', 'layoutManager', 'mediaInfo', 'apphost', 'connectionManager', 'require', 'loading', 'scrollHelper', 'paper-checkbox', 'emby-collapsible', 'emby-input', 'paper-icon-button-light', 'css!./../formdialog', 'css!./recordingcreator', 'html!./../icons/mediainfo.html', 'html!./../icons/nav.html'], function (dialogHelper, globalize, layoutManager, mediaInfo, appHost, connectionManager, require, loading, scrollHelper) {
 
     var currentProgramId;
     var currentServerId;

dashboard-ui/bower_components/emby-webcomponents/subtitleeditor/subtitleeditor.js

@@ -0,0 +1,427 @@
+define(['dialogHelper', 'require', 'layoutManager', 'globalize', 'appStorage', 'connectionManager', 'loading', 'paper-fab', 'listViewStyle', 'paper-icon-button-light', 'css!./../formdialog'], function (dialogHelper, require, layoutManager, globalize, appStorage, connectionManager, loading) {
+
+    var currentItem;
+
+    function showLocalSubtitles(context, index) {
+
+        loading.show();
+
+        var subtitleContent = context.querySelector('.subtitleContent');
+        subtitleContent.innerHTML = '';
+
+        var apiClient = connectionManager.getApiClient(currentItem.ServerId);
+        var url = 'Videos/' + currentItem.Id + '/Subtitles/' + index;
+
+        apiClient.ajax({
+
+            type: 'GET',
+            url: url
+
+        }).then(function (result) {
+
+            subtitleContent.innerHTML = result;
+
+            loading.hide();
+        });
+    }
+
+    function showRemoteSubtitles(context, id) {
+
+        loading.show();
+
+        var url = 'Providers/Subtitles/Subtitles/' + id;
+
+        ApiClient.get(ApiClient.getUrl(url)).then(function (result) {
+
+            // show result
+
+            loading.hide();
+        });
+    }
+
+    function downloadRemoteSubtitles(context, id) {
+
+        var url = 'Items/' + currentItem.Id + '/RemoteSearch/Subtitles/' + id;
+
+        var apiClient = connectionManager.getApiClient(currentItem.ServerId);
+        apiClient.ajax({
+
+            type: "POST",
+            url: apiClient.getUrl(url)
+
+        }).then(function () {
+
+            require(['toast'], function (toast) {
+                toast(globalize.translate('MessageDownloadQueued'));
+            });
+        });
+    }
+
+    function deleteLocalSubtitle(context, index) {
+
+        var msg = globalize.translate('MessageAreYouSureDeleteSubtitles');
+
+        require(['confirm'], function (confirm) {
+
+            confirm(msg, globalize.translate('HeaderConfirmDeletion')).then(function () {
+
+                loading.show();
+
+                var itemId = currentItem.Id;
+                var url = 'Videos/' + itemId + '/Subtitles/' + index;
+
+                var apiClient = connectionManager.getApiClient(currentItem.ServerId);
+
+                apiClient.ajax({
+
+                    type: "DELETE",
+                    url: apiClient.getUrl(url)
+
+                }).then(function () {
+
+                    reload(context, apiClient, itemId);
+                });
+            });
+        });
+    }
+
+    function fillSubtitleList(context, item) {
+
+        var streams = item.MediaStreams || [];
+
+        var subs = streams.filter(function (s) {
+
+            return s.Type == 'Subtitle';
+        });
+
+        var html = '';
+
+        if (subs.length) {
+
+            html += '<h1 style="margin-top:1.5em;">' + globalize.translate('HeaderCurrentSubtitles') + '</h1>';
+
+            if (layoutManager.tv) {
+                html += '<div>';
+            } else {
+                html += '<div class="paperList">';
+            }
+
+            html += subs.map(function (s) {
+
+                var itemHtml = '';
+
+                itemHtml += '<div class="listItem">';
+
+                itemHtml += '<paper-fab mini class="blue" icon="closed-caption" item-icon></paper-fab>';
+
+                var atts = [];
+
+                atts.push(s.Codec);
+                if (s.IsDefault) {
+
+                    atts.push('Default');
+                }
+                if (s.IsForced) {
+
+                    atts.push('Forced');
+                }
+
+                itemHtml += '<div class="listItemBody">';
+
+                itemHtml += '<h3 class="listItemBodyText">';
+                itemHtml += (s.Language || globalize.translate('LabelUnknownLanaguage'));
+                itemHtml += '</h3>';
+
+                itemHtml += '<div class="secondary listItemBodyText">' + atts.join(' - ') + '</div>';
+
+                if (s.Path) {
+                    itemHtml += '<div class="secondary listItemBodyText">' + (s.Path) + '</div>';
+                }
+
+                itemHtml += '</a>';
+                itemHtml += '</div>';
+
+                if (s.Path) {
+                    itemHtml += '<button is="paper-icon-button-light" data-index="' + s.Index + '" title="' + globalize.translate('Delete') + '" class="btnDelete"><iron-icon icon="delete"></iron-icon></button>';
+                }
+
+                itemHtml += '</div>';
+
+                return itemHtml;
+
+            }).join('');
+
+            html += '</div>';
+        }
+
+        var elem = context.querySelector('.subtitleList');
+
+        if (subs.length) {
+            elem.classList.remove('hide');
+        } else {
+            elem.classList.add('hide');
+        }
+        elem.innerHTML = html;
+
+        //('.btnViewSubtitles', elem).on('click', function () {
+
+        //    var index = this.getAttribute('data-index');
+
+        //    showLocalSubtitles(context, index);
+
+        //});
+    }
+
+    function fillLanguages(context, apiClient, languages) {
+
+        var selectLanguage = context.querySelector('#selectLanguage');
+
+        selectLanguage.innerHTML = languages.map(function (l) {
+
+            return '<option value="' + l.ThreeLetterISOLanguageName + '">' + l.DisplayName + '</option>';
+        });
+
+        var lastLanguage = appStorage.getItem('subtitleeditor-language');
+        if (lastLanguage) {
+            selectLanguage.value = lastLanguage;
+        }
+        else {
+
+            apiClient.getCurrentUser().then(function (user) {
+
+                var lang = user.Configuration.SubtitleLanguagePreference;
+
+                if (lang) {
+                    selectLanguage.value = lang;
+                }
+            });
+        }
+    }
+
+    function renderSearchResults(context, results) {
+
+        var lastProvider = '';
+        var html = '';
+
+        if (!results.length) {
+
+            context.querySelector('.noSearchResults').classList.remove('hide');
+            context.querySelector('.subtitleResults').innerHTML = '';
+            loading.hide();
+            return;
+        }
+
+        context.querySelector('.noSearchResults').classList.add('hide');
+
+        for (var i = 0, length = results.length; i < length; i++) {
+
+            var result = results[i];
+
+            var provider = result.ProviderName;
+
+            if (provider != lastProvider) {
+
+                if (i > 0) {
+                    html += '</div>';
+                }
+                html += '<h1>' + provider + '</h1>';
+                if (layoutManager.tv) {
+                    html += '<div>';
+                } else {
+                    html += '<div class="paperList">';
+                }
+                lastProvider = provider;
+            }
+
+            html += '<div class="listItem">';
+
+            html += '<paper-fab mini class="blue" icon="closed-caption" item-icon></paper-fab>';
+
+            html += '<div class="listItemBody">';
+
+            //html += '<a class="btnViewSubtitle" href="#" data-subid="' + result.Id + '">';
+
+            html += '<h3 class="listItemBodyText">' + (result.Name) + '</h3>';
+            html += '<div class="secondary listItemBodyText">' + (result.Format) + '</div>';
+
+            if (result.Comment) {
+                html += '<div class="secondary listItemBodyText">' + (result.Comment) + '</div>';
+            }
+
+            //html += '</a>';
+
+            html += '</div>';
+
+            html += '<div class="secondary">' + /*(result.CommunityRating || 0) + ' / ' +*/ (result.DownloadCount || 0) + '</div>';
+
+            html += '<button type="button" is="paper-icon-button-light" data-subid="' + result.Id + '" title="' + globalize.translate('ButtonDownload') + '" class="btnDownload"><iron-icon icon="cloud-download"></iron-icon></button>';
+
+            html += '</div>';
+        }
+
+        if (results.length) {
+            html += '</div>';
+        }
+
+        var elem = context.querySelector('.subtitleResults');
+        elem.innerHTML = html;
+
+        //('.btnViewSubtitle', elem).on('click', function () {
+
+        //    var id = this.getAttribute('data-subid');
+        //    showRemoteSubtitles(context, id);
+        //});
+
+        loading.hide();
+    }
+
+    function searchForSubtitles(context, language) {
+
+        appStorage.setItem('subtitleeditor-language', language);
+
+        loading.show();
+
+        var apiClient = connectionManager.getApiClient(currentItem.ServerId);
+        var url = apiClient.getUrl('Items/' + currentItem.Id + '/RemoteSearch/Subtitles/' + language);
+
+        apiClient.getJSON(url).then(function (results) {
+
+            renderSearchResults(context, results);
+        });
+    }
+
+    function reload(context, apiClient, itemId) {
+
+        context.querySelector('.noSearchResults').classList.add('hide');
+
+        function onGetItem(item) {
+            currentItem = item;
+
+            fillSubtitleList(context, item);
+            var file = item.Path || '';
+            var index = Math.max(file.lastIndexOf('/'), file.lastIndexOf('\\'));
+            if (index > -1) {
+                file = file.substring(index + 1);
+            }
+
+            if (file) {
+                context.querySelector('.pathValue').innerHTML = file;
+                context.querySelector('.originalFile').classList.remove('hide');
+            } else {
+                context.querySelector('.pathValue').innerHTML = '';
+                context.querySelector('.originalFile').classList.add('hide');
+            }
+
+            loading.hide();
+        }
+
+        if (typeof itemId == 'string') {
+            apiClient.getItem(apiClient.getCurrentUserId(), itemId).then(onGetItem);
+        }
+        else {
+            onGetItem(itemId);
+        }
+    }
+
+    function parentWithClass(elem, className) {
+
+        while (!elem.classList || !elem.classList.contains(className)) {
+            elem = elem.parentNode;
+
+            if (!elem) {
+                return null;
+            }
+        }
+
+        return elem;
+    }
+
+    function onSearchSubmit(e) {
+        var form = this;
+
+        var lang = form.querySelector('#selectLanguage', form).value;
+
+        searchForSubtitles(parentWithClass(form, 'dialogContent'), lang);
+
+        e.preventDefault();
+        return false;
+    }
+
+    function onSubtitleListClick(e) {
+
+        var btnDelete = parentWithClass(e.target, 'btnDelete');
+        if (btnDelete) {
+            var index = btnDelete.getAttribute('data-index');
+            var context = parentWithClass(btnDelete, 'subtitleEditorDialog');
+            deleteLocalSubtitle(context, index);
+        }
+    }
+
+    function onSubtitleResultsClick(e) {
+
+        var btnDownload = parentWithClass(e.target, 'btnDownload');
+        if (btnDownload) {
+            var id = btnDownload.getAttribute('data-subid');
+            var context = parentWithClass(btnDownload, 'subtitleEditorDialog');
+            downloadRemoteSubtitles(context, id);
+        }
+    }
+
+    function showEditor(itemId, serverId) {
+
+        loading.show();
+
+        require(['text!./subtitleeditor.template.html'], function (template) {
+
+            var apiClient = connectionManager.getApiClient(serverId);
+
+            apiClient.getItem(apiClient.getCurrentUserId(), itemId).then(function (item) {
+
+                var dialogOptions = {
+                    removeOnClose: true
+                };
+
+                if (layoutManager.tv) {
+                    dialogOptions.size = 'fullscreen';
+                } else {
+                    dialogOptions.size = 'small';
+                }
+
+                var dlg = dialogHelper.createDialog(dialogOptions);
+
+                dlg.classList.add('formDialog');
+                dlg.classList.add('subtitleEditorDialog');
+
+                dlg.innerHTML = globalize.translateDocument(template);
+                document.body.appendChild(dlg);
+
+                dlg.querySelector('.pathLabel').innerHTML = globalize.translate('MediaInfoFile');
+
+                dlg.querySelector('.subtitleSearchForm').addEventListener('submit', onSearchSubmit);
+
+                dialogHelper.open(dlg);
+
+                var editorContent = dlg.querySelector('.dialogContent');
+
+                dlg.querySelector('.subtitleList').addEventListener('click', onSubtitleListClick);
+                dlg.querySelector('.subtitleResults').addEventListener('click', onSubtitleResultsClick);
+
+                reload(editorContent, apiClient, item);
+
+                apiClient.getCultures().then(function (languages) {
+
+                    fillLanguages(editorContent, apiClient, languages);
+                });
+
+                dlg.querySelector('.btnCancel').addEventListener('click', function () {
+
+                    dialogHelper.close(dlg);
+                });
+            });
+        });
+    }
+
+    return {
+        show: showEditor
+    };
+});

dashboard-ui/bower_components/emby-webcomponents/subtitleeditor/subtitleeditor.template.html

@@ -0,0 +1,26 @@
+<div class="dialogHeader">
+    <button is="paper-icon-button-light" class="btnCancel" tabindex="-1"><iron-icon icon="nav:arrow-back"></iron-icon></button>
+    <div class="dialogHeaderTitle">${Subtitles}</div>
+</div>
+<div class="dialogContent smoothScrollY">
+    <div class="dialogContentInner centeredContent">
+
+        <div class="subtitleList" style="margin-bottom:2em;"></div>
+        <h1>${HeaderSearchForSubtitles}</h1>
+
+        <p style="margin: 1.5em 0;" class="originalFile"><span class="mediaInfoLabel pathLabel"></span><span class="pathValue"></span></p>
+
+        <form class="subtitleSearchForm" style="max-width:none;">
+            <div style="display: inline-block; width: 85%;">
+                <label for="selectLanguage" class="selectLabel">${LabelLanguage}</label>
+                <select autofocus id="selectLanguage" required="required" data-mini="true"></select>
+            </div>
+            <button type="submit" is="paper-icon-button-light" title="${ButtonSearch}" class="btnSearchSubtitles"><iron-icon icon="search"></iron-icon></button>
+        </form>
+        <br />
+        <div class="subtitleResults"></div>
+        <div class="noSearchResults hide">
+            ${MessageNoSubtitleSearchResultsFound}
+        </div>
+    </div>
+</div>

dashboard-ui/bower_components/polymer/.bower.json

@@ -34,6 +34,6 @@
     "commit": "11c987b2eb3c73b388a79fc8aaea8ca01624f514"
   },
   "_source": "git://github.com/Polymer/polymer.git",
-  "_target": "^1.1.0",
+  "_target": "^1.0.0",
   "_originalSource": "Polymer/polymer"
 }

dashboard-ui/components/subtitleeditor/subtitleeditor.js

@@ -1,406 +0,0 @@
-define(['dialogHelper', 'appStorage', 'jQuery', 'paper-fab', 'paper-item-body', 'paper-icon-item', 'paper-icon-button-light'], function (dialogHelper, appStorage, $) {
-
-    var currentItem;
-
-    function showLocalSubtitles(page, index) {
-
-        Dashboard.showLoadingMsg();
-
-        var popup = $('.popupSubtitleViewer', page).popup('open');
-        $('.subtitleContent', page).html('');
-
-        var url = 'Videos/' + currentItem.Id + '/Subtitles/' + index;
-
-        ApiClient.ajax({
-
-            type: 'GET',
-            url: url
-
-        }).then(function (result) {
-
-            $('.subtitleContent', page).html(result);
-
-            Dashboard.hideLoadingMsg();
-
-            popup.popup('reposition', {});
-        });
-    }
-
-    function showRemoteSubtitles(page, id) {
-
-        Dashboard.showLoadingMsg();
-
-        var popup = $('.popupSubtitleViewer', page).popup('open');
-        $('.subtitleContent', page).html('');
-
-        var url = 'Providers/Subtitles/Subtitles/' + id;
-
-        ApiClient.get(ApiClient.getUrl(url)).then(function (result) {
-
-            $('.subtitleContent', page).html(result);
-
-            Dashboard.hideLoadingMsg();
-
-            popup.popup('reposition', {});
-        });
-    }
-
-    function downloadRemoteSubtitles(page, id) {
-
-        var url = 'Items/' + currentItem.Id + '/RemoteSearch/Subtitles/' + id;
-
-        ApiClient.ajax({
-
-            type: "POST",
-            url: ApiClient.getUrl(url)
-
-        }).then(function () {
-
-            require(['toast'], function (toast) {
-                toast(Globalize.translate('MessageDownloadQueued'));
-            });
-        });
-    }
-
-    function deleteLocalSubtitle(page, index) {
-
-        var msg = Globalize.translate('MessageAreYouSureDeleteSubtitles');
-
-        require(['confirm'], function (confirm) {
-
-            confirm(msg, Globalize.translate('HeaderConfirmDeletion')).then(function () {
-
-                Dashboard.showLoadingMsg();
-
-                var itemId = currentItem.Id;
-                var url = 'Videos/' + itemId + '/Subtitles/' + index;
-
-                ApiClient.ajax({
-
-                    type: "DELETE",
-                    url: ApiClient.getUrl(url)
-
-                }).then(function () {
-
-                    reload(page, itemId);
-                });
-            });
-        });
-    }
-
-    function fillSubtitleList(page, item) {
-
-        var streams = item.MediaStreams || [];
-
-        var subs = streams.filter(function (s) {
-
-            return s.Type == 'Subtitle';
-        });
-
-        var html = '';
-
-        if (subs.length) {
-
-            html += '<h1 style="margin-top:1.5em;">' + Globalize.translate('HeaderCurrentSubtitles') + '</h1>';
-            html += '<div class="paperList">';
-
-            html += subs.map(function (s) {
-
-                var itemHtml = '';
-
-                itemHtml += '<paper-icon-item>';
-
-                itemHtml += '<paper-fab mini class="blue" icon="closed-caption" item-icon></paper-fab>';
-
-                var atts = [];
-
-                atts.push(s.Codec);
-                if (s.IsDefault) {
-
-                    atts.push('Default');
-                }
-                if (s.IsForced) {
-
-                    atts.push('Forced');
-                }
-
-                if (atts.length == 3) {
-                    itemHtml += '<paper-item-body three-line>';
-                }
-                else {
-                    itemHtml += '<paper-item-body two-line>';
-                }
-
-                itemHtml += '<div>';
-                itemHtml += (s.Language || Globalize.translate('LabelUnknownLanaguage'));
-                itemHtml += '</div>';
-
-                itemHtml += '<div secondary>' + atts.join(' - ') + '</div>';
-
-                if (s.Path) {
-                    itemHtml += '<div secondary>' + (s.Path) + '</div>';
-                }
-
-                html += '</a>';
-                itemHtml += '</paper-item-body>';
-
-                if (s.Path) {
-                    itemHtml += '<button is="paper-icon-button-light" data-index="' + s.Index + '" title="' + Globalize.translate('Delete') + '" class="btnDelete"><iron-icon icon="delete"></iron-icon></button>';
-                }
-
-                itemHtml += '</paper-icon-item>';
-
-                return itemHtml;
-
-            }).join('');
-
-            html += '</div>';
-        }
-
-        var elem = $('.subtitleList', page).html(html);
-
-        $('.btnViewSubtitles', elem).on('click', function () {
-
-            var index = this.getAttribute('data-index');
-
-            showLocalSubtitles(page, index);
-
-        });
-
-        $('.btnDelete', elem).on('click', function () {
-
-            var index = this.getAttribute('data-index');
-
-            deleteLocalSubtitle(page, index);
-
-        });
-    }
-
-    function fillLanguages(page, languages) {
-
-        $('#selectLanguage', page).html(languages.map(function (l) {
-
-            return '<option value="' + l.ThreeLetterISOLanguageName + '">' + l.DisplayName + '</option>';
-
-        }));
-
-        var lastLanguage = appStorage.getItem('subtitleeditor-language');
-        if (lastLanguage) {
-            $('#selectLanguage', page).val(lastLanguage);
-        }
-        else {
-
-            Dashboard.getCurrentUser().then(function (user) {
-
-                var lang = user.Configuration.SubtitleLanguagePreference;
-
-                if (lang) {
-                    $('#selectLanguage', page).val(lang);
-                }
-            });
-        }
-    }
-
-    function renderSearchResults(page, results) {
-
-        var lastProvider = '';
-        var html = '';
-
-        if (!results.length) {
-
-            $('.noSearchResults', page).show();
-            $('.subtitleResults', page).html('');
-            Dashboard.hideLoadingMsg();
-            return;
-        }
-
-        $('.noSearchResults', page).hide();
-
-        for (var i = 0, length = results.length; i < length; i++) {
-
-            var result = results[i];
-
-            var provider = result.ProviderName;
-
-            if (provider != lastProvider) {
-
-                if (i > 0) {
-                    html += '</div>';
-                }
-                html += '<h1>' + provider + '</h1>';
-                html += '<div class="paperList">';
-                lastProvider = provider;
-            }
-
-            html += '<paper-icon-item>';
-
-            html += '<paper-fab mini class="blue" icon="closed-caption" item-icon></paper-fab>';
-
-            if (result.Comment) {
-                html += '<paper-item-body three-line>';
-            }
-            else {
-                html += '<paper-item-body two-line>';
-            }
-
-            //html += '<a class="btnViewSubtitle" href="#" data-subid="' + result.Id + '">';
-
-            html += '<div>' + (result.Name) + '</div>';
-            html += '<div secondary>' + (result.Format) + '</div>';
-
-            if (result.Comment) {
-                html += '<div secondary>' + (result.Comment) + '</div>';
-            }
-
-            //html += '</a>';
-
-            html += '</paper-item-body>';
-
-            html += '<div style="font-size:86%;opacity:.7;">' + /*(result.CommunityRating || 0) + ' / ' +*/ (result.DownloadCount || 0) + '</div>';
-
-            html += '<button type="button" is="paper-icon-button-light" data-subid="' + result.Id + '" title="' + Globalize.translate('ButtonDownload') + '" class="btnDownload"><iron-icon icon="cloud-download"></iron-icon></button>';
-
-            html += '</paper-icon-item>';
-        }
-
-        if (results.length) {
-            html += '</div>';
-        }
-
-        var elem = $('.subtitleResults', page).html(html);
-
-        $('.btnViewSubtitle', elem).on('click', function () {
-
-            var id = this.getAttribute('data-subid');
-            showRemoteSubtitles(page, id);
-        });
-
-        $('.btnDownload', elem).on('click', function () {
-
-            var id = this.getAttribute('data-subid');
-            downloadRemoteSubtitles(page, id);
-        });
-
-        Dashboard.hideLoadingMsg();
-    }
-
-    function searchForSubtitles(page, language) {
-
-        appStorage.setItem('subtitleeditor-language', language);
-
-        Dashboard.showLoadingMsg();
-
-        var url = ApiClient.getUrl('Items/' + currentItem.Id + '/RemoteSearch/Subtitles/' + language);
-
-        ApiClient.getJSON(url).then(function (results) {
-
-            renderSearchResults(page, results);
-        });
-    }
-
-    function reload(context, itemId) {
-
-        $('.noSearchResults', context).hide();
-
-        function onGetItem(item) {
-            currentItem = item;
-
-            fillSubtitleList(context, item);
-            var file = item.Path || '';
-            var index = Math.max(file.lastIndexOf('/'), file.lastIndexOf('\\'));
-            if (index > -1) {
-                file = file.substring(index + 1);
-            }
-
-            if (file) {
-                context.querySelector('.pathValue').innerHTML = file;
-                context.querySelector('.originalFile').classList.remove('hide');
-            } else {
-                context.querySelector('.pathValue').innerHTML = '';
-                context.querySelector('.originalFile').classList.add('hide');
-            }
-
-            Dashboard.hideLoadingMsg();
-        }
-
-        if (typeof itemId == 'string') {
-            ApiClient.getItem(Dashboard.getCurrentUserId(), itemId).then(onGetItem);
-        }
-        else {
-            onGetItem(itemId);
-        }
-    }
-
-    function onSearchSubmit() {
-        var form = this;
-
-        var lang = $('#selectLanguage', form).val();
-
-        searchForSubtitles($(form).parents('.editorContent'), lang);
-
-        return false;
-    }
-
-    function showEditor(itemId) {
-
-        Dashboard.showLoadingMsg();
-
-        var xhr = new XMLHttpRequest();
-        xhr.open('GET', 'components/subtitleeditor/subtitleeditor.template.html', true);
-
-        xhr.onload = function (e) {
-
-            var template = this.response;
-            ApiClient.getItem(Dashboard.getCurrentUserId(), itemId).then(function (item) {
-
-                var dlg = dialogHelper.createDialog({
-                    size: 'small',
-                    removeOnClose: true
-                });
-
-                dlg.classList.add('ui-body-b');
-                dlg.classList.add('background-theme-b');
-
-                var html = '';
-                html += '<div class="dialogHeader" style="margin:0 0 2em;">';
-                html += '<button is="paper-icon-button-light" class="btnCancel" tabindex="-1"><iron-icon icon="arrow-back"></iron-icon></button>';
-                html += '<div class="dialogHeaderTitle">';
-                html += item.Name;
-                html += '</div>';
-                html += '</div>';
-
-                html += '<div class="editorContent">';
-                html += Globalize.translateDocument(template);
-                html += '</div>';
-
-                dlg.innerHTML = html;
-                document.body.appendChild(dlg);
-
-                dlg.querySelector('.pathLabel').innerHTML = Globalize.translate('MediaInfoFile');
-
-                $('.subtitleSearchForm', dlg).off('submit', onSearchSubmit).on('submit', onSearchSubmit);
-
-                dialogHelper.open(dlg);
-
-                var editorContent = dlg.querySelector('.editorContent');
-                reload(editorContent, item);
-
-                ApiClient.getCultures().then(function (languages) {
-
-                    fillLanguages(editorContent, languages);
-                });
-
-                $('.btnCancel', dlg).on('click', function () {
-
-                    dialogHelper.close(dlg);
-                });
-            });
-        }
-
-        xhr.send();
-    }
-
-    return {
-        show: showEditor
-    };
-});

dashboard-ui/components/subtitleeditor/subtitleeditor.template.html

@@ -1,22 +0,0 @@
-<div class="readOnlyContent" style="max-width: 800px;margin:auto;">
-    <div>
-        <div class="subtitleList"></div>
-    </div>
-    <br />
-    <h1>${HeaderSearchForSubtitles}</h1>
-
-    <p style="margin: 1.5em 0;" class="originalFile"><span class="mediaInfoLabel pathLabel"></span><span class="pathValue"></span></p>
-
-    <form class="subtitleSearchForm" style="max-width:none;">
-        <div style="display: inline-block; width: 85%;">
-            <label for="selectLanguage" class="selectLabel">${LabelLanguage}</label>
-            <select autofocus id="selectLanguage" required="required" data-mini="true"></select>
-        </div>
-        <button type="submit" is="paper-icon-button-light" title="${ButtonSearch}" class="btnSearchSubtitles"><iron-icon icon="search"></iron-icon></button>
-    </form>
-    <br />
-    <div class="subtitleResults"></div>
-    <div class="noSearchResults" style="display: none;">
-        ${MessageNoSubtitleSearchResultsFound}
-    </div>
-</div>

dashboard-ui/scripts/librarybrowser.js

@@ -804,9 +804,10 @@
 
             editSubtitles: function (itemId) {
 
-                require(['components/subtitleeditor/subtitleeditor'], function (SubtitleEditor) {
+                require(['subtitleEditor'], function (subtitleEditor) {
 
-                    SubtitleEditor.show(itemId);
+                    var serverId = ApiClient.serverInfo().Id;
+                    subtitleEditor.show(itemId, serverId);
                 });
             },
 

dashboard-ui/scripts/site.js

@@ -1789,6 +1789,7 @@ var AppInfo = {};
         define("playlistEditor", [embyWebComponentsBowerPath + "/playlisteditor/playlisteditor"], returnFirstDependency);
         define("recordingCreator", [embyWebComponentsBowerPath + "/recordingcreator/recordingcreator"], returnFirstDependency);
         define("recordingEditor", [embyWebComponentsBowerPath + "/recordingcreator/recordingeditor"], returnFirstDependency);
+        define("subtitleEditor", [embyWebComponentsBowerPath + "/subtitleeditor/subtitleeditor"], returnFirstDependency);
         define("mediaInfo", [embyWebComponentsBowerPath + "/mediainfo/mediainfo"], returnFirstDependency);
         define("backdrop", [embyWebComponentsBowerPath + "/backdrop/backdrop"], returnFirstDependency);
         define("fetchHelper", [embyWebComponentsBowerPath + "/fetchhelper"], returnFirstDependency);
@@ -1927,6 +1928,8 @@ var AppInfo = {};
         define('native-promise-only', [bowerPath + '/native-promise-only/lib/npo.src']);
         define("fingerprintjs2", [bowerPath + '/fingerprintjs2/fingerprint2'], returnFirstDependency);
         define("clearButtonStyle", ['css!' + embyWebComponentsBowerPath + '/clearbutton']);
+        define("listView", [embyWebComponentsBowerPath + "/listview/listview"], returnFirstDependency);
+        define("listViewStyle", ['css!' + embyWebComponentsBowerPath + "/listview/listview"], returnFirstDependency);
 
         if (Dashboard.isRunningInCordova()) {
             define('registrationservices', ['cordova/registrationservices'], returnFirstDependency);