-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
66 lines (63 loc) · 2.91 KB
/
index.html
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
<!DOCTYPE html>
<html lang = "en">
<head>
<meta charset = "utf-8" />
<meta name = "viewport" content = "width = device-width, height = device-height, initial-scale = 0.8" />
<meta name = "author" content = "NicoPauer" />
<meta name = "keywords" content = "errors correction, quantum, Quantum, computation, Computation, error-handling" />
<title>Errors Corrector</title>
<script type = "text/javascript" src = "pauer-correction.js"></script>
<script type = "text/javascript" src = "form-controls.js"></script>
<link rel = "icon" href = "pauer-corrector.svg" />
<link rel = "stylesheet" href = "theme.css" />
</head>
<body>
<article id = "image-corrector" title = "Input data and change image colors for fix it">
<header>Values pairs for giving colors to the image</header>
<section id = "interface" title = "Graphical Interface">
<img id = "image" alt = "image to paint" title = "correction use colors pairs" src = "color-sensitive-image.png"/>
<form id = "controls" title = "buttons and data entry">
<input title = "Start color" type = "color" />
<button title = "Add a new pair">+</button>
<input title = "End color" type = "color" />
</form>
<script type = "text/javascript">
// Write this here because externaally I can't access to all the web Graphical Interface
// Functions
function updatePickers(first, second)
{
// Turn into the complementary color of first to color value of the second
second.value = complementary(first.value);
}
function addPickers()
{
// Add a picker before and after of button (the unique in this web)
document.querySelectorAll("button::before")[0].innerHTML += "<input type = 'color' title = 'Mid values' />";
document.querySelectorAll("button::after")[1].innerHTML += "<input type = 'color' title = 'Mid values' />";
}
function updating()
{
let pickers = document.querySelectorAll("input[type='color']");
for (let index = 0; index < (pickers.length - 2); index++)
{
// Preparation
updatePickers(pickers[index], pickers[index + 1]);
}
}
// Update in each second
setInterval(updating(), 1000);
// Add Events
document.querySelectorAll("button")[0].addEventListener('click', addPickers());
</script>
</section>
<footer title = "about the developer">
<h1>About</h1>
<nav>
© 2024
<a title = "My Github profile" href = "https://github.com/NicoPauer/">Nico Pauer</a><br />
<a title = "My E-Mail" href = "mailto:nicopauer20@gmail.com"><nicopauer20@gmail.com></a>
</nav>
</footer>
</article>
</body>
</html>