Compare commits
No commits in common. "fd57f5813d4148400eb6756dc679a7b691de62e8" and "3e3d31813412726f6886553f6de85150e1aa93e8" have entirely different histories.
fd57f5813d
...
3e3d318134
@ -1 +0,0 @@
|
||||
__pycache__/
|
||||
3
.gitignore
vendored
3
.gitignore
vendored
@ -1,4 +1,3 @@
|
||||
/songbook.sqlite
|
||||
/static/clip/
|
||||
/__pycache__/
|
||||
/suggestions.csv
|
||||
/__pycache__/
|
||||
14
Dockerfile
14
Dockerfile
@ -1,14 +0,0 @@
|
||||
FROM python:3.11-slim
|
||||
|
||||
RUN pip3 install poetry
|
||||
RUN poetry config virtualenvs.create false
|
||||
|
||||
RUN mkdir /opt/app
|
||||
WORKDIR /opt/app
|
||||
|
||||
COPY pyproject.toml poetry.lock ./
|
||||
RUN poetry install --no-dev
|
||||
|
||||
COPY ./ ./
|
||||
|
||||
CMD ["gunicorn", "--bind", "0.0.0.0"]
|
||||
10
app.py
10
app.py
@ -329,7 +329,7 @@ def songpage(id):
|
||||
|
||||
song_info = db.execute('''
|
||||
select
|
||||
name, name_jp, location
|
||||
name, name_jp
|
||||
from
|
||||
song
|
||||
where
|
||||
@ -419,17 +419,11 @@ def suggestpage():
|
||||
@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([
|
||||
datetime.datetime.now().isoformat(),
|
||||
flask.request.form['connection-0-desc'][:4],
|
||||
flask.request.form['connection-0-id'][:4],
|
||||
flask.request.form['connection-1-desc'][:4],
|
||||
flask.request.form['connection-1-id'][:4],
|
||||
flask.request.form['suggest-description'][:10_000],
|
||||
flask.request.form['suggest-description'],
|
||||
])
|
||||
return flask.render_template('sent.html',
|
||||
)
|
||||
|
||||
@ -37,7 +37,7 @@ for song, motif, start, duration, album, track in db.execute('''
|
||||
|
||||
# get clip filename
|
||||
|
||||
destination = f'static/clip/{song:04}-{motif:03}.mp3'
|
||||
destination = f'static/clip/{song:04}-{motif:03}.flac'
|
||||
|
||||
print(destination)
|
||||
|
||||
|
||||
@ -15,13 +15,13 @@ clipdata = pyexcel_odsr.get_data('reference_clips.ods', skip_empty_rows=True)
|
||||
|
||||
# import song
|
||||
cur.executemany(
|
||||
'insert or ignore into song(id,name,name_jp,location) values(?, ?, ?, ?)',
|
||||
((row[0],row[3],row[4],'' if len(row)<11 else row[10]) for row in data['Song'][1:])
|
||||
'insert or ignore into song(id,name,name_jp) values(?, ?, ?)',
|
||||
((row[0],row[3],row[4]) for row in data['Song'][1:])
|
||||
)
|
||||
|
||||
# import album
|
||||
cur.executemany(
|
||||
'insert into album(id,name,date,code,description,updates) values (?, ?, ?, ?, ?, ?)',
|
||||
'insert into album(id,name,date,code) values (?, ?, ?, ?)',
|
||||
data['Album'][1:]
|
||||
)
|
||||
|
||||
|
||||
5
db.sql
5
db.sql
@ -4,16 +4,13 @@ create table song(
|
||||
id int primary key,
|
||||
name text not null,
|
||||
name_jp text not null,
|
||||
location text not null,
|
||||
unique(name,name_jp)
|
||||
);
|
||||
|
||||
create table album(
|
||||
id int primary key,
|
||||
name text not null,
|
||||
date date not null,
|
||||
description text not null,
|
||||
updates text not null,
|
||||
date date not null,
|
||||
code char(3) not null
|
||||
);
|
||||
|
||||
|
||||
@ -1,6 +0,0 @@
|
||||
services:
|
||||
app:
|
||||
build: .
|
||||
init: true
|
||||
ports:
|
||||
- "127.0.0.1:5123:8000"
|
||||
@ -1 +0,0 @@
|
||||
wsgi_app = 'app:app'
|
||||
17
poetry.lock
generated
17
poetry.lock
generated
@ -44,20 +44,6 @@ Werkzeug = ">=2.3.3"
|
||||
async = ["asgiref (>=3.2)"]
|
||||
dotenv = ["python-dotenv"]
|
||||
|
||||
[[package]]
|
||||
name = "gunicorn"
|
||||
version = "20.1.0"
|
||||
description = "WSGI HTTP Server for UNIX"
|
||||
category = "main"
|
||||
optional = false
|
||||
python-versions = ">=3.5"
|
||||
|
||||
[package.extras]
|
||||
eventlet = ["eventlet (>=0.24.1)"]
|
||||
gevent = ["gevent (>=1.4.0)"]
|
||||
setproctitle = ["setproctitle"]
|
||||
tornado = ["tornado (>=0.2)"]
|
||||
|
||||
[[package]]
|
||||
name = "itsdangerous"
|
||||
version = "2.1.2"
|
||||
@ -178,14 +164,13 @@ watchdog = ["watchdog (>=2.3)"]
|
||||
[metadata]
|
||||
lock-version = "1.1"
|
||||
python-versions = "^3.10"
|
||||
content-hash = "1a5905d329305a82f0568b7fdea227b713ee393a14f79e5247af77551ffda804"
|
||||
content-hash = "eb105df2967c9247e5d32c49b9996442ba31976fb4da0c99bffa003aa8242182"
|
||||
|
||||
[metadata.files]
|
||||
blinker = []
|
||||
click = []
|
||||
colorama = []
|
||||
flask = []
|
||||
gunicorn = []
|
||||
itsdangerous = []
|
||||
jinja2 = []
|
||||
lml = []
|
||||
|
||||
@ -10,7 +10,6 @@ sox = "^1.4.1"
|
||||
Jinja2 = "^3.1.2"
|
||||
pyexcel-odsr = "^0.6.0"
|
||||
Flask = "^2.3.2"
|
||||
gunicorn = "^20.1.0"
|
||||
|
||||
[tool.poetry.dev-dependencies]
|
||||
|
||||
|
||||
BIN
reference.ods
BIN
reference.ods
Binary file not shown.
Binary file not shown.
@ -13,14 +13,12 @@ window.addEventListener('load', (event) => {
|
||||
|
||||
function albumselect(code){
|
||||
const albumheader = document.getElementById(code);
|
||||
const searchbar = document.getElementById('search-input');
|
||||
for (const other of document.querySelectorAll('.sort-header.album.open')){
|
||||
other.classList.remove('open');
|
||||
}
|
||||
albumheader.classList.add('open');
|
||||
searchbar.value = '';
|
||||
searchbar.dispatchEvent(new Event('input'));
|
||||
document.getElementById('search-results-header').replaceChildren();
|
||||
document.getElementById('search-input').value = '';
|
||||
document.getElementById('search-results').replaceChildren();
|
||||
}
|
||||
|
||||
// Toggle header when clicked
|
||||
@ -41,16 +39,11 @@ function albumHeaderClick(clickevent){
|
||||
}
|
||||
|
||||
// Fill out form with suggest search result
|
||||
function suggestform(id, desc, clickevent){
|
||||
const searchresults = clickevent.target.parentElement.parentElement;
|
||||
const form = searchresults.dataset.form;
|
||||
const searchbar = document.getElementById(`search-input-suggest-${form}`)
|
||||
document.getElementById(`connection-${form}`).innerHTML = clickevent.target.innerHTML;
|
||||
document.getElementById(`connection-${form}-id`).value = id;
|
||||
document.getElementById(`connection-${form}-desc`).value = desc;
|
||||
searchbar.value = '';
|
||||
searchbar.dispatchEvent(new Event('input'));
|
||||
searchresults.replaceChildren();
|
||||
function suggestform1(id, desc){
|
||||
document.getElementById('connection-1').valueAsNumber = id;
|
||||
document.getElementById('connection-1-desc').valueAsNumber = desc;
|
||||
document.getElementById('search-input-suggest-1').value = '';
|
||||
document.getElementById('search-results-1').replaceChildren();
|
||||
}
|
||||
|
||||
// Mutually exclusive audio playback
|
||||
@ -68,28 +61,4 @@ function onlyPlayOneIn(container) {
|
||||
|
||||
document.addEventListener("DOMContentLoaded", function() {
|
||||
onlyPlayOneIn(document.body);
|
||||
});
|
||||
|
||||
// Search clear button
|
||||
function searchIconChange(event, buttonid, barid) {
|
||||
const searchbutton = document.getElementById(buttonid);
|
||||
const searchicon = document.getElementById(barid);
|
||||
|
||||
if (event.target.value.length !== 0) {
|
||||
searchbutton.classList.remove('hidden');
|
||||
searchicon.classList.remove('search-empty');
|
||||
}
|
||||
else {
|
||||
searchbutton.classList.add('hidden');
|
||||
searchicon.classList.add('search-empty');
|
||||
}
|
||||
}
|
||||
|
||||
function clearSearch(searchid, resultid, clickevent) {
|
||||
const searchbar = document.getElementById(searchid);
|
||||
const searchresults = document.getElementById(resultid);
|
||||
searchbar.value = '';
|
||||
searchresults.replaceChildren();
|
||||
searchbar.dispatchEvent(new Event('input'));
|
||||
clickevent.preventDefault();
|
||||
}
|
||||
});
|
||||
@ -52,12 +52,6 @@ span{
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
p{
|
||||
margin-left: 1.2rem;
|
||||
margin-right: 1.2rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* HEADER */
|
||||
|
||||
header{
|
||||
@ -205,52 +199,39 @@ header{
|
||||
/* SEARCH BAR */
|
||||
|
||||
.search-bar{
|
||||
display: flex; justify-content: center; align-items: center; flex-wrap: wrap;
|
||||
display: flex; flex-shrink: 0; flex-direction: column; justify-content: center; align-items: center;
|
||||
max-width: 64rem;
|
||||
width: 100%;
|
||||
height: 3.6rem;
|
||||
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; */
|
||||
border-style: solid; border-top: 0; border-left: 0; border-right: 0; border-color: var(--thin-border); border-width: 1px;
|
||||
}
|
||||
|
||||
.search-items{
|
||||
position: relative;
|
||||
height: 2.4rem;
|
||||
width: calc(100% - 3.6rem);
|
||||
margin-right: 1.2rem;
|
||||
margin-left: .6rem;
|
||||
width: 80%;
|
||||
}
|
||||
|
||||
.search-bar.search-empty::before, .suggest input::before{
|
||||
content: "🔎︎";
|
||||
width: 1.2rem;
|
||||
text-align: center;
|
||||
margin-left: .6rem;
|
||||
}
|
||||
|
||||
.search-items input, .suggest input{
|
||||
all: unset;
|
||||
.search-items input{
|
||||
/* all:unset; */
|
||||
font: unset;
|
||||
color: unset;
|
||||
background-color: var(--search-back);
|
||||
width: 100%;
|
||||
height: 2.4rem;
|
||||
border-style: solid; border-color: var(--thin-border); border-width: 1px;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.search-icon{
|
||||
height: 100%;
|
||||
content: "🔎︎";
|
||||
}
|
||||
|
||||
.search-clear.hidden{
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* SEARCH RESULTS */
|
||||
|
||||
.search-results{
|
||||
display: flex; flex-direction: column;
|
||||
width: 100%;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.search-results h2{
|
||||
display: none;
|
||||
}
|
||||
@ -262,13 +243,9 @@ header{
|
||||
list-style: none;
|
||||
z-index: 1;
|
||||
border-style: solid; border-color: var(--thin-border); border-width: 1px; border-top: 0; border-bottom: 0;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
cursor: pointer;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.search-results li, .suggest-search-results{
|
||||
.search-results li{
|
||||
display: flex; align-items: center;
|
||||
min-height: 2.4rem;
|
||||
border-style: solid; border-width: 1px; border-color: var(--thin-border); border-left: 0; border-top: 0; border-right: 0;
|
||||
@ -278,7 +255,7 @@ header{
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.search-results .search-icon{
|
||||
.search-icon{
|
||||
min-width: 2.6rem;
|
||||
}
|
||||
|
||||
@ -395,7 +372,6 @@ footer{
|
||||
|
||||
.sort-header{
|
||||
border-style: solid; border-top: 0; border-left: 0; border-right: 0; border-width: 1px; border-color: var(--thin-border);
|
||||
font-size: calc(1.1rem + .1vw);
|
||||
}
|
||||
|
||||
.sort-header.album{
|
||||
@ -610,14 +586,12 @@ footer{
|
||||
display: flex; flex-direction: column;
|
||||
width: 100%;
|
||||
justify-content: center;
|
||||
margin-left: 1.2rem; margin-right: 1.2rem;
|
||||
}
|
||||
.song-location h2{
|
||||
text-align: center;
|
||||
margin-bottom: 1.2rem;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.entrypage-connections{
|
||||
display: flex; flex-direction: column;
|
||||
width: 100%;
|
||||
@ -659,16 +633,13 @@ footer{
|
||||
/* SUGGEST PAGE */
|
||||
|
||||
.suggestbox{
|
||||
display: flex; flex-wrap: wrap; align-items: center; gap: 2.4rem; flex-direction: column;
|
||||
display: flex; flex-wrap: wrap; justify-content: center; gap: 4.8rem;
|
||||
margin-top: 2.4rem;
|
||||
overflow: hidden;
|
||||
height: 36rem;
|
||||
}
|
||||
|
||||
.suggestbox h2{
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.search-items.suggest{
|
||||
@ -680,31 +651,17 @@ footer{
|
||||
}
|
||||
|
||||
.suggest-desc textarea{
|
||||
width: calc(100% - 8px);
|
||||
resize: none;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.suggest-button{
|
||||
margin-bottom: 2.4rem;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.suggest-selection{
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
border-style: none;
|
||||
#connection-1{
|
||||
display: none;
|
||||
}
|
||||
|
||||
.suggest{
|
||||
width: clamp(24rem, 24rem, 100%);
|
||||
}
|
||||
|
||||
.suggest-search{
|
||||
display: flex; justify-content: center; flex-wrap: wrap; gap: 2.4rem; align-items: center;
|
||||
margin-left: 1.2rem;
|
||||
margin-right: 1.2rem;
|
||||
width: 80%;
|
||||
}
|
||||
|
||||
.search-number{
|
||||
#connection-1-desc{
|
||||
display: none;
|
||||
}
|
||||
4
suggestions.csv
Normal file
4
suggestions.csv
Normal file
@ -0,0 +1,4 @@
|
||||
2023-06-27T15:35:08.245616,Testing the form
|
||||
2023-06-27T15:35:34.195039,testing again
|
||||
2023-06-27T21:54:35.835288,"Hello from Moss and Nat's
|
||||
"
|
||||
|
@ -1,7 +1,7 @@
|
||||
<li class="entrypage-clip">
|
||||
<audio
|
||||
controls
|
||||
src = "{{ url_for('static', filename='clip/') }}{{ '%04d' % song_id }}-{{ '%03d' % motif_id }}.mp3" type="audio/flac">
|
||||
src = "{{ url_for('static', filename='clip/') }}{{ '%04d' % song_id }}-{{ '%03d' % motif_id }}.flac" type="audio/flac">
|
||||
</audio>
|
||||
<span class="clip-pointer">
|
||||
|
||||
|
||||
@ -9,7 +9,7 @@
|
||||
<hgroup class="home-title">
|
||||
<h1>The Eorzea Songbook</h1>
|
||||
<h3>An unofficial library of motifs in the Final Fantasy XIV soundtrack.</h3>
|
||||
<!-- <p>Last updated: 26/06/2023</p> -->
|
||||
<p>Last updated: 26/06/2023</p>
|
||||
</hgroup>
|
||||
|
||||
<div class="home-nav">
|
||||
@ -32,7 +32,7 @@
|
||||
<div class="entrypage-clip">
|
||||
<audio
|
||||
controls
|
||||
src = "{{ url_for('static', filename='clip/') }}0288-024.mp3" type="audio/flac">
|
||||
src = "{{ url_for('static', filename='clip/') }}0288-024.flac" type="audio/flac">
|
||||
</audio>
|
||||
<span class="clip-pointer">
|
||||
<img src="{{ url_for('static', filename='songicon.png') }}" alt="Song Icon" class="connection-icon"/>
|
||||
@ -43,7 +43,7 @@
|
||||
<div class="entrypage-clip">
|
||||
<audio
|
||||
controls
|
||||
src = "{{ url_for('static', filename='clip/') }}0317-024.mp3" type="audio/flac">
|
||||
src = "{{ url_for('static', filename='clip/') }}0317-024.flac" type="audio/flac">
|
||||
</audio>
|
||||
<span class="clip-pointer">
|
||||
<img src="{{ url_for('static', filename='songicon.png') }}" alt="Song Icon" class="connection-icon"/>
|
||||
@ -54,7 +54,7 @@
|
||||
<div class="entrypage-clip">
|
||||
<audio
|
||||
controls
|
||||
src = "{{ url_for('static', filename='clip/') }}0294-024.mp3" type="audio/flac">
|
||||
src = "{{ url_for('static', filename='clip/') }}0294-024.flac" type="audio/flac">
|
||||
</audio>
|
||||
<span class="clip-pointer">
|
||||
<img src="{{ url_for('static', filename='songicon.png') }}" alt="Song Icon" class="connection-icon"/>
|
||||
@ -65,7 +65,7 @@
|
||||
<div class="entrypage-clip">
|
||||
<audio
|
||||
controls
|
||||
src = "{{ url_for('static', filename='clip/') }}0337-024.mp3" type="audio/flac">
|
||||
src = "{{ url_for('static', filename='clip/') }}0337-024.flac" type="audio/flac">
|
||||
</audio>
|
||||
<span class="clip-pointer">
|
||||
<img src="{{ url_for('static', filename='songicon.png') }}" alt="Song Icon" class="connection-icon"/>
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
<li class="entrypage-clip">
|
||||
<audio
|
||||
controls
|
||||
src = "{{ url_for('static', filename='clip/') }}{{ '%04d' % song_id }}-{{ '%03d' % motif_id }}.mp3" type="audio/flac">
|
||||
src = "{{ url_for('static', filename='clip/') }}{{ '%04d' % song_id }}-{{ '%03d' % motif_id }}.flac" type="audio/flac">
|
||||
</audio>
|
||||
<span class="clip-pointer">
|
||||
<img src="{{ url_for('static', filename='songicon.png') }}" alt="Song Icon" class="connection-icon"/>
|
||||
|
||||
@ -22,20 +22,17 @@
|
||||
</nav>
|
||||
</header>
|
||||
|
||||
<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>
|
||||
<div class="search-bar">
|
||||
<div class="search-items">
|
||||
<input
|
||||
id="search-input"
|
||||
type="text"
|
||||
type="search"
|
||||
name="q"
|
||||
autocomplete="off"
|
||||
placeholder=" Search..."
|
||||
placeholder="Search..."
|
||||
hx-get="/search"
|
||||
hx-trigger="keyup changed delay:250ms, search"
|
||||
hx-trigger="keyup changed delay:500ms, search"
|
||||
hx-target="#search-results-header"
|
||||
oninput="searchIconChange(event, 'search-button', 'top-search')"
|
||||
/>
|
||||
<div id="search-results-header" class="search-results header"></div>
|
||||
</div>
|
||||
|
||||
Binary file not shown.
@ -1,6 +1,6 @@
|
||||
{% extends "base.html" %}
|
||||
{% block title %}
|
||||
{% for name, _, _ in song_info %}{{ name }}{% endfor %}
|
||||
{% for name, _ in song_info %}{{ name }}{% endfor %}
|
||||
{% endblock %}
|
||||
|
||||
{% set clipmode = "motif" %}
|
||||
@ -11,7 +11,7 @@
|
||||
<hgroup class="title-box">
|
||||
<div class="eng-title">
|
||||
<img src="{{ url_for('static', filename='songicon.png') }}" alt="Song Icon" />
|
||||
{% for name, name_jp, _ in song_info %}
|
||||
{% for name, name_jp in song_info %}
|
||||
<h1>{{ name }}</h1>
|
||||
{% endfor %}
|
||||
<h3 class="title-album">
|
||||
@ -20,7 +20,7 @@
|
||||
{% endfor %}
|
||||
</h3>
|
||||
</div>
|
||||
{% for name, name_jp, _ in song_info %}
|
||||
{% for name, name_jp in song_info %}
|
||||
{% if name_jp %}
|
||||
<h2 class="title-jp">{{name_jp}}</h2>
|
||||
{% endif %}
|
||||
@ -28,9 +28,9 @@
|
||||
</hgroup>
|
||||
|
||||
|
||||
<!-- Artist info -->
|
||||
|
||||
<div class="track-info" >
|
||||
<!-- Artist info -->
|
||||
<div class="songpage-detail">
|
||||
<h2 >Artist: </h2>
|
||||
<ul>
|
||||
@ -60,14 +60,13 @@
|
||||
|
||||
<!-- Location -->
|
||||
|
||||
{% for _, _, location in song_info %}
|
||||
{% if location %}
|
||||
<div class="song-location">
|
||||
<h2>Appearances:</h2>
|
||||
<p class="songpage-location">{{ location }}</p>
|
||||
</div>
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% if description %}
|
||||
|
||||
<div class="song-location">
|
||||
<h2>Used In:</h2>
|
||||
</div>
|
||||
|
||||
{% endif %}
|
||||
|
||||
<!-- Motifs -->
|
||||
|
||||
|
||||
@ -4,48 +4,38 @@
|
||||
|
||||
{% 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 a shared motif that you can't find on the website, you can 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>
|
||||
|
||||
<form action="/sent" method="post" >
|
||||
<div class="suggestbox">
|
||||
<div class="suggest-search">
|
||||
{% for i in range(2) %}
|
||||
<div class="suggest">
|
||||
<h2>Song / Motif {{ i + 1 }}</h2>
|
||||
|
||||
<div id="connection-{{ i }}" class="suggest-search-results suggest-selection">
|
||||
<div>Nothing selected yet.</div>
|
||||
</div>
|
||||
<div id="suggest-bar-{{ i }}" class="search-bar search-empty">
|
||||
<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"
|
||||
name="q"
|
||||
autocomplete="off"
|
||||
placeholder=" Search..."
|
||||
hx-get="/suggestsearch"
|
||||
hx-trigger="keyup changed delay:250ms, search"
|
||||
hx-target="#search-results-{{ i }}"
|
||||
oninput="searchIconChange(event, 'suggest-button-{{ i }}', 'suggest-bar-{{ i }}')"
|
||||
/>
|
||||
<div id="search-results-{{ i }}" class="search-results" data-form="{{ i }}"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<input required type="text" name="connection-{{ i }}-desc" id="connection-{{ i }}-desc" class="search-number"/>
|
||||
<input required type="number" name="connection-{{ i }}-id" id="connection-{{ i }}-id" class="search-number"/>
|
||||
{% endfor %}
|
||||
<div class="search-items suggest">
|
||||
<h2>Song / Motif 1</h2>
|
||||
<input
|
||||
id="search-input-suggest-1"
|
||||
type="search"
|
||||
name="q"
|
||||
autocomplete="off"
|
||||
placeholder="Search..."
|
||||
hx-get="/suggestsearch"
|
||||
hx-trigger="keyup changed delay:500ms, search"
|
||||
hx-target="#search-results-1"
|
||||
/>
|
||||
<div id="search-results-1" class="search-results"></div>
|
||||
</div>
|
||||
<input type="number" name="connection-1-desc" id="connection-1-desc"/>
|
||||
<input type="number" name="connection-1" id="connection-1" min="1" max="733"/>
|
||||
|
||||
<div class="suggest-desc">
|
||||
<textarea maxlength="10000" rows="6" required name="suggest-description" placeholder="Describe the connection here."></textarea>
|
||||
<textarea name="suggest-description">
|
||||
Suggest a different connection!
|
||||
</textarea>
|
||||
</div>
|
||||
<div class="suggest-button">
|
||||
<input type="submit" value="Submit"/>
|
||||
<input type="submit" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</form>
|
||||
|
||||
|
||||
{% endblock %}
|
||||
@ -1,19 +1,22 @@
|
||||
<h2>Search Results:</h2>
|
||||
<ul>
|
||||
{% for desc, id, name, _ in searchresult %}
|
||||
<li onclick="suggestform('{{ id }}', '{{ desc }}', event)">
|
||||
{% if desc == 'song' %}
|
||||
<span class="search-icon suggest-icon">
|
||||
<img src="{{ url_for('static', filename='songicon.png') }}" alt="Song Icon"/>
|
||||
</span>
|
||||
<span class="search-type">Song:</span>
|
||||
{% elif desc == 'motif' %}
|
||||
<span class="search-icon">
|
||||
<img src="{{ url_for('static', filename='motificon.png') }}" alt="Motif Icon"/>
|
||||
</span>
|
||||
<span class="search-type">Motif:</span>
|
||||
{% endif %}
|
||||
{% if desc == 'song' %}
|
||||
<li onclick="suggestform('{{ id }}', 1)">
|
||||
<span class="search-icon">
|
||||
<img src="{{ url_for('static', filename='songicon.png') }}" alt="Song Icon"/>
|
||||
</span>
|
||||
<span class="search-type">Song:</span>
|
||||
{{ name }}
|
||||
</li>
|
||||
{% elif desc == 'motif' %}
|
||||
<li onclick="suggestform('{{ id }}', 2)">
|
||||
<span class="search-icon">
|
||||
<img src="{{ url_for('static', filename='motificon.png') }}" alt="Motif Icon"/>
|
||||
</span>
|
||||
<span class="search-type">Motif:</span>
|
||||
{{ name }}
|
||||
</li></a>
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</ul>
|
||||
Loading…
Reference in New Issue
Block a user