bigger FlxLightPuzzle (#328)

Arcade/FlxLightPuzzle/Project.xml

@@ -16,7 +16,7 @@
 	<!-- ____________________________ Window Settings ___________________________ -->
 
 	<!--These window settings apply to all targets-->
-	<window width="512" height="288" fps="60" background="#000000" hardware="true" vsync="false" />
+	<window width="1024" height="576" fps="60" background="#000000" hardware="true" vsync="false" />
 
 	<!--HTML5-specific-->
 	<window if="html5" resizable="false" />

Arcade/FlxLightPuzzle/source/Main.hx

@@ -1,5 +1,6 @@
 package;
 
+import lime.app.Application;
 import flixel.FlxGame;
 import openfl.display.Sprite;
 
@@ -8,6 +9,7 @@ class Main extends Sprite
 	public function new()
 	{
 		super();
+
 		addChild(new FlxGame(0, 0, PlayState));
 	}
 }

Arcade/FlxLightPuzzle/source/MenuState.hx

@@ -20,24 +20,30 @@ class MenuState extends FlxSubState
 
 	override public function create():Void
 	{
-		title = new FlxText(50, 10, 512 - 50, "FlxLightPuzzle", 20);
+		title = new FlxText(50 * 2, 10 * 2, (512 - 50) * 2, "FlxLightPuzzle", 20 * 2);
 		title.color = FlxColor.WHITE;
 		title.alignment = "center";
 		add(title);
 
 		// barsHorizontal.png from Kenney.nl were colored to make them more appropriate for this game
 
-		playRYB = new FlxSprite(300, 72 - 25, AssetPaths.ryb__png);
+		playRYB = new FlxSprite(300 * 2, (72 - 25) * 2, AssetPaths.ryb__png);
+		playRYB.setGraphicSize(Std.int(playRYB.width * 2));
+		playRYB.updateHitbox();
 		FlxMouseEvent.add(playRYB, null, onSelect, onMOver, onMOut, false, true, false);
 		FlxMouseEvent.setMouseClickCallback(playRYB, onSelect);
 		add(playRYB);
 
-		playRGB = new FlxSprite(300, 144 - 25, AssetPaths.rgb__png);
+		playRGB = new FlxSprite(300 * 2, (144 - 25) * 2, AssetPaths.rgb__png);
+		playRGB.setGraphicSize(Std.int(playRGB.width * 2));
+		playRGB.updateHitbox();
 		FlxMouseEvent.add(playRGB, null, onSelect, onMOver, onMOut, false, true, false);
 		FlxMouseEvent.setMouseClickCallback(playRGB, onSelect);
 		add(playRGB);
 
-		playCMY = new FlxSprite(300, 216 - 25, AssetPaths.cmy__png);
+		playCMY = new FlxSprite(300 * 2, (216 - 25) * 2, AssetPaths.cmy__png);
+		playCMY.setGraphicSize(Std.int(playCMY.width * 2));
+		playCMY.updateHitbox();
 		FlxMouseEvent.add(playCMY, null, onSelect, onMOver, onMOut, false, true, false);
 		FlxMouseEvent.setMouseClickCallback(playCMY, onSelect);
 		add(playCMY);
@@ -84,13 +90,11 @@ class MenuState extends FlxSubState
 	function onMOver(target:FlxSprite):Void
 	{
 		// make the buttons more noticeable by expanding them on mouse over
-		target.scale.x = 1.25;
-		target.scale.y = 1.25;
+		target.setGraphicSize(Std.int(target.width * 1.25));
 	}
 
 	function onMOut(target:FlxSprite):Void
 	{
-		target.scale.x = 1;
-		target.scale.y = 1;
+		target.setGraphicSize(Std.int(target.width));
 	}
 }

Arcade/FlxLightPuzzle/source/PlayState.hx

@@ -46,14 +46,14 @@ class PlayState extends FlxState
 		ui = new UILayer(resetLevel);
 
 		// the player is a high-tech triangle
-		player = new FlxSprite(75, 144);
-		player.makeGraphic(26, 26, FlxColor.TRANSPARENT, true);
-		FlxSpriteUtil.drawTriangle(player, 0, 0, 26, FlxColor.WHITE);
-		player.offset.set(13, 13);
+		player = new FlxSprite(75 * 2, 144 * 2);
+		player.makeGraphic(26 * 2, 26 * 2, FlxColor.TRANSPARENT, true);
+		FlxSpriteUtil.drawTriangle(player, 0, 0, 26 * 2, FlxColor.WHITE);
+		player.offset.set(13 * 2, 13 * 2);
 		player.pixelPerfectRender = false;
