This is a quick blog post to share a small tutorial on how you can handle a camera in the Citrus Engine and having feedbacks for the new CE’s structure.

Project dependencies
Let’s start for a very interessant & complex subject : refactor & separate an engine which has many libraries dependencies. Now that the Citrus Engine handles 3D and 3D physics thanks to Away3D & AwayPhysics it becomes too heavy. There is no problem with performances but a simple hello world is far too heavy. At the moment, any project needs to have Starling, Box2D, Nape, Away3D & AwayPhysics included. Even if you just need, for example, Starling & Box2D. We have to find a solution. We can’t just remove libraries that we don’t need manually and follow compiler instructions to remove them from the engine too. We have to find the best solution for final users & contributors.
It would be great to have swc as well for each dependency, e.g. ce.swc, ce_starling.swc & ce_starling_box2d.swc or ce.swc, cd_away3d.swc & ce_away3d_nape.swc. It means lots of swcs but it would be really easy to pick up those needed.

That was the point. And I’m glad to say that we find the best solution for everyone! And it’s up on GitHub! Also I would like to thanks Johann Barbie who helped me a lot on this. Now everything in the engine is separated, it means simply that in the view package we never care about which physics engine we use. Concerning the physics debug view, we have a class for each physics engine and then we use some wrapper to handle them in Starling or Away3D.

What changed?
I try to do my best to not break backward compatibility. If you use a modern IDE (if not, you should!!), just update the package import. It should works fine.
If you use Starling, you Main class must extends StarlingCitrusEngine. And that’s it!
All examples have been updated, and the final SWF size is really smaller!

Ant
Now I’m working with Ant to provide a swc for each build which only contain CE’s code. My main problem is I don’t success to remove external libraries on the final build. I would like to include them to compile my swc, but not include them in the final swc. Any advice would be very much appreciated!

Box2D AS3
Some people request me to move on Box2D AS3 version instead of the Alchemy version. It is a good idea if you don’t want to depend of the new Adobe tax. However this AS3 version is harder to handle since there isn’t a simple event system to manage collision like the Alchemy one. If you are familiar with the AS3 version and would like to provide your help, please contact me.

Camera demo
The demo.
Use the mouse wheel to zoom/dezoom. Press R to rotate the content.

The source code is very simple :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75

package cameramovement {
 
	import com.citrusengine.core.CitrusEngine;
	import com.citrusengine.core.State;
	import com.citrusengine.math.MathUtils;
	import com.citrusengine.math.MathVector;
	import com.citrusengine.objects.platformer.box2d.Hero;
	import com.citrusengine.objects.platformer.box2d.Platform;
	import com.citrusengine.physics.box2d.Box2D;
 
	import flash.events.MouseEvent;
	import flash.geom.Point;
	import flash.geom.Rectangle;
	import flash.ui.Keyboard;
 
	/**
	 * @author Aymeric
	 */
	public class CameraMovement extends State {
 
		public function CameraMovement() {
			super();
		}
 
		override public function initialize():void {
 
			super.initialize();
 
			var box2d:Box2D = new Box2D("box2D", {visible:true});
			box2d.group = 0; // box2d debug view will be behind graphics, default is 1 : can't work on Starling, since the debug view is on the display list
			add(box2d);
 
			var hero:Hero = new Hero("hero", {x:100, view:"PatchSpriteArt.swf", width:60, height:120, offsetY:15});
			add(hero);
 
			add(new Platform("platBot", {x:stage.stageWidth / 2, y:stage.stageHeight, width:3000}));
			add(new Platform("cloud", {x:450, y:250, width:200, oneWay:true}));
 
			view.setupCamera(hero, new MathVector(stage.stageWidth / 2, stage.stageHeight / 2), new Rectangle(0, 0, 1550, 450), new MathVector(.25, .05));
 
			stage.addEventListener(MouseEvent.MOUSE_WHEEL, _mouseWheel);
		}
 
		override public function destroy():void {
 
			stage.removeEventListener(MouseEvent.MOUSE_DOWN, _mouseWheel);
 
			super.destroy();
		}
 
		override public function update(timeDelta:Number):void {
 
			super.update(timeDelta);
 
			if (CitrusEngine.getInstance().input.isDown(Keyboard.R)) {
 
				// if you use Starling, just move the pivot point!
 
				MathUtils.RotateAroundInternalPoint(this, new Point(stage.stageWidth / 2, stage.stageHeight / 2), 1);
 
				view.cameraOffset = new MathVector(stage.stageWidth / 2, stage.stageHeight / 2);
				view.cameraBounds = new Rectangle(0, 0, 1550, 450);
			}
		}
 
		private function _mouseWheel(mEvt:MouseEvent):void {
 
			scaleX = mEvt.delta > 0 ? scaleX + 0.03 : scaleX - 0.03;
			scaleY = scaleX;
 
			view.cameraOffset = new MathVector(stage.stageWidth / 2 / scaleX, stage.stageHeight / 2 / scaleY);
			view.cameraBounds = new Rectangle(0, 0, 1550 * scaleX, 450 * scaleY);
		}
	}
}

In a physics world, you will never rotate the world! You just have to rotate its view, then manage the gravity like you want 😉

November should be an awesome month for the Citrus Engine, so stay tuned!