From e9a2fb97f8b6d6ede9aa4efe4925c98e11281f16 Mon Sep 17 00:00:00 2001 From: Herwin Bozet Date: Wed, 5 Mar 2025 23:47:05 +0100 Subject: [PATCH] Added Icon Maker mockup Update .gitignore, ico-maker.yml, and 9 more files... --- .gitignore | 4 + data/applets/ico-maker.yml | 8 + data/strings/en/ico-maker.yml | 3 + data/strings/fr/ico-maker.yml | 3 + data/tools/ico-maker.yml | 30 +++ data/tools/png-chunk-analyser.yml | 1 - scripts/compile-js-site.cmd | 10 + .../excel-password-remover.css | 3 - .../applets/ico-maker/ico-maker.css | 0 .../applets/ico-maker/ico-maker.mjs | 24 ++ templates/applets/ico-maker.jinja | 208 ++++++++++++++++++ 11 files changed, 290 insertions(+), 4 deletions(-) create mode 100644 data/applets/ico-maker.yml create mode 100644 data/strings/en/ico-maker.yml create mode 100644 data/strings/fr/ico-maker.yml create mode 100644 data/tools/ico-maker.yml create mode 100644 static/resources/NibblePoker/applets/ico-maker/ico-maker.css create mode 100644 static/resources/NibblePoker/applets/ico-maker/ico-maker.mjs create mode 100644 templates/applets/ico-maker.jinja diff --git a/.gitignore b/.gitignore index d9b2152..0519be0 100644 --- a/.gitignore +++ b/.gitignore @@ -11,3 +11,7 @@ node_modules/ # Internal stuff *.pdn *.ai + +# Temp +static/resources/SortableJS +static/resources/Standalone diff --git a/data/applets/ico-maker.yml b/data/applets/ico-maker.yml new file mode 100644 index 0000000..b9c0ca6 --- /dev/null +++ b/data/applets/ico-maker.yml @@ -0,0 +1,8 @@ +applets: + - id: "ico-maker" + resources: + scripts: + #- "https://cdn.nibblepoker.lu/SortableJS/1.15.6/Sortable.min.js" + - "applet://ico-maker.mjs" + stylesheets: + - "applet://ico-maker.css" diff --git a/data/strings/en/ico-maker.yml b/data/strings/en/ico-maker.yml new file mode 100644 index 0000000..98428fb --- /dev/null +++ b/data/strings/en/ico-maker.yml @@ -0,0 +1,3 @@ +# EN - Ico Maker + +t01: "" diff --git a/data/strings/fr/ico-maker.yml b/data/strings/fr/ico-maker.yml new file mode 100644 index 0000000..cdc645c --- /dev/null +++ b/data/strings/fr/ico-maker.yml @@ -0,0 +1,3 @@ +# FR - Ico Maker + +t01: "" diff --git a/data/tools/ico-maker.yml b/data/tools/ico-maker.yml new file mode 100644 index 0000000..ef21163 --- /dev/null +++ b/data/tools/ico-maker.yml @@ -0,0 +1,30 @@ +tools: + - id: "ico-maker" + applet_id: "ico-maker" + metadata: + head: + title_key: "meta.title" + description_key: "meta.description" + opengraph: + title_key: "meta.title" + description_key: "meta.description" + type: null + url: null + image_url: "/resources/NibblePoker/images/tools/ico-maker/main.png" + image_type: null + twitter: + title_key: "meta.title" + description_key: "meta.description" + index: + priority: 100 + enable: true + title_key: "meta.title" + preamble_key: "meta.description" + image_url: "/resources/NibblePoker/images/tools/ico-maker/main.png" + image_alt_key: "" + general: + icon: "fab fa-python" + title_key: "meta.title" + subtitle_key: "article.subtitle" + tags: + - "undefined" diff --git a/data/tools/png-chunk-analyser.yml b/data/tools/png-chunk-analyser.yml index 80ab83f..e140185 100644 --- a/data/tools/png-chunk-analyser.yml +++ b/data/tools/png-chunk-analyser.yml @@ -1,4 +1,3 @@ - tools: - id: "png-chunk-analyser" applet_id: "png-chunk-analyser" diff --git a/scripts/compile-js-site.cmd b/scripts/compile-js-site.cmd index cbfa938..8676ef5 100644 --- a/scripts/compile-js-site.cmd +++ b/scripts/compile-js-site.cmd @@ -54,6 +54,16 @@ call "%~dp0node_modules\.bin\terser" excel-password-remover.js -c -m -o excel-pa popd +:js-applet-ico-maker +echo Minifying Ico Maker +pushd %CD% +cd %~dp0\..\static\resources\NibblePoker\applets\ico-maker\ +echo ^> static\resources\NibblePoker\applets\ico-maker\ico-maker.mjs +call "%~dp0node_modules\.bin\rollup" ico-maker.mjs --file ico-maker.js +call "%~dp0node_modules\.bin\terser" ico-maker.js -c -m -o ico-maker.min.js +popd + + :js-uuidgenerator-minify echo Minifying UUID Generator pushd %CD% diff --git a/static/resources/NibblePoker/applets/excel-password-remover/excel-password-remover.css b/static/resources/NibblePoker/applets/excel-password-remover/excel-password-remover.css index 01ee543..e69de29 100644 --- a/static/resources/NibblePoker/applets/excel-password-remover/excel-password-remover.css +++ b/static/resources/NibblePoker/applets/excel-password-remover/excel-password-remover.css @@ -1,3 +0,0 @@ -.cursor-pointer { - cursor: pointer; -} diff --git a/static/resources/NibblePoker/applets/ico-maker/ico-maker.css b/static/resources/NibblePoker/applets/ico-maker/ico-maker.css new file mode 100644 index 0000000..e69de29 diff --git a/static/resources/NibblePoker/applets/ico-maker/ico-maker.mjs b/static/resources/NibblePoker/applets/ico-maker/ico-maker.mjs new file mode 100644 index 0000000..dbe1c11 --- /dev/null +++ b/static/resources/NibblePoker/applets/ico-maker/ico-maker.mjs @@ -0,0 +1,24 @@ +/**! + * NibblePoker Ico Maker + * @author Herwin Bozet + * @license Public Domain + */ + +import {Sortable} from "../../../SortableJS/1.15.6/modular/sortable.core.esm.js" + +export const appletId = "ico-maker"; + +{ + const eIconPartsContainer = document.getElementById(`${appletId}-icon-parts-list`); + + + window.onload = function () { + + // Setting up SortableJS + let sortable = Sortable.create(eIconPartsContainer, { + animation: 125, // ms, animation speed moving items when sorting, `0` — without animation + easing: "cubic-bezier(1, 0, 0, 1)", // Easing for animation. Defaults to null. See https://easings.net/ for examples. + + }); + }; +} diff --git a/templates/applets/ico-maker.jinja b/templates/applets/ico-maker.jinja new file mode 100644 index 0000000..b17b0a2 --- /dev/null +++ b/templates/applets/ico-maker.jinja @@ -0,0 +1,208 @@ + +
+ {{ render_h2(l10n("introduction.title", "commons", user_lang)) }} + {{ render_paragraph(l10n("introduction.1", applet_data.id, user_lang)) }} + {{ render_paragraph(l10n("introduction.2", applet_data.id, user_lang)) }} +
+ +
+ {{ render_h2(l10n("input.title", "commons", user_lang)) }} + {{ render_paragraph(l10n("input.1", applet_data.id, user_lang)) }} + + {{ render_file_input(applet_data.id + "-image-input-file", true, ".png, .bmp, .ico", true, false, user_lang) }} + +
+ + + + + +
+ + + + Enables upload and inclusion in final .ico file. + +
+ + {{ render_button("Add Text", False, None, "bkgd-blue") }} + + + {{ render_button("Remove Binary Blobs", False, None, "bkgd-orange") }} + {{ render_button("Remove Everything", False, None, "bkgd-red") }} + +
+ +
+ {{ render_h2(l10n("idk01.title", "commons", user_lang)) }} + {{ render_paragraph(l10n("idk01.1", applet_data.id, user_lang)) }} + + {{ render_button("Download .ico", False, None, "bkgd-green") }} + +
+ + + + + + + + +
+ + +
+

