From d9cb0b996a9770d54e24b7d52a5a96f5eaf802c4 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Jan=20Ku=C5=BE=C3=ADlek?= Date: Thu, 5 Mar 2020 18:32:32 +0100 Subject: [PATCH] Search tag input finalization goddamn it --- yadc/bp/api.py | 2 +- yadc/static/all.css | 2 +- yadc/static/default.scss | 4 +- yadc/static/search.js | 83 +++++++++++++++++--- yadc/templates/layout/base.html | 4 +- yadc/templates/layout/base_sidebar_tags.html | 24 +++--- 6 files changed, 93 insertions(+), 26 deletions(-) diff --git a/yadc/bp/api.py b/yadc/bp/api.py index 1785fed..090d191 100644 --- a/yadc/bp/api.py +++ b/yadc/bp/api.py @@ -19,5 +19,5 @@ def tag_autocomplete(): tags = Tag.query.filter(Tag.content.like("%{}%".format(query))).limit(5).all() return jsonify([{"id": t.id, "content": t.content, "content_deser": t.content_deser, "category": {"id": t.category.value, "name": t.category.name}} for t in tags]) - return jsonify({'error': 'not found'}) + return jsonify() # tags = request.args.get('tags', '') \ No newline at end of file diff --git a/yadc/static/all.css b/yadc/static/all.css index 8bf9758..cb6dc1d 100644 --- a/yadc/static/all.css +++ b/yadc/static/all.css @@ -1 +1 @@ -*{box-sizing:border-box}body{margin:0;font-family:Verdana,Geneva,Tahoma,sans-serif;background-color:#222;color:#fff}a{color:#bbb;text-decoration:none}a:hover{color:#909090;text-decoration:none}header{display:flex;align-items:baseline;padding:0 10px;background-color:#222}header>a.logo{font-size:2em;margin:6px}@media(max-width:559px){header{position:relative}}header>nav{flex-grow:1;display:flex}header>nav>._overlay{display:none}@media(max-width:559px){header>nav{display:none}header>nav._drop{display:flex;flex-flow:column nowrap;position:absolute;margin:0;top:100%;left:0;right:0;z-index:10;background-color:#111d}header>nav>a,header>nav a#user-menu,header>nav .user_dropdown>a{padding:12px;padding-left:24px}header>nav>a:hover,header>nav>a:active,header>nav a#user-menu:hover,header>nav a#user-menu:active,header>nav .user_dropdown>a:hover,header>nav .user_dropdown>a:active{background-color:#333}header>nav .user::before{content:"";display:block;border-top:1px solid grey;margin:2px 12px}header>nav .user #user-menu{display:block}header>nav .user .user_dropdown{display:flex;flex-flow:column nowrap}header>nav>._overlay{display:block;position:fixed;width:100%;height:100%;z-index:-1;background-color:#0006}html.oh{overflow:hidden}}@media(min-width:560px){header>nav{margin:0 5px;align-items:center}header>nav>*{margin:0 5px;padding:6px 0}header>nav>.user{padding:0;margin-left:auto;margin-right:0;position:relative}header>nav>.user #user-menu{display:block;padding:6px 10px}header>nav>.user .user_dropdown{display:none}header>nav>.user .user_dropdown a{padding:10px}header>nav>.user .user_dropdown a:hover{background-color:#333}header>nav>.user:hover>.user_dropdown{display:flex;flex-flow:column nowrap;position:absolute;margin:0;top:100%;right:0;z-index:10;background-color:#111d}}header>#nav-menu{display:none}@media(max-width:559px){header>#nav-menu{display:block;margin:5px;margin-left:auto;padding:0 2px;align-self:center;font-size:2em;cursor:pointer}}.flash_msgs{display:flex;flex-flow:column-reverse nowrap;position:fixed;z-index:20;bottom:0;right:0;margin:0;padding:10px;font-size:.9em;pointer-events:none}.flash_msgs>li{width:250px;padding:10px;background-color:#000c;overflow:hidden;opacity:0;animation:fade 7s normal}.flash_msgs>li:not(:first-child){margin-bottom:10px}@keyframes fade{0%,100%{opacity:0}20%,80%{opacity:1}}.main_wrap{margin:0 auto;max-width:1300px;padding:8px;padding-top:0;padding-bottom:0}.main_wrap h3{margin:0;margin-bottom:10px;font-size:1.3em}.main_wrap .important_subwrap{display:flex;overflow:visible}@media(max-width:899px){.main_wrap .important_subwrap{flex-flow:column nowrap}}@media(min-width:900px){.main_wrap .important_subwrap{flex-flow:row nowrap}}.main_wrap .important_subwrap>section.side_panel{flex-shrink:0;padding:10px}@media(min-width:900px){.main_wrap .important_subwrap>section.side_panel{width:18rem;height:0}}.main_wrap .important_subwrap>section.side_panel article{margin-bottom:10px}.main_wrap .important_subwrap>section.side_panel article.tags .searchbox{width:calc(18rem - 50px);position:relative}.main_wrap .important_subwrap>section.side_panel article.tags .searchbox input[name=tagsearch]{width:100%}.main_wrap .important_subwrap>section.side_panel article.tags .searchbox>.search_dropdown{display:flex;flex-flow:column nowrap;align-items:start;width:100%;position:absolute;z-index:10;overflow:auto;background-color:#2d2d2de0}.main_wrap .important_subwrap>section.side_panel article.tags .tag_container>a,.main_wrap .important_subwrap>section.side_panel article.tags .search_dropdown>a{margin:2px 2px;padding:.35em .6em;border-radius:4px;background-color:#121212ff;cursor:pointer}.main_wrap .important_subwrap>section.side_panel article.tags .tag_container>a>*,.main_wrap .important_subwrap>section.side_panel article.tags .search_dropdown>a>*{pointer-events:none}.main_wrap .important_subwrap>section.side_panel article.tags .tag_container>a>.fa-tag,.main_wrap .important_subwrap>section.side_panel article.tags .search_dropdown>a>.fa-tag{font-size:.9em;margin-right:2px}.main_wrap .important_subwrap>section.side_panel article.tags .tag_container>a>.count,.main_wrap .important_subwrap>section.side_panel article.tags .search_dropdown>a>.count{font-size:.8em}.main_wrap .important_subwrap>section.side_panel article.tags .tag_container>a:not(:hover)>span.close,.main_wrap .important_subwrap>section.side_panel article.tags .search_dropdown>a:not(:hover)>span.close{display:none}.main_wrap .important_subwrap>section.side_panel article.tags .tag_container>a:not(:hover)>span.plus,.main_wrap .important_subwrap>section.side_panel article.tags .search_dropdown>a:not(:hover)>span.plus{display:none}.main_wrap .important_subwrap>section.side_panel article.tags .tag_container>a:hover>span.count,.main_wrap .important_subwrap>section.side_panel article.tags .search_dropdown>a:hover>span.count{display:none}.main_wrap .important_subwrap>section.side_panel article.tags .tag_container>a.tagselected,.main_wrap .important_subwrap>section.side_panel article.tags .search_dropdown>a.tagselected{background-color:#400808ff}.main_wrap .important_subwrap>section.side_panel article.tags .tag_container>a.tag_hide,.main_wrap .important_subwrap>section.side_panel article.tags .search_dropdown>a.tag_hide{display:none}.main_wrap .important_subwrap>section.side_panel article.tags .tag_container{display:flex}@media(max-width:899px){.main_wrap .important_subwrap>section.side_panel article.tags .tag_container{flex-flow:row wrap}}@media(min-width:900px){.main_wrap .important_subwrap>section.side_panel article.tags .tag_container{flex-flow:column nowrap;align-items:start}}.main_wrap .important_subwrap>section.side_panel article.post_desc{display:flex;flex-flow:column nowrap;font-size:.9em}.main_wrap .important_subwrap>section.side_panel article.post_desc>img{display:block;max-width:128px}@media(min-width:900px){.main_wrap .important_subwrap>section:not(.side_panel){width:100%}}.main_wrap section.post_list{overflow:hidden}@media(max-width:559px){.main_wrap section.post_list{margin-left:-8px;margin-right:-8px}}.main_wrap section.post_list .posts{display:flex;flex-flow:row wrap}@media(max-width:899px){.main_wrap section.post_list .posts{margin-left:-8px;margin-right:-8px}}.main_wrap section.post_list .posts::after{content:"";flex:10000 0 350px}.main_wrap section.post_list .posts>figure{position:relative;margin:8px}.main_wrap section.post_list .posts>figure img{display:block;width:100%;height:100%;transition:.2s ease}.main_wrap section.post_list .posts>figure:hover img{opacity:.7}@media(min-width:900px){.main_wrap section.post_single{padding:8px}}@media(max-width:899px){.main_wrap section.post_single{order:-1;margin-bottom:8px}}@media(max-width:559px){.main_wrap section.post_single{margin-left:-8px;margin-right:-8px}}.main_wrap section.post_single img{display:block;max-width:100%}.main_wrap section.comments{padding:10px}@media(min-width:900px){.main_wrap section.comments{margin-left:18rem}}.main_wrap section.comments>.comment_container{padding:0 10px;max-width:500px}.main_wrap section.comments>.comment_container article{overflow:hidden;margin-bottom:1em}.main_wrap section.comments>.comment_container h4{margin:0;margin-bottom:.5em}.main_wrap section.comments>.comment_container p,.main_wrap section.comments>.comment_container textarea{margin:0}.main_wrap section.comments>.comment_container p.deleted,.main_wrap section.comments>.comment_container textarea.deleted{color:red}.main_wrap section.comments>.comment_container .head{display:flex;justify-content:space-between}.main_wrap section.comments>.form>form{margin-left:10px;max-width:500px}.main_wrap section.comments>.form>form input:required{box-shadow:none}.main_wrap section.comments>.form>form textarea{width:100%;background:#444a;border:none;color:inherit;font:inherit}.main_wrap section.management_table table{margin:0 auto}.main_wrap section.management_table tr th{background-color:#606060}.main_wrap section.management_table tr:nth-child(even){background-color:#303030}.main_wrap section.management_table tr th,.main_wrap section.management_table tr td{padding:6px 10px}.main_wrap section.management_table tr:not(.edit) td>.edit{display:none}.main_wrap section.management_table tr.edit td>.show{display:none}.main_wrap section.management_table tr input[type=submit]{display:none}.main_wrap section.management_table tr .fa{padding:4px 4px;align-self:center;font-size:1.5em;cursor:pointer}.main_wrap form.editingable:not(.time-to-edit) .edit{display:none}.main_wrap form.editingable.time-to-edit .notedit{display:none}.main_wrap form.editingable input[type=text],.main_wrap form.editingable textarea{resize:vertical;width:100%}.main_wrap form.editingable input[type=text].edit,.edit .main_wrap form.editingable input[type=text],.main_wrap form.editingable textarea.edit,.edit .main_wrap form.editingable textarea{background:#444a;border:none;color:inherit;font:inherit}.main_wrap form input{margin:5px 0}.main_wrap .pagin{margin:10px 0;display:flex;flex-flow:row nowrap;justify-content:center}.main_wrap .pagin>a{display:block;background-color:#0005;padding:8px 12px;margin:0 2px}footer{padding:10px;text-align:center} \ No newline at end of file +*{box-sizing:border-box}body{margin:0;font-family:Verdana,Geneva,Tahoma,sans-serif;background-color:#222;color:#fff}a{color:#bbb;text-decoration:none}a:hover{color:#909090;text-decoration:none}header{display:flex;align-items:baseline;padding:0 10px;background-color:#222}header>a.logo{font-size:2em;margin:6px}@media(max-width:559px){header{position:relative}}header>nav{flex-grow:1;display:flex}header>nav>._overlay{display:none}@media(max-width:559px){header>nav{display:none}header>nav._drop{display:flex;flex-flow:column nowrap;position:absolute;margin:0;top:100%;left:0;right:0;z-index:10;background-color:#111d}header>nav>a,header>nav a#user-menu,header>nav .user_dropdown>a{padding:12px;padding-left:24px}header>nav>a:hover,header>nav>a:active,header>nav a#user-menu:hover,header>nav a#user-menu:active,header>nav .user_dropdown>a:hover,header>nav .user_dropdown>a:active{background-color:#333}header>nav .user::before{content:"";display:block;border-top:1px solid grey;margin:2px 12px}header>nav .user #user-menu{display:block}header>nav .user .user_dropdown{display:flex;flex-flow:column nowrap}header>nav>._overlay{display:block;position:fixed;width:100%;height:100%;z-index:-1;background-color:#0006}html.oh{overflow:hidden}}@media(min-width:560px){header>nav{margin:0 5px;align-items:center}header>nav>*{margin:0 5px;padding:6px 0}header>nav>.user{padding:0;margin-left:auto;margin-right:0;position:relative}header>nav>.user #user-menu{display:block;padding:6px 10px}header>nav>.user .user_dropdown{display:none}header>nav>.user .user_dropdown a{padding:10px}header>nav>.user .user_dropdown a:hover{background-color:#333}header>nav>.user:hover>.user_dropdown{display:flex;flex-flow:column nowrap;position:absolute;margin:0;top:100%;right:0;z-index:10;background-color:#111d}}header>#nav-menu{display:none}@media(max-width:559px){header>#nav-menu{display:block;margin:5px;margin-left:auto;padding:0 2px;align-self:center;font-size:2em;cursor:pointer}}.flash_msgs{display:flex;flex-flow:column-reverse nowrap;position:fixed;z-index:20;bottom:0;right:0;margin:0;padding:10px;font-size:.9em;pointer-events:none}.flash_msgs>li{width:250px;padding:10px;background-color:#000c;overflow:hidden;opacity:0;animation:fade 7s normal}.flash_msgs>li:not(:first-child){margin-bottom:10px}@keyframes fade{0%,100%{opacity:0}20%,80%{opacity:1}}.main_wrap{margin:0 auto;max-width:1300px;padding:8px;padding-top:0;padding-bottom:0}.main_wrap h3{margin:0;margin-bottom:10px;font-size:1.3em}.main_wrap .important_subwrap{display:flex;overflow:visible}@media(max-width:899px){.main_wrap .important_subwrap{flex-flow:column nowrap}}@media(min-width:900px){.main_wrap .important_subwrap{flex-flow:row nowrap}}.main_wrap .important_subwrap>section.side_panel{flex-shrink:0;padding:10px}@media(min-width:900px){.main_wrap .important_subwrap>section.side_panel{width:18rem;height:0}}.main_wrap .important_subwrap>section.side_panel article{margin-bottom:10px}.main_wrap .important_subwrap>section.side_panel article.tags .searchbox{width:calc(18rem - 50px);position:relative}.main_wrap .important_subwrap>section.side_panel article.tags .searchbox input[name=tagsearch]{width:100%}.main_wrap .important_subwrap>section.side_panel article.tags .searchbox>.search_dropdown{display:flex;flex-flow:column nowrap;align-items:start;top:100%;left:0;position:absolute;z-index:10;overflow:auto;background-color:#2d2d2de0}.main_wrap .important_subwrap>section.side_panel article.tags .tag_container>a,.main_wrap .important_subwrap>section.side_panel article.tags .search_dropdown>a{margin:2px 2px;padding:.35em .6em;border-radius:4px;background-color:#121212ff;cursor:pointer}.main_wrap .important_subwrap>section.side_panel article.tags .tag_container>a>*,.main_wrap .important_subwrap>section.side_panel article.tags .search_dropdown>a>*{pointer-events:none}.main_wrap .important_subwrap>section.side_panel article.tags .tag_container>a>.fa-tag,.main_wrap .important_subwrap>section.side_panel article.tags .search_dropdown>a>.fa-tag{font-size:.9em;margin-right:2px}.main_wrap .important_subwrap>section.side_panel article.tags .tag_container>a>.count,.main_wrap .important_subwrap>section.side_panel article.tags .search_dropdown>a>.count{font-size:.8em}.main_wrap .important_subwrap>section.side_panel article.tags .tag_container>a:not(:hover)>span.close,.main_wrap .important_subwrap>section.side_panel article.tags .search_dropdown>a:not(:hover)>span.close{display:none}.main_wrap .important_subwrap>section.side_panel article.tags .tag_container>a:not(:hover)>span.plus,.main_wrap .important_subwrap>section.side_panel article.tags .search_dropdown>a:not(:hover)>span.plus{display:none}.main_wrap .important_subwrap>section.side_panel article.tags .tag_container>a:hover>span.count,.main_wrap .important_subwrap>section.side_panel article.tags .search_dropdown>a:hover>span.count{display:none}.main_wrap .important_subwrap>section.side_panel article.tags .tag_container>a.tagselected,.main_wrap .important_subwrap>section.side_panel article.tags .search_dropdown>a.tagselected{background-color:#400808ff}.main_wrap .important_subwrap>section.side_panel article.tags .tag_container>a.tag_hide,.main_wrap .important_subwrap>section.side_panel article.tags .search_dropdown>a.tag_hide{display:none}.main_wrap .important_subwrap>section.side_panel article.tags .tag_container{display:flex}@media(max-width:899px){.main_wrap .important_subwrap>section.side_panel article.tags .tag_container{flex-flow:row wrap}}@media(min-width:900px){.main_wrap .important_subwrap>section.side_panel article.tags .tag_container{flex-flow:column nowrap;align-items:start}}.main_wrap .important_subwrap>section.side_panel article.post_desc{display:flex;flex-flow:column nowrap;font-size:.9em}.main_wrap .important_subwrap>section.side_panel article.post_desc>img{display:block;max-width:128px}@media(min-width:900px){.main_wrap .important_subwrap>section:not(.side_panel){width:100%}}.main_wrap section.post_list{overflow:hidden}@media(max-width:559px){.main_wrap section.post_list{margin-left:-8px;margin-right:-8px}}.main_wrap section.post_list .posts{display:flex;flex-flow:row wrap}@media(max-width:899px){.main_wrap section.post_list .posts{margin-left:-8px;margin-right:-8px}}.main_wrap section.post_list .posts::after{content:"";flex:10000 0 350px}.main_wrap section.post_list .posts>figure{position:relative;margin:8px}.main_wrap section.post_list .posts>figure img{display:block;width:100%;height:100%;transition:.2s ease}.main_wrap section.post_list .posts>figure:hover img{opacity:.7}@media(min-width:900px){.main_wrap section.post_single{padding:8px}}@media(max-width:899px){.main_wrap section.post_single{order:-1;margin-bottom:8px}}@media(max-width:559px){.main_wrap section.post_single{margin-left:-8px;margin-right:-8px}}.main_wrap section.post_single img{display:block;max-width:100%}.main_wrap section.comments{padding:10px}@media(min-width:900px){.main_wrap section.comments{margin-left:18rem}}.main_wrap section.comments>.comment_container{padding:0 10px;max-width:500px}.main_wrap section.comments>.comment_container article{overflow:hidden;margin-bottom:1em}.main_wrap section.comments>.comment_container h4{margin:0;margin-bottom:.5em}.main_wrap section.comments>.comment_container p,.main_wrap section.comments>.comment_container textarea{margin:0}.main_wrap section.comments>.comment_container p.deleted,.main_wrap section.comments>.comment_container textarea.deleted{color:red}.main_wrap section.comments>.comment_container .head{display:flex;justify-content:space-between}.main_wrap section.comments>.form>form{margin-left:10px;max-width:500px}.main_wrap section.comments>.form>form input:required{box-shadow:none}.main_wrap section.comments>.form>form textarea{width:100%;background:#444a;border:none;color:inherit;font:inherit}.main_wrap section.management_table table{margin:0 auto}.main_wrap section.management_table tr th{background-color:#606060}.main_wrap section.management_table tr:nth-child(even){background-color:#303030}.main_wrap section.management_table tr th,.main_wrap section.management_table tr td{padding:6px 10px}.main_wrap section.management_table tr:not(.edit) td>.edit{display:none}.main_wrap section.management_table tr.edit td>.show{display:none}.main_wrap section.management_table tr input[type=submit]{display:none}.main_wrap section.management_table tr .fa{padding:4px 4px;align-self:center;font-size:1.5em;cursor:pointer}.main_wrap form.editingable:not(.time-to-edit) .edit{display:none}.main_wrap form.editingable.time-to-edit .notedit{display:none}.main_wrap form.editingable input[type=text],.main_wrap form.editingable textarea{resize:vertical;width:100%}.main_wrap form.editingable input[type=text].edit,.edit .main_wrap form.editingable input[type=text],.main_wrap form.editingable textarea.edit,.edit .main_wrap form.editingable textarea{background:#444a;border:none;color:inherit;font:inherit}.main_wrap form input{margin:5px 0}.main_wrap .pagin{margin:10px 0;display:flex;flex-flow:row nowrap;justify-content:center}.main_wrap .pagin>a{display:block;background-color:#0005;padding:8px 12px;margin:0 2px}footer{padding:10px;text-align:center} \ No newline at end of file diff --git a/yadc/static/default.scss b/yadc/static/default.scss index 4568cf9..af9b8c8 100644 --- a/yadc/static/default.scss +++ b/yadc/static/default.scss @@ -310,7 +310,9 @@ header { flex-flow: column nowrap; align-items: start; - width: 100%; + // width: 100%; + top: 100%; + left: 0; position: absolute; z-index: 10; overflow: auto; diff --git a/yadc/static/search.js b/yadc/static/search.js index a3b5b38..08ea579 100644 --- a/yadc/static/search.js +++ b/yadc/static/search.js @@ -2,8 +2,25 @@ let tagroot = document.querySelector('article.tags') let sel_tags = tagroot.querySelector('div.tag_container.tags_selected') let page_tags = tagroot.querySelector('div.tag_container.tags_inpage') -let search_input = tagroot.querySelector('.searchbox > input[name=tagsearch]') -let search_dropdown = tagroot.querySelector('.searchbox > .search_dropdown') +let searchroot = tagroot.querySelector('.searchbox') +searchroot.insertAdjacentHTML("beforeend", ``) +let search_input = searchroot.querySelector('input[name=tags][type=text]') +search_input.removeAttribute('name') +search_input.value = '' +let search_hidden = document.querySelector('input[name=tags][type=hidden]') +let search_dropdown = searchroot.querySelector('.search_dropdown') + +// https://stackoverflow.com/questions/8486099/how-do-i-parse-a-url-query-parameters-in-javascript +function getJsonFromUrl(url) { + if(!url) url = location.search; + var query = url.substr(1); + var result = {}; + query.split("&").forEach(function(part) { + var item = part.split("="); + result[item[0]] = decodeURIComponent(item[1]); + }); + return result; +} function newseltag(tagname) { let tag = document.createElement("a") @@ -16,8 +33,23 @@ function newseltag(tagname) { `) tag.querySelector("span.name").textContent = tagname.replace(/_/g, ' ') + // tag.querySelector("input[type=hidden]").setAttribute('name', `tag#${tagname}`) return tag } + +function tags_input_addtag(tagname) { + let val = search_hidden.value.split(' ') + val.push(tagname) + search_hidden.value = val.join(' ').trim() + // console.log(search_hidden.value) +} +function tags_input_removetag(tagname) { + let val = search_hidden.value.split(' ') + val.splice(val.indexOf(tagname), 1) + search_hidden.value = val.join(' ').trim() + // console.log(search_hidden.value) +} + function addseltag(tagname) { // let pagetag = page_tags.querySelector("a.tag-"+tagname) let pagetag = page_tags.querySelector(`a[data-tagname=${tagname}]`) @@ -27,25 +59,37 @@ function addseltag(tagname) { let newtag = newseltag(tagname) newtag.addEventListener('click', (event) => { removeseltag(event.target.dataset.tagname) - console.log(`Deselected: ${event.target.dataset.tagname}`) + // console.log(`Deselected: ${event.target.dataset.tagname}`) }) + sel_tags.appendChild(newtag) + tags_input_addtag(tagname) } function removeseltag(tagname) { let pagetag = page_tags.querySelector(`a[data-tagname=${tagname}]`) if (pagetag) { pagetag.classList.remove('tag_hide') } + sel_tags.querySelector(`a[data-tagname=${tagname}]`).remove() + tags_input_removetag(tagname) } page_tags.querySelectorAll("a").forEach(element => { element.addEventListener('click', (event) => { addseltag(event.target.dataset.tagname) - console.log(`Selected: ${event.target.dataset.tagname}`) + // console.log(`Selected: ${event.target.dataset.tagname}`) event.preventDefault() }) }) +let query = getJsonFromUrl() +if (query['tags']) { + query['tags'].split('+').forEach((tag) => { + addseltag(tag) + }) +} + +// Suggestions function newsugtag(tagname) { let tag = document.createElement("a") tag.classList.add("tagsuggestion") @@ -77,13 +121,19 @@ function rendersuggestions(data) { search_dropdown.appendChild(sugtag) }); } - var search_timeout search_input.addEventListener('input', (event) => { clearTimeout(search_timeout) + let value = search_input.value.trim() + + if (value.length < 2) { + rendersuggestions([]) + return + } + search_timeout = setTimeout(() => { - fetch('/api/tags?q='+search_input.value).then((response) => { + fetch('/api/tags?q='+value).then((response) => { console.log(response) return response.json() }).then((data) => { @@ -94,11 +144,22 @@ search_input.addEventListener('input', (event) => { }, 500) }) -search_input.addEventListener('keypress', (event) => { - if (event.keyCode == 13) { - event.preventDefault() - } -}) +// search_input.addEventListener('keypress', (event) => { +// if (event.keyCode == 13) { +// // event.preventDefault() +// } +// }) +// search_input.addEventListener('blur', (event) => { +// if (event.explicitOriginalTarget != null) { +// classlist = event.explicitOriginalTarget.parentNode.classList +// if (classlist.contains('tags_selected') || classlist.contains('tags_inpage') || classlist.contains('search_dropdown')) { +// setTimeout(() => search_input.focus(), 2) +// } +// } +// console.log(event) +// }) +// page_tags.querySelectorAll('a').forEach((el) => el.removeAttribute('href')) + // console.log(page_tags) // console.log(sel_tags) diff --git a/yadc/templates/layout/base.html b/yadc/templates/layout/base.html index 9884740..b4aebfb 100644 --- a/yadc/templates/layout/base.html +++ b/yadc/templates/layout/base.html @@ -8,8 +8,6 @@ {% endassets %} - - {{ config.get('INSTANCE_NAME') }} @@ -62,5 +60,7 @@ + + \ No newline at end of file diff --git a/yadc/templates/layout/base_sidebar_tags.html b/yadc/templates/layout/base_sidebar_tags.html index d4bad18..fc57a75 100644 --- a/yadc/templates/layout/base_sidebar_tags.html +++ b/yadc/templates/layout/base_sidebar_tags.html @@ -1,21 +1,25 @@ {% extends 'layout/base_sidebar.html' %} {% block sidebar %} -
-
-

Tags

+ +

Search

- +
+ +
+ {% for rating in ('safe', 'questionable', 'explicit') %} + + + {% endfor %} +
+ +

Tags

{% for tag in tags %}