Adds ability to bold text of the current move/half move

index.html

@@ -229,6 +229,51 @@ <h1>9) Middle Game Demo</h1>
       Bc5+ 28. Qf2 Qc1+ 29. Ne1 Qxe1# 0-1
       </pre>
     </div>
+
+
+    <div id="game10">
+      <h1>10) Bold current move</h1>
+      <div>
+        <a class="back" href="#">Back</a>
+        <a class="next" href="#">Next</a>
+        <a class="flip" href="#">Flip</a>
+      </div>
+      <div id="board10" class="board"></div>
+      <p class="annot"></p>
+
+      <div class="pgn">
+      <pre id="bold">
+      [Event "USA-06.Congress New York"]
+      [Site "USA-06.Congress New York"]
+      [Date "1889.??.??"]
+      [EventDate "?"]
+      [Round "32"]
+      [Result "0-1"]
+      [White "Jean Taubenhaus"]
+      [Black "Dion M Martinez"]
+      [ECO "C30"]
+      [WhiteElo "?"]
+      [BlackElo "?"]
+      [PlyCount "42"]
+
+      1.e4 {Notes by Steinitz.} e5 2.f4 Bc5 3.Nf3 d6 4.Bc4 Nc6 5.c3
+      Bg4 {Not good, though feasable if White had played 5.Nc3} 6.h3
+      Bxf3 7.Qxf3 Qf6 {?} 8.d3 Nge7 9.f5 O-O-O 10.b4 {?} Nxb4 {The
+      proper answer for if White take the knight, Black wins the
+      Rook by Bd4.} 11.Na3 {It would have been useless to attempt a
+      diversion now by g4 as Black would answer d5 and bring the
+      Queen to the Q side.} d5 {!} 12.Rb1 dxc4 13.cxb4 Rxd3 14.Qg4
+      h5 15.Qg5 Rhd8 16.Ke2 {Exchanging queens was much better, but
+      the game was lost.} Qc6 {! Black has played the attack in
+      remarkably finestyle from the eleventh move, and this
+      sacrifice of a piece evidences high ingenuity.} 17.bxc5 f6
+      {All in forcible attacking style.} 18.Qxg7 Qxe4+ 19.Kf2 Nxf5
+      20.Re1 {He had no good resource, as Black also threatened
+      Qd4+.} Qh4+ 21.g3 Rxg3 0-1
+      </pre>
+      </div>
+    </div>
   </div>
 </body>
 </html>
+

javascripts/app.js

@@ -33,5 +33,6 @@ jQuery(function($) {
   loadChessGame( '#game9', { pgn : $('#middle-game').html() }, function(chess) {
     chess.transitionTo(25);
   });
-
+  loadChessGame( '#game10', { linked_pgn : $('#bold'), pgn : $('#bold').html() } )
 });
+

javascripts/jchess-0.1.0.js

@@ -24,12 +24,13 @@
  */
 
 // If Firebug is not installed, prevent console.log() from creating error messages
-if (typeof console == "undefined") { var console = { log: function() {} }; }
+        if (typeof console == "undefined") { var console = { log: function() {} }; }
 
 // Iterate within an arbitrary context...
