56 lines
1.7 KiB
HTML
56 lines
1.7 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<title>Diplom Generator</title>
|
|
<link rel="stylesheet" href="https://decicus-cdn.b-cdn.net/water.css/v2.1.1/dark.min.css" integrity="sha384-cJBdsSYaB37lARFjqUmJVoGdRQaQndlSkVAOB0QSVMzFhBAQ6Aymcu3PIkS8CkWl" crossorigin="anonymous">
|
|
<style type="text/css">
|
|
body {
|
|
max-width: 85%;
|
|
}
|
|
|
|
.hidden {
|
|
display: none;
|
|
}
|
|
</style>
|
|
</head>
|
|
<h1>Diplom Generator</h1>
|
|
|
|
<form id="form">
|
|
<input type="hidden" name="template" value="diplom-1.png">
|
|
|
|
<label for="top">Top text:</label>
|
|
<input type="text" name="top" placeholder="Name">
|
|
|
|
<label for="bottom">Bottom text:</label>
|
|
<input type="text" name="bottom" placeholder="Text">
|
|
|
|
<button type="submit" id="submit">Generate</button>
|
|
</form>
|
|
|
|
<img class="hidden" id="preview" src="">
|
|
|
|
<a href="https://git.je/Alex/DiplomGenerator">Code can be found here</a>
|
|
|
|
<script>
|
|
const form = document.getElementById('form');
|
|
form.addEventListener('submit', function(e) {
|
|
e.preventDefault();
|
|
});
|
|
|
|
const submit = document.getElementById('submit');
|
|
const preview = document.getElementById('preview');
|
|
|
|
submit.addEventListener('click', function() {
|
|
const url = new URL(window.location.href);
|
|
url.pathname = 'generate.php';
|
|
|
|
url.searchParams.set('template', form.elements.template.value);
|
|
url.searchParams.set('top', form.elements.top.value);
|
|
url.searchParams.set('bottom', form.elements.bottom.value);
|
|
|
|
preview.src = url.href;
|
|
preview.classList.remove('hidden');
|
|
});
|
|
</script>
|
|
</html> |