[JOB] Web Developer - Portland, OR

27 views
Skip to first unread message

AZAD Technology Consulting

unread,
Oct 22, 2012, 5:05:51 PM10/22/12
to pd...@googlegroups.com

AZAD is hiring a Web Developer with experience in user interface and front end web development to contribute to
the development of a leading edge product UI

The ideal candidate will have the following experience and qualifications:

  • Proven experience with PHP.
  • Working experience with Linux (i.e. SUSE, Redhat, Ubuntu) is preferred.
  • Experience with Javascript, HTML5, JQuery and CSS.
  • Experience with Subversion or Git is desired. 
AZAD offers EXCELLENT EMPLOYEE BENEFITS including Medical & Dental Insurance, Cafeteria Plan, 401K Plan, Credit Union Membership, and Referral Bonus.  www.azad.com 

If you are interested in learning more, please contact Jennifer Auman at 503-617-9490 or jau...@azad.com. 

Wm Leler

unread,
Oct 25, 2012, 2:15:33 AM10/25/12
to pd...@googlegroups.com
I have an web app written in JavaScript that draws a map in a browser based on data arriving from an external source (via an AJAX call).
New data comes in every few minutes. I want to be able to take a screen grab every time I get new data, so I can create an animation.
I want this to happen automatically (triggered by JavaScript) so I can leave it running and have it do a screen capture every few minutes.

This doesn't need to work on different browsers or systems; I just want to be able to create a time lapse video of the imagery produced by this webapp.

So I'm perfectly happy calling the OS X screencapture command to take a frame. How can I call a UNIX command like this from a browser?
Do I need to do something annoying like run a simple server on localhost to fire off screencapture using some server-side script? I can do that,
but I would prefer something really simple. Are there any dead simple browser plug-ins that can execute UNIX commands or shell scripts from JavaScript?
Don't need to worry about security, as only I will be running this.

thanks,

--wm

Jesse Hallett

unread,
Oct 25, 2012, 3:00:42 AM10/25/12
to pd...@googlegroups.com
I think that you can dump the content of an HTML element into a
canvas, or something like that. There is a bit of discussion on that
idea here:

http://stackoverflow.com/questions/10932670/how-do-i-draw-the-content-of-div-on-html5-canvas-using-jquery

Once your content is drawn in a canvas you can use the toDataURL()
method of the canvas element to get a string containing a base64
encoded image. You can upload that to a server using a normal ajax
request. Then you can decode the data into a binary format if you
want to. See the canvas documentation here:

https://developer.mozilla.org/en-US/docs/DOM/HTMLCanvasElement

That should work in any up-to-date non-IE browser.

Alternatively you might be able to use a toBlob() canvas method and
recently-implemented browser support for handling binary data and
binary uploads. The problem there is that from what I can tell
toBlob() is not implemented in most browsers yet. According to this
ticket the feature just landed in Firefox a few days ago and is not in
Chromium yet:

https://code.google.com/p/chromium/issues/detail?id=67587

Wm Leler

unread,
Oct 25, 2012, 10:26:23 AM10/25/12
to pd...@googlegroups.com
I looked into doing this and came up with the same conclusion about toBlob().

Besides, I don't really need to send the screen capture to the server, I just need to invoke the screencapture command from Javascript in a browser.

--wm
> --
> You received this message because you are subscribed to the Google Groups "Portland JavaScript Admirers" group.
> To post to this group, send email to pd...@googlegroups.com.
> To unsubscribe from this group, send email to pdxjs+un...@googlegroups.com.
> For more options, visit https://groups.google.com/groups/opt_out.
>
>

Jeremiah Heller

unread,
Oct 25, 2012, 10:35:21 AM10/25/12
to pd...@googlegroups.com
I haven't used this yet but it looks like phantom.js can do screen grabs: http://phantomjs.org/.

Edwin Knuth

unread,
Oct 25, 2012, 11:24:15 AM10/25/12
to pd...@googlegroups.com

Hi Wm,

I'm assuming you just want to take a time lapse of your map?

Why don't you get it going in the browser and run the screen capture command in a looping shell script?

Do you need to take the shots at irregular intervals?

Ryan Miller

unread,
Oct 25, 2012, 1:57:16 PM10/25/12
to pd...@googlegroups.com
I can verify that the canvas to image to server works well.  yeah, you don't NEED to send the data to the server, but that way seems like it would be less fragile and easier to run repeatedly.

Wm Leler

unread,
Oct 25, 2012, 1:58:26 PM10/25/12
to pd...@googlegroups.com
I'm doing that now, but it takes 24 hours to capture 48 frames of video.

We have lots of historical data so I want to be able to make a time lapse video of the last year
by feeding in the data and then triggering a screen capture. That way I should be able to
make a much longer video in just a few hours.

I'm looking at phantomJS right now and that might work!  Thanks Jeremiah!

--wm

Reid Beels

unread,
Oct 25, 2012, 6:07:09 PM10/25/12
to pd...@googlegroups.com
One thought is to run a some tiny server process on your computer that listens for requests and then shells out to trigger the screenshot. Then the javascript can just poke that URL every time it wants to trigger a shot…

e.g. in ruby, on a mac:

require 'sinatra'

get '/' do
  `screencapture ~/Desktop/#{Time.now.to_i}.png`
end
Reply all
Reply to author
Forward
0 new messages