Make search link a modal popup if using JS

This commit is contained in:
Jason McBrayer 2018-12-03 17:58:08 -05:00
parent e42628c6a3
commit b4822b87ce
3 changed files with 49 additions and 3 deletions

View File

@ -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>

View File

@ -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>

View File

@ -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