From 8b555991e4e62e6a47761c904890c43c1e3c6285 Mon Sep 17 00:00:00 2001
From: itdominator <1itdominator@gmail.com>
Date: Sat, 6 Apr 2024 04:35:06 -0500
Subject: [PATCH] Creating Search/Replace UI

---
 .../usr/share/newton/context_path/index.html  |  92 ++++++++++++++++++
 .../resources/css/newton/main.css             |  34 +++++++
 .../resources/imgs/only-in-selection.png      | Bin 0 -> 6270 bytes
 .../resources/imgs/whole-word.png             | Bin 0 -> 6651 bytes
 .../resources/js/newton/components.js         |  32 ++++++
 .../resources/js/newton/events.js             |   8 ++
 .../resources/js/newton/keybinding-newton.js  |   4 +-
 .../resources/js/newton/ui-logic.js           |   8 ++
 8 files changed, 177 insertions(+), 1 deletion(-)
 create mode 100644 user_config/usr/share/newton/context_path/resources/imgs/only-in-selection.png
 create mode 100644 user_config/usr/share/newton/context_path/resources/imgs/whole-word.png

diff --git a/user_config/usr/share/newton/context_path/index.html b/user_config/usr/share/newton/context_path/index.html
index a4c8da5..63f8ffb 100644
--- a/user_config/usr/share/newton/context_path/index.html
+++ b/user_config/usr/share/newton/context_path/index.html
@@ -23,8 +23,21 @@
     </div>
 
 
+    <p id="top-gutter"
+        class="fixed-top"
+        data-toggle="popover"
+        data-placement="bottom">
+    </p>
+
     <pre id="editor"></pre>
 
+    <p id="bottom-gutter"
+        class="fixed-bottom"
+        data-toggle="popover"
+        data-placement="top">
+    </p>
+
+
     <!-- Buffers modal -->
     <div class="modal" id="buffers-modal" tabindex="-1" role="dialog"
         data-bs-theme="dark" data-bs-keyboard="false" data-bs-backdrop="static">
@@ -85,6 +98,85 @@
 
 
     <!-- Template Tags... -->
+    <template id="search-replace-template">
+        <!-- Bootstrap CSS -->
+        <link rel="stylesheet" href="resources/css/libs/bootstrap5/bootstrap.min.css">
+        <link rel="stylesheet" href="resources/css/libs/bootstrap-icons/bootstrap-icons.css">
+
+        <!-- Site CSS -->
+        <!--  <link rel="stylesheet" href="resources/css/newton/context-menu.css">  -->
+        <link rel="stylesheet" href="resources/css/newton/main.css">
+        <link rel="stylesheet" href="resources/css/newton/overrides.css">
+
+        <style>
+        </style>
+        <section>
+            <div id="search-replace" class="row">
+                <div class="col">
+                    <div class="row">
+                        <div class="col col-3">
+                            <label id="find-status-lbl">Find in Current Buffer</label>
+                        </div>
+
+                        <div class="col col-4">
+                            <label id="find-options-lbl">Finding with Options: Case Insensitive</label>
+                        </div>
+
+                        <div class="col col-5 line-height-32px">
+                            <button title="Close Panel" class="float-end" onclick="hideSearchReplace()">X</button>
+                            <button title="Whole Word" class="float-end">
+                                <img src="resources/imgs/whole-word.png" />
+                            </button>
+                            <button title="Only In Selection" class="float-end">
+                                <img src="resources/imgs/only-in-selection.png" />
+                            </button>
+                            <button title="Match Case" class="float-end">Aa</button>
+
+
+                            <button title="Use Regex" class="float-end">.*</button>
+                        </div>
+                    </div>
+
+                    <div class="margin-tb-1em"></div>
+
+                    <div class="row">
+                        <div class="col">
+
+                            <div class="row">
+                                <div class="col">
+                                    <input id="find-entry" class="sr-input-expand" type="search"
+                                        title="Find in current buffer"
+                                        placeholder="Find in current buffer"
+                                    />
+                                </div>
+                                <div class="col col-auto">
+                                    <button class="float-end width-8em">Find All</button>
+                                    <button class="float-end width-8em">Find</button>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+
+                    <div class="margin-tb-1em"></div>
+
+                    <div class="row">
+                        <div class="col">
+                            <input id="replace-entry" class="sr-input-expand" type="search"
+                                title="Replace in current buffer"
+                                placeholder="Replace in current buffer"
+                            />
+                        </div>
+                        <div class="col col-auto">
+                            <button class="float-end width-8em">Replace All</button>
+                            <button class="float-end width-8em">Replace</button>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </section>
+    </template>
+
+
     <template id="lsp-config-template">
         <style>
         </style>
