add missing code, add comment

pull/26/head
Laurin Weger 6 months ago
parent 2d0b8d5614
commit ee58c8327e
No known key found for this signature in database
GPG Key ID: 9B372BB0B792770F
  1. 26
      ng-app/src/lib/Login.svelte
  2. 253
      ng-app/src/wallet_emojis.ts

@ -39,7 +39,7 @@
onMount(async () => {
loaded = false;
await load_svg();
load_svg();
//console.log(wallet);
await init();
});
@ -63,6 +63,8 @@
selection = [];
error = undefined;
// This is only for awaiting that SVGs are loaded.
await load_svg();
loaded = true;
}
@ -313,17 +315,11 @@
class="flex flex-col justify-center h-screen p-4"
class:min-w-[310px]={mobile}
class:min-w-[500px]={!mobile}
class:max-w-[360px]={mobile}
class:max-w-[370px]={mobile}
class:max-w-[600px]={!mobile}
>
{#if step == "load"}
<div
class="flex flex-col justify-center p-4"
class:min-w-[310px]={mobile}
class:min-w-[500px]={!mobile}
class:max-w-[360px]={mobile}
class:max-w-[600px]={!mobile}
>
<div class="flex flex-col justify-center p-4">
<h2 class="pb-5 text-xl self-start">How to open your wallet:</h2>
<h3 class="pb-2 text-lg self-start">By your Pazzle</h3>
<ul class="mb-8 ml-3 space-y-4 text-left list-decimal">
@ -450,13 +446,7 @@
</div>
<!-- The following steps have navigation buttons and fixed layout -->
{:else if step == "pazzle" || step == "order" || step == "pin" || step == "mnemonic"}
<div
class="flex flex-col justify-center h-screen p-4"
class:min-w-[310px]={mobile}
class:min-w-[500px]={!mobile}
class:max-w-[360px]={mobile}
class:max-w-[600px]={!mobile}
>
<div class="flex flex-col justify-center h-screen p-4">
<div class="mt-auto flex flex-col justify-center">
<!-- Unlock Screens -->
@ -555,7 +545,9 @@
>{#each pin_code as pin_key}*{/each}</span
>
</p>
<!-- Chrome requires the columns-3 __flex__ to be set, or else it wraps the lines incorrectly.
However, this leads to the width decreasing and the buttons come together in mobile view.
So we need a way to fix the width across all screens. -->
{#each [0, 1, 2] as row}
<div class="columns-3 flex">
{#each shuffle_pin.slice(0 + row * 3, 3 + row * 3) as num}

@ -88,9 +88,9 @@ let face = [
shortcode: "sleeping_face",
code: "sleeping",
},
];
];
let face_unwell = [
let face_unwell = [
{
hexcode: "1f637",
shortcode: "face_with_medical_mask",
@ -171,9 +171,9 @@ let face = [
shortcode: "face_with_steam_from_nose",
code: "annoyed",
},
];
];
let face_costume = [
let face_costume = [
{
hexcode: "1f921",
shortcode: "clown_face",
@ -254,9 +254,9 @@ let face = [
shortcode: "fairy",
code: "fairy",
},
];
];
let emotion = [
let emotion = [
{
hexcode: "1f48c",
shortcode: "love_letter",
@ -337,9 +337,9 @@ let face = [
shortcode: "folded_hands",
code: "praying",
},
];
];
let body = [
let body = [
{
hexcode: "1f4aa",
shortcode: "flexed_biceps",
@ -420,9 +420,9 @@ let face = [
shortcode: "running_shoe",
code: "shoe",
},
];
];
let sport = [
let sport = [
{
hexcode: "1f93a",
shortcode: "person_fencing",
@ -503,9 +503,9 @@ let face = [
shortcode: "martial_arts_uniform",
code: "martial",
},
];
];
let bigger_animal = [
let bigger_animal = [
{
hexcode: "1f981",
shortcode: "lion",
@ -582,9 +582,9 @@ let face = [
shortcode: "polar_bear",
code: "bear",
},
];
];
let smaller_animal = [
let smaller_animal = [
{
hexcode: "1f413",
shortcode: "rooster",
@ -661,9 +661,9 @@ let face = [
shortcode: "octopus",
code: "octopus",
},
];
];
let plants = [
let plants = [
{
hexcode: "1f40c",
shortcode: "snail",
@ -743,9 +743,9 @@ let face = [
shortcode: "mushroom",
code: "mushroom",
},
];
];
let fruits = [
let fruits = [
{
hexcode: "1f347",
shortcode: "grapes",
@ -826,9 +826,9 @@ let face = [
shortcode: "hot_pepper",
code: "pepper",
},
];
];
let food = [
let food = [
{
hexcode: "1f950",
shortcode: "croissant",
@ -909,9 +909,9 @@ let face = [
shortcode: "clinking_glasses",
code: "two_glasses",
},
];
];
let travel = [
let travel = [
{
hexcode: "1f3d4",
shortcode: "snow_capped_mountain",
@ -992,9 +992,9 @@ let face = [
shortcode: "rocket",
code: "rocket",
},
];
];
let sky = [
let sky = [
{
hexcode: "2600",
shortcode: "sun",
@ -1075,9 +1075,9 @@ let face = [
shortcode: "rainbow",
code: "rainbow",
},
];
];
let play = [
let play = [
{
hexcode: "1f3b8",
shortcode: "guitar",
@ -1158,9 +1158,9 @@ let face = [
shortcode: "diving_mask",
code: "scuba_diving",
},
];
];
let house = [
let house = [
{
hexcode: "1f9f9",
shortcode: "broom",
@ -1241,10 +1241,16 @@ let face = [
shortcode: "shopping_cart",
code: "shopping_cart",
},
];
];
let svgs_loaded = Promise.resolve(false);
/** Loads SVGs if they are not yet. TODO: This could probably be sped up by not awaiting sequentially. */
export async function load_svg() {
if (await svgs_loaded) {
return;
}
svgs_loaded = new Promise(async (resolve) => {
face[0].svg = await import("./assets/pazzle/emoji_u1f600.svg?component");
face[1].svg = await import("./assets/pazzle/emoji_u1f602.svg?component");
face[2].svg = await import("./assets/pazzle/emoji_u1f607.svg?component");
@ -1371,48 +1377,28 @@ export async function load_svg() {
/************** EMOTION *********************/
emotion[0].svg = await import(
"./assets/pazzle/emoji_u1f48c.svg?component"
);
emotion[0].svg = await import("./assets/pazzle/emoji_u1f48c.svg?component");
emotion[1].svg = await import("./assets/pazzle/emoji_u2764.svg?component");
emotion[2].svg = await import(
"./assets/pazzle/emoji_u1f495.svg?component"
);
emotion[2].svg = await import("./assets/pazzle/emoji_u1f495.svg?component");
emotion[3].svg = await import(
"./assets/pazzle/emoji_u1f48b.svg?component"
);
emotion[4].svg = await import(
"./assets/pazzle/emoji_u1f4af.svg?component"
);
emotion[5].svg = await import(
"./assets/pazzle/emoji_u1f4a5.svg?component"
);
emotion[3].svg = await import("./assets/pazzle/emoji_u1f48b.svg?component");
emotion[4].svg = await import("./assets/pazzle/emoji_u1f4af.svg?component");
emotion[5].svg = await import("./assets/pazzle/emoji_u1f4a5.svg?component");
emotion[6].svg = await import(
"./assets/pazzle/emoji_u1f4a6.svg?component"
);
emotion[7].svg = await import(
"./assets/pazzle/emoji_u1f91d.svg?component"
);
emotion[8].svg = await import(
"./assets/pazzle/emoji_u1f590.svg?component"
);
emotion[6].svg = await import("./assets/pazzle/emoji_u1f4a6.svg?component");
emotion[7].svg = await import("./assets/pazzle/emoji_u1f91d.svg?component");
emotion[8].svg = await import("./assets/pazzle/emoji_u1f590.svg?component");
emotion[9].svg = await import("./assets/pazzle/emoji_u270c.svg?component");
emotion[10].svg = await import(
"./assets/pazzle/emoji_u1f44d.svg?component"
);
emotion[11].svg = await import(
"./assets/pazzle/emoji_u270a.svg?component"
);
emotion[11].svg = await import("./assets/pazzle/emoji_u270a.svg?component");
emotion[12].svg = await import(
"./assets/pazzle/emoji_u1f450.svg?component"
);
emotion[13].svg = await import(
"./assets/pazzle/emoji_u270d.svg?component"
);
emotion[13].svg = await import("./assets/pazzle/emoji_u270d.svg?component");
emotion[14].svg = await import(
"./assets/pazzle/emoji_u1f64f.svg?component"
);
@ -1463,47 +1449,91 @@ export async function load_svg() {
/************** BIGGER ANIMAL *********************/
bigger_animal[0].svg = await import("./assets/pazzle/emoji_u1f981.svg?component");
bigger_animal[1].svg = await import("./assets/pazzle/emoji_u1f406.svg?component");
bigger_animal[2].svg = await import("./assets/pazzle/emoji_u1f434.svg?component");
bigger_animal[0].svg = await import(
"./assets/pazzle/emoji_u1f981.svg?component"
);
bigger_animal[1].svg = await import(
"./assets/pazzle/emoji_u1f406.svg?component"
);
bigger_animal[2].svg = await import(
"./assets/pazzle/emoji_u1f434.svg?component"
);
bigger_animal[3].svg = await import("./assets/pazzle/emoji_u1f993.svg?component");
bigger_animal[4].svg = await import("./assets/pazzle/emoji_u1f416.svg?component");
bigger_animal[5].svg = await import("./assets/pazzle/emoji_u1f410.svg?component");
bigger_animal[3].svg = await import(
"./assets/pazzle/emoji_u1f993.svg?component"
);
bigger_animal[4].svg = await import(
"./assets/pazzle/emoji_u1f416.svg?component"
);
bigger_animal[5].svg = await import(
"./assets/pazzle/emoji_u1f410.svg?component"
);
bigger_animal[6].svg = await import("./assets/pazzle/emoji_u1f411.svg?component");
bigger_animal[7].svg = await import("./assets/pazzle/emoji_u1f42a.svg?component");
bigger_animal[8].svg = await import("./assets/pazzle/emoji_u1f992.svg?component");
bigger_animal[6].svg = await import(
"./assets/pazzle/emoji_u1f411.svg?component"
);
bigger_animal[7].svg = await import(
"./assets/pazzle/emoji_u1f42a.svg?component"
);
bigger_animal[8].svg = await import(
"./assets/pazzle/emoji_u1f992.svg?component"
);
bigger_animal[9].svg = await import("./assets/pazzle/emoji_u1f418.svg?component");
bigger_animal[9].svg = await import(
"./assets/pazzle/emoji_u1f418.svg?component"
);
bigger_animal[10].svg = await import(
"./assets/pazzle/emoji_u1f98f.svg?component"
);
bigger_animal[11].svg = await import("./assets/pazzle/emoji_u1f9a9.svg?component");
bigger_animal[11].svg = await import(
"./assets/pazzle/emoji_u1f9a9.svg?component"
);
bigger_animal[12].svg = await import("./assets/pazzle/emoji_u1f433.svg?component");
bigger_animal[13].svg = await import("./assets/pazzle/emoji_u1f42c.svg?component");
bigger_animal[12].svg = await import(
"./assets/pazzle/emoji_u1f433.svg?component"
);
bigger_animal[13].svg = await import(
"./assets/pazzle/emoji_u1f42c.svg?component"
);
bigger_animal[14].svg = await import(
"./assets/pazzle/emoji_u1f43b_200d_2744.svg?component"
);
/************** SMALLER ANIMAL *********************/
smaller_animal[0].svg = await import("./assets/pazzle/emoji_u1f413.svg?component");
smaller_animal[1].svg = await import("./assets/pazzle/emoji_u1f423.svg?component");
smaller_animal[2].svg = await import("./assets/pazzle/emoji_u1f985.svg?component");
smaller_animal[0].svg = await import(
"./assets/pazzle/emoji_u1f413.svg?component"
);
smaller_animal[1].svg = await import(
"./assets/pazzle/emoji_u1f423.svg?component"
);
smaller_animal[2].svg = await import(
"./assets/pazzle/emoji_u1f985.svg?component"
);
smaller_animal[3].svg = await import("./assets/pazzle/emoji_u1f986.svg?component");
smaller_animal[4].svg = await import("./assets/pazzle/emoji_u1f989.svg?component");
smaller_animal[3].svg = await import(
"./assets/pazzle/emoji_u1f986.svg?component"
);
smaller_animal[4].svg = await import(
"./assets/pazzle/emoji_u1f989.svg?component"
);
smaller_animal[5].svg = await import(
"./assets/pazzle/emoji_u1f407.svg?component"
);
smaller_animal[6].svg = await import("./assets/pazzle/emoji_u1f427.svg?component");
smaller_animal[7].svg = await import("./assets/pazzle/emoji_u1f98e.svg?component");
smaller_animal[8].svg = await import("./assets/pazzle/emoji_u1f422.svg?component");
smaller_animal[6].svg = await import(
"./assets/pazzle/emoji_u1f427.svg?component"
);
smaller_animal[7].svg = await import(
"./assets/pazzle/emoji_u1f98e.svg?component"
);
smaller_animal[8].svg = await import(
"./assets/pazzle/emoji_u1f422.svg?component"
);
smaller_animal[9].svg = await import("./assets/pazzle/emoji_u1f40d.svg?component");
smaller_animal[9].svg = await import(
"./assets/pazzle/emoji_u1f40d.svg?component"
);
smaller_animal[10].svg = await import(
"./assets/pazzle/emoji_u1f994.svg?component"
);
@ -1511,9 +1541,15 @@ export async function load_svg() {
"./assets/pazzle/emoji_u1f987.svg?component"
);
smaller_animal[12].svg = await import("./assets/pazzle/emoji_u1f41f.svg?component");
smaller_animal[13].svg = await import("./assets/pazzle/emoji_u1f41a.svg?component");
smaller_animal[14].svg = await import("./assets/pazzle/emoji_u1f419.svg?component");
smaller_animal[12].svg = await import(
"./assets/pazzle/emoji_u1f41f.svg?component"
);
smaller_animal[13].svg = await import(
"./assets/pazzle/emoji_u1f41a.svg?component"
);
smaller_animal[14].svg = await import(
"./assets/pazzle/emoji_u1f419.svg?component"
);
/************** PLANTS *********************/
@ -1552,22 +1588,12 @@ export async function load_svg() {
fruits[8].svg = await import("./assets/pazzle/emoji_u1fad0.svg?component");
fruits[9].svg = await import("./assets/pazzle/emoji_u1f95d.svg?component");
fruits[10].svg = await import(
"./assets/pazzle/emoji_u1f951.svg?component"
);
fruits[11].svg = await import(
"./assets/pazzle/emoji_u1f346.svg?component"
);
fruits[10].svg = await import("./assets/pazzle/emoji_u1f951.svg?component");
fruits[11].svg = await import("./assets/pazzle/emoji_u1f346.svg?component");
fruits[12].svg = await import(
"./assets/pazzle/emoji_u1f955.svg?component"
);
fruits[13].svg = await import(
"./assets/pazzle/emoji_u1f33d.svg?component"
);
fruits[14].svg = await import(
"./assets/pazzle/emoji_u1f336.svg?component"
);
fruits[12].svg = await import("./assets/pazzle/emoji_u1f955.svg?component");
fruits[13].svg = await import("./assets/pazzle/emoji_u1f33d.svg?component");
fruits[14].svg = await import("./assets/pazzle/emoji_u1f336.svg?component");
/************** FOOD *********************/
@ -1606,18 +1632,12 @@ export async function load_svg() {
travel[8].svg = await import("./assets/pazzle/emoji_u1f682.svg?component");
travel[9].svg = await import("./assets/pazzle/emoji_u1f695.svg?component");
travel[10].svg = await import(
"./assets/pazzle/emoji_u1f3cd.svg?component"
);
travel[10].svg = await import("./assets/pazzle/emoji_u1f3cd.svg?component");
travel[11].svg = await import("./assets/pazzle/emoji_u26f5.svg?component");
travel[12].svg = await import("./assets/pazzle/emoji_u2708.svg?component");
travel[13].svg = await import(
"./assets/pazzle/emoji_u1f681.svg?component"
);
travel[14].svg = await import(
"./assets/pazzle/emoji_u1f680.svg?component"
);
travel[13].svg = await import("./assets/pazzle/emoji_u1f681.svg?component");
travel[14].svg = await import("./assets/pazzle/emoji_u1f680.svg?component");
/************** SKY *********************/
@ -1685,6 +1705,8 @@ export async function load_svg() {
house[13].svg = await import("./assets/pazzle/emoji_u1f9fd.svg?component");
house[14].svg = await import("./assets/pazzle/emoji_u1f6d2.svg?component");
resolve(true);
});
}
export const emojis = {
@ -1703,7 +1725,7 @@ export const emojis = {
sky,
play,
house,
};
};
export const emoji_cat = [
"face",
@ -1725,12 +1747,21 @@ export const emoji_cat = [
"emotion",
];
export function display_pazzle(pazzle) {
export function display_pazzle(pazzle: number[]) {
let res = [];
for (const emoji of pazzle) {
let cat = (emoji & 240) >> 4;
let idx = emoji & 15;
res.push(emoji_cat[cat] +": "+ emojis[emoji_cat[cat]][idx].code);
res.push(emoji_cat[cat] + ": " + emojis[emoji_cat[cat]][idx].code);
}
return res;
}
export function emojis_from_pazzle_ids(pazzle: number[]) {
return pazzle.map((emoji_id) => {
const cat_id = (emoji_id & 240) >> 4;
const cat_name = emoji_cat[cat_id];
let idx = emoji_id & 15;
return { cat: cat_name, ...emojis[cat_name][idx] };
});
}

Loading…
Cancel
Save