gphoto2
Version:
Node.js wrapper for libgphoto2
82 lines (72 loc) • 2.95 kB
HTML
<html>
<body>
<canvas id="preview" width="1056" height="704"></canvas>
<div id="downloads"></div>
<script type="text/javascript" src="//www.google.com/jsapi"></script>
<script type="text/javascript" src="/js/dat.gui.js"></script>
<script type="text/javascript" src="/js/superagent.js"></script>
<script type="text/javascript">
google.load('jquery', '1.7.1');
</script>
<script type="text/coffeescript">
request = superagent
class GPhoto
startPreview: ()->
canvas = document.getElementById "preview"
context = canvas.getContext("2d")
image = new Image()
onload = ()->
context.drawImage(image, 0, 0, canvas.width, canvas.height)
image.src = '/preview'+Date.parse(new Date())
image.src = '/preview'
$(image).bind 'load', onload
onload()
stopPreview: ()->
$('#img').unbind('load')
loadSettings: (cb)=>
request.get('/settings').then (settings)=>
cb JSON.parse(settings.text) if cb
enumSettings: (settings, gui)=>
unless gui
gui = @gui
$.each settings, (key, val)=>
if val.type in ['window', 'section']
@enumSettings val.children, gui.addFolder val.label
else
foo ={}
foo[val.label] = val.value
changeFn = (newValue)->
console.log val.label, "changed to", newValue
request.put("/settings/#{key}", newValue:newValue).then (response)->
console.log response
if val.type is 'string'
gui.add(foo, val.label).onChange changeFn
else if val.type is 'toggle'
foo[val.label] = val.value != 0
gui.add(foo, val.label).onChange (newValue)->
request.put("/settings/#{key}", newValue: (if newValue then 1 else 0)).then (response)->
console.log response
else if val.type is 'choice'
gui.add(foo, val.label, val.choices).onChange(changeFn)
else if val.type is 'range'
gui.add(foo, val.label, val.min, val.max, val.step).onChange(changeFn)
displaySettings: ()=>
@gui = new dat.GUI() unless @gui
foo =
'Start live preview' : ()=>
@startPreview()
'Take picture': ()=>
request.get('takePicture', download:false).then (res)=>
console.log res
if res.text
$('<a>').attr('href', res.text).text(res.text).appendTo($('#downloads')).css('display':'block')
@gui.add foo, 'Take picture'
@gui.add foo, 'Start live preview'
@loadSettings @enumSettings
window.gphoto = new GPhoto()
window.gphoto.displaySettings()
</script>
</script>
<script type="text/javascript" src="/js/coffeescript.js"></script>
</body>
</html>