https://github.com/sebaslogen/kamelo
My first HTML5 game in 2D
https://github.com/sebaslogen/kamelo
box2d javascript
Last synced: 4 months ago
JSON representation
My first HTML5 game in 2D
- Host: GitHub
- URL: https://github.com/sebaslogen/kamelo
- Owner: sebaslogen
- Created: 2013-03-03T16:11:38.000Z (over 12 years ago)
- Default Branch: master
- Last Pushed: 2016-07-13T14:48:02.000Z (almost 9 years ago)
- Last Synced: 2025-01-07T11:12:59.795Z (5 months ago)
- Topics: box2d, javascript
- Language: JavaScript
- Homepage: http://sebaslogen.github.io/kamelo/ProtoKameo1/ProtoKameo1/
- Size: 38.9 MB
- Stars: 2
- Watchers: 3
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
Kamelo: The Handcrafted Animal Party
====================================
Description
-----------
Our first HTML5 game in 2D handcrafted with love and beasts.
Based on the code and topics of course HTML5 Game Development (https://www.udacity.com/course/cs255)
Note: The game works best on the Chrome web browser (www.google.com/chrome)
Authors
-------
- Sound engine and sound FXs: Jose Carlos T. C. (tapisky)
- Game design and implementation: Sebastian L. G. (sebaslogen)
- Play-Doh artwork & graphics: Ale & Sebas
Play the game online
--------------------
Use left and right arrows to move Kami (a.k.a. the beast) and click with the mouse on the fly to catch it!
Can you catch 50 flies to WIN the game?
http://sebaslogen.github.io/kamelo/ProtoKameo1/ProtoKameo1/
or
https://googledrive.com/host/0B1WrYF_rngpJN2c4LV8yWUZ4ckk/index.html
Screenshot: https://raw.github.com/sebaslogen/kamelo/master/capture.png
Source code
-----------
https://github.com/sebaslogen/kamelo
Tasks and bugs management
-------------------------
https://trello.com/board/kamelo/51499e326d78063b490017f9
License
-------
Attribution 3.0 Unported (CC BY 3.0) - http://creativecommons.org/licenses/by/3.0/
Third party libraries
---------------------
- Box2D
Copyright (c) 2006-2007 Erin Catto http://www.gphysics.com
- howler.js
Copyright (c) 2013 James Simpson and GoldFire Studios, Inc.
Released under the MIT License.
- fireworks
Copyright norahiko - http://jsdo.it/norahiko (generated by: jsdo.it - http://jsdo.it/norahiko/52q3)
Licensed under MIT License - http://www.opensource.org/licenses/mit-license.php
- 'fly.wav' Sound used in sound file kame_hi.mp3/ogg
NA MEDIA (http://www.abcministry.com/privacy_policy.php) - Personal Use Only
NA MEDIA Services are made available for your personal, non-commercial use only.
You may not take the results from a search and reformat and display them, or mirror
any NA MEDIA home page or results pages on your Web site.
- Class object based on John Resigs code; inspired by base2 and Prototype
http://ejohn.org/blog/simple-javascript-inheritance/
Game design in a nutshell
-------------------------
- All graphics are handmade, with a combination of Play-Doh handcrafting and digital painting based on the original game concept design https://raw.github.com/sebaslogen/kamelo/master/concept_art.jpg
- Physics library Box2D is used for flies collision but firing detection is done in a much faster and simple way to avoid unnecessary processing.
- Layering on several canvas allows to clear and repaint parts of Kami body without having to use different resources (less bandwidth VS small extra processing).
- Coloration of Kami's body is done using pixel color modifications on the required area of the canvas (avoiding processing of transparent pixels).
- Sound and images are processed in atlases to reduce server requests, only big files are keep separately to allow simultaneous downloads and speed up game loading. Sound is processed with howler.js library
- Assets (sound, images and heavy javascript) are loaded asynchronously to improve initial game load time. Around 1 second for initial paint on screen!
- All sprites and fill patterns that have to be computed are cached once in off-screen canvases to reuse without recalculating. Images are cached to off-screen canvases to improve performance on some browsers.
- Added support to firefox with different mouse events and fps performance improvements (still better in chrome).
Speed and load tests:
http://tools.pingdom.com/fpt/#!/u7fODP5hJ/https://googledrive.com/host/0B1WrYF_rngpJN2c4LV8yWUZ4ckk/index.html