From 4f1a012c8788456275da188b331ae40fb13bc9b7 Mon Sep 17 00:00:00 2001
From: "sqrd.max" <sqrd.max@gmail.com>
Date: Sat, 18 Nov 2023 00:53:07 +0200
Subject: [PATCH] local storage works

---
 rcdb_web/requirements.txt                     |  3 +-
 rcdb_web/select_values/veiws.py               | 26 +++---
 rcdb_web/templates/run_search_box.html        | 80 ++++++++++++++-----
 .../templates/select_values/custom_table.html | 68 ----------------
 rcdb_web/templates/select_values/index.html   | 45 +++++++++--
 5 files changed, 116 insertions(+), 106 deletions(-)
 delete mode 100644 rcdb_web/templates/select_values/custom_table.html

diff --git a/rcdb_web/requirements.txt b/rcdb_web/requirements.txt
index 7c12b958..46be1c38 100644
--- a/rcdb_web/requirements.txt
+++ b/rcdb_web/requirements.txt
@@ -1,2 +1,3 @@
 flask
-urllib2
\ No newline at end of file
+#urllib2
+jinja2
\ No newline at end of file
diff --git a/rcdb_web/select_values/veiws.py b/rcdb_web/select_values/veiws.py
index 8375bee9..4aa812fd 100644
--- a/rcdb_web/select_values/veiws.py
+++ b/rcdb_web/select_values/veiws.py
@@ -18,10 +18,19 @@
 @mod.route('/')
 def index():
     all_conditions = g.tdb.session.query(ConditionType).order_by(ConditionType.name.asc()).all()
+    run_from_str = request.args.get('runFrom', '')
+    run_to_str = request.args.get('runTo', '')
+    search_query = request.args.get('q', '')
+    req_conditions_str = request.args.get('cnd', '')
+
+    print("search" + search_query)
 
     return render_template("select_values/index.html",
-                           all_conditions=all_conditions)
-    pass
+                           all_conditions=all_conditions,
+                           run_from_str=run_from_str,
+                           run_to_str=run_to_str,
+                           search_query=search_query,
+                           req_conditions_str=req_conditions_str)
 
 
 @mod.route('/search', methods=['GET'])
@@ -30,7 +39,7 @@ def search():
     run_range = request.args.get('rr', '')
     search_query = request.args.get('q', '')
     req_conditions_str = request.args.get('cnd', '')
-    req_conditions_value = req_conditions_str.split(',')
+    req_conditions_values = req_conditions_str.split(',')
 
     run_from_str = request.args.get('runFrom', '')
     run_to_str = request.args.get('runTo', '')
@@ -38,19 +47,17 @@ def search():
     if run_from_str or run_to_str:
         run_range = run_from_str + "-" + run_to_str
 
-    args = {}
     run_from, run_to = _parse_run_range(run_range)
 
     try:
