continue jquery removal

dashboard-ui/components/itemidentifier/itemidentifier.js

@@ -1,4 +1,4 @@
-define(['dialogHelper', 'loading', 'jQuery', 'emby-input', 'emby-checkbox', 'paper-icon-button-light'], function (dialogHelper, loading, $) {
+define(['dialogHelper', 'loading', 'emby-input', 'emby-checkbox', 'paper-icon-button-light'], function (dialogHelper, loading) {
 
     var currentItem;
     var currentItemType;
@@ -13,33 +13,34 @@
             ProviderIds: {}
         };
 
-        $('.identifyField', page).each(function () {
+        var i, length;
+        var identifyField = page.querySelectorAll('.identifyField');
+        for (i = 0, length = identifyField.length; i < length; i++) {
 
-            var value = this.value;
+            var value = identifyField[i].value;
 
             if (value) {
 
-                if (this.type == 'number') {
+                if (identifyField[i].type == 'number') {
                     value = parseInt(value);
                 }
 
-                lookupInfo[this.getAttribute('data-lookup')] = value;
+                lookupInfo[identifyField[i].getAttribute('data-lookup')] = value;
             }
-
+        }
-        });
 
         var hasId = false;
 
-        $('.txtLookupId', page).each(function () {
+        var txtLookupId = page.querySelectorAll('.txtLookupId');
+        for (i = 0, length = identifyField.length; i < length; i++) {
 
-            var value = this.value;
+            var value = txtLookupId[i].value;
 
             if (value) {
                 hasId = true;
             }
-            lookupInfo.ProviderIds[this.getAttribute('data-providerkey')] = value;
+            lookupInfo.ProviderIds[txtLookupId[i].getAttribute('data-providerkey')] = value;
-
+        }
-        });
 
         if (!hasId && !lookupInfo.Name) {
             require(['toast'], function (toast) {
@@ -75,23 +76,22 @@
 
     function showIdentificationSearchResults(page, results) {
 
-        $('.popupIdentifyForm', page).hide();
+        page.querySelector('.popupIdentifyForm').classList.add('hide');
-        $('.identificationSearchResults', page).show();
+        page.querySelector('.identificationSearchResults').classList.remove('hide');
-        $('.identifyOptionsForm', page).hide();
+        page.querySelector('.identifyOptionsForm').classList.add('hide');
-        $('.btnIdentifyBack', page).show();
 
         var html = '';
-
+        var i, length;
-        for (var i = 0, length = results.length; i < length; i++) {
+        for (i = 0, length = results.length; i < length; i++) {
 
             var result = results[i];
             html += getSearchResultHtml(result, i);
         }
 
-        var elem = $('.identificationSearchResultList', page).html(html);
+        var elem = page.querySelector('.identificationSearchResultList');
-
+        elem.innerHTML = html;
-        $('.searchImage', elem).on('click', function () {
 
+        function onSearchImageClick() {
             var index = parseInt(this.getAttribute('data-index'));
 
             var currentResult = results[index];
@@ -103,7 +103,13 @@
 
                 finishFindNewDialog(page, currentResult);
             }
-        });
+        }
+
+        var searchImages = elem.querySelectorAll('.searchImage');
+        for (i = 0, length = searchImages.length; i < length; i++) {
+
+            searchImages[i].addEventListener('click', onSearchImageClick);
+        }
     }
 
     function finishFindNewDialog(dlg, identifyResult) {
@@ -116,11 +122,10 @@
 
     function showIdentifyOptions(page, identifyResult) {
 
-        $('.popupIdentifyForm', page).hide();
+        page.querySelector('.popupIdentifyForm').classList.add('hide');
-        $('.identificationSearchResults', page).hide();
+        page.querySelector('.identificationSearchResults').classList.add('hide');
-        $('.identifyOptionsForm', page).show();
+        page.querySelector('.identifyOptionsForm').classList.remove('hide');
-        $('.btnIdentifyBack', page).show();
+        page.querySelector('#chkIdentifyReplaceImages').checked = true;
-        $('#chkIdentifyReplaceImages', page).checked(true);
 
         currentSearchResult = identifyResult;
 
@@ -143,7 +148,7 @@
             resultHtml = '<img src="' + displayUrl + '" style="max-height:160px;" /><br/>' + resultHtml;
         }
 
-        $('.selectedSearchResult', page).html(resultHtml);
+        page.querySelector('.selectedSearchResult').innerHTML = resultHtml;
     }
 
     function getSearchResultHtml(result, index) {
@@ -206,7 +211,7 @@
         loading.show();
 
         var options = {
-            ReplaceAllImages: $('#chkIdentifyReplaceImages', page).checked()
+            ReplaceAllImages: page.querySelector('#chkIdentifyReplaceImages').checked
         };
 
         ApiClient.ajax({
@@ -255,19 +260,19 @@
                 html += '</div>';
             }
 
-            $('#txtLookupName', page).val('');
+            page.querySelector('#txtLookupName').value = '';
 
             if (item.Type == "Person" || item.Type == "BoxSet") {
 
-                $('.fldLookupYear', page).hide();
+                page.querySelector('.fldLookupYear').classList.add('hide');
-                $('#txtLookupYear', page).val('');
+                page.querySelector('#txtLookupYear').value = '';
             } else {
 
-                $('.fldLookupYear', page).show();
+                page.querySelector('.fldLookupYear').classList.remove('hide');
-                $('#txtLookupYear', page).val('');
+                page.querySelector('#txtLookupYear').value = '';
             }
 
-            $('.identifyProviderIds', page).html(html);
+            page.querySelector('.identifyProviderIds').innerHTML = html;
 
             page.querySelector('.dialogHeaderTitle').innerHTML = Globalize.translate('HeaderIdentify');
         });
@@ -303,7 +308,7 @@
                 document.body.appendChild(dlg);
 
                 // Has to be assigned a z-index after the call to .open() 
-                $(dlg).on('close', onDialogClosed);
+                dlg.addEventListener('close', onDialogClosed);
 
                 dialogHelper.open(dlg);
 
@@ -321,7 +326,7 @@
                     return false;
                 });
 
-                $('.btnCancel', dlg).on('click', function () {
+                dlg.querySelector('.btnCancel').addEventListener('click', function (e) {
 
                     dialogHelper.close(dlg);
                 });

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

@@ -26,12 +26,12 @@
         </button>
     </p>
 </form>
-<div class="identificationSearchResults" style="display:none; text-align: center;">
+<div class="identificationSearchResults hide" style="text-align: center;">
 
     <div class="identificationSearchResultList"></div>
 </div>
 
-<form class="identifyOptionsForm" style="display:none;margin:auto;">
+<form class="identifyOptionsForm hide" style="margin:auto;">
 
     <div class="selectedSearchResult"></div>
     <br />