mirror of
https://github.com/lalbornoz/roar.git
synced 2024-11-25 08:36:38 +00:00
asciiblaster-cordoba/platforms/android/app/src/main/assets/www/assets/: WHO HATES APACHE _CÓRDOBA_?!?!?!
asciiblaster-cordoba/platforms/android/app/src/main/assets/www/assets/: WE HATE APACHE _CÓRDOBA_!"!$"*$%"&(!£*
This commit is contained in:
Lucio Andrés Illanes Albornoz
parent
dc45d81361
commit
e1d338d6c3
@ -105,7 +105,6 @@ body.loading { opacity: 0; }
|
|||||||
body { transition: 0.1s linear; }
|
body { transition: 0.1s linear; }
|
||||||
#import_textarea { font-size: 9pt; }
|
#import_textarea { font-size: 9pt; }
|
||||||
textarea { font-size:12pt; width: 37vw; height: 300px; background: #333; color: #0f0; border: 0; font-family: 'FixedsysExcelsior301Regular'; outline: 0; border: 1px solid #333; background:#010;}
|
textarea { font-size:12pt; width: 37vw; height: 300px; background: #333; color: #0f0; border: 0; font-family: 'FixedsysExcelsior301Regular'; outline: 0; border: 1px solid #333; background:#010;}
|
||||||
#shader_rapper { display: none; }
|
|
||||||
#import_rapper { display: none; }
|
#import_rapper { display: none; }
|
||||||
#canvas_rapper {
|
#canvas_rapper {
|
||||||
white-space: pre;
|
white-space: pre;
|
||||||
@ -132,11 +131,6 @@ textarea { font-size:12pt; width: 37vw; height: 300px; background: #333; color:
|
|||||||
#secret_rapper span { float: left; }
|
#secret_rapper span { float: left; }
|
||||||
.vertical #secret_rapper { margin-right: 10px; }
|
.vertical #secret_rapper { margin-right: 10px; }
|
||||||
.vertical #secret_rapper span { float: left; clear: both; }
|
.vertical #secret_rapper span { float: left; clear: both; }
|
||||||
.nopaint #brush_rapper { min-height: 70px; min-width: 50px; }
|
|
||||||
|
|
||||||
#nopaint_rapper.hidden {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.rotated #canvas_rapper {
|
.rotated #canvas_rapper {
|
||||||
transform: translateX(-50%) translateY(-50%) translateZ(0) rotate(-90deg);
|
transform: translateX(-50%) translateY(-50%) translateZ(0) rotate(-90deg);
|
||||||
@ -199,7 +193,6 @@ textarea { font-size:12pt; width: 37vw; height: 300px; background: #333; color:
|
|||||||
100% { color: hsl(360,100%,50%) }
|
100% { color: hsl(360,100%,50%) }
|
||||||
}
|
}
|
||||||
|
|
||||||
.panke #shader_el,
|
|
||||||
.panke #load_el,
|
.panke #load_el,
|
||||||
.panke #import_textarea,
|
.panke #import_textarea,
|
||||||
.panke #doc_el,
|
.panke #doc_el,
|
||||||
|
|||||||
@ -22,14 +22,6 @@ features of the asdf.us color code tool:
|
|||||||
|
|
||||||
* <a href="tips.txt">tips.txt</a> - Tips on using the keyboard
|
* <a href="tips.txt">tips.txt</a> - Tips on using the keyboard
|
||||||
* <a href="irssi.txt">irssi.txt</a> - Instructions on using IRSSI to make color codes.
|
* <a href="irssi.txt">irssi.txt</a> - Instructions on using IRSSI to make color codes.
|
||||||
* <a href="nopaint.txt">nopaint.txt</a> - A guide to "No Paint"
|
|
||||||
|
|
||||||
Documents on Shaders
|
|
||||||
|
|
||||||
* <a href="shadetut.txt">shadetut.txt</a> - A brief tutorial on ASCII shaders.
|
|
||||||
* <a href="shaders/brush.txt">shaders/brush.txt</a> - Shaders designed to work on the brush
|
|
||||||
* <a href="shaders/canvas.txt">shaders/canvas.txt</a> - Shaders designed to work on the canvas
|
|
||||||
* <a href="shaders/util.txt">shaders/util.txt</a> - Miscellaneous utilities / snippets
|
|
||||||
|
|
||||||
For more information on IRC, Color Codes, and much more, visit the
|
For more information on IRC, Color Codes, and much more, visit the
|
||||||
<a href="http://jollo.org/LNT/doc/">documentation sitemap</a>, part of the <a href="http://jollo.org/">Jollo IRC Network</a>.
|
<a href="http://jollo.org/LNT/doc/">documentation sitemap</a>, part of the <a href="http://jollo.org/">Jollo IRC Network</a>.
|
||||||
|
|||||||
@ -1,58 +0,0 @@
|
|||||||
|
|
||||||
"" 88
|
|
||||||
9,88m, ,8888, 9,88m, ,888, mm 9,88m, 8888
|
|
||||||
88 88 86 98 88 88 ,mm88 88 88 88 88
|
|
||||||
88 88 '8888' 88888' "nn89 88 88 88 "8m
|
|
||||||
88 a brief tutorial :)
|
|
||||||
|
|
||||||
Last month or so I encountered Jeffrey Scudder's tool 'No Paint' -
|
|
||||||
|
|
||||||
https://www.nopaint.org/
|
|
||||||
|
|
||||||
- an automatic drawing tool with a minimal interface: you control it using
|
|
||||||
just two buttons. The No Paint tool provided much entertainment on #sally,
|
|
||||||
so during some downtime I added similar functionality to the asdf.us/ascii
|
|
||||||
tool. Under the brush, you should see two buttons - to kick it off, click
|
|
||||||
'paint' and it will begin drawing.
|
|
||||||
|
|
||||||
If you don't like what it's doing, click 'no' -
|
|
||||||
- this will remove the current line and start drawing a new line.
|
|
||||||
|
|
||||||
If you like what it's doing, click 'paint' -
|
|
||||||
- the line will be applied to the canvas, and it will start drawing anew.
|
|
||||||
|
|
||||||
While it's going, you can also click 'pause' and it will stop, so you can
|
|
||||||
save it or draw on it yourself.
|
|
||||||
|
|
||||||
|
|
||||||
Keyboard shortcuts -
|
|
||||||
|
|
||||||
left arrow - 'no'
|
|
||||||
right arrow - 'paint'
|
|
||||||
down arrow - 'pause'
|
|
||||||
|
|
||||||
|
|
||||||
Right-click toggles -
|
|
||||||
|
|
||||||
If you RIGHT-CLICK on "Paint" it will switch tools automatically.
|
|
||||||
|
|
||||||
If you RIGHT-CLICK on "No" it will engage TURBO MODE.
|
|
||||||
|
|
||||||
|
|
||||||
Some tools currently implemented -
|
|
||||||
|
|
||||||
- solid brush
|
|
||||||
- erase brush
|
|
||||||
- color-changing brush
|
|
||||||
- hue brush
|
|
||||||
- letter brush
|
|
||||||
- clone tool
|
|
||||||
- smear tool
|
|
||||||
- fill tool
|
|
||||||
- stars brush
|
|
||||||
- canvas slide
|
|
||||||
- canvas scale
|
|
||||||
- canvas rotate
|
|
||||||
- canvas colorcycle
|
|
||||||
|
|
||||||
|
|
||||||
@ -1,126 +0,0 @@
|
|||||||
BRUSH SHADERS
|
|
||||||
=============
|
|
||||||
|
|
||||||
Unless noted, these shaders were written to work on the brush itself.
|
|
||||||
Make sure "brush" is selected and "animate" is checked.
|
|
||||||
|
|
||||||
|
|
||||||
>> distressed texture brush
|
|
||||||
|
|
||||||
Sample use of the "choice" function to get a random color.
|
|
||||||
|
|
||||||
var char = choice(" abcdef ")
|
|
||||||
lex.bg = +choice("0124")
|
|
||||||
lex.fg = +choice("01234")
|
|
||||||
lex.char = char
|
|
||||||
lex.opacity = char == " " ? 0 : 1
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
>> foggy terrain brush
|
|
||||||
|
|
||||||
var char = choice(" abcdef ")
|
|
||||||
lex.bg = choice([14,15])
|
|
||||||
lex.fg = choice("367")
|
|
||||||
lex.char = char
|
|
||||||
lex.opacity = char == " " ? 0 : 1
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
>> mirror brush (left-right)
|
|
||||||
|
|
||||||
NOTE: Animate this on the canvas, then draw:
|
|
||||||
|
|
||||||
if (x > w/2) {
|
|
||||||
lex.assign( canvas.aa[y][w-x] )
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
>> mirror brush (up-down)
|
|
||||||
|
|
||||||
NOTE: Animate this on the canvas, then draw:
|
|
||||||
|
|
||||||
if (x > h/2) {
|
|
||||||
lex.assign( canvas.aa[h-y][x] )
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
>> rainbow stardust brush
|
|
||||||
|
|
||||||
Uncheck BG and animate this to brush:
|
|
||||||
|
|
||||||
lex.fg = hue(t)
|
|
||||||
lex.char = choice(" ,'.,.','****** ")
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
>> noise brushes, works on a black background:
|
|
||||||
|
|
||||||
lex.bg = max(5, yellow(randint(t)))
|
|
||||||
lex.opacity = lex.bg == colors.black ? 0 : 1
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
>> simple rainbow:
|
|
||||||
|
|
||||||
if (lex.bg != 1) lex.bg = randint(t)
|
|
||||||
lex.opacity = lex.bg == colors.black ? 0 : 1
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
>> self-erasing:
|
|
||||||
|
|
||||||
if (lex.bg != 1) lex.bg = yellow(randint(t))
|
|
||||||
lex.opacity = lex.bg == colors.black ? 0 : 1
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
>> cycling rainbow brush
|
|
||||||
|
|
||||||
if (lex.bg != 1) lex.bg = hue( all_color_hue_order.indexOf( color_names[ lex.bg ] ) + 1 )
|
|
||||||
lex.opacity = lex.bg == colors.black ? 0 : 1
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
>> "stars" brush.. set your brush to paint just the character "#"
|
|
||||||
|
|
||||||
if (lex.char == "#") {
|
|
||||||
lex.fg = hue(randint(15))
|
|
||||||
lex.char = random() > 0.1 ? " " : "+@*.,\"+'*-"[randint(10)]
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
>> use fg char to mask mask what you're drawing on the bg
|
|
||||||
|
|
||||||
if (lex.char != "/") { lex.bg = 1 }
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
>> sharded glitch brush
|
|
||||||
|
|
||||||
Example: http://asdf.us/z/kksnvs.png
|
|
||||||
|
|
||||||
Use on a brush:
|
|
||||||
|
|
||||||
lex.bg = t/y/x
|
|
||||||
lex.opacity = lex.bg % 1 ? 0 : 1
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
>> incremental brush
|
|
||||||
|
|
||||||
Set your brush to be the ^ character, square, about 10x10
|
|
||||||
Draw "char" only
|
|
||||||
Then animate this shader on the canvas:
|
|
||||||
|
|
||||||
if (lex.char=="^") {
|
|
||||||
lex.bg += 1
|
|
||||||
lex.char = " "
|
|
||||||
}
|
|
||||||
lex.bg += 1
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
@ -1,237 +0,0 @@
|
|||||||
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]
|
|
||||||
}
|
|
||||||
|
|
||||||
@ -1,38 +0,0 @@
|
|||||||
SHADER UTILITIES
|
|
||||||
================
|
|
||||||
|
|
||||||
These are little snippets which may be useful in writing your own shaders.
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
>> basic way to slow the frame rate of a shader.
|
|
||||||
|
|
||||||
window.zz=window.zz||0
|
|
||||||
if(!(x+y)) zz++
|
|
||||||
if (lex.bg != 1 && !(zz % 4)) {
|
|
||||||
...
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
>> handy for brushes - use color to mask brush shape
|
|
||||||
|
|
||||||
lex.opacity = lex.bg == colors.black ? 0 : 1
|
|
||||||
|
|
||||||
|
|
||||||
Tip: Set to "animate brush", then use option+shift (alt+shift) to
|
|
||||||
copy color from the canvas. Brush will have the "shape" of the
|
|
||||||
copied color only. Can be a cool effect when used with fg/bg only.
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
>> copy color from canvas at x/y
|
|
||||||
|
|
||||||
lex.assign( canvas.get(x,y) )
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
>> animate canvas up and to the left..
|
|
||||||
|
|
||||||
lex.assign( canvas.get(x+1,y+1) )
|
|
||||||
|
|
||||||
|
|
||||||
@ -1,156 +0,0 @@
|
|||||||
ASCII SHADER TUTORIAL
|
|
||||||
=====================
|
|
||||||
|
|
||||||
In the asdf.us/ascii shaders, you write a little math function that executes on every
|
|
||||||
pixel on the selected area. The shaders can affect either the brush, the selected region,
|
|
||||||
or the whole canvas.
|
|
||||||
|
|
||||||
Shaders can also be animated, so they update live. With a shader applied to the brush,
|
|
||||||
the brush changes continuously as you draw.
|
|
||||||
|
|
||||||
|
|
||||||
THE LEX OBJECT
|
|
||||||
==============
|
|
||||||
|
|
||||||
Essentially you are writing a Javascript function that modifies this "lex" object, which
|
|
||||||
has four properties
|
|
||||||
|
|
||||||
1) lex.bg = this is the background color
|
|
||||||
2) lex.fg = this is the foreground color (text color)
|
|
||||||
3) lex.char = this is the letter that you see in the space
|
|
||||||
4) lex.opacity = this is whether the pixel actually draws or not
|
|
||||||
- so like a circular brush is opacity 1 in the middle and opacity 0 on the corners
|
|
||||||
|
|
||||||
|
|
||||||
THE COLOR CODE NUMBERS
|
|
||||||
======================
|
|
||||||
|
|
||||||
With lex.bg and lex.fg, the goal is to have a number between 0 and 15, corresponding to
|
|
||||||
the color code values from mIRC.
|
|
||||||
|
|
||||||
If you shift-click on the color palette, you can cycle it around to the one which shows
|
|
||||||
the actual order of the mIRC colors.
|
|
||||||
|
|
||||||
The mIRC colors are the ones that go white, black, dark blue, green, red, dark red ...
|
|
||||||
and these correspond to the numbers 0, 1, 2, 3, 4 ...
|
|
||||||
|
|
||||||
|
|
||||||
COLOR CYCLING
|
|
||||||
=============
|
|
||||||
|
|
||||||
Additionally there are some color functions that might help -
|
|
||||||
These functions make it easier to cycle through colors in a way that makes sense logically
|
|
||||||
(since the mIRC colors are in a weird order)
|
|
||||||
|
|
||||||
- hue(...) = this creates a cycle of colors in terms of their hue or color name,
|
|
||||||
so you get a rainbow that goes from dark red through yellow, green, blue,
|
|
||||||
purple, and back
|
|
||||||
- gray(...) = cycles through grayscale
|
|
||||||
- red(...) yellow(...) green(...) blue(...) purple(...) = use smaller palettes
|
|
||||||
- inv_hue(...) fire(...) dark_gray(...) = these are oddities i made for fun
|
|
||||||
|
|
||||||
|
|
||||||
VARIABLES
|
|
||||||
=========
|
|
||||||
|
|
||||||
Variables you have at your disposal are similar to the asdf.us/shader tool -
|
|
||||||
|
|
||||||
- x, y = the coordinates of the pixel
|
|
||||||
- mouse.x, mouse.y = the coordinate of the mouse as it hovers over the canvas
|
|
||||||
- t = the current time, in milliseconds
|
|
||||||
|
|
||||||
TIP: The time will increase very quickly - it's good to add t /= 1000 at the top of
|
|
||||||
your shader so it goes slowly (and won't cause a seizure).
|
|
||||||
|
|
||||||
|
|
||||||
FUNCTIONS
|
|
||||||
=========
|
|
||||||
|
|
||||||
Remember, this is Javascript. You have the basic operators:
|
|
||||||
|
|
||||||
+ - / *
|
|
||||||
|
|
||||||
And the bitwise operators:
|
|
||||||
|
|
||||||
& | ^ ~
|
|
||||||
|
|
||||||
You can do if statements with the standard comparison operators:
|
|
||||||
|
|
||||||
< > == <= >=
|
|
||||||
|
|
||||||
You also have access to all the functions on the Math object:
|
|
||||||
|
|
||||||
floor, ceil, round
|
|
||||||
abs, sign, mod(n,m), xor
|
|
||||||
pow, exp, sqrt
|
|
||||||
cos, sin, tan
|
|
||||||
acos, asin, atan, atan2
|
|
||||||
random() rand(n) randint(n) randrange(a,b)
|
|
||||||
E, PI, PHI
|
|
||||||
|
|
||||||
And some utility functions which might help:
|
|
||||||
|
|
||||||
clamp(n,min,max)
|
|
||||||
mix(n,a,b) (lerp)
|
|
||||||
step(a,b)
|
|
||||||
smoothstep(min,max,n)
|
|
||||||
avg(m,n,a)
|
|
||||||
cosp, sinp (mapped to [0,1])
|
|
||||||
pixel(x,y) == 4*(y*w+h)
|
|
||||||
dist(x,y,a,b)
|
|
||||||
angle(x,y,a,b)
|
|
||||||
choice(array)
|
|
||||||
deg(radians), rad(degrees)
|
|
||||||
|
|
||||||
|
|
||||||
BEYOND BASIC COLORS
|
|
||||||
===================
|
|
||||||
|
|
||||||
Other weird effects are possible if you combine these color functions.
|
|
||||||
|
|
||||||
For instance, if you do hue(x+y) you'll get a rainbow. But remember, this is just
|
|
||||||
outputting a number between 0 and 15. So you can do hue(x+y) + 1 and get a different
|
|
||||||
cycle which does not really have anything to do with the rainbow, but looks cool.
|
|
||||||
|
|
||||||
|
|
||||||
HOW DRAWING WORKS IN THE ASCII TOOL
|
|
||||||
===================================
|
|
||||||
|
|
||||||
When you click and drag to draw a line, your mouse produces a series of points which
|
|
||||||
describe the line you tried to draw. But these points do not necessarily make a
|
|
||||||
continuous line - more like a series of dots, which it then draw lines between to make
|
|
||||||
a "line" or "brush stroke".
|
|
||||||
|
|
||||||
A line between two points is made by stamping the brush at regular intervals between the
|
|
||||||
points which, with these brushes, ends up filling the space in between so it looks like
|
|
||||||
you drew a continuous line.
|
|
||||||
|
|
||||||
This is why when you draw a line with a big brush, it smears the outer edges.. The stamps
|
|
||||||
happen right next to each other, so you wind up seeing mostly brush edges.
|
|
||||||
|
|
||||||
You can visualize this effect with the following shader:
|
|
||||||
|
|
||||||
lex.bg = mouse.x + mouse.y
|
|
||||||
|
|
||||||
Drawing strokes quickly, or slowly.
|
|
||||||
Make sure to make it animate to brush.
|
|
||||||
Results could look like this:
|
|
||||||
|
|
||||||
http://i.asdf.us/im/f9/1458658781640-ascii-bamboo.png
|
|
||||||
|
|
||||||
|
|
||||||
SAMPLE SHADERS
|
|
||||||
==============
|
|
||||||
|
|
||||||
You can see a list of example shaders here:
|
|
||||||
|
|
||||||
http://asdf.us/ascii/doc/shaderz.txt
|
|
||||||
|
|
||||||
If you make a cool shader and want to see it on the list, please get in touch!
|
|
||||||
You can find me on irc.jollo.org:9999 (ssl) in #sally, making color codes with my friends.
|
|
||||||
|
|
||||||
Thanks and have fun!
|
|
||||||
|
|
||||||
~ Bamboo, 22 Marzo 2016
|
|
||||||
|
|
||||||
|
|
||||||
@ -19,10 +19,6 @@ function init () {
|
|||||||
bind()
|
bind()
|
||||||
}
|
}
|
||||||
function build () {
|
function build () {
|
||||||
shader.init()
|
|
||||||
// shader.run(canvas)
|
|
||||||
shader.animate()
|
|
||||||
|
|
||||||
canvas.append(canvas_rapper)
|
canvas.append(canvas_rapper)
|
||||||
brush.append(brush_rapper)
|
brush.append(brush_rapper)
|
||||||
palette.append(palette_rapper)
|
palette.append(palette_rapper)
|
||||||
@ -30,7 +26,6 @@ function build () {
|
|||||||
letters.repaint("Basic Latin")
|
letters.repaint("Basic Latin")
|
||||||
|
|
||||||
controls.circle.focus()
|
controls.circle.focus()
|
||||||
// controls.shader.focus()
|
|
||||||
|
|
||||||
brush.bg = colors.red
|
brush.bg = colors.red
|
||||||
brush.generate()
|
brush.generate()
|
||||||
@ -50,13 +45,10 @@ function bind () {
|
|||||||
|
|
||||||
window.addEventListener('mouseup', function(e){
|
window.addEventListener('mouseup', function(e){
|
||||||
dragging = erasing = false
|
dragging = erasing = false
|
||||||
// if (current_filetool.name != 'shader' && current_filetool.name != 'load' && current_filetool.name != 'save' && is_desktop) {
|
|
||||||
// cursor_input.focus()
|
|
||||||
// }
|
|
||||||
|
|
||||||
var ae = document.activeElement
|
var ae = document.activeElement
|
||||||
|
|
||||||
if (ae !== shader_textarea && ae !== import_textarea) {
|
if (ae !== import_textarea) {
|
||||||
if (is_desktop) cursor_input.focus()
|
if (is_desktop) cursor_input.focus()
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -75,9 +67,9 @@ function bind () {
|
|||||||
})
|
})
|
||||||
|
|
||||||
window.addEventListener('mousedown', function(e){
|
window.addEventListener('mousedown', function(e){
|
||||||
// if (current_filetool.name != 'shader' && is_desktop) { cursor_input.focus() }
|
// if (is_desktop) { cursor_input.focus() }
|
||||||
})
|
})
|
||||||
|
|
||||||
document.addEventListener('DOMContentLoaded', function(){
|
document.addEventListener('DOMContentLoaded', function(){
|
||||||
if (is_desktop) { cursor_input.focus() }
|
if (is_desktop) { cursor_input.focus() }
|
||||||
document.body.classList.remove('loading')
|
document.body.classList.remove('loading')
|
||||||
|
|||||||
@ -1,896 +0,0 @@
|
|||||||
var nopaint = (function(){
|
|
||||||
|
|
||||||
controls.no = new Tool (nopaint_no_el)
|
|
||||||
controls.no.use = function(state){
|
|
||||||
undo.undo()
|
|
||||||
controls.paint.focus()
|
|
||||||
}
|
|
||||||
controls.no.context = function(e){
|
|
||||||
e.preventDefault()
|
|
||||||
nopaint.turbo()
|
|
||||||
}
|
|
||||||
|
|
||||||
controls.paint = new Tool (nopaint_paint_el)
|
|
||||||
controls.paint.use = function(state){
|
|
||||||
nopaint.paint()
|
|
||||||
nopaint_pause_el.classList.toggle("hidden", false)
|
|
||||||
focused = controls.paint.lex
|
|
||||||
}
|
|
||||||
controls.paint.context = function(e){
|
|
||||||
e.preventDefault()
|
|
||||||
nopaint.autoplay()
|
|
||||||
}
|
|
||||||
|
|
||||||
controls.nopaint_pause = new Tool (nopaint_pause_el)
|
|
||||||
controls.nopaint_pause.use = function(state){
|
|
||||||
// nopaint.pause()
|
|
||||||
nopaint.autoplay(false)
|
|
||||||
nopaint_pause_el.classList.toggle("hidden", true)
|
|
||||||
focused = canvas.aa[0][0]
|
|
||||||
}
|
|
||||||
|
|
||||||
// use own stepwise clock to drive tweens
|
|
||||||
oktween.raf = function(){}
|
|
||||||
|
|
||||||
var nopaint = {}
|
|
||||||
nopaint.debug = true
|
|
||||||
nopaint.delay = nopaint.normal_delay = 100
|
|
||||||
nopaint.turbo_delay = 0
|
|
||||||
nopaint.tool = null
|
|
||||||
nopaint.tools = {}
|
|
||||||
nopaint.keys = []
|
|
||||||
nopaint.weights = []
|
|
||||||
nopaint.step = 0
|
|
||||||
nopaint.time = 0
|
|
||||||
nopaint.timeout = false
|
|
||||||
nopaint.toggle = function(state){
|
|
||||||
var state = typeof state == "boolean" ? state : nopaint_rapper.classList.contains("hidden")
|
|
||||||
nopaint_rapper.classList.toggle("hidden", ! state)
|
|
||||||
nopaint_pause_el.classList.toggle("hidden", true)
|
|
||||||
document.body.classList.toggle("nopaint", state)
|
|
||||||
return state
|
|
||||||
}
|
|
||||||
nopaint.no = function(){
|
|
||||||
undo.undo()
|
|
||||||
nopaint.paint()
|
|
||||||
}
|
|
||||||
nopaint.raw_key = controls.paint.lex.raw_key = keys.left_right_key(function(n){
|
|
||||||
if (! nopaint.timeout) return
|
|
||||||
if (n < 0) nopaint.no()
|
|
||||||
else if (n > 0) nopaint.paint()
|
|
||||||
else nopaint.pause()
|
|
||||||
})
|
|
||||||
nopaint.pause = nopaint.blur = function(){
|
|
||||||
clearTimeout(nopaint.timeout)
|
|
||||||
nopaint.timeout = 0
|
|
||||||
nopaint.step = 0
|
|
||||||
}
|
|
||||||
nopaint.paint = function(){
|
|
||||||
var state = undo.new()
|
|
||||||
delete state.focus
|
|
||||||
nopaint.pause()
|
|
||||||
nopaint.switch_tool()
|
|
||||||
nopaint.go()
|
|
||||||
}
|
|
||||||
nopaint.go = function(){
|
|
||||||
nopaint.timeout = setTimeout(nopaint.go, nopaint.delay)
|
|
||||||
oktween.update(nopaint.time)
|
|
||||||
nopaint.tool.paint( nopaint.step )
|
|
||||||
nopaint.time += 1
|
|
||||||
nopaint.step += 1
|
|
||||||
}
|
|
||||||
nopaint.switch_tool = function(){
|
|
||||||
last_tool = nopaint.tool
|
|
||||||
last_tool && last_tool.finish()
|
|
||||||
nopaint.tool = nopaint.get_random_tool( last_tool )
|
|
||||||
nopaint.tool.start( last_tool )
|
|
||||||
nopaint.debug && console.log("> %s", nopaint.tool.type)
|
|
||||||
}
|
|
||||||
nopaint.add_tool = function(fn){
|
|
||||||
nopaint.tools[fn.type] = fn
|
|
||||||
}
|
|
||||||
nopaint.disable_all_tools = function(){
|
|
||||||
Object.keys(nopaint.tools).forEach(function(key){
|
|
||||||
nopaint.tools[key].disabled = true
|
|
||||||
})
|
|
||||||
}
|
|
||||||
nopaint.enable_tools = function(keys){
|
|
||||||
keys.forEach(function(key){
|
|
||||||
if (nopaint.tools[key]) nopaint.tools[key].disabled = false
|
|
||||||
})
|
|
||||||
}
|
|
||||||
nopaint.get_random_tool = function( last_tool ){
|
|
||||||
var n = rand( nopaint.sum )
|
|
||||||
for (var i = 0, _len = nopaint.weights.length; i < _len; i++) {
|
|
||||||
if (n < nopaint.weights[i] && (! last_tool || nopaint.keys[i] !== last_tool.key)) {
|
|
||||||
return nopaint.tools[ nopaint.keys[i] ]
|
|
||||||
}
|
|
||||||
}
|
|
||||||
return nopaint.tools[ choice(nopaint.keys) ]
|
|
||||||
}
|
|
||||||
nopaint.regenerate_weights = function(){
|
|
||||||
nopaint.sum = 0
|
|
||||||
nopaint.weights = []
|
|
||||||
nopaint.keys = Object.keys( nopaint.tools ).sort(function(a,b){
|
|
||||||
return nopaint.tools[b].opt.weight-nopaint.tools[a].opt.weight
|
|
||||||
}).filter(function(key){
|
|
||||||
return ! nopaint.tools[key].disabled
|
|
||||||
})
|
|
||||||
nopaint.keys.forEach(function(key){
|
|
||||||
nopaint.sum += nopaint.tools[key].opt.weight
|
|
||||||
nopaint.weights.push( nopaint.sum )
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
nopaint.is_turbo = false
|
|
||||||
nopaint.turbo = function(state){
|
|
||||||
nopaint.is_turbo = typeof state == "boolean" ? state : ! nopaint.is_turbo
|
|
||||||
nopaint.delay = nopaint.is_turbo ? nopaint.turbo_delay : nopaint.normal_delay
|
|
||||||
if (nopaint.is_turbo) {
|
|
||||||
nopaint_no_el.classList.add("locked")
|
|
||||||
}
|
|
||||||
else {
|
|
||||||
nopaint_no_el.classList.remove("locked")
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
nopaint.is_autoplay = false
|
|
||||||
nopaint.autoplay = function(state){
|
|
||||||
nopaint.is_autoplay = typeof state == "boolean" ? state : ! nopaint.is_autoplay
|
|
||||||
if (nopaint.is_autoplay) {
|
|
||||||
nopaint_paint_el.classList.add("locked")
|
|
||||||
if (! nopaint.player) {
|
|
||||||
nopaint.player = new RandomPlayer ()
|
|
||||||
}
|
|
||||||
if (! nopaint.timeout) nopaint.paint()
|
|
||||||
nopaint.player.play()
|
|
||||||
}
|
|
||||||
else {
|
|
||||||
nopaint_paint_el.classList.remove("locked")
|
|
||||||
nopaint.pause()
|
|
||||||
nopaint.player && nopaint.player.pause()
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
var NopaintPlayer = Model({
|
|
||||||
type: "player",
|
|
||||||
upload_png: false,
|
|
||||||
upload_interval: 100,
|
|
||||||
step: 0,
|
|
||||||
timeout: null,
|
|
||||||
delay: function(){
|
|
||||||
return nopaint.is_turbo ? randrange(150, 300) : randrange(400, 800)
|
|
||||||
},
|
|
||||||
reset: function(){
|
|
||||||
this.no_count = 0
|
|
||||||
this.paint_count = 0
|
|
||||||
},
|
|
||||||
pause: function(){
|
|
||||||
clearTimeout(this.timeout)
|
|
||||||
this.timeout = 0
|
|
||||||
},
|
|
||||||
play: function(){
|
|
||||||
clearTimeout(this.timeout)
|
|
||||||
var delay = this.delay()
|
|
||||||
this.timeout = setTimeout(this.play.bind(this), delay)
|
|
||||||
this.check_fitness()
|
|
||||||
this.step += 1
|
|
||||||
},
|
|
||||||
check_fitness: function(){
|
|
||||||
switch (this.fitness()) {
|
|
||||||
case "no":
|
|
||||||
nopaint.no_count += 1
|
|
||||||
nopaint.since_last_no = 0
|
|
||||||
nopaint.since_last_paint += 1
|
|
||||||
nopaint.no()
|
|
||||||
break
|
|
||||||
case "paint":
|
|
||||||
nopaint.paint_count += 1
|
|
||||||
nopaint.since_last_no += 1
|
|
||||||
nopaint.since_last_paint = 0
|
|
||||||
nopaint.paint()
|
|
||||||
break
|
|
||||||
case "screenshot":
|
|
||||||
if (this.save_as_png) break
|
|
||||||
console.log("uploading...")
|
|
||||||
setTimeout(clipboard.upload_png, 0)
|
|
||||||
// fall thru
|
|
||||||
default:
|
|
||||||
nopaint.since_last_no += 1
|
|
||||||
nopaint.since_last_paint += 1
|
|
||||||
break
|
|
||||||
}
|
|
||||||
},
|
|
||||||
fitness: function(){},
|
|
||||||
})
|
|
||||||
|
|
||||||
var RandomPlayer = NopaintPlayer.extend({
|
|
||||||
type: "random_player",
|
|
||||||
upload_png: false,
|
|
||||||
fitness: function(){
|
|
||||||
var no_prob = random()
|
|
||||||
var paint_prob = 1 - no_prob
|
|
||||||
if (paint_prob < 0.3) {
|
|
||||||
return "paint"
|
|
||||||
}
|
|
||||||
else if (no_prob < 0.5) {
|
|
||||||
return "no"
|
|
||||||
}
|
|
||||||
else if ( this.paint_count > 100 && (this.step % 100) == 99 ) {
|
|
||||||
return "screenshot"
|
|
||||||
}
|
|
||||||
}
|
|
||||||
})
|
|
||||||
|
|
||||||
var StylePlayer = NopaintPlayer.extend({
|
|
||||||
type: "style_player",
|
|
||||||
upload_png: false,
|
|
||||||
fitness: function(){
|
|
||||||
var no_prob = random()
|
|
||||||
var paint_prob = 1 - no_prob
|
|
||||||
var np, pp
|
|
||||||
var steps = this.since_last_paint
|
|
||||||
|
|
||||||
if (nopaint.tool.is_brush) {
|
|
||||||
if (nopaint.tool.is_clone) {
|
|
||||||
if (steps < randrange(3,8)) return
|
|
||||||
np = 0.3
|
|
||||||
pp = 0.4
|
|
||||||
}
|
|
||||||
else if (nopaint.tool.is_erase) {
|
|
||||||
if (steps < randrange(2,6)) return
|
|
||||||
np = 0.3
|
|
||||||
pp = 0.4
|
|
||||||
}
|
|
||||||
else {
|
|
||||||
if (steps < randrange(2,4)) return
|
|
||||||
np = 0.1
|
|
||||||
pp = 0.3
|
|
||||||
}
|
|
||||||
}
|
|
||||||
if (nopaint.tool.is_shader) {
|
|
||||||
switch (nopaint.tool.name) {
|
|
||||||
case "rotate":
|
|
||||||
case "scale":
|
|
||||||
if (steps < randrange(2,4)) return
|
|
||||||
np = 0.1
|
|
||||||
pp = 0.2
|
|
||||||
break
|
|
||||||
default:
|
|
||||||
np = 0.2
|
|
||||||
pp = 0.2
|
|
||||||
}
|
|
||||||
}
|
|
||||||
if (nopaint.tool.is_fill) {
|
|
||||||
np = 0.4
|
|
||||||
pp = 0.1
|
|
||||||
}
|
|
||||||
|
|
||||||
if (steps > 10) {
|
|
||||||
np *= 0.7
|
|
||||||
pp *= 1.5
|
|
||||||
|
|
||||||
if (nopaint.is_turbo) {
|
|
||||||
np *= 1.2
|
|
||||||
pp *= 1.2
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
if (paint_prob < np) {
|
|
||||||
return "paint"
|
|
||||||
}
|
|
||||||
else if (no_prob < np) {
|
|
||||||
return "no"
|
|
||||||
}
|
|
||||||
else if ( this.paint_count > 100 && (this.step % 100) == 99 ) {
|
|
||||||
return "screenshot"
|
|
||||||
}
|
|
||||||
}
|
|
||||||
})
|
|
||||||
|
|
||||||
/* Base models for brushes */
|
|
||||||
|
|
||||||
var NopaintTool = Model({
|
|
||||||
type: "none",
|
|
||||||
init: function(opt){
|
|
||||||
this.opt = opt || {}
|
|
||||||
},
|
|
||||||
start: function(){},
|
|
||||||
paint: function(t){},
|
|
||||||
update: function(t){},
|
|
||||||
finish: function(){},
|
|
||||||
})
|
|
||||||
|
|
||||||
var NopaintBrush = NopaintTool.extend({
|
|
||||||
type: "brush",
|
|
||||||
is_brush: true,
|
|
||||||
init: function(opt){
|
|
||||||
this.opt = opt || {}
|
|
||||||
this.opt.max_radius = this.opt.max_radius || 10
|
|
||||||
this.p = {x: randint(canvas.w), y: randint(canvas.h)}
|
|
||||||
this.fg = 0
|
|
||||||
this.bg = 1
|
|
||||||
this.char = " "
|
|
||||||
this.tweens = []
|
|
||||||
},
|
|
||||||
|
|
||||||
start: function(last_brush){
|
|
||||||
this.set_brush_mask()
|
|
||||||
this.toggle_channels()
|
|
||||||
this.reset( last_brush )
|
|
||||||
this.regenerate()
|
|
||||||
draw.down({}, null, [this.p.x, this.p.y])
|
|
||||||
},
|
|
||||||
|
|
||||||
paint: function(t){
|
|
||||||
this.update(t)
|
|
||||||
draw.move_toroidal({}, null, [this.p.x, this.p.y])
|
|
||||||
},
|
|
||||||
|
|
||||||
finish: function(){
|
|
||||||
this.tweens.forEach(function(t){ t.cancel() })
|
|
||||||
this.tweens = []
|
|
||||||
},
|
|
||||||
|
|
||||||
reorient: function(last_brush){
|
|
||||||
var a = {}, b
|
|
||||||
|
|
||||||
if (last_brush) {
|
|
||||||
this.p.x = a.x = randint(canvas.w)
|
|
||||||
this.p.y = a.y = randint(canvas.h)
|
|
||||||
}
|
|
||||||
else {
|
|
||||||
a.x = this.p.x
|
|
||||||
a.y = this.p.y
|
|
||||||
}
|
|
||||||
|
|
||||||
b = this.get_next_point()
|
|
||||||
|
|
||||||
var tween = oktween.add({
|
|
||||||
obj: this.p,
|
|
||||||
from: a,
|
|
||||||
to: b,
|
|
||||||
duration: b.duration,
|
|
||||||
easing: b.easing,
|
|
||||||
update: b.update,
|
|
||||||
finished: function(){
|
|
||||||
this.iterate()
|
|
||||||
this.regenerate()
|
|
||||||
}.bind(this)
|
|
||||||
})
|
|
||||||
this.tweens.push(tween)
|
|
||||||
},
|
|
||||||
|
|
||||||
get_next_point: function(){
|
|
||||||
var radius = randrange(2, this.opt.max_radius)
|
|
||||||
var b = {}
|
|
||||||
b.duration = randrange(1, 7)
|
|
||||||
b.easing = choice(easings)
|
|
||||||
b.x = this.p.x + randrange(-radius, radius)
|
|
||||||
b.y = this.p.y + randrange(-radius, radius)
|
|
||||||
return b
|
|
||||||
},
|
|
||||||
|
|
||||||
set_brush_mask: function(){
|
|
||||||
var r = Math.random()
|
|
||||||
if (r < 0.2) {
|
|
||||||
brush.mask = blit.square
|
|
||||||
}
|
|
||||||
else if (r < 0.6) {
|
|
||||||
brush.mask = blit.circle
|
|
||||||
}
|
|
||||||
else if (r < 0.9) {
|
|
||||||
brush.mask = blit.cross
|
|
||||||
}
|
|
||||||
else{
|
|
||||||
brush.mask = blit.inverted_cross
|
|
||||||
}
|
|
||||||
},
|
|
||||||
|
|
||||||
toggle_channels: function(){
|
|
||||||
if (Math.random() < 0.001) { controls.bg.use(false) }
|
|
||||||
else if (! brush.draw_bg && Math.random() < 0.25) { controls.bg.use(true) }
|
|
||||||
|
|
||||||
if (Math.random() < 0.1) { controls.fg.use(false) }
|
|
||||||
else if (! brush.draw_fg && Math.random() < 0.5) { controls.fg.use(true) }
|
|
||||||
|
|
||||||
if (Math.random() < 0.02) { controls.char.use(false) }
|
|
||||||
else if (! brush.draw_char && Math.random() < 0.2) { controls.char.use(true) }
|
|
||||||
},
|
|
||||||
|
|
||||||
iterate: function( last_brush ){
|
|
||||||
this.reorient( last_brush )
|
|
||||||
},
|
|
||||||
|
|
||||||
regenerate: function(){
|
|
||||||
brush.load( this )
|
|
||||||
brush.generate()
|
|
||||||
}
|
|
||||||
})
|
|
||||||
|
|
||||||
var easings = "linear circ_out circ_in circ_in_out quad_in quad_out quad_in_out".split(" ")
|
|
||||||
|
|
||||||
/* Standard brushes */
|
|
||||||
|
|
||||||
var SolidBrush = NopaintBrush.extend({
|
|
||||||
type: "solid",
|
|
||||||
|
|
||||||
recolor: function(){
|
|
||||||
this.fg = this.bg = randint(16)
|
|
||||||
this.char = " "
|
|
||||||
},
|
|
||||||
|
|
||||||
resize: function(m,n){
|
|
||||||
m = m || 3
|
|
||||||
n = n || 0
|
|
||||||
var bw = xrandrange(5, 0, m) + n
|
|
||||||
brush.resize( round(bw * randrange(0.9, 1.8)) || 1, round(bw) || 1 )
|
|
||||||
},
|
|
||||||
|
|
||||||
reset: function( last_brush ){
|
|
||||||
this.opt.max_radius = randrange(5,20)
|
|
||||||
this.resize()
|
|
||||||
this.reorient( last_brush )
|
|
||||||
this.recolor( last_brush )
|
|
||||||
this.regenerate()
|
|
||||||
},
|
|
||||||
|
|
||||||
iterate: function( last_brush ){
|
|
||||||
this.resize()
|
|
||||||
this.reorient( last_brush )
|
|
||||||
},
|
|
||||||
})
|
|
||||||
|
|
||||||
var EraseBrush = SolidBrush.extend({
|
|
||||||
type: "erase",
|
|
||||||
reset: function( last_brush ){
|
|
||||||
this.opt.max_radius = randrange(8, 20)
|
|
||||||
this.reorient( last_brush )
|
|
||||||
this.bg = random() < 0.2 ? colors.white : colors.black
|
|
||||||
this.char = " "
|
|
||||||
brush.load( this )
|
|
||||||
this.resize(3,2)
|
|
||||||
},
|
|
||||||
})
|
|
||||||
|
|
||||||
var ShadowBrush = NopaintBrush.extend({
|
|
||||||
type: "shadow",
|
|
||||||
pairs: [
|
|
||||||
[ colors.yellow, colors.orange ],
|
|
||||||
[ colors.orange, colors.darkred ],
|
|
||||||
[ colors.red, colors.darkred ],
|
|
||||||
[ colors.lime, colors.green ],
|
|
||||||
[ colors.cyan, colors.teal ],
|
|
||||||
[ colors.cyan, colors.blue ],
|
|
||||||
[ colors.blue, colors.darkblue ],
|
|
||||||
[ colors.magenta, colors.purple ],
|
|
||||||
[ colors.lightgray, colors.darkgray ],
|
|
||||||
[ colors.darkgray, colors.black ],
|
|
||||||
[ colors.white, colors.lightgray ],
|
|
||||||
[ colors.white, colors.black ],
|
|
||||||
],
|
|
||||||
shapes: [
|
|
||||||
[[0],[1]],
|
|
||||||
[[0,0],[1,1]],
|
|
||||||
[[1,0,0],[1,1,1]],
|
|
||||||
[[0,0,1],[1,1,1]],
|
|
||||||
[[0,0,0],[1,1,1]],
|
|
||||||
[[0,0,0,0],[1,1,1,1]],
|
|
||||||
[[1,0,0,0],[null,1,1,1]],
|
|
||||||
[[0,0,0,1],[1,1,1,null]],
|
|
||||||
[[0,0],[1,0],[1,1]],
|
|
||||||
[[0,0],[0,1],[1,1]],
|
|
||||||
],
|
|
||||||
reset: function( last_brush ){
|
|
||||||
var pair = choice(this.pairs)
|
|
||||||
var shape = choice(this.shapes)
|
|
||||||
this.reorient( last_brush )
|
|
||||||
brush.char = " "
|
|
||||||
brush.resize(shape[0].length, shape.length)
|
|
||||||
brush.generate()
|
|
||||||
brush.rebuild()
|
|
||||||
brush.forEach(function(lex,x,y){
|
|
||||||
if (shape[y][x] == null) {
|
|
||||||
lex.opacity = 0
|
|
||||||
}
|
|
||||||
else {
|
|
||||||
lex.fg = lex.bg = pair[ shape[y][x] ]
|
|
||||||
lex.opacity = 1
|
|
||||||
}
|
|
||||||
lex.build()
|
|
||||||
})
|
|
||||||
},
|
|
||||||
regenerate: function(){},
|
|
||||||
})
|
|
||||||
|
|
||||||
var RandomBrush = SolidBrush.extend({
|
|
||||||
type: "random",
|
|
||||||
iterate: function( last_brush ){
|
|
||||||
this.reorient( last_brush )
|
|
||||||
this.recolor( last_brush )
|
|
||||||
},
|
|
||||||
})
|
|
||||||
|
|
||||||
var HueBrush = SolidBrush.extend({
|
|
||||||
type: "hue",
|
|
||||||
recolor: function(){
|
|
||||||
this.fg = this.bg = rand_hue()
|
|
||||||
this.char = " "
|
|
||||||
},
|
|
||||||
})
|
|
||||||
|
|
||||||
var GrayBrush = SolidBrush.extend({
|
|
||||||
type: "gray",
|
|
||||||
recolor: function(){
|
|
||||||
this.fg = this.bg = rand_gray()
|
|
||||||
this.char = " "
|
|
||||||
},
|
|
||||||
})
|
|
||||||
|
|
||||||
var LetterBrush = SolidBrush.extend({
|
|
||||||
type: "letter",
|
|
||||||
recolor: function(){
|
|
||||||
this.fg = rand_hue()
|
|
||||||
this.bg = rand_hue()
|
|
||||||
this.char = choice( unicode.block(letters.charset, 32) )
|
|
||||||
},
|
|
||||||
})
|
|
||||||
|
|
||||||
var RandomLetterBrush = LetterBrush.extend({
|
|
||||||
type: "random-letter",
|
|
||||||
iterate: function(){
|
|
||||||
if (Math.random() < 0.01) {
|
|
||||||
this.fg += 1
|
|
||||||
}
|
|
||||||
if (Math.random() < 0.05) {
|
|
||||||
var n = this.fg
|
|
||||||
this.fg = this.bg
|
|
||||||
this.bg = n
|
|
||||||
}
|
|
||||||
if (Math.random() < 0.7) {
|
|
||||||
this.char = choice( unicode.block(letters.charset, 32) )
|
|
||||||
}
|
|
||||||
this.regenerate()
|
|
||||||
this.__iterate()
|
|
||||||
},
|
|
||||||
update: function(){
|
|
||||||
if (Math.random() < 0.3) {
|
|
||||||
this.char = choice( unicode.block(letters.charset, 32) )
|
|
||||||
}
|
|
||||||
this.regenerate()
|
|
||||||
},
|
|
||||||
})
|
|
||||||
|
|
||||||
var CloneBrush = SolidBrush.extend({
|
|
||||||
type: "clone",
|
|
||||||
|
|
||||||
is_clone: true,
|
|
||||||
|
|
||||||
reset: function( last_brush ){
|
|
||||||
this.opt.max_radius = randrange(5, 20)
|
|
||||||
this.reorient( last_brush )
|
|
||||||
this.resize(4,2)
|
|
||||||
this.clone_random_region()
|
|
||||||
},
|
|
||||||
|
|
||||||
clone_random_region: function(x, y){
|
|
||||||
var x = randrange(0, canvas.w - brush.w)
|
|
||||||
var y = randrange(0, canvas.h - brush.h)
|
|
||||||
this.clone_region(x, y)
|
|
||||||
},
|
|
||||||
|
|
||||||
clone_region: function(x, y){
|
|
||||||
blit.copy_toroidal_from(canvas, brush, round(x-brush.w/2), round(y-brush.h/2))
|
|
||||||
brush.mask(brush)
|
|
||||||
},
|
|
||||||
|
|
||||||
iterate: function( last_brush ){
|
|
||||||
this.reorient( last_brush )
|
|
||||||
},
|
|
||||||
|
|
||||||
regenerate: function(){},
|
|
||||||
})
|
|
||||||
|
|
||||||
var SmearBrush = CloneBrush.extend({
|
|
||||||
type: "smear",
|
|
||||||
|
|
||||||
update: function(){
|
|
||||||
var r = random()
|
|
||||||
var jitter_x = randnullsign() * xrand(2, 2)
|
|
||||||
var jitter_y = randnullsign() * xrand(2, 2)
|
|
||||||
this.clone_region( this.p.x + jitter_x, this.p.y + jitter_y )
|
|
||||||
},
|
|
||||||
|
|
||||||
iterate: function( last_brush ){
|
|
||||||
this.resize(4, 2)
|
|
||||||
this.update()
|
|
||||||
this.reorient( last_brush )
|
|
||||||
}
|
|
||||||
})
|
|
||||||
|
|
||||||
var StarsTool = NopaintBrush.extend({
|
|
||||||
type: "stars",
|
|
||||||
chars: "....,,'''*",
|
|
||||||
|
|
||||||
start: function(last_brush){
|
|
||||||
this.reorient( last_brush )
|
|
||||||
},
|
|
||||||
|
|
||||||
paint: function(t){
|
|
||||||
if (Math.random() < 0.5) {
|
|
||||||
var lex = canvas.get(this.p.x, this.p.y)
|
|
||||||
undo.save_lex(lex.x, lex.y, lex)
|
|
||||||
lex.fg = rand_hue()
|
|
||||||
// lex.bg = colors.black
|
|
||||||
lex.char = choice(this.chars)
|
|
||||||
lex.build()
|
|
||||||
}
|
|
||||||
},
|
|
||||||
})
|
|
||||||
|
|
||||||
/* Fill tool */
|
|
||||||
|
|
||||||
var FillTool = NopaintTool.extend({
|
|
||||||
type: "fill",
|
|
||||||
rate: 25,
|
|
||||||
is_fill: true,
|
|
||||||
start: function(){
|
|
||||||
this.fill()
|
|
||||||
},
|
|
||||||
paint: function(t){
|
|
||||||
if ((t % this.rate) == this.rate-1) {
|
|
||||||
this.fill()
|
|
||||||
}
|
|
||||||
},
|
|
||||||
recolor: function(){
|
|
||||||
this.fg = this.bg = randint(16)
|
|
||||||
this.char = " "
|
|
||||||
this.opacity = 1
|
|
||||||
},
|
|
||||||
fill: function(){
|
|
||||||
var x = randint(canvas.w)
|
|
||||||
var y = randint(canvas.h)
|
|
||||||
this.recolor()
|
|
||||||
draw.fill(this, x, y)
|
|
||||||
}
|
|
||||||
})
|
|
||||||
|
|
||||||
var FillLetterTool = FillTool.extend({
|
|
||||||
type: "fill-letter",
|
|
||||||
rate: 25,
|
|
||||||
recolor: function(){
|
|
||||||
this.fg = randint(16)
|
|
||||||
this.bg = randint(16)
|
|
||||||
this.char = choice( unicode.block(letters.charset, 32) )
|
|
||||||
this.opacity = 1
|
|
||||||
},
|
|
||||||
})
|
|
||||||
|
|
||||||
/* Shader Tools */
|
|
||||||
|
|
||||||
var ShaderTool = NopaintTool.extend({
|
|
||||||
type: "shader",
|
|
||||||
speed: 3,
|
|
||||||
is_shader: true,
|
|
||||||
is_recursive: false,
|
|
||||||
start: function(){
|
|
||||||
undo.save_rect(0, 0, canvas.w, canvas.h)
|
|
||||||
this.canvas = canvas.clone()
|
|
||||||
},
|
|
||||||
paint: function(t){
|
|
||||||
if ((t % this.speed) == 0) {
|
|
||||||
var w = canvas.w
|
|
||||||
var h = canvas.h
|
|
||||||
var lex
|
|
||||||
if (this.is_recursive) {
|
|
||||||
this.canvas.assign(canvas)
|
|
||||||
}
|
|
||||||
this.before_shade()
|
|
||||||
for (var x = 0; x < w; x++) {
|
|
||||||
for (var y = 0; y < h; y++) {
|
|
||||||
lex = canvas.get(x, y)
|
|
||||||
if (! this.shade( this.canvas, canvas, lex, x, y, w, h )) {
|
|
||||||
lex.build()
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
},
|
|
||||||
before_shade: function(){},
|
|
||||||
shade: function(src, dest, lex, x, y, w, h){},
|
|
||||||
finish: function(){
|
|
||||||
this.canvas.demolish()
|
|
||||||
}
|
|
||||||
})
|
|
||||||
|
|
||||||
var ColorizeTool = ShaderTool.extend({
|
|
||||||
type: "colorize",
|
|
||||||
fns: [mirc_color_reverse,hue,inv_hue,gray,fire,red,yellow,green,blue,purple,dark_gray],
|
|
||||||
speed: 5,
|
|
||||||
start: function(){
|
|
||||||
this.__start()
|
|
||||||
this.i = randint(this.fns.length)
|
|
||||||
},
|
|
||||||
before_shade: function(){
|
|
||||||
this.i = (this.i + 1) % this.fns.length
|
|
||||||
this.fn = this.fns[this.i]
|
|
||||||
},
|
|
||||||
shade: function(src, dest, lex, x, y, w, h){
|
|
||||||
lex.bg = this.fn( lex.bg )
|
|
||||||
return false
|
|
||||||
},
|
|
||||||
})
|
|
||||||
|
|
||||||
var TranslateTool = ShaderTool.extend({
|
|
||||||
type: "translate",
|
|
||||||
dx: 0,
|
|
||||||
dy: 0,
|
|
||||||
speed: 3,
|
|
||||||
start: function(){
|
|
||||||
this.__start()
|
|
||||||
this.dx = randint(3)-1
|
|
||||||
this.dy = randint(3)-1
|
|
||||||
this.x = this.y = 0
|
|
||||||
if (! this.dx && ! this.dy) {
|
|
||||||
this.dx = 1
|
|
||||||
this.dy = 0
|
|
||||||
}
|
|
||||||
},
|
|
||||||
before_shade: function(){
|
|
||||||
this.x += this.dx
|
|
||||||
this.y += this.dy
|
|
||||||
},
|
|
||||||
shade: function(src, dest, lex, x, y, w, h){
|
|
||||||
var copy = src.get(x+this.x, y+this.y)
|
|
||||||
lex.assign(copy)
|
|
||||||
return true
|
|
||||||
},
|
|
||||||
})
|
|
||||||
|
|
||||||
var SliceTool = ShaderTool.extend({
|
|
||||||
type: "slice",
|
|
||||||
dx: 0,
|
|
||||||
dy: 0,
|
|
||||||
speed: 1,
|
|
||||||
is_recursive: true,
|
|
||||||
start: function(){
|
|
||||||
this.__start()
|
|
||||||
this.is_y = Math.random() > 0.3
|
|
||||||
this.limit = this.is_y ? canvas.h : canvas.w
|
|
||||||
this.position = randint(this.limit)
|
|
||||||
this.direction = 1
|
|
||||||
},
|
|
||||||
before_shade: function(){
|
|
||||||
if (Math.random() < 0.6) {
|
|
||||||
this.position = mod(this.position + 1, this.limit)
|
|
||||||
}
|
|
||||||
if (Math.random() > 0.8) {
|
|
||||||
this.direction = randsign()
|
|
||||||
}
|
|
||||||
},
|
|
||||||
shade: function(src, dest, lex, x, y, w, h){
|
|
||||||
if (this.is_y) {
|
|
||||||
if (y >= this.position) {
|
|
||||||
var copy = src.get(x + this.direction, y)
|
|
||||||
lex.assign(copy)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
else if (x >= this.position) {
|
|
||||||
var copy = src.get(x, y + this.direction)
|
|
||||||
lex.assign(copy)
|
|
||||||
}
|
|
||||||
return true
|
|
||||||
},
|
|
||||||
})
|
|
||||||
|
|
||||||
var ScaleTool = ShaderTool.extend({
|
|
||||||
type: "scale",
|
|
||||||
scale: 1,
|
|
||||||
dscale: 0,
|
|
||||||
speed: 3,
|
|
||||||
start: function(){
|
|
||||||
this.__start()
|
|
||||||
var sign = randsign()
|
|
||||||
this.x_scale = 1
|
|
||||||
this.y_scale = 1
|
|
||||||
this.dx_scale = randsign() * randrange(0.0005, 0.01)
|
|
||||||
var r = Math.random()
|
|
||||||
if (r < 0.333) {
|
|
||||||
this.dy_scale = this.dx_scale * randrange(0.85, 1.25)
|
|
||||||
}
|
|
||||||
else if (r < 0.666) {
|
|
||||||
this.dy_scale = this.dx_scale
|
|
||||||
}
|
|
||||||
else {
|
|
||||||
this.dy_scale = randsign() * randrange(0.0005, 0.01)
|
|
||||||
}
|
|
||||||
},
|
|
||||||
before_shade: function(){
|
|
||||||
this.x_scale += this.dx_scale
|
|
||||||
this.y_scale += this.dy_scale
|
|
||||||
},
|
|
||||||
shade: function(src, dest, lex, x, y, w, h){
|
|
||||||
x = (x/w) * 2 - 1
|
|
||||||
y = (y/h) * 2 - 1
|
|
||||||
x *= this.x_scale
|
|
||||||
y *= this.y_scale
|
|
||||||
x = (x + 1) / 2 * w
|
|
||||||
y = (y + 1) / 2 * h
|
|
||||||
var copy = src.get(x, y)
|
|
||||||
lex.assign(copy)
|
|
||||||
return true
|
|
||||||
},
|
|
||||||
})
|
|
||||||
|
|
||||||
var RotateTool = ShaderTool.extend({
|
|
||||||
type: "rotate",
|
|
||||||
theta: 0,
|
|
||||||
d_theta: 0,
|
|
||||||
|
|
||||||
start: function(){
|
|
||||||
this.__start()
|
|
||||||
var sign = randsign()
|
|
||||||
this.theta = 0
|
|
||||||
this.d_theta = randsign() * randrange(0.001, 0.05)
|
|
||||||
},
|
|
||||||
before_shade: function(){
|
|
||||||
this.theta += this.d_theta
|
|
||||||
},
|
|
||||||
shade: function(src, dest, lex, x, y, w, h){
|
|
||||||
x = (x/w) * 2 - 1
|
|
||||||
y = (y/h) * 2 - 1
|
|
||||||
var ca = cos(this.theta)
|
|
||||||
var sa = sin(this.theta)
|
|
||||||
var a = x * ca - y * sa
|
|
||||||
var b = x * sa + y * ca
|
|
||||||
x = (a + 1) / 2 * w
|
|
||||||
y = (b + 1) / 2 * h
|
|
||||||
var copy = src.get(x, y)
|
|
||||||
lex.assign(copy)
|
|
||||||
return true
|
|
||||||
},
|
|
||||||
})
|
|
||||||
|
|
||||||
var CycleTool = ShaderTool.extend({
|
|
||||||
type: "cycle",
|
|
||||||
n: 0,
|
|
||||||
speed: 5,
|
|
||||||
is_recursive: true,
|
|
||||||
start: function(){
|
|
||||||
this.__start()
|
|
||||||
this.n = randsign()
|
|
||||||
if (random() < 0.2) this.n *= randint(15)
|
|
||||||
},
|
|
||||||
shade: function(src, dest, lex, x, y){
|
|
||||||
lex.bg += this.n
|
|
||||||
return false
|
|
||||||
},
|
|
||||||
})
|
|
||||||
|
|
||||||
nopaint.add_tool( new SolidBrush({ weight: 5 }) )
|
|
||||||
nopaint.add_tool( new ShadowBrush({ weight: 10 }) )
|
|
||||||
nopaint.add_tool( new EraseBrush({ weight: 5 }) )
|
|
||||||
nopaint.add_tool( new RandomBrush({ weight: 4 }) )
|
|
||||||
nopaint.add_tool( new HueBrush({ weight: 5 }) )
|
|
||||||
nopaint.add_tool( new GrayBrush({ weight: 5 }) )
|
|
||||||
nopaint.add_tool( new LetterBrush({ weight: 2 }) )
|
|
||||||
nopaint.add_tool( new RandomLetterBrush({ weight: 12 }) )
|
|
||||||
nopaint.add_tool( new CloneBrush({ weight: 8 }) )
|
|
||||||
nopaint.add_tool( new SmearBrush({ weight: 10 }) )
|
|
||||||
nopaint.add_tool( new FillTool({ weight: 3 }) )
|
|
||||||
nopaint.add_tool( new FillLetterTool({ weight: 6 }) )
|
|
||||||
nopaint.add_tool( new StarsTool({ weight: 2 }) )
|
|
||||||
nopaint.add_tool( new TranslateTool({ weight: 4 }) )
|
|
||||||
nopaint.add_tool( new CycleTool({ weight: 1 }) )
|
|
||||||
nopaint.add_tool( new ScaleTool({ weight: 3 }) )
|
|
||||||
nopaint.add_tool( new RotateTool({ weight: 3 }) )
|
|
||||||
nopaint.add_tool( new SliceTool({ weight: 4 }) )
|
|
||||||
nopaint.add_tool( new ColorizeTool({ weight: 1 }) )
|
|
||||||
nopaint.regenerate_weights()
|
|
||||||
|
|
||||||
nopaint.toggle(true)
|
|
||||||
|
|
||||||
nopaint.player = new StylePlayer ()
|
|
||||||
|
|
||||||
return nopaint
|
|
||||||
})()
|
|
||||||
@ -1,167 +0,0 @@
|
|||||||
/*
|
|
||||||
oktween.add({
|
|
||||||
obj: el.style,
|
|
||||||
units: "px",
|
|
||||||
from: { left: 0 },
|
|
||||||
to: { left: 100 },
|
|
||||||
duration: 1000,
|
|
||||||
easing: oktween.easing.circ_out,
|
|
||||||
update: function(obj){
|
|
||||||
console.log(obj.left)
|
|
||||||
}
|
|
||||||
finished: function(){
|
|
||||||
console.log("done")
|
|
||||||
}
|
|
||||||
})
|
|
||||||
*/
|
|
||||||
|
|
||||||
var oktween = (function(){
|
|
||||||
var oktween = {}
|
|
||||||
var tweens = oktween.tweens = []
|
|
||||||
var last_t = 0
|
|
||||||
var id = 0
|
|
||||||
oktween.speed = 1
|
|
||||||
oktween.raf = requestAnimationFrame
|
|
||||||
oktween.add = function(tween){
|
|
||||||
tween.id = id++
|
|
||||||
tween.obj = tween.obj || {}
|
|
||||||
if (tween.easing) {
|
|
||||||
if (typeof tween.easing == "string") {
|
|
||||||
tween.easing = oktween.easing[tween.easing]
|
|
||||||
}
|
|
||||||
}
|
|
||||||
else {
|
|
||||||
tween.easing = oktween.easing.linear
|
|
||||||
}
|
|
||||||
if (! ('from' in tween) && ! ('to' in tween)) {
|
|
||||||
tween.keys = []
|
|
||||||
}
|
|
||||||
else if (! ('from' in tween) ) {
|
|
||||||
tween.from = {}
|
|
||||||
tween.keys = Object.keys(tween.to)
|
|
||||||
tween.keys.forEach(function(prop){
|
|
||||||
tween.from[prop] = parseFloat(tween.obj[prop])
|
|
||||||
})
|
|
||||||
}
|
|
||||||
else {
|
|
||||||
tween.keys = Object.keys(tween.from)
|
|
||||||
}
|
|
||||||
tween.delay = tween.delay || 0
|
|
||||||
tween.start = last_t + tween.delay
|
|
||||||
tween.done = false
|
|
||||||
tween.after = tween.after || []
|
|
||||||
tween.then = function(fn){ tween.after.push(fn); return tween }
|
|
||||||
tween.cancel = function(){
|
|
||||||
var index = tweens.indexOf(tween)
|
|
||||||
if (index != -1) tweens.splice(index, 1)
|
|
||||||
tween.obj = null
|
|
||||||
tween.after = null
|
|
||||||
tween.done = null
|
|
||||||
}
|
|
||||||
tween.tick = 0
|
|
||||||
tween.skip = tween.skip || 1
|
|
||||||
tween.dt = 0
|
|
||||||
tweens.push(tween)
|
|
||||||
return tween
|
|
||||||
}
|
|
||||||
oktween.update = function(t) {
|
|
||||||
oktween.raf(oktween.update)
|
|
||||||
last_t = t * oktween.speed
|
|
||||||
if (tweens.length == 0) return
|
|
||||||
var done = false
|
|
||||||
tweens.forEach(function(tween, i){
|
|
||||||
var dt = Math.min(1.0, (t - tween.start) / tween.duration)
|
|
||||||
tween.tick++
|
|
||||||
if (dt < 0 || (dt < 1 && (tween.tick % tween.skip != 0))) return
|
|
||||||
var ddt = tween.dt = tween.easing(dt)
|
|
||||||
tween.keys.forEach(function(prop){
|
|
||||||
val = lerp( ddt, tween.from[prop], tween.to[prop] )
|
|
||||||
if (tween.round) val = Math.round(val)
|
|
||||||
if (tween.units) val = (Math.round(val)) + tween.units
|
|
||||||
tween.obj[prop] = val
|
|
||||||
})
|
|
||||||
tween.update && tween.update(tween.obj, dt)
|
|
||||||
if (dt == 1) {
|
|
||||||
tween.finished && tween.finished(tween)
|
|
||||||
if (tween.after.length) {
|
|
||||||
var twn = tween.after.shift()
|
|
||||||
twn.obj = twn.obj || tween.obj
|
|
||||||
twn.after = tween.after
|
|
||||||
oktween.add(twn)
|
|
||||||
}
|
|
||||||
if (tween.loop) {
|
|
||||||
tween.start = t + tween.delay
|
|
||||||
}
|
|
||||||
else {
|
|
||||||
done = tween.done = true
|
|
||||||
}
|
|
||||||
}
|
|
||||||
})
|
|
||||||
if (done) {
|
|
||||||
tweens = tweens.filter(function(tween){ return ! tween.done })
|
|
||||||
}
|
|
||||||
}
|
|
||||||
function lerp(n,a,b){ return (b-a)*n+a }
|
|
||||||
|
|
||||||
// requestAnimationFrame(oktween.update)
|
|
||||||
|
|
||||||
oktween.easing = {
|
|
||||||
linear: function(t){
|
|
||||||
return t
|
|
||||||
},
|
|
||||||
circ_out: function(t) {
|
|
||||||
return Math.sqrt(1 - (t = t - 1) * t)
|
|
||||||
},
|
|
||||||
circ_in: function(t){
|
|
||||||
return -(Math.sqrt(1 - (t * t)) - 1)
|
|
||||||
},
|
|
||||||
circ_in_out: function(t) {
|
|
||||||
return ((t*=2) < 1) ? -0.5 * (Math.sqrt(1 - t * t) - 1) : 0.5 * (Math.sqrt(1 - (t -= 2) * t) + 1)
|
|
||||||
},
|
|
||||||
quad_in: function(n){
|
|
||||||
return Math.pow(n, 2)
|
|
||||||
},
|
|
||||||
quad_out: function(n){
|
|
||||||
return n * (n - 2) * -1
|
|
||||||
},
|
|
||||||
quad_in_out: function(n){
|
|
||||||
n = n * 2
|
|
||||||
if(n < 1){ return Math.pow(n, 2) / 2 }
|
|
||||||
return -1 * ((--n) * (n - 2) - 1) / 2
|
|
||||||
},
|
|
||||||
cubic_bezier: function (mX1, mY1, mX2, mY2) {
|
|
||||||
function A(aA1, aA2) { return 1.0 - 3.0 * aA2 + 3.0 * aA1; }
|
|
||||||
function B(aA1, aA2) { return 3.0 * aA2 - 6.0 * aA1; }
|
|
||||||
function C(aA1) { return 3.0 * aA1; }
|
|
||||||
|
|
||||||
// Returns x(t) given t, x1, and x2, or y(t) given t, y1, and y2.
|
|
||||||
function CalcBezier(aT, aA1, aA2) {
|
|
||||||
return ((A(aA1, aA2)*aT + B(aA1, aA2))*aT + C(aA1))*aT;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Returns dx/dt given t, x1, and x2, or dy/dt given t, y1, and y2.
|
|
||||||
function GetSlope(aT, aA1, aA2) {
|
|
||||||
return 3.0 * A(aA1, aA2)*aT*aT + 2.0 * B(aA1, aA2) * aT + C(aA1);
|
|
||||||
}
|
|
||||||
|
|
||||||
function GetTForX(aX) {
|
|
||||||
// Newton raphson iteration
|
|
||||||
var aGuessT = aX;
|
|
||||||
for (var i = 0; i < 10; ++i) {
|
|
||||||
var currentSlope = GetSlope(aGuessT, mX1, mX2);
|
|
||||||
if (currentSlope == 0.0) return aGuessT;
|
|
||||||
var currentX = CalcBezier(aGuessT, mX1, mX2) - aX;
|
|
||||||
aGuessT -= currentX / currentSlope;
|
|
||||||
}
|
|
||||||
return aGuessT;
|
|
||||||
}
|
|
||||||
|
|
||||||
return function(aX) {
|
|
||||||
if (mX1 == mY1 && mX2 == mY2) return aX; // linear
|
|
||||||
return CalcBezier(aX, mY1, mY2);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
return oktween
|
|
||||||
})()
|
|
||||||
@ -326,62 +326,3 @@ var draw = (function(){
|
|||||||
|
|
||||||
})()
|
})()
|
||||||
|
|
||||||
var shader = (function(){
|
|
||||||
var fn_str, fn, lex
|
|
||||||
var exports = {}
|
|
||||||
var animating = false
|
|
||||||
|
|
||||||
exports.init = function(){
|
|
||||||
lex = new Lex (0, 0)
|
|
||||||
exports.build(demo_shader.innerHTML)
|
|
||||||
}
|
|
||||||
exports.build = function (fn_str){
|
|
||||||
try {
|
|
||||||
new_fn = new Function('lex', 'x', 'y', 'w', 'h', 't', fn_str)
|
|
||||||
new_fn(lex, 0, 0, 1, 1, 0)
|
|
||||||
}
|
|
||||||
catch (e) {
|
|
||||||
throw 'Shader execution error'
|
|
||||||
}
|
|
||||||
exports.fn = fn = new_fn
|
|
||||||
return fn
|
|
||||||
}
|
|
||||||
exports.run = function(canvas){
|
|
||||||
var t = +new Date
|
|
||||||
shader.canvas = shader.canvas || canvas
|
|
||||||
var w = shader.canvas.w, h = shader.canvas.h
|
|
||||||
shader.canvas.forEach(function(lex, x, y){
|
|
||||||
fn(lex, x, y, w, h, t)
|
|
||||||
lex.build()
|
|
||||||
})
|
|
||||||
}
|
|
||||||
exports.toggle = function(state){
|
|
||||||
animating = typeof state == "boolean" ? state : ! animating
|
|
||||||
shader_fps_el.classList.toggle('hidden')
|
|
||||||
return animating
|
|
||||||
}
|
|
||||||
exports.pause = function(){
|
|
||||||
animating = false
|
|
||||||
shader_fps_el.classList.add('hidden')
|
|
||||||
shader.fps_time = 0
|
|
||||||
}
|
|
||||||
exports.play = function(){
|
|
||||||
animating = true
|
|
||||||
shader_fps_el.classList.remove('hidden')
|
|
||||||
}
|
|
||||||
exports.animate = function (t){
|
|
||||||
requestAnimationFrame(exports.animate)
|
|
||||||
if (! animating) { return }
|
|
||||||
if (shader.fps_time){
|
|
||||||
var ms = Date.now() - shader.fps_time
|
|
||||||
fps = 1000 / ms
|
|
||||||
shader_fps_el.innerHTML = (fps | 0) + ' fps'
|
|
||||||
}
|
|
||||||
shader.fps_time = Date.now()
|
|
||||||
exports.run(canvas)
|
|
||||||
}
|
|
||||||
|
|
||||||
return exports
|
|
||||||
|
|
||||||
})()
|
|
||||||
|
|
||||||
|
|||||||
@ -104,7 +104,6 @@ var canvas = current_canvas = (function(){
|
|||||||
point = [x,y]
|
point = [x,y]
|
||||||
lex = canvas.aa[y][x]
|
lex = canvas.aa[y][x]
|
||||||
if (! dragging) return
|
if (! dragging) return
|
||||||
shader_el.innerHTML = point.join(",")
|
|
||||||
if (drawing) {
|
if (drawing) {
|
||||||
draw.move(e, lex, point)
|
draw.move(e, lex, point)
|
||||||
}
|
}
|
||||||
|
|||||||
@ -155,41 +155,6 @@ var controls = (function(){
|
|||||||
}
|
}
|
||||||
//
|
//
|
||||||
|
|
||||||
var ShaderTool = FileTool.extend({
|
|
||||||
active: false,
|
|
||||||
use: function(state){
|
|
||||||
this.active = typeof state == "boolean" ? state : ! this.active
|
|
||||||
if (this.active) {
|
|
||||||
shader_rapper.style.display = "block"
|
|
||||||
shader_textarea.focus()
|
|
||||||
} else {
|
|
||||||
shader_rapper.style.display = "none"
|
|
||||||
}
|
|
||||||
},
|
|
||||||
done: function(){
|
|
||||||
this.use(false)
|
|
||||||
}
|
|
||||||
})
|
|
||||||
controls.shader = new ShaderTool (shader_el)
|
|
||||||
shader_textarea.value = shader_textarea.value || demo_shader.innerHTML
|
|
||||||
shader_textarea.addEventListener("input", function(){
|
|
||||||
var fn = shader.build(shader_textarea.value)
|
|
||||||
fn && shader.run(canvas)
|
|
||||||
})
|
|
||||||
controls.animate = new BlurredCheckbox (animate_checkbox)
|
|
||||||
controls.animate.use = function(state){
|
|
||||||
var state = shader.toggle()
|
|
||||||
this.update(state)
|
|
||||||
// controls.shader.focus()
|
|
||||||
controls.shader.use(true)
|
|
||||||
}
|
|
||||||
|
|
||||||
controls.shader_target = new RadioGroup(shader_target_el)
|
|
||||||
var cs = controls.shader_target.controls
|
|
||||||
cs.canvas.use = function(){ shader.canvas = canvas }
|
|
||||||
cs.brush.use = function(){ shader.canvas = brush }
|
|
||||||
cs.selection.use = function(){ shader.canvas = selection.canvas }
|
|
||||||
|
|
||||||
controls.experimental_palette = new HiddenCheckbox (experimental_palette_toggle)
|
controls.experimental_palette = new HiddenCheckbox (experimental_palette_toggle)
|
||||||
controls.experimental_palette.memorable = true
|
controls.experimental_palette.memorable = true
|
||||||
controls.experimental_palette.use = function(state){
|
controls.experimental_palette.use = function(state){
|
||||||
@ -209,16 +174,6 @@ var controls = (function(){
|
|||||||
this.update(state)
|
this.update(state)
|
||||||
}
|
}
|
||||||
|
|
||||||
/*
|
|
||||||
controls.nopaint = new HiddenCheckbox (nopaint_toggle)
|
|
||||||
controls.nopaint.memorable = true
|
|
||||||
controls.nopaint.on = "N"
|
|
||||||
controls.nopaint.use = function(state){
|
|
||||||
var state = nopaint.toggle(state)
|
|
||||||
this.update(state)
|
|
||||||
}
|
|
||||||
*/
|
|
||||||
|
|
||||||
//
|
//
|
||||||
|
|
||||||
controls.fg = new BlurredCheckbox (fg_checkbox)
|
controls.fg = new BlurredCheckbox (fg_checkbox)
|
||||||
|
|||||||
@ -98,10 +98,6 @@ var keys = (function(){
|
|||||||
e.preventDefault()
|
e.preventDefault()
|
||||||
}
|
}
|
||||||
*/
|
*/
|
||||||
if (current_tool.name == "shader") {
|
|
||||||
cursor_input.value = ""
|
|
||||||
return
|
|
||||||
}
|
|
||||||
var char = cursor_input.value
|
var char = cursor_input.value
|
||||||
cursor_input.value = ""
|
cursor_input.value = ""
|
||||||
|
|
||||||
|
|||||||
@ -26,7 +26,7 @@ var Tool = Model({
|
|||||||
current_tool = this
|
current_tool = this
|
||||||
this.el.classList.add('focused')
|
this.el.classList.add('focused')
|
||||||
this.use()
|
this.use()
|
||||||
if (this.name != 'shader' && is_desktop) { cursor_input.focus() }
|
if (is_desktop) { cursor_input.focus() }
|
||||||
},
|
},
|
||||||
blur: function(){
|
blur: function(){
|
||||||
current_tool = null
|
current_tool = null
|
||||||
@ -45,7 +45,7 @@ var FileTool = Tool.extend({
|
|||||||
current_filetool = this
|
current_filetool = this
|
||||||
this.el.classList.add('focused')
|
this.el.classList.add('focused')
|
||||||
this.use()
|
this.use()
|
||||||
if (this.name != 'shader' && is_desktop) { cursor_input.focus() }
|
if (is_desktop) { cursor_input.focus() }
|
||||||
},
|
},
|
||||||
blur: function(){
|
blur: function(){
|
||||||
current_filetool = null
|
current_filetool = null
|
||||||
|
|||||||
@ -0,0 +1,40 @@
|
|||||||
|
#!/bin/sh
|
||||||
|
#
|
||||||
|
|
||||||
|
msgf() {
|
||||||
|
local _fmt="${1}"; shift;
|
||||||
|
printf "%s >>> ${_fmt}\n" "$(date +"%d-%^b-%Y %H:%M:%S")" "${@}";
|
||||||
|
};
|
||||||
|
|
||||||
|
usage() {
|
||||||
|
echo "usage: ${0} [-h] [-v]" >&2;
|
||||||
|
echo " -h.........: show this screen" >&2;
|
||||||
|
echo " -v.........: be verbose" >&2;
|
||||||
|
};
|
||||||
|
|
||||||
|
main() {
|
||||||
|
local _cmd="" _build="" _opt="" _vflag=0;
|
||||||
|
while getopts hv _opt; do
|
||||||
|
case "${_opt}" in
|
||||||
|
h) usage; exit 0; ;;
|
||||||
|
v) _vflag=1; ;;
|
||||||
|
*) usage; exit 1; ;;
|
||||||
|
esac; done;
|
||||||
|
shift $((${OPTIND}-1));
|
||||||
|
for _build in cordoba nw www; do
|
||||||
|
msgf "Deploying ${_build}...";
|
||||||
|
cd "asciiblaster-${_build}";
|
||||||
|
if [ "${_vflag:-0}" -eq 0 ]; then
|
||||||
|
./deploy.sh "${@}";
|
||||||
|
else
|
||||||
|
./deploy.sh -v "${@}";
|
||||||
|
fi;
|
||||||
|
cd "${OLDPWD}";
|
||||||
|
msgf "Deployed ${_build}.";
|
||||||
|
done;
|
||||||
|
};
|
||||||
|
|
||||||
|
set -o errexit -o noglob;
|
||||||
|
main "${@}";
|
||||||
|
|
||||||
|
# vim:foldmethod=marker sw=8 ts=8 tw=120
|
||||||
@ -0,0 +1,79 @@
|
|||||||
|
#!/bin/sh
|
||||||
|
#
|
||||||
|
|
||||||
|
CORDOBA_PLATFORMS="android";
|
||||||
|
PACKAGE_NAME="asciiblaster-cordoba";
|
||||||
|
RELEASE_DEPS_CMD="cordova cp";
|
||||||
|
RELEASE_DEPS_ENV="ANDROID_HOME JAVA_HOME";
|
||||||
|
RELEASES_DNAME_DEST="releases";
|
||||||
|
RELEASES_DNAME_SRC="platforms/%CORDOBA_PLATFORM%/app/build/outputs/apk";
|
||||||
|
|
||||||
|
msgf() {
|
||||||
|
local _fmt="${1}"; shift;
|
||||||
|
printf "%s >>> ${_fmt}\n" "$(date +"%d-%^b-%Y %H:%M:%S")" "${@}";
|
||||||
|
};
|
||||||
|
|
||||||
|
subst() {
|
||||||
|
local _string="${1}" _search="${2}" _replace="${3}" _string_="";
|
||||||
|
_string_="${_string%${_search}*}";
|
||||||
|
_string_="${_string_}${_replace}"
|
||||||
|
_string_="${_string_}${_string#*${_search}}";
|
||||||
|
echo "${_string_}";
|
||||||
|
};
|
||||||
|
|
||||||
|
deploy() {
|
||||||
|
local _platform="${1}" _vflag="${2}" _release_dname_src="" _release_type="" _release_version="";
|
||||||
|
|
||||||
|
_release_dname_src="$(subst "${RELEASES_DNAME_SRC}" "%CORDOBA_PLATFORM%" "${_platform}")";
|
||||||
|
_release_version="$(sed -n '/^\s*"version":/s/^.*:\s*"\([0-9.]\+\)",\?\s*$/\1/p' package.json)";
|
||||||
|
for _release_type in debug release; do
|
||||||
|
cordova build "--${_release_type}" --device "${_platform}";
|
||||||
|
cp -a "$(find "${_release_dname_src}/${_release_type}" -name \*.apk)" \
|
||||||
|
"${RELEASES_DNAME_DEST}/${PACKAGE_NAME}-${_release_type}-${_release_version}.apk";
|
||||||
|
done;
|
||||||
|
};
|
||||||
|
|
||||||
|
usage() {
|
||||||
|
echo "usage: ${0} [-h] [-v] [platform...]" >&2;
|
||||||
|
echo " -h.........: show this screen" >&2;
|
||||||
|
echo " -v.........: be verbose" >&2;
|
||||||
|
echo " platform...: one of: \`${CORDOBA_PLATFORMS}'" >&2;
|
||||||
|
};
|
||||||
|
|
||||||
|
main() {
|
||||||
|
local _cmd="" _opt="" _platform="" _platforms="" _vflag=0 _vname="";
|
||||||
|
while getopts hv _opt; do
|
||||||
|
case "${_opt}" in
|
||||||
|
h) usage; exit 0; ;;
|
||||||
|
v) _vflag=1; ;;
|
||||||
|
*) usage; exit 1; ;;
|
||||||
|
esac; done;
|
||||||
|
shift $((${OPTIND}-1));
|
||||||
|
for _cmd in ${RELEASE_DEPS_CMD}; do
|
||||||
|
if ! which "${_cmd}" >/dev/null; then
|
||||||
|
echo "error: missing prerequisite command \`${_cmd}'";
|
||||||
|
exit 1;
|
||||||
|
fi;
|
||||||
|
done;
|
||||||
|
for _vname in ${RELEASE_DEPS_ENV}; do
|
||||||
|
if [ -z "$(eval echo \"\${_vname}\")" ]; then
|
||||||
|
echo "error: missing prerequisite environment variable \`${_vname}'";
|
||||||
|
exit 1;
|
||||||
|
fi;
|
||||||
|
done;
|
||||||
|
_platforms="${@}"; mkdir -p "${RELEASES_DNAME_DEST}";
|
||||||
|
for _platform in ${_platforms:-${CORDOBA_PLATFORMS}}; do
|
||||||
|
msgf "Building ${_platform} release...";
|
||||||
|
if [ "${_vflag:-0}" -eq 0 ]; then
|
||||||
|
deploy "${_platform}" "${_vflag}" >/dev/null;
|
||||||
|
else
|
||||||
|
deploy "${_platform}" "${_vflag}";
|
||||||
|
fi;
|
||||||
|
msgf "Built ${_platform} release.";
|
||||||
|
done;
|
||||||
|
};
|
||||||
|
|
||||||
|
set -o errexit -o noglob;
|
||||||
|
main "${@}";
|
||||||
|
|
||||||
|
# vim:foldmethod=marker sw=8 ts=8 tw=120
|
||||||
@ -0,0 +1,121 @@
|
|||||||
|
#!/bin/sh
|
||||||
|
#
|
||||||
|
|
||||||
|
PACKAGE_NAME="asciiblaster-nw";
|
||||||
|
RELEASE_DEPS="cpio find gunzip rm sed tar unzip wget zip";
|
||||||
|
NWJS_MANIFEST_FNAME="nwjs.manifest";
|
||||||
|
NWJS_PLATFORMS="linux-ia32 linux-x64 win-ia32 win-x64";
|
||||||
|
NWJS_VERSION="0.34.5";
|
||||||
|
NWJS_SUBDIR="nwjs-v${NWJS_VERSION}-%NWJS_PLATFORM%";
|
||||||
|
NWJS_URL_linux="https://dl.nwjs.io/v${NWJS_VERSION}/nwjs-v${NWJS_VERSION}-%NWJS_PLATFORM%.tar.gz";
|
||||||
|
NWJS_URL_win="https://dl.nwjs.io/v${NWJS_VERSION}/nwjs-v${NWJS_VERSION}-%NWJS_PLATFORM%.zip";
|
||||||
|
RELEASES_DNAME="releases";
|
||||||
|
|
||||||
|
extract() {
|
||||||
|
local _fname="${1}" _dest_dname="${2}";
|
||||||
|
if [ -n "${_fname}" -a -z "${_fname##*.tar.gz}" ]; then
|
||||||
|
tar -C "${_dest_dname}" -xpf "${_fname}";
|
||||||
|
elif [ -n "${_fname}" -a -z "${_fname##*.zip}" ]; then
|
||||||
|
unzip -d "${_dest_dname}" "${_fname}";
|
||||||
|
else
|
||||||
|
echo "error: file \`${_fname}' is of unknown archive type" >&2; exit 1;
|
||||||
|
fi;
|
||||||
|
};
|
||||||
|
|
||||||
|
msgf() {
|
||||||
|
local _fmt="${1}"; shift;
|
||||||
|
printf "%s >>> ${_fmt}\n" "$(date +"%d-%^b-%Y %H:%M:%S")" "${@}";
|
||||||
|
};
|
||||||
|
|
||||||
|
subst() {
|
||||||
|
local _string="${1}" _search="${2}" _replace="${3}" _string_="";
|
||||||
|
_string_="${_string%${_search}*}";
|
||||||
|
_string_="${_string_}${_replace}"
|
||||||
|
_string_="${_string_}${_string#*${_search}}";
|
||||||
|
echo "${_string_}";
|
||||||
|
};
|
||||||
|
|
||||||
|
deploy() {
|
||||||
|
local _platform="${1}" _vflag="${2}" _nwjs_fname="" _nwjs_subdir="" _nwjs_url="" \
|
||||||
|
_release_fname="" _release_dname="" _release_version="";
|
||||||
|
|
||||||
|
_nwjs_subdir="$(subst "${NWJS_SUBDIR}" "%NWJS_PLATFORM%" "${_platform}")";
|
||||||
|
_nwjs_url="$(subst "$(eval echo \"\${NWJS_URL_${_platform%%-*}}\")" "%NWJS_PLATFORM%" "${_platform}")";
|
||||||
|
_nwjs_fname="${RELEASES_DNAME}/${_nwjs_url##*/}";
|
||||||
|
_release_version="$(sed -n '/^\s*"version":/s/^.*:\s*"\([0-9.]\+\)",\?\s*$/\1/p' package.json)";
|
||||||
|
_release_dname="${RELEASES_DNAME}/${PACKAGE_NAME}-${_release_version}-release-${_platform}";
|
||||||
|
_release_fname="${_release_dname}.zip";
|
||||||
|
|
||||||
|
trap "rm -fr ${_release_dname}" EXIT HUP INT QUIT PIPE TERM USR1 USR2;
|
||||||
|
if [ "${_vflag:-0}" -eq 0 ]; then
|
||||||
|
wget -cqO "${_nwjs_fname}" "${_nwjs_url}";
|
||||||
|
else
|
||||||
|
wget -cO "${_nwjs_fname}" "${_nwjs_url}";
|
||||||
|
fi;
|
||||||
|
if ! sha256sum --ignore-missing -c --status "${NWJS_MANIFEST_FNAME}"; then
|
||||||
|
echo "error: SHA256 sum mismatch for \`${_nwjs_fname}'" >&2; return 1;
|
||||||
|
fi;
|
||||||
|
rm -rf "${_release_dname}"; mkdir -p "${_release_dname}"; extract "${_nwjs_fname}" "${_release_dname}";
|
||||||
|
|
||||||
|
cd "${_release_dname}/${_nwjs_subdir}";
|
||||||
|
find . \
|
||||||
|
-mindepth 1 |\
|
||||||
|
cpio --quiet -dmp ..;
|
||||||
|
cd "${OLDPWD}";
|
||||||
|
rm -fr "${_release_dname}/${_nwjs_subdir}";
|
||||||
|
find -L . \
|
||||||
|
-mindepth 1 \
|
||||||
|
-not -path "./${RELEASES_DNAME}/*" \
|
||||||
|
-not -path "./${RELEASES_DNAME}" \
|
||||||
|
-not -name '*.sw*' \
|
||||||
|
-not -name "${0##*/}" \
|
||||||
|
-not -name "${NWJS_MANIFEST_FNAME}" |\
|
||||||
|
cpio --quiet -dLmp "${_release_dname}";
|
||||||
|
cd "${RELEASES_DNAME}";
|
||||||
|
if [ "${_vflag:-0}" -eq 0 ]; then
|
||||||
|
zip -9 -r "${_release_fname##${RELEASES_DNAME}/}" "${_release_dname##${RELEASES_DNAME}/}" >/dev/null;
|
||||||
|
else
|
||||||
|
zip -9 -r "${_release_fname##${RELEASES_DNAME}/}" "${_release_dname##${RELEASES_DNAME}/}";
|
||||||
|
fi;
|
||||||
|
cd "${OLDPWD}"; rm -fr "${_release_dname}";
|
||||||
|
trap - EXIT HUP INT QUIT PIPE TERM USR1 USR2;
|
||||||
|
};
|
||||||
|
|
||||||
|
usage() {
|
||||||
|
echo "usage: ${0} [-h] [-v] [platform...]" >&2;
|
||||||
|
echo " -h.........: show this screen" >&2;
|
||||||
|
echo " -v.........: be verbose" >&2;
|
||||||
|
echo " platform...: one of: \`${NWJS_PLATFORMS}'" >&2;
|
||||||
|
};
|
||||||
|
|
||||||
|
main() {
|
||||||
|
local _cmd="" _opt="" _platform="" _platforms="" _vflag=0;
|
||||||
|
while getopts hv _opt; do
|
||||||
|
case "${_opt}" in
|
||||||
|
h) usage; exit 0; ;;
|
||||||
|
v) _vflag=1; ;;
|
||||||
|
*) usage; exit 1; ;;
|
||||||
|
esac; done;
|
||||||
|
shift $((${OPTIND}-1));
|
||||||
|
for _cmd in ${RELEASE_DEPS}; do
|
||||||
|
if ! which "${_cmd}" >/dev/null; then
|
||||||
|
echo "error: missing prerequisite command \`${_cmd}'";
|
||||||
|
exit 1;
|
||||||
|
fi;
|
||||||
|
done;
|
||||||
|
_platforms="${@}"; mkdir -p "${RELEASES_DNAME}";
|
||||||
|
for _platform in ${_platforms:-${NWJS_PLATFORMS}}; do
|
||||||
|
msgf "Building ${_platform} release...";
|
||||||
|
if [ "${_vflag:-0}" -eq 0 ]; then
|
||||||
|
deploy "${_platform}" "${_vflag}" >/dev/null;
|
||||||
|
else
|
||||||
|
deploy "${_platform}" "${_vflag}";
|
||||||
|
fi;
|
||||||
|
msgf "Built ${_platform} release.";
|
||||||
|
done;
|
||||||
|
};
|
||||||
|
|
||||||
|
set -o errexit -o noglob;
|
||||||
|
main "${@}";
|
||||||
|
|
||||||
|
# vim:foldmethod=marker sw=8 ts=8 tw=120
|
||||||
@ -0,0 +1,69 @@
|
|||||||
|
#!/bin/sh
|
||||||
|
#
|
||||||
|
|
||||||
|
PACKAGE_NAME="asciiblaster-www";
|
||||||
|
RELEASE_DEPS="cpio find rm sed zip";
|
||||||
|
RELEASES_DNAME="releases";
|
||||||
|
|
||||||
|
msgf() {
|
||||||
|
local _fmt="${1}"; shift;
|
||||||
|
printf "%s >>> ${_fmt}\n" "$(date +"%d-%^b-%Y %H:%M:%S")" "${@}";
|
||||||
|
};
|
||||||
|
|
||||||
|
deploy() {
|
||||||
|
local _vflag="${1}" _release_fname="" _release_dname="" _release_version="";
|
||||||
|
|
||||||
|
_release_version="$(sed -n '/^\s*<title>/s/^\s*<title>asciiblaster v\([0-9.]\+\)<\/title>\s*$/\1/p' index.html)";
|
||||||
|
_release_dname="${RELEASES_DNAME}/${PACKAGE_NAME}-${_release_version}";
|
||||||
|
_release_fname="${_release_dname}.zip";
|
||||||
|
|
||||||
|
find -L . \
|
||||||
|
-mindepth 1 \
|
||||||
|
-not -path "./${RELEASES_DNAME}/*" \
|
||||||
|
-not -path "./${RELEASES_DNAME}" \
|
||||||
|
-not -name '*.sw*' \
|
||||||
|
-not -name "${0##*/}" |\
|
||||||
|
cpio --quiet -dLmp "${_release_dname}";
|
||||||
|
cd "${RELEASES_DNAME}";
|
||||||
|
if [ "${_vflag:-0}" -eq 0 ]; then
|
||||||
|
zip -9 -r "${_release_fname##${RELEASES_DNAME}/}" "${_release_dname##${RELEASES_DNAME}/}" >/dev/null;
|
||||||
|
else
|
||||||
|
zip -9 -r "${_release_fname##${RELEASES_DNAME}/}" "${_release_dname##${RELEASES_DNAME}/}";
|
||||||
|
fi;
|
||||||
|
cd "${OLDPWD}"; rm -fr "${_release_dname}";
|
||||||
|
};
|
||||||
|
|
||||||
|
usage() {
|
||||||
|
echo "usage: ${0} [-h] [-v]" >&2;
|
||||||
|
echo " -h.........: show this screen" >&2;
|
||||||
|
echo " -v.........: be verbose" >&2;
|
||||||
|
};
|
||||||
|
|
||||||
|
main() {
|
||||||
|
local _cmd="" _opt="" _vflag=0;
|
||||||
|
while getopts hv _opt; do
|
||||||
|
case "${_opt}" in
|
||||||
|
h) usage; exit 0; ;;
|
||||||
|
v) _vflag=1; ;;
|
||||||
|
*) usage; exit 1; ;;
|
||||||
|
esac; done;
|
||||||
|
shift $((${OPTIND}-1));
|
||||||
|
for _cmd in ${RELEASE_DEPS}; do
|
||||||
|
if ! which "${_cmd}" >/dev/null; then
|
||||||
|
echo "error: missing prerequisite command \`${_cmd}'";
|
||||||
|
exit 1;
|
||||||
|
fi;
|
||||||
|
done;
|
||||||
|
msgf "Building release...";
|
||||||
|
if [ "${_vflag:-0}" -eq 0 ]; then
|
||||||
|
deploy "${_vflag}" >/dev/null;
|
||||||
|
else
|
||||||
|
deploy "${_vflag}";
|
||||||
|
fi;
|
||||||
|
msgf "Built release.";
|
||||||
|
};
|
||||||
|
|
||||||
|
set -o errexit -o noglob;
|
||||||
|
main "${@}";
|
||||||
|
|
||||||
|
# vim:foldmethod=marker sw=8 ts=8 tw=120
|
||||||
@ -1,9 +1,10 @@
|
|||||||
1) document: constraints for video reverse
|
1) document: constraints for video reverse
|
||||||
2) document: Shift + LMB to delete brush, Shift + LMB to switch character sets
|
2) document: Shift + LMB to delete brush, Shift + LMB to switch character sets
|
||||||
3) feature: allow to adjust cutoff warning threshold, {dis,en}able cutoff & print line numbers affected
|
3) feature: allow to adjust cutoff warning threshold, {dis,en}able cutoff & print line numbers affected
|
||||||
4) feature: {bold,italic,underline} attributes
|
4) feature: {bold,italic,underline} attributes
|
||||||
5) feature: keyboard instead of [LR]MB
|
5) feature: keyboard instead of [LR]MB
|
||||||
6) feature: {line,measuring} tool
|
6) feature: {line,measuring} tool
|
||||||
7) feature: status bar w/ position, etc.
|
7) feature: status bar w/ position, etc.
|
||||||
8) feature: zoom {in,out}
|
8) feature: zoom {in,out}
|
||||||
9) reimplement: {save,upload} as PNG & gallery
|
9) reimplement: {save,upload} as PNG & gallery, shaders (possibly)
|
||||||
|
10) releases: merge w/ MiRCARTools (into asciiblaster,) provide signed release APK, set is_{iphone,ipad,android,mobile,desktop}
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
<html>
|
<html>
|
||||||
<head>
|
<head>
|
||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8">
|
||||||
<title>asciiblaster</title>
|
<title>asciiblaster v1.0.4</title>
|
||||||
<meta name="viewport" content="width=device-width, maximum-scale=1.0, user-scalable=yes" />
|
<meta name="viewport" content="width=device-width, maximum-scale=1.0, user-scalable=yes" />
|
||||||
<link rel="stylesheet" href="assets/css/sally.css" type="text/css" charset="utf-8" />
|
<link rel="stylesheet" href="assets/css/sally.css" type="text/css" charset="utf-8" />
|
||||||
<link rel="stylesheet" href="assets/css/ak.css" type="text/css" charset="utf-8" />
|
<link rel="stylesheet" href="assets/css/ak.css" type="text/css" charset="utf-8" />
|
||||||
@ -19,7 +19,6 @@
|
|||||||
<div id="palette_rapper"></div>
|
<div id="palette_rapper"></div>
|
||||||
<div id="secret_rapper">
|
<div id="secret_rapper">
|
||||||
<span id="experimental_palette_toggle">.</span>
|
<span id="experimental_palette_toggle">.</span>
|
||||||
<!-- <span id="nopaint_toggle">N</span> -->
|
|
||||||
</div>
|
</div>
|
||||||
<div id="letters_rapper"></div>
|
<div id="letters_rapper"></div>
|
||||||
<div id="custom_rapper"></div>
|
<div id="custom_rapper"></div>
|
||||||
@ -64,19 +63,11 @@
|
|||||||
<span id="save_el" class="tool">save</span>
|
<span id="save_el" class="tool">save</span>
|
||||||
<span id="load_el" class="tool">load</span>
|
<span id="load_el" class="tool">load</span>
|
||||||
<br>
|
<br>
|
||||||
<span id="shader_el" class="tool">shader</span>
|
|
||||||
<a id="doc_el" href="assets/doc/index.html" target="_blank">doc</a>
|
<a id="doc_el" href="assets/doc/index.html" target="_blank">doc</a>
|
||||||
<br>
|
<br>
|
||||||
<span id="advanced_checkbox" class="tool">_ advanced</span>
|
<span id="advanced_checkbox" class="tool">_ advanced</span>
|
||||||
<br>
|
<br>
|
||||||
<br>
|
<br>
|
||||||
<div id="nopaint_rapper">
|
|
||||||
<br>
|
|
||||||
<span id="nopaint_no_el" class="tool">no</span><br>
|
|
||||||
<span id="nopaint_paint_el" class="tool">paint</span><br>
|
|
||||||
<span id="nopaint_pause_el" class="tool hidden">pause</span><br>
|
|
||||||
</div>
|
|
||||||
<br>
|
|
||||||
brush: <span id="brush_w_el" class="ed">5</span> x <span id="brush_h_el" class="ed">5</span><br>
|
brush: <span id="brush_w_el" class="ed">5</span> x <span id="brush_h_el" class="ed">5</span><br>
|
||||||
canvas: <span id="canvas_w_el" class="ed">100</span> x <span id="canvas_h_el" class="ed">30</span><br>
|
canvas: <span id="canvas_w_el" class="ed">100</span> x <span id="canvas_h_el" class="ed">30</span><br>
|
||||||
</div>
|
</div>
|
||||||
@ -90,33 +81,16 @@
|
|||||||
<div id="cutoff_warning_el">character limit of 425 exceeded</div>
|
<div id="cutoff_warning_el">character limit of 425 exceeded</div>
|
||||||
<textarea id="import_textarea"></textarea>
|
<textarea id="import_textarea"></textarea>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="shader_rapper">
|
|
||||||
<span id="animate_checkbox" class="tool">_ animate</span>
|
|
||||||
to <span id="shader_target_el">*canvas brush selection</span>
|
|
||||||
<span id="shader_fps_el" class="hidden faded"></span><br>
|
|
||||||
<textarea id="shader_textarea"></textarea>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<input type="text" id="cursor_input">
|
<input type="text" id="cursor_input">
|
||||||
|
|
||||||
</body>
|
</body>
|
||||||
<script type="text/javascript-shader" id="demo_shader">
|
<script src="assets/js/util.js"></script>
|
||||||
// lex.bg = hue((x+y*y+t/10)/20)
|
<script src="assets/js/unicode.js"></script>
|
||||||
// lex.fg = colors.white
|
<script src="assets/js/color.js"></script>
|
||||||
// lex.char = " "
|
|
||||||
// lex.opacity = 1
|
|
||||||
|
|
||||||
</script>
|
|
||||||
<script src="assets/js/ext/oktween.js"></script>
|
|
||||||
|
|
||||||
<script src="assets/js/ext/util.js"></script>
|
|
||||||
<script src="assets/js/ext/unicode.js"></script>
|
|
||||||
<script src="assets/js/ext/color.js"></script>
|
|
||||||
<script src="assets/js/clipboard.js"></script>
|
<script src="assets/js/clipboard.js"></script>
|
||||||
|
|
||||||
<script src="assets/js/lex.js"></script>
|
<script src="assets/js/lex.js"></script>
|
||||||
<script src="assets/js/matrix.js"></script>
|
<script src="assets/js/matrix.js"></script>
|
||||||
<script src="assets/js/gfx.js"></script>
|
<script src="assets/js/gfx.js"></script>
|
||||||
@ -132,7 +106,6 @@
|
|||||||
<script src="assets/js/ui/letters.js"></script>
|
<script src="assets/js/ui/letters.js"></script>
|
||||||
<script src="assets/js/ui/selection.js"></script>
|
<script src="assets/js/ui/selection.js"></script>
|
||||||
<script src="assets/js/ui/transform.js"></script>
|
<script src="assets/js/ui/transform.js"></script>
|
||||||
<script src="assets/js/ext/nopaint.js"></script>
|
|
||||||
|
|
||||||
<script src="assets/js/app.js"></script>
|
<script src="assets/js/app.js"></script>
|
||||||
</html>
|
</html>
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user