Make search link a modal popup if using JS

brutaldon/templates/base.html

@@ -119,7 +119,10 @@
                                     <span class="fa fa-edit"> </span>
                                     <span >&nbsp; New Toot</span>
                                 </a>
-                                <a class="navbar-item" href="{% url "search" %}">
+                                <a class="navbar-item" href="{% url "search" %}"
+                                   ic-get-from="{% url "search" %}"
+                                   ic-target="#new-toot-modal"
+                                   ic-on-complete="$('#new-toot-modal').toggleClass('is-active');">
                                     <span class="fa fa-search"> </span>
                                     <span >&nbsp; Search</span>
                                 </a>

brutaldon/templates/intercooler/search.html

@@ -0,0 +1,37 @@
+<div class="modal-background" ></div>
+<div class="modal-content">
+
+    <div class="box">
+        <h1 class="title">Search</h1>
+
+        <div class="notification">
+            <div>
+                You can search for tags, users, or for specific toots by URL. You may
+                also be able to full-text search for toots you have previously
+                interacted with.
+            </div>
+        </div>
+        <form method="get" action="{% url "search_results" %}">
+            <div class="field">
+                <label class="label">{{ form.instance.label  }}</label>
+                <div class="control has-icons-left">
+                    <input type="search" name="q" id="q" class="input">
+                    <span class="icon is-small is-left">
+                        <i class="fa fa-search"></i>
+                    </span>
+                </div>
+            </div>
+
+            <div class="field">
+                <input type="submit" value="Search" class="button is-primary" >
+            </div>
+        </form>
+    </div>
+</div>
+<button id="toot-modal-close" class="modal-close is-large" aria-label="close"></button>
+
+<script type="application/javascript">
+ $("#toot-modal-close").on("click", function () { $("#new-toot-modal").toggleClass("is-active"); });
+ $(".modal-background").on("click", function () { $("#new-toot-modal").toggleClass("is-active"); });
+ Mousetrap.bind('esc', function(e) { $("#new-toot-modal").toggleClass("is-active"); });
+</script>

brutaldon/views.py

@@ -777,9 +777,15 @@ def mute(request, id):
 @br_login_required
 def search(request):
     account, mastodon = get_usercontext(request)
-    return render(request, 'main/search.html',
+    if request.GET.get('ic-request'):
+        return render(request, 'intercooler/search.html',
                       {"preferences": account.preferences,
-                           'own_acct':  request.session['user'],
+                       'own_acct':  request.session['user'],
+                      })
+    else:
+        return render(request, 'main/search.html',
+                      {"preferences": account.preferences,
+                       'own_acct':  request.session['user'],
                       })
 
 @br_login_required