// USAGE: // place this file somewhere in the webroot and then // python3 -m copyparty --js-browser /memes/meadup.js // // FEATURES: // * adds an onscreen keyboard for operating a media center remotely, // relies on https://github.com/9001/copyparty/blob/hovudstraum/bin/mtag/very-bad-idea.py // * adds an interactive anime girl (if you can find the dependencies) var hambagas = [ "https://www.youtube.com/watch?v=pFA3KGp4GuU" ]; // keybaord, // onscreen keyboard by @steinuil function initKeybaord(BASE_URL, HAMBAGA, consoleLog, consoleError) { document.querySelector('.keybaord-container').innerHTML = `
esc
F1
F2
F3
F4
F5
F6
F7
F8
F9
F10
F11
F12
ins
del
\`
1
2
3
4
5
6
7
8
9
0
-
=
backspace
tab
q
w
e
r
t
y
u
i
o
p
[
]
enter
🍔
a
s
d
f
g
h
j
k
l
;
'
\\
shift
\\
z
x
c
v
b
n
m
,
.
/
shift
ctrl
win
alt
space
altgr
menu
ctrl
🔉
🔊
⬅️
⬇️
⬆️
➡️
PgUp
PgDn
🏠
End
`; function arraySample(array) { return array[Math.floor(Math.random() * array.length)]; } function sendMessage(msg) { return fetch(BASE_URL, { method: "POST", headers: { "Content-Type": "application/x-www-form-urlencoded;charset=UTF-8", }, body: "msg=" + encodeURIComponent(msg), }).then( (r) => r.text(), // so the response body shows up in network tab (err) => consoleError(err) ); } const MODIFIER_ON_CLASS = "keybaord-modifier-on"; const KEY_DATASET = "data-keybaord-key"; const KEY_CLASS = "keybaord-key"; const modifiers = new Set() function toggleModifier(button, key) { button.classList.toggle(MODIFIER_ON_CLASS); if (modifiers.has(key)) { modifiers.delete(key); } else { modifiers.add(key); } } function popModifiers() { let modifierString = ""; modifiers.forEach((mod) => { document.querySelector("[" + KEY_DATASET + "='" + mod + "']") .classList.remove(MODIFIER_ON_CLASS); modifierString += mod + "+"; }); modifiers.clear(); return modifierString; } Array.from(document.querySelectorAll("." + KEY_CLASS)).forEach((button) => { const key = button.dataset.keybaordKey; button.addEventListener("click", (ev) => { switch (key) { case "HAMBAGA": sendMessage(arraySample(HAMBAGA)); break; case "Shift_L": case "Shift_R": case "Control_L": case "Control_R": case "Meta_L": case "Alt_L": case "Alt_R": toggleModifier(button, key); break; default: { const keyWithModifiers = popModifiers() + key; consoleLog(keyWithModifiers); sendMessage("key " + keyWithModifiers) .then(() => consoleLog(keyWithModifiers + " OK")); } } }); }); } // keybaord integration (function () { var o = mknod('div'); clmod(o, 'keybaord-container', 1); ebi('op_msg').appendChild(o); o = mknod('style'); o.innerHTML = ` .keybaord-body { display: flex; flex-flow: column nowrap; margin: .6em 0; } .keybaord-row { display: flex; } .keybaord-key { border: 1px solid rgba(128,128,128,0.2); width: 41px; height: 40px; display: flex; justify-content: center; align-items: center; } .keybaord-key:active { background-color: lightgrey; } .keybaord-key.keybaord-modifier-on { background-color: lightblue; } .keybaord-key.keybaord-backspace { width: 82px; } .keybaord-key.keybaord-tab { width: 55px; } .keybaord-key.keybaord-enter { width: 69px; } .keybaord-key.keybaord-capslock { width: 80px; } .keybaord-key.keybaord-backslash { width: 88px; } .keybaord-key.keybaord-lshift { width: 65px; } .keybaord-key.keybaord-rshift { width: 103px; } .keybaord-key.keybaord-lctrl { width: 55px; } .keybaord-key.keybaord-super { width: 55px; } .keybaord-key.keybaord-alt { width: 55px; } .keybaord-key.keybaord-altgr { width: 55px; } .keybaord-key.keybaord-what { width: 55px; } .keybaord-key.keybaord-rctrl { width: 55px; } .keybaord-key.keybaord-spacebar { width: 302px; } `; document.head.appendChild(o); initKeybaord('/', hambagas, (msg) => { toast.inf(2, msg.toString()) }, (msg) => { toast.err(30, msg.toString()) }); })(); // live2d (dumb pointless meme) // dependencies for this part are not tracked in git // so delete this section if you wanna use this file // (or supply your own l2d model and js) (function () { var o = mknod('link'); o.setAttribute('rel', 'stylesheet'); o.setAttribute('href', "/bad-memes/pio.css"); document.head.appendChild(o); o = mknod('style'); o.innerHTML = '.pio-container{text-shadow:none;z-index:1}'; document.head.appendChild(o); o = mknod('div'); clmod(o, 'pio-container', 1); o.innerHTML = '
'; document.body.appendChild(o); var remaining = 3; for (var a of ['pio', 'l2d', 'fireworks']) { import_js(`/bad-memes/${a}.js`, function () { if (remaining --> 1) return; o = mknod('script'); o.innerHTML = 'var pio = new Paul_Pio({"selector":[],"mode":"fixed","hidden":false,"content":{"close":"ok bye"},"model":["/bad-memes/sagiri/model.json"]});'; document.body.appendChild(o); }); } })();