From e990c313991b3e795fc279efac5d650fdc0a7f7a Mon Sep 17 00:00:00 2001 From: Roger Veciana Date: Fri, 22 Mar 2024 22:28:10 +0100 Subject: [PATCH] Allow chosing fractions in quantities. Prettier config. --- .gitignore | 3 - .vscode/settings.json | 5 + src/ui/Edit.svelte | 44 +++---- src/ui/Settings.ts | 13 +++ src/ui/View.svelte | 261 ++++++++++++++++++++++-------------------- src/ui/utils.ts | 27 +++++ styles.css | 4 +- 7 files changed, 205 insertions(+), 152 deletions(-) create mode 100644 .vscode/settings.json diff --git a/.gitignore b/.gitignore index fd8f33a..0a5d1b4 100644 --- a/.gitignore +++ b/.gitignore @@ -1,6 +1,3 @@ -# vscode -.vscode - # Intellij *.iml .idea diff --git a/.vscode/settings.json b/.vscode/settings.json new file mode 100644 index 0000000..1529432 --- /dev/null +++ b/.vscode/settings.json @@ -0,0 +1,5 @@ +{ + "[svelte]": { + "editor.defaultFormatter": "svelte.svelte-vscode" + }, +} \ No newline at end of file diff --git a/src/ui/Edit.svelte b/src/ui/Edit.svelte index 0f6d8f1..da54152 100644 --- a/src/ui/Edit.svelte +++ b/src/ui/Edit.svelte @@ -1,29 +1,31 @@
- -
{ - if (e.key === 'Enter') { - document.execCommand('insertLineBreak') - e.preventDefault() - }}}>{data}
- +
{ + if (e.key === 'Enter') { + document.execCommand('insertLineBreak'); + e.preventDefault(); + } + }} + > + {data} +
diff --git a/src/ui/Settings.ts b/src/ui/Settings.ts index 46d1960..caa589a 100644 --- a/src/ui/Settings.ts +++ b/src/ui/Settings.ts @@ -69,6 +69,17 @@ export class Settings extends PluginSettingTab { this.plugin.saveData(this.plugin.settings); this.plugin.reloadPluginViews(); })); + + new Setting(containerEl) + .setName('Show quantities as fractions') + .setDesc('Show the ingredient quantities as fractions instead of decimals, if possible') + .addToggle(toggle => toggle + .setValue(this.plugin.settings.showFractionsInQuantities) + .onChange((value: boolean) => { + this.plugin.settings.showFractionsInQuantities = value; + this.plugin.saveData(this.plugin.settings); + this.plugin.reloadPluginViews(); + })); }} @@ -80,6 +91,7 @@ export interface CookLangSettings { showIngredientList: boolean; showCookwareList: boolean; showQuantitiesInline: boolean; + showFractionsInQuantities: boolean; } export const DEFAULT_SETTINGS: CookLangSettings = { @@ -88,4 +100,5 @@ export const DEFAULT_SETTINGS: CookLangSettings = { showIngredientList: true, showCookwareList: true, showQuantitiesInline: false, + showFractionsInQuantities: true, }; \ No newline at end of file diff --git a/src/ui/View.svelte b/src/ui/View.svelte index ff571bc..ffd7bfb 100644 --- a/src/ui/View.svelte +++ b/src/ui/View.svelte @@ -1,148 +1,157 @@
- {#if data.length === 0} -

{$i18n.t('empty')}

- - {:else} - - {#if settings.showImages && images.recipe} - Final result - {/if} - {#if settings.showIngredientList && recipe.ingredients.length > 0} -
-

{$i18n.t('ingredients')}

- {#if recipe.metadata.servings} -

Servings: {recipe.metadata.servings}

- {/if} - -
    - {#each recipe.ingredients as ingredient} -
  • {translateIngredientsQuantity(ingredient.quantity)} {ingredient.units} {ingredient.name}
    • - {/each} -
-
- {/if} - {#if settings.showCookwareList && recipe.cookwares.length > 0} -
-

{$i18n.t('cookware')}

-
    - {#each recipe.cookwares as cookware} -
  • {cookware.name}
    • - {/each} -
-
-{/if} -

{$i18n.t('method')}:

- -
- {#each recipe.steps as step, i} -

{$i18n.t('step')} {i+1}

- {#if settings.showImages && images[i]} - Final result - {/if} -

- {#each step as stepPart} - {#if stepPart.type === 'text'} - {stepPart.value} - {:else if stepPart.type === 'ingredient'} - {settings.showQuantitiesInline?`${translateIngredientsQuantity(stepPart.quantity)} ${stepPart.units} ${stepPart.name}`: `${stepPart.name}`} - {:else if stepPart.type === 'cookware'} - {stepPart.name} - {:else if stepPart.type === 'timer'} - {stepPart.quantity} {stepPart.units} - {/if} - - {/each} -

- {/each} -
- {/if} + {#if data.length === 0} +

{$i18n.t('empty')}

+ {:else} + {#if settings.showImages && images.recipe} + Final result + {/if} + {#if settings.showIngredientList && recipe.ingredients.length > 0} +
+

{$i18n.t('ingredients')}

+ {#if recipe.metadata.servings} +

Servings: {recipe.metadata.servings}

+ {/if} - {#if recipe.metadata.source} -
-

- {$i18n.t('source')}: {recipe.metadata.source} -

- {/if} +
    + {#each recipe.ingredients as ingredient} +
  • + {translateIngredientsQuantity(ingredient.quantity)} + {ingredient.units} + {ingredient.name} +
    • + {/each} +
+
+ {/if} + {#if settings.showCookwareList && recipe.cookwares.length > 0} +
+

{$i18n.t('cookware')}

+
    + {#each recipe.cookwares as cookware} +
  • {cookware.name}
    • + {/each} +
+
+ {/if} +

{$i18n.t('method')}:

+ +
+ {#each recipe.steps as step, i} +

{$i18n.t('step')} {i + 1}

+ {#if settings.showImages && images[i]} + Final result + {/if} +

+ {#each step as stepPart} + {#if stepPart.type === 'text'} + {stepPart.value} + {:else if stepPart.type === 'ingredient'} + {settings.showQuantitiesInline + ? `${translateIngredientsQuantity(stepPart.quantity)} ${stepPart.units} ${stepPart.name}` + : `${stepPart.name}`} + {:else if stepPart.type === 'cookware'} + {stepPart.name} + {:else if stepPart.type === 'timer'} + {stepPart.quantity} {stepPart.units} + {/if} + {/each} +

+ {/each} +
+ {/if} + + {#if recipe.metadata.source} +
+

+ {$i18n.t('source')}: {recipe.metadata.source} +

+ {/if}
diff --git a/src/ui/utils.ts b/src/ui/utils.ts index 6269115..518adc3 100644 --- a/src/ui/utils.ts +++ b/src/ui/utils.ts @@ -38,3 +38,30 @@ export const getI18n = (data:string) => { } + +export const formatNumber = (num: number|string, useFraction:boolean=false): string => { + if(typeof num === 'string') return num; + const epsilon = 0.0001; + if(Math.abs(num - 1/2) < epsilon) return useFraction?"1/2":"0.5"; + else if(Math.abs(num - 1/3) < epsilon) return useFraction?"1/3":"0.33"; + else if(Math.abs(num - 2/3) < epsilon) return useFraction?"2/3":"0.66"; + else if(Math.abs(num - 1/4) < epsilon) return useFraction?"1/4":"0.25"; + else if(Math.abs(num - 3/4) < epsilon) return useFraction?"3/4":"0.75"; + else if(Math.abs(num - 1/5) < epsilon) return useFraction?"1/5":"0.2"; + else if(Math.abs(num - 2/5) < epsilon) return useFraction?"2/5":"0.4"; + else if(Math.abs(num - 3/5) < epsilon) return useFraction?"3/5":"0.6"; + else if(Math.abs(num - 4/5) < epsilon) return useFraction?"4/5":"0.8"; + else if(Math.abs(num - 1/6) < epsilon) return useFraction?"1/6":"0.16"; + else if(Math.abs(num - 5/6) < epsilon) return useFraction?"5/6":"0.83"; + else if(Math.abs(num - 1/7) < epsilon) return useFraction?"1/7":"0.14"; + else if(Math.abs(num - 1/8) < epsilon) return useFraction?"1/8":"0.125"; + else if(Math.abs(num - 3/8) < epsilon) return useFraction?"3/8":"0.375"; + else if(Math.abs(num - 5/8) < epsilon) return useFraction?"5/8":"0.625"; + else if(Math.abs(num - 7/8) < epsilon) return useFraction?"7/8":"0.875"; + else if(Math.abs(num - 1/9) < epsilon) return useFraction?"1/9":"0.11"; + else if(Math.abs(num - 1/10) < epsilon) return useFraction?"1/10":"0.1"; + else if(Math.abs(num - 1/12) < epsilon) return useFraction?"1/12":"0.08"; + else if(Math.abs(num - 1/16) < epsilon) return useFraction?"1/16":"0.06"; + else if(Math.abs(num - 1/32) < epsilon) return useFraction?"1/32":"0.03"; + else return num.toString(); +}; \ No newline at end of file diff --git a/styles.css b/styles.css index 151ba99..fdbb677 100644 --- a/styles.css +++ b/styles.css @@ -1,4 +1,4 @@ -.content.svelte-1x7gjtx:empty:not(:focus):before{content:"Type the recipe here";opacity:0.6}.content.svelte-1x7gjtx{white-space:pre-line}:root{--tooltip-arrow-size:10px;--tooltip-background-color:rgba(0, 0, 0, 0.9);--tooltip-border-radius:4px;--tooltip-box-shadow:0 1px 20px rgba(0, 0, 0, 0.25);--tooltip-font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, +.content.svelte-1bdsa1h:empty:not(:focus):before{content:'Type the recipe here';opacity:0.6}.content.svelte-1bdsa1h{white-space:pre-line}:root{--tooltip-arrow-size:10px;--tooltip-background-color:rgba(0, 0, 0, 0.9);--tooltip-border-radius:4px;--tooltip-box-shadow:0 1px 20px rgba(0, 0, 0, 0.25);--tooltip-font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell, 'Helvetica Neue', sans-serif;--tooltip-font-size:14px;--tooltip-font-weight:500;--tooltip-line-height:1.25rem;--tooltip-color:#fff;--tooltip-offset-x:0px;--tooltip-offset-y:0px;--tooltip-padding:12px;--tooltip-pointer-events:none;--tooltip-white-space-hidden:nowrap;--tooltip-white-space-shown:normal;--tooltip-z-index:100}.tooltip.svelte-1xktviv{background-color:var(--tooltip-background-color);box-shadow:var(--tooltip-box-shadow);border-radius:var(--tooltip-border-radius);color:var(--tooltip-color);opacity:0;font-family:var(--tooltip-font-family);font-size:var(--tooltip-font-size);font-style:normal;font-weight:var(--tooltip-font-weight);line-height:var(--tooltip-line-height);padding:var(--tooltip-padding);pointer-events:var(--tooltip-pointer-events);position:absolute;text-align:left;visibility:hidden;white-space:var(--tooltip-white-space-hidden);z-index:var(--tooltip-z-index)}.tooltip.show.svelte-1xktviv{opacity:1;visibility:visible;white-space:var(--tooltip-white-space-shown)}.tooltip.bottom.svelte-1xktviv:after,.tooltip.left.svelte-1xktviv:after,.tooltip.right.svelte-1xktviv:after,.tooltip.top.svelte-1xktviv:after{border:var(--tooltip-arrow-size) solid var(--tooltip-background-color);content:' ';position:absolute}.tooltip.arrowless.svelte-1xktviv:after{border:0 !important}.tooltip.bottom.svelte-1xktviv,.tooltip.top.svelte-1xktviv{--tooltip-offset-x:0px;--tooltip-offset-y:12px}.tooltip.left.svelte-1xktviv,.tooltip.right.svelte-1xktviv{--tooltip-offset-x:12px;--tooltip-offset-y:0px}.tooltip.bottom.svelte-1xktviv{bottom:0;left:50%;transform:translate( calc(-50% + var(--tooltip-offset-x)), calc(100% + var(--tooltip-offset-y)) @@ -190,4 +190,4 @@ calc(-50% + var(--tooltip-offset-x)), calc(100% + var(--tooltip-offset-y)) ) - scale(1, 1)}.image-main.svelte-1ewzew3{width:100%}section.svelte-1ewzew3{border:1px solid #ccc;border-radius:0.25rem;padding:10px;margin-top:10px;position:relative}.section-title.svelte-1ewzew3{display:inline-block;left:5px;top:-1.5rem;position:absolute;font-size:0.75rem;font-weight:700;text-transform:uppercase;padding-left:0.75rem;padding-right:0.75rem;--tw-bg-opacity:1;background-color:var(--background-primary)}.servings.svelte-1ewzew3{width:fit-content}ul.ingredients.svelte-1ewzew3{column-count:2}ul.cookware.svelte-1ewzew3{column-count:2}span.cookware.svelte-1ewzew3{font-weight:600}span.ingredient.svelte-1ewzew3{font-weight:600}span.timer.svelte-1ewzew3{font-weight:600}.theme-light .tooltip{--tooltip-background-color:rgb(235, 232, 233);--tooltip-color:black;--tooltip-box-shadow:0 1px 8px rgb(125, 123, 123)} \ No newline at end of file + scale(1, 1)}.image-main.svelte-13gknjv{width:100%}section.svelte-13gknjv{border:1px solid #ccc;border-radius:0.25rem;padding:10px;margin-top:10px;position:relative}.section-title.svelte-13gknjv{display:inline-block;left:5px;top:-1.5rem;position:absolute;font-size:0.75rem;font-weight:700;text-transform:uppercase;padding-left:0.75rem;padding-right:0.75rem;--tw-bg-opacity:1;background-color:var(--background-primary)}.servings.svelte-13gknjv{width:fit-content}ul.ingredients.svelte-13gknjv{column-count:2}ul.cookware.svelte-13gknjv{column-count:2}span.cookware.svelte-13gknjv{font-weight:600}span.ingredient.svelte-13gknjv{font-weight:600}span.timer.svelte-13gknjv{font-weight:600}.theme-light .tooltip{--tooltip-background-color:rgb(235, 232, 233);--tooltip-color:black;--tooltip-box-shadow:0 1px 8px rgb(125, 123, 123)} \ No newline at end of file