added the revert-last-move button

Author: stephanrauh

Chess/ApplicationComponent.html

@@ -14,7 +14,12 @@ <h3 class="panel-title">{{title}}</h3>
           <div class="row">
             <div class="col-md-9">
               <chessboard></chessboard>
+              <br />
+              <button type="button" class="btn btn-primary" (click)="suggestMove()">Suggest move</button>
+              <button type="button" class="btn btn-primary" (click)="turnSides()">Turn sides</button>
+              <button type="button" class="btn btn-danger"  (click)="revertLastMove()">Revert last move</button>
             </div>
+
             <div class="col-md-3">
               <captured-pieces />
             </div>

Chess/FieldComponent.html

@@ -10,7 +10,9 @@
              (click)="onclick(row, col)"
          />
   </div>
-  <div style="position: absolute; top: 0px; left: 0px;">
+  <!--
+  <div style="position: absolute; top: 0px; left: 0px" >
     {{ownThreats(row, col)}} / {{opponentThreats(row, col)}}
   </div>
+-->
 </div>

Chess/applicationcomponent.js

@@ -31,6 +31,21 @@ class ApplicationComponent {
         result += " Player is in check!";
     return result
   }
+
+  public suggestMove(): boolean {
+    alert("Suggest move hasn't been implemented yet");
+    return false;
+  }
+
+  public turnSides(): boolean {
+    alert("Turn sides hasn't been implemented yet");
+    return false;
+  }
+
+  public revertLastMove(): boolean {
+    this.chessboard.revertLastMove();
+    return false;
+  }
 }
 
 bootstrap(ApplicationComponent);

Chess/applicationcomponent.js.map

@@ -85,6 +85,10 @@ Dependency Injection:
 TypeScript modules:
   http://typescript.codeplex.com/wikipage?title=Modules%20in%20TypeScript&referringTitle=TypeScript%20Documentation
 
+TypeScript:
+  Never forget to add "this." to refer to instance methods and variables
+  interesting / intuitive approach to getters and setters
+
 Everything is a tree!
   * You always have to define the component you want to use as child components in the parent component. Otherwise,
     they simply won't be rendered. More precisely, their source code or pseudo tag will be rendered.

Chess/applicationcomponent.ts

@@ -18,3 +18,11 @@
   top:0px;
   position:relative;
 }
+
+.threatenedField {
+  border: 2px solid red;
+  width:52px;
+  height:52px;
+  top:0px;
+  position:relative;
+}