From 8fb207e4ca027ef4df27094fa35aeb949dc26661 Mon Sep 17 00:00:00 2001 From: Luke Pulverenti Date: Tue, 30 Aug 2016 14:13:41 -0400 Subject: [PATCH] update image editor --- .../emby-webcomponents/.bower.json | 8 +-- .../emby-checkbox/emby-checkbox.css | 2 +- .../emby-input/emby-input.css | 2 +- .../emby-select/emby-select.css | 2 +- .../emby-textarea/emby-textarea.css | 2 +- .../emby-webcomponents/formdialog.css | 8 +++ .../imageeditor/imageeditor.js | 67 ++++++++++++++----- .../imageeditor/imageeditor.template.html | 18 +++-- .../bower_components/polymer/.bower.json | 6 +- 9 files changed, 82 insertions(+), 33 deletions(-) diff --git a/dashboard-ui/bower_components/emby-webcomponents/.bower.json b/dashboard-ui/bower_components/emby-webcomponents/.bower.json index 5ad60a444..b0954db32 100644 --- a/dashboard-ui/bower_components/emby-webcomponents/.bower.json +++ b/dashboard-ui/bower_components/emby-webcomponents/.bower.json @@ -14,12 +14,12 @@ }, "devDependencies": {}, "ignore": [], - "version": "1.4.206", - "_release": "1.4.206", + "version": "1.4.207", + "_release": "1.4.207", "_resolution": { "type": "version", - "tag": "1.4.206", - "commit": "3f48458370184be23fcd9dd588f86109d0a5f5ba" + "tag": "1.4.207", + "commit": "823ec6a2a31d712f1de9fb82f10e221c857c6650" }, "_source": "https://github.com/MediaBrowser/emby-webcomponents.git", "_target": "^1.2.1", diff --git a/dashboard-ui/bower_components/emby-webcomponents/emby-checkbox/emby-checkbox.css b/dashboard-ui/bower_components/emby-webcomponents/emby-checkbox/emby-checkbox.css index e0126e412..c244851f5 100644 --- a/dashboard-ui/bower_components/emby-webcomponents/emby-checkbox/emby-checkbox.css +++ b/dashboard-ui/bower_components/emby-webcomponents/emby-checkbox/emby-checkbox.css @@ -17,7 +17,7 @@ } .checkboxContainer { - margin-bottom: 2em; + margin-bottom: 1.8em; display: flex; } diff --git a/dashboard-ui/bower_components/emby-webcomponents/emby-input/emby-input.css b/dashboard-ui/bower_components/emby-webcomponents/emby-input/emby-input.css index 5de2c6637..b2c653806 100644 --- a/dashboard-ui/bower_components/emby-webcomponents/emby-input/emby-input.css +++ b/dashboard-ui/bower_components/emby-webcomponents/emby-input/emby-input.css @@ -24,7 +24,7 @@ } .inputContainer { - margin-bottom: 2em; + margin-bottom: 1.8em; } .inputLabel { diff --git a/dashboard-ui/bower_components/emby-webcomponents/emby-select/emby-select.css b/dashboard-ui/bower_components/emby-webcomponents/emby-select/emby-select.css index 2ce005392..266fc90bb 100644 --- a/dashboard-ui/bower_components/emby-webcomponents/emby-select/emby-select.css +++ b/dashboard-ui/bower_components/emby-webcomponents/emby-select/emby-select.css @@ -30,7 +30,7 @@ } .selectContainer { - margin-bottom: 2em; + margin-bottom: 1.8em; position: relative; } diff --git a/dashboard-ui/bower_components/emby-webcomponents/emby-textarea/emby-textarea.css b/dashboard-ui/bower_components/emby-webcomponents/emby-textarea/emby-textarea.css index 1fca1f59c..e6785a870 100644 --- a/dashboard-ui/bower_components/emby-webcomponents/emby-textarea/emby-textarea.css +++ b/dashboard-ui/bower_components/emby-webcomponents/emby-textarea/emby-textarea.css @@ -25,7 +25,7 @@ } .inputContainer { - margin-bottom: 2em; + margin-bottom: 1.8em; } .textareaLabel { diff --git a/dashboard-ui/bower_components/emby-webcomponents/formdialog.css b/dashboard-ui/bower_components/emby-webcomponents/formdialog.css index bc437f595..5945e385d 100644 --- a/dashboard-ui/bower_components/emby-webcomponents/formdialog.css +++ b/dashboard-ui/bower_components/emby-webcomponents/formdialog.css @@ -31,3 +31,11 @@ .dialogContentTitle { margin-top: 1em; } + +@media all and (min-width: 1280px) { + + .dialogContentInner { + padding-left: 2em; + padding-right: 2em; + } +} diff --git a/dashboard-ui/bower_components/emby-webcomponents/imageeditor/imageeditor.js b/dashboard-ui/bower_components/emby-webcomponents/imageeditor/imageeditor.js index 79d7030cb..155804d68 100644 --- a/dashboard-ui/bower_components/emby-webcomponents/imageeditor/imageeditor.js +++ b/dashboard-ui/bower_components/emby-webcomponents/imageeditor/imageeditor.js @@ -1,4 +1,4 @@ -define(['dialogHelper', 'connectionManager', 'loading', 'dom', 'layoutManager', 'globalize', 'scrollHelper', 'imageLoader', 'require', 'cardStyle', 'formDialogStyle', 'emby-button', 'paper-icon-button-light'], function (dialogHelper, connectionManager, loading, dom, layoutManager, globalize, scrollHelper, imageLoader, require) { +define(['dialogHelper', 'connectionManager', 'loading', 'dom', 'layoutManager', 'focusManager', 'globalize', 'scrollHelper', 'imageLoader', 'require', 'cardStyle', 'formDialogStyle', 'emby-button', 'paper-icon-button-light'], function (dialogHelper, connectionManager, loading, dom, layoutManager, focusManager, globalize, scrollHelper, imageLoader, require) { var currentItem; var hasChanges = false; @@ -12,7 +12,7 @@ return options; } - function reload(page, item) { + function reload(page, item, focusContext) { loading.show(); @@ -20,13 +20,13 @@ if (item) { apiClient = connectionManager.getApiClient(item.ServerId); - reloadItem(page, item, apiClient); + reloadItem(page, item, apiClient, focusContext); } else { apiClient = connectionManager.getApiClient(currentItem.ServerId); apiClient.getItem(apiClient.getCurrentUserId(), currentItem.Id).then(function (item) { - reloadItem(page, item, apiClient); + reloadItem(page, item, apiClient, focusContext); }); } } @@ -41,7 +41,7 @@ }); } - function reloadItem(page, item, apiClient) { + function reloadItem(page, item, apiClient, focusContext) { currentItem = item; @@ -64,6 +64,10 @@ renderBackdrops(page, apiClient, item, imageInfos, providers); renderScreenshots(page, apiClient, item, imageInfos, providers); loading.hide(); + + if (layoutManager.tv) { + focusManager.autoFocus((focusContext || page)); + } }); }); } @@ -88,11 +92,11 @@ return apiClient.getScaledImageUrl(item.Id || item.ItemId, options); } - function getCardHtml(image, index, apiClient, imageProviders, imageSize, tagName, enableFooterButtons) { + function getCardHtml(image, index, numImages, apiClient, imageProviders, imageSize, tagName, enableFooterButtons) { var html = ''; - var cssClass = "card scalableCard"; + var cssClass = "card scalableCard imageEditorCard"; var cardBoxCssClass = 'cardBox visualCardBox'; cssClass += " backdropCard backdropCard-scalable"; @@ -106,7 +110,7 @@ html += '
chevron_left'; } - if (index < length - 1) { + if (index < numImages - 1) { html += ''; } else { html += ''; @@ -192,6 +196,15 @@ }); } + function moveImage(context, apiClient, itemId, type, index, newIndex, focusContext) { + + apiClient.updateItemImageIndex(itemId, type, index, newIndex).then(function () { + + hasChanges = true; + reload(context, null, focusContext); + }); + } + function renderImages(page, item, apiClient, images, imageProviders, elem) { var html = ''; @@ -209,7 +222,7 @@ var image = images[i]; - html += getCardHtml(image, i, apiClient, imageProviders, imageSize, tagName, enableFooterButtons); + html += getCardHtml(image, i, length, apiClient, imageProviders, imageSize, tagName, enableFooterButtons); } elem.innerHTML = html; @@ -229,14 +242,9 @@ addListeners(elem, 'btnMoveImage', 'click', function () { var type = this.getAttribute('data-imagetype'); - var index = parseInt(this.getAttribute('data-index')); - var newIndex = parseInt(this.getAttribute('data-newindex')); - apiClient.updateItemImageIndex(currentItem.Id, type, index, newIndex).then(function () { - - hasChanges = true; - reload(page); - - }); + var index = this.getAttribute('data-index'); + var newIndex = this.getAttribute('data-newindex'); + moveImage(page, apiClient, currentItem.Id, type, index, newIndex, dom.parentWithClass(this, 'itemsContainer')); }); } @@ -303,6 +311,7 @@ var type = imageCard.getAttribute('data-imagetype'); var index = parseInt(imageCard.getAttribute('data-index')); var providerCount = parseInt(imageCard.getAttribute('data-providers')); + var numImages = parseInt(imageCard.getAttribute('data-numimages')); require(['actionsheet'], function (actionSheet) { @@ -313,6 +322,22 @@ id: 'delete' }); + if (type == 'Backdrop' || type == 'Screenshot') { + if (index > 0) { + commands.push({ + name: globalize.translate('sharedcomponents#MoveLeft'), + id: 'moveleft' + }); + } + + if (index < numImages - 1) { + commands.push({ + name: globalize.translate('sharedcomponents#MoveRight'), + id: 'moveright' + }); + } + } + if (providerCount) { commands.push({ name: globalize.translate('sharedcomponents#Search'), @@ -335,6 +360,12 @@ case 'search': showImageDownloader(context, type); break; + case 'moveleft': + moveImage(context, apiClient, itemId, type, index, index - 1, dom.parentWithClass(imageCard, 'itemsContainer')); + break; + case 'moveright': + moveImage(context, apiClient, itemId, type, index, index + 1, dom.parentWithClass(imageCard, 'itemsContainer')); + break; default: break; } diff --git a/dashboard-ui/bower_components/emby-webcomponents/imageeditor/imageeditor.template.html b/dashboard-ui/bower_components/emby-webcomponents/imageeditor/imageeditor.template.html index df4712036..0a7378148 100644 --- a/dashboard-ui/bower_components/emby-webcomponents/imageeditor/imageeditor.template.html +++ b/dashboard-ui/bower_components/emby-webcomponents/imageeditor/imageeditor.template.html @@ -1,4 +1,14 @@ -
+ + + +
${HeaderEditImages} @@ -9,7 +19,7 @@
-
+

${Images}

-
+

${Backdrops}

-
+

${Screenshots}