SideView example viewer finished.

build/build.php

@@ -8,7 +8,7 @@
 	$buildLog = "Building version $version \n\n";
 	$header = "";
 
-	$js = file(dirname(__FILE__) . '/../examples/phaser-debug-js.php');
+	$js = file(dirname(__FILE__) . 'config.php');
 	$output = "";
 
 	for ($i = 0; $i < count($js); $i++)

build/config.php

@@ -0,0 +1,123 @@
+<?php
+	//	All JS files in build order.
+	//	Much easier for debugging re: line numbers
+?>
+	<script src="../src/Intro.js"></script>
+	<script src="../src/pixi/Pixi.js"></script>
+	<script src="../src/Phaser.js"></script>
+	<script src="../src/utils/Utils.js"></script>
+
+	<script src="../src/pixi/core/Matrix.js"></script>
+	<script src="../src/pixi/core/Point.js"></script>
+	<script src="../src/pixi/core/Rectangle.js"></script>
+	<script src="../src/pixi/display/DisplayObject.js"></script>
+	<script src="../src/pixi/display/DisplayObjectContainer.js"></script>
+	<script src="../src/pixi/display/Sprite.js"></script>
+
+	<script src="../src/pixi/display/Stage.js"></script>
+	<script src="../src/pixi/extras/CustomRenderable.js"></script>
+	<script src="../src/pixi/extras/Strip.js"></script>
+	<script src="../src/pixi/extras/Rope.js"></script>
+
+	<script src="../src/pixi/extras/TilingSprite.js"></script>
+	<script src="../src/pixi/filters/FilterBlock.js"></script>
+	<script src="../src/pixi/filters/MaskFilter.js"></script>
+	<script src="../src/pixi/primitives/Graphics.js"></script>
+	<script src="../src/pixi/renderers/canvas/CanvasGraphics.js"></script>
+	<script src="../src/pixi/renderers/canvas/CanvasRenderer.js"></script>
+	<script src="../src/pixi/renderers/webgl/WebGLBatch.js"></script>
+	<script src="../src/pixi/renderers/webgl/WebGLGraphics.js"></script>
+	<script src="../src/pixi/renderers/webgl/WebGLRenderer.js"></script>
+	<script src="../src/pixi/renderers/webgl/WebGLRenderGroup.js"></script>
+	<script src="../src/pixi/renderers/webgl/WebGLShaders.js"></script>
+	<script src="../src/pixi/text/BitmapText.js"></script>
+	<script src="../src/pixi/text/Text.js"></script>
+	<script src="../src/pixi/textures/BaseTexture.js"></script>
+	<script src="../src/pixi/textures/Texture.js"></script>
+	<script src="../src/pixi/textures/RenderTexture.js"></script>
+	<script src="../src/pixi/utils/EventTarget.js"></script>
+	<script src="../src/pixi/utils/Polyk.js"></script>
+
+	<script src="../src/core/Camera.js"></script>
+	<script src="../src/core/State.js"></script>
+	<script src="../src/core/StateManager.js"></script>
+	<script src="../src/core/LinkedList.js"></script>
+	<script src="../src/core/Signal.js"></script>
+	<script src="../src/core/SignalBinding.js"></script>
+	<script src="../src/core/Plugin.js"></script>
+	<script src="../src/core/PluginManager.js"></script>
+	<script src="../src/core/Stage.js"></script>
+	<script src="../src/core/Group.js"></script>
+	<script src="../src/core/World.js"></script>
+	<script src="../src/core/Game.js"></script>
+
+	<script src="../src/input/Input.js"></script>
+	<script src="../src/input/Key.js"></script>
+	<script src="../src/input/Keyboard.js"></script>
+	<script src="../src/input/Mouse.js"></script>
+	<script src="../src/input/MSPointer.js"></script>
+	<script src="../src/input/Pointer.js"></script>
+	<script src="../src/input/Touch.js"></script>
+	<script src="../src/input/InputHandler.js"></script>
+
+	<script src="../src/gameobjects/Events.js"></script>
+	<script src="../src/gameobjects/GameObjectFactory.js"></script>
+	<script src="../src/gameobjects/Sprite.js"></script>
+	<script src="../src/gameobjects/TileSprite.js"></script>
+	<script src="../src/gameobjects/Text.js"></script>
+	<script src="../src/gameobjects/BitmapText.js"></script>
+	<script src="../src/gameobjects/Button.js"></script>
+	<script src="../src/gameobjects/Graphics.js"></script>
+	<script src="../src/gameobjects/RenderTexture.js"></script>
+
+	<script src="../src/system/Canvas.js"></script>
+	<script src="../src/system/StageScaleMode.js"></script>
+	<script src="../src/system/Device.js"></script>
+	<script src="../src/system/RequestAnimationFrame.js"></script>
+
+	<script src="../src/math/RandomDataGenerator.js"></script>
+	<script src="../src/math/Math.js"></script>
+	<script src="../src/math/QuadTree.js"></script>
+
+	<script src="../src/geom/Circle.js"></script>
+	<script src="../src/geom/Point.js"></script>
+	<script src="../src/geom/Rectangle.js"></script>
+
+	<script src="../src/net/Net.js"></script>
+
+	<script src="../src/tween/TweenManager.js"></script>
+	<script src="../src/tween/Tween.js"></script>
+	<script src="../src/tween/Easing.js"></script>
+
+	<script src="../src/time/Time.js"></script>
+
+	<script src="../src/animation/AnimationManager.js"></script>
+	<script src="../src/animation/Animation.js"></script>
+	<script src="../src/animation/Frame.js"></script>
+	<script src="../src/animation/FrameData.js"></script>
+	<script src="../src/animation/AnimationParser.js"></script>
+
+	<script src="../src/loader/Cache.js"></script>
+	<script src="../src/loader/Loader.js"></script>
+	<script src="../src/loader/LoaderParser.js"></script>
+
+	<script src="../src/sound/Sound.js"></script>
+	<script src="../src/sound/SoundManager.js"></script>
+
+	<script src="../src/utils/Debug.js"></script>
+	<script src="../src/utils/Color.js"></script>
+
+	<script src="../src/physics/arcade/ArcadePhysics.js"></script>
+	<script src="../src/physics/arcade/Body.js"></script>
+
+	<script src="../src/particles/Particles.js"></script>
+	<script src="../src/particles/arcade/ArcadeParticles.js"></script>
+	<script src="../src/particles/arcade/Emitter.js"></script>
+
+	<script src="../src/tilemap/Tile.js"></script>
+	<script src="../src/tilemap/Tilemap.js"></script>
+	<script src="../src/tilemap/TilemapLayer.js"></script>
+	<script src="../src/tilemap/TilemapParser.js"></script>
+	<script src="../src/tilemap/Tileset.js"></script>
+
+	<script src="../src/PixiPatch.js"></script>

