Impact

This forum is read only and just serves as an archive. If you have any questions, please post them on github.com/phoboslab/impact

1 decade ago by dungeonmaster

This browser game resizes the canvas and all the entities within extremly smooth when you change the size of browser window. Try it for your self:
http://play.wimi5.com/run/index.html?type=sgs&name=plants-vs-monsters

This game is made with impactjs. It can also resize the canvas and entities but not that smoothly as in the previous example. When you change the size of the browser, there is some delay before everything is scaled.
http://manyland.com/

Is there a way to make it like the first game?
If not, at least how to make like the Manyland?

10 years ago by FelipeBudinich

I use css scaling: (I set my width and height using ImpactMixin, and I start the game loop once game.min.js is loaded instead of using a "onload" event)

//on index.html

	<script type="text/javascript">
		ImpactMixin = {
			config: {
				dimensions: {
					width: 800,
					height: 450
				}
			}
		};
	</script>

//on main.js
	ig.init = function () {

		ig.init.scaleCanvas();
		ig.main('#canvas', ig.Main, 60, ig.config.dimensions.width, ig.config.dimensions.height, 1, ig.Loader);
		window.addEventListener('resize', ig.init.scaleCanvas, false);
	};
	ig.init.scaleCanvas = function () {
		var canvas = document.getElementById('canvas'),
			widthProprotion = (window.innerWidth / ig.config.dimensions.width),
			heightProprotion = (window.innerHeight / ig.config.dimensions.height),
			ratioConstraint = Math.min(widthProprotion, heightProprotion);
		// Scale the canvas
		canvas.style.width = (ig.config.dimensions.width * ratioConstraint) + "px";
		canvas.style.height = (ig.config.dimensions.height * ratioConstraint) + "px";
	};
	return ig.init();

10 years ago by dungeonmaster

Many thanks for the code.

Is ImpactMixin just a variable or is it smt. like a plugin ?

10 years ago by Apiheld

http://impactjs.com/documentation/class-reference/ig-core#impactmixin

10 years ago by dungeonmaster

Yup!

That worked perfectly!

I thought that css scaling somehow slow but it isn't.

I wonder if this also works for with Ejecta.

10 years ago by FelipeBudinich

Probably It doesn't work on Ejecta since there is no DOM, and i haven't played around with it enough to provide an alternate method
Page 1 of 1
« first « previous next › last »