psd.js

A Photoshop PSD file parser in Javascript for browsers and NodeJS

About

psd.js is a general purpose file parser for PSD files created in Photoshop. Given a PSD file, it can parse out information such as image size and color modes, image resources, layer info, image contents, etc.

The psd.js source files are written in Coffeescript and hosted on Github.

Goals

psd.js is far from finished, but it also has a great start. Some goals of the project are:

• Output flattened image to PNG
• Output image to HTML canvas
• Selectively enable/disable layers for export
• Extract image contents of single layers

http://meltingice.github.com/psd.js

The SLR Camera Simulator

Enyo

Enyo is an open source object-oriented JavaScript framework emphasizing encapsulation and modularity. Enyo contains everything you need to create a fast, scalable mobile or web application:

• Built from the ground-up for mobile first
   - Enyo powers webOS, and was designed from the beginning to be fast and work great on mobile devices
• Now available for desktop and cross-browser development
   - Enyo 2.0 now runs across mobile environments and desktop browsers including Chrome, Firefox, and Internet Explorer
• Highly customizable and extensible
   - Enyo core can be expanded with modules, UI widgets, and more
• Lightweight and fast
   - Enyo 2.0 core is about 13KB gzipped, and built for fast application rendering and performance
• Simple, self-contained, and easy to digest
   - Build increasingly complex functionality starting with simple, reusable components
• Built to scale
   - Enyo was created on the principles needed to build vast, complex mobile and web applications
• Open Source
   - Enyo is available under the Apache License, Version 2.0.

http://enyojs.com

Pure javascript / HTML5 canvas bilinear image interpolation

This code is written to be easy to read, there’s plenty of room for optimization. First, the inner function call in the inner part of the two-levels pixel processing loop is probably a performance killer.
http://www.philou.ch/pic/fear_makes_the_wolf_look_bigger.jpg
http://www.philou.ch/playground.html

http://www.philou.ch/js-bilinear-interpolation.html

A Beautiful Boilerplate for Responsive, Mobile-Friendly Development

What Is It?

Skeleton is a small collection of CSS & JS files that can help you rapidly develop sites that look beautiful at any size, be it a 17" laptop screen or an iPhone. Skeleton is built on three core principles:

Responsive Grid Down To Mobile

Skeleton has a familiar, lightweight 960 grid as its base, but elegantly scales down to downsized browser windows, tablets, mobile phones (in landscape and portrait). Go ahead, resize this page!

Fast to Start

Skeleton is a tool for rapid development. Get started fast with CSS best practices, a well-structured grid that makes mobile consideration easy, an organized file structure and super basic UI elements like lightly styled forms, buttons, tabs and more.

Style Agnostic

Skeleton is not a UI framework. It's a development kit that provides the most basic styles as a foundation, but is ready to adopt whatever your design or style is.

http://getskeleton.com

Cross Browser HTML5 Progress Bars In Depth

As a web application developer, progress bars are great when you want to show the user that some action is happening, especially when it can take a long time. They can be animated (like the one in Gmail does when it shows the user how long it is going to take for it to load and initialize), or static (like some shopping cart applications have to show the user how many pages it will take to check out an order). I used to create progress bars using 

 tags, CSS and a litle bit of math, but now I like to do it the HTML5 way using the  tag. This article will discuss how this tag is rendered by default in all operating systems and browsers and how to style the progress tag with CSS, even in browsers that don’t officially support the it. It will also discuss some interestinglimitations of all the browser implementations amd show some interesting examples using advanced CSS3 techniques.


http://www.useragentman.com/blog/2012/01/03/cross-browser-html5-progress-bars-in-depth

How to create HTML5 applications on Windows Phone thanks to PhoneGap

We will first see in this article what the added values of PhoneGap for HTML5 applications are. We’ll then discover how to create our very first project where we will retrieve the accelerometer’s values from our JavaScript code. At last, we will review a complete HTML5 gaming sample almost ported as-is to PhoneGap to use the accelerometer available on the Windows Phones.  

1. Introduction
2. PhoneGap: a framework filling the gap
3. Let’s create our first PhoneGap project
4. Getting the accelerometer’s values from JavaScript
5. Review of a complete sample with the HTML5 Platformer game
   1. Forcing the landscape orientation
   2. Handling various resolutions
   3. Loading the levels with calls to the file system instead of using XHR
   4. Modification of the gameplay to use the accelerometer
   5. Screenshots of the result and FPS on some phones
   6. Complete Visual Studio Solution to download
6. Conclusion

http://blogs.msdn.com/b/davrous/archive/2011/12/23/tutorial-how-to-create-html5-applications-on-windows-phone-thanks-to-phonegap.aspx