eslint related file edits

extensions-builtin/prompt-bracket-checker/javascript/prompt-bracket-checker.js

@@ -5,7 +5,7 @@
 
 function checkBrackets(textArea, counterElt) {
     var counts = {};
-    (textArea.value.match(/[(){}\[\]]/g) || []).forEach(bracket => {
+    (textArea.value.match(/[(){}[\]]/g) || []).forEach(bracket => {
         counts[bracket] = (counts[bracket] || 0) + 1;
     });
     var errors = [];

javascript/aspectRatioOverlay.js

@@ -50,21 +50,21 @@ function dimensionChange(e, is_width, is_height) {
         var scaledx = targetElement.naturalWidth * viewportscale;
         var scaledy = targetElement.naturalHeight * viewportscale;
 
-        var cleintRectTop    = (viewportOffset.top + window.scrollY);
+        var cleintRectTop = (viewportOffset.top + window.scrollY);
-        var cleintRectLeft   = (viewportOffset.left + window.scrollX);
+        var cleintRectLeft = (viewportOffset.left + window.scrollX);
-        var cleintRectCentreY = cleintRectTop  + (targetElement.clientHeight / 2);
+        var cleintRectCentreY = cleintRectTop + (targetElement.clientHeight / 2);
         var cleintRectCentreX = cleintRectLeft + (targetElement.clientWidth / 2);
 
         var arscale = Math.min(scaledx / currentWidth, scaledy / currentHeight);
         var arscaledx = currentWidth * arscale;
         var arscaledy = currentHeight * arscale;
 
-        var arRectTop    = cleintRectCentreY - (arscaledy / 2);
+        var arRectTop = cleintRectCentreY - (arscaledy / 2);
-        var arRectLeft   = cleintRectCentreX - (arscaledx / 2);
+        var arRectLeft = cleintRectCentreX - (arscaledx / 2);
-        var arRectWidth  = arscaledx;
+        var arRectWidth = arscaledx;
         var arRectHeight = arscaledy;
 
-        arPreviewRect.style.top  = arRectTop + 'px';
+        arPreviewRect.style.top = arRectTop + 'px';
         arPreviewRect.style.left = arRectLeft + 'px';
         arPreviewRect.style.width = arRectWidth + 'px';
         arPreviewRect.style.height = arRectHeight + 'px';

javascript/contextMenus.js

@@ -1,5 +1,5 @@
 
-contextMenuInit = function() {
+var contextMenuInit = function() {
     let eventListenerApplied = false;
     let menuSpecs = new Map();
 
@@ -126,10 +126,10 @@ contextMenuInit = function() {
     return [appendContextMenuOption, removeContextMenuOption, addContextMenuEventListener];
 };
 
-initResponse = contextMenuInit();
+var initResponse = contextMenuInit();
-appendContextMenuOption     = initResponse[0];
+var appendContextMenuOption = initResponse[0];
-removeContextMenuOption     = initResponse[1];
+var removeContextMenuOption = initResponse[1];
-addContextMenuEventListener = initResponse[2];
+var addContextMenuEventListener = initResponse[2];
 
 (function() {
     //Start example Context Menu Items

javascript/extraNetworks.js

@@ -63,8 +63,8 @@ function setupExtraNetworks() {
 
 onUiLoaded(setupExtraNetworks);
 
-var re_extranet   =    /<([^:]+:[^:]+):[\d\.]+>/;
+var re_extranet = /<([^:]+:[^:]+):[\d.]+>/;
-var re_extranet_g = /\s+<([^:]+:[^:]+):[\d\.]+>/g;
+var re_extranet_g = /\s+<([^:]+:[^:]+):[\d.]+>/g;
 
 function tryToRemoveExtraNetworkFromPrompt(textarea, text) {
     var m = text.match(re_extranet);

javascript/generationParams.js

@@ -10,7 +10,7 @@ onUiUpdate(function() {
     }
     if (!modal) {
         modal = gradioApp().getElementById('lightboxModal');
-        modalObserver.observe(modal,  { attributes: true, attributeFilter: ['style'] });
+        modalObserver.observe(modal, {attributes: true, attributeFilter: ['style']});
     }
 });
 

javascript/hints.js

@@ -1,6 +1,6 @@
 // mouseover tooltips for various UI elements
 
-titles = {
+var titles = {
     "Sampling steps": "How many times to improve the generated image iteratively; higher values take longer; very low values can produce bad results",
     "Sampling method": "Which algorithm to use to produce the image",
     "GFPGAN": "Restore low quality faces using GFPGAN neural network",
@@ -118,7 +118,7 @@ titles = {
 
 onUiUpdate(function() {
     gradioApp().querySelectorAll('span, button, select, p').forEach(function(span) {
-        if (span.title) return;  // already has a title
+        if (span.title) return; // already has a title
 
         let tooltip = localization[titles[span.textContent]] || titles[span.textContent];
 

javascript/imageMaskFix.js

@@ -5,7 +5,6 @@
 function imageMaskResize() {
     const canvases = gradioApp().querySelectorAll('#img2maskimg .touch-none canvas');
     if (!canvases.length) {
-        canvases_fixed = false; // TODO: this is unused..?
         window.removeEventListener('resize', imageMaskResize);
         return;
     }

javascript/imageviewer.js

@@ -37,6 +37,7 @@ function updateOnBackgroundChange() {
         if (currentButton?.children?.length > 0 && modalImage.src != currentButton.children[0].src) {
             modalImage.src = currentButton.children[0].src;
             if (modalImage.style.display === 'none') {
+                const modal = gradioApp().getElementById("lightboxModal");
                 modal.style.setProperty('background-image', `url(${modalImage.src})`);
             }
         }
@@ -169,12 +170,6 @@ function modalTileImageToggle(event) {
     event.stopPropagation();
 }
 
-function galleryImageHandler(e) {
-    //if (e && e.parentElement.tagName == 'BUTTON') {
-    e.onclick = showGalleryImage;
-    //}
-}
-
 onUiUpdate(function() {
     var fullImg_preview = gradioApp().querySelectorAll('.gradio-gallery > div > img');
     if (fullImg_preview != null) {

javascript/localization.js

@@ -1,10 +1,9 @@
 
 // localization = {} -- the dict with translations is created by the backend
 
-ignore_ids_for_localization = {
+var ignore_ids_for_localization = {
     setting_sd_hypernetwork: 'OPTION',
     setting_sd_model_checkpoint: 'OPTION',
-    setting_realesrgan_enabled_models: 'OPTION',
     modelmerger_primary_model_name: 'OPTION',
     modelmerger_secondary_model_name: 'OPTION',
     modelmerger_tertiary_model_name: 'OPTION',
@@ -19,11 +18,11 @@ ignore_ids_for_localization = {
     extras_upscaler_2: 'SPAN',
 };
 
-re_num = /^[\.\d]+$/;
+var re_num = /^[.\d]+$/;
-re_emoji = /[\p{Extended_Pictographic}\u{1F3FB}-\u{1F3FF}\u{1F9B0}-\u{1F9B3}]/u;
+var re_emoji = /[\p{Extended_Pictographic}\u{1F3FB}-\u{1F3FF}\u{1F9B0}-\u{1F9B3}]/u;
 
-original_lines = {};
+var original_lines = {};
-translated_lines = {};
+var translated_lines = {};
 
 function hasLocalization() {
     return window.localization && Object.keys(window.localization).length > 0;
@@ -31,7 +30,7 @@ function hasLocalization() {
 
 function textNodesUnder(el) {
     var n, a = [], walk = document.createTreeWalker(el, NodeFilter.SHOW_TEXT, null, false);
-    while (n = walk.nextNode()) a.push(n);
+    while ((n = walk.nextNode())) a.push(n);
     return a;
 }
 
@@ -64,7 +63,7 @@ function getTranslation(text) {
         original_lines[text] = 1;
     }
 
-    tl = localization[text];
+    var tl = localization[text];
     if (tl !== undefined) {
         translated_lines[tl] = 1;
     }
@@ -77,7 +76,7 @@ function processTextNode(node) {
 
     if (!canBeTranslated(node, text)) return;
 
-    tl = getTranslation(text);
+    var tl = getTranslation(text);
     if (tl !== undefined) {
         node.textContent = tl;
     }
@@ -90,14 +89,14 @@ function processNode(node) {
     }
 
     if (node.title) {
-        tl = getTranslation(node.title);
+        let tl = getTranslation(node.title);
         if (tl !== undefined) {
             node.title = tl;
         }
     }
 
     if (node.placeholder) {
-        tl = getTranslation(node.placeholder);
+        let tl = getTranslation(node.placeholder);
         if (tl !== undefined) {
             node.placeholder = tl;
         }
@@ -157,21 +156,21 @@ document.addEventListener("DOMContentLoaded", function() {
 
     processNode(gradioApp());
 
-    if (localization.rtl) {  // if the language is from right to left,
+    if (localization.rtl) { // if the language is from right to left,
         (new MutationObserver((mutations, observer) => { // wait for the style to load
             mutations.forEach(mutation => {
                 mutation.addedNodes.forEach(node => {
                     if (node.tagName === 'STYLE') {
                         observer.disconnect();
 
-                        for (const x of node.sheet.rules) {  // find all rtl media rules
+                        for (const x of node.sheet.rules) { // find all rtl media rules
                             if (Array.from(x.media || []).includes('rtl')) {
-                                x.media.appendMedium('all');  // enable them
+                                x.media.appendMedium('all'); // enable them
                             }
                         }
                     }
                 });
             });
-        })).observe(gradioApp(), { childList: true });
+        })).observe(gradioApp(), {childList: true});
     }
 });

javascript/progressbar.js

@@ -53,7 +53,7 @@ function setTitle(progress) {
     }
 
     if (document.title != title) {
-        document.title =  title;
+        document.title = title;
     }
 }
 
@@ -144,7 +144,7 @@ function requestProgress(id_task, progressbarContainer, gallery, atEnd, onProgre
 
 
             if (res.live_preview && gallery) {
-                var rect = gallery.getBoundingClientRect();
+                rect = gallery.getBoundingClientRect();
                 if (rect.width) {
                     livePreview.style.width = rect.width + "px";
                     livePreview.style.height = rect.height + "px";

javascript/ui.js

@@ -99,13 +99,6 @@ function switch_to_inpaint_sketch() {
     return args_to_array(arguments);
 }
 
-function switch_to_inpaint() {
-    gradioApp().querySelector('#tabs').querySelectorAll('button')[1].click();
-    gradioApp().getElementById('mode_img2img').querySelectorAll('button')[2].click();
-
-    return args_to_array(arguments);
-}
-
 function switch_to_extras() {
     gradioApp().querySelector('#tabs').querySelectorAll('button')[2].click();
 
@@ -172,7 +165,6 @@ function showRestoreProgressButton(tabname, show) {
 }
 
 function submit() {
-    rememberGallerySelection('txt2img_gallery');
     showSubmitButtons('txt2img', false);
 
     var id = randomId();
@@ -192,7 +184,6 @@ function submit() {
 }
 
 function submit_img2img() {
-    rememberGallerySelection('img2img_gallery');
     showSubmitButtons('img2img', false);
 
     var id = randomId();
@@ -273,7 +264,7 @@ function confirm_clear_prompt(prompt, negative_prompt) {
 }
 
 
-promptTokecountUpdateFuncs = {};
+var promptTokecountUpdateFuncs = {};
 
 function recalculatePromptTokens(name) {
     if (promptTokecountUpdateFuncs[name]) {
@@ -304,7 +295,8 @@ onUiUpdate(function() {
     var textarea = json_elem.querySelector('textarea');
     var jsdata = textarea.value;
     opts = JSON.parse(jsdata);
-    executeCallbacks(optionsChangedCallbacks);
+
+    executeCallbacks(optionsChangedCallbacks); /*global optionsChangedCallbacks*/
 
     Object.defineProperty(textarea, 'value', {
         set: function(newValue) {
@@ -390,7 +382,9 @@ function update_txt2img_tokens(...args) {
 }
 
 function update_img2img_tokens(...args) {
-    update_token_counter("img2img_token_button");
+    update_token_counter(
+        "img2img_token_button"
+    );
     if (args.length == 2) {
         return args[0];
     }
@@ -423,7 +417,7 @@ function restart_reload() {
 // Simulate an `input` DOM event for Gradio Textbox component. Needed after you edit its contents in javascript, otherwise your edits
 // will only visible on web page and not sent to python.
 function updateInput(target) {
-    let e = new Event("input", { bubbles: true });
+    let e = new Event("input", {bubbles: true});
     Object.defineProperty(e, "target", {value: target});
     target.dispatchEvent(e);
 }
@@ -435,7 +429,7 @@ function selectCheckpoint(name) {
     gradioApp().getElementById('change_checkpoint').click();
 }
 
-function currentImg2imgSourceResolution(_, _, scaleBy) {
+function currentImg2imgSourceResolution(w, h, scaleBy) {
     var img = gradioApp().querySelector('#mode_img2img > div[style="display: block;"] img');
     return img ? [img.naturalWidth, img.naturalHeight, scaleBy] : [0, 0, scaleBy];
 }

javascript/ui_settings_hints.js

@@ -1,6 +1,6 @@
 // various hints and extra info for the settings tab
 
-settingsHintsSetup = false;
+var settingsHintsSetup = false;
 
 onOptionsChanged(function() {
     if (settingsHintsSetup) return;
@@ -30,7 +30,7 @@ onOptionsChanged(function() {
             span.parentElement.insertBefore(document.createTextNode('\xa0'), span);
         }
         if (commentAfter) {
-            var comment = document.createElement('DIV');
+            comment = document.createElement('DIV');
             comment.className = 'settings-comment';
             comment.innerHTML = commentAfter;
             span.parentElement.insertBefore(comment, span.nextSibling);
@@ -50,7 +50,7 @@ function settingsHintsShowQuicksettings() {
             td.textContent = obj.name;
             tr.appendChild(td);
 
-            var td = document.createElement('td');
+            td = document.createElement('td');
             td.textContent = obj.label;
             tr.appendChild(td);
 

script.js

@@ -18,11 +18,11 @@ function get_uiCurrentTabContent() {
     return gradioApp().querySelector('.tabitem[id^=tab_]:not([style*="display: none"])');
 }
 
-uiUpdateCallbacks = [];
+var uiUpdateCallbacks = [];
-uiLoadedCallbacks = [];
+var uiLoadedCallbacks = [];
-uiTabChangeCallbacks = [];
+var uiTabChangeCallbacks = [];
-optionsChangedCallbacks = [];
+var optionsChangedCallbacks = [];
-let uiCurrentTab = null;
+var uiCurrentTab = null;
 
 function onUiUpdate(callback) {
     uiUpdateCallbacks.push(callback);
@@ -66,7 +66,7 @@ document.addEventListener("DOMContentLoaded", function() {
             executeCallbacks(uiTabChangeCallbacks);
         }
     });
-    mutationObserver.observe(gradioApp(), { childList: true, subtree: true });
+    mutationObserver.observe(gradioApp(), {childList: true, subtree: true});
 });
 
 /**
@@ -80,7 +80,7 @@ document.addEventListener('keydown', function(e) {
         if ((e.keyCode == 13 && (e.metaKey || e.ctrlKey || e.altKey))) handled = true;
     }
     if (handled) {
-        button = get_uiCurrentTabContent().querySelector('button[id$=_generate]');
+        var button = get_uiCurrentTabContent().querySelector('button[id$=_generate]');
         if (button) {
             button.click();
         }
@@ -97,7 +97,7 @@ function uiElementIsVisible(el) {
         return false;
     }
 
-    while (isVisible = el.closest('.tabitem')?.style.display !== 'none') {
+    while ((isVisible = el.closest('.tabitem')?.style.display) !== 'none') {
         if (!isVisible) {
             return false;
         } else if (el.parentElement) {