From baa3797fa0b7a6c7b89f15a99febfe9bd02adaa9 Mon Sep 17 00:00:00 2001
From: viown <48097677+viown@users.noreply.github.com>
Date: Wed, 20 Nov 2024 20:22:50 +0300
Subject: [PATCH 1/8] Remove usage of val

---
 .eslintrc.js                                  |  6 ++--
 .../mediaLibraryCreator.js                    |  6 ++--
 src/components/tvproviders/schedulesdirect.js | 10 +++----
 src/controllers/dashboard/encodingsettings.js | 28 +++++++++----------
 src/controllers/dashboard/general.js          | 20 ++++++-------
 src/controllers/dashboard/librarydisplay.js   |  2 +-
 src/controllers/dashboard/metadatanfo.js      |  4 +--
 src/controllers/dashboard/playback.js         | 20 ++++++-------
 .../dashboard/scheduledtasks/scheduledtask.js | 16 +++++------
 src/controllers/dashboard/streaming.js        |  4 +--
 src/controllers/livetvsettings.js             | 24 ++++++++--------
 src/controllers/livetvstatus.js               |  4 +--
 src/controllers/wizard/start/index.js         |  2 +-
 13 files changed, 74 insertions(+), 72 deletions(-)

diff --git a/.eslintrc.js b/.eslintrc.js
index 1712568ac21..0d8c09d6126 100644
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -8,7 +8,8 @@ module.exports = {
         '@typescript-eslint',
         'react',
         'import',
-        'sonarjs'
+        'sonarjs',
+        'jquery'
     ],
     env: {
         node: true,
@@ -99,7 +100,8 @@ module.exports = {
         '@stylistic/quotes': ['error', 'single', { 'avoidEscape': true, 'allowTemplateLiterals': false }],
         '@stylistic/semi': ['error'],
         '@stylistic/space-before-blocks': ['error'],
-        '@stylistic/space-infix-ops': ['error']
+        '@stylistic/space-infix-ops': ['error'],
+        'jquery/no-val': ['error']
     },
     settings: {
         react: {
diff --git a/src/components/mediaLibraryCreator/mediaLibraryCreator.js b/src/components/mediaLibraryCreator/mediaLibraryCreator.js
index 67988d89b20..1480dabe5e3 100644
--- a/src/components/mediaLibraryCreator/mediaLibraryCreator.js
+++ b/src/components/mediaLibraryCreator/mediaLibraryCreator.js
@@ -43,8 +43,8 @@ function onAddLibrary(e) {
     isCreating = true;
     loading.show();
     const dlg = dom.parentWithClass(this, 'dlg-librarycreator');
-    const name = $('#txtValue', dlg).val();
-    let type = $('#selectCollectionType', dlg).val();
+    const name = dlg.querySelector('#txtValue').value;
+    let type = dlg.querySelector('#selectCollectionType').value;
 
     if (type == 'mixed') {
         type = null;
@@ -90,7 +90,7 @@ function initEditor(page, collectionTypeOptions) {
                 const name = this.options[index].innerHTML
                     .replaceAll('*', '')
                     .replaceAll('&amp;', '&');
-                $('#txtValue', dlg).val(name);
+                dlg.querySelector('#txtValue').value = name;
             }
         }
 
diff --git a/src/components/tvproviders/schedulesdirect.js b/src/components/tvproviders/schedulesdirect.js
index ec1c6e86edb..9ebea75dc3c 100644
--- a/src/components/tvproviders/schedulesdirect.js
+++ b/src/components/tvproviders/schedulesdirect.js
@@ -57,7 +57,7 @@ export default function (page, providerId, options) {
                 return i.Id === providerId;
             })[0] || {};
             listingsId = info.ListingsId;
-            $('#selectListing', page).val(info.ListingsId || '');
+            page.querySelector('#selectListing').value = info.ListingsId || '';
             page.querySelector('.txtUser').value = info.Username || '';
             page.querySelector('.txtPass').value = '';
             page.querySelector('.txtZipCode').value = info.ZipCode || '';
@@ -157,7 +157,7 @@ export default function (page, providerId, options) {
     }
 
     function submitListingsForm() {
-        const selectedListingsId = $('#selectListing', page).val();
+        const selectedListingsId = page.querySelector('#selectListing').value;
 
         if (!selectedListingsId) {
             Dashboard.alert({
@@ -173,7 +173,7 @@ export default function (page, providerId, options) {
                 return i.Id === id;
             })[0];
             info.ZipCode = page.querySelector('.txtZipCode').value;
-            info.Country = $('#selectCountry', page).val();
+            info.Country = page.querySelector('#selectCountry').value;
             info.ListingsId = selectedListingsId;
             info.EnableAllTuners = page.querySelector('.chkAllTuners').checked;
             info.EnabledTuners = info.EnableAllTuners ? [] : $('.chkTuner', page).get().filter(function (i) {
@@ -217,7 +217,7 @@ export default function (page, providerId, options) {
             url: ApiClient.getUrl('LiveTv/ListingProviders/Lineups', {
                 Id: providerId,
                 Location: value,
-                Country: $('#selectCountry', page).val()
+                Country: page.querySelector('#selectCountry').value
             }),
             dataType: 'json'
         }).then(function (result) {
@@ -226,7 +226,7 @@ export default function (page, providerId, options) {
             }));
 
             if (listingsId) {
-                $('#selectListing', page).val(listingsId);
+                page.querySelector('#selectListing').value = listingsId;
             }
 
             loading.hide();
diff --git a/src/controllers/dashboard/encodingsettings.js b/src/controllers/dashboard/encodingsettings.js
index 6552c90fb05..04598306763 100644
--- a/src/controllers/dashboard/encodingsettings.js
+++ b/src/controllers/dashboard/encodingsettings.js
@@ -20,17 +20,17 @@ function loadPage(page, config, systemInfo) {
     page.querySelector('#chkHardwareEncoding').checked = config.EnableHardwareEncoding;
     page.querySelector('#chkAllowHevcEncoding').checked = config.AllowHevcEncoding;
     page.querySelector('#chkAllowAv1Encoding').checked = config.AllowAv1Encoding;
-    $('#selectVideoDecoder', page).val(config.HardwareAccelerationType || 'none');
-    $('#selectThreadCount', page).val(config.EncodingThreadCount);
+    page.querySelector('#selectVideoDecoder').value = config.HardwareAccelerationType || 'none';
+    page.querySelector('#selectThreadCount').value = config.EncodingThreadCount;
     page.querySelector('#chkEnableAudioVbr').checked = config.EnableAudioVbr;
-    $('#txtDownMixAudioBoost', page).val(config.DownMixAudioBoost);
-    $('#selectStereoDownmixAlgorithm').val(config.DownMixStereoAlgorithm || 'None');
+    page.querySelector('#txtDownMixAudioBoost').value = config.DownMixAudioBoost;
+    page.querySelector('#selectStereoDownmixAlgorithm').value = config.DownMixStereoAlgorithm || 'None';
     page.querySelector('#txtMaxMuxingQueueSize').value = config.MaxMuxingQueueSize || '';
     page.querySelector('.txtEncoderPath').value = config.EncoderAppPathDisplay || '';
-    $('#txtTranscodingTempPath', page).val(systemInfo.TranscodingTempPath || '');
+    page.querySelector('#txtTranscodingTempPath').value = systemInfo.TranscodingTempPath || '';
     page.querySelector('#txtFallbackFontPath').value = config.FallbackFontPath || '';
     page.querySelector('#chkEnableFallbackFont').checked = config.EnableFallbackFont;
-    $('#txtVaapiDevice', page).val(config.VaapiDevice || '');
+    page.querySelector('#txtVaapiDevice').value = config.VaapiDevice || '';
     page.querySelector('#txtQsvDevice').value = config.QsvDevice || '';
     page.querySelector('#chkTonemapping').checked = config.EnableTonemapping;
     page.querySelector('#chkVppTonemapping').checked = config.EnableVppTonemapping;
@@ -85,15 +85,15 @@ function onSubmit() {
         loading.show();
         ApiClient.getNamedConfiguration('encoding').then(function (config) {
             config.EnableAudioVbr = form.querySelector('#chkEnableAudioVbr').checked;
-            config.DownMixAudioBoost = $('#txtDownMixAudioBoost', form).val();
-            config.DownMixStereoAlgorithm = $('#selectStereoDownmixAlgorithm', form).val() || 'None';
+            config.DownMixAudioBoost = form.querySelector('#txtDownMixAudioBoost').value;
+            config.DownMixStereoAlgorithm = form.querySelector('#selectStereoDownmixAlgorithm').value || 'None';
             config.MaxMuxingQueueSize = form.querySelector('#txtMaxMuxingQueueSize').value;
-            config.TranscodingTempPath = $('#txtTranscodingTempPath', form).val();
+            config.TranscodingTempPath = form.querySelector('#txtTranscodingTempPath').value;
             config.FallbackFontPath = form.querySelector('#txtFallbackFontPath').value;
             config.EnableFallbackFont = form.querySelector('#txtFallbackFontPath').value ? form.querySelector('#chkEnableFallbackFont').checked : false;
-            config.EncodingThreadCount = $('#selectThreadCount', form).val();
-            config.HardwareAccelerationType = $('#selectVideoDecoder', form).val();
-            config.VaapiDevice = $('#txtVaapiDevice', form).val();
+            config.EncodingThreadCount = form.querySelector('#selectThreadCount').value;
+            config.HardwareAccelerationType = form.querySelector('#selectVideoDecoder').value;
+            config.VaapiDevice = form.querySelector('#txtVaapiDevice').value;
             config.QsvDevice = form.querySelector('#txtQsvDevice').value;
             config.EnableTonemapping = form.querySelector('#chkTonemapping').checked;
             config.EnableVppTonemapping = form.querySelector('#chkVppTonemapping').checked;
@@ -141,7 +141,7 @@ function onSubmit() {
         });
     };
 
-    if ($('#selectVideoDecoder', form).val() !== 'none') {
+    if (form.querySelector('#selectVideoDecoder').value !== 'none') {
         alert({
             title: globalize.translate('TitleHardwareAcceleration'),
             text: globalize.translate('HardwareAccelerationWarning')
@@ -263,7 +263,7 @@ $(document).on('pageinit', '#encodingSettingsPage', function () {
             picker.show({
                 callback: function (path) {
                     if (path) {
-                        $('#txtTranscodingTempPath', page).val(path);
+                        page.querySelector('#txtTranscodingTempPath').value = path;
                     }
 
                     picker.close();
diff --git a/src/controllers/dashboard/general.js b/src/controllers/dashboard/general.js
index 141a671a797..66d245748e3 100644
--- a/src/controllers/dashboard/general.js
+++ b/src/controllers/dashboard/general.js
@@ -14,8 +14,8 @@ function loadPage(page, config, languageOptions, systemInfo) {
     page.querySelector('#txtServerName').value = systemInfo.ServerName;
     page.querySelector('#txtCachePath').value = systemInfo.CachePath || '';
     page.querySelector('#chkQuickConnectAvailable').checked = config.QuickConnectAvailable === true;
-    $('#txtMetadataPath', page).val(systemInfo.InternalMetadataPath || '');
-    $('#txtMetadataNetworkPath', page).val(systemInfo.MetadataNetworkPath || '');
+    page.querySelector('#txtMetadataPath').value = systemInfo.InternalMetadataPath || '';
+    page.querySelector('#txtMetadataNetworkPath').value = systemInfo.MetadataNetworkPath || '';
     $('#selectLocalizationLanguage', page).html(languageOptions.map(function (language) {
         return '<option value="' + language.Value + '">' + language.Name + '</option>';
     })).val(config.UICulture);
@@ -30,11 +30,11 @@ function onSubmit() {
     const form = this;
     $(form).parents('.page');
     ApiClient.getServerConfiguration().then(function (config) {
-        config.ServerName = $('#txtServerName', form).val();
-        config.UICulture = $('#selectLocalizationLanguage', form).val();
+        config.ServerName = form.querySelector('#txtServerName').value;
+        config.UICulture = form.querySelector('#selectLocalizationLanguage',).value;
         config.CachePath = form.querySelector('#txtCachePath').value;
-        config.MetadataPath = $('#txtMetadataPath', form).val();
-        config.MetadataNetworkPath = $('#txtMetadataNetworkPath', form).val();
+        config.MetadataPath = form.querySelector('#txtMetadataPath').value;
+        config.MetadataNetworkPath = form.querySelector('#txtMetadataNetworkPath').value;
         config.QuickConnectAvailable = form.querySelector('#chkQuickConnectAvailable').checked;
         config.LibraryScanFanoutConcurrency = parseInt(form.querySelector('#txtLibraryScanFanoutConcurrency').value || '0', 10);
         config.ParallelImageEncodingLimit = parseInt(form.querySelector('#txtParallelImageEncodingLimit').value || '0', 10);
@@ -80,15 +80,15 @@ export default function (view) {
         import('../../components/directorybrowser/directorybrowser').then(({ default: DirectoryBrowser }) => {
             const picker = new DirectoryBrowser();
             picker.show({
-                path: $('#txtMetadataPath', view).val(),
-                networkSharePath: $('#txtMetadataNetworkPath', view).val(),
+                path: view.querySelector('#txtMetadataPath').value,
+                networkSharePath: view.querySelector('#txtMetadataNetworkPath').value,
                 callback: function (path, networkPath) {
                     if (path) {
-                        $('#txtMetadataPath', view).val(path);
+                        view.querySelector('#txtMetadataPath').value = path;
                     }
 
                     if (networkPath) {
-                        $('#txtMetadataNetworkPath', view).val(networkPath);
+                        view.querySelector('#txtMetadataNetworkPath').value = networkPath;
                     }
 
                     picker.close();
diff --git a/src/controllers/dashboard/librarydisplay.js b/src/controllers/dashboard/librarydisplay.js
index bae62009da7..236f1515c67 100644
--- a/src/controllers/dashboard/librarydisplay.js
+++ b/src/controllers/dashboard/librarydisplay.js
@@ -29,7 +29,7 @@ export default function(view) {
             ApiClient.updateServerConfiguration(config).then(Dashboard.processServerConfigurationUpdateResult);
         });
         ApiClient.getNamedConfiguration('metadata').then(function(config) {
-            config.UseFileCreationTimeForDateAdded = $('#selectDateAdded', form).val() === '1';
+            config.UseFileCreationTimeForDateAdded = form.querySelector('#selectDateAdded').value === '1';
             ApiClient.updateNamedConfiguration('metadata', config);
         });
 
diff --git a/src/controllers/dashboard/metadatanfo.js b/src/controllers/dashboard/metadatanfo.js
index 53dec9778a5..d73d527cf6b 100644
--- a/src/controllers/dashboard/metadatanfo.js
+++ b/src/controllers/dashboard/metadatanfo.js
@@ -22,8 +22,8 @@ function onSubmit() {
     loading.show();
     const form = this;
     ApiClient.getNamedConfiguration(metadataKey).then(function (config) {
-        config.UserId = $('#selectUser', form).val() || null;
-        config.ReleaseDateFormat = $('#selectReleaseDateFormat', form).val();
+        config.UserId = form.querySelector('#selectUser').value || null;
+        config.ReleaseDateFormat = form.querySelector('#selectReleaseDateFormat').value;
         config.SaveImagePathsInNfo = form.querySelector('#chkSaveImagePaths').checked;
         config.EnablePathSubstitution = form.querySelector('#chkEnablePathSubstitution').checked;
         config.EnableExtraThumbsDuplication = form.querySelector('#chkEnableExtraThumbs').checked;
diff --git a/src/controllers/dashboard/playback.js b/src/controllers/dashboard/playback.js
index e9812ab3666..86787f29685 100644
--- a/src/controllers/dashboard/playback.js
+++ b/src/controllers/dashboard/playback.js
@@ -3,11 +3,11 @@ import loading from '../../components/loading/loading';
 import Dashboard from '../../utils/dashboard';
 
 function loadPage(page, config) {
-    $('#txtMinResumePct', page).val(config.MinResumePct);
-    $('#txtMaxResumePct', page).val(config.MaxResumePct);
-    $('#txtMinAudiobookResume', page).val(config.MinAudiobookResume);
-    $('#txtMaxAudiobookResume', page).val(config.MaxAudiobookResume);
-    $('#txtMinResumeDuration', page).val(config.MinResumeDurationSeconds);
+    page.querySelector('#txtMinResumePct').value = config.MinResumePct;
+    page.querySelector('#txtMaxResumePct').value = config.MaxResumePct;
+    page.querySelector('#txtMinAudiobookResume').value = config.MinAudiobookResume;
+    page.querySelector('#txtMaxAudiobookResume').value = config.MaxAudiobookResume;
+    page.querySelector('#txtMinResumeDuration').value = config.MinResumeDurationSeconds;
     loading.hide();
 }
 
@@ -15,11 +15,11 @@ function onSubmit() {
     loading.show();
     const form = this;
     ApiClient.getServerConfiguration().then(function (config) {
-        config.MinResumePct = $('#txtMinResumePct', form).val();
-        config.MaxResumePct = $('#txtMaxResumePct', form).val();
-        config.MinAudiobookResume = $('#txtMinAudiobookResume', form).val();
-        config.MaxAudiobookResume = $('#txtMaxAudiobookResume', form).val();
-        config.MinResumeDurationSeconds = $('#txtMinResumeDuration', form).val();
+        config.MinResumePct = form.querySelector('#txtMinResumePct').value;
+        config.MaxResumePct = form.querySelector('#txtMaxResumePct').value;
+        config.MinAudiobookResume = form.querySelector('#txtMinAudiobookResume').value;
+        config.MaxAudiobookResume = form.querySelector('#txtMaxAudiobookResume').value;
+        config.MinResumeDurationSeconds = form.querySelector('#txtMinResumeDuration').value;
 
         ApiClient.updateServerConfiguration(config).then(Dashboard.processServerConfigurationUpdateResult);
     });
diff --git a/src/controllers/dashboard/scheduledtasks/scheduledtask.js b/src/controllers/dashboard/scheduledtasks/scheduledtask.js
index 578fc2cb80f..7e30338e9de 100644
--- a/src/controllers/dashboard/scheduledtasks/scheduledtask.js
+++ b/src/controllers/dashboard/scheduledtasks/scheduledtask.js
@@ -124,7 +124,7 @@ const ScheduledTaskPage = {
         return datetime.getDisplayTime(now);
     },
     showAddTriggerPopup: function (view) {
-        $('#selectTriggerType', view).val('DailyTrigger');
+        view.querySelector('#selectTriggerType').value = 'DailyTrigger';
         view.querySelector('#selectTriggerType').dispatchEvent(new CustomEvent('change', {}));
         $('#popupAddTrigger', view).removeClass('hide');
     },
@@ -178,21 +178,21 @@ const ScheduledTaskPage = {
     },
     getTriggerToAdd: function (page) {
         const trigger = {
-            Type: $('#selectTriggerType', page).val()
+            Type: page.querySelector('#selectTriggerType').value
         };
 
         if (trigger.Type == 'DailyTrigger') {
-            trigger.TimeOfDayTicks = $('#selectTimeOfDay', page).val();
+            trigger.TimeOfDayTicks = page.querySelector('#selectTimeOfDay').value;
         } else if (trigger.Type == 'WeeklyTrigger') {
-            trigger.DayOfWeek = $('#selectDayOfWeek', page).val();
-            trigger.TimeOfDayTicks = $('#selectTimeOfDay', page).val();
+            trigger.DayOfWeek = page.querySelector('#selectDayOfWeek').value;
+            trigger.TimeOfDayTicks = page.querySelector('#selectTimeOfDay').value;
         } else if (trigger.Type == 'SystemEventTrigger') {
-            trigger.SystemEvent = $('#selectSystemEvent', page).val();
+            trigger.SystemEvent = page.querySelector('#selectSystemEvent').value;
         } else if (trigger.Type == 'IntervalTrigger') {
-            trigger.IntervalTicks = $('#selectInterval', page).val();
+            trigger.IntervalTicks = page.querySelector('#selectInterval').value;
         }
 
-        let timeLimit = $('#txtTimeLimit', page).val() || '0';
+        let timeLimit = page.querySelector('#txtTimeLimit').value || '0';
         timeLimit = parseFloat(timeLimit) * 3600000;
 
         trigger.MaxRuntimeTicks = timeLimit * 1e4 || null;
diff --git a/src/controllers/dashboard/streaming.js b/src/controllers/dashboard/streaming.js
index 79fd0d28f3f..3c08107e201 100644
--- a/src/controllers/dashboard/streaming.js
+++ b/src/controllers/dashboard/streaming.js
@@ -3,7 +3,7 @@ import loading from '../../components/loading/loading';
 import Dashboard from '../../utils/dashboard';
 
 function loadPage(page, config) {
-    $('#txtRemoteClientBitrateLimit', page).val(config.RemoteClientBitrateLimit / 1e6 || '');
+    page.querySelector('#txtRemoteClientBitrateLimit').value = config.RemoteClientBitrateLimit / 1e6 || '';
     loading.hide();
 }
 
@@ -11,7 +11,7 @@ function onSubmit() {
     loading.show();
     const form = this;
     ApiClient.getServerConfiguration().then(function (config) {
-        config.RemoteClientBitrateLimit = parseInt(1e6 * parseFloat($('#txtRemoteClientBitrateLimit', form).val() || '0'), 10);
+        config.RemoteClientBitrateLimit = parseInt(1e6 * parseFloat(form.querySelector('#txtRemoteClientBitrateLimit', form).value || '0'), 10);
         ApiClient.updateServerConfiguration(config).then(Dashboard.processServerConfigurationUpdateResult);
     });
 
diff --git a/src/controllers/livetvsettings.js b/src/controllers/livetvsettings.js
index 6ad9c0f58b7..34b66ed6884 100644
--- a/src/controllers/livetvsettings.js
+++ b/src/controllers/livetvsettings.js
@@ -8,9 +8,9 @@ import alert from '../components/alert';
 function loadPage(page, config) {
     $('.liveTvSettingsForm', page).show();
     $('.noLiveTvServices', page).hide();
-    $('#selectGuideDays', page).val(config.GuideDays || '');
-    $('#txtPrePaddingMinutes', page).val(config.PrePaddingSeconds / 60);
-    $('#txtPostPaddingMinutes', page).val(config.PostPaddingSeconds / 60);
+    page.querySelector('#selectGuideDays',).value = config.GuideDays || '';
+    page.querySelector('#txtPrePaddingMinutes').value = config.PrePaddingSeconds / 60;
+    page.querySelector('#txtPostPaddingMinutes').value = config.PostPaddingSeconds / 60;
     page.querySelector('#txtRecordingPath').value = config.RecordingPath || '';
     page.querySelector('#txtMovieRecordingPath').value = config.MovieRecordingPath || '';
     page.querySelector('#txtSeriesRecordingPath').value = config.SeriesRecordingPath || '';
@@ -25,7 +25,7 @@ function onSubmit() {
     loading.show();
     const form = this;
     ApiClient.getNamedConfiguration('livetv').then(function (config) {
-        config.GuideDays = $('#selectGuideDays', form).val() || null;
+        config.GuideDays = form.querySelector('#selectGuideDays').value || null;
         const recordingPath = form.querySelector('#txtRecordingPath').value || null;
         const movieRecordingPath = form.querySelector('#txtMovieRecordingPath').value || null;
         const seriesRecordingPath = form.querySelector('#txtSeriesRecordingPath').value || null;
@@ -34,10 +34,10 @@ function onSubmit() {
         config.MovieRecordingPath = movieRecordingPath;
         config.SeriesRecordingPath = seriesRecordingPath;
         config.RecordingEncodingFormat = 'mkv';
-        config.PrePaddingSeconds = 60 * $('#txtPrePaddingMinutes', form).val();
-        config.PostPaddingSeconds = 60 * $('#txtPostPaddingMinutes', form).val();
-        config.RecordingPostProcessor = $('#txtPostProcessor', form).val();
-        config.RecordingPostProcessorArguments = $('#txtPostProcessorArguments', form).val();
+        config.PrePaddingSeconds = 60 * form.querySelector('#txtPrePaddingMinutes').value;
+        config.PostPaddingSeconds = 60 * form.querySelector('#txtPostPaddingMinutes').value;
+        config.RecordingPostProcessor = form.querySelector('#txtPostProcessor').value;
+        config.RecordingPostProcessorArguments = form.querySelector('#txtPostProcessorArguments').value;
         config.SaveRecordingNFO = form.querySelector('#chkSaveRecordingNFO').checked;
         config.SaveRecordingImages = form.querySelector('#chkSaveRecordingImages').checked;
         ApiClient.updateNamedConfiguration('livetv', config).then(function () {
@@ -69,7 +69,7 @@ $(document).on('pageinit', '#liveTvSettingsPage', function () {
             picker.show({
                 callback: function (path) {
                     if (path) {
-                        $('#txtRecordingPath', page).val(path);
+                        page.querySelector('#txtRecordingPath').value = path;
                     }
 
                     picker.close();
@@ -84,7 +84,7 @@ $(document).on('pageinit', '#liveTvSettingsPage', function () {
             picker.show({
                 callback: function (path) {
                     if (path) {
-                        $('#txtMovieRecordingPath', page).val(path);
+                        page.querySelector('#txtMovieRecordingPath').value = path;
                     }
 
                     picker.close();
@@ -99,7 +99,7 @@ $(document).on('pageinit', '#liveTvSettingsPage', function () {
             picker.show({
                 callback: function (path) {
                     if (path) {
-                        $('#txtSeriesRecordingPath', page).val(path);
+                        page.querySelector('#txtSeriesRecordingPath').value = path;
                     }
 
                     picker.close();
@@ -115,7 +115,7 @@ $(document).on('pageinit', '#liveTvSettingsPage', function () {
                 includeFiles: true,
                 callback: function (path) {
                     if (path) {
-                        $('#txtPostProcessor', page).val(path);
+                        page.querySelector('#txtPostProcessor').value = path;
                     }
 
                     picker.close();
diff --git a/src/controllers/livetvstatus.js b/src/controllers/livetvstatus.js
index b0d13f33450..aa15f33f160 100644
--- a/src/controllers/livetvstatus.js
+++ b/src/controllers/livetvstatus.js
@@ -89,8 +89,8 @@ function submitAddDeviceForm(page) {
         type: 'POST',
         url: ApiClient.getUrl('LiveTv/TunerHosts'),
         data: JSON.stringify({
-            Type: $('#selectTunerDeviceType', page).val(),
-            Url: $('#txtDevicePath', page).val()
+            Type: page.querySelector('#selectTunerDeviceType').value,
+            Url: page.querySelector('#txtDevicePath').value
         }),
         contentType: 'application/json'
     }).then(function () {
diff --git a/src/controllers/wizard/start/index.js b/src/controllers/wizard/start/index.js
index 222e017952f..ef20537d29c 100644
--- a/src/controllers/wizard/start/index.js
+++ b/src/controllers/wizard/start/index.js
@@ -15,7 +15,7 @@ function save(page) {
     loading.show();
     const apiClient = ApiClient;
     apiClient.getJSON(apiClient.getUrl('Startup/Configuration')).then(function (config) {
-        config.UICulture = $('#selectLocalizationLanguage', page).val();
+        config.UICulture = page.querySelector('#selectLocalizationLanguage').value;
         apiClient.ajax({
             type: 'POST',
             data: JSON.stringify(config),

From 2e3a59a44e01852cbfe25f2c90a6f71207711c58 Mon Sep 17 00:00:00 2001
From: viown <48097677+viown@users.noreply.github.com>
Date: Wed, 20 Nov 2024 20:31:47 +0300
Subject: [PATCH 2/8] Remove usage of html

---
 src/components/mediaLibraryCreator/mediaLibraryCreator.js | 2 +-
 src/components/tvproviders/schedulesdirect.js             | 6 +++---
 src/controllers/dashboard/scheduledtasks/scheduledtask.js | 4 ++--
 src/controllers/livetvstatus.js                           | 3 ++-
 4 files changed, 8 insertions(+), 7 deletions(-)

diff --git a/src/components/mediaLibraryCreator/mediaLibraryCreator.js b/src/components/mediaLibraryCreator/mediaLibraryCreator.js
index 1480dabe5e3..3fcc536c9e4 100644
--- a/src/components/mediaLibraryCreator/mediaLibraryCreator.js
+++ b/src/components/mediaLibraryCreator/mediaLibraryCreator.js
@@ -95,7 +95,7 @@ function initEditor(page, collectionTypeOptions) {
         }
 
         const folderOption = collectionTypeOptions.find(i => i.value === value);
-        $('.collectionTypeFieldDescription', dlg).html(folderOption?.message || '');
+        dlg.querySelector('.collectionTypeFieldDescription').innerHTML = folderOption?.message || '';
     });
     page.querySelector('.btnAddFolder').addEventListener('click', onAddButtonClick);
     page.querySelector('.addLibraryForm').addEventListener('submit', onAddLibrary);
diff --git a/src/components/tvproviders/schedulesdirect.js b/src/components/tvproviders/schedulesdirect.js
index 9ebea75dc3c..599cdb7e7d6 100644
--- a/src/components/tvproviders/schedulesdirect.js
+++ b/src/components/tvproviders/schedulesdirect.js
@@ -207,7 +207,7 @@ export default function (page, providerId, options) {
 
     function refreshListings(value) {
         if (!value) {
-            $('#selectListing', page).html('');
+            page.querySelector('#selectListing').innerHTML = '';
             return;
         }
 
@@ -221,9 +221,9 @@ export default function (page, providerId, options) {
             }),
             dataType: 'json'
         }).then(function (result) {
-            $('#selectListing', page).html(result.map(function (o) {
+            page.querySelector('#selectListing').innerHTML = result.map(function (o) {
                 return '<option value="' + o.Id + '">' + o.Name + '</option>';
-            }));
+            });
 
             if (listingsId) {
                 page.querySelector('#selectListing').value = listingsId;
diff --git a/src/controllers/dashboard/scheduledtasks/scheduledtask.js b/src/controllers/dashboard/scheduledtasks/scheduledtask.js
index 7e30338e9de..39e37a79105 100644
--- a/src/controllers/dashboard/scheduledtasks/scheduledtask.js
+++ b/src/controllers/dashboard/scheduledtasks/scheduledtask.js
@@ -33,8 +33,8 @@ const ScheduledTaskPage = {
         });
     },
     loadScheduledTask: function (view, task) {
-        $('.taskName', view).html(task.Name);
-        $('#pTaskDescription', view).html(task.Description);
+        view.querySelector('.taskName').innerHTML = task.Name;
+        view.querySelector('#pTaskDescription').innerHTML = task.Description;
 
         import('../../../components/listview/listview.scss').then(() => {
             ScheduledTaskPage.loadTaskTriggers(view, task);
diff --git a/src/controllers/livetvstatus.js b/src/controllers/livetvstatus.js
index aa15f33f160..4ff19c502e1 100644
--- a/src/controllers/livetvstatus.js
+++ b/src/controllers/livetvstatus.js
@@ -129,7 +129,8 @@ function renderProviders(page, providers) {
         html += '</div>';
     }
 
-    const elem = $('.providerList', page).html(html);
+    const elem = page.querySelector('.providerList');
+    elem.innerHTML = html
     $('.btnOptions', elem).on('click', function () {
         const id = this.getAttribute('data-id');
         showProviderOptions(page, id, this);

From a2b1b63e1f58986d1cd0cfb01c0f9f994fbb301c Mon Sep 17 00:00:00 2001
From: viown <48097677+viown@users.noreply.github.com>
Date: Wed, 20 Nov 2024 20:43:42 +0300
Subject: [PATCH 3/8] Remove usage of show/hide

---
 .../dashboard/scheduledtasks/scheduledtask.js | 40 +++++++++----------
 src/controllers/livetvsettings.js             |  4 +-
 2 files changed, 22 insertions(+), 22 deletions(-)

diff --git a/src/controllers/dashboard/scheduledtasks/scheduledtask.js b/src/controllers/dashboard/scheduledtasks/scheduledtask.js
index 39e37a79105..8751bc85f9a 100644
--- a/src/controllers/dashboard/scheduledtasks/scheduledtask.js
+++ b/src/controllers/dashboard/scheduledtasks/scheduledtask.js
@@ -145,34 +145,34 @@ const ScheduledTaskPage = {
     },
     refreshTriggerFields: function (page, triggerType) {
         if (triggerType == 'DailyTrigger') {
-            $('#fldTimeOfDay', page).show();
-            $('#fldDayOfWeek', page).hide();
-            $('#fldSelectSystemEvent', page).hide();
-            $('#fldSelectInterval', page).hide();
+            page.querySelector('#fldTimeOfDay').classList.remove('hide');
+            page.querySelector('#fldDayOfWeek').classList.add('hide');
+            page.querySelector('#fldSelectSystemEvent').classList.add('hide');
+            page.querySelector('#fldSelectInterval').classList.add('hide');
             $('#selectTimeOfDay', page).attr('required', 'required');
         } else if (triggerType == 'WeeklyTrigger') {
-            $('#fldTimeOfDay', page).show();
-            $('#fldDayOfWeek', page).show();
-            $('#fldSelectSystemEvent', page).hide();
-            $('#fldSelectInterval', page).hide();
+            page.querySelector('#fldTimeOfDay').classList.remove('hide');
+            page.querySelector('#fldDayOfWeek').classList.remove('hide');
+            page.querySelector('#fldSelectSystemEvent').classList.add('hide');
+            page.querySelector('#fldSelectInterval').classList.add('hide');
             $('#selectTimeOfDay', page).attr('required', 'required');
         } else if (triggerType == 'SystemEventTrigger') {
-            $('#fldTimeOfDay', page).hide();
-            $('#fldDayOfWeek', page).hide();
-            $('#fldSelectSystemEvent', page).show();
-            $('#fldSelectInterval', page).hide();
+            page.querySelector('#fldTimeOfDay').classList.add('hide');
+            page.querySelector('#fldDayOfWeek').classList.add('hide');
+            page.querySelector('#fldSelectSystemEvent').classList.remove('hide');
+            page.querySelector('#fldSelectInterval').classList.add('hide');
             $('#selectTimeOfDay', page).removeAttr('required');
         } else if (triggerType == 'IntervalTrigger') {
-            $('#fldTimeOfDay', page).hide();
-            $('#fldDayOfWeek', page).hide();
-            $('#fldSelectSystemEvent', page).hide();
-            $('#fldSelectInterval', page).show();
+            page.querySelector('#fldTimeOfDay').classList.add('hide');
+            page.querySelector('#fldDayOfWeek').classList.add('hide');
+            page.querySelector('#fldSelectSystemEvent').classList.add('hide');
+            page.querySelector('#fldSelectInterval').classList.remove('hide');
             $('#selectTimeOfDay', page).removeAttr('required');
         } else if (triggerType == 'StartupTrigger') {
-            $('#fldTimeOfDay', page).hide();
-            $('#fldDayOfWeek', page).hide();
-            $('#fldSelectSystemEvent', page).hide();
-            $('#fldSelectInterval', page).hide();
+            page.querySelector('#fldTimeOfDay').classList.add('hide');
+            page.querySelector('#fldDayOfWeek').classList.add('hide');
+            page.querySelector('#fldSelectSystemEvent').classList.add('hide');
+            page.querySelector('#fldSelectInterval').classList.add('hide');
             $('#selectTimeOfDay', page).removeAttr('required');
         }
     },
diff --git a/src/controllers/livetvsettings.js b/src/controllers/livetvsettings.js
index 34b66ed6884..874f879f431 100644
--- a/src/controllers/livetvsettings.js
+++ b/src/controllers/livetvsettings.js
@@ -6,8 +6,8 @@ import Dashboard from '../utils/dashboard';
 import alert from '../components/alert';
 
 function loadPage(page, config) {
-    $('.liveTvSettingsForm', page).show();
-    $('.noLiveTvServices', page).hide();
+    page.querySelector('.liveTvSettingsForm').classList.remove('hide');
+    page.querySelector('.noLiveTvServices').classList.add('hide');
     page.querySelector('#selectGuideDays',).value = config.GuideDays || '';
     page.querySelector('#txtPrePaddingMinutes').value = config.PrePaddingSeconds / 60;
     page.querySelector('#txtPostPaddingMinutes').value = config.PostPaddingSeconds / 60;

From 61a5c3f9ddfafa14d91263d1fb3da6eef3e6f9e3 Mon Sep 17 00:00:00 2001
From: viown <48097677+viown@users.noreply.github.com>
Date: Wed, 20 Nov 2024 20:45:10 +0300
Subject: [PATCH 4/8] Remove usage of attr/removeAttr

---
 .../dashboard/scheduledtasks/scheduledtask.js          | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/src/controllers/dashboard/scheduledtasks/scheduledtask.js b/src/controllers/dashboard/scheduledtasks/scheduledtask.js
index 8751bc85f9a..39e0394d9f7 100644
--- a/src/controllers/dashboard/scheduledtasks/scheduledtask.js
+++ b/src/controllers/dashboard/scheduledtasks/scheduledtask.js
@@ -149,31 +149,31 @@ const ScheduledTaskPage = {
             page.querySelector('#fldDayOfWeek').classList.add('hide');
             page.querySelector('#fldSelectSystemEvent').classList.add('hide');
             page.querySelector('#fldSelectInterval').classList.add('hide');
-            $('#selectTimeOfDay', page).attr('required', 'required');
+            page.querySelector('#selectTimeOfDay').setAttribute('required', 'required');
         } else if (triggerType == 'WeeklyTrigger') {
             page.querySelector('#fldTimeOfDay').classList.remove('hide');
             page.querySelector('#fldDayOfWeek').classList.remove('hide');
             page.querySelector('#fldSelectSystemEvent').classList.add('hide');
             page.querySelector('#fldSelectInterval').classList.add('hide');
-            $('#selectTimeOfDay', page).attr('required', 'required');
+            page.querySelector('#selectTimeOfDay').setAttribute('required', 'required');
         } else if (triggerType == 'SystemEventTrigger') {
             page.querySelector('#fldTimeOfDay').classList.add('hide');
             page.querySelector('#fldDayOfWeek').classList.add('hide');
             page.querySelector('#fldSelectSystemEvent').classList.remove('hide');
             page.querySelector('#fldSelectInterval').classList.add('hide');
-            $('#selectTimeOfDay', page).removeAttr('required');
+            page.querySelector('#selectTimeOfDay').removeAttribute('required');
         } else if (triggerType == 'IntervalTrigger') {
             page.querySelector('#fldTimeOfDay').classList.add('hide');
             page.querySelector('#fldDayOfWeek').classList.add('hide');
             page.querySelector('#fldSelectSystemEvent').classList.add('hide');
             page.querySelector('#fldSelectInterval').classList.remove('hide');
-            $('#selectTimeOfDay', page).removeAttr('required');
+            page.querySelector('#selectTimeOfDay').removeAttribute('required');
         } else if (triggerType == 'StartupTrigger') {
             page.querySelector('#fldTimeOfDay').classList.add('hide');
             page.querySelector('#fldDayOfWeek').classList.add('hide');
             page.querySelector('#fldSelectSystemEvent').classList.add('hide');
             page.querySelector('#fldSelectInterval').classList.add('hide');
-            $('#selectTimeOfDay', page).removeAttr('required');
+            page.querySelector('#selectTimeOfDay').removeAttribute('required');
         }
     },
     getTriggerToAdd: function (page) {

From b6f12a06e2830fadaf4bd0f32b3729c1ea805476 Mon Sep 17 00:00:00 2001
From: viown <48097677+viown@users.noreply.github.com>
Date: Wed, 20 Nov 2024 20:55:06 +0300
Subject: [PATCH 5/8] Remove usage of parents

---
 src/components/mediaLibraryCreator/mediaLibraryCreator.js  | 2 +-
 src/components/tvproviders/xmltv.js                        | 3 ++-
 src/controllers/dashboard/general.js                       | 1 -
 src/controllers/dashboard/library.js                       | 2 +-
 src/controllers/dashboard/scheduledtasks/scheduledtasks.js | 3 ++-
 src/controllers/wizard/start/index.js                      | 3 ++-
 src/scripts/editorsidebar.js                               | 3 ++-
 7 files changed, 10 insertions(+), 7 deletions(-)

diff --git a/src/components/mediaLibraryCreator/mediaLibraryCreator.js b/src/components/mediaLibraryCreator/mediaLibraryCreator.js
index 3fcc536c9e4..e5ce6fe770f 100644
--- a/src/components/mediaLibraryCreator/mediaLibraryCreator.js
+++ b/src/components/mediaLibraryCreator/mediaLibraryCreator.js
@@ -74,7 +74,7 @@ function getCollectionTypeOptionsHtml(collectionTypeOptions) {
 function initEditor(page, collectionTypeOptions) {
     $('#selectCollectionType', page).html(getCollectionTypeOptionsHtml(collectionTypeOptions)).val('').on('change', function () {
         const value = this.value;
-        const dlg = $(this).parents('.dialog')[0];
+        const dlg = dom.parentWithClass(this, 'dialog');
         libraryoptionseditor.setContentType(dlg.querySelector('.libraryOptions'), value);
 
         if (value) {
diff --git a/src/components/tvproviders/xmltv.js b/src/components/tvproviders/xmltv.js
index ff565700bf1..77a9105a12f 100644
--- a/src/components/tvproviders/xmltv.js
+++ b/src/components/tvproviders/xmltv.js
@@ -7,6 +7,7 @@ import '../listview/listview.scss';
 import '../../elements/emby-button/paper-icon-button-light';
 import Dashboard from '../../utils/dashboard';
 import Events from '../../utils/events.ts';
+import dom from 'scripts/dom';
 
 function getTunerName(providerId) {
     switch (providerId.toLowerCase()) {
@@ -46,7 +47,7 @@ function refreshTunerDevices(page, providerInfo, devices) {
 }
 
 function onSelectPathClick(e) {
-    const page = $(e.target).parents('.xmltvForm')[0];
+    const page = dom.parentWithClass(e.target, 'xmltvForm');
 
     import('../directorybrowser/directorybrowser').then(({ default: DirectoryBrowser }) => {
         const picker = new DirectoryBrowser();
diff --git a/src/controllers/dashboard/general.js b/src/controllers/dashboard/general.js
index 66d245748e3..f4fa3e38d07 100644
--- a/src/controllers/dashboard/general.js
+++ b/src/controllers/dashboard/general.js
@@ -28,7 +28,6 @@ function loadPage(page, config, languageOptions, systemInfo) {
 function onSubmit() {
     loading.show();
     const form = this;
-    $(form).parents('.page');
     ApiClient.getServerConfiguration().then(function (config) {
         config.ServerName = form.querySelector('#txtServerName').value;
         config.UICulture = form.querySelector('#selectLocalizationLanguage',).value;
diff --git a/src/controllers/dashboard/library.js b/src/controllers/dashboard/library.js
index 7d5d9133115..cd71e20bdc6 100644
--- a/src/controllers/dashboard/library.js
+++ b/src/controllers/dashboard/library.js
@@ -188,7 +188,7 @@ function reloadVirtualFolders(page, virtualFolders) {
         addVirtualFolder(page);
     });
     $('.editLibrary', divVirtualFolders).on('click', function () {
-        const card = $(this).parents('.card')[0];
+        const card = dom.parentWithClass(this, 'card');
         const index = parseInt(card.getAttribute('data-index'), 10);
         const virtualFolder = virtualFolders[index];
 
diff --git a/src/controllers/dashboard/scheduledtasks/scheduledtasks.js b/src/controllers/dashboard/scheduledtasks/scheduledtasks.js
index db5f9255beb..9fcd590134b 100644
--- a/src/controllers/dashboard/scheduledtasks/scheduledtasks.js
+++ b/src/controllers/dashboard/scheduledtasks/scheduledtasks.js
@@ -8,6 +8,7 @@ import Events from '../../../utils/events.ts';
 
 import '../../../components/listview/listview.scss';
 import '../../../elements/emby-button/emby-button';
+import dom from 'scripts/dom';
 
 function reloadList(page) {
     ApiClient.getScheduledTasks({
@@ -126,7 +127,7 @@ function updateTaskButton(elem, state) {
         setTaskButtonIcon(elem, 'play_arrow');
         elem.title = globalize.translate('ButtonStart');
     }
-    $(elem).parents('.listItem')[0].setAttribute('data-status', state);
+    dom.parentWithClass(elem, 'listItem').setAttribute('data-status', state);
 }
 
 export default function(view) {
diff --git a/src/controllers/wizard/start/index.js b/src/controllers/wizard/start/index.js
index ef20537d29c..919b6fe6b1a 100644
--- a/src/controllers/wizard/start/index.js
+++ b/src/controllers/wizard/start/index.js
@@ -3,6 +3,7 @@ import loading from '../../../components/loading/loading';
 import '../../../elements/emby-button/emby-button';
 import '../../../elements/emby-select/emby-select';
 import Dashboard from '../../../utils/dashboard';
+import dom from 'scripts/dom';
 
 function loadPage(page, config, languageOptions) {
     $('#selectLocalizationLanguage', page).html(languageOptions.map(function (l) {
@@ -28,7 +29,7 @@ function save(page) {
 }
 
 function onSubmit() {
-    save($(this).parents('.page'));
+    save(dom.parentWithClass(this, 'page'));
     return false;
 }
 
diff --git a/src/scripts/editorsidebar.js b/src/scripts/editorsidebar.js
index 28fb8619174..a033ced5192 100644
--- a/src/scripts/editorsidebar.js
+++ b/src/scripts/editorsidebar.js
@@ -5,6 +5,7 @@ import 'material-design-icons-iconfont';
 import globalize from 'lib/globalize';
 import Dashboard from 'utils/dashboard';
 import { getParameterByName } from 'utils/url';
+import dom from './dom';
 
 function getNode(item, folderState, selected) {
     const htmlName = getNodeInnerHtml(item);
@@ -215,7 +216,7 @@ function onNodeSelect(event, data) {
 }
 
 function onNodeOpen(_, data) {
-    const page = $(this).parents('.page')[0];
+    const page = dom.parentWithClass(this, 'page');
     const node = data.node;
     if (node.children) {
         loadNodesToLoad(page, node);

From d05271a244e5c276d339d10fddc4b845e18462fe Mon Sep 17 00:00:00 2001
From: viown <48097677+viown@users.noreply.github.com>
Date: Wed, 20 Nov 2024 21:05:37 +0300
Subject: [PATCH 6/8] Remove other uses of jQuery

---
 .eslintrc.js                                              | 6 ++----
 src/components/mediaLibraryCreator/mediaLibraryCreator.js | 2 +-
 src/components/tvproviders/schedulesdirect.js             | 2 +-
 3 files changed, 4 insertions(+), 6 deletions(-)

diff --git a/.eslintrc.js b/.eslintrc.js
index 0d8c09d6126..1712568ac21 100644
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -8,8 +8,7 @@ module.exports = {
         '@typescript-eslint',
         'react',
         'import',
-        'sonarjs',
-        'jquery'
+        'sonarjs'
     ],
     env: {
         node: true,
@@ -100,8 +99,7 @@ module.exports = {
         '@stylistic/quotes': ['error', 'single', { 'avoidEscape': true, 'allowTemplateLiterals': false }],
         '@stylistic/semi': ['error'],
         '@stylistic/space-before-blocks': ['error'],
-        '@stylistic/space-infix-ops': ['error'],
-        'jquery/no-val': ['error']
+        '@stylistic/space-infix-ops': ['error']
     },
     settings: {
         react: {
diff --git a/src/components/mediaLibraryCreator/mediaLibraryCreator.js b/src/components/mediaLibraryCreator/mediaLibraryCreator.js
index e5ce6fe770f..b044a01db5e 100644
--- a/src/components/mediaLibraryCreator/mediaLibraryCreator.js
+++ b/src/components/mediaLibraryCreator/mediaLibraryCreator.js
@@ -184,7 +184,7 @@ function onDialogClosed() {
 
 function initLibraryOptions(dlg) {
     libraryoptionseditor.embed(dlg.querySelector('.libraryOptions')).then(() => {
-        $('#selectCollectionType', dlg).trigger('change');
+        dlg.querySelector('#selectCollectionType').dispatchEvent(new Event('change'));
     });
 }
 
diff --git a/src/components/tvproviders/schedulesdirect.js b/src/components/tvproviders/schedulesdirect.js
index 599cdb7e7d6..2c8bd03438e 100644
--- a/src/components/tvproviders/schedulesdirect.js
+++ b/src/components/tvproviders/schedulesdirect.js
@@ -114,7 +114,7 @@ export default function (page, providerId, options) {
             $('#selectCountry', page).html(countryList.map(function (c) {
                 return '<option value="' + c.value + '">' + c.name + '</option>';
             }).join('')).val(info.Country || '');
-            $(page.querySelector('.txtZipCode')).trigger('change');
+            page.querySelector('.txtZipCode').dispatchEvent(new Event('change'));
         }, function () { // ApiClient.getJSON() error handler
             Dashboard.alert({
                 message: globalize.translate('ErrorGettingTvLineups')

From 9c580811f8f24e1aaca8d9c8df9ca95315455171 Mon Sep 17 00:00:00 2001
From: viown <48097677+viown@users.noreply.github.com>
Date: Wed, 20 Nov 2024 21:28:59 +0300
Subject: [PATCH 7/8] Replace on listeners and misc

---
 .../mediaLibraryCreator.js                    |  5 +++-
 src/components/tvproviders/schedulesdirect.js | 10 ++++---
 src/controllers/dashboard/general.js          |  8 +++--
 src/controllers/dashboard/library.js          | 29 +++++++++++-------
 src/controllers/dashboard/metadatanfo.js      |  6 ++--
 .../dashboard/scheduledtasks/scheduledtask.js |  6 ++--
 src/controllers/livetvsettings.js             |  6 ++--
 src/controllers/livetvstatus.js               | 30 ++++++++++++-------
 src/controllers/wizard/start/index.js         |  8 +++--
 9 files changed, 68 insertions(+), 40 deletions(-)

diff --git a/src/components/mediaLibraryCreator/mediaLibraryCreator.js b/src/components/mediaLibraryCreator/mediaLibraryCreator.js
index b044a01db5e..154915cb68e 100644
--- a/src/components/mediaLibraryCreator/mediaLibraryCreator.js
+++ b/src/components/mediaLibraryCreator/mediaLibraryCreator.js
@@ -72,7 +72,10 @@ function getCollectionTypeOptionsHtml(collectionTypeOptions) {
 }
 
 function initEditor(page, collectionTypeOptions) {
-    $('#selectCollectionType', page).html(getCollectionTypeOptionsHtml(collectionTypeOptions)).val('').on('change', function () {
+    const selectCollectionType = page.querySelector('#selectCollectionType');
+    selectCollectionType.innerHTML = getCollectionTypeOptionsHtml(collectionTypeOptions);
+    selectCollectionType.value = '';
+    selectCollectionType.addEventListener('change', function () {
         const value = this.value;
         const dlg = dom.parentWithClass(this, 'dialog');
         libraryoptionseditor.setContentType(dlg.querySelector('.libraryOptions'), value);
diff --git a/src/components/tvproviders/schedulesdirect.js b/src/components/tvproviders/schedulesdirect.js
index 2c8bd03438e..866e93e3b65 100644
--- a/src/components/tvproviders/schedulesdirect.js
+++ b/src/components/tvproviders/schedulesdirect.js
@@ -257,15 +257,17 @@ export default function (page, providerId, options) {
         const hideSubmitButton = options.showSubmitButton === false;
         page.querySelector('.btnSubmitListings').classList.toggle('hide', hideSubmitButton);
 
-        $('.formLogin', page).on('submit', function () {
+        page.querySelector('.formLogin').addEventListener('submit', function () {
             submitLoginForm();
             return false;
         });
-        $('.formListings', page).on('submit', function () {
+
+        page.querySelector('.formListings').addEventListener('submit', function () {
             submitListingsForm();
-            return false;
+                return false;
         });
-        $('.txtZipCode', page).on('change', function () {
+
+        page.querySelector('.txtZipCode').addEventListener('change', function () {
             refreshListings(this.value);
         });
         page.querySelector('.chkAllTuners').addEventListener('change', function (e) {
diff --git a/src/controllers/dashboard/general.js b/src/controllers/dashboard/general.js
index f4fa3e38d07..e39c32681d2 100644
--- a/src/controllers/dashboard/general.js
+++ b/src/controllers/dashboard/general.js
@@ -16,9 +16,11 @@ function loadPage(page, config, languageOptions, systemInfo) {
     page.querySelector('#chkQuickConnectAvailable').checked = config.QuickConnectAvailable === true;
     page.querySelector('#txtMetadataPath').value = systemInfo.InternalMetadataPath || '';
     page.querySelector('#txtMetadataNetworkPath').value = systemInfo.MetadataNetworkPath || '';
-    $('#selectLocalizationLanguage', page).html(languageOptions.map(function (language) {
+    const localizationLanguageElem = page.querySelector('#selectLocalizationLanguage');
+    localizationLanguageElem.innerHTML = languageOptions.map(function (language) {
         return '<option value="' + language.Value + '">' + language.Name + '</option>';
-    })).val(config.UICulture);
+    }).join('');
+    localizationLanguageElem.value = config.UICulture;
     page.querySelector('#txtLibraryScanFanoutConcurrency').value = config.LibraryScanFanoutConcurrency || '';
     page.querySelector('#txtParallelImageEncodingLimit').value = config.ParallelImageEncodingLimit || '';
 
@@ -30,7 +32,7 @@ function onSubmit() {
     const form = this;
     ApiClient.getServerConfiguration().then(function (config) {
         config.ServerName = form.querySelector('#txtServerName').value;
-        config.UICulture = form.querySelector('#selectLocalizationLanguage',).value;
+        config.UICulture = form.querySelector('#selectLocalizationLanguage').value;
         config.CachePath = form.querySelector('#txtCachePath').value;
         config.MetadataPath = form.querySelector('#txtMetadataPath').value;
         config.MetadataNetworkPath = form.querySelector('#txtMetadataNetworkPath').value;
diff --git a/src/controllers/dashboard/library.js b/src/controllers/dashboard/library.js
index cd71e20bdc6..1d7c46d7b81 100644
--- a/src/controllers/dashboard/library.js
+++ b/src/controllers/dashboard/library.js
@@ -181,21 +181,28 @@ function reloadVirtualFolders(page, virtualFolders) {
     divVirtualFolders.innerHTML = html;
     divVirtualFolders.classList.add('itemsContainer');
     divVirtualFolders.classList.add('vertical-wrap');
-    $('.btnCardMenu', divVirtualFolders).on('click', function () {
-        showCardMenu(page, this, virtualFolders);
-    });
+    const btnCardMenuElements = divVirtualFolders.querySelectorAll('.btnCardMenu');
+    btnCardMenuElements.forEach(function (btn) {
+        btn.addEventListener('click', function () {
+            showCardMenu(page, btn, virtualFolders);
+        })
+    })
     divVirtualFolders.querySelector('#addLibrary').addEventListener('click', function () {
         addVirtualFolder(page);
     });
-    $('.editLibrary', divVirtualFolders).on('click', function () {
-        const card = dom.parentWithClass(this, 'card');
-        const index = parseInt(card.getAttribute('data-index'), 10);
-        const virtualFolder = virtualFolders[index];
 
-        if (virtualFolder.ItemId) {
-            editVirtualFolder(page, virtualFolder);
-        }
-    });
+    const libraryEditElements = divVirtualFolders.querySelectorAll('.editLibrary');
+    libraryEditElements.forEach(function (btn) {
+        btn.addEventListener('click', function () {
+            const card = dom.parentWithClass(btn, 'card');
+            const index = parseInt(card.getAttribute('data-index'), 10);
+            const virtualFolder = virtualFolders[index];
+
+            if (virtualFolder.ItemId) {
+                editVirtualFolder(page, virtualFolder);
+            }
+        })
+    })
     loading.hide();
 }
 
diff --git a/src/controllers/dashboard/metadatanfo.js b/src/controllers/dashboard/metadatanfo.js
index d73d527cf6b..6d8c62a642f 100644
--- a/src/controllers/dashboard/metadatanfo.js
+++ b/src/controllers/dashboard/metadatanfo.js
@@ -10,8 +10,10 @@ function loadPage(page, config, users) {
     html += users.map(function (user) {
         return '<option value="' + user.Id + '">' + escapeHtml(user.Name) + '</option>';
     }).join('');
-    $('#selectUser', page).html(html).val(config.UserId || '');
-    $('#selectReleaseDateFormat', page).val(config.ReleaseDateFormat);
+    const elem = page.querySelector('#selectUser');
+    elem.innerHTML = html;
+    elem.value = config.UserId || '';
+    page.querySelector('#selectReleaseDateFormat').value = config.ReleaseDateFormat;
     page.querySelector('#chkSaveImagePaths').checked = config.SaveImagePathsInNfo;
     page.querySelector('#chkEnablePathSubstitution').checked = config.EnablePathSubstitution;
     page.querySelector('#chkEnableExtraThumbs').checked = config.EnableExtraThumbsDuplication;
diff --git a/src/controllers/dashboard/scheduledtasks/scheduledtask.js b/src/controllers/dashboard/scheduledtasks/scheduledtask.js
index 39e0394d9f7..34a6034dcb1 100644
--- a/src/controllers/dashboard/scheduledtasks/scheduledtask.js
+++ b/src/controllers/dashboard/scheduledtasks/scheduledtask.js
@@ -126,7 +126,7 @@ const ScheduledTaskPage = {
     showAddTriggerPopup: function (view) {
         view.querySelector('#selectTriggerType').value = 'DailyTrigger';
         view.querySelector('#selectTriggerType').dispatchEvent(new CustomEvent('change', {}));
-        $('#popupAddTrigger', view).removeClass('hide');
+        view.querySelector('#popupAddTrigger').classList.remove('hide');
     },
     confirmDeleteTrigger: function (view, index) {
         confirm(globalize.translate('MessageDeleteTaskTrigger'), globalize.translate('HeaderDeleteTaskTrigger')).then(function () {
@@ -207,7 +207,7 @@ export default function (view) {
         ApiClient.getScheduledTask(id).then(function (task) {
             task.Triggers.push(ScheduledTaskPage.getTriggerToAdd(view));
             ApiClient.updateScheduledTaskTriggers(task.Id, task.Triggers).then(function () {
-                $('#popupAddTrigger').addClass('hide');
+                document.querySelector('#popupAddTrigger').classList.add('hide');
                 ScheduledTaskPage.refreshScheduledTask(view);
             });
         });
@@ -216,7 +216,7 @@ export default function (view) {
 
     view.querySelector('.addTriggerForm').addEventListener('submit', onSubmit);
     fillTimeOfDay(view.querySelector('#selectTimeOfDay'));
-    $(view.querySelector('#popupAddTrigger').parentNode).trigger('create');
+    view.querySelector('#popupAddTrigger').parentNode.trigger(new Event('create'));
     view.querySelector('.selectTriggerType').addEventListener('change', function () {
         ScheduledTaskPage.refreshTriggerFields(view, this.value);
     });
diff --git a/src/controllers/livetvsettings.js b/src/controllers/livetvsettings.js
index 874f879f431..1016c409f61 100644
--- a/src/controllers/livetvsettings.js
+++ b/src/controllers/livetvsettings.js
@@ -7,8 +7,10 @@ import alert from '../components/alert';
 
 function loadPage(page, config) {
     page.querySelector('.liveTvSettingsForm').classList.remove('hide');
-    page.querySelector('.noLiveTvServices').classList.add('hide');
-    page.querySelector('#selectGuideDays',).value = config.GuideDays || '';
+    if (page.querySelector('.noLiveTvServices')) {
+        page.querySelector('.noLiveTvServices').classList.add('hide');
+    }
+    page.querySelector('#selectGuideDays').value = config.GuideDays || '';
     page.querySelector('#txtPrePaddingMinutes').value = config.PrePaddingSeconds / 60;
     page.querySelector('#txtPostPaddingMinutes').value = config.PostPaddingSeconds / 60;
     page.querySelector('#txtRecordingPath').value = config.RecordingPath || '';
diff --git a/src/controllers/livetvstatus.js b/src/controllers/livetvstatus.js
index 4ff19c502e1..ea22c8c5092 100644
--- a/src/controllers/livetvstatus.js
+++ b/src/controllers/livetvstatus.js
@@ -130,11 +130,16 @@ function renderProviders(page, providers) {
     }
 
     const elem = page.querySelector('.providerList');
-    elem.innerHTML = html
-    $('.btnOptions', elem).on('click', function () {
-        const id = this.getAttribute('data-id');
-        showProviderOptions(page, id, this);
-    });
+    elem.innerHTML = html;
+    if (elem.querySelector('.btnOptions')) {
+        const btnOptionElements = elem.querySelectorAll('.btnOptions');
+        btnOptionElements.forEach(function (btn) {
+            btn.addEventListener('click', function () {
+                const id = this.getAttribute('data-id');
+                showProviderOptions(page, id, btn);
+            })
+        })
+    }
 }
 
 function showProviderOptions(page, providerId, button) {
@@ -298,14 +303,17 @@ function onDevicesListClick(e) {
 
 $(document).on('pageinit', '#liveTvStatusPage', function () {
     const page = this;
-    $('.btnAddDevice', page).on('click', function () {
+    page.querySelector('.btnAddDevice').addEventListener('click', function () {
         addDevice();
     });
-    $('.formAddDevice', page).on('submit', function () {
-        submitAddDeviceForm(page);
-        return false;
-    });
-    $('.btnAddProvider', page).on('click', function () {
+    if (page.querySelector('.formAddDevice')) {
+        // unused?
+        page.querySelector('.formAddDevice').addEventListener('submit', function () {
+            submitAddDeviceForm(page);
+            return false;
+        });
+    }
+    page.querySelector('.btnAddProvider').addEventListener('click', function () {
         addProvider(this);
     });
     page.querySelector('.devicesList').addEventListener('click', onDevicesListClick);
diff --git a/src/controllers/wizard/start/index.js b/src/controllers/wizard/start/index.js
index 919b6fe6b1a..b323b148ee0 100644
--- a/src/controllers/wizard/start/index.js
+++ b/src/controllers/wizard/start/index.js
@@ -6,9 +6,11 @@ import Dashboard from '../../../utils/dashboard';
 import dom from 'scripts/dom';
 
 function loadPage(page, config, languageOptions) {
-    $('#selectLocalizationLanguage', page).html(languageOptions.map(function (l) {
+    const elem = page.querySelector('#selectLocalizationLanguage');
+    elem.innerHTML = languageOptions.map(function (l) {
         return '<option value="' + l.Value + '">' + l.Name + '</option>';
-    })).val(config.UICulture);
+    }).join('');
+    elem.value = config.UICulture;
     loading.hide();
 }
 
@@ -34,7 +36,7 @@ function onSubmit() {
 }
 
 export default function (view) {
-    $('.wizardStartForm', view).on('submit', onSubmit);
+    view.querySelector('.wizardStartForm').addEventListener('submit', onSubmit);
     view.addEventListener('viewshow', function () {
         document.querySelector('.skinHeader').classList.add('noHomeButtonHeader');
         loading.show();

From e3c020870b8222948bd0c1fddfc5513f445f6a85 Mon Sep 17 00:00:00 2001
From: viown <48097677+viown@users.noreply.github.com>
Date: Wed, 20 Nov 2024 22:54:51 +0300
Subject: [PATCH 8/8] Cleanup listeners

---
 src/components/tvproviders/schedulesdirect.js | 10 +++++-----
 src/controllers/dashboard/library.js          |  8 ++++----
 src/controllers/dashboard/streaming.js        |  2 +-
 src/controllers/livetvstatus.js               |  8 ++++----
 src/controllers/wizard/start/index.js         |  4 ++--
 src/scripts/editorsidebar.js                  |  3 +--
 6 files changed, 17 insertions(+), 18 deletions(-)

diff --git a/src/components/tvproviders/schedulesdirect.js b/src/components/tvproviders/schedulesdirect.js
index 866e93e3b65..8536f93c1f1 100644
--- a/src/components/tvproviders/schedulesdirect.js
+++ b/src/components/tvproviders/schedulesdirect.js
@@ -223,7 +223,7 @@ export default function (page, providerId, options) {
         }).then(function (result) {
             page.querySelector('#selectListing').innerHTML = result.map(function (o) {
                 return '<option value="' + o.Id + '">' + o.Name + '</option>';
-            });
+            }).join('');
 
             if (listingsId) {
                 page.querySelector('#selectListing').value = listingsId;
@@ -257,14 +257,14 @@ export default function (page, providerId, options) {
         const hideSubmitButton = options.showSubmitButton === false;
         page.querySelector('.btnSubmitListings').classList.toggle('hide', hideSubmitButton);
 
-        page.querySelector('.formLogin').addEventListener('submit', function () {
+        page.querySelector('.formLogin').addEventListener('submit', function (e) {
+            e.preventDefault();
             submitLoginForm();
-            return false;
         });
 
-        page.querySelector('.formListings').addEventListener('submit', function () {
+        page.querySelector('.formListings').addEventListener('submit', function (e) {
+            e.preventDefault();
             submitListingsForm();
-                return false;
         });
 
         page.querySelector('.txtZipCode').addEventListener('change', function () {
diff --git a/src/controllers/dashboard/library.js b/src/controllers/dashboard/library.js
index 1d7c46d7b81..944818f96b5 100644
--- a/src/controllers/dashboard/library.js
+++ b/src/controllers/dashboard/library.js
@@ -185,8 +185,8 @@ function reloadVirtualFolders(page, virtualFolders) {
     btnCardMenuElements.forEach(function (btn) {
         btn.addEventListener('click', function () {
             showCardMenu(page, btn, virtualFolders);
-        })
-    })
+        });
+    });
     divVirtualFolders.querySelector('#addLibrary').addEventListener('click', function () {
         addVirtualFolder(page);
     });
@@ -201,8 +201,8 @@ function reloadVirtualFolders(page, virtualFolders) {
             if (virtualFolder.ItemId) {
                 editVirtualFolder(page, virtualFolder);
             }
-        })
-    })
+        });
+    });
     loading.hide();
 }
 
diff --git a/src/controllers/dashboard/streaming.js b/src/controllers/dashboard/streaming.js
index 3c08107e201..9dab432cba4 100644
--- a/src/controllers/dashboard/streaming.js
+++ b/src/controllers/dashboard/streaming.js
@@ -11,7 +11,7 @@ function onSubmit() {
     loading.show();
     const form = this;
     ApiClient.getServerConfiguration().then(function (config) {
-        config.RemoteClientBitrateLimit = parseInt(1e6 * parseFloat(form.querySelector('#txtRemoteClientBitrateLimit', form).value || '0'), 10);
+        config.RemoteClientBitrateLimit = parseInt(1e6 * parseFloat(form.querySelector('#txtRemoteClientBitrateLimit').value || '0'), 10);
         ApiClient.updateServerConfiguration(config).then(Dashboard.processServerConfigurationUpdateResult);
     });
 
diff --git a/src/controllers/livetvstatus.js b/src/controllers/livetvstatus.js
index ea22c8c5092..cdcd84ee8bd 100644
--- a/src/controllers/livetvstatus.js
+++ b/src/controllers/livetvstatus.js
@@ -137,8 +137,8 @@ function renderProviders(page, providers) {
             btn.addEventListener('click', function () {
                 const id = this.getAttribute('data-id');
                 showProviderOptions(page, id, btn);
-            })
-        })
+            });
+        });
     }
 }
 
@@ -308,9 +308,9 @@ $(document).on('pageinit', '#liveTvStatusPage', function () {
     });
     if (page.querySelector('.formAddDevice')) {
         // unused?
-        page.querySelector('.formAddDevice').addEventListener('submit', function () {
+        page.querySelector('.formAddDevice').addEventListener('submit', function (e) {
+            e.preventDefault();
             submitAddDeviceForm(page);
-            return false;
         });
     }
     page.querySelector('.btnAddProvider').addEventListener('click', function () {
diff --git a/src/controllers/wizard/start/index.js b/src/controllers/wizard/start/index.js
index b323b148ee0..4eb6423b645 100644
--- a/src/controllers/wizard/start/index.js
+++ b/src/controllers/wizard/start/index.js
@@ -30,9 +30,9 @@ function save(page) {
     });
 }
 
-function onSubmit() {
+function onSubmit(e) {
+    e.preventDefault();
     save(dom.parentWithClass(this, 'page'));
-    return false;
 }
 
 export default function (view) {
diff --git a/src/scripts/editorsidebar.js b/src/scripts/editorsidebar.js
index a033ced5192..28fb8619174 100644
--- a/src/scripts/editorsidebar.js
+++ b/src/scripts/editorsidebar.js
@@ -5,7 +5,6 @@ import 'material-design-icons-iconfont';
 import globalize from 'lib/globalize';
 import Dashboard from 'utils/dashboard';
 import { getParameterByName } from 'utils/url';
-import dom from './dom';
 
 function getNode(item, folderState, selected) {
     const htmlName = getNodeInnerHtml(item);
@@ -216,7 +215,7 @@ function onNodeSelect(event, data) {
 }
 
 function onNodeOpen(_, data) {
-    const page = dom.parentWithClass(this, 'page');
+    const page = $(this).parents('.page')[0];
     const node = data.node;
     if (node.children) {
         loadNodesToLoad(page, node);