1
0
mirror of https://github.com/osmarks/meme-search-engine.git synced 2025-02-01 11:49:13 +00:00

frontend fixes

This commit is contained in:
osmarks 2024-05-21 20:17:23 +01:00
parent 24fbc0dd1f
commit 9455438bab

View File

@ -8,6 +8,7 @@
\:global(body) \:global(body)
font-family: "Fira Sans", "Noto Sans", "Segoe UI", Verdana, sans-serif font-family: "Fira Sans", "Noto Sans", "Segoe UI", Verdana, sans-serif
font-weight: 300 font-weight: 300
overflow-anchor: none
//margin: 0 //margin: 0
//min-height: 100vh //min-height: 100vh
@ -116,7 +117,7 @@
{/if} {/if}
<Masonry bind:refreshLayout={refreshLayout} colWidth="minmax(Min(20em, 100%), 1fr)" items={displayedResults}> <Masonry bind:refreshLayout={refreshLayout} colWidth="minmax(Min(20em, 100%), 1fr)" items={displayedResults}>
{#each displayedResults as result} {#each displayedResults as result}
{#key result.file} {#key `${queryCounter}${result.file}`}
<div class="result"> <div class="result">
<a href={util.getURL(result)}> <a href={util.getURL(result)}>
<picture> <picture>
@ -145,6 +146,7 @@
const chunkSize = 40 const chunkSize = 40
let queryTerms = [] let queryTerms = []
let queryCounter = 0
const focusEl = el => el.focus() const focusEl = el => el.focus()
const newTextQuery = (content=null) => { const newTextQuery = (content=null) => {
@ -170,8 +172,11 @@
heightThreshold = Math.min(...maxOffsets.values()) heightThreshold = Math.min(...maxOffsets.values())
console.log(heightThreshold, pendingImageLoads) console.log(heightThreshold, pendingImageLoads)
} }
const redrawGrid = () => { const redrawGrid = async () => {
if (refreshLayout) refreshLayout().then(recomputeScroll) if (refreshLayout) {
refreshLayout()
await recomputeScroll()
}
} }
let resultPromise let resultPromise
let results let results
@ -179,6 +184,7 @@
const runSearch = async () => { const runSearch = async () => {
if (!resultPromise) { if (!resultPromise) {
let args = {"terms": queryTerms.map(x => ({ image: x.imageData, text: x.text, weight: x.weight * { "+": 1, "-": -1 }[x.sign] }))} let args = {"terms": queryTerms.map(x => ({ image: x.imageData, text: x.text, weight: x.weight * { "+": 1, "-": -1 }[x.sign] }))}
queryCounter += 1
resultPromise = util.doQuery(args).then(res => { resultPromise = util.doQuery(args).then(res => {
error = null error = null
results = res results = res