js in thephotolabs

js in thephotolabs

0 0


A brief overview of the (many) JS libs used in construction of ThePhotoLabs.com

On Github Octo-Labs / js-in-thephotolabs

js in thephotolabs

A brief overview of the (many) JS libs used 

in the construction of ThePhotoLabs.com

What IS ThePhotoLabs?

A web app for HDR photographers.

What IS HDR Photography?

HDR = High Dynamic Range

A better Question : WHY HDR?

Eyes are fantastic optical instruments.
Cameras are not as good.
And kind of dumb.

You Don't Want This

OR This


A method to try to overcome
the suckiness delta between 
cameras, monitors, and printers
the human eye.

Basic Utility Libs

  • JQuery - Cross browser abstraction, DOM selection/manipulation, AJAX
  • JQueryUI - Datepicker, Draggable, Droppable, Effect Fade, Selectable, Slider, Sortable
  • Backbone.js - Client side MVC (OK, mostly just MV, not so much C)
  • Underscore.js - Required by Backbone
  • Twitter Bootstrap - Tabs, Modals, Accordions, Drop Downs, Tooltips

Yes, You're Right

That *IS* a lot of 'utility' libraries.


Load only a portion of the content on navigation events.
Not the entire page.
Avoids extra JS/CSS parsing and setup.
Used for gallery navigation (among other things).


Drag & Drop Uploads


Real time push notifications.
Trigger events on the client directly from your server.

JQuery Gritter

Growl type pop up notifications.
Receive events from Pusher and trigger Gritter.


Awesome select lists

JQuery UI Touch PUnch

Punch some touch friendlyness
into JQuery UI.

Backbone Paginator

Pagination for Backbone collections.

caman JS

Image manipulation via <canvas>


More image manipulation.
Only used to build histograms.
Luckily they provide a customized mini build.

And Finally

Completely unrelated to anyting....


Make your commit history epic!

Thanks For Watching!

Jeremy Green