UI tweaks

changedetectionio/static/js/watch-settings.js

@@ -33,6 +33,10 @@ function toggleOpacity(checkboxSelector, fieldSelector, inverted) {
 })(jQuery);
 
 function request_textpreview_update() {
+    if (!$('body').hasClass('preview-text-enabled')) {
+        return
+    }
+
     const data = {};
     $('textarea:visible, input:visible').each(function () {
         const $element = $(this); // Cache the jQuery object for the current element
@@ -80,11 +84,13 @@ $(document).ready(function () {
         $('body').toggleClass('preview-text-enabled')
 
         request_textpreview_update();
+
         $("#text-preview-refresh").click(function (e) {
             request_textpreview_update();
         });
         $('textarea:visible').on('keyup blur', debounced_request_textpreview_update);
         $('input:visible').on('keyup blur change', debounced_request_textpreview_update);
+        $("#filters-and-triggers-tab").on('click', debounced_request_textpreview_update);
     });
 
 });

changedetectionio/templates/edit.html

@@ -50,7 +50,7 @@
             {% endif %}
             {% if watch['processor'] == 'text_json_diff' %}
             <li class="tab"><a id="visualselector-tab" href="#visualselector">Visual Filter Selector</a></li>
-            <li class="tab"><a href="#filters-and-triggers">Filters &amp; Triggers</a></li>
+            <li class="tab" id="filters-and-triggers-tab"><a href="#filters-and-triggers">Filters &amp; Triggers</a></li>
             {% endif %}
             <li class="tab"><a href="#notifications">Notifications</a></li>
             <li class="tab"><a href="#stats">Stats</a></li>