Added loader. Stalls because to much work is done on the main thread. Good enough.

This commit is contained in:
Mario Zechner 2023-06-18 15:35:09 +02:00
parent d13a0e2d55
commit c34c5c7343
10 changed files with 51 additions and 1 deletions

View File

@ -14,4 +14,4 @@
<body class="w-full min-h-full flex flex-col">
<div class="max-w-6xl mx-auto lg:py-4 flex flex-col flex-1 w-full">
<h2 class="bg-primary lg:rounded-t-xl text-center text-white p-3 uppercase text-2xl font-bold">🔥 Heisse Preise 🔥</h2>
<h2 class="bg-primary lg:rounded-t-xl text-center text-white p-3 uppercase text-2xl font-bold">🔥 Heisse Preise 🔥</h2>

View File

@ -0,0 +1,42 @@
<img x-id="loader" class="mx-auto mt-8" src="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTM1IiBoZWlnaHQ9IjE0MCIgdmlld0JveD0iMCAwIDEzNSAxNDAiIHhtbG5
zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgZmlsbD0icmdiKDIwMSwgODQsIDU4KSI+Ci
AgICA8cmVjdCB5PSIxMCIgd2lkdGg9IjE1IiBoZWlnaHQ9IjEyMCIgcng9IjYiPgogICAgICAgI
DxhbmltYXRlIGF0dHJpYnV0ZU5hbWU9ImhlaWdodCIKICAgICAgICAgICAgIGJlZ2luPSIwLjVz
IiBkdXI9IjFzIgogICAgICAgICAgICAgdmFsdWVzPSIxMjA7MTEwOzEwMDs5MDs4MDs3MDs2MDs
1MDs0MDsxNDA7MTIwIiBjYWxjTW9kZT0ibGluZWFyIgogICAgICAgICAgICAgcmVwZWF0Q291bn
Q9ImluZGVmaW5pdGUiIC8+CiAgICAgICAgPGFuaW1hdGUgYXR0cmlidXRlTmFtZT0ieSIKICAgI
CAgICAgICAgIGJlZ2luPSIwLjVzIiBkdXI9IjFzIgogICAgICAgICAgICAgdmFsdWVzPSIxMDsx
NTsyMDsyNTszMDszNTs0MDs0NTs1MDswOzEwIiBjYWxjTW9kZT0ibGluZWFyIgogICAgICAgICA
gICAgcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiIC8+CiAgICA8L3JlY3Q+CiAgICA8cmVjdCB4PS
IzMCIgeT0iMTAiIHdpZHRoPSIxNSIgaGVpZ2h0PSIxMjAiIHJ4PSI2Ij4KICAgICAgICA8YW5pb
WF0ZSBhdHRyaWJ1dGVOYW1lPSJoZWlnaHQiCiAgICAgICAgICAgICBiZWdpbj0iMC4yNXMiIGR1
cj0iMXMiCiAgICAgICAgICAgICB2YWx1ZXM9IjEyMDsxMTA7MTAwOzkwOzgwOzcwOzYwOzUwOzQ
wOzE0MDsxMjAiIGNhbGNNb2RlPSJsaW5lYXIiCiAgICAgICAgICAgICByZXBlYXRDb3VudD0iaW
5kZWZpbml0ZSIgLz4KICAgICAgICA8YW5pbWF0ZSBhdHRyaWJ1dGVOYW1lPSJ5IgogICAgICAgI
CAgICAgYmVnaW49IjAuMjVzIiBkdXI9IjFzIgogICAgICAgICAgICAgdmFsdWVzPSIxMDsxNTsy
MDsyNTszMDszNTs0MDs0NTs1MDswOzEwIiBjYWxjTW9kZT0ibGluZWFyIgogICAgICAgICAgICA
gcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiIC8+CiAgICA8L3JlY3Q+CiAgICA8cmVjdCB4PSI2MC
Igd2lkdGg9IjE1IiBoZWlnaHQ9IjE0MCIgcng9IjYiPgogICAgICAgIDxhbmltYXRlIGF0dHJpY
nV0ZU5hbWU9ImhlaWdodCIKICAgICAgICAgICAgIGJlZ2luPSIwcyIgZHVyPSIxcyIKICAgICAg
ICAgICAgIHZhbHVlcz0iMTIwOzExMDsxMDA7OTA7ODA7NzA7NjA7NTA7NDA7MTQwOzEyMCIgY2F
sY01vZGU9ImxpbmVhciIKICAgICAgICAgICAgIHJlcGVhdENvdW50PSJpbmRlZmluaXRlIiAvPg
ogICAgICAgIDxhbmltYXRlIGF0dHJpYnV0ZU5hbWU9InkiCiAgICAgICAgICAgICBiZWdpbj0iM
HMiIGR1cj0iMXMiCiAgICAgICAgICAgICB2YWx1ZXM9IjEwOzE1OzIwOzI1OzMwOzM1OzQwOzQ1
OzUwOzA7MTAiIGNhbGNNb2RlPSJsaW5lYXIiCiAgICAgICAgICAgICByZXBlYXRDb3VudD0iaW5
kZWZpbml0ZSIgLz4KICAgIDwvcmVjdD4KICAgIDxyZWN0IHg9IjkwIiB5PSIxMCIgd2lkdGg9Ij
E1IiBoZWlnaHQ9IjEyMCIgcng9IjYiPgogICAgICAgIDxhbmltYXRlIGF0dHJpYnV0ZU5hbWU9I
mhlaWdodCIKICAgICAgICAgICAgIGJlZ2luPSIwLjI1cyIgZHVyPSIxcyIKICAgICAgICAgICAg
IHZhbHVlcz0iMTIwOzExMDsxMDA7OTA7ODA7NzA7NjA7NTA7NDA7MTQwOzEyMCIgY2FsY01vZGU
9ImxpbmVhciIKICAgICAgICAgICAgIHJlcGVhdENvdW50PSJpbmRlZmluaXRlIiAvPgogICAgIC
AgIDxhbmltYXRlIGF0dHJpYnV0ZU5hbWU9InkiCiAgICAgICAgICAgICBiZWdpbj0iMC4yNXMiI
GR1cj0iMXMiCiAgICAgICAgICAgICB2YWx1ZXM9IjEwOzE1OzIwOzI1OzMwOzM1OzQwOzQ1OzUw
OzA7MTAiIGNhbGNNb2RlPSJsaW5lYXIiCiAgICAgICAgICAgICByZXBlYXRDb3VudD0iaW5kZWZ
pbml0ZSIgLz4KICAgIDwvcmVjdD4KICAgIDxyZWN0IHg9IjEyMCIgeT0iMTAiIHdpZHRoPSIxNS
IgaGVpZ2h0PSIxMjAiIHJ4PSI2Ij4KICAgICAgICA8YW5pbWF0ZSBhdHRyaWJ1dGVOYW1lPSJoZ
WlnaHQiCiAgICAgICAgICAgICBiZWdpbj0iMC41cyIgZHVyPSIxcyIKICAgICAgICAgICAgIHZh
bHVlcz0iMTIwOzExMDsxMDA7OTA7ODA7NzA7NjA7NTA7NDA7MTQwOzEyMCIgY2FsY01vZGU9Imx
pbmVhciIKICAgICAgICAgICAgIHJlcGVhdENvdW50PSJpbmRlZmluaXRlIiAvPgogICAgICAgID
xhbmltYXRlIGF0dHJpYnV0ZU5hbWU9InkiCiAgICAgICAgICAgICBiZWdpbj0iMC41cyIgZHVyP
SIxcyIKICAgICAgICAgICAgIHZhbHVlcz0iMTA7MTU7MjA7MjU7MzA7MzU7NDA7NDU7NTA7MDsx
MCIgY2FsY01vZGU9ImxpbmVhciIKICAgICAgICAgICAgIHJlcGVhdENvdW50PSJpbmRlZmluaXR
lIiAvPgogICAgPC9yZWN0Pgo8L3N2Zz4=">

