background preloader

A Javascript library that makes working with the HTML5 Canvas element easy.

Recent Updates Follow @CreateJS November 2014 Updates in preparation for next release (coming soon).New class model, with big performance increases October 2014 Lots of bug fixes and pull requests.New 'Extras' folder in GitHub with useful tools and classes July 2014 Major overhaul of Graphics to include a useful command pattern, and a big performance increase.Added Graphics.store() / unstore() The Story Why we built EaselJS About EaselJS EaselJS provides straight forward solutions for working with rich graphics and interactivity with HTML5 Canvas. Featured Projects Community Show & Tell. Ion Drift A port of the Flash game Ion Drift, b10b was able to build a CreateJS version in less than a day that hit target framerates on even the lowest devices, and outperformed ports to other libraries. By b10b b10b

http://www.createjs.com/#!/EaselJS

HTML5 Gaming: animating sprites in Canvas with EaselJS - David Rousset - sharing about HTML5, Windows 8 & Gaming When you want to write casual games using the HTML5 Canvas element, you’ll need to find a way to handle your sprites. There are several libraries available to help you writing games such as ImpactJS, CraftyJS and so on. On my side, I’ve decided to use EaselJS which has been used to write PiratesLoveDaisies: an HTML5 Tower Defense game as well as for the very cool Atari Arcade suite.

HTML5 2D game development: Introducing Snail Bait The great thing about software development is that, within reason, you can make anything you can imagine come to life on screen. Unencumbered by physical constraints that hamper engineers in other disciplines, software developers have long used graphics APIs and UI toolkits to implement creative and compelling applications. Arguably the most creative genre of software development is game programming; few endeavors are more rewarding from a creative standpoint than making the vision you have for a game become a reality. Rewarding, however, does not mean easy; in fact, it means the opposite.

blog/angular-express.html AngularJS is like the missing Batarang on your utility belt of web development awesomeness. It gives you two-way data binding that's both easy to use and fast, a powerful directive system that lets you use create reusable custom components, plus a lot more. Express is an excellent webserver for Node.js that provides routing, middleware, and sessions. Incidentally, the two work quite well together! In this tutorial, I'm going to walk through writing a simple blog app with Angular and Express. For this, I'm assuming basic knowledge of Angular and Node. A beginner's guide Sophisticated JavaScript applications can be found all over the place these days. As these applications become more and more complex, it's no longer acceptable to have a long chain of jQuery callback statements, or even distinct functions called at various points through your application. This has led to JavaScript developers learning what traditional software programmers have known for decades: organization and efficiency are important and can make the difference between an application that performs great and one that doesn't.

How to use HTML5′s drag and drop For a long time JavaScript functions have existed that allow us to create drag and drop interfaces, but none of these implementations were native to the browser. In HTML5, we have a native method of creating drag and drop interfaces (with a little help from JavaScript). I’m going to let you in on how to achieve this…

HTML5 Platformer: the complete port of the XNA game to <canvas> with EaselJS - David Rousset - sharing about HTML5, Windows 8 & Gaming After a couple of hours coding with JavaScript, I’ve finally finished porting the XNA 4.0 Platformer game sample to HTML5/Canvas with the help of the EaselJS gaming framework. This article will provide you the game and the story of some of the questions I’ve asked myself while coding it. If you’d like to know how the game works, simply read the JavaScript commented code available at the end of this article. Please note that my main goal was to better learn JavaScript by writing pure JS code (with no form of dependency to the DOM) and to write a cross-browsers working game and cross HTML5 compatible devices when possible also. You can play the game directly inside this iframe (left & right arrows keys to move & W to jump).

Operational transformation Operational transformation (OT) is a technology for supporting a range of collaboration functionalities in advanced collaborative software systems. OT was originally invented for consistency maintenance and concurrency control in collaborative editing of plain text documents. Two decades of research has extended its capabilities and expanded its applications to include group undo, locking, conflict resolution, operation notification and compression, group-awareness, HTML/XML and tree-structured document editing, collaborative office productivity tools, application-sharing, and collaborative computer-aided media design tools (see OTFAQ). In 2009 OT was adopted as a core technique behind the collaboration features in Apache Wave and Google Docs.

Flash Pro & CreateJS Following that is the handleComplete method. This remains almost identical to what was published, except that now it removes the Platypus instance that was on stage. We’ve also enabled touch interactions on our stage, so this game can be played on an iOS device. Quick Tip: In a more complex project, you’d likely get rid of the exportRoot , and add elements to the stage directly. This removes a layer from your display list, which makes elements easier to reference and performs a tiny bit better.

Implementing Native Drag and Drop Drag and Drop is one of those interactions that can really help to make an interface simple to use. There are plenty of JavaScript libraries that can be used to create drag and drop interfaces but what many people don’t know is that all of the major browsers actually have native support for drag and drop. In this blog post you are going to learn how to make use of the native Drag and Drop API in order to create your own Drag and Drop interfaces. Making Elements Draggable To get us started we are first going to take a look at how to make HTML elements draggable.

Learn CreateJS by Building an HTML5 Pong Game The web moves fast - so fast that our original EaselJS tutorial is already out of date! In this tutorial, you'll learn how to use the newest CreateJS suite by creating a simple Pong clone. Final Result Preview Let's take a look at the final result we will be working towards: Click to play Jump into Game Development with the Tower Defense Genre - Dave Bost A common dream of most developers is to develop a game. Game development can be very intimidating to jump into straight away. The hardest decision is to determine what kind of game you’re going to create – what’s the backstory, who are the actors, what’s their purpose, what does success look like, and so on. Once you determine what game you’re going to make, you next need to determine how you’re going to go about making that game.

How to use CocoonJS Improving the HTML5 execution speed is in CocoonJS’ identity. When it comes to mobile web app and game deployment, a lot of problems arise and performance is one of them. Ludei provides the best JavaScript and HTML5 execution environments to choose from depending on the type of your project and the platforms you want to deploy it to. If your project is an HTML5 canvas game CocoonJS provides the most performant canvas 2D and WebGL implementation in the market for iOS and Android. This environment is a highly specialized JavaScript virtual machine with a blazing fast implementation of everything needed to make canvas 2D or WebGL based games shine on mobile! Code Conventions This is a set of coding conventions and rules for use in JavaScript programming. The long-term value of software to an organization is in direct proportion to the quality of the codebase. Over its lifetime, a program will be handled by many pairs of hands and eyes. If a program is able to clearly communicate its structure and characteristics, it is less likely that it will break when modified in the never-too-distant future. Code conventions can help in reducing the brittleness of programs.

Related: