Spaces:
Running
Running
File size: 3,170 Bytes
9fbb486 2d460b1 9fbb486 2d460b1 9421891 2d460b1 38e3cc4 99431c9 2d460b1 75496f8 2d460b1 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 |
import { generateDetails, createTask, longPollTask } from './network.js';
import { cardHTML } from './card-html.js';
import {
durationTimer,
updateCardName,
initialiseCardRotation,
setOutput,
screenshotCard,
} from './dom-manipulation.js';
const nameInput = document.querySelector('input[name="name"');
const nameToggle = document.querySelector('button.toggle-name');
let pokeName;
let trainerName;
let useTrainerName = true;
let generating = false;
let mousemoveHandlerForPreviousCard;
const generate = async () => {
if (generating) {
return;
}
try {
const scene = document.querySelector('.scene');
const cardSlot = scene.querySelector('.card-slot');
const durationDisplay = document.querySelector('.duration');
scene.removeEventListener('mousemove', mousemoveHandlerForPreviousCard, true);
cardSlot.innerHTML = '';
generating = true;
setOutput('booster', 'generating');
const details = await generateDetails();
pokeName = details.name;
const task = await createTask(details.energy_type);
document.querySelector('.actions').style.opacity = '1';
durationDisplay.classList.add('displayed');
const timer = durationTimer(durationDisplay);
const timerCleanup = timer().cleanup;
const completedTask = await longPollTask(task);
generating = false;
timerCleanup(completedTask);
if (completedTask.status === 'failed') {
setOutput('booster', 'failed');
throw new Error(`Task failed: ${completedTask.error}`);
}
setOutput('booster', 'completed');
cardSlot.innerHTML = cardHTML(details);
updateCardName(trainerName, pokeName, useTrainerName);
const picture = document.querySelector('img.picture');
picture.src = completedTask.value;
mousemoveHandlerForPreviousCard = initialiseCardRotation(scene);
await new Promise((resolve) =>
setTimeout(resolve, window.matchMedia('(prefers-reduced-motion: reduce)').matches ? 1_500 : 1_000)
);
setOutput('card', 'completed');
} catch (err) {
generating = false;
console.error(err);
}
};
nameInput.addEventListener('input', (e) => {
trainerName = [...e.target.value].filter((char) => char.match(/[\wÀ-ÿ '".,@&+#!?:/\\()_-]/g)?.length).join('');
nameInput.value = trainerName;
updateCardName(trainerName, pokeName, useTrainerName);
});
document.querySelector('form.trainer-name').addEventListener('submit', (e) => {
e.preventDefault();
generate();
});
nameToggle.addEventListener('click', () => {
useTrainerName = !useTrainerName;
updateCardName(trainerName, pokeName, useTrainerName);
if (!useTrainerName) {
nameToggle.classList.add('off');
} else {
nameToggle.classList.remove('off');
}
});
document.querySelector('.booster').addEventListener('click', generate);
document.querySelector('button.generate-new').addEventListener('click', generate);
document.querySelector('button.save').addEventListener('click', async () => {
const a = document.createElement('a');
a.href = await screenshotCard();
a.download = `${updateCardName(trainerName, pokeName, useTrainerName)} - This Pokémon Does Not Exist.png`;
a.click();
});
|