diff options
| -rw-r--r-- | web/ytlist.html | 5 | ||||
| -rw-r--r-- | web/ytlist/ytlist.js | 46 |
2 files changed, 31 insertions, 20 deletions
diff --git a/web/ytlist.html b/web/ytlist.html index 493efac..2b8bd8b 100644 --- a/web/ytlist.html +++ b/web/ytlist.html @@ -4,11 +4,10 @@ <link rel="stylesheet" href="/ytlist/ytlist.css" /> </head> <body> - <script src='/ytlist/sql-wasm.js'></script> - <script src='/ytlist/ytlist.js'></script> <div id="search_box"> leave blank for seaching all<br> query: <input id="search_in"></input><br> + show thumbnails: <input type="checkbox" id="gen_thumb_check" name="gen_thumb_check" checked></input><br> category <div id="category_box"> <input type="radio" name="category_choice" value="ALL" checked> ALL<br> @@ -20,5 +19,7 @@ <button onclick="search()">search</button><br> </div> <div id="the_box"></div> + <script src='/ytlist/sql-wasm.js'></script> + <script src='/ytlist/ytlist.js'></script> </body> </html> diff --git a/web/ytlist/ytlist.js b/web/ytlist/ytlist.js index 2f13a79..9354b02 100644 --- a/web/ytlist/ytlist.js +++ b/web/ytlist/ytlist.js @@ -1,34 +1,43 @@ let db_file="youtube_stuffs.db" +let gen_thumb=true function insert_item(item,imgurl){ + let imgtag="<br><br>" + if(imgurl){ + imgtag=`<img src="${imgurl}"></img>` + } the_box.innerHTML+=`<div> <a href="https://youtube.com/watch?v=${item[2]}" target="_BLANK"> <span class="video-title">${item[0]}: ${item[1]}</span> <span class="video-channelname">${item[3]}</span> <br> - <img src="${imgurl}"></img> + ${imgtag} </a> </div>` } function get_item(item){ - fetch(`/ytlist/thumbnails/${item[2]}.webp`, - { method: "HEAD" } - ).then((res) => { - if (res.ok) { - insert_item(item,res.url); - } else { - fetch(`/ytlist/thumbnails/${item[2]}.jpg`, - { method: "HEAD" } - ).then((res) => { - if (res.ok) { - insert_item(item,res.url); - } else { - insert_item(item,null); - } - }); - } - }); + if(gen_thumb==true){ + fetch(`/ytlist/thumbnails/${item[2]}.webp`, + { method: "HEAD" } + ).then((res) => { + if (res.ok) { + insert_item(item,res.url); + } else { + fetch(`/ytlist/thumbnails/${item[2]}.jpg`, + { method: "HEAD" } + ).then((res) => { + if (res.ok) { + insert_item(item,res.url); + } else { + insert_item(item,null); + } + }); + } + }); + } else { + insert_item(item,null) + } } async function search(){ @@ -54,6 +63,7 @@ async function search(){ let res = db.exec(query); the_box.innerHTML=""; + gen_thumb=gen_thumb_check.checked res[0].values.forEach(item=>{get_item(item)}); } |