diff options
| author | pepper <peppersclothescult@gmail.com> | 2014-01-21 00:56:21 -0800 |
|---|---|---|
| committer | pepper <peppersclothescult@gmail.com> | 2014-01-21 00:56:21 -0800 |
| commit | 6671e52efea7bf4ee8e45c500166fbc8d865bbdb (patch) | |
| tree | edf17796610012a534e090c06ba7b83c9b4037d6 /js/render.js | |
| parent | f850411f437d3eb9cb1d37456d0eab29a9358918 (diff) | |
| parent | 60a5e5581ccbf05170ccd6bab292562c460a42c2 (diff) | |
mergin again
Merge branch 'master' of ghghgh.us:/home/git/dither into pepper
Diffstat (limited to 'js/render.js')
| -rw-r--r-- | js/render.js | 106 |
1 files changed, 106 insertions, 0 deletions
diff --git a/js/render.js b/js/render.js new file mode 100644 index 0000000..fdb0125 --- /dev/null +++ b/js/render.js @@ -0,0 +1,106 @@ +var frame, img_frame; +var timeout, raf_id, start_t = 0, old_t = 0, pause_t = 0 +var paused = false, dragging = false, rendering = false, scrolling = false, deferring = false, scrollTimeout = null; +var fps = 30; + +function choose (){ + imageURL = this.src + loading = true + $("#url").val(imageURL) + loadImage(imageURL, ready) +} +function load(){ + loading = true + var imageURL = $("#url").val() + loadImage(imageURL, ready) +} + +function ready(){ + loading = false + if (window.gif) { + frame = gif.frames[0] + w = cc.canvas.width = frame.ctx.canvas.width + h = cc.canvas.height = frame.ctx.canvas.height + for (var i=0, f; f=gif.frames[i]; i++){ + f.cloneData = f.ctx.getImageData(0,0,w,h) + } + } + else { + fc = cq(img.width, img.height) + fc.drawImage(img, 0, 0) + frame = img_frame = { ctx: fc.context } + w = cc.canvas.width = frame.ctx.canvas.width + h = cc.canvas.height = frame.ctx.canvas.height + frame.cloneData = frame.ctx.getImageData(0,0,w,h) + } +} + +function giveFrame(t){ + if (window.gif) { + if (gif.currentFrame) { + return gif.frames[gif.currentFrame(t)] + } + else { + return gif.frames[0] + } + } + else if (window.img) { + return img_frame + } + else { + return cq(w, h) + } +} + +function reset(){ + start_t = old_t + pause_t = 0 + pause(false) + $("#rendered img").remove() + draw(0) +} + +function pause(state){ + $("#pause").toggleClass("paused", paused = typeof state == "boolean" ? state : ! paused).html(paused ? "paused" : "pause") +} + +function step_forward(){ + var step = $("#framedelay").float() * 1000 || 100 + old_t += step + draw(old_t) + pause(true) +} + +function animate(t){ + raf_id = requestAnimationFrame(animate); + + var step_t = t - old_t + old_t = t + + if (paused || dragging || rendering || scrolling || deferring) { + pause_t += step_t + if (scrolling) { + scrolling = false + deferring = true + } + else { + deferring = false + } + return + } + + // var timing = +(new Date()) + draw(t) + // timing = +(new Date()) - timing + fps = avg(fps, 1000/step_t, 4) + // status(~~(fps) + " fps") +} + +function draw(t) { + t -= start_t + t -= pause_t + frame = giveFrame(t) + shade(frame, t) +} + +function status(s){ $("#status").html(s); console.log(s) } |
