Small tidyup

changedetectionio/static/js/limit.js

@@ -1,56 +0,0 @@
-/**
- * debounce
- * @param {integer} milliseconds This param indicates the number of milliseconds
- *     to wait after the last call before calling the original function.
- * @param {object} What "this" refers to in the returned function.
- * @return {function} This returns a function that when called will wait the
- *     indicated number of milliseconds after the last call before
- *     calling the original function.
- */
-Function.prototype.debounce = function (milliseconds, context) {
-    var baseFunction = this,
-        timer = null,
-        wait = milliseconds;
-
-    return function () {
-        var self = context || this,
-            args = arguments;
-
-        function complete() {
-            baseFunction.apply(self, args);
-            timer = null;
-        }
-
-        if (timer) {
-            clearTimeout(timer);
-        }
-
-        timer = setTimeout(complete, wait);
-    };
-};
-
-/**
-* throttle
-* @param {integer} milliseconds This param indicates the number of milliseconds
-*     to wait between calls before calling the original function.
-* @param {object} What "this" refers to in the returned function.
-* @return {function} This returns a function that when called will wait the
-*     indicated number of milliseconds between calls before
-*     calling the original function.
-*/
-Function.prototype.throttle = function (milliseconds, context) {
-    var baseFunction = this,
-        lastEventTimestamp = null,
-        limit = milliseconds;
-
-    return function () {
-        var self = context || this,
-            args = arguments,
-            now = Date.now();
-
-        if (!lastEventTimestamp || now - lastEventTimestamp >= limit) {
-            lastEventTimestamp = now;
-            baseFunction.apply(self, args);
-        }
-    };
-};

changedetectionio/static/js/plugins.js