+
 jQuery.eachWithContext = function(context, object, callback) {
   for ( var i = 0, length = object.length, value = object[0];
-    i < length && callback.call(context, i, value ) !== false; value = object[++i] ) {}
+        i < length && callback.call(context, i, value ) !== false; value = object[++i] ) {}
 };
 
 (function($) {
@@ -43,7 +44,7 @@ jQuery.eachWithContext = function(context, object, callback) {
       castling_availability : 'KQkq',
       en_passant_square : '-',
       halfmove_clock : 0,
-      fullmove_number : 1,
+
       halfmove_number : 0,
 
       header : [],
@@ -54,9 +55,8 @@ jQuery.eachWithContext = function(context, object, callback) {
 
       next_piece_id : 64,
       transitions : [],
-      board_direction : 1
+      board_direction : 1,
     };
-
   };
 
   /* Add chess() to the jQuery namespace */
@@ -73,7 +73,8 @@ jQuery.eachWithContext = function(context, object, callback) {
       square_size : 43,
       offsets : { left: 0, top: 0},
       board_element_selector : '.chess-board',
-      json_annotations : false
+      json_annotations : false,
+      headers : ['Event','Site','Date','Round','White','Black','Result']
     },
 
     prototype : {
@@ -86,6 +87,7 @@ jQuery.eachWithContext = function(context, object, callback) {
 
         this.setUpBoard( this.parseFEN( this.settings.fen ) );
         this.writeBoard();
+        this.displayPGN();
       },
 
       boardElement : function() {
@@ -183,13 +185,20 @@ jQuery.eachWithContext = function(context, object, callback) {
           this.runTransitions(this.game.transitions[this.game.halfmove_number].forward);
           this.game.halfmove_number++;
         }
+        this.displayPGN();
       },
 
       transitionBackward : function() {
         if (this.game.halfmove_number > 0) {
           this.game.halfmove_number--;
           this.runTransitions(this.game.transitions[this.game.halfmove_number].backward);
         }
+        this.displayPGN();
+      },
+
+
+      fullmoveNumber: function(){
+        return Math.floor(this.game.halfmove_number/2)+1;
       },
 
       // Example transitions
@@ -203,18 +212,22 @@ jQuery.eachWithContext = function(context, object, callback) {
           var id              = pieces[1];
 
           switch(transition_type) {
-            case 'r':
-              this.removeDomPiece(id);
-              break;
-            case 'm':
-              this.moveDomPiece(id, { from : pieces[2], to : pieces[3] });
-              break;
-            case 'a':
-              this.addDomPiece(id, pieces[2], pieces[3]);
-              break;
+          case 'r':
+            this.removeDomPiece(id);
+            break;
+          case 'm':
+            this.moveDomPiece(id, { from : pieces[2], to : pieces[3] });
+            break;
+          case 'a':
+            this.addDomPiece(id, pieces[2], pieces[3]);
+            break;
           }
 
         });
+
+
+
+
       },
 
       clearBoard : function() {
@@ -261,13 +274,14 @@ jQuery.eachWithContext = function(context, object, callback) {
         var instance = this;
         // Recognize escaped closing curly brackets as part of the comment
         // This allows us to have json encoded comments
-        pgn = pgn.replace(/\{((\\})|([^}]))+}/g, function(){ return instance.pluckAnnotation.apply(instance, arguments); });
+        pgn = pgn.replace(/\{((\\})|([^}]))+}/g, function(){
+          return instance.pluckAnnotation.apply(instance, arguments);
+        });
 
-        var headers = ['Event','Site','Date','Round','White','Black','Result'];
-        for (var i=0; i < headers.length; i++) {
-          var re      = new RegExp(headers[i] + ' "([^"]*)"]');
+        for (var i=0; i < this.settings.headers.length; i++) {
+          var re      = new RegExp(this.settings.headers[i] + ' "([^"]*)"]');
           var result  = re.exec(pgn);
-          this.game.header[headers[i]] = (result == null) ? "" : result[1];
+          this.game.header[this.settings.headers[i]] = (result == null) ? "" : result[1];
         }
 
         // Find the body
@@ -290,6 +304,7 @@ jQuery.eachWithContext = function(context, object, callback) {
             return;
           }
 
+
           this.game.moves[move_number] = move;
 
           // console.log("Processing move: " + move_number + '.' + move);
@@ -306,7 +321,7 @@ jQuery.eachWithContext = function(context, object, callback) {
             this.movePiece(move_number, {from : "e" + rank, to : "g" + rank} );
             this.movePiece(move_number, {from : "h" + rank, to : "f" + rank} );
 
-          // If the move was a piece
+            // If the move was a piece
           } else if ( this.patterns.piece_move.test(move) ) {
             var m = this.patterns.piece_move.exec(move);
             var piece = m[0];
@@ -382,9 +397,57 @@ jQuery.eachWithContext = function(context, object, callback) {
         });
       },
 