diff --git a/user_config/usr/share/newton/context_path/resources/css/newton/main.css b/user_config/usr/share/newton/context_path/resources/css/newton/main.css
index 7cdd1e8..e0caaa3 100644
--- a/user_config/usr/share/newton/context_path/resources/css/newton/main.css
+++ b/user_config/usr/share/newton/context_path/resources/css/newton/main.css
@@ -45,8 +45,42 @@
     overflow-y: auto;
 }
 
+#bottom-gutter {
+    /*position: fixed;*/
+    bottom: 0px;
+}
+
 
 /* CLASSES */
+.popover * {
+    background: rgba(0, 0, 0, 0.0);
+    color: rgba(255, 255, 255, 1);
+}
+
+.popover {
+    background: rgba(39, 43, 52, 0.64);
+    max-width: 80%;
+    width: 80%;
+    transform: translate(0px, 0px) !important;
+    margin: auto 12% !important;
+}
+
+.sr-input-expand {
+    width: 100%;
+}
+
+.line-height-32px {
+    line-height: 32px;
+}
+
+.margin-tb-1em {
+    margin-top: 1em;
+    margin-bottom: 1em;
+}
+
+.width-8em {
+    width: 8em;
+}
 
 .max-height-800 {
     max-height: 800px;
diff --git a/user_config/usr/share/newton/context_path/resources/imgs/only-in-selection.png b/user_config/usr/share/newton/context_path/resources/imgs/only-in-selection.png
new file mode 100644
index 0000000000000000000000000000000000000000..3c35fc3f6dbf8fdc5b59df53656d530d5ac1168c
GIT binary patch
literal 6270
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
KO_6or=6?Yu9o_N(

literal 0
HcmV?d00001

diff --git a/user_config/usr/share/newton/context_path/resources/imgs/whole-word.png b/user_config/usr/share/newton/context_path/resources/imgs/whole-word.png
new file mode 100644
index 0000000000000000000000000000000000000000..d147682c5511c630f529540bda883593998d8262
GIT binary patch
literal 6651
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
GV*UfR#)(G&

literal 0
HcmV?d00001

diff --git a/user_config/usr/share/newton/context_path/resources/js/newton/components.js b/user_config/usr/share/newton/context_path/resources/js/newton/components.js
index fe292cf..61f85e5 100644
--- a/user_config/usr/share/newton/context_path/resources/js/newton/components.js
+++ b/user_config/usr/share/newton/context_path/resources/js/newton/components.js
@@ -175,6 +175,29 @@ class InputCheckboxContainer extends HTMLElement {
     }
 }
 
+class SearchReplaceContainer extends HTMLElement {
+    constructor() {
+        super();
+    }
+
+    loadShaddowRoot(tag = "search-replace-template") {
+        let template = document.getElementById(tag);
+        let templateContent = template.content;
+
+        const shadowRoot = this.attachShadow({ mode: "open" });
+        shadowRoot.appendChild( templateContent.cloneNode(true) );
+    }
+
+    loadSignals() {
+        let elm = this.shadowRoot.getElementById("find-entry");
+
+        elm.addEventListener("keyup", (eve) => {
+            findEntry(eve.value);
+        });
+    }
+
+}
+
 
 
 
@@ -211,4 +234,13 @@ class InputCheckbox extends InputCheckboxContainer {
         super();
         this.loadShaddowRoot();
     }
+}
+
+class SearchReplace extends SearchReplaceContainer {
+    constructor() {
+        super();
+
+        this.loadShaddowRoot();
+        this.loadSignals();
+    }
 }
