- replace top bar toggle animations with opacity fades - refactor MovingUI - refactor getWorldEntry

edbc257e8167c13e4642dbb3e74425fcdc9a4802

RossAscends <124905043+RossAscends@users.noreply.github.com>

Parents: e08d1b522c6a23017d3c2e2bd44860affbba2e6f

public/script.js+89 -53 Viewed

     doNavbarIconClick.call(drawerToggle);
+}
++
 +// Helper for animating open/close (opacity only)
 +async function animateDrawer($el, open, displayStyle = 'block', onEnd) {
 +    //const slideOptions = getSlideToggleOptions();
 +    const duration = 250;
 +    const easing = 'swing';
 +    $el.stop(true, true);
++
 +    if (open) {
 +        $el.css({ display: displayStyle, opacity: 0 });
 +        $el.animate(
 +            { opacity: 1 },
 +            {
 +                duration,
 +                easing,
 +                complete: function () {
 +                    $el.css({ opacity: '', display: displayStyle });
 +                    if (typeof onEnd === 'function') onEnd(this);
 +                },
 +            },
 +        );
 +    } else {
 +        $el.animate(
 +            { opacity: 0 },
 +            {
 +                duration,
 +                easing,
 +                complete: function () {
 +                    $el.css({ display: 'none', opacity: '0' });
 +                    if (typeof onEnd === 'function') onEnd(this);
 +                },
 +            },
 +        );
 +    }
 +}
