SyntaxError: import declarations may only appear at top level (main.js:1)

[pixelpicosean]

Can you provide some more details?

[SkyzohKey]

I've just cloned the repo and added the following to index.html :

<script type="text/javascript" src="src/game/main.js"></script>

[pixelpicosean]

Sorry that I forgot to put some docs. You need to install the lesser-panda-cli to be able to run it since the engine supports ES6. And you do not need to include the main.js manually since the cli server will do everything for you (ES6 -> ES5, import/export for JavaScript and CSS and inject scripts into HTML).

So all you need to do is:

1. Make sure you have Node.js installed and install the CLI: npm i -g lesser-panda-cli
2. cd path/to/your/game
3. lpanda server
4. Open http://localhost:4000 in your browser and the game shows :smile:

Things you may notice:

1. Scripts and styles will be live-reloaded (automatically refresh the browser)
2. Source maps are generated for debug support
3. You can import CSS styles from JavaScript (magic)

Hope you like the engine :smile:

[SkyzohKey]

Ah, i was trying to package the cli tool by hand xD. Thanks for the mini-doc. I'm currently working on a multiplayer game. If i can manage to make it working using lesser-panda i'll probably contribute a lot to this project, since Panda.js seems to be dead. + ES6 is a way more cumfortable to work with than the ugly Panda.js syntax ;)

Edit:

npm ERR! Linux 4.3.5-300.fc23.x86_64
npm ERR! argv "node" "/bin/npm" "i" "-g" "lesser-panda-cli"
npm ERR! node v0.10.36
npm ERR! npm  v3.7.1
npm ERR! code E404

npm ERR! 404 Registry returned 404 for GET on https://registry.npmjs.org/lesser-panda-cli
npm ERR! 404 
npm ERR! 404  'lesser-panda-cli' is not in the npm registry.
npm ERR! 404 You should bug the author to publish it (or use the name yourself!)

Edit2: npm i -g https://github.com/pixelpicosean/lesser-panda-cli seems to work ;)

[pixelpicosean]

Glad to have the second user. Feel free to ask any questions I'll try my best to help. The engine is still under development but won't change too much since it's already stable for production, I am using it in all of my recent projects.

[SkyzohKey]

Yeah, that worked. "It works!" just shown! Thanks for this engine, could you link me (if they are open-source) to your recents projects please? :)

[pixelpicosean]

Sorry those games (client work) are not published yet. I am thinking about create some open source sample games like what Panda does since we have the second user :smile:

Well let me give you a brief introduction to the engine:

1. Not like Panda, the PIXI code is almost not hacked. I just inject a useful addTo method to DisplayObject and create a custom Animation class if you don't like PIXI.MovieClip either. So you get the FULL PIXI.js.
2. Modules are not going to be load if you don't import.
3. Scripts located inside engine folder are written in ES5 and use CommonJS modules instead for faster recompiling during development. And scripts in any other folders inside src will be transpiled into ES5 with the power of Babel.js.
4. The engine uses RAF based fixed updating, so you can set FPS and frame skips for special cases like improving performance.
5. Audio support is provided by Howler.js, and I've add some helpers to make it easier to work.
6. Some modules have tag based sequences which might be the best feature you can imagine that already exist in this engine. Timers, timelines, updatings are all tagged so that you can only pause some of them instead of everything. Think about such a case that you need to pause the game but still want the pause menu slide in, give a different tag to the slide-in animation and it will just work.

And some introductions to the built-in modules:

1. The basic usage of audio is included in the main.js
2. canvasquery provide a canvas 2d based renderer, but it's not capable with PIXI. Read more about it here. I don't use it actually, maybe someday in the future.
3. Filters and mesh of PIXI is disabled, you can enable them by uncomment related lines in engine/pixi/index.js.
4. polyfill contains some ES6 polyfills.
5. resource-loader brings resource loading functionality which is used by PIXI.js and you probably don't need to use it directly at all.
6. storage provides session and persistent data storage, take a look those files inside and you got it. session and persistent from this module is quite useful but you're not forced to use.
7. analytics is almost the same as the one of Panda.js
8. camera is also the same as the one of Panda.js but I've add zoom/rotate/shake features.
9. core is the most important module, consider it as the game variable of Panda.js
10. device works like game.device of Panda.js
11. eventemitter3 is a fast EventEmitter implementation and is used in PIXI.js and some engine classes.
12. keyboard emits keyboard events, you need to subscribe to get noticed.
13. loader provides assets loading functon addAsset(path, key, settings)
14. physics is almost the same of Panda.js which will be improved soon since I'm preparing to merge my NinjaPhysics plugin into it to provide more features.
15. reactive is a wrapper of Kefir.js, which is used for Reactive Programming. I am heavy FRP user so this is the most important module to me. Timers are replaced with built-in timer which makes it pretty useful.
16. renderer is just the base object of renderer, if you import PIXI or canvasquery related renderer instance will be added to this object.
17. resize provides some resize helper functions
18. rnd is a random number generator like the one of Phaser
19. scene exports the Scene class. Scenes should all be sub-classes of it.
20. timeline is the Tween animation support, basic usage is included in the main.js
21. timer is quite useful, use Timer.later or Timer.interval to create instances
22. utils provide some math and list helpers.
23. vector provide a Vector class that is used everywhere (I replaced the PIXI.Point with it), such as PIXI.DisplayObject.position.