OLD | NEW |
| (Empty) |
1 require '../scripts/vendor/mootools.js' | |
2 ready = require '../scripts/vendor/ready.js' | |
3 now = window.performance?.now?.bind(window.performance) or Date.now | |
4 | |
5 ready -> | |
6 info = document.id 'info' | |
7 video = document.id 'video' | |
8 button = document.id 'go' | |
9 sample = document.id 'sample' | |
10 | |
11 gif = new GIF | |
12 workers: 4 | |
13 workerScript: '/gif.js/gif.worker.js' | |
14 width: 600 | |
15 height: 337 | |
16 | |
17 startTime = null | |
18 sampleInterval = null | |
19 | |
20 sampleUpdate = -> | |
21 sampleInterval = parseInt sample.value | |
22 gif.abort() | |
23 document.id('info').set 'text', """ | |
24 ready to start with a sample interval of #{ sampleInterval }ms | |
25 """ | |
26 | |
27 video.addEventListener 'canplay', -> | |
28 button.disabled = false | |
29 sample.disabled = false | |
30 sampleUpdate() | |
31 | |
32 sample.addEvent 'change', sampleUpdate | |
33 | |
34 button.addEvent 'click', -> | |
35 video.pause() | |
36 video.currentTime = 0 | |
37 gif.abort() | |
38 gif.frames = [] | |
39 video.play() | |
40 | |
41 gif.on 'start', -> startTime = now() | |
42 | |
43 gif.on 'progress', (p) -> | |
44 info.set 'text', "rendering: #{ Math.round(p * 100) }%" | |
45 | |
46 gif.on 'finished', (blob) -> | |
47 img = document.id 'result' | |
48 img.src = URL.createObjectURL(blob) | |
49 delta = now() - startTime | |
50 info.set 'text', """ | |
51 done in | |
52 #{ (delta / 1000).toFixed 2 }sec, | |
53 size #{ (blob.size / 1000).toFixed 2 }kb | |
54 """ | |
55 | |
56 # this might not be the best approach to capturing | |
57 # html video, but i but i can't seek since my dev server | |
58 # doesn't support http byte requests | |
59 timer = null | |
60 capture = -> | |
61 info.set 'html', "capturing at #{ video.currentTime }" | |
62 gif.addFrame video, {copy: true, delay: sampleInterval} | |
63 | |
64 video.addEventListener 'play', -> | |
65 clearInterval timer | |
66 timer = setInterval capture, sampleInterval | |
67 | |
68 video.addEventListener 'ended', -> | |
69 clearInterval timer | |
70 gif.render() | |
OLD | NEW |