Forums » Impact Engine » Disappearing Layers

I'm having an issue with Safari 5.1 & Opera 11.52 on Lion where layers randomly disappear and bullets sporadically start flying. It works in Firefox.

Right now my project is tweaked from the demo, but I don't want to take it farther until these issues are resolved.

I've posted the current version at:
http://buzz.am/buzzam/index.html

Could someone try it out to see if this is a bug in the framework or more likely a bug in my code?

I'm trying it on Google Chrome 15.0.874.106 m :

- after walking couple steps to the right the whole thing disappear and only the white background left.

- walking back to the left, everything reappear again.

some error on console:

Uncaught Error: INDEX_SIZE_ERR: DOM Exception 1
ig.Image.ig.Class.extend.drawTilelib/impact/image.js:156
ig.BackgroundMap.ig.Map.extend.drawTiledlib/impact/background-map.js:234
ig.BackgroundMap.ig.Map.extend.drawlib/impact/background-map.js:121
ig.Game.ig.Class.extend.drawlib/impact/game.js:198
ig.Game.extend.drawmain.js:47
window.ig.Class.extend.prototype.(anonymous function)impact.js:394
ig.Game.ig.Class.extend.runlib/impact/game.js:143
ig.System.ig.Class.extend.runlib/impact/system.js:101
(anonymous function)impact.js:54

On Firefox 4.0.1 and 7.0.1 :
- everything works fine, no error on console too


weird....

Thanks delly for checking trying it out - I'm having the same results.

I don't see anything wrong with the code - I didn't change much from the demo.

You see this error because you're trying to draw a region of an image that is outside the image itself. I.e. say you have an image that's 50x50 pixels and you want to draw the region from 50,0 to 100,50 - which isn't there, since the image is only 50px wide.

In your game you do this by trying to draw the tile 2 of a tileset that only has one tile. From your levels/test.js:

{
	"name":"main",
	"width":16,
	"height":12,
	"linkWithCollision":false,
	"visible":1,
	"tilesetName":"media/Floor.png",
	"repeat":false,
	"distance":"1",
	"tilesize":50,
	"foreground":false,
	"data":[
		[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,2]
//  					   right there ^
		...

Edit: the reason that everything disappears when this happens is, that error is not caught (by a try...catch) and thus the whole function (system.run) just aborts, leaving everything that hasn't been drawn already undrawn for this frame.

Thanks dominic - you are exactly right & that fixed the flickering.

The interesting thing is that Firefox somehow managed to press through the exception - I guess drawImage doesn't throw in Firefox or it somehow manages to recover gracefully from the error.

The lesson learned for me is to be careful when changing images in the editor - especially if you are decreasing the number of sprites.

Hi I have DOM error in Chrome 15.0.874.106.

Uncaught Error: INDEX_SIZE_ERR: DOM Exception 1
ig.Image.ig.Class.extend.drawTileimage.js:156
ig.BackgroundMap.ig.Map.extend.preRenderChunkbackground-map.js:98
ig.BackgroundMap.ig.Map.extend.preRenderMapToChunksbackground-map.js:69
ig.BackgroundMap.ig.Map.extend.drawPreRenderedbackground-map.js:128
ig.BackgroundMap.ig.Map.extend.drawbackground-map.js:118
ig.Game.ig.Class.extend.drawgame.js:198
ig.Game.inject.drawgraph-panel.js:16
proto.(anonymous function)impact.js:365
ig.Game.extend.drawmain.js:252
window.ig.Class.extend.prototype.(anonymous function)impact.js:394
ig.Game.ig.Class.extend.rungame.js:143
ig.System.ig.Class.extend.runsystem.js:101
ig.System.inject.runmenu.js:14
proto.(anonymous function)impact.js:365
(anonymous function)

When I try to prerender background image in debugger.

My background image is 720px and the canvas size is 1200x720 if it matters. It runs OK when not prerendered.

I get the same problem when I attempt to prerender in iOS5 Safari.

Pls help. Thank you!

you could try using powers of 2 for sizes. i dont think it matters for safari but the native (openGL) version of impact is more picky about sizes. so 1024 x 512 etc.

How important is the powers of 2 thing?

The reason I ask is that my current game was developed after watching the pong tutorial and all my sizes have defaulted to multiples of 48.

Maybe I should shift now before I get too committed to the current line.

Any information that could help me settle on a tile size and screen dimension would be appreciated.

Well, the power of 2 does not seem to help. The same error. As I mentioned it is relevant only to some browsers: works OK in latest Firefox, generates DOM error in the latest Chrome and iOS5 Safari.

Having your image size a power of 2 isn't really that important. It is true that iOSImpact needs textures to be a power of 2, but it will enlarge images internally if needed.

Pre-Rendering only makes sense when you have a background map that's made up of a lot of tiles. It combines those tiles into bigger images. From what I understand, your BackgroundMap is only one large (720px) "tile"? Pre-Rendering won't bring any benefits here at all.

Also, repeating BackgroundMaps have to be at least as big as the screen size (so 1200px in your case), to be able to .preRender them properly. But again, I don't think it'll make any difference performance wise in your case.

Dominic, thank you for the tip with prerendering. But I still do not understand why I get the DOM error in Chrome. I have stitched my 720px image into a 2160x720 tileset (I just pick up tiles of 720px in size from this one) and it worked fine when I tried to prerender in Chrome and other browsers. But if I use only one 720px tile -- I get back the DOM error. Why?)

Don't use preRender if it makes no sense.

The default chunk size for pre-rendered background maps is 512px, which is smaller than your 720px and thus brings no benefit at all. More about pre-rendering in this thread.

I think you get this error because of a bug in Impact when using preRender for a repeating(?) background map with only one tile. To be honest, I don't see the need to fix this, because using preRender in this case isn't a good idea anyway :)