aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
authorBryan Newbold <bnewbold@archive.org>2020-08-06 20:22:19 -0700
committerBryan Newbold <bnewbold@archive.org>2020-08-06 20:22:21 -0700
commit70988ab406a68542676c9665272ea26270f7bf82 (patch)
tree9abd36e85e134a64ed8e6d933ca32bd703e7be4c
parentb7a3739239df2fb1573a8677eaef9b7104c4ad0a (diff)
downloadfatcat-scholar-70988ab406a68542676c9665272ea26270f7bf82.tar.gz
fatcat-scholar-70988ab406a68542676c9665272ea26270f7bf82.zip
have search buttons animate after submit
Extremely minimal javascript used
-rw-r--r--fatcat_scholar/templates/base.html9
-rw-r--r--fatcat_scholar/templates/home.html4
2 files changed, 10 insertions, 3 deletions
diff --git a/fatcat_scholar/templates/base.html b/fatcat_scholar/templates/base.html
index 26ac246..29ad1a7 100644
--- a/fatcat_scholar/templates/base.html
+++ b/fatcat_scholar/templates/base.html
@@ -168,7 +168,7 @@
<div class="ui form">
<div class="ui action input large fluid">
<input type="search" placeholder="{{ _("by title, authors, keywords...") }}" name="q" aria-label="search metadata" required itemprop="query-input" style="border-radius: 0; border: 1px #999 solid;" {% if query and query.q %}value="{{ query.q }}"{% endif %}>
- <button class="ui green button" style="border-radius: 0; background-color: #44a25a; font-size: 1.2rem;">{{ _("Search") }}</button>
+ <button id="search_submit_button" class="ui green button" style="border-radius: 0; background-color: #44a25a; font-size: 1.2rem;">{{ _("Search") }}</button>
</div>
</div>
</form>
@@ -250,6 +250,13 @@
crossorigin="anonymous">
</script>
#}
+<script>
+// when search is submitted, have submit button animate
+console.log("hi");
+document.getElementById("search_form").onsubmit = function(){
+ document.getElementById("search_submit_button").classList.add("loading");
+};
+</script>
{% block postscript %}{% endblock %}
</body>
</html>
diff --git a/fatcat_scholar/templates/home.html b/fatcat_scholar/templates/home.html
index 7ff215b..08f76a7 100644
--- a/fatcat_scholar/templates/home.html
+++ b/fatcat_scholar/templates/home.html
@@ -8,12 +8,12 @@
<div class="ui sixteen wide mobile twelve wide computer column">
<div style="width: 100%; text-align: center;">
<img src="/static/scholar-vaporwave-logo.png" style="max-width: 100%; margin-bottom: 1.5em;">
- <form class="" id="fulltext_query" action="{{ lang_prefix }}/search") }}" method="get" role="search" aria-label="papers" itemprop="potentialAction" itemscope itemtype="https://schema.org/SearchAction">
+ <form class="" id="search_form" action="{{ lang_prefix }}/search") }}" method="get" role="search" aria-label="papers" itemprop="potentialAction" itemscope itemtype="https://schema.org/SearchAction">
<meta itemprop="target" content="https://{{ settings.SCHOLAR_DOMAIN }}/fulltext/search?q={q}"/>
<div class="ui form">
<div class="ui action input big fluid">
<input type="text" placeholder="{{ _("by title, author, keywords...") }}" name="q" aria-label="search metadata" required itemprop="query-input" style="border-radius: 0; border: 1px #999 solid;">
- <button class="ui green button" style="border-radius: 0; background-color: #44a25a; font-size: 1.2rem;">{{ _("Search") }}</button>
+ <button id="search_submit_button" class="ui green button" style="border-radius: 0; background-color: #44a25a; font-size: 1.2rem;">{{ _("Search") }}</button>
</div>
</div>
</form>