Function organisation in larger scale projects.

[FelixMcFelixFelix]

Hi everyone!

 

I'm looking into extending a Ludum Dare project into something larger scale, and I was wondering the best way to reorganise my code structure to keep me sane. Right now each state goes into its own JavaScript file, with each state defined like so:

if(window.States == null) window.States = {};States.Game = function(game) {    //...    //Game State variables    //...}States.Game.prototype = {    //...    //Phaser functions    update: function(){        },    //...    //...    //Helper functions    bulletFactory: function(x, y, xV, yV){    },    //...}

The major issue here is that the code for this runs 800 or so lines long right now, with many different functions for different purposes. I'd like to delegate out multiplayer code, hit detection code, etc. to different files somehow, so that I can keep a decent sense of structure within my code. How do you go about doing this without having to account for asynchronous loading on browsers and other external factors?

 

Thanks!

[lewster32]

Browsers will load and execute JavaScript in the order that you include the script tags, and if you listen for the load or document ready events, then you can initialise your code once it's all ready. Another, better way to do this is to use a tool like Grunt or Gulp to concatenate your code into a single file (it can do this automatically by watching for changes to your separate source files) which negates the issue of load order.

 

As for how you lay your code out, take a look at the Phaser source itself, as that represents a pretty good way to lay out a large JavaScript project.

[ranska]

Hi I do ludum dare with same kind of case. How to scale project.

 

In our case we split state into more than one function (in many file and save it in component directories)

Then i use mixin technique to agreagate the wall stuff into one state.

 

http://coffeescriptcookbook.com/chapters/classes_and_objects/mixins

 

grunt is good you can try sproket with asset pipeline (depend on your server side stack).

https://github.com/sstephenson/sprockets

there is ruby and php versions.

 

 

Here an explained shoot screen of my current project

 

Note: my guide line are 54line of code max (max for my screen, scrolling to much indicate complexity).

 

As allways if you want to pair with me in phaser/coffeescript you can send me a message.

[FelixMcFelixFelix]

Hey, thanks a lot everyone! I'll have a look into Grunt, it kinda reminds me of Apache Ant but it looks powerful enough. I'm going to read up on it, then compare against the Phaser build script to work out how to get started.  The CoffeeScript solution looks interesting, but I'd need to rewrite my existing codebase to pull that one off I'm afraid.

 

Cheers!