##Contents:
- About
- Screen shots
- Features
- Getting started
- Libraries (Pubs)
- Folder layout
- Documentation
- Google Blog
- Author
- License
- RoadMap
- TODOs
- Further reading
- Showcases
- Contributing
###About Ranger-Dart (Ranger for short) is a game engine written in Dart and slightly modeled after an older version of Cocos2d-js 1.x. Ranger is actually two projects: this project and
##Ranger-Sack (Sack for short).
Ranger is the core piece needed to create games. The Sack isn't needed at all, it simply serves as a goto place for examples covering apps, templates and unit tests.
If you have ever worked with Cocos2D-js then you will recognize a fair amount of the examples. However, several things have changed, most notebly Animations and Messaging.
Initially Ranger's code base was structured similar to Cocos2d. However, after using Dart design patterns and libraries (aka Pubs) the code base diverged and has changed considerably. The only concepts remaining are Scenes, Layers and Scheduler.
Ranger is a game engine currently centric around an HTML5-Canvas and a Scene graph. Rendering of the scene graph is rendered via a Context of type CanvasRenderingContext2D. In the future the WebGLRenderingContext will be supported.
###Screen shots Ranger in action via Sack: ScreenShots and videos
###Features
- Scene graph (heirarchical spatial organization) including space mappings.
- Animations using Universal Tween Engine Pub by Xavier Guzman.
- Message system using EventBus Pub by Marco Jakob.
- Pooling ported from Dartemis: Entity System Framework Pub by Dennis Kaselow.
- Sprites and sprite sheets. (PNG, SVG etc...)
- Particle systems.
- Html5 Canvas rendering.
- Design resolution that is independent of device resolution.
- Scene transitions.
- Optional Updates-per-second for slower devices.
- Examples, starter templates and Unit tests.
Note: if you are interested in an Entity System approach to game development consider Dartemis. It is based off the concept of Data Oriented Design (DOD). Ranger has the ability to add "systems" and feed timing to them so you can effectively code in a hybrid design where some of your code is hierarchical through a scene graph and other portions are more "linear-ish" through DOD. For further reference Artemis.
###Getting started Where to start? Easy, just follow these steps:
- Download the Dart SDK and install it. If you are on a Mac then it is as easy as installing the .dmg.
- Go to GitHub and download Ranger-Sack. To do that choose to either Clone in Desktop or Download ZIP. If choose the Zip option then uncompress it to a location of your choosing. You should now have a folder called "Ranger-Sack".
- Launch the Dart Editor that came with the SDK.
- In the editor navigate to the file menu and choose Open Existing Folder.
- Navigate to the location of either the uncompressed Zip or
- The local Git repository that you cloned to your "desktop".
- With the project open, run one of the Templates called "level0"
- Navigate into the "level0" template folder located under:
web/
applications/
templates/
level0
- Right-click on level0.html and choose Run in Dartium.
Once Dartium (which comes with the SDK) has launched it will automatically navigate to "http://localhost:8080/applications/templates/level0/level0.html" and start running. First you will see a splash scene for 3 seconds and then instaneously transition to a GameLayer with dark blue text displaying "Ranger GameLayer" on a dark grey background.
7. Congratulations. You have successfully installed and ran Ranger!
###Libraries (Pubs) Ranger relies on several Dart Pubs.
- EventBus by Marco Jakob
- Tween Engine by Xavier Guzman
- Vector Math by John McCutchan
- Browser. Every Dartium app relies on this Pub.
Sack relies on Ranger libraries plus several other Pubs
- color_slider_control
- gradient_colorstops_control
- lawndart by Seth Ladd.
###Folder layout Ranger is a Pub and the core code is located under the lib folder. Here is a brief overview:
lib/
ranger/
animation/ -- Tween animation wrapper/helper
audio/ -- AudioEffects. Classic arcade style
core/ -- Pooling and timing (aka the Scheduler)
geometry/ -- (Optional) Basic geometric shapes
mixins/ -- Color, Input behaviors
nodes/ -- The main visuals (Scenes, Layers etc...)
particles/ -- (Optional) particle systems
physics/ -- (Optional) Velocity
rendering/ -- DrawContext (includes default implementations.)
resources/ -- Imageloading and Embedded Base64 resources
sprites/ -- Includes Canvas implementations
utilities/ -- Misc
Basically there are 4 critical folders that matter when developing a game: animation, core, mixins and nodes. Other than that you are not required to use anything else. geometry, particles, physics and even sprites are not required.
The optional folders simply provide examples on how to build Nodes, and they are used mostly for the unit tests and templates.
- Getting started (Google doc)
- Nodes (Google doc)
- Animations (Google doc)
- Scene Graph (Google doc)
- Audio (Google doc)
- Development (--) -- NOT COMPLETE
These docs are not directly related to Ranger. But they could help your game development. They are all a work in progress.
###Google Blog Ranger has a Blog where I periodically post statues.
###Author Hello, I am Will DeVore the current developer of Ranger and Sack. I find it a pleasure working with the Dart language. Its integration with HTML/CSS/Canvas/WebGL is solid and functional.
###License See MIT license
###TODOs Ranger's code is still sprinkled with TODOs. Most are minor in nature. Some of the top areas are:
- Performance. Things like String conversions in places where code runs in tight loops.
- Pause/Resume. I need to add the pause/resume code when Scenes are transitioning. An early version was present but once I replaced the old dispatch code with Dart's Streams that code became obsolete.
- Visibility of browser/tabs. When a tab or the whole browser focus is lost the engine needs to recognize this and pause.
- Accelerometer code.
- Several pieces of code should be optimized to check for dirty flag on transformations. I have slacked off is a few areas--in progress.
- A better more full proof way of handling Infinite animations. At the moment the developer needs to track the Infinite animations. If they are not "killed" then cycles are wasted as the animation continues to animate objects that may be gone or invisible.
###RoadMap There are still manys things that need to be done in Ranger. It will probably never really be complete, nonetheless, I have a list of things that I would like to add as time permits in no particular order.
- WebGL. Ranger has preliminary polymophic support to accomodate WebGL. It is quite possible that an underlying library will be used; perhaps the Three.dart Pub may be a viable candidate. Worst case is to follow something similar to Cocos2dx-3.x.
- Audio (for example: generated 8bit sound via WebAudio)
- Quad tree culling
- Physics with Box2D Pub
- Fullscreen support
- Textures. Assuming WebGL is added.
- Additional transition effects.
- Add things to the Ranger-Sack GitHub repository. This repo will hold extensions to Ranger. For example, collision, zooming, zones, tracking, UI-kit etc.
- Components.
Note: The idea was brought up about UX design. Ranger doesn't enforce any particular approach, but at the same time it would be convenient to have a sample UI-kit that may provide a launching point for coding GUIs in their games. Ranger's Unit tests and Applications (RangerParticles, RangerRocket) use a hybrid approach at the moment. Some icons (of SVG type) use hit testing while pop out panels use HTML. Ranger's goal isn't to be an enforcer but enabler. Every game developer has an idea of what their UX should be and so there is no way a game engine could meet those expectations. Nonetheless, a sample UI-kit would provide ideas on howto wire things up and what options are possible.
###Showcases None at the moment.
###Contributing There is still a fair amount of stuff to do to make Ranger feature complete. Contributing to Ranger would be helpful as the spirit of Ranger is maintained.
End.