examples/_site/css/phaser-lite.css

@@ -0,0 +1,84 @@
+@font-face {
+
+	font-family: 'inconsolata';
+	src: url('../../_site/fonts/inconsolata.woff') format('woff');
+	font-weight: normal;
+	font-style: normal;
+
+}
+
+body {
+
+	background: #e0e4f1;
+	margin: 0px;
+	font-family: 'inconsolata';
+	font-size: 15px;
+	overflow: hidden;
+
+}
+
+a {
+	text-decoration: none;
+	color: #1c99bb;
+}
+
+a:hover {
+	background-color: #e69b0b;
+	color: #fff;
+}
+
+h1 {
+
+	font-size: 25px;
+	font-weight: normal;
+
+}
+
+h2 {
+
+	font-size: 20px;
+	font-weight: normal;
+
+}
+
+#header {
+	background: url(../../_site/images/lite_header.jpg) no-repeat left top;
+	width: 300px;
+	height: 100px;
+}
+
+#panel {
+
+	background: url(../../_site/images/lite_header_2.jpg) no-repeat left top;
+	width: 300px;
+	overflow-x: hidden;
+	overflow-y: scroll;
+
+}
+
+	#panel #examples-list {
+
+		padding: 10px 20px;
+		line-height: 18px;
+
+	}
+
+#footer {
+	background: url(../../_site/images/lite_footer.jpg) no-repeat left top;
+	width: 300px;
+	height: 170px;
+	color: #000;
+	text-align: center;
+}
+
+#viewer {
+
+	position: absolute;
+	top: 0px;
+	left: 300px;
+	width: -webkit-calc(100% - 300px); /* Safari */
+	width: calc(100% - 300px);
+	height: 100%;
+	border: 0px;
+
+}

