remove all save/restore pairs!

scripts/act2/Act2_BG.js

@@ -318,7 +318,7 @@ function BG_Party(){
 
 	self.draw = function(ctx, delta){
 
-		ctx.save();
+		var oldAlpha = ctx.globalAlpha;
 
 		for(var i=0; i<self.layers.length; i++){
 			var layer = self.layers[i];
@@ -329,7 +329,7 @@ function BG_Party(){
 			}
 		}
 
-		ctx.restore();
+		ctx.globalAlpha = oldAlpha;
 
 	};
 

scripts/act3/Act3_BG.js

@@ -294,7 +294,7 @@ function BG_Rooftop(){
 	var vibrateTicker = 0;
 	self.draw = function(ctx, delta){
 
-		ctx.save();
+		var oldAlpha = ctx.globalAlpha;
 
 		if(!self.hospitalSprite.visible){
 
@@ -319,7 +319,7 @@ function BG_Rooftop(){
 
 		}
 
-		ctx.restore();
+		ctx.globalAlpha = oldAlpha;
 
 	};
 

scripts/act4/Act4_BG.js

@@ -521,7 +521,7 @@ function BG_Act4(){
 
 			/////////////////////////////////////////
 
-			ctx.save();
+			var oldAlpha = ctx.globalAlpha;
 
 			for(var i=0; i<self.layers.length; i++){
 				
@@ -538,7 +538,7 @@ function BG_Act4(){
 				}
 			}
 
-			ctx.restore();
+			ctx.globalAlpha = oldAlpha;
 
 		}
 

scripts/game/Character.js

@@ -138,9 +138,10 @@ function Character(spriteConfig, animLoops){
 		var c = self.characterFrames;
 
 		// ALLOW PARALLAX???
-		ctx.save();
+		var xMoved = 0;
 		if(self.ALLOW_PARALLAX){
 			ctx.translate(self.x, 0);
+			xMoved += self.x;
 		}
 
 		// Attacked? SHAKE WHOLE CONTEXT
@@ -150,6 +151,7 @@ function Character(spriteConfig, animLoops){
 				var shakeAmp = (shakeDuration-attackedTimer)/shakeDuration;
 				var shakeX = Math.sin(attackedTimer*Math.TAU*10)*shakeAmp*10;
 				ctx.translate(shakeX, 0);
+				xMoved += shakeX;
 			}
 		}
 
@@ -253,7 +255,9 @@ function Character(spriteConfig, animLoops){
 			}
 
 		}
-		ctx.restore();
+		
+		// Instead of save / restore, just move back the amount that we moved!
+		ctx.translate(-xMoved, 0);
 
 	};
 	var iconAlpha_HACK = 0;

scripts/game/Game.js

@@ -1024,8 +1024,7 @@ Game.updateCanvas = function(DELTA){
 	// For retina
 	var ctx = Game.context;
 	ctx.clearRect(0,0,ctx.canvas.width,ctx.canvas.height);
-	ctx.save();
-	ctx.scale(2,2);
+	ctx.scale(2, 2);
 
 	// Update/Draw all kids
 	Game.scene.children.forEach(function(child){
@@ -1036,7 +1035,7 @@ Game.updateCanvas = function(DELTA){
 	});
 
 	// Restore
-	ctx.restore();
+	ctx.scale(0.5, 0.5);
 
 	// Draw HP
 	HP.draw();

scripts/game/HP.js

@@ -106,7 +106,8 @@ function HitPoints(){
 	self.rightRed = self.rightWhite = 1;
 	self.drawHalf = function(ctx, isRight){
 
-		ctx.save();
+		var movedY = 0;
+		let oldCompositeOp = ctx.globalCompositeOperation;
 
 		// Which side?
 		var side = isRight ? "right" : "left";
@@ -120,6 +121,7 @@ function HitPoints(){
 			var amp = self[side+"Shake"]/7;
 			var shakeY = Math.sin(self[side+"Shake"]*1.3)*amp;
 			ctx.translate(0,shakeY);
+			movedY += shakeY;
 			self[side+"Shake"]--;
 		}
 
@@ -174,14 +176,14 @@ function HitPoints(){
 		}
 
 		// Restore
-		ctx.restore();
+		ctx.translate(0, -movedY);
+		ctx.globalCompositeOperation = oldCompositeOp;
 
 	};
 	self.draw = function(){
 
 		var ctx = self.context;
 		ctx.clearRect(0,0,ctx.canvas.width,ctx.canvas.height);
-		ctx.save();
 		ctx.scale(2,2);
 
 		// Draw Left & Right Sides
@@ -198,7 +200,7 @@ function HitPoints(){
 		var sx=0, sy=200*3, sw=720, sh=200; 
 		ctx.drawImage(self.image, sx,sy,sw,sh, 0,0,sw/2,sh/2);
 
-		ctx.restore();
+		ctx.scale(0.5, 0.5);
 
 	};
 

scripts/game/Sprite.js

@@ -82,8 +82,6 @@ function Sprite(config){
 		if(!self.visible) return; // nah
 		if(self.alpha==0) return; // also nah
 
-		ctx.save();
-
 		// Which part of image to draw?
 		var sx = self.currentFrame % self.grid.width;
 		var sy = Math.floor((self.currentFrame - sx)/self.grid.width);
@@ -104,6 +102,7 @@ function Sprite(config){
 		ctx.rotate(self.rotation);
 
 		// Alpha
+		var oldAlpha = ctx.globalAlpha;
 		ctx.globalAlpha = self.alpha;
 
 		// Draw it!
@@ -113,7 +112,10 @@ function Sprite(config){
 			-self.anchor.x, -self.anchor.y, fw/2, fh/2
 		);
 
-		ctx.restore();
+		ctx.rotate(-self.rotation);
+		ctx.scale(1 / scaleX, 1 / scaleY);
+		ctx.translate(-dx, -dy);
+		ctx.globalAlpha = oldAlpha;
 
 	};
 

scripts/intermission/Intermission_BG.js

@@ -35,11 +35,9 @@ function BG_Intermission(STAGE){
 	};
 
 	self.draw = function(ctx){
-		ctx.save();
 		self.bgSprite.draw(ctx);
 		self.youwinSprite.draw(ctx);
 		self.bbSprite.draw(ctx);
-		ctx.restore();
 	};
 
 	var _subscriptions = [];