View File

@ -12,6 +12,7 @@
<items-list x-id="cartList" chart json nosort remove updown class="hidden"></items-list>
<items-filter x-id="productsFilter" class="hidden" stores misc nochartclear placeholder="Produkt hinzufügen..."></items-filter>
<items-list x-id="productsList" class="hidden" add></items-list>
%%_templates/_loader.html%%
</div>
<script src="cart.js"></script>

View File

@ -207,4 +207,5 @@ function loadCart() {
cartList.model = cartFilter.model = cart;
productsList.model = productsFilter.model = models.items;
if (c || d) itemsChart.render();
document.querySelector('[x-id="loader"]').classList.add("hidden");
})();

View File

@ -9,6 +9,7 @@
<input type="button" id="import" value="Importieren" class="text-primary font-medium hover:underline cursor-pointer" />
</div>
<carts-list id="carts" class="carts-list w-full"></carts-list>
%%_templates/_loader.html%%
</div>
</div>
<input type="file" id="fileInput" class="hidden" />

View File

@ -71,4 +71,5 @@ function importCarts(importedCarts) {
};
reader.readAsText(event.target.files[0]);
});
document.querySelector('[x-id="loader"]').classList.add("hidden");
})();

View File

@ -4,6 +4,7 @@
<h1 class="text-2xl font-bold pb-2 pt-8 text-center">Preisänderungen</h1>
<items-filter x-id="items-filter" pricechanges pricedirection stores misc placeholder="Filtern..."></items-filter>
<items-list chart></items-list>
%%_templates/_loader.html%%
</div>
<script src="changes.js"></script>

View File

@ -38,4 +38,5 @@ require("./views");
}
itemsFilter.model = itemsList.model = model.items;
itemsFilter.fireChangeEvent();
document.querySelector('[x-id="loader"]').classList.add("hidden");
})();

View File

@ -4,6 +4,7 @@
<h1 class="text-2xl font-bold pb-2 pt-8 text-center">Produktsuche</h1>
<items-filter x-id="items-filter" emptyquery stores misc></items-filter>
<items-list share json chart></items-list>
%%_templates/_loader.html%%
</div>
<script src="index.js"></script>

View File

@ -37,4 +37,5 @@ require("./views");
}
itemsFilter.model = itemsList.model = model.items;
itemsFilter.fireChangeEvent();
document.querySelector('[x-id="loader"]').classList.add("hidden");
})();