DailyJS

Mac OS Screensaver in JavaScript

Alex R. Young

Subscribe

@dailyjs

Facebook

Google+

animation canvas

Mac OS Screensaver in JavaScript

Posted by Alex R. Young on .
Featured

animation canvas

Mac OS Screensaver in JavaScript

Posted by Alex R. Young on .

Bean by Ed Spencer is an animated slideshow that uses Canvas to display images in a similar way to a
well-known Mac OS slideshow. Here's a video example:


Bean
- OS X screensaver using JavaScript & Canvas
from Ed Spencer on
Vimeo.

You can download the code and add your own images. The API looks like
this:

var bean = new Bean({
  imageUrls: [
    'images/DoubleCluster_cs_fleming.jpg',
    'images/NGC660Hagar0_c900.jpg',
    'images/filaments_iac.jpg',
    'images/m78wide_tvdavis900.jpg',
    'images/sunearthpanel_sts129.jpg',
    'images/NGC253_SSRO_900.jpg',
    'images/Ophcloud_spitzer_c800.jpg'
  ],
  canvasId : 'main',
  fillBody : true
});

bean.onReady(function(bean) {
  setTimeout(function() {bean.start();}, 2000);
});

Read more in Ed's blog
post

and view Bean here.