Building Spikes Codegolf
f =
n=>` ^
/|\\
/.|.\\
/..|..\\
___`.replace(/.[_|^]./g,'$&'.repeat(n))+'____'
// test it out
document.body.innerHTML +=
`<pre>${f(1)}
${f(3)}
${f(4)}`
Great codegolf stackexchange answer from user tsh
f =
n=>` ^
/|\\
/.|.\\
/..|..\\
___`.replace(/.[_|^]./g,'$&'.repeat(n))+'____'
// test it out
document.body.innerHTML +=
`<pre>${f(1)}
${f(3)}
${f(4)}`
Great codegolf stackexchange answer from user tsh
// "Being clever is not clever"
// -- Bjarne Stroustrup
D = document
ang = {
'|': 180,
'-': 90,
'\\': 135,
'/': 225
}
box = def => {
def = def.split(/\s+/)
form = def.length
I = i => parseInt(def[i], 16)
;[,,, _=>{x = y = I(0); w = h = I(1); c = def[2]},
_=>{x = I(0), y = I(1); w = h = I(2);c = def[3]},
_=>{x = I(0); y = I(1); w = I(2); h = I(3); c = def[4]}
][form]()
c = c.split``
ca = c[0]
ca = ca+ca+ca
cD = ang[c[1]]
cb = c[2]
cb = cb+cb+cb
D.body.appendChild(
D.createElement`div`
).style = `
position: absolute; left: ${x}px; top: ${y}px;
width: ${w}px; height: ${h}px;
background: linear-gradient(${cD}deg, #${ca}, #${cb})
`
}
const parse = prog => prog.trim()
.split(/\n+/m)
.map(line => box(line.trim()))
parse(`
0 64 0/f
64 64 0\\f
a0 f0 30 54 f\\0
0 6f 20 60 0-c
f 7f 20 60 0|c
1f 8f 30 30 c/0
`)
Just playing around… odd micro-gradient notation:
'0 64 0/f'
// x=0 y=0 width=0x64 height=0x64
// 0/f = gradient black to white top right to bottom left
'64 64 0\\f'
// x=0 y=0 width=0x64 height=0x64
// 0\\f = black to to white gradient top left to bottom right
'0 6f 20 60 0-c'
// x=0 y=0x6f width=0x20 height=0x60
// 0-c = gradient black to grey (#ccc) left to right
// etc... ( | ) is top to bottom grad
<pre id=p style=background:#000><svg onload='setInterval(f=n=>
{for(t++,o=i=1;i++<476;o+=i%30?([(f+"")[i%195],"o"][c=0|(h=v=>
(M=Math).hypot(i/30-8+3*M.sin(t/8/v),i%30/2-7+4*M.cos(t/9/v)))
(7)*h(9)*h(6)/52]||".").fontcolor(c?c>2:n):"\n");p.innerHTML=o},t=1)'>
Great golfed snippet from Martin Kleppe – can’t wait to fork it… 😀
This was updated a bit later to be even smaller:
<body onload='setInterval(f=n=>{for(t++,o=i=1;i++<476;o+=i%30?([(f+f)[i],"o"][c=0|(h=v=>(M=Math).hypot(i/30-7+3*M.sin(t/8/v),i%30/2-7+4*M.cos(t/9/v)))(7)*h(9)*h(6)/52]||".").fontcolor(c?c>2:n):"\n");p.innerHTML=o},t=1)'bgcolor=X><pre id=p>
x='hello'
x.replace(/h/g,'') // 17 bytes
x.split`h`.join`` // 16 bytes
x.replaceAll('h','') // 19 bytes
Another fun one from the great javascript golfing tips stackexchange thread.
This one comes from user emanresu-a and this answer.
N = 8 // try changing this
b = document.body
b.innerHTML += 'Drag any slider<br>'
for (i = N; i--;)
b.innerHTML += `<input id=${i} value=0 type=range style=width:200px;display:block>`
onchange = oninput = e => {
t = e.target
for (i = N; i--;)
t.id != i && (
self[i].value = 100 * Math.sin(t.value / 60 * i))
}
Sine wave with range sliders…