examples/_site/funcs.php

@@ -1,5 +1,4 @@
 <?php
-
     //  Global
     $files = dirToArray(dirname(__FILE__));
     $total = 0;
@@ -33,7 +32,7 @@ function getFile() {
 
     function dirToArray($dir) { 
 
-        $ignore = array('.', '..', 'html', 'assets', 'states');
+        $ignore = array('.', '..', '_site', 'assets', 'states');
         $result = array(); 
         $root = scandir($dir); 
         $dirs = array_diff($root, $ignore);

examples/_site/js/phaser-sideview.js

@@ -0,0 +1,46 @@
+$(document).ready(function(){
+
+	$.getJSON("_site/examples.json")
+
+	.done(function(data) {
+
+		var i = 0;
+		var node = '';
+
+		$.each(data, function(dir, files)
+		{
+			node = '<h2>' + dir + '</h2>';
+
+			for (var e = 0; e < files.length; e++)
+			{
+				node += '<a href="_site/view_lite.html?d=' + dir + '&amp;f=' + files[e].file + '&amp;t=' + files[e].title + '" target="viewer">' + files[e].title + '</a><br />';
+			}
+
+			$("#examples-list").append(node);
+
+            i += files.length;
+
+		});
+
+		$("#total").append(i);
+
+		//	Re-calc the viewer height
+		var height = $(window).height() - 270;
+		$("#panel").css('height', height + 'px');
+
+	})
+
+	.fail(function() {
+
+		var node = '<h1>Error!</h1>';
+
+		node += '<p>Unable to load <u>examples.json</u> data file</p>';
+		node += '<p>Did you open this html file locally?</p>';
+		node += '<p>It needs to be opened via a web server, or due to browser security permissions<br />it will be unable to load local resources such as images and json data.</p>';
+		node += '<p>Please see our <a href="#">Getting Started guide</a> for details.</p>';
+
+		$("#viewer").contents().find('body').append(node);
+
+	});
+
+});

examples/_site/js/phaser-viewer.js

@@ -10,13 +10,37 @@ $(document).ready(function(){
 
 	$.getScript(dir + "/" + file)
 
-	.done(function(script, textStatus){
-
-		// $.get(dir + "/" + file, function(data) {
-		// 	console.log(typeof data);
-		// 	console.log(data);
-			// $("#sourcecode").text(data);
-		// });
+	.done(function(script, textStatus) {
+
+		$.ajax({ url: dir + "/" + file, dataType: "text" }).done(function(data) { $("#sourcecode").text(data); });
+
+		//	Hook up the control panel
+
+		$(".pause-button").click(function() {
+			if (game.paused)
+			{
+				game.paused = false;
+			}
+			else
+			{
+				game.paused = true;
+			}
+		});
+
+		$(".mute-button").click(function() {
+			if (game.sound.mute)
+			{
+				game.sound.mute = false;
+			}
+			else
+			{
+				game.sound.mute = true;
+			}
+		});
+
+		$(".reset-button").click(function() {
+			document.location.reload(true);
+		});
 
   	})
 

examples/_site/view_full.html

@@ -121,7 +121,7 @@
             <div class="box100 no-padding">
                 <div class="phaser-version">
                     <span>Phaser Version: 1.1</span>
-                    <a href="" class="version-button">1.2 dev branch</a>
+                    <a href="https://github.com/photonstorm/phaser/tree/dev" class="version-button">1.2 dev branch</a>
                 </div>
             </div>
             <div class="clear"></div>
@@ -161,7 +161,6 @@
         <div class="clear filler"></div>
         <p class="centered px800">Source code:</p>
         <pre id="sourcecode" class="code-block centered prettyprint"></pre>
-        </div>
 
         <div class="clear"></div>
         <div id="footer" class="footer">