-        table = g.tdb.select_values(val_names=req_conditions_value, search_str=search_query, run_min=run_from,
+        table = g.tdb.select_values(val_names=req_conditions_values, search_str=search_query, run_min=run_from,
                                     run_max=run_to, sort_desc=True)
-        print(req_conditions_value, run_from, run_to)
+        print(req_conditions_values, run_from, run_to)
     except Exception as err:
         flash("Error in performing request: {}".format(err), 'danger')
         return redirect(url_for('select_values.index'))
 
-    condition_types = g.tdb.get_condition_types()
-    print(run_to, run_from)
+    print(search_query)
 
     return render_template("select_values/index.html",
                            all_conditions=all_conditions,
@@ -58,5 +65,6 @@ def search():
                            run_from=run_from,
                            run_to=run_to,
                            search_query=search_query,
-                           req_conditions_value=req_conditions_value,
+                           req_conditions_str=req_conditions_str,
+                           req_conditions_values=req_conditions_values,
                            table=table)
diff --git a/rcdb_web/templates/run_search_box.html b/rcdb_web/templates/run_search_box.html
index 1107f294..5bb6c906 100644
--- a/rcdb_web/templates/run_search_box.html
+++ b/rcdb_web/templates/run_search_box.html
@@ -1,17 +1,11 @@
-{% macro run_search_box(condition_types=[], run_from=-1, run_to=-1, search_query="", form_url=url_for("runs.search")) %}
+{% macro run_search_box(condition_types=[], run_from=-1, run_to=-1, search_query="", req_conditions_str="", form_url=url_for("runs.search")) %}
     {% set run_from_str = "" if run_from == -1 else run_from %}
     {% set run_to_str = "" if run_to == -1 else run_to %}
-    <style>
-    .toggle-icon {
-        transition: transform 0.2s;
-        transform-origin: center;
-    }
-    </style>
 
     <div class="container">
         <div class="panel panel-default">
             <div class="panel-body">
-                 <form  role="search" action="{{ form_url }}" method="get">
+                 <form  role="search" id="main_form" action="{{ form_url }}" method="get">
                      <div class="row ">
                          <div class="col-md-3">
                              <div class="row ">
@@ -61,8 +55,8 @@
                                  </div>
                              </div>
                          </div>
-                         <div class="col-sm-8">
-                             <label class="small" for="queryInput">Search query</label>
+                         <div class="col-sm-9">
+                                <label class="small" for="queryInput">Search query</label>
                              <div class="input-group ">
                                  <input class="form-control  input-sm" rows="1" id="queryInput" name="q" placeholder="event_count>10000 ...(ctrl+space for autocomplete)" value="{{ search_query|safe }}"  />
                                  <div class="input-group-btn">
@@ -83,17 +77,18 @@
                                  </div>
                              </div>
                          </div>
-                         <div class="col-sm-4">
-                            <label class="small" for="req_conditions">Conditions</label>
-                            <div class="input-group">
-                                <input class="form-control input-sm" rows="1" id="req_conditions" name="cnd" placeholder="Enter conditions" value="{{ req_conditions_str|safe }}" />
-                                <div class="input-group-append" style="display: flex; align-items: center;">
-                                    <button id="toggleButton" type="button" class="toggle-button btn btn-info btn-sm">
-                                        <span id="toggleIcon" class="toggle-icon">▼</span>
-                                    </button>
-                                </div>
-                            </div>
-                        </div>
+                         <div class="col-md-12">
+                             <label class="small" for="req_conditions">Conditions</label>
+                             <div class="input-group">
+                                 <input class="form-control" id="req_conditions" name="cnd" placeholder="Enter conditions" value="{{ req_conditions_str|safe }}" />
+                                 <div class="input-group-btn">
+                                     <button id="toggleButton" type="button" class="toggle-button btn btn-info">
+                                        <span id="toggleIcon" class="caret"></span>
+                                     </button>
+                                 </div>
+                             </div>
+                         </div>
+
                      </div>
                  </form>
             </div>
@@ -133,14 +128,35 @@ <h4 class="modal-title" id="myModalLabel">Select conditions</h4>
     </div>
 {% endmacro %}
 
-{% macro run_search_box_scripts(condition_types=[], run_from=-1, run_to=-1, search_query="") %}
+{% macro run_search_box_scripts(condition_types=[], run_from=-1, run_to=-1, search_query="", req_conditions="") %}
     <script src="{{ url_for('static', filename='js/jquery-ui.min.js') }}"></script>
     <script src="{{ url_for('static', filename='js/webintellisense.js') }}"></script>
     <script src="{{ url_for('static', filename='js/webintellisense-textbox.js') }}"></script>
 
 
     <script>
+        function handleFormSubmission() {
+
+            var runFromValue = document.getElementById("run-min-inp").value;
+            var runToValue = document.getElementById("run-max-inp").value;
+            var searchQueryValue = document.getElementById("queryInput").value;
+            var req_conditionsValue = document.getElementById("req_conditions").value;
+
+            console.log(req_conditionsValue);
+            localStorage.setItem("runFromValue", runFromValue);
+            localStorage.setItem("runToValue", runToValue);
+            localStorage.setItem("searchQueryValue", searchQueryValue);
+            localStorage.setItem("req_conditionsValue", req_conditionsValue);
+
+        }
+
         jQuery(document).ready(function() {
+
+            $("#run-min-inp").val(localStorage.getItem("runFromValue"));
+            $("#run-max-inp").val(localStorage.getItem("runToValue"));
+            $("#queryInput").val(localStorage.getItem("searchQueryValue"));
+            $("#req_conditions").val(localStorage.getItem("req_conditionsValue"));
+
             $(".rr-min-selector").click(function( event ) {
                 event.preventDefault();
                 var lnk_btn = $(this);
@@ -207,11 +223,17 @@ <h4 class="modal-title" id="myModalLabel">Select conditions</h4>
                      intellisense.setDeclarations(cnd_types);
                 }
             });
+
+            let myForm = document.getElementById("main_form");
+            console.log(myForm);
+
+            myForm.addEventListener('submit', handleFormSubmission);
         });
 
         const toggleButton = document.getElementById('toggleButton');
         const hiddenTable = document.querySelector('.hidden-table');
         const toggleIcon = document.getElementById('toggleIcon');
