mirror of
https://github.com/lalbornoz/roar.git
synced 2024-11-23 07:36:37 +00:00
238 lines
3.8 KiB
Plaintext
238 lines
3.8 KiB
Plaintext
CANVAS SHADERS
|
|
==============
|
|
|
|
These shaders were written to work on areas of canvas.
|
|
Make sure "canvas" is selected and "animate" is checked.
|
|
|
|
|
|
>> original shader..
|
|
|
|
lex.bg = hue((x+y*y+t/10)/20)
|
|
lex.fg = (x+y)%16
|
|
lex.char = (y%2) ? ":" : "%"
|
|
|
|
|
|
|
|
>> energy ball ascii shader
|
|
|
|
d = dist(x/2+w/4, y, w/2, h/2)
|
|
an = angle(x/2+w/4, y, w/2,h/2)+t/4200
|
|
r=10.2
|
|
|
|
if (d < r) lex.bg = randint(r)
|
|
|
|
ll=abs(an|0)+""
|
|
lex.char=ll[ll.length-1]
|
|
|
|
if (d > r) {
|
|
lex.bg = randint(d)
|
|
lex.fg = randint(d)
|
|
lex.char = ll[ll.length-2]
|
|
}
|
|
|
|
|
|
|
|
>> drifting fire
|
|
|
|
t += sin(x/1000)*100000
|
|
pos = y/h*6 + sin(x*3) - cos(y*t/10000-10)
|
|
pos = clamp(pos, 0, 6)
|
|
lex.bg = hue(pos)
|
|
|
|
|
|
|
|
>> the "bJoel56" shader
|
|
|
|
yy=y
|
|
x-=w/2
|
|
y-=h/2
|
|
|
|
lex.bg = blue(yy/h+random())
|
|
lex.fg = green(yy/h*4 + sin(x/100+random()/2)) // hue(t/1000)|0;
|
|
|
|
var abcd=".'~:;!>+=icjtJYSGSXDQKHNWM";
|
|
function chara (aa,n) { return aa[clamp(n*aa.length, 0, aa.length)|0] }
|
|
lex.char = chara(abcd, y/h*(5/3 + tan(x/100)+random()/1))
|
|
|
|
|
|
|
|
>> frog shader v2
|
|
|
|
t/=-100
|
|
d = sinp( (dist(x/2+w/4, y, w/2, h/2) + t)/2 ) * 10
|
|
|
|
lex.char=',./>"ASE$#'[(floor(d))]
|
|
lex.fg = [1,3,9][floor(d*3)%3]
|
|
lex.bg=1
|
|
|
|
|
|
|
|
>> frog shader v3
|
|
|
|
// set period to like 0.2 for a normal circle
|
|
period = y/10
|
|
|
|
t/=-100
|
|
d = sinp( (dist(x/2+w/4, y, w/2, h/2) + t) * period )
|
|
dd = d * 10.5
|
|
d3 = dd < 8 ? 0 : 1
|
|
|
|
lex.char=' .,"+/>OXEN'[(floor(dd))]
|
|
lex.fg = [3,9][floor(d3)]
|
|
lex.bg=1
|
|
|
|
|
|
|
|
>> spaceships
|
|
|
|
many cool shaders are possible with this technique.. changing the char
|
|
gradient (lex.char=...) etc. i love how the dots move on v4.
|
|
|
|
this is a variation that looks like a bunch of ships flying across the screen.
|
|
has a really cool 3d look to it cuz the rows move at different speeds.
|
|
|
|
period = sin(y)
|
|
|
|
t/=-100
|
|
d = sinp( (dist(x/2+w/4, y, w/2, h/2) + t) * period )
|
|
dd = d * 10.5
|
|
d3 = dd < 8 ? 0 : 1
|
|
|
|
lex.char=' .,"+/>\^+'[(floor(dd))]
|
|
lex.fg = [3,9][floor(d3)]
|
|
lex.bg=1
|
|
|
|
|
|
|
|
>> concentric circles with a wavy "sunburst" pattern going around them
|
|
|
|
x -= w/2
|
|
y -= h/2
|
|
|
|
x /= h
|
|
y /= h/2 + 2
|
|
|
|
r = dist(x,y,0,0)
|
|
ang = angle(x,y,0,0)
|
|
|
|
if (r < 0.6) {
|
|
if (abs(mod(sin((r*t)/100000000000) + ang*18,TWO_PI)) < 2)
|
|
lex.bg = 12
|
|
else
|
|
lex.bg = 5
|
|
}
|
|
else if (r < 0.65)
|
|
lex.bg = 4
|
|
else if (abs(mod(sin((r*t)/100000000000) + ang*18,TWO_PI)) < 2)
|
|
lex.bg = 7
|
|
else
|
|
lex.bg = 8
|
|
|
|
|
|
|
|
>> slash-based interference patterns
|
|
|
|
if (x > h*2) x=h-x
|
|
y-=h/2
|
|
t/=2000
|
|
|
|
if (sin(x-y*t) > 0) {
|
|
lex.bg=1
|
|
lex.fg=4
|
|
lex.char= Math.floor(x-y*10001+t)%2 ? '\/' : '\\'
|
|
}
|
|
else {
|
|
lex.bg=1
|
|
lex.fg=9
|
|
lex.char= Math.floor(3*x+y+t)%2 ? '\\' : ' '
|
|
}
|
|
|
|
|
|
|
|
>> sparkling stars
|
|
|
|
if (lex.char != " ") {
|
|
lex.fg =floor( Math.random()*10 )
|
|
var az="Xx+*"
|
|
lex.char=az[floor(az.indexOf(lex.char)+ t/10000000 +Math.random())%az.length]
|
|
}
|
|
|
|
|
|
|
|
>> coogi x/y doodle
|
|
|
|
xx=x
|
|
t/=1000
|
|
x/=w/2
|
|
y/=h/2
|
|
y-=1
|
|
x-=1
|
|
x*=x-sin(y/t)
|
|
y*=1
|
|
|
|
lex.bg = 1 // gray( sin(x/(y/3-1)+t) + sin(y/4+t) )
|
|
lex.fg = hue( sin((y/5)+t) - cos(x*t) *5 )
|
|
lex.char = " _.,:;\"~| "[Math.round(xx*(y+1+(x+t/102)/4)*13)%13]
|
|
|
|
|
|
|
|
>> glitch shader - produces odd combinations of fg/bg
|
|
|
|
lex.char=String.fromCharCode(lex.char.charCodeAt(0)+1)
|
|
lex.bg+=7
|
|
lex.fg+=5
|
|
|
|
|
|
|
|
>> dots / lines shader
|
|
|
|
xx = ((t/10*x)*y/10)%8
|
|
lex.bg = colors.black
|
|
lex.fg = green(x*3+y*5)
|
|
lex.char = ((xx%1) !== 0) ? " " : " .,;=+!@"[xx]
|
|
|
|
|
|
|
|
>> munching squares horizon
|
|
|
|
t/=100
|
|
y+=10
|
|
x-=w/2
|
|
x/=y/10
|
|
lex.bg=hue((x^y)+t)
|
|
|
|
|
|
|
|
>> grayscale vertical interlacing
|
|
|
|
First, make a canvas that's totally white.
|
|
|
|
Run this shader:
|
|
|
|
if (lex.bg == 0) {
|
|
lex.bg = ((x)%2) ? 15 : 14
|
|
}
|
|
|
|
Then set your brush to a white square.
|
|
|
|
Run this shader w/ animate:
|
|
|
|
if (lex.bg == 0) {
|
|
lex.bg = ((x)%2) ? 0 : 1
|
|
}
|
|
|
|
|
|
|
|
>> nice purple/orange texture
|
|
|
|
lex.bg=colors.purple
|
|
lex.fg=colors.orange
|
|
x/=3
|
|
x=floor(x+y/2.1) // <- this is cool number to change
|
|
if (x+10*sin(x)+10*cos(y/(t%100)) < y/3) {
|
|
lex.char="abcdefghijklmnopqrstuvwxyz"[x%26]
|
|
} else {
|
|
lex.char="abcdefghijklmnopqrstuvwxyz".toUpperCase()[x%26]
|
|
}
|
|
|