Legacy ImpactJS

[gotnull]

I have a legacy iOS game written in ImpactJS. I'd like to use the latest version of Ejecta although I'm unable to find what I need to replace when it comes to using ejecta.require:

I used to use the following:

// Enable crisp nearest-neighbor scaling instead
// of the default bilinear scaling.
canvas.imageSmoothingEnabled = false;

ejecta.require('lib/impact/impact.js');
ejecta.require('lib/game/main.js');

Although I receive the following error:

TypeError: ejecta.require is not a function. (In 'ejecta.require('lib/impact/impact.js')', 'ejecta.require' is undefined) at line 5 in index.js

What's the recommended way to include the lib/impact and lib/game folders?

And also what should I use instead of:

canvas.imageSmoothingEnabled = false;

[phoboslab]

ejecta.require() has been renamed to ejecta.include() as to not be confused with the CommonJS Style require(). So just use:

ejecta.include('lib/impact/impact.js');
ejecta.include('lib/game/main.js');

imageSmoothingEnabled is a property on the Canvas Context, not on the Canvas itself. So in your Impact Game's init(), you should be able to set it via

ig.system.context.imageSmoothingEnabled = false;

It's been quite a while since I've done anything with Impact/Ejecta, so I hope this is all correct. The docs at https://impactjs.com/ejecta should still be up-to-date, though.

Edit: totally forgot, Impact has some built-in stuff for crisp scaling. See here https://impactjs.com/ejecta/integrating-impact-games#screen-size

[gotnull]

Okay, that all seemed to work and the loading bar appeared although it reaches about 98% and just stops without showing any console errors.

Originally I thought it might be an issue loading sounds but I set ig.Sound.enabled = false and it still sits at 98%.

[phoboslab]

Difficult to say what's causing this without the source. You could try to log all unloaded files by adding

console.log(this._unloaded)

in the loaders draw() method here https://github.com/phoboslab/Impact/blob/master/lib/impact/loader.js#L65 - or in the respective loader class if your game is not using the default. See which resources remain at the end.

[gotnull]

I'll keep at it. Thanks for the unloaded file checking.

If I did want to send you the source at some point where would I send it?

[phoboslab]

Please don't unless you want to pay me :)

I'm happy to answer your questions here publicly, to the benefit of other people having the same problems. So in this case, maybe post the list of assets your game tries to load.

[gotnull]

No problem. I'll let you know thanks. :)

[gotnull]

I managed to get the game loading with the help of console.log(this._unloaded);.

I've got another question now that there's all different types of iOS resolutions. What do you recommend for being able to support all device dimensions considering the following:

ig.main("#canvas", MyGame, 60, ??, ??, ??);

[phoboslab]

Make the canvas as big as the device's screen. There's lots of different ways to do this; what the "right" way is entirely depends on your game.

A simple solution is to chose a fixed screen height and variable width to get the same aspect ratio as the device screen, then scale it up to 100%. Example here: https://impactjs.com/ejecta/integrating-impact-games#screen-size

Note that this may result in a non-integer scaled canvas (e.g. 1.5 scale) which could lead to scaling artifacts. So, you could enforce scaling by an integer and then resize the width and height of your game screen.

Or you ignore all that, take the game's original aspect ratio and scale it up as big as you can to still fit on the device screen. Of course you'll have some black bars, but that might still be appropriate for your game.