simplify SnakeSegment a little

visualization/static/visualization/Snake.js

 "use strict";
 
-function SnakeSegment(snake)
-{
-    this.world_size_x = snake.world_size_x;
-    this.world_size_y = snake.world_size_y;
-    this._sprite = new PIXI.Sprite(snake.GetBodyTexture());
-    this._sprite.anchor.set(0.5);
-    this._sprite.alpha = 0.8;
-    this.SetScale(snake.GetCurrentSnakeScale());
-}
-
-SnakeSegment.prototype.GetSprite = function()
-{
-    return this._sprite;
-};
-
-SnakeSegment.prototype.SetTint = function(tint)
-{
-    this._sprite.tint = tint;
-};
-
-SnakeSegment.prototype.SetScale = function(scale)
-{
-    this._sprite.scale.set(scale, scale);
-};
-
-SnakeSegment.prototype.SetPosition = function(x, y)
-{
-    this.x = x;
-    this.y = y;
-
-    while (this.x<0) { this.x += this.world_size_x; }
-    while (this.x>this.world_size_x) { this.x -= this.world_size_x; }
-    while (this.y<0) { this.y += this.world_size_y; }
-    while (this.y>this.world_size_y) { this.y -= this.world_size_y; }
-
-    this._sprite.x = x;
-    this._sprite.y = y;
-};
-
-SnakeSegment.prototype.ClonePosition = function(other)
-{
-    this.SetPosition(other.x, other.y);
-};
-
-SnakeSegment.prototype.MoveDirection = function(direction, length)
-{
-    this.SetPosition(
-        this.x + length*Math.cos(direction),
-        this.y + length*Math.sin(direction)
-    );
-};
-
-SnakeSegment.prototype.MoveRelative = function(dx, dy)
-{
-    this.SetPosition(
-        this.x + dx,
-        this.y + dy
-    );
-};
-
 function Snake(headTexture, bodyTexture, name, colorScheme, world_size_x, world_size_y)
 {
     this._name = name;

visualization/static/visualization/SnakeSegment.js

+"use strict";
+
+function SnakeSegment(snake)
+{
+    this.x = 0;
+    this.y = 0;
+    this._sprite = new PIXI.Sprite(snake.GetBodyTexture());
+    this._sprite.anchor.set(0.5);
+    this._sprite.alpha = 0.8;
+    this.SetScale(snake.GetCurrentSnakeScale());
+}
+
+SnakeSegment.prototype.GetSprite = function()
+{
+    return this._sprite;
+};
+
+SnakeSegment.prototype.SetTint = function(tint)
+{
+    this._sprite.tint = tint;
+};
+
+SnakeSegment.prototype.SetScale = function(scale)
+{
+    this._sprite.scale.set(scale, scale);
+};
+
+SnakeSegment.prototype.SetPosition = function(x, y)
+{
+    this.x = x;
+    this.y = y;
+    this.UpdateSprites();
+};
+
+SnakeSegment.prototype.ClonePosition = function(other)
+{
+    this.SetPosition(other.x, other.y);
+};
+
+SnakeSegment.prototype.MoveDirection = function(direction, length)
+{
+    this.SetPosition(
+        this.x + length*Math.cos(direction),
+        this.y + length*Math.sin(direction)
+    );
+};
+
+SnakeSegment.prototype.MoveRelative = function(dx, dy)
+{
+    this.SetPosition(
+        this.x + dx,
+        this.y + dy
+    );
+};
+
+SnakeSegment.prototype.UpdateSprites = function()
+{
+    this._sprite.x = this.x;
+    this._sprite.y = this.y;
+};
\ No newline at end of file

visualization/templates/visualization/js.html

@@ -2,6 +2,7 @@
 <script src="{% static "visualization/lib/pixi.min.js" %}"></script>
 <script src="{% static "visualization/lib/websocket/reconnecting-websocket.min.js" %}"></script>
 <script src="{% static "visualization/ParticleGeoMap.js" %}"></script>
+<script src="{% static "visualization/SnakeSegment.js" %}"></script>
 <script src="{% static "visualization/Snake.js" %}"></script>
 <script src="{% static "visualization/FoodSprite.js" %}"></script>
 <script src="{% static "visualization/SimpleDirectionSnakeMoveStrategy.js" %}"></script>