city41 / breakouts Goto Github PK
View Code? Open in Web Editor NEWA collection of JS engine implementations of Breakout
Home Page: http://jsbreakouts.mattgreer.dev
A collection of JS engine implementations of Breakout
Home Page: http://jsbreakouts.mattgreer.dev
On a first gen iPad (running iOS 5.1.1), the Quintus version fails to register a tap.
After the title screen loads, tap to start the game.
expected: game starts
actual: tap appears to be ignored. No errors in the console, and the game remains at the title screen
Oops, looks like I let the level definitions get out of sync. Should remove the spiral level from Lime
In Chrome 30, FriGame only plays a sfx the first time, subsequent plays of that sfx are silent.
In Safari 7, there is no sound at all
I've tried Chrome 41, Internet Explorer 11 and Firefox 37.
I've tried all implementations, including ClojureScript/React.
Everything is working but Frozen implementation (can't start the game).
Hi
This my first real blocker. Couldn't figure out how to create sprites and animations from the tiles.png file. I read the docs and the various official examples. Where they differ from the breakouts case is that they all use a spritesheet dedicated to a single animation. The tiles.png holds static and animated graphics.
In my code when a use the spritesheet to build a single static image (the player's bar) the resulting image is the whole tiles.png image... Can you help me unblock the situation ?
fails to load, probably issues with sound files. Similar to the bug for Impact on WP8.
From 0.3.0 to 0.4.2
The HTML5 game framework Game Closure got out of a years long private beta and is now open-source. At first glance, it looks quite good on feature and documentation. A good implementation candidate for the breakouts project !
The CreateJS and friGame engines are missing from the Feature Comparison table in the home page.
Being the author of friGame, I can tell you what features are implemented in friGame, but I don't know how.
Should point to http://www.createjs.com/#!/CreateJS
Thx
Ian Braid reported this:
"This issue happens when you are moving the paddle and the ball hits the side of the paddle, the ball goes inside of the paddle, and then eventually flings out."
Nothing comes up, just a blank screen.
Note: currently on 0.1.1, and 0.1.4 is the latest version as of this writing.
Never got around to making these better. Adding a bug here as a reminder.
I don't know if this is due to a lack of MelonJS support on Ubuntu Firefox 39, a bug in MelonJS, or if it is a bug that is specific to this project. I have however, tested it on both Windows and OS X using Firefox 39, without any similar issues.
Start the MelonJS Breakout on a first gen iPad running iOS 5. After the title screen loads, tap to start.
expected: goes into level 1
actual: get TypeError: undefined is not a function repeatedly and a blank screen.
The featureComparison page has largely been abandoned. It's built with dojo and is not easy to update.
I think it should get recreated with React and a React grid component, or dropped altogether.
One other thing to consider is when people contribute implementations, they are often a little befuddled by featureComparison. Maybe it was just a bad idea that should go away?
I have implemented breakouts using CutJS (UI), P2.js (physics) and Howler.js (sound):
Play: http://piqnt.github.io/cutjs/examples/game-breakout/
Source: https://github.com/piqnt/cutjs/tree/master/examples/game-breakout
It's around 500 lines of code.
Tiled can also export to JSON. Should add that as a resource in case some engines want to use that.
In the craftyjs implementation, the ball touched a brick then the wall close to it then overlapped the dying brick. Problem : the dying brick animation stopped at this point and the got stucked inside, as if the dying brick still got collisions. Here's 2 screenshots, hoping this makes the explanation clear.
it's on my implementation list ๐
I've been thinking about this and I wonder if it would actually be better to remove the extra ball and paddle shrinking power ups. Or at least one of them.
Same with the four levels, just have two levels.
And also ditch the whole "prerendered vs tile" bg notion that is floating around a bit here and there.
Why? they add complexity to the game without really any benefit. No one actually plays these breakouts. They should be just complicated enough to show a real world-ish use of the engine and nothing more.
Any opinions?
Just adding this so I don't forget. This is a simple change. In the MelonJS version the countdown "bleeps" four times, all other versions three times. Want to make it match the others.
Just wanted to say that I dreamed of something exactly like this : the todoMVC of JS game frameworks/engines/whvr.
The feature comparison is missing some features from Crafty:
Also, Crafty's last version was 0.5.4, in June 2013.
All your sounds have audible clicks, I'm not sure if this is because they were exported improperly, or incorrect implementation in the breakouts themselves. Audio should always start and end at the zero crossing to prevent this. You can accomplish this by either creating an envelope to control sound volume, or by re-exporting the sounds correctly.
Every once in a while the Quintus version will not load. I am using Chrome on OSX. No errors in the console. Refreshing the page will get it to load after this happens.
double buffering is likely not needed and hurts performance
change this:
if (!me.video.init('canvas', 320, 416, true)) {
to
if (!me.video.init('canvas', 320, 416)) {
The simple, but inaccurate "region" based collision detection was used for Lime and Crafty. This results in both velocities being reflected in "diagonal" situations when only one should be most of the time.
Need to implement proper detection and reflect only the x or y velocity as needed.
It's not scaling well, and is hard to update/edit.
The tiled background is causing a lot of performance problems with no real benefit. It can also be seen as a little unfair since Impact has prerendering of layers to get around this.
For now, the Lime version can be ran with 'notile' in the URL to use a prerendered background, ala:
Check out the waffle board for a better view on this effort: https://waffle.io/city41/breakouts
So far 6 engines have been claimed.
It fails to load, craps out about halfway through the progress bar. Probably issue with sound files.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.