This is the example code and book exercises from Foundation HTML5 Animation with JavaScript, http://amzn.com/1430236655?tag=html5anim-20
The demos are available online to play with at http://lamberta.github.io/html5-animation/
The entire archive is available for download; either unpack the zip file, html5-animation.zip, or use the following git command at your terminal prompt:
git clone git://github.com/lamberta/html5-animation.git
You are free to use this source code as you wish. For a detailed explanation of each exercise, or if you find these listings helpful and would like to support our work, please consider buying the book.
And if you enjoy the book, please spread the word and write a review.
Foundation HTML5 Animation with JavaScript, by Billy Lamberta and Keith Peters, covers everything that you need to know to create dynamic, scripted animations using the HTML5 canvas. It provides information on all the relevant math you'll need, before moving on to physics concepts like acceleration, velocity, easing, springs, collision detection, conservation of momentum, 3D, and forward and inverse kinematics. Foundation HTML5 Animation with JavaScript is a fantastic resource for all web developers working in HTML5 or switching over from Flash to create standards-compliant games, applications, and animations that will work across all modern browsers and most mobile devices, including iPhones, iPads, and Android devices.
What you'll have fun learning:
- All the JavaScript and HTML5 code (including math and trigonometry functions) you'll need to start animating with code.
- Basic motion principles like velocity, acceleration, friction, easing, and bouncing.
- How to handle user interactions via the keyboard, mouse, and touchscreen.
- Advanced motion techniques like springs, coordinate rotation, conservation of momentum, and forward and inverse kinematics.
- All the basic 3D concepts you'll need for 3D in HTML5 (without WebGL)—from simple perspective to full 3D solids, complete with backface culling and dynamic lighting.
One of the great things about this book is that many of the concepts apply not only to JavaScript, but to computer animation in general. All you need is support for a drawing surface and a few simple commands, and you can apply these ideas using whatever programming language you want! And if you do, please send me a message and I'll list it here.
- Dart: https://github.com/financeCoding/dart-html5-animation (Mike Coding)
- C++/SFML: https://github.com/pulpobot/C-SFML-html5-animation (Santiago Alvarez)
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NON-INFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.