++
 /**
  * Event handler to open or close a navbar drawer when a navbar icon is clicked.
  * Handles click events on .drawer-toggle elements.
  * @returns {void}
  */
 -function doNavbarIconClick() {
 +// ...existing code...
 +export async function doNavbarIconClick() {
 +    //console.warn('called for, ', $(this));
     const icon = $(this).find('.drawer-icon');
     const drawer = $(this).parent().find('.drawer-content');
     if (drawer.hasClass('resizing')) { return; }

     const pinnedDrawerClicked = drawer.hasClass('pinnedOpen');
     if (!drawerWasOpenAlready) { // to open the drawer
 -        $('.openDrawer').not('.pinnedOpen').addClass('resizing').each((_, el) => {
 +        // Close all open drawers except pinned ones
 -            slideToggle(el, {
 +        const $openDrawers = $('.openDrawer:not(.pinnedOpen)');
 -                ...getSlideToggleOptions(),
 +        for (const el of $openDrawers) {
 -                onAnimationEnd: function (el) {
 +            $(el).addClass('resizing');
 -                    el.closest('.drawer-content').classList.remove('resizing');
 +            await animateDrawer($(el), false, undefined, function (el) {
 -                },
 +                $(el).closest('.drawer-content').removeClass('resizing');
 -            });
             });
 -        $('.openIcon').not('.drawerPinnedOpen').toggleClass('closedIcon openIcon');
 +        }
 -        $('.openDrawer').not('.pinnedOpen').toggleClass('closedDrawer openDrawer');
++
 +        // Toggle icon and drawer classes
 +        const $openIcons = $('.openIcon:not(.drawerPinnedOpen)');
 +        for (const iconEl of $openIcons) {
 +            $(iconEl).toggleClass('closedIcon openIcon');
 +        }
 +        for (const el of $openDrawers) {
 +            $(el).toggleClass('closedDrawer openDrawer');
 +        }
         icon.toggleClass('openIcon closedIcon');
         drawer.toggleClass('openDrawer closedDrawer');
 -        //console.log(targetDrawerID);
 +        // Open the target drawer
 +        const $drawerContents = $(this).closest('.drawer').find('.drawer-content');
 +        for (const el of $drawerContents) {
 +            $(el).addClass('resizing');
             if (targetDrawerID === 'right-nav-panel') {
 -            $(this).closest('.drawer').find('.drawer-content').addClass('resizing').each((_, el) => {
 +                await animateDrawer($(el), true, 'flex', function (el) {
 -                slideToggle(el, {
 +                    $(el).closest('.drawer-content').removeClass('resizing');
 -                    ...getSlideToggleOptions(),
 -                    elementDisplayStyle: 'flex',
 -                    onAnimationEnd: function (el) {
 -                        el.closest('.drawer-content').classList.remove('resizing');
                     favsToHotswap();
                     $('#rm_print_characters_block').trigger('scroll');
 -                    },
 -                });
                 });
             } else {
 -            $(this).closest('.drawer').find('.drawer-content').addClass('resizing').each((_, el) => {
 +                await animateDrawer($(el), true, undefined, function (el) {
 -                slideToggle(el, {
 +                    $(el).closest('.drawer-content').removeClass('resizing');
 -                    ...getSlideToggleOptions(),
 -                    onAnimationEnd: function (el) {
 -                        el.closest('.drawer-content').classList.remove('resizing');
 -                    },
 -                });
                 });
+            }
 +        }
         // Set the height of "autoSetHeight" textareas within the drawer to their scroll height
         if (!CSS.supports('field-sizing', 'content')) {
             const textareas = $(this).closest('.drawer').find('.drawer-content textarea.autoSetHeight').each(async function () {;
 -                await resetScrollHeight($(this));
 +            for (const textarea of textareas) {
 +                await resetScrollHeight($(textarea));
                 return;
             });
+        }
     } else if (drawerWasOpenAlready) { // to close manually
 +        console.warn('saw drawer was already open');
         icon.toggleClass('closedIcon openIcon');
         if (pinnedDrawerClicked) {
             $(drawer).addClass('resizing').each((_, el) => {
 -                slideToggle(el, {
 +                animateDrawer($(el), false, undefined, function (el) {
 -                    ...getSlideToggleOptions(),
 -                    onAnimationEnd: function (el) {
                     el.classList.remove('resizing');
 -                    },
                 });
             });
+        }
         else {
 +            console.warn('not pinned drawer');
             $('.openDrawer').not('.pinnedOpen').addClass('resizing').each((_, el) => {
 -                slideToggle(el, {
 +                animateDrawer($(el), false, undefined, function (el) {
 -                    ...getSlideToggleOptions(),
 -                    onAnimationEnd: function (el) {
                     el.closest('.drawer-content').classList.remove('resizing');
 -                    },
                 });
             });
+        }

@@ -10403,7 +10438,7 @@ function doNavbarIconClick() {
10403	10438	drawer.toggleClass('closedDrawer openDrawer');
10404	10439	}
10405	10440	}
10406		-
	10441	+// ...existing code...
10407	10442	function addDebugFunctions() {
10408	10443	const doBackfill = async () => {
10409	10444	for (const message of chat) {

     $('.drawer-toggle').on('click', doNavbarIconClick);
     $('html').on('touchstart mousedown', async function (e) {
         var clickTarget = $(e.target);
         if (isExportPopupOpen

+            }
+        }
++
 +        // This autocloses open drawers that are not pinned if a click happens inside the app which does not target them.
         var targetParentHasOpenDrawer = clickTarget.parents('.openDrawer').length;
         if (!clickTarget.hasClass('drawer-icon') == false && !clickTarget.hasClass('openDrawer')) {
 -            if ($('.openDrawer').length !== 0) {
 +            const $openDrawers = $('.openDrawer').not('.pinnedOpen');
                             if ($openDrawers.length && targetParentHasOpenDrawer === 0) {
 -                    //console.log($('.openDrawer').not('.pinnedOpen').length);
 +                // Animate close for each open drawer
 -                    $('.openDrawer').not('.pinnedOpen').addClass('resizing').each((_, el) => {
 +                for (const el of $openDrawers) {
 -                        slideToggle(el, {
 +                    $(el).addClass('resizing');
 -                            ...getSlideToggleOptions(),
 +                    // Use the same animateDrawer helper as in doNavbarIconClick
 -                            onAnimationEnd: (el) => {
 +                    await animateDrawer($(el), false, undefined, function (el) {
                                                         $(el).closest('.drawer-content').classList.removeremoveClass('resizing');
 -                            },
 +                    });
 -                        });
 +                }
 -                    });
 +                // Toggle icon and drawer classes after animation
                 $('.openIcon').not('.drawerPinnedOpen').toggleClass('closedIcon openIcon');
                                     $('.openDrawer').not('.pinnedOpen')openDrawers.toggleClass('closedDrawer openDrawer');
 -                }
+            }
+        }
     });

public/scripts/RossAscends-mods.js+136 -184 Viewed

     menu_type,
     substituteParams,
     sendTextareaMessage,
     getSlideToggleOptionsdoNavbarIconClick,
 } from '../script.js';
 import {

 // Make the DIV element draggable:
 -export function dragElement(elmnt) {
 +/**
 -    var isHeaderBeingDragged = false;
 + * Make the given element draggable. This is used for Moving UI.
 -    var isMouseDown = false;
 + * @param {JQuery} $elmnt - The element to make draggable.
 + */
 +export function dragElement($elmnt) {
 +    let actionType = null; // "drag" or "resize"
 +    let isMouseDown = false;
     varlet pos1 = 0, pos2 = 0, pos3 = 0, pos4 = 0;
     varlet height, width, top, left, right, bottom,
         maxX, maxY, winHeight, winWidth,
         topbar, topBarFirstX, topBarLastY;
     varconst elmntName = $elmnt.attr('id');
 -    console.debug(`dragElement called for ${elmntName}`);
     const elmntNameEscaped = $.escapeSelector(elmntName);
     const $elmntHeader = $(`#${elmntNameEscaped}header`);
 -    if (elmntHeader.length) {
 +    // Helper: Save position/size to state and emit events
 -        elmntHeader.off('mousedown').on('mousedown', (e) => { //listener for drag handle repositioning
 +    function savePositionAndSize() {
 -            isHeaderBeingDragged = true;
 +        if (!power_user.movingUIState[elmntName]) power_user.movingUIState[elmntName] = {};
 -            isMouseDown = true;
 +        power_user.movingUIState[elmntName].top = top;
 -            observer.observe(elmnt.get(0), { attributes: true, attributeFilter: ['style'] });
 +        power_user.movingUIState[elmntName].left = left;
 -            dragMouseDown(e);
 +        power_user.movingUIState[elmntName].right = right;
 -        });
 +        power_user.movingUIState[elmntName].bottom = bottom;
 -        $(elmnt).off('mousedown').on('mousedown', () => { //listener for resize
 +        power_user.movingUIState[elmntName].margin = 'unset';
 -            isMouseDown = true;
 +        if (actionType === 'resize') {
 -            observer.observe(elmnt.get(0), { attributes: true, attributeFilter: ['style'] });
 +            power_user.movingUIState[elmntName].width = width;
 -        });
 +            power_user.movingUIState[elmntName].height = height;
 +            eventSource.emit('resizeUI', elmntName);
 +        }
 +        saveSettingsDebounced();
+    }
 +    // Helper: Clamp element within viewport
 +    function clampToViewport() {
 +        if (top <= 0) $elmnt.css('top', '0px');
 +        else if (maxY >= winHeight) $elmnt.css('top', winHeight - maxY + top - 1 + 'px');
 +        if (left <= 0) $elmnt.css('left', '0px');
 +        else if (maxX >= winWidth) $elmnt.css('left', winWidth - maxX + left - 1 + 'px');
 +    }
++
 +    // Observer for style changes (position/size)
     const observer = new MutationObserver((mutations) => {
         const $target = $(mutations[0].target);
 -        if (!$(target).is(':visible') //abort if element is invisible
 +        if (
 -            || $(target).hasClass('resizing') //being auto-resized by other JS code
 +            !$target.is(':visible') ||
 -            || Number((String(target.height).replace('px', ''))) < 50 //too short
 +            $target.hasClass('resizing') ||
 -            || Number((String(target.width).replace('px', ''))) < 50 //too narrow
 +            $target.height() < 50 ||
 -            || power_user.movingUI === false // if MUI is not turned on
 +            $target.width() < 50 ||
 -            || isMobile() // if it's a mobile screen
 +            power_user.movingUI === false ||
 +            isMobile() ||
 +            !isMouseDown
         ) {
 +            observer.disconnect();
             return;
+        }
         const style = getComputedStyle($target[0]);
         height = parseInt(style.height);
         width = parseInt(style.width);
         top = parseInt(style.top);
         left = parseInt(style.left);
         right = parseInt(style.right);
         bottom = parseInt(style.bottom);
         maxX = parseInt(width + left);
         maxY = parseInt(height + top);
         winWidth = window.innerWidth;
         winHeight = window.innerHeight;

         topBarFirstX = parseInt(topbarstyle.marginInline);
         topBarLastY = parseInt(topbarstyle.height);
 -        //prepare an empty poweruser object for the item being altered if we don't have one already
 +        // Prepare state object if missing
         if (!power_user.movingUIState[elmntName]) power_user.movingUIState[elmntName] = {};
 -            console.debug(`adding config property for ${elmntName}`);
 -            power_user.movingUIState[elmntName] = {};
 -        }
 -        //handle resizing
 +        if (actionType === 'resize') {
 -        if (!isHeaderBeingDragged && isMouseDown) { //if user is dragging the resize handle (not in header)
 -            let imgHeight, imgWidth, imageAspectRatio;
             let containerAspectRatio = height / width;
+-
 +            if ($elmnt.attr('id').startsWith('zoomFor_')) {
 -            //force aspect ratio for zoomed avatars
 +                const zoomedAvatarImage = $elmnt.find('.zoomed_avatar_img');
 -            if ($(elmnt).attr('id').startsWith('zoomFor_')) {
 +                const imgHeight = zoomedAvatarImage.height();
                 letconst zoomedAvatarImageimgWidth = $(elmnt)zoomedAvatarImage.findwidth('.zoomed_avatar_img');
 -                imgHeight = zoomedAvatarImage.height();
 +                const imageAspectRatio = imgHeight / imgWidth;
 -                imgWidth = zoomedAvatarImage.width();
 -                imageAspectRatio = imgHeight / imgWidth;
+-
 -                // Maintain aspect ratio
                 if (containerAspectRatio !== imageAspectRatio) {
                     $elmnt.css('width', $elmnt.width());
                     $elmnt.css('height', $elmnt.width() * imageAspectRatio);
 -                }
+-
 -                // Prevent resizing offscreen
 -                if (top + elmnt.height() >= winHeight) {
 -                    elmnt.css('height', winHeight - top - 1 + 'px');
 -                    elmnt.css('width', (winHeight - top - 1) / imageAspectRatio + 'px');
+                }
+-
 +                if (top + $elmnt.height() >= winHeight) {
 -                if (left + elmnt.width() >= winWidth) {
 +                    $elmnt.css('height', winHeight - top - 1 + 'px');
                     $elmnt.css('width', winWidth(winHeight - lefttop - 1) / imageAspectRatio + 'px');
 -                    elmnt.css('height', (winWidth - left - 1) * imageAspectRatio + 'px');
+                }
 -            } else { //prevent divs that are not zoomedAvatars from resizing offscreen
 +                if (left + $elmnt.width() >= winWidth) {
+-
 +                    $elmnt.css('width', winWidth - left - 1 + 'px');
 -                if (top + elmnt.height() >= winHeight) {
 +                    $elmnt.css('height', (winWidth - left - 1) * imageAspectRatio + 'px');
 -                    elmnt.css('height', winHeight - top - 1 + 'px');
 -                }
+-
 -                if (left + elmnt.width() >= winWidth) {
 -                    elmnt.css('width', winWidth - left - 1 + 'px');
+                }
 +            } else {
 +                if (top + $elmnt.height() >= winHeight) $elmnt.css('height', winHeight - top - 1 + 'px');
 +                if (left + $elmnt.width() >= winWidth) $elmnt.css('width', winWidth - left - 1 + 'px');
+            }
+-
 -            //prevent resizing from top left into the top bar
             if (top < topBarLastY && maxX >= topBarFirstX && left <= topBarFirstX) {
                 $elmnt.css('width', width - 1 + 'px');
 -            }
+-
 -            //set css to prevent weird resize behavior (does not save)
 -            elmnt.css('left', left);
 -            elmnt.css('top', top);
+-
 -            //set a listener for mouseup to save new width/height
 -            $(window).off('mouseup').on('mouseup', () => {
 -                console.log(`Saving ${elmntName} Height/Width`);
 -                // check if the height or width actually changed
 -                if (power_user.movingUIState[elmntName].width === elmnt.width() && power_user.movingUIState[elmntName].height === elmnt.height()) {
 -                    console.log('no change detected, aborting save');
 -                    return;
+            }
+-
 +            $elmnt.css({ left, top });
 -                power_user.movingUIState[elmntName].width = width;
 +            $elmnt.off('mouseup').on('mouseup', () => {
 -                power_user.movingUIState[elmntName].height = height;
 +                if (
 -                eventSource.emit('resizeUI', elmntName);
 +                    power_user.movingUIState[elmntName].width === $elmnt.width() &&
 -                saveSettingsDebounced();
 +                    power_user.movingUIState[elmntName].height === $elmnt.height()
                 imgHeight =) nullreturn;
 -                imgWidth = null;
 +                savePositionAndSize();
 -                height = null;
 +                observer.disconnect();
 -                width = null;
+-
 -                containerAspectRatio = null;
 -                imageAspectRatio = null;
 -                $(window).off('mouseup');
             });
 +        } else if (actionType === 'drag') {
 +            clampToViewport();
+        }
 -        //only record position changes if header is being dragged
 +        // Always update position in state
 -        power_user.movingUIState[elmntName].top = top;
 +        savePositionAndSize();
 -        power_user.movingUIState[elmntName].left = left;
 -        power_user.movingUIState[elmntName].right = right;
 -        power_user.movingUIState[elmntName].bottom = bottom;
 -        power_user.movingUIState[elmntName].margin = 'unset';
+-
 -        //handle dragging hit detection to prevent dragging offscreen
 -        if (isHeaderBeingDragged && isMouseDown) {
+-
 -            if (top <= 0) {
 -                elmnt.css('top', '0px');
 -            } else if (maxY >= winHeight) {
 -                elmnt.css('top', winHeight - maxY + top - 1 + 'px');
 -            }
+-
 -            if (left <= 0) {
 -                elmnt.css('left', '0px');
 -            } else if (maxX >= winWidth) {
 -                elmnt.css('left', winWidth - maxX + left - 1 + 'px');
 -            }
 -        }
+-
 -        // Check if the element header exists and set the reposition listener on the grabber in the header
 -        if (elmntHeader.length) {
 -            elmntHeader.off('mousedown').on('mousedown', (e) => {
 -                dragMouseDown(e);
 -            });
 -        } else { //if no header, put the listener on the elmnt itself.
 -            elmnt.off('mousedown').on('mousedown', dragMouseDown);
 -        }
     });
 +    // Mouse event handlers
     function dragMouseDown(e) {
+-
         if (e) {
             isHeaderBeingDraggedactionType = true'drag';
 +            isMouseDown = true;
             e.preventDefault();
             pos3 = e.clientX; //mouse X at click
             pos4 = e.clientY; //mouse Y at click
+        }
         $(document).on('mouseup', closeDragElement);
         $(document).on('mousemove', elementDrag);
+    }
     function elementDrag(e) {
         if (!power_user.movingUIState[elmntName]) power_user.movingUIState[elmntName] = {};
 -            power_user.movingUIState[elmntName] = {};
 -        }
+-
 -        e = e || window.event;
         e.preventDefault();
+-
 +        pos1 = pos3 - e.clientX;
 -        pos1 = pos3 - e.clientX;    //X change amt (-1 or 1)
 +        pos2 = pos4 - e.clientY;
 -        pos2 = pos4 - e.clientY;    //Y change amt (-1 or 1)
 +        pos3 = e.clientX;
         pos3pos4 = e.clientXclientY;   //new mouse X
 -        pos4 = e.clientY;   //new mouse Y
 +        $elmnt.attr('data-dragged', 'true');
+-
 +        $elmnt.css('left', ($elmnt.offset().left - pos1) + 'px');
 -        elmnt.attr('data-dragged', 'true');
 +        $elmnt.css('top', ($elmnt.offset().top - pos2) + 'px');
+-
 +        $elmnt.css('margin', 'unset');
 -        //first set css to computed values to avoid CSS NaN results from 'auto', etc
 +        $elmnt.css('height', height);
         $elmnt.css('leftwidth', (elmnt.offset().left) + 'px'width);
 -        elmnt.css('top', (elmnt.offset().top) + 'px');
+-
 -        //then update element position styles to account for drag changes
 -        elmnt.css('margin', 'unset');
 -        elmnt.css('left', (elmnt.offset().left - pos1) + 'px');
 -        elmnt.css('top', (elmnt.offset().top - pos2) + 'px');
 -        /*         elmnt.css('right', ((winWidth - maxX) + 'px'));
 -                elmnt.css('bottom', ((winHeight - maxY) + 'px')); */
+-
 -        // Height/Width here are for visuals only, and are not saved to settings.
 -        // This is required because some divs do hot have a set width/height
 -        // and will default to shrink to min value of 100px set in CSS file
 -        elmnt.css('height', height);
 -        elmnt.css('width', width);
 -        return;
+    }
     function closeDragElement() {
 -        console.debug('drag finished');
 -        isHeaderBeingDragged = false;
         isMouseDown = false;
 +        actionType = null;
         $(document).off('mouseup', closeDragElement);
         $(document).off('mousemove', elementDrag);
         $('body')elmnt.cssattr('overflowdata-dragged', 'false');
 -        // Clear the "data-dragged" attribute
 -        elmnt.attr('data-dragged', 'false');
         observer.disconnect();
 -        console.debug(`Saving ${elmntName} UI position`);
 +        savePositionAndSize();
 -        saveSettingsDebounced();
 -        top = null;
 -        left = null;
 -        right = null;
 -        bottom = null;
 -        maxX = null;
 -        maxY = null;
+    }
++
 +    // Setup event listeners
 +    if ($elmntHeader.length) {
 +        $elmntHeader.off('mousedown').on('mousedown', (e) => {
 +            if ($(e.target).hasClass('drag-grabber')) {
 +                actionType = 'drag';
 +                isMouseDown = true;
 +                observer.observe($elmnt[0], { attributes: true, attributeFilter: ['style'] });
 +                dragMouseDown(e);
 +            }
 +        });
 +    }
++
 +    $elmnt.off('mousedown').on('mousedown', (e) => {
 +        const rect = $elmnt[0].getBoundingClientRect();
 +        const resizeMargin = 16;
 +        const isNearRight = e.clientX > rect.right - resizeMargin;
 +        const isNearBottom = e.clientY > rect.bottom - resizeMargin;
 +        if (isNearRight && isNearBottom) {
 +            actionType = 'resize';
 +            isMouseDown = true;
 +            observer.observe($elmnt[0], { attributes: true, attributeFilter: ['style'] });
 +        }
 +    });
++
 +    $elmnt.off('mouseup').on('mouseup', () => {
 +        isMouseDown = false;
 +        actionType = null;
 +        observer.disconnect();
 +    });
+}
 export async function initMovingUI() {

             $(RightNavDrawerIcon).removeClass('drawerPinnedOpen');
             if ($(RightNavPanel).hasClass('openDrawer') && $('.openDrawer').length > 1) {
 -                slideToggle(RightNavPanel, getSlideToggleOptions());
 +                const toggle = $('#unimportantYes');
 -                $(RightNavDrawerIcon).toggleClass('closedIcon openIcon');
 +                doNavbarIconClick.call(toggle);
 -                $(RightNavPanel).toggleClass('openDrawer closedDrawer');
+            }
+        }
     });

             $(LeftNavDrawerIcon).removeClass('drawerPinnedOpen');
             if ($(LeftNavPanel).hasClass('openDrawer') && $('.openDrawer').length > 1) {
 -                slideToggle(LeftNavPanel, getSlideToggleOptions());
 +                const toggle = $('#ai-config-button>.drawer-toggle');
 -                $(LeftNavDrawerIcon).toggleClass('closedIcon openIcon');
 +                doNavbarIconClick.call(toggle);
 -                $(LeftNavPanel).toggleClass('openDrawer closedDrawer');
+            }
+        }
     });
     $(WIPanelPin).on('click', async function () {
         accountStorage.setItem('WINavLockOn', $(WIPanelPin).prop('checked'));
         if ($(WIPanelPin).prop('checked') == true) {
             console.debug('adding pin class to WI');

             if ($(WorldInfo).hasClass('openDrawer') && $('.openDrawer').length > 1) {
                 console.debug('closing WI after lock removal');
 -                slideToggle(WorldInfo, getSlideToggleOptions());
 +                const toggle = $('#WI-SP-button>.drawer-toggle');
 -                $(WIDrawerIcon).toggleClass('closedIcon openIcon');
 +                doNavbarIconClick.call(toggle);
 -                $(WorldInfo).toggleClass('openDrawer closedDrawer');
+            }
+        }
     });

public/scripts/world-info.js+390 -575 Viewed

@@ -966,6 +966,7 @@ export function reloadEditor(file, loadIfNotSelected = false) {
966	966	}
967	967	}
968	968
	969	+//MARK: regWISlashCommands
969	970	function registerWorldInfoSlashCommands() {
970	971	/**
971	972	* Gets a rough approximation of the current chat context.

     console.timeEnd('clearEntryList');
+}
 +//MARK: displayWorldEntries
 async function displayWorldEntries(name, data, navigation = navigation_option.none, flashOnNav = true) {
     updateEditor = async (navigation, flashOnNav = true) => await displayWorldEntries(name, data, navigation, flashOnNav);

+    }
+}
 -export async function getWorldEntry(name, data, entry) {
 +//MARK: getWorldEntry
 -    if (!data.entries[entry.uid]) {
 +function enableKeysInputHelper({ template, entry, entryPropName, originalDataValueName, name, data }) {
 -        return;
 -    }
+-
 -    const template = WI_ENTRY_EDIT_TEMPLATE.clone();
 -    template.data('uid', entry.uid);
 -    template.attr('uid', entry.uid);
+-
 -    // Init default state of WI Key toggle (=> true)
 -    if (typeof power_user.wi_key_input_plaintext === 'undefined') power_user.wi_key_input_plaintext = true;
+-
 -    /** Function to build the keys input controls @param {string} entryPropName @param {string} originalDataValueName */
 -    function enableKeysInput(entryPropName, originalDataValueName) {
     const isFancyInput = !isMobile() && !power_user.wi_key_input_plaintext;
     const input = isFancyInput ? template.find(`select[name="${entryPropName}"]`) : template.find(`textarea[name="${entryPropName}"]`);
     input.data('uid', entry.uid);
     input.on('click', function (event) {
 -            // Prevent closing the drawer on clicking the input
         event.stopPropagation();
     });
             function templateStyling(/** @type {Select2Option} */ item, { searchStyle = false } = {}) {
         const content = $('<span>').addClass('item').text(item.text).attr('title', `${item.text}\n\nClick to edit`);
         const isRegex = isValidRegex(item.text);
         if (isRegex) {
             content.html(highlightRegex(item.text));
             content.addClass('regex_item').prepend($('<span>').addClass('regex_icon').text('•*').attr('title', 'Regex'));
+        }
+-
         if (searchStyle && item.count) {
 -                // Build a wrapping element
 +            const wrapper = $('<span>').addClass('result_block').append(content);
 -                const wrapper = $('<span>').addClass('result_block')
 -                    .append(content);
             wrapper.append($('<span>').addClass('item_count').text(item.count).attr('title', `Used as a key ${item.count} ${item.count != 1 ? 'times' : 'time'} in this lorebook`));
             return wrapper;
+        }
+-
         return content;
+    }
     if (isFancyInput) {
 -            // First initialize existing values as options, before initializing select2, to speed up performance
         select2ModifyOptions(input, entry[entryPropName], { select: true, changeEventArgs: { skipReset: true, noSave: true } });
+-
         input.select2({
             ajax: dynamicSelect2DataViaAjax(() => worldEntryKeyOptionsCache),
             tags: true,

             templateResult: item => templateStyling(item, { searchStyle: true }),
             templateSelection: item => templateStyling(item),
         });
 -            input.on('change', async function (_, { skipReset, noSave } = {}) {
++
 +        // TypeScript-safe event handler
 +        /**
 +         * @param {Event} _event
 +         * @param {{ skipReset?: boolean, noSave?: boolean }} [arg]
 +         */
 +        input.on('change', async function (_event, arg) {
             const uid = $(this).data('uid');
 -                /** @type {string[]} */
             const keys = ($(this).select2('data')).map(x => x.text);
+-
 +            const skipReset = arg?.skipReset ?? false;
 -                !skipReset && await resetScrollHeight(this);
 +            const noSave = arg?.noSave ?? false;
 +            if (!skipReset) await resetScrollHeight(this);
             if (!noSave) {
                 data.entries[uid][entryPropName] = keys;
                 setWIOriginalDataValue(data, uid, originalDataValueName, data.entries[uid][entryPropName]);

+            }
             $(this).toggleClass('empty', !data.entries[uid][entryPropName].length);
         });
++
         input.toggleClass('empty', !entry[entryPropName].length);
                     input.on('select2:select', /** @type {function(*):void} */ event => updateWorldEntryKeyOptionsCache([event.params.data]));
                     input.on('select2:unselect', /** @type {function(*):void} */ event => updateWorldEntryKeyOptionsCache([event.params.data], { remove: true }));
         select2ChoiceClickSubscribe(input, target => {
             const key = $(target.closest('.regex-highlight, .item')).text();
 -                console.debug('Editing WI key', key);
+-
 -                // Remove the current key from the actual selection
             const selected = input.val();
             if (!Array.isArray(selected)) return;
             var index = selected.indexOf(getSelect2OptionId(key));
             if (index > -1) selected.splice(index, 1);
             input.val(selected).trigger('change');
 -                // Manually update the cache, that change event is not gonna trigger it
             updateWorldEntryKeyOptionsCache([key], { remove: true });
+-
 +            input.next('span.select2-container').find('textarea').val(key).trigger('input');
 -                // We need to "hack" the actual text input into the currently open textarea
 -                input.next('span.select2-container').find('textarea')
 -                    .val(key).trigger('input');
         }, { openDrawer: true });
 -        }
 +    } else {
 -        else {
 -            // Compatibility with mobile devices. On mobile we need a text input field, not a select option control, so we need its own event handlers
         template.find(`select[name="${entryPropName}"]`).hide();
         input.show();
+-
 +        /**
 -            input.on('input', async function (_, { skipReset, noSave } = {}) {
 +        * @param {Event} _event
 +        * @param {{ skipReset?: boolean, noSave?: boolean }} [arg]
 +        */
 +        input.on('change', async function (_event, arg) {
             const uid = $(this).data('uid');
             const value = String($(this).val());
 -                !skipReset && await resetScrollHeight(this);
 +            const skipReset = arg?.skipReset ?? false;
 +            const noSave = arg?.noSave ?? false;
 +            if (!skipReset) await resetScrollHeight(this);
             if (!noSave) {
                 data.entries[uid][entryPropName] = splitKeywordsAndRegexes(value);
                 setWIOriginalDataValue(data, uid, originalDataValueName, data.entries[uid][entryPropName]);

     return { isFancy: isFancyInput, control: input };
+}
 -    // key
 +/**
 -    const keyInput = enableKeysInput('key', 'keys');
 + * Helper to handle match checkboxes for WI entries.
+-
 + */
 -    // keysecondary
 +function handleMatchCheckboxHelper({ template, entry, fieldName, data, name }) {
 -    const keySecondaryInput = enableKeysInput('keysecondary', 'secondary_keys');
 +    const key = originalWIDataKeyMap[fieldName];
+-
 +    const checkBoxElem = template.find(`input[type="checkbox"][name="${fieldName}"]`);
 -    // draw key input switch button
 +    checkBoxElem.data('uid', entry.uid);
     template.find('.switch_input_type_icon')checkBoxElem.on('clickinput', async function () {
 -        power_user.wi_key_input_plaintext = !power_user.wi_key_input_plaintext;
 -        saveSettingsDebounced();
+-
 -        // Just redraw the panel
 -        const uid = ($(this).parents('.world_entry')).data('uid');
 -        updateEditor(uid, false);
+-
 -        $(`.world_entry[uid="${uid}"] .inline-drawer-icon`).trigger('click');
 -        // setTimeout(() => {
 -        // }, debounce_timeout.standard);
 -    }).each((_, icon) => {
 -        $(icon).attr('title', $(icon).data(power_user.wi_key_input_plaintext ? 'tooltip-on' : 'tooltip-off'));
 -        $(icon).text($(icon).data(power_user.wi_key_input_plaintext ? 'icon-on' : 'icon-off'));
 -    });
+-
 -    // logic AND/NOT
 -    const selectiveLogicDropdown = template.find('select[name="entryLogicType"]');
 -    selectiveLogicDropdown.data('uid', entry.uid);
+-
 -    selectiveLogicDropdown.on('click', function (event) {
 -        event.stopPropagation();
 -    });
+-
 -    selectiveLogicDropdown.on('input', async function () {
         const uid = $(this).data('uid');
         const value = Number($(this).valprop()'checked');
         data.entries[uid].selectiveLogic[fieldName] = !isNaN(value) ? value : world_info_logic.AND_ANY;
         setWIOriginalDataValue(data, uid, 'selectiveLogic'key, data.entries[uid].selectiveLogic[fieldName]);
         await saveWorldInfo(name, data);
     });
+-
 +    checkBoxElem.prop('checked', !!entry[fieldName]).trigger('input');
 -    template
 -        .find(`select[name="entryLogicType"] option[value=${entry.selectiveLogic}]`)
 -        .prop('selected', true)
 -        .trigger('input');
+-
 -    // Character filter
 -    const characterFilterLabel = template.find('label[for="characterFilter"] > small');
 -    characterFilterLabel.text(entry.characterFilter?.isExclude ? 'Exclude Character(s)' : 'Filter to Character(s)');
+-
 -    // exclude characters checkbox
 -    const characterExclusionInput = template.find('input[name="character_exclusion"]');
 -    characterExclusionInput.data('uid', entry.uid);
 -    characterExclusionInput.on('input', async function () {
 -        const uid = $(this).data('uid');
 -        const value = $(this).prop('checked');
 -        characterFilterLabel.text(value ? 'Exclude Character(s)' : 'Filter to Character(s)');
 -        if (data.entries[uid].characterFilter) {
 -            if (!value && data.entries[uid].characterFilter.names.length === 0 && data.entries[uid].characterFilter.tags.length === 0) {
 -                delete data.entries[uid].characterFilter;
 -            } else {
 -                data.entries[uid].characterFilter.isExclude = value;
 -            }
 -        } else if (value) {
 -            Object.assign(
 -                data.entries[uid],
 -                {
 -                    characterFilter: {
 -                        isExclude: true,
 -                        names: [],
 -                        tags: [],
 -                    },
 -                },
 -            );
+}
 -        // Verify names to exist in the system
 +/**
 -        if (data.entries[uid]?.characterFilter?.names?.length > 0) {
 + * Helper to update position/order display.
 -            for (const name of [...data.entries[uid].characterFilter.names]) {
 + */
 -                if (!getContext().characters.find(x => x.avatar.replace(/\.[^/.]+$/, '') === name)) {
 +function updatePosOrdDisplayHelper({ template, data, uid }) {
 -                    console.warn(`World Info: Character ${name} not found. Removing from the entry filter.`, entry);
 +    let entry = data.entries[uid];
 -                    data.entries[uid].characterFilter.names = data.entries[uid].characterFilter.names.filter(x => x !== name);
 +    let posText = entry.position;
 -                }
 +    switch (entry.position) {
 +        case 0: posText = '↑CD'; break;
 +        case 1: posText = 'CD↓'; break;
 +        case 2: posText = '↑AN'; break;
 +        case 3: posText = 'AN↓'; break;
 +        case 4: posText = `@D${entry.depth}`; break;
+    }
 +    template.find('.world_entry_form_position_value').text(`(${posText} ${entry.order})`);
+}
 -        setWIOriginalDataValue(data, uid, 'character_filter', data.entries[uid].characterFilter);
 +/**
 -        await saveWorldInfo(name, data);
 + * Helper to initialize character filter select2.
 -    });
 + */
 -    characterExclusionInput.prop('checked', entry.characterFilter?.isExclude ?? false).trigger('input');
 +function initCharacterFilterSelect2Helper(characterFilter, t) {
+-
 -    const characterFilter = template.find('select[name="characterFilter"]');
 -    characterFilter.data('uid', entry.uid);
+-
     if (!isMobile()) {
         $(characterFilter).select2({
             width: '100%',

             closeOnSelect: false,
         });
+    }
 +}
 +/**
 + * Helper to fill character and tag options for character filter.
 + */
 +function fillCharacterAndTagOptionsHelper({ characterFilter, entry, getContext }) {
     const characters = getContext().characters;
     characters.forEach((character) => {
         const option = document.createElement('option');

         option.setAttribute('data-type', 'character');
         characterFilter.append(option);
     });
+-
     const tags = getContext().tags;
     tags.forEach((tag) => {
         const option = document.createElement('option');

         option.setAttribute('data-type', 'tag');
         characterFilter.append(option);
     });
 +}
 +/**
 + * Helper to handle character filter changes.
 + */
 +function handleCharacterFilterChangeHelper({ characterFilter, data, entry, name, world_names, getContext, setWIOriginalDataValue, saveWorldInfo, t }) {
     characterFilter.on('mousedown change', async function (e) {
 -        // If there's no world names, don't do anything
         if (world_names.length === 0) {
             e.preventDefault();
             return;
+        }
+-
         const uid = $(this).data('uid');
         const selected = $(this).find(':selected');
         if ((!selected || selected?.length === 0) && !data.entries[uid].characterFilter?.isExclude) {

         setWIOriginalDataValue(data, uid, 'character_filter', data.entries[uid].characterFilter);
         await saveWorldInfo(name, data);
     });
 +}
++
 +/**
 + * Helper to handle probability input.
 + */
 +function handleProbabilityInputHelper({ probabilityInput, data, entry, name, setWIOriginalDataValue, saveWorldInfo }) {
 +    probabilityInput.data('uid', entry.uid);
 +    probabilityInput.on('input', async function () {
 +        const uid = $(this).data('uid');
 +        const value = Number($(this).val());
 +        data.entries[uid].probability = !isNaN(value) ? value : null;
 +        if (data.entries[uid].probability !== null) {
 +            data.entries[uid].probability = Math.min(100, Math.max(0, data.entries[uid].probability));
 +            if (data.entries[uid].probability !== value) {
 +                $(this).val(data.entries[uid].probability);
 +            }
 +        }
 +        setWIOriginalDataValue(data, uid, 'extensions.probability', data.entries[uid].probability);
 +        await saveWorldInfo(name, data);
 +    });
 +    probabilityInput.val(entry.probability).trigger('input');
 +    probabilityInput.css('width', 'calc(3em + 15px)');
 +}
++
 +/**
 + * Helper to handle probability toggle.
 + */
 +function handleProbabilityToggleHelper({ probabilityToggle, data, entry, name, probabilityInput, setWIOriginalDataValue, saveWorldInfo }) {
 +    probabilityToggle.data('uid', entry.uid);
 +    probabilityToggle.on('input', async function () {
 +        const uid = $(this).data('uid');
 +        const value = $(this).prop('checked');
 +        data.entries[uid].useProbability = value;
 +        const probabilityContainer = $(this).closest('.world_entry').find('.probabilityContainer');
 +        await saveWorldInfo(name, data);
 +        value ? probabilityContainer.show() : probabilityContainer.hide();
 +        if (value && data.entries[uid].probability === null) {
 +            data.entries[uid].probability = 100;
 +        }
 +        if (!value) {
 +            data.entries[uid].probability = null;
 +        }
 +        probabilityInput.val(data.entries[uid].probability).trigger('input');
 +    });
 +    probabilityToggle.prop('checked', true).trigger('input');
 +    probabilityToggle.parent().hide();
 +}
++
 +/**
 + * Helper to handle select2 dropdowns for boolean selects.
 + */
 +function handleBooleanSelectHelper({ selectElem, entry, entryKey, data, name, setWIOriginalDataValue, saveWorldInfo }) {
 +    selectElem.data('uid', entry.uid);
 +    selectElem.on('input', async function () {
 +        const uid = $(this).data('uid');
 +        const value = $(this).val();
 +        data.entries[uid][entryKey] = value === 'null' ? null : value === 'true';
 +        setWIOriginalDataValue(data, uid, `extensions.${entryKey.replace(/[A-Z]/g, m => `_${m.toLowerCase()}`)}`, data.entries[uid][entryKey]);
 +        await saveWorldInfo(name, data);
 +    });
 +    selectElem.val((entry[entryKey] === null || entry[entryKey] === undefined) ? 'null' : entry[entryKey] ? 'true' : 'false').trigger('input');
 +}
++
 +/**
 + * Helper to handle input fields for numbers.
 + */
 +function handleNumberInputHelper({ inputElem, entry, entryKey, data, name, setWIOriginalDataValue, saveWorldInfo, min, max, clamp = false }) {
 +    inputElem.data('uid', entry.uid);
 +    inputElem.on('input', async function () {
 +        const uid = $(this).data('uid');
 +        let value = Number($(this).val());
 +        if (clamp) {
 +            if (value < min) {
 +                value = min;
 +                $(this).val(min);
 +            } else if (value > max) {
 +                value = max;
 +                $(this).val(max);
 +            }
 +        }
 +        data.entries[uid][entryKey] = !isNaN(value) ? value : null;
 +        setWIOriginalDataValue(data, uid, `extensions.${entryKey.replace(/[A-Z]/g, m => `_${m.toLowerCase()}`)}`, data.entries[uid][entryKey]);
 +        await saveWorldInfo(name, data);
 +    });
 +    inputElem.val(entry[entryKey] ?? (clamp ? min : '')).trigger('input');
 +}
++
 +/**
 + * Helper to handle tri-state selector for constant/normal/vectorized.
 + */
 +function handleEntryStateSelectorHelper({ entryStateSelector, entry, data, name, setWIOriginalDataValue, saveWorldInfo }) {
 +    entryStateSelector.data('uid', entry.uid);
 +    entryStateSelector.on('click', function (event) {
 +        event.stopPropagation();
 +    });
 +    entryStateSelector.on('input', async function () {
 +        const uid = entry.uid;
 +        const value = $(this).val();
 +        switch (value) {
 +            case 'constant':
 +                data.entries[uid].constant = true;
 +                data.entries[uid].vectorized = false;
 +                setWIOriginalDataValue(data, uid, 'constant', true);
 +                setWIOriginalDataValue(data, uid, 'extensions.vectorized', false);
 +                break;
 +            case 'normal':
 +                data.entries[uid].constant = false;
 +                data.entries[uid].vectorized = false;
 +                setWIOriginalDataValue(data, uid, 'constant', false);
 +                setWIOriginalDataValue(data, uid, 'extensions.vectorized', false);
 +                break;
 +            case 'vectorized':
 +                data.entries[uid].constant = false;
 +                data.entries[uid].vectorized = true;
 +                setWIOriginalDataValue(data, uid, 'constant', false);
 +                setWIOriginalDataValue(data, uid, 'extensions.vectorized', true);
 +                break;
 +        }
 +        await saveWorldInfo(name, data);
 +    });
 +    const entryState = () => entry.constant === true ? 'constant' : entry.vectorized === true ? 'vectorized' : 'normal';
 +    entryStateSelector.find(`option[value=${entryState()}]`).prop('selected', true).trigger('input');
 +}
++
 +/**
 + * Helper to handle kill switch toggle.
 + */
 +function handleEntryKillSwitchHelper({ entryKillSwitch, entry, data, name, setWIOriginalDataValue, saveWorldInfo, template }) {
 +    entryKillSwitch.data('uid', entry.uid);
 +    entryKillSwitch.on('click', async function () {
 +        const uid = entry.uid;
 +        data.entries[uid].disable = !data.entries[uid].disable;
 +        const isActive = !data.entries[uid].disable;
 +        setWIOriginalDataValue(data, uid, 'enabled', isActive);
 +        template.toggleClass('disabledWIEntry', !isActive);
 +        entryKillSwitch.toggleClass('fa-toggle-off', !isActive);
 +        entryKillSwitch.toggleClass('fa-toggle-on', isActive);
 +        await saveWorldInfo(name, data);
 +    });
 +    const isActive = !entry.disable;
 +    template.toggleClass('disabledWIEntry', !isActive);
 +    entryKillSwitch.toggleClass('fa-toggle-off', !isActive);
 +    entryKillSwitch.toggleClass('fa-toggle-on', isActive);
 +}
++
 +/**
 + * Main function to build the WI entry editor template.
 + */
 +export async function getWorldEntry(name, data, entry) {
 +    if (!data.entries[entry.uid]) return;
++
 +    const template = WI_ENTRY_EDIT_TEMPLATE.clone();
 +    template.data('uid', entry.uid);
 +    template.attr('uid', entry.uid);
++
 +    if (typeof power_user.wi_key_input_plaintext === 'undefined') power_user.wi_key_input_plaintext = true;
++
 +    // Key inputs
 +    const keyInput = enableKeysInputHelper({ template, entry, entryPropName: 'key', originalDataValueName: 'keys', name, data });
 +    const keySecondaryInput = enableKeysInputHelper({ template, entry, entryPropName: 'keysecondary', originalDataValueName: 'secondary_keys', name, data });
++
 +    // Key input switch
 +    template.find('.switch_input_type_icon').on('click', function () {
 +        power_user.wi_key_input_plaintext = !power_user.wi_key_input_plaintext;
 +        saveSettingsDebounced();
 +        const uid = ($(this).parents('.world_entry')).data('uid');
 +        updateEditor(uid, false);
 +        $(`.world_entry[uid="${uid}"] .inline-drawer-icon`).trigger('click');
 +    }).each((_, icon) => {
 +        $(icon).attr('title', $(icon).data(power_user.wi_key_input_plaintext ? 'tooltip-on' : 'tooltip-off'));
 +        $(icon).text($(icon).data(power_user.wi_key_input_plaintext ? 'icon-on' : 'icon-off'));
 +    });
++
 +    // Logic AND/NOT
 +    const selectiveLogicDropdown = template.find('select[name="entryLogicType"]');
 +    selectiveLogicDropdown.data('uid', entry.uid);
 +    selectiveLogicDropdown.on('click', e => e.stopPropagation());
 +    selectiveLogicDropdown.on('input', async function () {
 +        const uid = $(this).data('uid');
 +        const value = Number($(this).val());
 +        data.entries[uid].selectiveLogic = !isNaN(value) ? value : world_info_logic.AND_ANY;
 +        setWIOriginalDataValue(data, uid, 'selectiveLogic', data.entries[uid].selectiveLogic);
 +        await saveWorldInfo(name, data);
 +    });
 +    template.find(`select[name="entryLogicType"] option[value=${entry.selectiveLogic}]`).prop('selected', true).trigger('input');
++
 +    // Character filter
 +    const characterFilterLabel = template.find('label[for="characterFilter"] > small');
 +    characterFilterLabel.text(entry.characterFilter?.isExclude ? 'Exclude Character(s)' : 'Filter to Character(s)');
 +    const characterExclusionInput = template.find('input[name="character_exclusion"]');
 +    characterExclusionInput.data('uid', entry.uid);
 +    characterExclusionInput.on('input', async function () {
 +        const uid = $(this).data('uid');
 +        const value = $(this).prop('checked');
 +        characterFilterLabel.text(value ? 'Exclude Character(s)' : 'Filter to Character(s)');
 +        if (data.entries[uid].characterFilter) {
 +            if (!value && data.entries[uid].characterFilter.names.length === 0 && data.entries[uid].characterFilter.tags.length === 0) {
 +                delete data.entries[uid].characterFilter;
 +            } else {
 +                data.entries[uid].characterFilter.isExclude = value;
 +            }
 +        } else if (value) {
 +            Object.assign(data.entries[uid], { characterFilter: { isExclude: true, names: [], tags: [] } });
 +        }
 +        if (data.entries[uid]?.characterFilter?.names?.length > 0) {
 +            for (const name of [...data.entries[uid].characterFilter.names]) {
 +                if (!getContext().characters.find(x => x.avatar.replace(/\.[^/.]+$/, '') === name)) {
 +                    data.entries[uid].characterFilter.names = data.entries[uid].characterFilter.names.filter(x => x !== name);
 +                }
 +            }
 +        }
 +        setWIOriginalDataValue(data, uid, 'character_filter', data.entries[uid].characterFilter);
 +        await saveWorldInfo(name, data);
 +    });
 +    characterExclusionInput.prop('checked', entry.characterFilter?.isExclude ?? false).trigger('input');
++
 +    const characterFilter = template.find('select[name="characterFilter"]');
 +    characterFilter.data('uid', entry.uid);
 +    initCharacterFilterSelect2Helper(characterFilter, t);
 +    fillCharacterAndTagOptionsHelper({ characterFilter, entry, getContext });
 +    handleCharacterFilterChangeHelper({
 +        characterFilter, data, entry, name, world_names, getContext, setWIOriginalDataValue, saveWorldInfo, t,
 +    });
     // commentComment
     const commentInput = template.find('textarea[name="comment"]');
     const commentToggle = template.find('input[name="addMemo"]');
     commentInput.data('uid', entry.uid);

         const value = $(this).val();
         !skipReset && await resetScrollHeight(this);
         data.entries[uid].comment = value;
+-
         setWIOriginalDataValue(data, uid, 'comment', data.entries[uid].comment);
         await saveWorldInfo(name, data);
     });

     commentToggle.on('input', async function () {
         const uid = $(this).data('uid');
         const value = $(this).prop('checked');
 -        //console.log(value)
 +        const commentContainer = $(this).closest('.world_entry').find('.commentContainer');
 -        const commentContainer = $(this)
 -            .closest('.world_entry')
 -            .find('.commentContainer');
         data.entries[uid].addMemo = value;
         await saveWorldInfo(name, data);
         value ? commentContainer.show() : commentContainer.hide();
     });
+-
     commentInput.val(entry.comment).trigger('input', { skipReset: true });
 -    //initScrollHeight(commentInput);
 +    commentToggle.prop('checked', true).trigger('input');
 -    commentToggle.prop('checked', true /* entry.addMemo */).trigger('input');
     commentToggle.parent().hide();
     // contentContent
     const counter = template.find('.world_entry_form_token_counter');
     const countTokensDebounced = debounce(async function (counter, value) {
         const numberOfTokens = await getTokenCountAsync(value);
         $(counter).text(numberOfTokens);
     }, debounce_timeout.relaxed);
+-
     const contentInputId = `world_entry_content_${entry.uid}`;
     const contentInput = template.find('textarea[name="content"]');
     contentInput.data('uid', entry.uid);

         const uid = $(this).data('uid');
         const value = $(this).val();
         data.entries[uid].content = value;
+-
         setWIOriginalDataValue(data, uid, 'content', data.entries[uid].content);
         await saveWorldInfo(name, data);
+-
 +        if (!skipCount) countTokensDebounced(counter, value);
 -        if (skipCount) {
 -            return;
 -        }
+-
 -        // count tokens
 -        countTokensDebounced(counter, value);
     });
     contentInput.val(entry.content).trigger('input', { skipCount: true });
+-
 +    template.find('.editor_maximize').attr('data-for', contentInputId);
 -    const contentExpandButton = template.find('.editor_maximize');
 -    contentExpandButton.attr('data-for', contentInputId);
+-
     template.find('.inline-drawer-toggle').on('click', function () {
         if (counter.data('first-run')) {
             counter.data('first-run', false);

+        }
     });
     // selectiveSelective
     const selectiveInput = template.find('input[name="selective"]');
     selectiveInput.data('uid', entry.uid);
     selectiveInput.on('input', async function () {
         const uid = $(this).data('uid');
         const value = $(this).prop('checked');
         data.entries[uid].selective = value;
+-
         setWIOriginalDataValue(data, uid, 'selective', data.entries[uid].selective);
         await saveWorldInfo(name, data);
+-
 +        const keysecondary = $(this).closest('.world_entry').find('.keysecondary');
         const keysecondarykeysecondarytextpole = $(this).closest('.world_entry').find('.keysecondarytextpole');
 -            .closest('.world_entry')
 +        const keyprimaryselect = $(this).closest('.world_entry').find('.keyprimaryselect');
 -            .find('.keysecondary');
+-
 -        const keysecondarytextpole = $(this)
 -            .closest('.world_entry')
 -            .find('.keysecondarytextpole');
+-
 -        const keyprimaryselect = $(this)
 -            .closest('.world_entry')
 -            .find('.keyprimaryselect');
+-
         const keyprimaryHeight = keyprimaryselect.outerHeight();
         keysecondarytextpole.css('height', keyprimaryHeight + 'px');
+-
         value ? keysecondary.show() : keysecondary.hide();
+-
     });
 -    //forced on, ignored if empty
 +    selectiveInput.prop('checked', true).trigger('input');
 -    selectiveInput.prop('checked', true /* entry.selective */).trigger('input');
     selectiveInput.parent().hide();
+-
 +    // Order
 -    // constant
 -    /*
 -    const constantInput = template.find('input[name="constant"]');
 -    constantInput.data("uid", entry.uid);
 -    constantInput.on("input", async function () {
 -        const uid = $(this).data("uid");
 -        const value = $(this).prop("checked");
 -        data.entries[uid].constant = value;
 -        setOriginalDataValue(data, uid, "constant", data.entries[uid].constant);
 -        await saveWorldInfo(name, data);
 -    });
 -    constantInput.prop("checked", entry.constant).trigger("input");
 -    */
+-
 -    // order
     const orderInput = template.find('input[name="order"]');
     orderInput.data('uid', entry.uid);
     orderInput.on('input', async function () {
         const uid = $(this).data('uid');
         const value = Number($(this).val());
+-
         data.entries[uid].order = !isNaN(value) ? value : 0;
 -        updatePosOrdDisplay(uid);
 +        updatePosOrdDisplayHelper({ template, data, uid });
         setWIOriginalDataValue(data, uid, 'insertion_order', data.entries[uid].order);
         await saveWorldInfo(name, data);
     });
     orderInput.val(entry.order).trigger('input');
     orderInput.css('width', 'calc(3em + 15px)');
     // groupGroup
     const groupInput = template.find('input[name="group"]');
     groupInput.data('uid', entry.uid);
     groupInput.on('input', async function () {
         const uid = $(this).data('uid');
         const value = String($(this).val()).trim();
+-
         data.entries[uid].group = value;
         setWIOriginalDataValue(data, uid, 'extensions.group', data.entries[uid].group);
         await saveWorldInfo(name, data);

     groupInput.val(entry.group ?? '').trigger('input');
     setTimeout(() => createEntryInputAutocomplete(groupInput, getInclusionGroupCallback(data), { allowMultiple: true }), 1);
     // inclusionInclusion priority
     const groupOverrideInput = template.find('input[name="groupOverride"]');
     groupOverrideInput.data('uid', entry.uid);
     groupOverrideInput.on('input', async function () {

     });
     groupOverrideInput.prop('checked', entry.groupOverride).trigger('input');
     // groupGroup weight
 -    const groupWeightInput = template.find('input[name="groupWeight"]');
 +    handleNumberInputHelper({
 -    groupWeightInput.data('uid', entry.uid);
 +        inputElem: template.find('input[name="groupWeight"]'),
 -    groupWeightInput.on('input', async function () {
 +        entry, entryKey: 'groupWeight', data, name, setWIOriginalDataValue, saveWorldInfo,
 -        const uid = $(this).data('uid');
 +        min: 1, max: 10000, clamp: true,
 -        let value = Number($(this).val());
 -        const min = Number($(this).attr('min'));
 -        const max = Number($(this).attr('max'));
+-
 -        // Clamp the value
 -        if (value < min) {
 -            value = min;
 -            $(this).val(min);
 -        } else if (value > max) {
 -            value = max;
 -            $(this).val(max);
 -        }
+-
 -        data.entries[uid].groupWeight = !isNaN(value) ? Math.abs(value) : 1;
 -        setWIOriginalDataValue(data, uid, 'extensions.group_weight', data.entries[uid].groupWeight);
 -        await saveWorldInfo(name, data);
 -    });
 -    groupWeightInput.val(entry.groupWeight ?? DEFAULT_WEIGHT).trigger('input');
+-
 -    // sticky
 -    const sticky = template.find('input[name="sticky"]');
 -    sticky.data('uid', entry.uid);
 -    sticky.on('input', async function () {
 -        const uid = $(this).data('uid');
 -        const value = Number($(this).val());
 -        data.entries[uid].sticky = !isNaN(value) ? value : null;
+-
 -        setWIOriginalDataValue(data, uid, 'extensions.sticky', data.entries[uid].sticky);
 -        await saveWorldInfo(name, data);
     });
 -    sticky.val(entry.sticky > 0 ? entry.sticky : '').trigger('input');
+-
 -    // cooldown
 -    const cooldown = template.find('input[name="cooldown"]');
 -    cooldown.data('uid', entry.uid);
 -    cooldown.on('input', async function () {
 -        const uid = $(this).data('uid');
 -        const value = Number($(this).val());
 -        data.entries[uid].cooldown = !isNaN(value) ? value : null;
 -        setWIOriginalDataValue(data, uid, 'extensions.cooldown', data.entries[uid].cooldown);
 +    // Sticky, cooldown, delay
 -        await saveWorldInfo(name, data);
 +    handleNumberInputHelper({
 +        inputElem: template.find('input[name="sticky"]'),
 +        entry, entryKey: 'sticky', data, name, setWIOriginalDataValue, saveWorldInfo,
 +        min: 1, max: 10000, clamp: false,
     });
 -    cooldown.val(entry.cooldown > 0 ? entry.cooldown : '').trigger('input');
 +    handleNumberInputHelper({
+-
 +        inputElem: template.find('input[name="cooldown"]'),
 -    // delay
 +        entry, entryKey: 'cooldown', data, name, setWIOriginalDataValue, saveWorldInfo,
 -    const delay = template.find('input[name="delay"]');
 +        min: 1, max: 10000, clamp: false,
 -    delay.data('uid', entry.uid);
 -    delay.on('input', async function () {
 -        const uid = $(this).data('uid');
 -        const value = Number($(this).val());
 -        data.entries[uid].delay = !isNaN(value) ? value : null;
+-
 -        setWIOriginalDataValue(data, uid, 'extensions.delay', data.entries[uid].delay);
 -        await saveWorldInfo(name, data);
     });
 -    delay.val(entry.delay > 0 ? entry.delay : '').trigger('input');
 +    handleNumberInputHelper({
+-
 +        inputElem: template.find('input[name="delay"]'),
 -    // probability
 +        entry, entryKey: 'delay', data, name, setWIOriginalDataValue, saveWorldInfo,
 -    if (entry.probability === undefined) {
 +        min: 1, max: 10000, clamp: false,
 -        entry.probability = null;
 -    }
+-
 -    // depth
 -    const depthInput = template.find('input[name="depth"]');
 -    depthInput.data('uid', entry.uid);
+-
 -    depthInput.on('input', async function () {
 -        const uid = $(this).data('uid');
 -        const value = Number($(this).val());
+-
 -        data.entries[uid].depth = !isNaN(value) ? value : 0;
 -        updatePosOrdDisplay(uid);
 -        setWIOriginalDataValue(data, uid, 'extensions.depth', data.entries[uid].depth);
 -        await saveWorldInfo(name, data);
     });
 -    depthInput.val(entry.depth ?? DEFAULT_DEPTH).trigger('input');
 -    depthInput.css('width', 'calc(3em + 15px)');
+-
 -    // Hide by default unless depth is specified
 -    if (entry.position === world_info_position.atDepth) {
 -        //depthInput.parent().hide();
 -    }
+-
 -    const probabilityInput = template.find('input[name="probability"]');
 -    probabilityInput.data('uid', entry.uid);
 -    probabilityInput.on('input', async function () {
 -        const uid = $(this).data('uid');
 -        const value = Number($(this).val());
+-
 -        data.entries[uid].probability = !isNaN(value) ? value : null;
+-
 -        // Clamp probability to 0-100
 -        if (data.entries[uid].probability !== null) {
 -            data.entries[uid].probability = Math.min(100, Math.max(0, data.entries[uid].probability));
+-
 -            if (data.entries[uid].probability !== value) {
 -                $(this).val(data.entries[uid].probability);
 -            }
 -        }
 -        setWIOriginalDataValue(data, uid, 'extensions.probability', data.entries[uid].probability);
 +    // Probability
 -        await saveWorldInfo(name, data);
 +    handleProbabilityInputHelper({ probabilityInput: template.find('input[name="probability"]'), data, entry, name, setWIOriginalDataValue, saveWorldInfo });
 +    handleProbabilityToggleHelper({
 +        probabilityToggle: template.find('input[name="useProbability"]'),
 +        data, entry, name,
 +        probabilityInput: template.find('input[name="probability"]'),
 +        setWIOriginalDataValue, saveWorldInfo,
     });
 -    probabilityInput.val(entry.probability).trigger('input');
 -    probabilityInput.css('width', 'calc(3em + 15px)');
+-
 -    // probability toggle
 -    if (entry.useProbability === undefined) {
 -        entry.useProbability = false;
 -    }
+-
 -    const probabilityToggle = template.find('input[name="useProbability"]');
 -    probabilityToggle.data('uid', entry.uid);
 -    probabilityToggle.on('input', async function () {
 -        const uid = $(this).data('uid');
 -        const value = $(this).prop('checked');
 -        data.entries[uid].useProbability = value;
 -        const probabilityContainer = $(this)
 -            .closest('.world_entry')
 -            .find('.probabilityContainer');
 -        await saveWorldInfo(name, data);
 -        value ? probabilityContainer.show() : probabilityContainer.hide();
+-
 -        if (value && data.entries[uid].probability === null) {
 -            data.entries[uid].probability = 100;
 -        }
+-
 -        if (!value) {
 -            data.entries[uid].probability = null;
 -        }
 -        probabilityInput.val(data.entries[uid].probability).trigger('input');
 +    // Depth
 +    handleNumberInputHelper({
 +        inputElem: template.find('input[name="depth"]'),
 +        entry, entryKey: 'depth', data, name, setWIOriginalDataValue, saveWorldInfo,
 +        min: 0, max: MAX_SCAN_DEPTH, clamp: false,
     });
 -    //forced on, 100% by default
 +    template.find('input[name="depth"]').css('width', 'calc(3em + 15px)');
 -    probabilityToggle.prop('checked', true /* entry.useProbability */).trigger('input');
 -    probabilityToggle.parent().hide();
+-
 -    // position
 -    if (entry.position === undefined) {
 -        entry.position = 0;
 -    }
 +    // Position
 +    if (entry.position === undefined) entry.position = 0;
     const positionInput = template.find('select[name="position"]');
 -    //initScrollHeight(positionInput);
     positionInput.data('uid', entry.uid);
     positionInput.on('click', functione => e.stopPropagation(event) {);
 -        // Prevent closing the drawer on clicking the input
 -        event.stopPropagation();
 -    });
     positionInput.on('input', async function () {
         const uid = $(this).data('uid');
         const value = Number($(this).val());
         data.entries[uid].position = !isNaN(value) ? value : 0;
 +        const depthInput = template.find('input[name="depth"]');
         if (value === world_info_position.atDepth) {
             depthInput.prop('disabled', false);
             depthInput.css('visibility', 'visible');
 -            //depthInput.parent().show();
             const role = Number($(this).find(':selected').data('role'));
             data.entries[uid].role = role;
         } else {
             depthInput.prop('disabled', true);
             depthInput.css('visibility', 'hidden');
             data.entries[uid].role = null;
 -            //depthInput.parent().hide();
+        }
 -        updatePosOrdDisplay(uid);
 +        updatePosOrdDisplayHelper({ template, data, uid });
 -        // Spec v2 only supports before_char and after_char
         setWIOriginalDataValue(data, uid, 'position', data.entries[uid].position == 0 ? 'before_char' : 'after_char');
 -        // Write the original value as extensions field
         setWIOriginalDataValue(data, uid, 'extensions.position', data.entries[uid].position);
         setWIOriginalDataValue(data, uid, 'extensions.role', data.entries[uid].role);
         await saveWorldInfo(name, data);
     });
+-
     const roleValue = entry.position === world_info_position.atDepth ? String(entry.role ?? extension_prompt_roles.SYSTEM) : '';
 -    template
 +    template.find(`select[name="position"] option[value="${entry.position}"][data-role="${roleValue}"]`).prop('selected', true).trigger('input');
 -        .find(`select[name="position"] option[value="${entry.position}"][data-role="${roleValue}"]`)
 -        .prop('selected', true)
 -        .trigger('input');
 -    //add UID above content box (less important doesn't need to be always visible)
 +    // UID display
     template.find('.world_entry_form_uid_value').text(`(UID: ${entry.uid})`);
     //new triTri-state selector for constant/normal/vectorized
 -    const entryStateSelector = template.find('select[name="entryStateSelector"]');
 +    handleEntryStateSelectorHelper({
 -    entryStateSelector.data('uid', entry.uid);
 +        entryStateSelector: template.find('select[name="entryStateSelector"]'),
 -    entryStateSelector.on('click', function (event) {
 +        entry, data, name, setWIOriginalDataValue, saveWorldInfo,
 -        // Prevent closing the drawer on clicking the input
 -        event.stopPropagation();
 -    });
 -    entryStateSelector.on('input', async function () {
 -        const uid = entry.uid;
 -        const value = $(this).val();
 -        switch (value) {
 -            case 'constant':
 -                data.entries[uid].constant = true;
 -                data.entries[uid].vectorized = false;
 -                setWIOriginalDataValue(data, uid, 'constant', true);
 -                setWIOriginalDataValue(data, uid, 'extensions.vectorized', false);
 -                break;
 -            case 'normal':
 -                data.entries[uid].constant = false;
 -                data.entries[uid].vectorized = false;
 -                setWIOriginalDataValue(data, uid, 'constant', false);
 -                setWIOriginalDataValue(data, uid, 'extensions.vectorized', false);
 -                break;
 -            case 'vectorized':
 -                data.entries[uid].constant = false;
 -                data.entries[uid].vectorized = true;
 -                setWIOriginalDataValue(data, uid, 'constant', false);
 -                setWIOriginalDataValue(data, uid, 'extensions.vectorized', true);
 -                break;
 -        }
 -        await saveWorldInfo(name, data);
+-
 -    });
+-
 -    const entryKillSwitch = template.find('div[name="entryKillSwitch"]');
 -    entryKillSwitch.data('uid', entry.uid);
 -    entryKillSwitch.on('click', async function (event) {
 -        const uid = entry.uid;
 -        data.entries[uid].disable = !data.entries[uid].disable;
 -        const isActive = !data.entries[uid].disable;
 -        setWIOriginalDataValue(data, uid, 'enabled', isActive);
 -        template.toggleClass('disabledWIEntry', !isActive);
 -        entryKillSwitch.toggleClass('fa-toggle-off', !isActive);
 -        entryKillSwitch.toggleClass('fa-toggle-on', isActive);
 -        await saveWorldInfo(name, data);
+-
     });
 -    const entryState = function () {
 +    // Kill switch
 -        if (entry.constant === true) {
 +    handleEntryKillSwitchHelper({
 -            return 'constant';
 +        entryKillSwitch: template.find('div[name="entryKillSwitch"]'),
 -        } else if (entry.vectorized === true) {
 +        entry, data, name, setWIOriginalDataValue, saveWorldInfo, template,
 -            return 'vectorized';
 -        } else {
 -            return 'normal';
 -        }
 -    };
+-
 -    const isActive = !entry.disable;
 -    template.toggleClass('disabledWIEntry', !isActive);
 -    entryKillSwitch.toggleClass('fa-toggle-off', !isActive);
 -    entryKillSwitch.toggleClass('fa-toggle-on', isActive);
+-
 -    template
 -        .find(`select[name="entryStateSelector"] option[value=${entryState()}]`)
 -        .prop('selected', true)
 -        .trigger('input');
+-
 -    // exclude recursion
 -    const excludeRecursionInput = template.find('input[name="exclude_recursion"]');
 -    excludeRecursionInput.data('uid', entry.uid);
 -    excludeRecursionInput.on('input', async function () {
 -        const uid = $(this).data('uid');
 -        const value = $(this).prop('checked');
 -        data.entries[uid].excludeRecursion = value;
 -        setWIOriginalDataValue(data, uid, 'extensions.exclude_recursion', data.entries[uid].excludeRecursion);
 -        await saveWorldInfo(name, data);
     });
 -    excludeRecursionInput.prop('checked', entry.excludeRecursion).trigger('input');
     // Exclude/prevent recursion
 -    const preventRecursionInput = template.find('input[name="prevent_recursion"]');
 +    handleMatchCheckboxHelper({ template, entry, fieldName: 'excludeRecursion', data, name });
 -    preventRecursionInput.data('uid', entry.uid);
 +    handleMatchCheckboxHelper({ template, entry, fieldName: 'preventRecursion', data, name });
 -    preventRecursionInput.on('input', async function () {
 -        const uid = $(this).data('uid');
 -        const value = $(this).prop('checked');
 -        data.entries[uid].preventRecursion = value;
 -        setWIOriginalDataValue(data, uid, 'extensions.prevent_recursion', data.entries[uid].preventRecursion);
 -        await saveWorldInfo(name, data);
 -    });
 -    preventRecursionInput.prop('checked', entry.preventRecursion).trigger('input');
     // delayDelay until recursion
 -    // delay until recursion level
     const delayUntilRecursionInput = template.find('input[name="delay_until_recursion"]');
     delayUntilRecursionInput.data('uid', entry.uid);
     const delayUntilRecursionLevelInput = template.find('input[name="delayUntilRecursionLevel"]');

     delayUntilRecursionInput.on('input', async function () {
         const uid = $(this).data('uid');
         const toggled = $(this).prop('checked');
+-
 -        // If the value contains a number, we'll take that one (set by the level input), otherwise we can use true/false switch
         const value = toggled ? data.entries[uid].delayUntilRecursion || true : false;
+-
         if (!toggled) delayUntilRecursionLevelInput.val('');
+-
         data.entries[uid].delayUntilRecursion = value;
         setWIOriginalDataValue(data, uid, 'extensions.delay_until_recursion', data.entries[uid].delayUntilRecursion);
         await saveWorldInfo(name, data);

             : content === 1 ? true
                 : !isNaN(Number(content)) ? Number(content)
                     : false;
+-
         data.entries[uid].delayUntilRecursion = value;
         setWIOriginalDataValue(data, uid, 'extensions.delay_until_recursion', data.entries[uid].delayUntilRecursion);
         await saveWorldInfo(name, data);
     });
 -    // No need to retrigger inpout event, we'll just set the curret current value. It was edited/saved above already
     delayUntilRecursionLevelInput.val(['number', 'string'].includes(typeof entry.delayUntilRecursion) ? entry.delayUntilRecursion : '').trigger('input');
     // duplicateDuplicate/delete/move buttonbuttons
 -    const duplicateButton = template.find('.duplicate_entry_button');
 +    template.find('.duplicate_entry_button').data('uid', entry.uid).on('click', async function () {
 -    duplicateButton.data('uid', entry.uid);
 -    duplicateButton.on('click', async function () {
         const uid = $(this).data('uid');
         const entryentryDup = duplicateWorldInfoEntry(data, uid);
         if (entryentryDup) {
             await saveWorldInfo(name, data);
             updateEditor(entryentryDup.uid);
+        }
     });
+-
 +    template.find('.delete_entry_button').data('uid', entry.uid).on('click', async function (e) {
 -    // delete button
 -    const deleteButton = template.find('.delete_entry_button');
 -    deleteButton.data('uid', entry.uid);
 -    deleteButton.on('click', async function (e) {
         e.stopPropagation();
         const uid = $(this).data('uid');
         const deleted = await deleteWorldInfoEntry(data, uid);

         await saveWorldInfo(name, data);
         updateEditor(navigation_option.previous);
     });
+-
 +    template.find('.move_entry_button').attr('data-uid', entry.uid).attr('data-current-world', name).on('click', async function (e) {
 -    // move button
 -    const moveButton = template.find('.move_entry_button');
 -    moveButton.attr('data-uid', entry.uid);
 -    moveButton.attr('data-current-world', name);
 -    moveButton.on('click', async function (e) {
         e.stopPropagation();
         const sourceUid = $(this).attr('data-uid');
         const sourceWorld = $(this).attr('data-current-world');
         const sourceWorldInfo = await loadWorldInfo(sourceWorld);
         if (!sourceWorldInfo) {return;
 -            return;
 -        }
         const sourceName = sourceWorldInfo.entries[sourceUid]?.comment;
         if (sourceName === undefined) {return;
 -            return;
 -        }
+-
         const select = document.createElement('select');
         select.id = 'move_entry_target_select';
         select.classList.add('text_pole', 'wide100p', 'marginTop10');
+-
         const defaultOption = document.createElement('option');
         defaultOption.value = '';
         defaultOption.textContent = `-- ${t`Select Target Lorebook`} --`;
         select.appendChild(defaultOption);
+-
         let selectableWorldCount = 0;
         world_names.forEach(worldName => {
             if (worldName !== sourceWorld) { // Exclude current world
                 const option = document.createElement('option');
                 option.value = world_names.indexOf(worldName).toString();
                 option.textContent = worldName;

                 selectableWorldCount++;
+            }
         });
+-
         if (selectableWorldCount === 0) {
             toastr.warning(t`There are no other lorebooks to move to.`);
             return;
+        }
+-
 -        // Create wrapper div
         const wrapper = document.createElement('div');
         wrapper.textContent = t`Move '${sourceName}' to:`;
+-
 -        // Create container and append elements
         const container = document.createElement('div');
         container.appendChild(wrapper);
         container.appendChild(select);
+-
         let selectedWorldIndex = -1;
         select.addEventListener('change', function () {
             selectedWorldIndex = this.value === '' ? -1 : Number(this.value);
         });
+-
         const popupConfirm = await callGenericPopup(container, POPUP_TYPE.CONFIRM, '', {
             okButton: t`Move`,
             cancelButton: t`Cancel`,
         });
         if (!popupConfirm) {return;
 -            return;
 +        if (selectedWorldIndex === -1) return;
 -        }
+-
 -        if (selectedWorldIndex === -1) {
 -            return;
 -        }
+-
         const selectedValue = world_names[selectedWorldIndex];
+-
         if (!selectedValue) {
             toastr.warning(t`Please select a target lorebook.`);
             return;
+        }
+-
         await moveWorldInfoEntry(sourceWorld, selectedValue, sourceUid);
     });
     // scanScan depth
     const scanDepthInput = template.find('input[name="scanDepth"]');
     scanDepthInput.data('uid', entry.uid);
     scanDepthInput.on('input', async function () {
         const uid = $(this).data('uid');
         const isEmpty = $(this).val() === '';
         const value = Number($(this).val());
+-
 -        // Clamp if necessary
         if (value < 0) {
             $(this).val(0).trigger('input');
             toastr.warning('Scan depth cannot be negative');
             return;
+        }
+-
         if (value > MAX_SCAN_DEPTH) {
             $(this).val(MAX_SCAN_DEPTH).trigger('input');
             toastr.warning(`Scan depth cannot exceed ${MAX_SCAN_DEPTH}`);
             return;
+        }
+-
         data.entries[uid].scanDepth = !isEmpty && !isNaN(value) && value >= 0 && value <= MAX_SCAN_DEPTH ? Math.floor(value) : null;
         setWIOriginalDataValue(data, uid, 'extensions.scan_depth', data.entries[uid].scanDepth);
         await saveWorldInfo(name, data);
     });
     scanDepthInput.val(entry.scanDepth ?? null).trigger('input');
     // case sensitiveBoolean selectselects
 -    const caseSensitiveSelect = template.find('select[name="caseSensitive"]');
 +    handleBooleanSelectHelper({
 -    caseSensitiveSelect.data('uid', entry.uid);
 +        selectElem: template.find('select[name="caseSensitive"]'),
 -    caseSensitiveSelect.on('input', async function () {
 +        entry, entryKey: 'caseSensitive', data, name, setWIOriginalDataValue, saveWorldInfo,
 -        const uid = $(this).data('uid');
 -        const value = $(this).val();
+-
 -        data.entries[uid].caseSensitive = value === 'null' ? null : value === 'true';
 -        setWIOriginalDataValue(data, uid, 'extensions.case_sensitive', data.entries[uid].caseSensitive);
 -        await saveWorldInfo(name, data);
 -    });
 -    caseSensitiveSelect.val((entry.caseSensitive === null || entry.caseSensitive === undefined) ? 'null' : entry.caseSensitive ? 'true' : 'false').trigger('input');
+-
 -    // match whole words select
 -    const matchWholeWordsSelect = template.find('select[name="matchWholeWords"]');
 -    matchWholeWordsSelect.data('uid', entry.uid);
 -    matchWholeWordsSelect.on('input', async function () {
 -        const uid = $(this).data('uid');
 -        const value = $(this).val();
+-
 -        data.entries[uid].matchWholeWords = value === 'null' ? null : value === 'true';
 -        setWIOriginalDataValue(data, uid, 'extensions.match_whole_words', data.entries[uid].matchWholeWords);
 -        await saveWorldInfo(name, data);
     });
 -    matchWholeWordsSelect.val((entry.matchWholeWords === null || entry.matchWholeWords === undefined) ? 'null' : entry.matchWholeWords ? 'true' : 'false').trigger('input');
 +    handleBooleanSelectHelper({
+-
 +        selectElem: template.find('select[name="matchWholeWords"]'),
 -    // use group scoring select
 +        entry, entryKey: 'matchWholeWords', data, name, setWIOriginalDataValue, saveWorldInfo,
 -    const useGroupScoringSelect = template.find('select[name="useGroupScoring"]');
 -    useGroupScoringSelect.data('uid', entry.uid);
 -    useGroupScoringSelect.on('input', async function () {
 -        const uid = $(this).data('uid');
 -        const value = $(this).val();
+-
 -        data.entries[uid].useGroupScoring = value === 'null' ? null : value === 'true';
 -        setWIOriginalDataValue(data, uid, 'extensions.use_group_scoring', data.entries[uid].useGroupScoring);
 -        await saveWorldInfo(name, data);
     });
 -    useGroupScoringSelect.val((entry.useGroupScoring === null || entry.useGroupScoring === undefined) ? 'null' : entry.useGroupScoring ? 'true' : 'false').trigger('input');
 +    handleBooleanSelectHelper({
+-
 +        selectElem: template.find('select[name="useGroupScoring"]'),
 -    function handleMatchCheckbox(fieldName) {
 +        entry, entryKey: 'useGroupScoring', data, name, setWIOriginalDataValue, saveWorldInfo,
 -        const key = originalWIDataKeyMap[fieldName];
 -        const checkBoxElem = template.find(`input[type="checkbox"][name="${fieldName}"]`);
 -        checkBoxElem.data('uid', entry.uid);
 -        checkBoxElem.on('input', async function () {
 -            const uid = $(this).data('uid');
 -            const value = $(this).prop('checked');
+-
 -            data.entries[uid][fieldName] = value;
 -            setWIOriginalDataValue(data, uid, key, data.entries[uid][fieldName]);
 -            await saveWorldInfo(name, data);
     });
 -        checkBoxElem.prop('checked', !!entry[fieldName]).trigger('input');
 -    }
 -    handleMatchCheckbox('matchPersonaDescription');
 +    // Match checkboxes
 -    handleMatchCheckbox('matchCharacterDescription');
 +    handleMatchCheckboxHelper({ template, entry, fieldName: 'matchPersonaDescription', data, name });
 -    handleMatchCheckbox('matchCharacterPersonality');
 +    handleMatchCheckboxHelper({ template, entry, fieldName: 'matchCharacterDescription', data, name });
 -    handleMatchCheckbox('matchCharacterDepthPrompt');
 +    handleMatchCheckboxHelper({ template, entry, fieldName: 'matchCharacterPersonality', data, name });
 -    handleMatchCheckbox('matchScenario');
 +    handleMatchCheckboxHelper({ template, entry, fieldName: 'matchCharacterDepthPrompt', data, name });
 -    handleMatchCheckbox('matchCreatorNotes');
 +    handleMatchCheckboxHelper({ template, entry, fieldName: 'matchScenario', data, name });
 +    handleMatchCheckboxHelper({ template, entry, fieldName: 'matchCreatorNotes', data, name });
     // automationAutomation idID
     const automationIdInput = template.find('input[name="automationId"]');
     automationIdInput.data('uid', entry.uid);
     automationIdInput.on('input', async function () {
         const uid = $(this).data('uid');
         const value = $(this).val();
+-
         data.entries[uid].automationId = value;
         setWIOriginalDataValue(data, uid, 'extensions.automation_id', data.entries[uid].automationId);
         await saveWorldInfo(name, data);

     automationIdInput.val(entry.automationId ?? '').trigger('input');
     setTimeout(() => createEntryInputAutocomplete(automationIdInput, getAutomationIdCallback(data)), 1);
     template.find('.inline-drawer-content').css('display', 'none'); //entries start collapsed
+-
 -    function updatePosOrdDisplay(uid) {
 -        // display position/order info left of keyword box
 -        let entry = data.entries[uid];
 -        let posText = entry.position;
 -        switch (entry.position) {
 -            case 0:
 -                posText = '↑CD';
 -                break;
 -            case 1:
 -                posText = 'CD↓';
 -                break;
 -            case 2:
 -                posText = '↑AN';
 -                break;
 -            case 3:
 -                posText = 'AN↓';
 -                break;
 -            case 4:
 -                posText = `@D${entry.depth}`;
 -                break;
 -        }
 -        template.find('.world_entry_form_position_value').text(`(${posText} ${entry.order})`);
 -    }
     return template;
+}

  * @property {Set<any>} allActivatedEntries All entries.
  * @returns {Promise<WIActivated>} The world info activated.
  */
++
 +//MARK: checkWorldInfo
 export async function checkWorldInfo(chat, maxContext, isDryRun, globalScanData) {
     const context = getContext();
     const buffer = new WorldInfoBuffer(chat, globalScanData);