finalizes things to be moved onto the server

app.py

@@ -205,7 +205,7 @@ def motifindex():
     group by
         id, name, category
     order by
-        clip.song_id
+        min(clip.song_id)
     ''').fetchall()
 
     return flask.render_template('motifindex.html',
@@ -411,16 +411,12 @@ def songpage(id):
 @app.route('/suggest')
 def suggestpage():
 
-
-
     return flask.render_template('suggest.html',
     )
 
 @app.route('/sent', methods=['POST'])
 def sentpage():
 
-    print(flask.request.headers)
-
     with open ('suggestions.csv', 'a', newline='') as suggestlog:
         logwriter = csv.writer(suggestlog)
         logwriter.writerow([
@@ -432,4 +428,4 @@ def sentpage():
             flask.request.form['suggest-description'][:10_000],
         ])
     return flask.render_template('sent.html',
-    )
+    )

notes.txt

@@ -1,12 +0,0 @@
-eorzea-songbook.com/
-
-index.html
-
-/song
-	/id
-
-/motif
-	/id
-	
-/album
-	/id

static/script.js

@@ -85,11 +85,10 @@ function searchIconChange(event, buttonid, barid) {
     }
 }
 
-function clearSearch(searchid, resultid, clickevent) {
+function clearSearch(searchid, resultid) {
     const searchbar = document.getElementById(searchid);
     const searchresults = document.getElementById(resultid);
     searchbar.value = '';
     searchresults.replaceChildren();
     searchbar.dispatchEvent(new Event('input'));
-    clickevent.preventDefault();
 }

static/style.css

@@ -31,6 +31,43 @@
     }
 }
 
+/* shippori-mincho-regular - japanese_latin */
+@font-face {
+    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
+    font-family: 'Shippori Mincho';
+    font-style: normal;
+    font-weight: 400;
+    src: url('../static/fonts/shippori-mincho-v14-japanese_latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
+  }
+  
+  /* shippori-mincho-700 - japanese_latin */
+  @font-face {
+    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
+    font-family: 'Shippori Mincho';
+    font-style: normal;
+    font-weight: 700;
+    src: url('../static/fonts/shippori-mincho-v14-japanese_latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
+  }
+  
+  /* zen-maru-gothic-regular - japanese_latin */
+  @font-face {
+    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
+    font-family: 'Zen Maru Gothic';
+    font-style: normal;
+    font-weight: 400;
+    src: url('../static/fonts/zen-maru-gothic-v14-japanese_latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
+  }
+  
+  /* zen-maru-gothic-700 - japanese_latin */
+  @font-face {
+    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
+    font-family: 'Zen Maru Gothic';
+    font-style: normal;
+    font-weight: 700;
+    src: url('../static/fonts/zen-maru-gothic-v14-japanese_latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
+  }
+  
+
 h1, h2, h3, h4, h5, h6{
     font-family: "Shippori Mincho", serif;
     margin: 0;
@@ -211,7 +248,6 @@ header{
     margin-left: auto; margin-right: auto;
     background-color: var(--block);
     padding-top: .6rem; padding-bottom: .6rem;
-    /* border-style: solid; border-top: 0; border-left: 0; border-right: 0; border-color: var(--thin-border); border-width: 1px; */
 }
 
 .search-items{
@@ -240,9 +276,12 @@ header{
     padding: 0;
 }
 
-.search-icon{
-    height: 100%;
-    content: "🔎︎";
+.search-clear{
+    all:unset;
+    width: 1.2rem;
+    margin-left: .6rem;
+    text-align: center;
+    cursor: pointer;
 }
 
 .search-clear.hidden{

templates/base.html

@@ -5,12 +5,22 @@
         <title>{% block title required %}{% endblock %} - Eorzea Songbook</title>
         <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=1" />
         <meta name="description" content="An unofficial library of the motifs in Final Fantasy XIV's soundtrack." />
-        <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Shippori+Mincho|Shippori+Mincho:bold|Zen+Maru+Gothic|Zen+Maru+Gothic:bold" />
         <link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}" />
         {%block sheet %}{% endblock %}
         <link rel="icon" type="image/png" href="{{ url_for('static', filename='songbook.png') }}" />
-        <script src="https://unpkg.com/htmx.org@1.9.2" integrity="sha384-L6OqL9pRWyyFU3+/bjdSri+iIphTN/bvYyM37tICVyOJkWZLpP2vGn6VUEXgzg6h" crossorigin="anonymous"></script>
+        <script src="{{ url_for('static', filename='htmx.min.js') }}"></script>
         <script src="{{ url_for('static', filename='script.js') }}"></script>
+        <script type="text/javascript">
+            window.addEventListener('keydown',function(e) {
+                if (e.keyIdentifier=='U+000A' || e.keyIdentifier=='Enter' || e.keyCode==13) {
+                    if (e.target.nodeName=='INPUT' && e.target.type=='text') {
+                        e.preventDefault();
+        
+                        return false;
+                    }
+                }
+            }, true);
+        </script>        
     </head>
   
     <body>
@@ -19,7 +29,6 @@
         {% block main %}<main>{% endblock %}
         {% block content required %}{% endblock %}
         {% block main2 %}</main>{% endblock %}
-        
         {% block footer %}{% include 'footer.html' %}{% endblock %}
 
     </body>

templates/jinja quarantine.html

@@ -1,11 +0,0 @@
-<!-- {% macro icon(type) -%}
-    <img src="{{ url_for('static', filename='{0}icon.png'.format(type)) }}" alt='{{ type}} icon' class='connection-icon'>
-{%- endmacro %}
-
-{% macro link(type) -%}
-    {{ url_for('{0}page'.format(type), id=) }}"> {{ motif }}
-{%- endmacro %}
- -->
-
-         <!-- {{ icon(type) }}
-        {{ link(type) }} -->

templates/nav.html

@@ -24,7 +24,7 @@
 
 <div id="top-search" class="search-bar search-empty">
     <!-- <span class="search-icon"></span> -->
-    <button id="search-button" class="search-clear hidden" onclick="clearSearch('search-input', 'search-results-header', event)">X</button>
+    <button id="search-button" class="search-clear hidden" onclick="clearSearch('search-input', 'search-results-header', event)">🗙</button>
     <div class="search-items">
         <input
             id="search-input"

templates/sent.html

@@ -4,7 +4,7 @@
 
 {% block content %}
 
-
+<p>Thanks for your suggestion! It may take a while for me to check it out and update the website, so please be patient.</p>
 
 
 {% endblock %}

templates/suggest.html

@@ -4,7 +4,7 @@
 
 {% block content %}
 
-<p>If you know about songs in the Final Fantasy XIV soundtrack that share a connection, and you can't find it on the website, tell me about it here. Just pick the two songs that share a motif - or the motif itself, if it already has a page - and tell me what to listen out for.</p>
+<p>If you know about songs in the Final Fantasy XIV soundtrack that share a connection, and you can't find it on the website, tell me about it here. Just pick the two songs that share a motif - or the motif itself, if it already has a page - and tell me what to listen out for. Timestamps are especially helpful!</p>
 
 <form action="/sent" method="post" >
     <div class="suggestbox">
@@ -17,8 +17,8 @@
                         <div>Nothing selected yet.</div>
                     </div>
                     <div id="suggest-bar-{{ i }}" class="search-bar search-empty">
+                        <button type="button" id="suggest-button-{{ i }}" class="search-clear hidden" onclick="clearSearch('search-input-suggest-{{ i }}', 'search-results-{{ i }}')">🗙</button>
                         <div class="search-items">
-                            <button id="suggest-button-{{ i }}" class="search-clear hidden" onclick="clearSearch('search-input-suggest-{{ i }}', 'search-results-{{ i }}', event)">X</button>
                             <input
                                 id="search-input-suggest-{{ i }}"
                                 type="text"
@@ -29,6 +29,7 @@
                                 hx-trigger="keyup changed delay:250ms, search"
                                 hx-target="#search-results-{{ i }}"
                                 oninput="searchIconChange(event, 'suggest-button-{{ i }}', 'suggest-bar-{{ i }}')"
+                                keydown="return event.keyCode != 13;"
                             />
                             <div id="search-results-{{ i }}" class="search-results" data-form="{{ i }}"></div>
                         </div>