Allow snap to grid (closes #14)

core/src/io/github/lonamiwebs/klooni/Klooni.java

@@ -50,6 +50,8 @@ public class Klooni extends Game {
         skin.add("share_texture", new Texture(Gdx.files.internal("ui/share.png")));
         skin.add("sound_on_texture", new Texture(Gdx.files.internal("ui/sound_on.png")));
         skin.add("sound_off_texture", new Texture(Gdx.files.internal("ui/sound_off.png")));
+        skin.add("snap_on_texture", new Texture(Gdx.files.internal("ui/snap_on.png")));
+        skin.add("snap_off_texture", new Texture(Gdx.files.internal("ui/snap_off.png")));
         skin.add("issues_texture", new Texture(Gdx.files.internal("ui/issues.png")));
         skin.add("credits_texture", new Texture(Gdx.files.internal("ui/credits.png")));
         skin.add("web_texture", new Texture(Gdx.files.internal("ui/web.png")));
@@ -121,6 +123,14 @@ public class Klooni extends Game {
         prefs.putBoolean("muteSound", soundsEnabled()).flush();
     }
 
+    public static boolean shouldSnapToGrid() {
+        return prefs.getBoolean("snapToGrid", false);
+    }
+
+    public static void toggleSnapToGrid() {
+        prefs.putBoolean("snapToGrid", !shouldSnapToGrid()).flush();
+    }
+
     public static boolean isThemeBought(Theme theme) {
         if (theme.getPrice() == 0)
             return true;

core/src/io/github/lonamiwebs/klooni/game/Board.java

@@ -121,6 +121,21 @@ public class Board implements BinSerializable {
         return putPiece(piece, x, y);
     }
 
+    Vector2 snapToGrid(final Piece piece, final Vector2 position) {
+        // Snaps the given position (e.g. mouse) to the grid,
+        // assuming piece wants to be put at the specified position.
+        // If the piece was not on the grid, the original position is returned
+        //
+        // Logic to determine the x and y is a copy-paste from putScreenPiece
+        final Vector2 local = position.cpy().sub(pos);
+        int x = MathUtils.round(local.x / piece.cellSize);
+        int y = MathUtils.round(local.y / piece.cellSize);
+        if (canPutPiece(piece, x, y))
+            return new Vector2(pos.x + x * piece.cellSize, pos.y + y * piece.cellSize);
+        else
+            return position;
+    }
+
     // This will clear both complete rows and columns, all at once.
     // The reason why we can't check first rows and then columns
     // (or vice versa) is because the following case (* filled, _ empty):

core/src/io/github/lonamiwebs/klooni/game/PieceHolder.java

@@ -209,7 +209,8 @@ public class PieceHolder implements BinSerializable {
     }
 
     // Updates the state of the piece holder (and the held piece)
-    public void update() {
+    // TODO Passing the board seems expensive… Should it rather be an attribute?
+    public void update(Board board) {
         Piece piece;
         if (heldPiece > -1) {
             piece = pieces[heldPiece];
@@ -227,6 +228,8 @@ public class PieceHolder implements BinSerializable {
                 // avoiding to cover it with the finger (issue on Android devices)
                 mouse.sub(piece.getRectangle().width * 0.5f, -pickedCellSize);
             }
+            if (Klooni.shouldSnapToGrid())
+                mouse.set(board.snapToGrid(piece, mouse));
 
             piece.pos.lerp(mouse, DRAG_SPEED);
             piece.cellSize = Interpolation.linear.apply(piece.cellSize, pickedCellSize, DRAG_SPEED);

core/src/io/github/lonamiwebs/klooni/screens/CustomizeScreen.java

@@ -80,6 +80,20 @@ class CustomizeScreen implements Screen {
         });
         optionsGroup.addActor(soundButton);
 
+        // Snap to grid on/off
+        final SoftButton snapButton = new SoftButton(
+                2, Klooni.shouldSnapToGrid() ? "snap_on_texture" : "snap_off_texture");
+
+        snapButton.addListener(new ChangeListener() {
+            @Override
+            public void changed(ChangeEvent event, Actor actor) {
+                Klooni.toggleSnapToGrid();
+                snapButton.image = CustomizeScreen.this.game.skin.getDrawable(
+                        Klooni.shouldSnapToGrid() ? "snap_on_texture" : "snap_off_texture");
+            }
+        });
+        optionsGroup.addActor(snapButton);
+
         // Issues
         final SoftButton issuesButton = new SoftButton(3, "issues_texture");
         issuesButton.addListener(new ChangeListener() {

core/src/io/github/lonamiwebs/klooni/screens/GameScreen.java

@@ -166,7 +166,7 @@ class GameScreen implements Screen, InputProcessor, BinSerializable {
 
         scorer.draw(batch);
         board.draw(batch);
-        holder.update();
+        holder.update(board);
         holder.draw(batch);
         bonusParticleHandler.run(batch);
 

original-resources/buttons.svg

@@ -102,9 +102,9 @@
      borderopacity="1.0"
      inkscape:pageopacity="0.0"
      inkscape:pageshadow="2"
-     inkscape:zoom="4.0000001"
+     inkscape:zoom="1.4142136"
-     inkscape:cx="16.355684"
+     inkscape:cx="95.169026"
-     inkscape:cy="190.15864"
+     inkscape:cy="193.1638"
      inkscape:document-units="px"
      inkscape:current-layer="layer1"
      showgrid="false"
@@ -141,7 +141,7 @@
        style="opacity:1;fill:#e3e3e3;fill-opacity:1;stroke:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:0"
        id="rect4301"
        width="120"
-       height="100"
+       height="90"
        x="0"
        y="752.36218"
        ry="0" />
@@ -358,14 +358,14 @@
     <text
        xml:space="preserve"
        style="font-style:normal;font-weight:normal;font-size:15.69341087px;line-height:125%;font-family:sans-serif;letter-spacing:0px;word-spacing:0px;fill:#808080;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
-       x="7.7762895"
+       x="128.69154"
-       y="902.54736"
+       y="836.78644"
        id="text4186"
        sodipodi:linespacing="125%"><tspan
          sodipodi:role="line"
          id="tspan4188"
-         x="7.7762895"
+         x="128.69154"
-         y="902.54736">buttons</tspan></text>
+         y="836.78644">buttons</tspan></text>
     <text
        xml:space="preserve"
        style="font-style:normal;font-weight:normal;font-size:15.69341087px;line-height:125%;font-family:sans-serif;letter-spacing:0px;word-spacing:0px;fill:#808080;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
@@ -1200,5 +1200,32 @@
          style="opacity:1;fill:#f2f2f2;fill-opacity:1;stroke:none;stroke-width:7.55499983;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
          sodipodi:type="star" />
     </g>
+    <g
+       id="snap_on">
+      <path
+         inkscape:connector-curvature="0"
+         id="rect4329"
+         d="m 156.65234,848.36216 c -1.88479,0 -3.40234,1.51755 -3.40234,3.40234 l 0,9.84766 -9.84766,0 c -1.88479,0 -3.40234,1.51755 -3.40234,3.40234 l 0,5.19532 c 0,1.88479 1.51755,3.40234 3.40234,3.40234 l 9.84766,0 0,13.5 -9.84766,0 c -1.88479,0 -3.40234,1.51755 -3.40234,3.40234 l 0,5.19532 c 0,1.88479 1.51755,3.40234 3.40234,3.40234 l 9.84766,0 0,9.84766 c 0,1.88479 1.51755,3.40234 3.40234,3.40234 l 5.19532,0 c 1.88479,0 3.40234,-1.51755 3.40234,-3.40234 l 0,-9.84766 13.5,0 0,9.84766 c 0,1.88479 1.51755,3.40234 3.40234,3.40234 l 5.19532,0 c 1.88479,0 3.40234,-1.51755 3.40234,-3.40234 l 0,-9.84766 9.84766,0 c 1.88479,0 3.40234,-1.51755 3.40234,-3.40234 l 0,-5.19532 c 0,-1.88479 -1.51755,-3.40234 -3.40234,-3.40234 l -9.84766,0 0,-13.5 9.84766,0 c 1.88479,0 3.40234,-1.51755 3.40234,-3.40234 l 0,-5.19532 c 0,-1.88479 -1.51755,-3.40234 -3.40234,-3.40234 l -9.84766,0 0,-9.84766 c 0,-1.88479 -1.51755,-3.40234 -3.40234,-3.40234 l -5.19532,0 c -1.88479,0 -3.40234,1.51755 -3.40234,3.40234 l 0,9.84766 -13.5,0 0,-9.84766 c 0,-1.88479 -1.51755,-3.40234 -3.40234,-3.40234 l -5.19532,0 z m 8.59766,25.25 13.5,0 0,13.5 -13.5,0 0,-13.5 z"
+         style="opacity:1;fill:#f2f2f2;fill-opacity:1;stroke:none;stroke-width:30;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1" />
+    </g>
+    <g
+       id="snap_off"
+       transform="translate(-0.0933799,-0.27734)">
+      <path
+         id="path4343"
+         transform="translate(0,552.36216)"
+         d="m 86.746094,296.27734 c -1.88479,0 -3.402344,1.51756 -3.402344,3.40235 l 0,0.54297 21.30469,21.30468 4.19531,0 0,4.19336 21.30664,21.30664 0.54102,0 c 1.88479,0 3.40234,-1.51755 3.40234,-3.40234 l 0,-5.19531 c 0,-1.88479 -1.51755,-3.40235 -3.40234,-3.40235 l -9.84766,0 0,-13.5 9.84766,0 c 1.88479,0 3.40234,-1.51755 3.40234,-3.40234 l 0,-5.19531 c 0,-1.88479 -1.51755,-3.40235 -3.40234,-3.40235 l -9.84766,0 0,-9.84765 c 0,-1.88479 -1.51755,-3.40235 -3.40234,-3.40235 l -5.19532,0 c -1.88479,0 -3.40234,1.51756 -3.40234,3.40235 l 0,9.84765 -13.5,0 0,-9.84765 c 0,-1.88479 -1.517554,-3.40235 -3.402344,-3.40235 l -5.195312,0 z m -13.25,13.25 c -1.88479,0 -3.402344,1.51756 -3.402344,3.40235 l 0,5.19531 c 0,1.88479 1.517554,3.40234 3.402344,3.40234 l 9.847656,0 0,13.5 -9.847656,0 c -1.88479,0 -3.402344,1.51756 -3.402344,3.40235 l 0,5.19531 c 0,1.88479 1.517554,3.40234 3.402344,3.40234 l 9.847656,0 0,9.84766 c 0,1.88479 1.517554,3.40234 3.402344,3.40234 l 5.195312,0 c 1.88479,0 3.402344,-1.51755 3.402344,-3.40234 l 0,-9.84766 13.5,0 0,9.84766 c 0,1.88479 1.51755,3.40234 3.40234,3.40234 l 5.19532,0 c 1.88479,0 3.40234,-1.51755 3.40234,-3.40234 l 0,-0.54102 -21.306641,-21.30664 -4.193359,0 0,-4.19531 -21.304688,-21.30469 -0.542968,0 z"
+         style="opacity:1;fill:#f2f2f2;fill-opacity:1;stroke:none;stroke-width:30;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
+         inkscape:connector-curvature="0" />
+      <rect
+         style="opacity:1;fill:#ff5555;fill-opacity:1;stroke:none;stroke-width:30;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
+         id="rect4354"
+         width="8.4652328"
+         height="86.412712"
+         x="-554.74762"
+         y="651.69049"
+         ry="3.7367623"
+         transform="matrix(0.70710678,-0.70710678,0.70710678,0.70710678,0,0)" />
+    </g>
   </g>
 </svg>

original-resources/window_size.svg

@@ -17,7 +17,36 @@
    inkscape:version="0.91 r13725"
    sodipodi:docname="window_size.svg">
   <defs
-     id="defs4" />
+     id="defs4">
+    <marker
+       inkscape:stockid="Arrow1Lend"
+       orient="auto"
+       refY="0.0"
+       refX="0.0"
+       id="Arrow1Lend"
+       style="overflow:visible;"
+       inkscape:isstock="true">
+      <path
+         id="path4358"
+         d="M 0.0,0.0 L 5.0,-5.0 L -12.5,0.0 L 5.0,5.0 L 0.0,0.0 z "
+         style="fill-rule:evenodd;stroke:#000000;stroke-width:1pt;stroke-opacity:1;fill:#ffff00;fill-opacity:1"
+         transform="scale(0.8) rotate(180) translate(12.5,0)" />
+    </marker>
+    <marker
+       inkscape:stockid="Arrow1Lstart"
+       orient="auto"
+       refY="0.0"
+       refX="0.0"
+       id="Arrow1Lstart"
+       style="overflow:visible"
+       inkscape:isstock="true">
+      <path
+         id="path4355"
+         d="M 0.0,0.0 L 5.0,-5.0 L -12.5,0.0 L 5.0,5.0 L 0.0,0.0 z "
+         style="fill-rule:evenodd;stroke:#000000;stroke-width:1pt;stroke-opacity:1;fill:#000000;fill-opacity:1"
+         transform="scale(0.8) translate(12.5,0)" />
+    </marker>
+  </defs>
   <sodipodi:namedview
      id="base"
      pagecolor="#ffffff"
@@ -25,9 +54,9 @@
      borderopacity="1.0"
      inkscape:pageopacity="0.0"
      inkscape:pageshadow="2"
-     inkscape:zoom="0.175"
+     inkscape:zoom="0.24748737"
-     inkscape:cx="-835.87827"
+     inkscape:cx="928.0031"
-     inkscape:cy="247.67284"
+     inkscape:cy="269.98935"
      inkscape:document-units="px"
      inkscape:current-layer="layer1"
      showgrid="false"
@@ -46,7 +75,7 @@
         <dc:format>image/svg+xml</dc:format>
         <dc:type
            rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
-        <dc:title></dc:title>
+        <dc:title />
       </cc:Work>
     </rdf:RDF>
   </metadata>
@@ -283,7 +312,7 @@
        style="opacity:1;fill:#0000ff;fill-opacity:0.25;stroke:none;stroke-width:0.1;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
        id="rect4312"
        width="715.76221"
-       height="750.81952"
+       height="622.24811"
        x="799.99988"
        y="243.2572" />
     <rect
@@ -296,7 +325,7 @@
     <rect
        y="278.87415"
        x="1468.7052"
-       height="697.29242"
+       height="568.72101"
        width="32.564034"
        id="rect4316"
        style="opacity:1;fill:#ffff00;fill-opacity:0.42045456;stroke:none;stroke-width:30;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1" />
@@ -307,11 +336,6 @@
        height="151.81004"
        x="1474.7661"
        y="289.58844" />
-    <path
-       inkscape:connector-curvature="0"
-       style="opacity:1;fill:#ff0000;fill-opacity:0.25;stroke:none;stroke-width:0.1;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
-       d="m 830.30495,893.79595 0,100.28123 592.52325,0 0,-100.28123 -592.52325,0 z"
-       id="rect4324" />
     <text
        xml:space="preserve"
        style="font-style:normal;font-weight:normal;font-size:40px;line-height:125%;font-family:sans-serif;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
@@ -323,17 +347,6 @@
          id="tspan4331"
          x="1009.1192"
          y="342.77835">default colors</tspan></text>
-    <text
-       sodipodi:linespacing="125%"
-       id="text4341"
-       y="947.06403"
-       x="1001.6507"
-       style="font-style:normal;font-weight:normal;font-size:40px;line-height:125%;font-family:sans-serif;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
-       xml:space="preserve"><tspan
-         y="947.06403"
-         x="1001.6507"
-         id="tspan4343"
-         sodipodi:role="line">hodor hodor</tspan></text>
     <rect
        style="opacity:1;fill:#33ff33;fill-opacity:0.375;stroke:none;stroke-width:8;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
        id="rect4208"
@@ -424,11 +437,6 @@
          x="1009.1192"
          id="tspan4250"
          sodipodi:role="line">bought</tspan></text>
-    <path
-       inkscape:connector-curvature="0"
-       style="opacity:1;fill:#33ff33;fill-opacity:0.375;stroke:none;stroke-width:8;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
-       d="m 856.40847,925.00885 0,69.06833 123.23825,0 0,-69.06833 -123.23825,0 z"
-       id="rect4232" />
     <text
        xml:space="preserve"
        style="font-style:normal;font-weight:normal;font-size:40px;line-height:125%;font-family:sans-serif;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
@@ -472,5 +480,46 @@
          x="89.155998"
          y="679.59161"
          id="tspan4173">pieces: 300px (25%)</tspan></text>
+    <path
+       style="opacity:1;fill:#0000ff;fill-opacity:0.25098041;stroke:none;stroke-width:30;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
+       d="M 800 1034.8574 L 800 1182 L 1515.7617 1182 L 1515.7617 1034.8574 L 800 1034.8574 z "
+       transform="translate(0,-129.6379)"
+       id="rect4219" />
+    <text
+       sodipodi:linespacing="125%"
+       id="text4224"
+       y="998.61456"
+       x="819.62683"
+       style="font-style:normal;font-weight:normal;font-size:40px;line-height:125%;font-family:sans-serif;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+       xml:space="preserve"><tspan
+         y="998.61456"
+         x="819.62683"
+         id="tspan4226"
+         sodipodi:role="line">42h | confirm purchase?</tspan></text>
+    <path
+       style="opacity:1;fill:#ff0000;fill-opacity:0.25098041;stroke:none;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
+       d="M 1318.5723 1072 L 1318.5723 1182 L 1415.7148 1182 L 1415.7148 1072 L 1318.5723 1072 z "
+       transform="translate(0,-129.6379)"
+       id="rect4747" />
+    <path
+       style="opacity:1;fill:#33ff33;fill-opacity:0.3764706;stroke:none;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
+       d="M 1415.7148 1072 L 1415.7148 1182 L 1515.7617 1182 L 1515.7617 1072 L 1415.7148 1072 z "
+       transform="translate(0,-129.6379)"
+       id="rect4749" />
+    <path
+       style="fill:none;fill-rule:evenodd;stroke:#ffffff;stroke-width:5;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+       d="m 1440.9826,1012.7211 18.1828,18.1827 39.4574,-68.34231"
+       id="path4762"
+       inkscape:connector-curvature="0" />
+    <path
+       style="fill:none;fill-rule:evenodd;stroke:#ffffff;stroke-width:5;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;stroke-miterlimit:4;stroke-dasharray:none"
+       d="m 1387.9496,967.0042 -38.5917,66.8428"
+       id="path4768"
+       inkscape:connector-curvature="0" />
+    <path
+       inkscape:connector-curvature="0"
+       id="path4770"
+       d="m 1349.3579,967.0042 38.5917,66.8428"
+       style="fill:none;fill-rule:evenodd;stroke:#ffffff;stroke-width:5;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;stroke-miterlimit:4;stroke-dasharray:none" />
   </g>
 </svg>