Required ICO Headers

+
+
+
+

+ 1.23 KiB +

+
+
+
+ +
+ +
+ + + + + + + + + + + + + + +
+ + +
+

+ + MyFile.png +

+
+
BKGD IMG
+ + +
+

+ 32x32 + 12.5 KiB + 32 bpp + 256 colors +

+
+
+ + +
+ {{ render_button("Options", False, None, "bkgd-blue") }} + {{ render_button("Remove", False, None, "bkgd-orange") }} + {{ render_button("Details", False, None, "") }} +
+
+
+ +
+ + + + + + + + + + + + + +
+ + +
+

+ + Watermark.bin +

+
+
+ + +
+

+ 12.5 KiB +

+
+
+ + +
+ {{ render_button("Remove", False, None, "bkgd-orange") }} +
+
+
+ +
+ + + + + + + + + + + + + +
+ + +
+

+ + Custom Text +

+
+
+ + +
+ + +
+
+ + +
+ {{ render_button("Options", False, None, "bkgd-blue") }} + {{ render_button("Remove", False, None, "bkgd-orange") }} +
+
+
+ +
+ +
+ + +
+ {{ render_h2(l10n("licenses.title", "commons", user_lang)) }} + {{ render_paragraph(l10n("licenses.1", applet_data.id, user_lang)) }} + {{ render_paragraph(l10n("licenses.2", applet_data.id, user_lang)) }} +