+
+      displayPGN: function() {
+
+        if(!this.settings.linked_pgn) return;
+
+        var output_text = "";
+        for (var i=0; i < this.settings.headers.length; i++) {
+          output_text += "[" + this.settings.headers[i] + " \"" + this.game.header[this.settings.headers[i]]  + "\"]" + "<br/>";
+        }
+        output_text += "<br/>";
+
+        for (var i=0; i < this.game.moves.length; i++) {
+          itr_fullmove_number = Math.floor(i/2)+1;
+          itr_halfmove_number = i;
+
+          // display the number
+          if(itr_halfmove_number%2==0){
+            move_num = itr_fullmove_number  + ". ";
+            if(this.fullmoveNumber()==itr_fullmove_number){
+              output_text += "<b>"+move_num+"</b>";
+            }
+            else{
+              output_text += move_num
+            }
+          }
+
+          // move
+          if(this.fullmoveNumber()==itr_fullmove_number &&
+             this.game.halfmove_number==itr_halfmove_number ){
+            output_text += "<b>"+this.game.moves[i]+"</b> ";
+          }
+          else {
+            output_text += this.game.moves[i] + " ";
+          }
+
+
+          // annotatioon
+          if(this.game.annotations[itr_halfmove_number]){
+            output_text += "{"+ this.game.annotations[itr_halfmove_number] +"} "
+          }
+        }
+
+
+
+        this.settings.linked_pgn.html(output_text);
+      },
+
       // src_square = square the piece is currently on
       // dst_square = square the piece will move to
       cantMoveFromAbsolutePin : function(piece, src_square, dst_square) {
+
         // Look for an open vector from piece to the king.
         var piece_char = piece.piece;
         var player     = ( piece_char == piece_char.toLowerCase() ) ? 'b' : 'w';
@@ -537,7 +600,7 @@ jQuery.eachWithContext = function(context, object, callback) {
           return piece;
         };
         return null;
-     },
+      },
 
       pieceAt : function(algebraic) {
         var square = this.algebraic2Coord(algebraic);
@@ -663,6 +726,7 @@ jQuery.eachWithContext = function(context, object, callback) {
         annot       = annot.replace(/\\\{/g, '{');
         annot       = annot.replace(/\\\}/g, '}');
 
+
         if (this.settings.json_annotations) {
           eval("annot = " + annot);
         }
@@ -684,6 +748,7 @@ jQuery.eachWithContext = function(context, object, callback) {
           current_annotations.push(annot);
         }
 
+
         this.game.annotations[this.game.halfmove_number] = current_annotations;
       },
 
@@ -771,3 +836,4 @@ jQuery.eachWithContext = function(context, object, callback) {
     }
   });
 })(jQuery);
+

stylesheets/chess.css

@@ -1,3 +1,14 @@
+
+.pgn pre {
+ overflow-x: auto; /* Use horizontal scroller if needed; for Firefox 2, not needed in Firefox 3 */
+ white-space: pre-wrap; /* css-3 */
+ white-space: -moz-pre-wrap !important; /* Mozilla, since 1999 */
+ white-space: -pre-wrap; /* Opera 4-6 */
+ white-space: -o-pre-wrap; /* Opera 7 */
+ /* width: 99%; */
+ word-wrap: break-word; /* Internet Explorer 5.5+ */
+}
+
 .chess-board {
   margin: 0 auto;
   position: relative;
@@ -27,3 +38,4 @@
 .chess-board .br { background: transparent url(../images/chess-sets/acmaster.gif) -136px -46px; }
 .chess-board .bq { background: transparent url(../images/chess-sets/acmaster.gif) -181px -46px; }
 .chess-board .bk { background: transparent url(../images/chess-sets/acmaster.gif) -226px -46px; }
+