\ No newline at end of file
diff --git a/user_config/usr/share/newton/context_path/resources/js/newton/events.js b/user_config/usr/share/newton/context_path/resources/js/newton/events.js
index bccd473..4cae356 100644
--- a/user_config/usr/share/newton/context_path/resources/js/newton/events.js
+++ b/user_config/usr/share/newton/context_path/resources/js/newton/events.js
@@ -9,6 +9,7 @@ window.onload = (eve) => {
 
     console.log("Loading editor...");
     loadEditor();
+    loadSearchFind();
     loadPreviewEditor();
     loadInitialSession();
     loadStartingFiles();
@@ -21,6 +22,7 @@ const defineCustomElements = () => {
     customElements.define("input-list", InputList, { extends: 'ul' });
     customElements.define("input-list-item", InputListItem, { extends: 'li' });
     customElements.define("input-checkbox", InputCheckbox, { extends: 'input' });
+    customElements.define("search-replace", SearchReplace, { extends: 'div' });
 }
 
 const loadLSPClientJSFiles = () => {
@@ -34,6 +36,12 @@ const loadLSPClientJSFiles = () => {
     // sendMessage(topic = "load_javascript", ftype = "", fhash = "", fpath = `${BASE_LINK}/python-service.js`, content = "");
 }
 
+const loadSearchFind = () => {
+    let elm = document.createElement("search-replace");
+    let options = {container: "html", content: elm, html: true};
+    $('#bottom-gutter').popover(options);
+}
+
 window.onerror = function(msg, url, line, col, error) {
     // Note that col & error are new to the HTML 5 spec and may not be supported in every browser.
     const suppressErrorAlert = false;
diff --git a/user_config/usr/share/newton/context_path/resources/js/newton/keybinding-newton.js b/user_config/usr/share/newton/context_path/resources/js/newton/keybinding-newton.js
index e7f571a..d4b92e9 100644
--- a/user_config/usr/share/newton/context_path/resources/js/newton/keybinding-newton.js
+++ b/user_config/usr/share/newton/context_path/resources/js/newton/keybinding-newton.js
@@ -29,7 +29,9 @@ const editorCommands = [
         name: "search",
         bindKey: {win: "ctrl-f", mac: "ctrl-f"},
         exec: function(editor) {
-            sendMessage("tggl_search_replace", "", "", "", "");
+            // let selectedStr = session.doc.getTextRange(editor.getSelectionRange());
+            $('#bottom-gutter').popover('toggle')
+            // sendMessage("tggl_search_replace", "", "", "", selectedStr);
         },
         readOnly: true
     }, {
diff --git a/user_config/usr/share/newton/context_path/resources/js/newton/ui-logic.js b/user_config/usr/share/newton/context_path/resources/js/newton/ui-logic.js
index a25bcfb..526a7d5 100644
--- a/user_config/usr/share/newton/context_path/resources/js/newton/ui-logic.js
+++ b/user_config/usr/share/newton/context_path/resources/js/newton/ui-logic.js
@@ -296,4 +296,12 @@ const zoomOut = () => {
 const toggleLineHighlight = () => {
     highlightLine = !highlightLine;
     editor.setHighlightActiveLine(highlightLine);
+}
+
+
+
+
+//
+const hideSearchReplace = () => {
+    $('#bottom-gutter').popover('hide')
 }
\ No newline at end of file