diff options
| -rw-r--r-- | css/sally.css | 2 | ||||
| -rw-r--r-- | js/tool.js | 4 | ||||
| -rw-r--r-- | js/ui/keys.js | 4 | ||||
| -rw-r--r-- | js/ui/nopaint.js | 198 |
4 files changed, 191 insertions, 17 deletions
diff --git a/css/sally.css b/css/sally.css index b831aff..deb17cc 100644 --- a/css/sally.css +++ b/css/sally.css @@ -84,6 +84,8 @@ body.grid #letters_rapper > div:first-child, body.grid #brush_rapper > div:first-child { border-top: 1px solid #444; } body.grid .tool { border: 1px solid #444; } .ed { color: #fff; } +.locked { border-bottom: 1px solid; color: #bbb; text-decoration: none; } +.tool.locked.focused { box-shadow: 0 0; } .focused { box-shadow: inset 0 0px 2px #fff; border-color: #fff; } .ba.focused { box-shadow: inset 0 0px 2px #000, inset 0 0px 2px #000; border-color: #000; } .tool.focused, .ed.focused { color: white; text-decoration: underline; } @@ -9,12 +9,16 @@ var Tool = Model({ tool.el.addEventListener('mousedown', function(e){ tool.focus() }) + tool.el.addEventListener('contextmenu', function(e){ + tool.context(e) + }) if (tool.memorable) { // console.log(tool.name, localStorage.getItem("ascii.tools." + tool.name) ) tool.use( localStorage.getItem("ascii.tools." + tool.name) == "true" ) } }, use: function(){}, + context: function(e){}, done: function(){}, focus: function(){ // focused && focused.blur() diff --git a/js/ui/keys.js b/js/ui/keys.js index 09d63fc..77922c7 100644 --- a/js/ui/keys.js +++ b/js/ui/keys.js @@ -208,6 +208,6 @@ var keys = (function(){ })() function check_if_lost_focus() { - if (! focused || ! focused.span) - focused = canvas.aa[0][0] + if (! window.focused || ! window.focused.span) + window.focused = canvas.aa[0][0] } diff --git a/js/ui/nopaint.js b/js/ui/nopaint.js index 8ca7edb..e864ef9 100644 --- a/js/ui/nopaint.js +++ b/js/ui/nopaint.js @@ -1,23 +1,31 @@ var nopaint = (function(){ - var is_paint = false - 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.autoplay(true) + nopaint.turbo() + } controls.paint = new Tool (nopaint_paint_el) controls.paint.use = function(state){ - nopaint.play() + 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.pause() + nopaint.autoplay(false) nopaint_pause_el.classList.toggle("hidden", true) focused = canvas.aa[0][0] } @@ -26,7 +34,8 @@ var nopaint = (function(){ oktween.raf = function(){} var nopaint = {} - nopaint.delay = 100 + nopaint.delay = nopaint.normal_delay = 100 + nopaint.turbo_delay = 20 nopaint.tool = null nopaint.tools = {} nopaint.keys = [] @@ -43,12 +52,12 @@ var nopaint = (function(){ } nopaint.no = function(){ undo.undo() - nopaint.play() + nopaint.paint() } - controls.paint.lex.raw_key = nopaint.raw_key = keys.left_right_key(function(n){ + nopaint.raw_key = controls.paint.lex.raw_key = keys.left_right_key(function(n){ if (! nopaint.timeout) return - if (n > 0) nopaint.play() - else if (n < 0) nopaint.no() + if (n < 0) nopaint.no() + else if (n > 0) nopaint.paint() else nopaint.pause() }) nopaint.pause = nopaint.blur = function(){ @@ -56,7 +65,7 @@ var nopaint = (function(){ nopaint.timeout = 0 nopaint.step = 0 } - nopaint.play = function(){ + nopaint.paint = function(){ var state = undo.new() delete state.focus nopaint.pause() @@ -92,12 +101,164 @@ var nopaint = (function(){ nopaint.regenerate_weights = function(){ nopaint.sum = 0 nopaint.weights = [] - nopaint.keys = Object.keys( nopaint.tools ).sort(function(a,b){ return b-a }) + nopaint.keys = Object.keys( nopaint.tools ).sort(function(a,b){ return nopaint.tools[b].opt.weight-nopaint.tools[a].opt.weight }) 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, + 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 = nopaint.is_turbo ? randrange(300, 700) : randrange(400, 800) + 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(3,7)) return + np = 0.3 + pp = 0.4 + } + else { + if (steps < randrange(2,4)) return + np = 0.1 + pp = 0.2 + } + } + if (nopaint.tool.is_shader) { + switch (nopaint.tool.name) + case "rotate": + case "scale": + np = 0.2 + pp = 0.2 + break + default: + np = 0.3 + pp = 0.2 + } + } + if (nopaint.tool.is_fill) { + np = 0.4 + pp = 0.1 + } + + 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 */ @@ -216,7 +377,7 @@ var nopaint = (function(){ 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(" ") @@ -253,11 +414,12 @@ var nopaint = (function(){ }) var EraseBrush = SolidBrush.extend({ - type: "random", + type: "erase", iterate: function( last_brush ){ - this.bg = 0 + this.reorient( last_brush ) + this.bg = random() < 0.5 ? colors.white : colors.black this.char = " " - this.random() + this.resize(3,2) }, }) @@ -314,6 +476,8 @@ var nopaint = (function(){ var CloneBrush = SolidBrush.extend({ type: "clone", + is_clone: true, + reset: function( last_brush ){ this.opt.max_radius = randrange(5, 20) this.reorient( last_brush ) @@ -381,6 +545,7 @@ var nopaint = (function(){ var FillTool = NopaintTool.extend({ type: "fill", rate: 25, + is_fill: true, start: function(){ this.fill() }, @@ -420,6 +585,7 @@ var nopaint = (function(){ dx: 0, dy: 0, speed: 3, + is_shader: true, is_recursive: false, start: function(){ undo.save_rect(0, 0, canvas.w, canvas.h) @@ -579,5 +745,7 @@ var nopaint = (function(){ nopaint.toggle(true) + nopaint.player = new StylePlayer () + return nopaint })() |