[javascript]Luv.js

[kikito]

Due to work reasons, I've been dusting off my javascript for the last two weeks or so. The best way I know to learn (in this case, re-learn) a language is making a game engine with it.

So, I've been doing Luv.js: https://github.com/kikito/luv.js

It's an html5 game framework inspired by LÖVE. When I say it's inspired, I mean that it feels similar to LÖVE, but it doesn't attempt to mimic LÖVE's API exactly (for example, I'm not doing any OpenGL stuff, like shaders etc, since I don't enjoy it - I use 2d canvases instead).

I would not call it even an alpha yet, since basic functionality is missing. The most glaring one is probably sound. I'm still not sure about whether including sound in an html5 game is worth it. I personally don't appreciate websites making sound (even when they are games) and the sound support in browsers is broken due to stupid licensing issues. EDIT: Luv.js has had sound for a while now.

You can see some usage examples on the examples folder. Feel free to comment, I'm still learning the language.

Beware that I might drop the project at any moment. My main drive for creating it was not "having a complete and awesome game framework", but rather "practicing javascript". It has helped a lot on that regard.

Some things I like about javascript over Lua:

• Post-decrement operators (i++). I would have preferred if they were statements, not expressions, though.
• Functions can be bound - javascript's usage of "this" adds a bit of complexity to the language, but I prefer it to Lua's syntax-oriented solution ( foo:bar() )
• The ecosystem is very rich. Since node.js was introduced, lots of tools have emerged. They help alleviate the language shortcomings a little.

Don't misunderstand me; I still think Lua is a better language, and javascript is hilariously broken in lots of places. But it gets some things right too.

[Inny]

A strange design pattern you can use in javascript is the Module Pattern, which helps you load code in asynchronous ways. Not really useful for games, but since you're "learning javascript", it's worth knowing. The entire file of a module would look like so:

Code: Select all

Module = (function(exports) {

  // code here

  return exports;

})(Module || {});

This accomplishes several important things:
1. You can use the var keyword freely inside the function. Outside the bounds of a function, it's hard to know where variables are bound.
2. Multiple files can add functionality to the module without worrying about load order as each can be first.
3. Easy aliasing of features. For instance, and I've had to deal with this once, you may have multiple versions of the same library loaded (like jQuery). This lets you set which one you want to use by tweaking the parameter lists.

As for the code in terms of functionality, it looks very neat. I've wanted to write one of my own, but could never get enough interest in html5 for gaming to do so.

[kikito]

Thanks for the comments, Inni!

Re: The module system, right now luv.js is contained inside one of those "anonymous functions that you just create to have an extra scope".

Code: Select all

(function(){
...
Luv = ...; // The only global variable
...
})();

It does not appear in 'src', but it's included on the generated luv.js and luv.min.js files (The Gruntfile manages that).

Any vars I declare are inside that scope. It's true that I could have some issues if two files declared to vars with the same name on the root level, but I'm ok with that. I also don't need any external dependencies, so I don't need to make aliases.

As for the code in terms of functionality, it looks very neat. I've wanted to write one of my own, but could never get enough interest in html5 for gaming to do so.

Thanks! If you are not willing to write one of your own, but are somewhat intrigued, consider sending me a pull request!

[kikito]

Update: I have created a (quite awesome, I might add) testing page for Luv.js:

http://kikito.github.com/luv.js/examples/

It can load example files, and also allows hot-reloading of code.

It works very nicely on the latest chrome, and works ok on firefox (although for some reason animations are "jerky"). It might work on recent versions of IE, but honestly I didn't bother to try it (yet).

Any feedback is welcome. Thanks!

[master both]

This has been the only reason why i started to learn javascript, its really good and easy to use. Keep up the good work

[szensk]

Very impressive set of examples. Runs quite well on Chrome. The instant feedback is really impressive, could be great for prototyping solutions...

[kikito]

Thanks a lot for the comments guys. I'm glad you liked it.

[T-Bone]

Looks really cool!

About adding sounds, I think it's something that all game engines should have, even if they target the web. As long as it's easy to mute it, it's fine. I don't think YouTube would have succeeded without sound, for example. And Robot Unicorn Attack too, to bring up a game example.

That said, I understand if you don't want to implement it for practical reasons.

[kikito]

About adding sounds, I think it's something that all game engines should have, even if they target the web. As long as it's easy to mute it, it's fine.

I agree completely. Luv.js already supports sound. It's possible to mute them, but it's not as easy as I'd like. I should have a main volume control. Thanks for the feedback!

[osa1]

Just wanted to say I'm using Luv.js for a Real Project™ and it's great, thanks.