-		player.antialiasing = true;
+		player.antialiasing = false;
 
-		playerPosition = FlxPoint.get(75, 144);
+		playerPosition = FlxPoint.get(75 * 2, 144 * 2);
 
 		currLevelIndex = -1;
 		blockLevelReset = false;
@@ -172,7 +172,7 @@ class PlayState extends FlxState
 		if (currLevelIndex >= numLevels)
 		{
 			// win the game
-			var endCircle = new Circle(FlxPoint.get(300, 144), 350, Color.WHITE);
+			var endCircle = new Circle(FlxPoint.get(300 * 2, 144 * 2), 350 * 2, Color.WHITE);
 			game.drawCircle(endCircle, 1, 4.32);
 
 			openSubState(new WinState());

Arcade/FlxLightPuzzle/source/Template.hx

@@ -54,7 +54,7 @@ class Template
 		for (targetData in targetsData)
 		{
 			var params = targetData.split(" ");
-			targetsDefault.push(new Circle(FlxPoint.get(Std.parseFloat(params[0]), Std.parseFloat(params[1])), Std.parseFloat(params[2]),
+			targetsDefault.push(new Circle(FlxPoint.get(Std.parseFloat(params[0]) * 2, Std.parseFloat(params[1]) * 2), Std.parseFloat(params[2]) * 2,
 				getColorFromData(params[3])));
 		}
 
@@ -70,7 +70,7 @@ class Template
 
 			for (i in 0...numVerts)
 			{
-				verts.push(FlxPoint.get(Std.parseFloat(params[2 * i]), Std.parseFloat(params[2 * i + 1])));
+				verts.push(FlxPoint.get(Std.parseFloat(params[2 * i]) * 2, Std.parseFloat(params[2 * i + 1]) * 2));
 			}
 
 			if (numVerts == 2)

Arcade/FlxLightPuzzle/source/UILayer.hx

@@ -34,23 +34,25 @@ class UILayer extends FlxSpriteGroup
 
 		// a black background helps the UI buttons stand out
 		bg = new FlxSprite();
-		bg.makeGraphic(250, FlxG.height, FlxColor.BLACK); // should this change based on the selected color palette?
+		bg.makeGraphic(250 * 2, FlxG.height, FlxColor.BLACK); // should this change based on the selected color palette?
 
 		FlxMouseEvent.add(bg, null, null, onPanelOver, onPanelOut, true, true,
 			true); // pixel-perfect because we will be using a clipRect and need the extra checks
 
 		add(bg);
 
-		ammo = new FlxSprite(5, 223);
-		ammo.makeGraphic(40, 60, 0x0, true);
+		ammo = new FlxSprite(5 * 2, 223 * 2);
+		ammo.makeGraphic(40 * 2, 60 * 2, 0x0, true);
 
 		add(ammo);
 
 		// the original art files from Kenney.nl are in multiple pngs: I combined several using an image editor to make a spritesheet that I can easily load as an animation
 		// tools like TexturePacker do all that for you plus more: check out the TexturePackerDemo too!
 
-		var mute = new FlxSprite(0, 69);
+		var mute = new FlxSprite(0, 69 * 2);
 		mute.loadGraphic(AssetPaths.music__png, true, 50, 50);
+		mute.setGraphicSize(Std.int(mute.width * 2));
+		mute.updateHitbox();
 		mute.animation.add("unmuted", [0], 0, false);
 		mute.animation.add("muted", [1], 0, false);
 		mute.animation.play("unmuted");
@@ -73,22 +75,27 @@ class UILayer extends FlxSpriteGroup
 			add(fullscreen);
 		 */
 
-		var restart = new FlxSprite(0, 69 + 100);
+		var restart = new FlxSprite(0, (69 + 100) * 2);
 		restart.loadGraphic(AssetPaths.return__png, false);
+		restart.setGraphicSize(Std.int(restart.width * 2));
+		restart.updateHitbox();
 
 		FlxMouseEvent.add(restart, null, onRestart, onMOver, onMOut, true, true, false);
 
 		add(restart);
 
-		source = new FlxText(100, 50, 150, "Click for the source code", 14);
+		source = new FlxText(100 * 2, 50 * 2, 150 * 2, "Click for the source code", 14 * 2);
 		FlxMouseEvent.add(source, null, onSource, onMOver, onMOut, true, true, false);
 		add(source);
 
-		patreon = new FlxSprite(125, 125, AssetPaths.haxeflixel__png); // "click to learn more"?
+		patreon = new FlxSprite(125 * 2, 125 * 2, AssetPaths.haxeflixel__png); // "click to learn more"?
+		patreon.antialiasing = true;
+		patreon.setGraphicSize(Std.int(patreon.width * 2));
+		patreon.updateHitbox();
 		FlxMouseEvent.add(patreon, null, onPatreon, onMOver, onMOut, true, true, false);
 		add(patreon);
 
-		credits = new FlxText(60, 216, 180, "Made by MSGhero for HaxeFlixel\nArt from Kenney.nl\nWaltz in G minor by Strimlarn87", 8);
+		credits = new FlxText(60 * 2, 216 * 2, 180 * 2, "Made by MSGhero for HaxeFlixel\nArt from Kenney.nl\nWaltz in G minor by Strimlarn87", 8 * 2);
 		credits.alignment = "center";
 		FlxMouseEvent.add(credits, null, onCredits, onMOver, onMOut, true, true, false);
 		add(credits);
@@ -97,8 +104,8 @@ class UILayer extends FlxSpriteGroup
 
 		// the UI panel will expand when moused over, and that will be controlled by a clipRect
 		// which will hide the right side of the panel until the left is moused over
-		clipRect = new FlxRect(0, 0, 50, FlxG.height);
-		bg.width = 50;
+		clipRect = new FlxRect(0, 0, 50 * 2, FlxG.height);
+		bg.width = 50 * 2;
 	}
 
 	public function setAmmo(remainingAmmo:Array<Color>):Void
@@ -107,7 +114,7 @@ class UILayer extends FlxSpriteGroup
 		// you could also manage separate sprites, each being one unit of ammo (photons?)
 
 		var color:FlxColor = 0x0;
-		var rect = new Rectangle(0, 0, 40, 20);
+		var rect = new Rectangle(0, 0, 40 * 2, 20 * 2);
 
 		for (i in 0...3)
 		{
@@ -116,7 +123,7 @@ class UILayer extends FlxSpriteGroup
 			else
 				color = FlxColor.BLACK;
 
-			rect.y = 40 - i * 20;
+			rect.y = 80 - i * 40;
 
 			ammo.pixels.fillRect(rect, color);
 		}
@@ -176,15 +183,15 @@ class UILayer extends FlxSpriteGroup
 
 	function onPanelOver(target:FlxSprite):Void
 	{
-		clipRect.width = bg.width = 250;
+		clipRect.width = bg.width = 250 * 2;
 		clipRect = clipRect; // you have to set the clipRect for it to update, just changing a property doesn't do anything
 
 		source.visible = patreon.visible = credits.visible = true; // we don't want these responding to mouse clicks when covered up, so we have to manually set their visibility
 	}
 
 	function onPanelOut(target:FlxSprite):Void
 	{
-		clipRect.width = bg.width = 50;
+		clipRect.width = bg.width = 50 * 2;
 		clipRect = clipRect;
 
 		source.visible = patreon.visible = credits.visible = false;
@@ -218,14 +225,12 @@ class UILayer extends FlxSpriteGroup
 
 	function onMOver(target:FlxSprite):Void
 	{
-		target.scale.x = 1.25;
-		target.scale.y = 1.25;
+		target.setGraphicSize(Std.int(target.width * 1.25));
 	}
 
 	function onMOut(target:FlxSprite):Void
 	{
-		target.scale.x = 1;
-		target.scale.y = 1;
+		target.setGraphicSize(Std.int(target.width));
 	}
 
 	override function get_width():Float

Arcade/FlxLightPuzzle/source/WinState.hx

@@ -17,12 +17,12 @@ class WinState extends FlxSubState
 	{
 		var bg = ColorMaps.defaultColorMap[Color.WHITE] == FlxColor.BLACK ? FlxColor.WHITE : FlxColor.BLACK; // if the background is black, we want white text, and vice-versa
 
-		winMessage = new FlxText(256, 40, 250,
+		winMessage = new FlxText(256 * 2, 40 * 2, 250 * 2,
 			"Want more?\n\nYou can copy the code to make more levels or change it however you want.\n\n" +
 			"This project is open source and released under MIT license thanks to HaxeFlixel supporters.\n\n" +
 			"Grab the code and become a HaxeFlixel supporter to help make more cool open-source demos like this.",
-			14);
-		winMessage.setFormat(null, 12, bg);
+			14 * 2);
+		winMessage.setFormat(null, 12 * 2, bg);
 		winMessage.alignment = "center";
 
 		// delay to match up with the expanding circle background