Главная Обзор Помощь
Вход
archive
/
spine-runtimes
зеркало из https://github.com/EsotericSoftware/spine-runtimes.git
2
0
Ответвить 0
Файлы Задачи 0 Вики
Просмотр исходного кода

[ts] Adjusted skeleton positions.

NathanSweet 9 лет назад
Родитель
7646c28f9d
Сommit
1e650a70ac
6 измененных файлов с 28 добавлено и 20 удалено
Разделённый вид Показать статистику Diff
  1. 12 5
      spine-ts/webgl/demos/framebyframe.js
  2. 3 3
      spine-ts/webgl/demos/meshes.js
  3. 2 2
      spine-ts/webgl/demos/skins.js
  4. 3 3
      spine-ts/webgl/demos/transitions.html
  5. 6 6
      spine-ts/webgl/demos/transitions.js
  6. 2 1
      spine-ts/webgl/demos/utils.js

+ 12 - 5
spine-ts/webgl/demos/framebyframe.js
Просмотреть файл 

@@ -144,8 +144,16 @@ var frameByFrameDemo = function(loadingComplete, bgColor) {
 
 		var offset = active.bounds.offset;
 
 		var size = active.bounds.size;
 
 
-		renderer.camera.position.x = offset.x + size.x;
 
-		renderer.camera.position.y = offset.y + size.y / 2;
 
+		var x = offset.x + size.x + 100, offsetY = offset.y;
 
+		if (activeSkeleton === "Alien") {
 
+			renderer.camera.position.x = offset.x + size.x - 100;
 
+			renderer.camera.position.y = offset.y + size.y / 2 + 100;
 
+			offsetY += 125;
 
+		} else {
 
+			renderer.camera.position.x = offset.x + size.x;
 
+			renderer.camera.position.y = offset.y + size.y / 2;
 
+			x += 100;
 
+		}
 
 		renderer.camera.viewportWidth = size.x * 2.4;
 
 		renderer.camera.viewportHeight = size.y * 1.4;
 
 		renderer.resize(spine.webgl.ResizeMode.Fit);
 
@@ -169,8 +177,7 @@ var frameByFrameDemo = function(loadingComplete, bgColor) {
 
 		renderer.begin();				
 		renderer.drawSkeleton(skeleton, true);
 
 
-		var x = offset.x + size.x + 100;
 
-		var y = offset.y;
 
+		var y = offsetY;
 
 		var slotsWidth = 0, slotsHeight = 0;
 
 		var slotSize = size.y / 3;
 
 		var maxSlotWidth = 0;	
@@ -207,7 +214,7 @@ var frameByFrameDemo = function(loadingComplete, bgColor) {
 
 			if (j == 3) {
 
 				x += maxSlotWidth + 10;
 
 				maxSlotWidth = 0;
 
-				y = offset.y;
 
+				y = offsetY;
 
 				j = 0;
 
 			}			
 		}

+ 3 - 3
spine-ts/webgl/demos/meshes.js
Просмотреть файл 

@@ -139,9 +139,9 @@ var meshesDemo = function(loadingComplete, bgColor) {
 
 		var size = active.bounds.size;
 
 
 		renderer.camera.position.x = offset.x + size.x / 2;
 
-		renderer.camera.position.y = offset.y + size.y / 2;
 
-		renderer.camera.viewportWidth = size.x * 1.2;
 
-		renderer.camera.viewportHeight = size.y * 1.2;
 
+		renderer.camera.position.y = offset.y + size.y / 2 + 20;
 
+		renderer.camera.viewportWidth = size.x * 1.1;
 
+		renderer.camera.viewportHeight = size.y * 1.1;
 
 		renderer.resize(spine.webgl.ResizeMode.Fit);
 
 
 		gl.clearColor(bgColor.r, bgColor.g, bgColor.b, bgColor.a);

+ 2 - 2
spine-ts/webgl/demos/skins.js
Просмотреть файл 

@@ -211,10 +211,10 @@ var skinsDemo = function(loadingComplete, bgColor) {
 
 		renderer.begin();				
 		renderer.drawSkeleton(skeleton, true);
 
 		var texture = assetManager.get(DEMO_NAME, "heroes.png");
 
-		var width = bounds.x;
 
+		var width = bounds.x * 1.25;
 
 		var scale = width / texture.getImage().width;
 
 		var height = scale * texture.getImage().height;
 
-		renderer.drawTexture(texture, offset.x + bounds.x + 200, offset.y + bounds.y / 2 - height / 2 - 50, width, height);		
+		renderer.drawTexture(texture, offset.x + bounds.x + 190, offset.y + bounds.y / 2 - height / 2 - 5, width, height);		
 		renderer.end();		
 	}

+ 3 - 3
spine-ts/webgl/demos/transitions.html
Просмотреть файл 

@@ -6,17 +6,17 @@
 
 <script src="transitions.js"></script>
 
 <body>
 
 
-<canvas id="transitions-canvas"></canvas>
 
+<canvas id="transitionsdemo-canvas"></canvas>
 
 <center>
 
 <div style="position: fixed; top: 0; width: 100%">
 
 	Time multiplier
 
-	<div id="transitions-timeslider" class="slider"></div></br>
 
+	<div id="transitionsdemo-timeslider" class="slider"></div></br>
 
 </div>
 
 </center>
 
 
 <script>
 
 spineDemos.loadSliders();
 
-transitions(spineDemos.setupRendering);
 
+transitionsDemo(spineDemos.setupRendering);
 
 </script>
 
 
 </body>

+ 6 - 6
spine-ts/webgl/demos/transitions.js
Просмотреть файл 

@@ -1,4 +1,4 @@
 
-var transitions = function(loadingComplete, bgColor) {
 
+var transitionsDemo = function(loadingComplete, bgColor) {
 
 	var OUTLINE_COLOR = new spine.Color(0, 0.8, 0, 1);	
 
 	var canvas, gl, renderer, input, assetManager;
 
@@ -12,10 +12,10 @@ var transitions = function(loadingComplete, bgColor) {
 
 	if (!bgColor) bgColor = new spine.Color(1, 1, 1, 1);
 
 
 	function init () {
 
-		timeSlider = $("#transitions-timeslider").data("slider");
 
+		timeSlider = $("#transitionsdemo-timeslider").data("slider");
 
 		timeSlider.set(0.5);
 
-		timeSliderLabel = $("#transitions-timeslider-label")[0];
 
-		canvas = document.getElementById("transitions-canvas");
 
+		timeSliderLabel = $("#transitionsdemo-timeslider-label")[0];
 
+		canvas = document.getElementById("transitionsdemo-canvas");
 
 		canvas.width = canvas.clientWidth; canvas.height = canvas.clientHeight;
 
 		gl = canvas.getContext("webgl", { alpha: false }) || canvas.getContext("experimental-webgl", { alpha: false });	
 
@@ -50,8 +50,8 @@ var transitions = function(loadingComplete, bgColor) {
 
 			bounds = { offset: new spine.Vector2(), size: new spine.Vector2() };
 
 			skeleton.getBounds(bounds.offset, bounds.size);
 
 			setupInput();
 
-			$("#transitions-overlay").removeClass("overlay-hide");
 
-			$("#transitions-overlay").addClass("overlay");	
+			$("#transitionsdemo-overlay").removeClass("overlay-hide");
 
+			$("#transitionsdemo-overlay").addClass("overlay");	
 			loadingComplete(canvas, render);						
 		} else {
 
 			loadingScreen.draw();

+ 2 - 1
spine-ts/webgl/demos/utils.js
Просмотреть файл 

@@ -75,7 +75,8 @@ var spineDemos = {
 
 				value = percent;
 
 			}
 
 			function mouseEvent (e) {
 
-				var x = e.pageX || e.originalEvent.touches[0].pageX;
 
+				var x = e.pageX;
 
+				if (!x && e.originalEvent.touches) x = e.originalEvent.touches[0].pageX;
 
 				var percent = Math.max(0, Math.min(1, (x - div.offset().left - hw / 2) / (div.width() - hw - 2)));
 
 				positionHandle(percent);
 
 				if (object.changed) object.changed(percent);