From 9969385a5ebd5814f102abc8576199bc06e95470 Mon Sep 17 00:00:00 2001 From: Luke Pulverenti Date: Sun, 4 Oct 2015 12:15:08 -0400 Subject: [PATCH] rework identify popup --- .../bower_components/iron-meta/.bower.json | 6 +- .../itemidentifier/itemidentifier.js | 353 ++++++++++++++++++ .../itemidentifier.template.html | 38 ++ .../css/images/items/list/remotesearch.png | Bin 4419 -> 0 bytes dashboard-ui/edititemmetadata.html | 58 --- dashboard-ui/scripts/edititemmetadata.js | 311 +-------------- dashboard-ui/scripts/librarybrowser.js | 32 ++ dashboard-ui/strings/html/server.json | 1 - .../strings/javascript/javascript.json | 2 + 9 files changed, 437 insertions(+), 364 deletions(-) create mode 100644 dashboard-ui/components/itemidentifier/itemidentifier.js create mode 100644 dashboard-ui/components/itemidentifier/itemidentifier.template.html delete mode 100644 dashboard-ui/css/images/items/list/remotesearch.png diff --git a/dashboard-ui/bower_components/iron-meta/.bower.json b/dashboard-ui/bower_components/iron-meta/.bower.json index 9e650790be..8119ebcf41 100644 --- a/dashboard-ui/bower_components/iron-meta/.bower.json +++ b/dashboard-ui/bower_components/iron-meta/.bower.json @@ -25,14 +25,14 @@ "web-component-tester": "*", "webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0" }, - "homepage": "https://github.com/PolymerElements/iron-meta", + "homepage": "https://github.com/polymerelements/iron-meta", "_release": "1.0.3", "_resolution": { "type": "version", "tag": "v1.0.3", "commit": "91529259262b0d8f33fed44bc3fd47aedf35cb04" }, - "_source": "git://github.com/PolymerElements/iron-meta.git", + "_source": "git://github.com/polymerelements/iron-meta.git", "_target": "^1.0.0", - "_originalSource": "PolymerElements/iron-meta" + "_originalSource": "polymerelements/iron-meta" } \ No newline at end of file diff --git a/dashboard-ui/components/itemidentifier/itemidentifier.js b/dashboard-ui/components/itemidentifier/itemidentifier.js new file mode 100644 index 0000000000..90cce5f14c --- /dev/null +++ b/dashboard-ui/components/itemidentifier/itemidentifier.js @@ -0,0 +1,353 @@ +(function ($, window, document) { + + var currentItem; + var currentDeferred; + var hasChanges = false; + var currentSearchResult; + + function onIdentificationFormSubmitted() { + + var page = $(this).parents('.editorContent'); + + searchForIdentificationResults(page); + return false; + } + + function searchForIdentificationResults(page) { + + var lookupInfo = { + ProviderIds: {} + }; + + $('.identifyField', page).each(function () { + + var value = this.value; + + if (value) { + + if (this.type == 'number') { + value = parseInt(value); + } + + lookupInfo[this.getAttribute('data-lookup')] = value; + } + + }); + + var hasId = false; + + $('.txtLookupId', page).each(function () { + + var value = this.value; + + if (value) { + hasId = true; + } + lookupInfo.ProviderIds[this.getAttribute('data-providerkey')] = value; + + }); + + if (!hasId && !lookupInfo.Name) { + Dashboard.alert(Globalize.translate('MessagePleaseEnterNameOrId')); + return; + } + + if (currentItem.GameSystem) { + lookupInfo.GameSystem = currentItem.GameSystem; + } + + lookupInfo = { + SearchInfo: lookupInfo, + IncludeDisabledProviders: true + }; + + Dashboard.showLoadingMsg(); + + ApiClient.ajax({ + type: "POST", + url: ApiClient.getUrl("Items/RemoteSearch/" + currentItem.Type), + data: JSON.stringify(lookupInfo), + contentType: "application/json" + + }).done(function (results) { + + Dashboard.hideLoadingMsg(); + showIdentificationSearchResults(page, results); + }); + } + + function showIdentificationSearchResults(page, results) { + + $('.popupIdentifyForm', page).hide(); + $('.identificationSearchResults', page).show(); + $('.identifyOptionsForm', page).hide(); + $('.btnIdentifyBack', page).show(); + + var html = ''; + + for (var i = 0, length = results.length; i < length; i++) { + + var result = results[i]; + + html += getSearchResultHtml(result, i); + } + + var elem = $('.identificationSearchResultList', page).html(html).trigger('create'); + + $('.searchImage', elem).on('click', function () { + + var index = parseInt(this.getAttribute('data-index')); + + var currentResult = results[index]; + + showIdentifyOptions(page, currentResult); + }); + } + + function showIdentifyOptions(page, identifyResult) { + + $('.popupIdentifyForm', page).hide(); + $('.identificationSearchResults', page).hide(); + $('.identifyOptionsForm', page).show(); + $('.btnIdentifyBack', page).show(); + $('#chkIdentifyReplaceImages', page).checked(true); + + currentSearchResult = identifyResult; + + var lines = []; + lines.push(identifyResult.Name); + + if (identifyResult.ProductionYear) { + lines.push(identifyResult.ProductionYear); + } + + if (identifyResult.GameSystem) { + lines.push(identifyResult.GameSystem); + } + + var resultHtml = lines.join('
'); + + if (identifyResult.ImageUrl) { + var displayUrl = getSearchImageDisplayUrl(identifyResult.ImageUrl, identifyResult.SearchProviderName); + + resultHtml = '
' + resultHtml; + } + + $('.selectedSearchResult', page).html(resultHtml); + } + + function getSearchResultHtml(result, index) { + + var html = ''; + var cssClass = "card"; + + if (currentItem.Type == "Episode") { + cssClass += " backdropCard"; + } + else if (currentItem.Type == "MusicAlbum" || currentItem.Type == "MusicArtist") { + cssClass += " squareCard"; + } + else { + cssClass += " portraitCard"; + } + + html += '
'; + html += '
'; + html += '
'; + + html += ''; + + if (result.ImageUrl) { + var displayUrl = getSearchImageDisplayUrl(result.ImageUrl, result.SearchProviderName); + + html += '
'; + } else { + + html += '
'; + } + html += ''; + html += '
'; + + html += '
'; + html += '
' + result.Name + '
'; + + html += '
'; + html += result.ProductionYear || ' '; + html += '
'; + + if (result.GameSystem) { + html += '
'; + html += result.GameSystem; + html += '
'; + } + html += '
'; + + html += '
'; + return html; + } + + function getSearchImageDisplayUrl(url, provider) { + return ApiClient.getUrl("Items/RemoteSearch/Image", { imageUrl: url, ProviderName: provider }); + } + + function onIdentificationOptionsSubmit() { + + var page = $(this).parents('.editorContent'); + + submitIdentficationResult(page); + return false; + } + + function submitIdentficationResult(page) { + + Dashboard.showLoadingMsg(); + + var options = { + ReplaceAllImages: $('#chkIdentifyReplaceImages', page).checked() + }; + + ApiClient.ajax({ + type: "POST", + url: ApiClient.getUrl("Items/RemoteSearch/Apply/" + currentItem.Id, options), + data: JSON.stringify(currentSearchResult), + contentType: "application/json" + + }).done(function () { + + hasChanges = true; + Dashboard.hideLoadingMsg(); + + PaperDialogHelper.close(document.querySelector('.identifyDialog')); + + }).fail(function () { + + Dashboard.hideLoadingMsg(); + + PaperDialogHelper.close(document.querySelector('.identifyDialog')); + }); + } + + function initEditor(page) { + + $('.popupIdentifyForm', page).off('submit', onIdentificationFormSubmitted).on('submit', onIdentificationFormSubmitted); + $('.identifyOptionsForm', page).off('submit', onIdentificationOptionsSubmit).on('submit', onIdentificationOptionsSubmit); + } + + function showIdentificationForm(page, item) { + + ApiClient.getJSON(ApiClient.getUrl("Items/" + item.Id + "/ExternalIdInfos")).done(function (idList) { + + var html = ''; + + var providerIds = item.ProviderIds || {}; + + for (var i = 0, length = idList.length; i < length; i++) { + + var idInfo = idList[i]; + + var id = "txtLookup" + idInfo.Key; + + html += '
'; + + var idLabel = Globalize.translate('LabelDynamicExternalId').replace('{0}', idInfo.Name); + + var value = providerIds[idInfo.Key] || ''; + + html += ''; + + html += '
'; + } + + $('#txtLookupName', page).val(item.Name); + + if (item.Type == "Person" || item.Type == "BoxSet") { + + $('.fldLookupYear', page).hide(); + $('#txtLookupYear', page).val(''); + } else { + + $('.fldLookupYear', page).show(); + $('#txtLookupYear', page).val(item.ProductionYear); + } + + $('.identifyProviderIds', page).html(html).trigger('create'); + + $('.identificationHeader', page).html(Globalize.translate('HeaderIdentify')); + }); + } + + function showEditor(itemId) { + + Dashboard.showLoadingMsg(); + + ApiClient.ajax({ + + type: 'GET', + url: 'components/itemidentifier/itemidentifier.template.html' + + }).done(function (template) { + + ApiClient.getItem(Dashboard.getCurrentUserId(), itemId).done(function (item) { + + currentItem = item; + + var dlg = PaperDialogHelper.createDialog(); + + var html = ''; + html += '

'; + html += ''; + html += '
' + Globalize.translate('HeaderIdentifyItem') + '
'; + html += '

'; + + html += '
'; + html += Globalize.translateDocument(template); + html += '
'; + + dlg.innerHTML = html; + document.body.appendChild(dlg); + + // Has to be assigned a z-index after the call to .open() + $(dlg).on('iron-overlay-closed', onDialogClosed); + + PaperDialogHelper.openWithHash(dlg, 'itemidentifier'); + + var editorContent = dlg.querySelector('.editorContent'); + initEditor(editorContent); + + $('.btnCloseDialog', dlg).on('click', function () { + + PaperDialogHelper.close(dlg); + }); + + dlg.classList.add('identifyDialog'); + + showIdentificationForm(dlg, item); + Dashboard.hideLoadingMsg(); + }); + }); + } + + function onDialogClosed() { + + $(this).remove(); + Dashboard.hideLoadingMsg(); + currentDeferred.resolveWith(null, [hasChanges]); + } + + window.ItemIdentifier = { + show: function (itemId) { + + var deferred = DeferredBuilder.Deferred(); + + currentDeferred = deferred; + hasChanges = false; + + require(['components/paperdialoghelper'], function () { + + showEditor(itemId); + }); + return deferred.promise(); + } + }; + +})(jQuery, window, document); \ No newline at end of file diff --git a/dashboard-ui/components/itemidentifier/itemidentifier.template.html b/dashboard-ui/components/itemidentifier/itemidentifier.template.html new file mode 100644 index 0000000000..4e8ad52c79 --- /dev/null +++ b/dashboard-ui/components/itemidentifier/itemidentifier.template.html @@ -0,0 +1,38 @@ +
+ +

${HeaderIdentifyItemHelp}

+ +
+ +
+
+ +
+ +
+
+ +

+ +

+
+ + + diff --git a/dashboard-ui/css/images/items/list/remotesearch.png b/dashboard-ui/css/images/items/list/remotesearch.png deleted file mode 100644 index 979ba2e8e78fcb0232d9243b332d4c20c37608d7..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 4419 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 E1NpT?`v3p{ diff --git a/dashboard-ui/edititemmetadata.html b/dashboard-ui/edititemmetadata.html index 736b32d655..82783a368b 100644 --- a/dashboard-ui/edititemmetadata.html +++ b/dashboard-ui/edititemmetadata.html @@ -334,64 +334,6 @@ -
- -
- - - -

${HeaderIdentifyItem}

-
- -
- -
- -

${HeaderIdentifyItemHelp}

- -
- - -
-
- - -
- -
-
- -

- - ${ButtonCancel} -

-
- -
- -
-
- -
- -

${HeaderIdentificationResult}

-
-

${HeaderOptions}

-
- - -
-
- - ${ButtonCancel} -
-
- -