+        toggleIcon.style.transform = hiddenTable.classList.contains('hidden') ? 'rotate(0deg)' : 'rotate(180deg)';
 
         toggleButton.addEventListener('click', function(event) {
             event.preventDefault();
@@ -219,6 +241,20 @@ <h4 class="modal-title" id="myModalLabel">Select conditions</h4>
             toggleIcon.style.transform = hiddenTable.classList.contains('hidden') ? 'rotate(0deg)' : 'rotate(180deg)';
         });
 
+
+
+
+
+
+
+
+
+
+
+
+
+
+
     </script>
 
 {% endmacro %}
\ No newline at end of file
diff --git a/rcdb_web/templates/select_values/custom_table.html b/rcdb_web/templates/select_values/custom_table.html
deleted file mode 100644
index 28a4e28d..00000000
--- a/rcdb_web/templates/select_values/custom_table.html
+++ /dev/null
@@ -1,68 +0,0 @@
-{% extends 'layouts/base.html' %}
-{% import 'run_search_box.html' as search_box%}
-
-{% set page_title = 'Test Conditions' %}
-
-{% block container %}
-
-{{ search_box.run_search_box(condition_types=all_conditions, run_from=run_from, run_to=run_to, search_query=search_query, form_url=url_for("select_values.search")) }}
-
-<div class="container">
-
-    <div class="blog-header"><h3 class="blog-title">Custom table</h3></div>
-
-
-    <div class="row">
-        <div class="col-md-4">
-            <table class="table">
-                <thead>
-                    <tr>
-                        <th>Run</th>
-                        {% for cnd_name in req_conditions_value %}
-                            <th>{{ cnd_name }}</th>
-                        {% endfor %}
-                    </tr>
-                </thead>
-                <tbody id="column1-body">
-                    {% for row in table %}
-                        <tr>
-                            {% for col in row %}
-                                <td>{{ col }}</td>
-                            {% endfor %}
-                        </tr>
-                    {% endfor %}
-                </tbody>
-            </table>
-            <input type="hidden" name="q" id="queryInput" value="{{ search_query }}">
-            <input type="hidden" name="r" id="req_conditions" value="{{ req_conditions_str }}">
-        </div>
-    </div>
-
-</div>
-
-{% endblock %}
-
-{% block js_btm %}
-    {{ super() }}
-
-
-    <script>
-
-        let conditionSelect = document.getElementById('condition-select');
-        let column2Body = document.getElementById('column2-body');
-
-        conditionSelect.addEventListener('change', function() {
-            let selectedValue = conditionSelect.value;
-            column2Body.innerHTML = '';
-
-            if (selectedValue) {
-                let newRow = document.createElement('tr');
-                let column2 = document.createElement('td');
-                column2.textContent = selectedValue;
-                newRow.appendChild(column2);
-                column2Body.appendChild(newRow);
-            }
-        });
-    </script>
-    {{ search_box.run_search_box_scripts(condition_types) }}
-{% endblock %}
\ No newline at end of file
diff --git a/rcdb_web/templates/select_values/index.html b/rcdb_web/templates/select_values/index.html
index e4b63649..53b1e860 100644
--- a/rcdb_web/templates/select_values/index.html
+++ b/rcdb_web/templates/select_values/index.html
@@ -5,7 +5,7 @@
 
 {% block container %}
 
