Messing with Qwebchess

Now has unicode pieces
Now doesn't actually work (although I think it didn't work before either)

[SZM]

diff --git a/web/qwebchess/index.html b/web/qwebchess/index.html
index cdfd063..73b77c0 100644 (file)
--- a/web/qwebchess/index.html
+++ b/web/qwebchess/index.html
@@ -23,4 +23,4 @@
 <small>Made By Sam Moore [SZM] and Mitchell Pomery [BG3]</small>\r
 </div>\r
 </body>\r
-</html>
\ No newline at end of file
+</html>\r

diff --git a/web/qwebchess/js.js b/web/qwebchess/js.js
index 732ec4e..e02328b 100644 (file)
--- a/web/qwebchess/js.js
+++ b/web/qwebchess/js.js
@@ -2,15 +2,24 @@
 //progcomp.ucc.asn.au/cgi-bin/qchess.cgi?r=quit\r
 //progcomp.ucc.asn.au/cgi-bin/qchess.cgi?x=X&y=Y (0 indexed)\r
 \r
-pieceSelected = "";\r
+pieceSelected = ""; // currently selected piece\r
 piece = "";\r
+colour = "W"; // colour of this player\r
 \r
+// Unicode representations of chess pieces\r
+pieceChar = {"W" : { "p" : "\u2659", "h" : "\u2658", "b" : "\u2657", "r" : "\u2656", "q" : "\u2655", "k" : "\u2654", "?" : "?"},\r
+            "B" : { "p" : "\u265F", "h" : "\u265E", "b" : "\u265D", "r" : "\u265C", "q" : "\u265B", "k" : "\u265A", "?" : "?"}};\r
+\r
+// Select (or move) a piece\r
 function selectPiece(loc) {\r
        x = (""+loc).charAt(1);\r
        y = (""+loc).charAt(0);\r
        //alert(loc);\r
+\r
+       // work out whether to select or move based on the comment tag for the clicked location\r
+       // It is either "<!--W-->" (white; select) or <!--B-->" (black) or "<!--0-->" (empty)\r
        if (pieceSelected == "") {\r
-               if (document.getElementById(loc).innerHTML.charAt(0) == "W") {\r
+               if (document.getElementById(loc).innerHTML.charAt(4) == colour) {\r
                        console.log("Piece Selected: " + loc);\r
                        pieceSelected = loc;\r
                        ajaxUpdate("x=" + x + "&y=" + y);\r
@@ -19,8 +28,8 @@ function selectPiece(loc) {
        else {\r
                //alert("pieceMoved");\r
                if (validMove(pieceSelected, piece, loc)) {\r
-                       ajaxUpdate("x=" + x + "&y=" + y);\r
                        doMove(pieceSelected, loc);\r
+                       ajaxUpdate("x=" + x + "&y=" + y);\r
                        pieceSelected = "";\r
                }\r
                else {\r
@@ -38,7 +47,10 @@ function doMove(start, end) {
        end = document.getElementById(end);\r
        htmlToMove = begin.innerHTML;\r
        end.innerHTML = htmlToMove;\r
-       begin.innerHTML = "";\r
+       begin.innerHTML = "<!--0--> <p>&nbsp;</p>";\r
+\r
+       if (end[end.length-1] % 2 == 0)\r
+               end.innerHTML.replace(/<big>.*<\/big>/i, "<big>?</big>");\r
        //console.log("Piece Moved");\r
 }\r
 \r
@@ -59,12 +71,12 @@ function boardLoad() {
        }\r
        \r
        //Place pieces on the board\r
-       //Pawns\r
        for (i = 0; i < 8; i++) {\r
                black = document.getElementById("1" + i);\r
                white = document.getElementById("6" + i);\r
-               black.innerHTML = "B<br /><small>p</small> <bold>?</bold> <small>?</small></span>";\r
-               white.innerHTML = "W<br /><small>p</small> <bold>?</bold> <small>?</small></span>";\r
+               //pawns\r
+               black.innerHTML = "<!--B--> " + pieceChar["B"]["p"] + " <big> <bold>?</bold> </big> ?";\r
+               white.innerHTML = "<!--W--> " + pieceChar["W"]["p"] + " <big> <bold>?</bold> </big> ?";\r
                \r
                black = document.getElementById("0" + i);\r
                white = document.getElementById("7" + i);\r
@@ -79,9 +91,16 @@ function boardLoad() {
                        piece = "k";\r
                if (i == 4)\r
                        piece = "q";\r
-               \r
-               black.innerHTML = "B<br /><small>" + piece + "</small> <bold>?</bold> <small>?</small>";\r
-               white.innerHTML = "W<br /><small>" + piece + "</small> <bold>?</bold> <small>?</small>";\r
+               //major pieces\r
+               black.innerHTML = "<!--B--> " + pieceChar["B"][piece] + "<big> <bold>?</bold> </big> ?";\r
+               white.innerHTML = "<!--W--> " + pieceChar["W"][piece] + "<big> <bold>?</bold> </big> ?";\r
+\r
+               // empty squares\r
+               for (j = 2; j < 6; j++)\r
+               {\r
+                       square = document.getElementById(""+j + i);\r
+                       square.innerHTML = "<!--0--> <p>&nbsp;</p>";\r
+               }\r
        }\r
        \r
        setTimeout(function(){ajaxUpdate("r=start");}, 1000);\r
@@ -112,11 +131,44 @@ function ajaxUpdate(queryString) {
        //alert(queryString);\r
        \r
        // Create a function that will receive data sent from the server\r
-       ajaxRequest.onreadystatechange = function () {\r
+       ajaxRequest.onreadystatechange = function () \r
+       {\r
                //alert("RS" + ajaxRequest.readyState);\r
                if (ajaxRequest.readyState == 4) {\r
                        console.log("AJAX Response: " + ajaxRequest.responseText);\r
-                       ret = ""+ajaxRequest.responseText;\r
+                       lines = ajaxRequest.responseText.split("\n");\r
+\r
+                       for (var i = 0; i < lines.length; ++i)\r
+                       {\r
+                               tokens = lines[i].split(" ")\r
+\r
+                               if (isNaN(tokens[0]) || isNaN(tokens[1]))\r
+                                       continue;\r
+\r
+                               pieceSelected = ""+tokens[1]+""+tokens[0];\r
+                                square = document.getElementById(pieceSelected);\r
+                                html = square.innerHTML;\r
+                               c = html.charAt(4);\r
+                               if (tokens[2] == "->" && document.getElementById(""+tokens[4] + "" + tokens[3]).innerHTML.charAt(4) != colour)\r
+                               {\r
+                                       doMove(""+tokens[1] + "" + tokens[0], ""+tokens[4] + "" + tokens[3]);\r
+                               }\r
+                               else if (tokens.length == 4 && !isNaN(tokens[0]) && !isNaN(tokens[1]) && !isNaN(tokens[2]) && isNaN(tokens[3]))\r
+                               {\r
+                                       piece = tokens[3];\r
+                                       if (piece == "knight") //HACK\r
+                                               piece = "h";    \r
+                                       else\r
+                                               piece = ""+piece.charAt(0);\r
+                                       if (tokens[2] == "1")\r
+                                               html[html.length-1] = pieceChar[c][piece];\r
+\r
+                                       square.innerHTML = html.replace(/<big> <bold>.*<\/bold> <\/big>/i, "<big> <bold>"+pieceChar[c][piece]+"</bold> </big>");        \r
+                                       console.log("innerHTML = " + square.innerHTML);\r
+                               }\r
+                       }\r
+\r
+                       /*\r
                        if (ret.charAt(4) == "-" && ret.charAt(5) == ">") {\r
                                //Piece has been moved\r
                                //console.log("Moving other piece");\r
@@ -155,7 +207,7 @@ function ajaxUpdate(queryString) {
                                        content.innerHTML = contentHTML;\r
                                }\r
                        }\r
-                       \r
+                       */\r
                        //alert(ret);\r
                }\r
        }\r
@@ -177,4 +229,4 @@ function ajaxUpdate(queryString) {
 function replaceAt(s, n, t) {\r
        //console.log(s.substring(0, n) + "\n" + t + "\n" + s.substring(n + 1) + "\n");\r
        return (s.substring(0, n) + t + s.substring(n + 1));\r
-}
\ No newline at end of file
+}\r