ui: add buttons to update the URL with the current filters

Add buttons to update URL from currently set filters.
This is very useful when filtered down list needs to
be shared over email.

Signed-off-by: Jakub Kicinski <[email protected]>

Author: kuba-moo

ui/contest.html

@@ -93,6 +93,10 @@
           </div>
           <div class="column-small">
               <span id="filter-info"></span>
+              <br /><br />
+              <p>
+                  <a href="#" id="update-url-button" class="nipa-button">Update URL</a>
+              </p>
           </div>
       </div>
       <div class="row-small">

ui/contest.js

@@ -276,6 +276,61 @@ function reload_data(event)
     });
 }
 
+function update_url_from_filters()
+{
+    const result_filter = {
+        "pass": document.getElementById("pass").checked,
+        "skip": document.getElementById("skip").checked,
+        "warn": document.getElementById("warn").checked,
+        "fail": document.getElementById("fail").checked
+    };
+    const branch_filter = document.getElementById("branch").value;
+    const exec_filter = document.getElementById("executor").value;
+    const remote_filter = document.getElementById("remote").value;
+    const test_filter = document.getElementById("test").value;
+    const pw_n = document.getElementById("pw-n").checked;
+    const pw_y = document.getElementById("pw-y").checked;
+    const ld_cases = document.getElementById("ld-cases").checked;
+
+    // Create new URL with current filters
+    const currentUrl = new URL(window.location.href);
+
+    // Clear existing filter parameters
+    const filterParams = ['pass', 'skip', 'warn', 'fail', 'branch', 'executor',
+			  'remote', 'test', 'pw-n', 'pw-y', 'ld-cases'];
+    filterParams.forEach(param => currentUrl.searchParams.delete(param));
+
+    // Add current filter states to URL
+    if (!result_filter.pass)
+	currentUrl.searchParams.set('pass', '0');
+    if (!result_filter.skip)
+	currentUrl.searchParams.set('skip', '0');
+    if (!result_filter.warn)
+	currentUrl.searchParams.set('warn', '0');
+    if (!result_filter.fail)
+	currentUrl.searchParams.set('fail', '0');
+
+    if (branch_filter)
+	currentUrl.searchParams.set('branch', branch_filter);
+    if (exec_filter)
+	currentUrl.searchParams.set('executor', exec_filter);
+    if (remote_filter)
+	currentUrl.searchParams.set('remote', remote_filter);
+    if (test_filter)
+	currentUrl.searchParams.set('test', test_filter);
+
+    if (!pw_n)
+	currentUrl.searchParams.set('pw-n', '0');
+    if (!pw_y)
+	currentUrl.searchParams.set('pw-y', '0');
+
+    if (ld_cases)
+	currentUrl.searchParams.set('ld-cases', '1');
+
+    // Update the browser URL without reloading the page
+    window.history.pushState({}, '', currentUrl.toString());
+}
+
 function embedded_mode() {
     $('#loading-fieldset').hide();
     $('#sitemap').hide();
@@ -313,6 +368,11 @@ function do_it()
 	document.getElementById("ld_cnt").value = 1;
     }
 
+    $('#update-url-button').on('click', function (e) {
+        e.preventDefault();
+        update_url_from_filters();
+    });
+
     nipa_sort_cb = results_update;
 
     /*

ui/flakes.html

@@ -69,6 +69,9 @@
                         <label for="sort-streak">current streak</label>
                     </div>
                 </fieldset>
+                <p>
+                    <a href="#" id="update-url-button" class="nipa-button">Update URL</a>
+                </p>
             </div>
         </div>
         <div class="row-small">

ui/flakes.js

@@ -209,6 +209,55 @@ function remotes_loaded(data_raw)
     loaded_one();
 }
 
+function update_url_from_filters()
+{
+    const tn_needle = document.getElementById("tn-needle").value;
+    const min_flip = document.getElementById("min-flip").value;
+    const pw_n = document.getElementById("pw-n").checked;
+    const pw_y = document.getElementById("pw-y").checked;
+    const sort_streak = document.getElementById("sort-streak").checked;
+    const br_cnt = document.getElementById("br-cnt").value;
+    const br_pfx = document.getElementById("br-pfx").value;
+    const ld_remote = document.getElementById("ld-remote").value;
+    const ld_cases = document.getElementById("ld-cases").checked;
+
+    // Create new URL with current filters
+    const currentUrl = new URL(window.location.href);
+
+    // Clear existing filter parameters
+    const filterParams = ['tn-needle', 'min-flip', 'pw-n', 'pw-y', 'sort-flips',
+			  'sort-streak', 'br-cnt', 'br-pfx',
+			  'ld-remote', 'ld-cases'];
+    filterParams.forEach(param => currentUrl.searchParams.delete(param));
+
+    // Add current filter states to URL
+    if (tn_needle)
+	currentUrl.searchParams.set('tn-needle', tn_needle);
+    if (min_flip && min_flip !== '1')
+	currentUrl.searchParams.set('min-flip', min_flip);
+
+    if (!pw_n)
+	currentUrl.searchParams.set('pw-n', '0');
+    if (!pw_y)
+	currentUrl.searchParams.set('pw-y', '0');
+
+    if (sort_streak)
+	currentUrl.searchParams.set('sort-streak', '1');
+
+    if (br_cnt && br_cnt !== '100')
+	currentUrl.searchParams.set('br-cnt', br_cnt);
+    if (br_pfx)
+	currentUrl.searchParams.set('br-pfx', br_pfx);
+    if (ld_remote)
+	currentUrl.searchParams.set('ld-remote', ld_remote);
+
+    if (ld_cases)
+	currentUrl.searchParams.set('ld-cases', '1');
+
+    // Update the browser URL without reloading the page
+    window.history.pushState({}, '', currentUrl.toString());
+}
+
 function reload_data()
 {
     const format_l2 = document.getElementById("ld-cases");
@@ -238,6 +287,11 @@ function do_it()
     nipa_filters_enable(results_update, "fl-pw");
     nipa_input_set_from_url("ld-pw");
 
+    $('#update-url-button').on('click', function (e) {
+        e.preventDefault();
+        update_url_from_filters();
+    });
+
     /*
      * Please remember to keep these assets in sync with `scripts/ui_assets.sh`
      */