-{{ search_box.run_search_box(condition_types=all_conditions, run_from=run_from, run_to=run_to, search_query=search_query, form_url=url_for("select_values.search")) }}
+{{ search_box.run_search_box(condition_types=all_conditions, run_from=run_from, run_to=run_to, search_query=search_query, req_conditions_str=req_conditions_str, form_url=url_for("select_values.search")) }}
 
 <div class="container">
 
@@ -22,15 +22,13 @@
 
                 {% for condition in all_conditions %}
                 <tr>
-                    <td><input type="checkbox" name="selected_conditions" value="{{ condition.name }}" onchange="updateSearchBox(this)"></td>
+                    <td><input id="cnd_checkbox" type="checkbox" name="selected_conditions" value="{{ condition.name }}" onchange="updateSearchBox(this)"></td>
                     <td><span class="label {{ condition.value_type }}-type">{{ condition.value_type }}</span></td>
                     <td>{{ condition.name }}</td>
                     <td>{{ condition.description }}</td>
                 </tr>
                 {% endfor %}
             </table>
-            <input type="hidden" name="q" id="queryInput" value="{{ search_query }}">
-            <input type="hidden" name="r" id="req_conditions" value="{{ req_conditions_str }}">
         </form>
     </div>
     <div class="row">
@@ -39,7 +37,7 @@
                 <thead>
                     <tr>
                         <th>Run</th>
-                        {% for cnd_name in req_conditions_value %}
+                        {% for cnd_name in req_conditions_values %}
                             <th>{{ cnd_name }}</th>
                         {% endfor %}
                     </tr>
@@ -77,9 +75,44 @@
                     searchInput.value += `,${conditionName}`;
                 }
             } else {
-                searchInput.value = searchInput.value.replace(`${conditionName},`, '').replace(conditionName, '');
+                searchInput.value = searchInput.value.replace(`${conditionName},`, '').replace(`,${conditionName}`, '').replace(conditionName, '');
             }
         }
+
+        function updateLocalStorage() {
+            var checkboxes = document.querySelectorAll('input[type="checkbox"]');
+
+            checkboxes.forEach(function(checkbox) {
+                localStorage.setItem(checkbox.value, checkbox.checked);
+            });
+        }
+
+        function loadCheckboxState() {
+            var checkboxState = {};
+
+            for (var i = 0; i < localStorage.length; i++) {
+                var key = localStorage.key(i);
+                checkboxState[key] = localStorage.getItem(key) === 'true';
+            }
+
+            var checkboxes = document.querySelectorAll('input[type="checkbox"]');
+            checkboxes.forEach(function(checkbox) {
+                checkbox.checked = checkboxState[checkbox.value] || false;
+            });
+        }
+
+        document.addEventListener('DOMContentLoaded', function() {
+            loadCheckboxState();
+        });
+
+
+        var checkboxes = document.querySelectorAll('input[type="checkbox"]');
+        checkboxes.forEach(function(checkbox) {
+            checkbox.addEventListener('change', function() {
+                updateLocalStorage();
+            });
+        });
+
         
 
     </script>