vftdan
/
neomojimixer
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge pull request 'add direct link ability' (#12) from Johann150/neomojimixer:main into main 

Reviewed-on: https://codeberg.org/fotoente/neomojimixer/pulls/12
This commit is contained in:
fotoente 2024-04-24 18:07:19 +00:00
parent f2382a3d00 26a17cd4b4
commit a7e4ce76d1
4 changed files with 36 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
index.html
View File

@ -5,7 +5,6 @@
<title>Neomojimixer (BETA)</title> <title>Neomojimixer (BETA)</title>
<link rel="shortcut icon" href="favicon.gif" type="image/gif" /> <link rel="shortcut icon" href="favicon.gif" type="image/gif" />
<link rel="stylesheet" href="neomojimixer.css"> <link rel="stylesheet" href="neomojimixer.css">
</head> </head>
<body> <body>
<h2>Neomojimixer (BETA)</h2> <h2>Neomojimixer (BETA)</h2>
@ -29,7 +28,7 @@
<canvas id="canvas_export" width="256" height="256" hidden name="test.png"></canvas> <canvas id="canvas_export" width="256" height="256" hidden name="test.png"></canvas>
<img id="imageExport" src="" hidden/> <img id="imageExport" src="" hidden/>
<p id="exportSaveMessage" hidden>To save right click and choose "Save image as..."</p> <p id="exportSaveMessage" hidden>To save right click and choose "Save image as..."</p>
<input type="text" id="fullNeomojiName" name="" value="" readonly hidden/> <a id="fullNeomojiName" hidden></a>
<p>Neomojis are from the following sources: </p> <p>Neomojis are from the following sources: </p>
<ul> <ul>
<li><b><a href="https://volpeon.ink/emojis/neofox/" target="_blank" class="links">Neofox</a></b> by <a href="https://is-a.wyvern.rip/@volpeon" target="_blank" class="links">Volpeon</a></li> <li><b><a href="https://volpeon.ink/emojis/neofox/" target="_blank" class="links">Neofox</a></b> by <a href="https://is-a.wyvern.rip/@volpeon" target="_blank" class="links">Volpeon</a></li>
@ -41,11 +40,9 @@
<li><b>Neoredpanda</b> by <a href="https://hat-eine.entenbru.st/@Erpel" target="_blank" class="links">Ente</a></li> <li><b>Neoredpanda</b> by <a href="https://hat-eine.entenbru.st/@Erpel" target="_blank" class="links">Ente</a></li>
</ul> </ul>
<p>Sourcecode on Codeberg: <a href="https://codeberg.org/fotoente/neomojimixer" target="_blank">Neomojimixer</a> <p>Sourcecode on Codeberg: <a href="https://codeberg.org/fotoente/neomojimixer" target="_blank">Neomojimixer</a>
<p xmlns:cc="http://creativecommons.org/ns#" >This work is licensed under <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/?ref=chooser-v1" target="_blank" rel="license noopener noreferrer" style="display:inline-block;">CC BY-NC-SA 4.0<img style="height:22px!important;margin-left:3px;vertical-align:text-bottom;" src="https://mirrors.creativecommons.org/presskit/icons/cc.svg?ref=chooser-v1" alt=""><img style="height:22px!important;margin-left:3px;vertical-align:text-bottom;" src="https://mirrors.creativecommons.org/presskit/icons/by.svg?ref=chooser-v1" alt=""><img style="height:22px!important;margin-left:3px;vertical-align:text-bottom;" src="https://mirrors.creativecommons.org/presskit/icons/nc.svg?ref=chooser-v1" alt=""><img style="height:22px!important;margin-left:3px;vertical-align:text-bottom;" src="https://mirrors.creativecommons.org/presskit/icons/sa.svg?ref=chooser-v1" alt=""></a></p> <p xmlns:cc="http://creativecommons.org/ns#" >This work is licensed under <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/?ref=chooser-v1" target="_blank" rel="license noopener noreferrer" style="display:inline-block;">CC BY-NC-SA 4.0<img style="height:22px!important;margin-left:3px;vertical-align:text-bottom;" src="https://mirrors.creativecommons.org/presskit/icons/cc.svg?ref=chooser-v1" alt=""><img style="height:22px!important;margin-left:3px;vertical-align:text-bottom;" src="https://mirrors.creativecommons.org/presskit/icons/by.svg?ref=chooser-v1" alt=""><img style="height:22px!important;margin-left:3px;vertical-align:text-bottom;" src="https://mirrors.creativecommons.org/presskit/icons/nc.svg?ref=chooser-v1" alt=""><img style="height:22px!important;margin-left:3px;vertical-align:text-bottom;" src="https://mirrors.creativecommons.org/presskit/icons/sa.svg?ref=chooser-v1" alt=""></a></p>
<!-- Load in the JS as the last element or the DOM objects won't be there --> <!-- Load in the JS as the last element or the DOM objects won't be there -->
<script src="neomojimixer.js"></script> <script src="neomojimixer.js"></script>
</body> </body>
</html> </html>

32
neomojimixer.js
View File

@ -225,6 +225,14 @@ const NeomojiMixer = (function(NeomojiMixer) {
//Randomize initial view //Randomize initial view
randomize(); randomize();
// If there was a hash, restore as a direct permalink.
if (document.location.hash != "") {
loadFromHash(document.location.hash);
}
window.addEventListener("hashchange", () => {
loadFromHash(document.location.hash);
});
//Show little statistic //Show little statistic
var sum = 0; var sum = 0;
var variety = 1; var variety = 1;
@ -244,6 +252,26 @@ const NeomojiMixer = (function(NeomojiMixer) {
} }
function loadFromHash(hash) {
let parts = hash
.slice(1) // the first character is always the '#' sign
.split('+');
// define a constant order for the parts to appear in the hash
const parts_order = ["body", "eyes", "mouth", "arms"];
if (parts.length == parts_order.length) {
// convert the part names to part indices
parts = parts.map((name, i) =>
Array.from(part_handlers[parts_order[i]].name_element.options).findIndex(x => x.value === name)
);
if (parts.every(x => x != -1)) {
// all part names were found
parts.forEach((part_index, i) => part_handlers[parts_order[i]].setIndex(part_index));
}
}
}
function randomize() { //Randomize which parts are shown function randomize() { //Randomize which parts are shown
for (const i in part_handlers) { for (const i in part_handlers) {
part_handlers[i].randomize(); part_handlers[i].randomize();
@ -255,7 +283,9 @@ const NeomojiMixer = (function(NeomojiMixer) {
ctx.clearRect(0, 0, canvas.width, canvas.height); ctx.clearRect(0, 0, canvas.width, canvas.height);
neomoji_name.value = part_handlers.body.getSelectedEntry()[0] + "_" + part_handlers.eyes.getSelectedEntry()[0] + "_" + part_handlers.mouth.getSelectedEntry()[0] + "_" + part_handlers.arms.getSelectedEntry()[0]; //Set name for the emoji to use as the image name and to show as shortcode //Set name for the emoji to use as the image name and to show as shortcode
neomoji_name.innerText = part_handlers.body.getSelectedEntry()[0] + "_" + part_handlers.eyes.getSelectedEntry()[0] + "_" + part_handlers.mouth.getSelectedEntry()[0] + "_" + part_handlers.arms.getSelectedEntry()[0];
neomoji_name.href = new URL("#" + part_handlers.body.getSelectedEntry()[0] + "+" + part_handlers.eyes.getSelectedEntry()[0] + "+" + part_handlers.mouth.getSelectedEntry()[0] + "+" + part_handlers.arms.getSelectedEntry()[0], document.location.href)
let export_layers = [ let export_layers = [
part_handlers.body.createExportImage(), part_handlers.body.createExportImage(),

2
parts.json
View File

@ -13,7 +13,7 @@
{"name": "devil", "url": "/parts/eyes_devil.png"}, {"name": "devil", "url": "/parts/eyes_devil.png"},
{"name": "drowsy", "url": "/parts/eyes_drowsy.png"}, {"name": "drowsy", "url": "/parts/eyes_drowsy.png"},
{"name": "evil", "url": "/parts/eyes_evil.png"}, {"name": "evil", "url": "/parts/eyes_evil.png"},
{"name": ">_<", "url": "/parts/eyes_><.png"}, {"name": ">_<", "url": "/parts/eyes_squint.png"},
{"name": "cry", "url": "/parts/eyes_cry.png"}, {"name": "cry", "url": "/parts/eyes_cry.png"},
{"name": "owo", "url": "/parts/eyes_owo.png"}, {"name": "owo", "url": "/parts/eyes_owo.png"},
{"name": "sad", "url": "/parts/eyes_sad.png"}, {"name": "sad", "url": "/parts/eyes_sad.png"},

0
parts/eyes_><.png → parts/eyes_squint.png
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 4.9 KiB

After

Width:  |  Height:  |  Size: 4.9 KiB