@@ -1,49 +1,106 @@
-(function($) {
+(function ($) {
-  $.fn.highlightLines = function(configurations) {
+    /**
-    return this.each(function() {
+     * debounce
-      const $pre = $(this);
+     * @param {integer} milliseconds This param indicates the number of milliseconds
-      const textContent = $pre.text();
+     *     to wait after the last call before calling the original function.
-      const lines = textContent.split(/\r?\n/); // Handles both \n and \r\n line endings
+     * @param {object} What "this" refers to in the returned function.
-
+     * @return {function} This returns a function that when called will wait the
-      // Build a map of line numbers to styles
+     *     indicated number of milliseconds after the last call before
-      const lineStyles = {};
+     *     calling the original function.
-
+     */
-      configurations.forEach(config => {
+    Function.prototype.debounce = function (milliseconds, context) {
-        const { color, lines: lineNumbers } = config;
+        var baseFunction = this,
-        lineNumbers.forEach(lineNumber => {
+            timer = null,
-          lineStyles[lineNumber] = color;
+            wait = milliseconds;
-        });
+
-      });
+        return function () {
+            var self = context || this,
+                args = arguments;
+
+            function complete() {
+                baseFunction.apply(self, args);
+                timer = null;
+            }
+
+            if (timer) {
+                clearTimeout(timer);
+            }
+
+            timer = setTimeout(complete, wait);
+        };
+    };
 
-      // Function to escape HTML characters
+    /**
-      function escapeHtml(text) {
+     * throttle
-        return text.replace(/[&<>"'`=\/]/g, function(s) {
+     * @param {integer} milliseconds This param indicates the number of milliseconds
-          return "&#" + s.charCodeAt(0) + ";";
+     *     to wait between calls before calling the original function.
-        });
+     * @param {object} What "this" refers to in the returned function.
-      }
+     * @return {function} This returns a function that when called will wait the
-
+     *     indicated number of milliseconds between calls before
-      // Process each line
+     *     calling the original function.
-      const processedLines = lines.map((line, index) => {
+     */
-        const lineNumber = index + 1; // Line numbers start at 1
+    Function.prototype.throttle = function (milliseconds, context) {
-        const escapedLine = escapeHtml(line);
+        var baseFunction = this,
-        const color = lineStyles[lineNumber];
+            lastEventTimestamp = null,
-
+            limit = milliseconds;
-        if (color) {
+
-          // Wrap the line in a span with inline style
+        return function () {
-          return `<span style="background-color: ${color}">${escapedLine}</span>`;
+            var self = context || this,
-        } else {
+                args = arguments,
-          return escapedLine;
+                now = Date.now();
-        }
+
-      });
+            if (!lastEventTimestamp || now - lastEventTimestamp >= limit) {
+                lastEventTimestamp = now;
+                baseFunction.apply(self, args);
+            }
+        };
+    };
+
+    $.fn.highlightLines = function (configurations) {
+        return this.each(function () {
+            const $pre = $(this);
+            const textContent = $pre.text();
+            const lines = textContent.split(/\r?\n/); // Handles both \n and \r\n line endings
 
-      // Join the lines back together
+            // Build a map of line numbers to styles
-      const newContent = processedLines.join('\n');
+            const lineStyles = {};
 
-      // Set the new content as HTML
+            configurations.forEach(config => {
-      $pre.html(newContent);
+                const {color, lines: lineNumbers} = config;
-    });
+                lineNumbers.forEach(lineNumber => {
-  };
+                    lineStyles[lineNumber] = color;
-   $.fn.miniTabs = function(tabsConfig, options) {
+                });
+            });
+
+            // Function to escape HTML characters
+            function escapeHtml(text) {
+                return text.replace(/[&<>"'`=\/]/g, function (s) {
+                    return "&#" + s.charCodeAt(0) + ";";
+                });
+            }
+
+            // Process each line
+            const processedLines = lines.map((line, index) => {
+                const lineNumber = index + 1; // Line numbers start at 1
+                const escapedLine = escapeHtml(line);
+                const color = lineStyles[lineNumber];
+
+                if (color) {
+                    // Wrap the line in a span with inline style
+                    return `<span style="background-color: ${color}">${escapedLine}</span>`;
+                } else {
+                    return escapedLine;
+                }
+            });
+
+            // Join the lines back together
+            const newContent = processedLines.join('\n');
+
+            // Set the new content as HTML
+            $pre.html(newContent);
+        });
+    };
+    $.fn.miniTabs = function (tabsConfig, options) {
         const settings = {
             tabClass: 'minitab',
             tabsContainerClass: 'minitabs',
@@ -51,10 +108,10 @@
             ...(options || {})
         };
 
-        return this.each(function() {
+        return this.each(function () {
             const $wrapper = $(this);
             const $contents = $wrapper.find('div[id]').hide();
-            const $tabsContainer = $('<div>', { class: settings.tabsContainerClass }).prependTo($wrapper);
+            const $tabsContainer = $('<div>', {class: settings.tabsContainerClass}).prependTo($wrapper);
 
             // Generate tabs
             Object.entries(tabsConfig).forEach(([tabTitle, contentSelector], index) => {
@@ -69,7 +126,7 @@
             });
 
             // Tab click event
-            $tabsContainer.on('click', `.${settings.tabClass}`, function(e) {
+            $tabsContainer.on('click', `.${settings.tabClass}`, function (e) {
                 e.preventDefault();
                 const $tab = $(this);
                 const target = $tab.data('target');
@@ -88,7 +145,7 @@
     // Object to store ongoing requests by namespace
     const requests = {};
 
-    $.abortiveSingularAjax = function(options) {
+    $.abortiveSingularAjax = function (options) {
         const namespace = options.namespace || 'default';
 
         // Abort the current request in this namespace if it's still ongoing

changedetectionio/static/js/watch-settings.js

@@ -72,16 +72,13 @@ $(document).ready(function () {
     $("#text-preview-inner").css('max-height', (vh-300)+"px");
     $("#text-preview-before-inner").css('max-height', (vh-300)+"px");
 
-    // Realtime preview of 'Filters & Text' setup
-    var debounced_request_textpreview_update = request_textpreview_update.debounce(100);
-
     $("#activate-text-preview").click(function (e) {
         $('body').toggleClass('preview-text-enabled')
         request_textpreview_update();
         const method = $('body').hasClass('preview-text-enabled') ? 'on' : 'off';
-        $('textarea:visible')[method]('keyup blur', debounced_request_textpreview_update);
+        $('textarea:visible')[method]('keyup blur', request_textpreview_update.throttle(1000));
-        $('input:visible')[method]('keyup blur change', debounced_request_textpreview_update);
+        $('input:visible')[method]('keyup blur change', request_textpreview_update.throttle(1000));
-        $("#filters-and-triggers-tab")[method]('click', debounced_request_textpreview_update);
+        $("#filters-and-triggers-tab")[method]('click', request_textpreview_update.throttle(1000));
     });
     $('.minitabs-wrapper').miniTabs({
         "Content after filters": "#text-preview-inner",