Added luffing sails image.

- Created transparent gif of luffing sail
- Displayed image when sail is luffing
- Repositioned luffing sail

#story[1098]

racevisionGame/src/main/java/visualiser/model/ResizableRaceCanvas.java

@@ -31,8 +31,7 @@ public class ResizableRaceCanvas extends ResizableCanvas {
     private Image background;
     private Image sailsRight = new Image("/images/sailsRight.png");
     private Image sailsLeft = new Image("/images/sailsLeft.png");
-    // TODO: change to luffing sail image
-    private Image sailsLuff = new Image("/images/sailsRight.png");
+    private Image sailsLuff = new Image("/images/sailsLuff.gif", 25, 10, false, false);
 
     // annotations
     private boolean annoName = true;
@@ -361,16 +360,14 @@ public class ResizableRaceCanvas extends ResizableCanvas {
             }
             sailRotateAngle += ((boatBearing + windDirection) * 0.5);
         }
+        // Sails in = luffing sail
         else {
-            xPos -= 3;
+            xPos -= 6;
+            yPos += 1;
             sailImage = sailsLuff;
-            sailImage = null; // TODO: remove line when luffing image added
-            sailRotateAngle = boatBearing;
+            sailRotateAngle = boatBearing + 90;
         }
 
-//        System.out.println("boat: " + boatBearing + " || rotate: " +
-//                sailRotateAngle + " || wind angle: " + windDirection);
-
         gc.save();
 
         // rotate sails based on boats current heading