summaryrefslogtreecommitdiff
path: root/static/script.js
blob: 7ba03d20a8e41b883a3d3c9eaa8bd4ae0885f01e (plain)
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
"use strict";

let randomByte = () => Math.floor(Math.random() * 256);
let randomColor = () => `rgb(${randomByte()}, ${randomByte()}, ${randomByte()})`;
let hide = el => el.style.display = 'none';
let show = el => el.style.display = 'block';
let encode = x => encodeURIComponent(btoa(x));
let decode = x => atob(decodeURIComponent(x));

document.getElementById('entry').addEventListener('input', function(e) {
    e.preventDefault();
    var shareEl = document.getElementById('share')
    hide(shareEl)
    if (!e.target.value) {
        return
    }
    var encoded = encode(e.target.value)
    var url = `${location.origin}/telechromy?prompt=${encode(c)}&text=${encoded}`
    document.getElementById('url').value = url
    show(shareEl)
})

document.getElementById('copy').addEventListener('click', function(e) {
    e.preventDefault();
    document.getElementById('url').select()
    document.execCommand('copy');
})

document.getElementById('visit').addEventListener('click', function(e) {
    e.preventDefault();
    var url = document.getElementById('url').value
    window.location.replace(url)
})

document.getElementById('submit').addEventListener('click', function(e) {
    e.preventDefault();
    var color = document.getElementById('color').value
    var cc = urlParams.get('prompt')
    var tt = urlParams.get('text')
    var url = `${location.origin}/telechromy?prompt=${cc}&text=${tt}&guess=${encode(color)}`
    window.location.replace(url)
})

var bodyEl = document.getElementById('body');

var urlParams = new URLSearchParams(window.location.search);
var text = urlParams.get('text')
if (urlParams.get('guess')) {
    show(document.getElementById('result'))
    show(document.getElementById('labels'))
    document.getElementById('prompt-text').textContent = `“${decode(text)}”`
    var pp = decode(urlParams.get('prompt'))
    var gg = decode(urlParams.get('guess'))
    bodyEl.style = `background: linear-gradient(90deg, ${pp} 50%, ${gg} 50%)`
} else if (text) {
    show(document.getElementById('guess'))
    document.getElementById('challenge').textContent = `“${decode(text)}”`
} else {
    show(document.getElementById('prompt'))
    var c = randomColor();
    bodyEl.style = `background-color: ${c}`;
}