[Toss-devel-svn] SF.net SVN: toss:[1466] trunk/Toss
Status: Beta
Brought to you by:
lukaszkaiser
From: <luk...@us...> - 2011-05-30 20:31:09
|
Revision: 1466 http://toss.svn.sourceforge.net/toss/?rev=1466&view=rev Author: lukaszkaiser Date: 2011-05-30 20:31:01 +0000 (Mon, 30 May 2011) Log Message: ----------- More JavaScript orders. Modified Paths: -------------- trunk/Toss/Server/ReqHandler.ml trunk/Toss/WebClient/Connect.js trunk/Toss/WebClient/Main.js trunk/Toss/WebClient/index.html trunk/Toss/WebClient/profile.html Added Paths: ----------- trunk/Toss/WebClient/State.js Removed Paths: ------------- trunk/Toss/WebClient/Drawing.js Modified: trunk/Toss/Server/ReqHandler.ml =================================================================== --- trunk/Toss/Server/ReqHandler.ml 2011-05-30 01:25:16 UTC (rev 1465) +++ trunk/Toss/Server/ReqHandler.ml 2011-05-30 20:31:01 UTC (rev 1466) @@ -257,14 +257,9 @@ let moves = List.fold_left append_move [] (client_get_loc_moves cur_loc) in String.concat "; " (List.map client_move_str moves) -let client_get_loc_player i = - let msg = client_msg ("GET LOC PLAYER " ^ i) in - if (String.length msg > 3 && String.sub msg 0 3 = "ERR") then "-1" else msg - let client_make_move m r endp = let _ = client_apply_rule r m "1.0" [] in - client_set_cur_loc endp; - client_get_loc_player endp + client_set_cur_loc endp let client_get_data data_id = let m = client_msg ("GET DATA " ^ data_id) in @@ -285,13 +280,14 @@ let m = client_msg ("EVAL LOC MOVES " ^ advr ^ ".0 " ^ loc ^ " TIMEOUT " ^ timeout ^ " 55500 alpha_beta_ord") in client_set_time ts t; + print_endline m; let msg = Array.map strip_ws (split ";" m) in if Array.length msg < 2 then "" else let append_emb emb s = let es = Array.map strip_ws (split ":" s) in (es.(0), es.(1)) :: emb in let emb = List.fold_left append_emb [] (split_list "," msg.(1)) in - client_move_str (string_of_int pl, emb, msg.(0), msg.(3)) + client_move_str (pl, emb, msg.(0), msg.(3)) let client_model_get_elem_val el_id vl = @@ -473,12 +469,11 @@ let info = client_get_game_info () in let model = client_get_model () in let loc = client_get_cur_loc () in - let move_pl = int_of_string (client_get_loc_player loc) - 1 in get_global_lock (); let pid = string_of_int (get_free_id ()) in - db_cur_insert game pl1 pl2 pid (string_of_int move_pl) model loc info ""; + db_cur_insert game pl1 pl2 pid "0" model loc info ""; release_global_lock (); - pid ^ "$" ^ info ^ "$" ^ (string_of_int move_pl) in + pid ^ "$" ^ info in let game_select_s pid = "playid=" ^ pid in let db_escape s = str_replace "'" "''" s in let move_play move_tup pid = @@ -492,7 +487,7 @@ client_set_cur_loc old_loc; let (move1a, move2, move3) = move_tup in let move1 = strip_all ["{"; "}"] move1a in - let new_pl = int_of_string (client_make_move move1 move2 move3) - 1 in + client_make_move move1 move2 move3; let new_toss = db_escape (client_get_model ()) in let new_info = client_get_game_info () in let new_info_db = db_escape new_info in @@ -501,12 +496,12 @@ cur_upd ("toss='" ^ new_toss ^ "'"); cur_upd ("info='" ^ new_info_db ^ "'"); cur_upd ("loc='" ^ move3 ^ "'"); - cur_upd ("move=" ^ (string_of_int new_pl)); + cur_upd ("move=" ^ (string_of_int ((int_of_string m) + 1))); DB.insert_table dbFILE "old_states" "playid, game, player1, player2, move, toss, loc, info, svg" [pid; g; p1; p2; m; old_toss; old_loc; old_info; old_svg]; - new_info ^ "$" ^ (string_of_int new_pl) in - let suggest time pid = + new_info in + let suggest player time pid = let res = List.hd (dbtable (game_select_s pid) "cur_states") in let (g, m, toss, loc) = (res.(1),int_of_string res.(4), res.(5), res.(6)) in let game_toss = (List.hd (dbtable ("game='" ^ g ^ "'") "games")).(1) in @@ -514,7 +509,7 @@ client_set_cur_loc loc; let adv_ratio_data = client_get_data "adv_ratio" in let adv_ratio = if adv_ratio_data = "none" then "4" else adv_ratio_data in - client_suggest (m+1) time adv_ratio in + client_suggest player time adv_ratio in let register_user ui = if Array.length ui <> 5 then false else let (uid, name, surname, email, pwd) = @@ -538,7 +533,7 @@ let open_db pid = let res = dbtable (game_select_s pid) "cur_states" in let (move, info) = ((List.hd res).(4), (List.hd res).(7)) in - info ^ "$" ^ move in + info in let add_opponent uid oppid = if uid = "" then "You must login first to add opponents." else let (name, _, _) = get_user_name_surname_mail oppid in @@ -599,7 +594,7 @@ | "NEW_PLAY" -> let a = get_args data in new_play a.(0) a.(1) a.(2), [] | "SUGGEST" -> - let a = get_args data in suggest a.(0) a.(1), [] + let a = get_args data in suggest a.(0) a.(1) a.(2), [] | "MOVE_PLAY" -> let (op_i, cl_i) = (String.index data '(', String.index data ')') in let tp_s = String.sub data (op_i+1) (cl_i - op_i-1) in Modified: trunk/Toss/WebClient/Connect.js =================================================================== --- trunk/Toss/WebClient/Connect.js 2011-05-30 01:25:16 UTC (rev 1465) +++ trunk/Toss/WebClient/Connect.js 2011-05-30 20:31:01 UTC (rev 1466) @@ -111,8 +111,8 @@ this.make_move = function (move_s, pid, cont) { async_srv("MOVE_PLAY", move_s + ', ' + pid, cont); } - this.suggest = function (time, pid, cont) { - async_srv("SUGGEST", time + ', ' + pid, cont); + this.suggest = function (player, time, pid, cont) { + async_srv("SUGGEST", player + ', ' + time + ', ' + pid, cont); } this.friends = function () { return (srv ("LIST_FRIENDS", "user")); } Deleted: trunk/Toss/WebClient/Drawing.js =================================================================== --- trunk/Toss/WebClient/Drawing.js 2011-05-30 01:25:16 UTC (rev 1465) +++ trunk/Toss/WebClient/Drawing.js 2011-05-30 20:31:01 UTC (rev 1466) @@ -1,535 +0,0 @@ -// JavaScript Toss Module -- Drawing - -var SVG_WIDTH = 500; -var SVG_HEIGHT = 500; -var SVG_MARGINX = 50; -var SVG_MARGINY = 50; -var VIEW_MIRROR = 0; - - -// ------ Move Object ----- - -// Create a move from the string [s]. -function Move (s) { - var vals = []; - var arr = strip('(', ')', s).split(','); - for (var i = 0; i < arr.length; i++) { - if (arr[i].indexOf(':') > -1) { - var v = arr[i].substring (arr[i].indexOf(':')+1, arr[i].length); - vals.push (strip ('\'', ' ', strip ('{', '}', v))); - } - } - vals.sort (); - this.matched = vals; - this.length = vals.length; - this.rule = strip ("'", " ", - s.substring (s.indexOf("},")+3, s.lastIndexOf(','))); - this.matched_str = strip (' ', ' ', this.matched.toString ()); - this.def_str = s; - return (this) -} - -function move_did_match (s) { - for (var i = 0; i < this.matched.length; i++) { - if (this.matched[i] == s) { return (true) } - } - return (false); -} -Move.prototype.did_match = move_did_match; - - -// --------- Elem and Rel Objects ----- - -function Elem (id, x, y) { - this.id = id; - this.x = x; - this.y = y; -} - -function Rel (name, args) { - this.name = name; - this.args = args; -} - - -// --------- State Object ------ - - -// Object representing a state of the system (game). -function State (game, info_string) { - // We create an SVG box with margins depending on the game. - this.game = game; - - var create_svg_box = function (margx, margy, parent_id) { - SVG_MARGINX = margx; - SVG_MARGINY = margx; - var svg = document.createElementNS('http://www.w3.org/2000/svg','svg'); - svg.setAttribute('id', 'svg'); - var wx = SVG_WIDTH + 2*SVG_MARGINX + 20; - var wy = SVG_HEIGHT + 2*SVG_MARGINY + 20; - svg.setAttribute('viewBox', '-10 -10 ' + wx + " " + wy); - document.getElementById(parent_id).appendChild(svg); - } - - if (game == "Tic-Tac-Toe" || game == "Concurrent-Tic-Tac-Toe") { - create_svg_box (130, 130, "board"); // bigger margins needed - } else { - create_svg_box (40, 40, "board"); - } - - // Private: Translate position from Model coordinates to SVG coordinates. - var translate_pos = function (pos, minx, miny, width, height) { - var x = ((pos[0] - minx) * SVG_WIDTH) / width; - if (VIEW_MIRROR == 0) { - var y = ((pos[1] - miny) * SVG_HEIGHT) / height; - } else { - var y = ((height - (pos[1] - miny))*SVG_WIDTH) / height; - } - return ([x + SVG_MARGINX, y + SVG_MARGINY]) - }; - - // The info is a $-separated array of 5 components. - var res_arr = []; - res_arr = info_string.split("$"); - if (res_arr.length != 5) { alert (res_arr); return (undefined); } - - // The first component gives the dimenstions of the structure. - var dim = strip('(', ')', res_arr[0]).split(','); - this.maxx = parseFloat(strip(' ', ' ', dim[0])); - this.minx = parseFloat(strip(' ', ' ', dim[1])); - this.maxy = parseFloat(strip(' ', ' ', dim[2])); - this.miny = parseFloat(strip(' ', ' ', dim[3])); - this.width = Math.max (SVG_WIDTH / 100, (this.maxx - this.minx)); - this.height = Math.max (SVG_HEIGHT / 100, (this.maxy - this.miny)); - - // The second component is the list of elements of the structure. - var l = convert_python_list(',', res_arr[1]); - this.elems = []; - for (var i = 0; i < l.length; i++) { - var e = convert_python_list (';', l[i]); - var pos = translate_pos ([parseFloat(e[1]), parseFloat(e[2])], - this.minx, this.miny, this.width, this.height); - this.elems.push (new Elem (e[0], pos[0], pos[1])); - } - - var find_elem = function (elem_id, els) { - for (var i = 0; i < els.length; i++) { - if (els[i].id == elem_id) { return (els[i]); } - } - return (undefined); - } - - // The third component are the relations in the structure. - var r = convert_python_list(';', res_arr[2]); - var rels = []; - for (var i = 0; i < r.length; i++) { - var rel_name = strip(' ', '\'', r[i].substring(1,r[i].indexOf(','))); - var args_s = r[i].substring(r[i].indexOf('[')+1, r[i].indexOf(']')); - var args = convert_python_list (',', args_s); - var is_undefined = false; - for (var j = 0; j < args.length; j++) { - args[j] = find_elem (args[j], this.elems); - if (args[j] == undefined) { is_undefined = true }; - } - if (rel_name[0] != "_" && args_s != "''" && is_undefined == false) { - rels.push (new Rel (rel_name, args)); - } - } - this.rels = rels; - - // The fourth component is either the list of possible moves. - // If there are no moves possible, it is the payoff. - if (res_arr[3].substring(2, 3) == "(") { - var move_strs = convert_python_list (';', res_arr[3]); - var mvs = []; - for (i = 0; i < move_strs.length; i++) { - mvs.push (new Move (move_strs[i])); - } - this.moves = mvs; - this.payoff = ""; - } else { - this.moves = []; - this.payoff = res_arr[3]; - }; - - // The last component is the player (to be removed). - this.PLAYER_STR = res_arr[4]; - - return (this); -} - -// Get moves applicable to [elem] in a game. -function state_get_moves (elem, other) { - var elem_moves = []; - for (i = 0; i < this.moves.length; i++) { - if (this.moves[i].did_match(elem)) { - if (other == "") { - elem_moves.push(this.moves[i]) - } else if (this.moves[i].did_match(other)) { - elem_moves.push(this.moves[i]) - } - } - } - return (elem_moves) -} -State.prototype.get_moves = state_get_moves; - - -// ------ Drawing functions ---- - -// Helper: to draw chess board we distinguish even/odd placed elements. -function elem_class (elemid) { - var elem_cl = "model-elem"; - var is_int = function (s) { return (parseInt(s).toString() == s) }; - if (is_int (elemid.substring(1))) { - var psum = elemid.charCodeAt(0) + parseInt (elemid.substring(1)); - elem_cl = "model-elem-" + (psum % 2); - }; - return (elem_cl); -} - -// Draw the model. -function state_draw_model (game) { - var draw_background = function (game) { - var x = SVG_MARGINX; - var y = SVG_MARGINY; - var w = SVG_WIDTH + 2 * x; - var h = SVG_HEIGHT + 2 * x; - var bg = SHAPES.background_svg (game, 0, 0, w, h, []); - if (bg != undefined) {document.getElementById("svg").appendChild(bg);} - } - - // Draw the element [elem]. - var draw_elem = function (game, elem) { - if (game != "Connect4") { - var r = SHAPES.rect ( - elem.x, elem.y, 2 * SHAPES.elem_size_x, 2 * SHAPES.elem_size_y, - [["id", "elem_" + elem.id], ["class", elem_class(elem.id)], - ["onclick", ("handle_elem_click('" + elem.id + "')")]]); - document.getElementById("svg").appendChild(r); - } else { - var circ = SHAPES.circle ( - elem.x, elem.y, 30, - [["id", "elem_" + elem.id], ["class", elem_class(elem.id)], - ["onclick", "handle_elem_click('" + elem.id + "')"]]); - document.getElementById("svg").appendChild(circ); - } - } - - - // Draw relation [rel_name] between elements [args]. - function draw_rel (game, rel) { - if (rel.args.length == 1) { - var ihatrs = [["id", "pred_" + rel.args[0].id + "_" + rel.name], - ["onclick","handle_elem_click('"+rel.args[0].id+"')"]] - var pos = [rel.args[0].x, rel.args[0].y]; - var f = SHAPES.rel_svg (game, pos[0],pos[1],20,20, rel.name,ihatrs); - if (f != undefined) { - document.getElementById("svg").appendChild(f); - } else { - var circ = SHAPES.circle ( - pos[0], pos[1], SHAPES.elem_size_x - 10, - [["id", "pred_" + rel.args[0].id + "_" + rel.name], - ["class", "model-pred-" + rel.name], - ["stroke-width", (SHAPES.elem_size_x / 10) + 2], - ["onclick", ("handle_elem_click('"+rel.args[0].id+"')")]]); - document.getElementById("svg").appendChild(circ); - } - } - if (rel.args.length == 2) { - if (rel.name == "E") { - var l = SHAPES.line (rel.args[0].x, rel.args[0].y, - rel.args[1].x, rel.args[1].y, - [["class", "model-edge-E"]]); - document.getElementById("svg").appendChild(l); - } - } - } - - // Main draw_model function. - var sqrt = Math.round (Math.sqrt (this.elems.length)); - if (sqrt * sqrt == this.elems.length) { // perhaps a grid - SHAPES.elem_size_x = SVG_WIDTH / (2.0 * (sqrt-1)); - SHAPES.elem_size_y = SVG_HEIGHT / (2.0 * (sqrt-1)); - } else { - SHAPES.elem_size_x = SVG_WIDTH / 20; - SHAPES.elem_size_y = SVG_HEIGHT / 20; - } - draw_background (game); - for (var i = 0; i < this.elems.length; i++) { - draw_elem (game, this.elems[i]); - } - for (var i = 0; i < this.rels.length; i++) { - draw_rel (game, this.rels[i]); - } -} -State.prototype.draw_model = state_draw_model; - -// Highlight the element [elem]. -function state_highlight_elem (elemid) { - var e = document.getElementById ("elem_" + elemid); - e.setAttribute ("class", "model-elem-highlight"); -} -State.prototype.highlight_elem = state_highlight_elem; - -// Unhighlight the element [elem]. -function state_unhighlight_elem (elemid) { - var e = document.getElementById ("elem_" + elemid); - e.setAttribute ("class", elem_class(elemid)); -} -State.prototype.unhighlight_elem = state_unhighlight_elem; - - - - -// ------------ Shape Drawings in SVG ------------------- - -function Shapes () { - this.elem_size_x = 25; // suggested size of elements - this.elem_size_y = 25; // suggested size of elements - - var DEFpawn = '<g transform="translate(-22.5,-22.5)"> \ - <path \ - d="M 22,9 C 19.792,9 18,10.792 18,13 C 18,13.885 18.294,14.712 18.781,15.375 C 16.829,16.497 15.5,18.588 15.5,21 C 15.5,23.034 16.442,24.839 17.906,26.031 C 14.907,27.089 10.5,31.578 10.5,39.5 L 33.5,39.5 C 33.5,31.578 29.093,27.089 26.094,26.031 C 27.558,24.839 28.5,23.034 28.5,21 C 28.5,18.588 27.171,16.497 25.219,15.375 C 25.706,14.712 26,13.885 26,13 C 26,10.792 24.208,9 22,9 z " \ - class="chess-path-A" /> \ - </g>'; - - var DEFknight = '<g transform="translate(-22.5,-22.5)"> \ - <path \ - d="M 22,10 C 32.5,11 38.5,18 38,39 L 15,39 C 15,30 25,32.5 23,18" \ - class="chess-path-B" /> \ - <path \ - d="M 24,18 C 24.384,20.911 18.447,25.369 16,27 C 13,29 13.181,31.343 11,31 C 9.9583,30.056 12.413,27.962 11,28 C 10,28 11.187,29.232 10,30 C 9,30 5.9968,31 6,26 C 6,24 12,14 12,14 C 12,14 13.886,12.098 14,10.5 C 13.274,9.5056 13.5,8.5 13.5,7.5 C 14.5,6.5 16.5,10 16.5,10 L 18.5,10 C 18.5,10 19.282,8.0081 21,7 C 22,7 22,10 22,10" \ - class="chess-path-B" /> \ - <path \ - d="M 9 23.5 A 0.5 0.5 0 1 1 8,23.5 A 0.5 0.5 0 1 1 9 23.5 z" \ - transform="translate(0.5,2)" \ - class="chess-path-C" /> \ - <path \ - d="M 15 15.5 A 0.5 1.5 0 1 1 14,15.5 A 0.5 1.5 0 1 1 15 15.5 z" \ - transform="matrix(0.866,0.5,-0.5,0.866,9.6926,-5.1734)" \ - class="chess-path-C" /> \ - <path \ - d="M 37,39 C 38,19 31.5,11.5 25,10.5" \ - class="chess-path-D" /> \ - </g>'; - - var DEFbishop = '<g transform="translate(-22.5,-22.5)"> \ - <path \ - d="M 9,36 C 12.385,35.028 19.115,36.431 22.5,34 C 25.885,36.431 32.615,35.028 36,36 C 36,36 37.646,36.542 39,38 C 38.323,38.972 37.354,38.986 36,38.5 C 32.615,37.528 25.885,38.958 22.5,37.5 C 19.115,38.958 12.385,37.528 9,38.5 C 7.6459,38.986 6.6771,38.972 6,38 C 7.3541,36.055 9,36 9,36 z " \ - style="stroke-linecap:butt;" class="chess-path-B" /> \ - <path \ - d="M 15,32 C 17.5,34.5 27.5,34.5 30,32 C 30.5,30.5 30,30 30,30 C 30,27.5 27.5,26 27.5,26 C 33,24.5 33.5,14.5 22.5,10.5 C 11.5,14.5 12,24.5 17.5,26 C 17.5,26 15,27.5 15,30 C 15,30 14.5,30.5 15,32 z " \ - style="stroke-linecap:butt;" class="chess-path-B" /> \ - <path \ - d="M 25 10 A 2.5 2.5 0 1 1 20,10 A 2.5 2.5 0 1 1 25 10 z" \ - transform="translate(0,-2)" \ - style="stroke-linecap:butt;" class="chess-path-Bx" /> \ - <path \ - d="M 17.5,26 L 27.5,26" \ - style="stroke-linecap:butt;" class="chess-path-D" /> \ - <path \ - d="M 15,30 L 30,30" \ - style="stroke-linecap:butt;" class="chess-path-D" /> \ - <path \ - d="M 22.5,15.5 L 22.5,20.5" \ - style="stroke-linecap:butt;" class="chess-path-D" /> \ - <path \ - d="M 20,18 L 25,18" \ - style="stroke-linecap:butt;" class="chess-path-D" /> \ - </g>'; - - var DEFrook = '<g transform="translate(-22.5,-22.5)"> \ - <path \ - d="M 9,39 L 36,39 L 36,36 L 9,36 L 9,39 z " \ - style="stroke-linecap:butt;" class="chess-path-Bx" /> \ - <path \ - d="M 12,36 L 12,32 L 33,32 L 33,36 L 12,36 z " \ - style="stroke-linecap:butt;" class="chess-path-B" /> \ - <path \ - d="M 11,14 L 11,9 L 15,9 L 15,11 L 20,11 L 20,9 L 25,9 L 25,11 L 30,11 L 30,9 L 34,9 L 34,14" \ - style="stroke-linecap:butt;" class="chess-path-B" /> \ - <path \ - d="M 34,14 L 31,17 L 14,17 L 11,14" \ - style="stroke-linecap:butt;" class="chess-path-B" /> \ - <path \ - d="M 31,17 L 31,29.5 L 14,29.5 L 14,17" \ - style="stroke-linecap:butt;" class="chess-path-B" /> \ - <path \ - d="M 31,29.5 L 32.5,32 L 12.5,32 L 14,29.5" \ - class="chess-path-B" /> \ - <path \ - d="M 11,14 L 34,14" \ - class="chess-path-D" /> \ - </g>'; - - var DEFqueen = '<g transform="translate(-22.5,-22.5)"> \ - <path \ - d="M 9 13 A 2 2 0 1 1 5,13 A 2 2 0 1 1 9 13 z" \ - transform="translate(-1,-1)" \ - style="fill-rule: none;" class="chess-path-B" /> \ - <path \ - d="M 9 13 A 2 2 0 1 1 5,13 A 2 2 0 1 1 9 13 z" \ - transform="translate(15.5,-5.5)" \ - style="fill-rule: none;" class="chess-path-B" /> \ - <path \ - d="M 9 13 A 2 2 0 1 1 5,13 A 2 2 0 1 1 9 13 z" \ - transform="translate(32,-1)" \ - style="fill-rule: none;" class="chess-path-B" /> \ - <path \ - d="M 9 13 A 2 2 0 1 1 5,13 A 2 2 0 1 1 9 13 z" \ - transform="translate(7,-4.5)" \ - style="fill-rule: none;" class="chess-path-B" /> \ - <path \ - d="M 9 13 A 2 2 0 1 1 5,13 A 2 2 0 1 1 9 13 z" \ - transform="translate(24,-4)" \ - style="fill-rule: none;" class="chess-path-B" /> \ - <path \ - d="M 9,26 C 17.5,24.5 30,24.5 36,26 L 38,14 L 31,25 L 31,11 L 25.5,24.5 L 22.5,9.5 L 19.5,24.5 L 14,10.5 L 14,25 L 7,14 L 9,26 z " \ - style="stroke-linecap:butt;" class="chess-path-B" /> \ - <path \ - d="M 9,26 C 9,28 10.5,28 11.5,30 C 12.5,31.5 12.5,31 12,33.5 C 10.5,34.5 10.5,36 10.5,36 C 9,37.5 11,38.5 11,38.5 C 17.5,39.5 27.5,39.5 34,38.5 C 34,38.5 35.5,37.5 34,36 C 34,36 34.5,34.5 33,33.5 C 32.5,31 32.5,31.5 33.5,30 C 34.5,28 36,28 36,26 C 27.5,24.5 17.5,24.5 9,26 z " \ - style="stroke-linecap:butt;" class="chess-path-B" /> \ - <path \ - d="M 11.5,30 C 15,29 30,29 33.5,30" \ - class="chess-path-D" /> \ - <path \ - d="M 12,33.5 C 18,32.5 27,32.5 33,33.5" \ - class="chess-path-D" /> \ - <path \ - d="M 10.5,36 C 15.5,35 29,35 34,36" \ - class="chess-path-D" /> \ - </g>'; - - var DEFking = '<g transform="translate(-22.5,-22.5)"> \ - <path d="M 22.5,11.625 L 22.5,6" class="chess-path-B" /> \ - <path d="M 22.5,25 C 22.5,25 27,17.5 25.5,14.5 C 25.5,14.5 24.5,12 22.5,12 C 20.5,12 19.5,14.5 19.5,14.5 C 18,17.5 22.5,25 22.5,25" \ - style="fill:stroke-linecap:butt;" class="chess-path-B" /> \ - <path d="M 11.5,37 C 17,40.5 27,40.5 32.5,37 L 32.5,30 C 32.5,30 41.5,25.5 38.5,19.5 C 34.5,13 25,16 22.5,23.5 L 22.5,27 L 22.5,23.5 C 19,16 9.5,13 6.5,19.5 C 3.5,25.5 11.5,29.5 11.5,29.5 L 11.5,37 z " \ - class="chess-path-B" /> \ - <path d="M 20,8 L 25,8" class="chess-path-B" /> \ - <path d="M 11.5,29.5 C 17,27 27,27 32.5,30" class="chess-path-D" /> \ - <path d="M 11.5,37 C 17,34.5 27,34.5 32.5,37" \ - class="chess-path-D" /> \ - <path d="M 11.5,33.5 C 17,31.5 27,31.5 32.5,33.5" \ - class="chess-path-D" /> \ - </g>'; - - var default_rel = {}; - default_rel["wP"] = '<g class="chessW">' + DEFpawn + '</g>'; - default_rel["bP"] = '<g class="chessB">' + DEFpawn + '</g>'; - default_rel["wN"] = '<g class="chessW">' + DEFknight + '</g>'; - default_rel["bN"] = '<g class="chessB">' + DEFknight + '</g>'; - default_rel["wB"] = '<g class="chessW">' + DEFbishop + '</g>'; - default_rel["bB"] = '<g class="chessB">' + DEFbishop + '</g>'; - default_rel["wR"] = '<g class="chessW">' + DEFrook + '</g>'; - default_rel["bR"] = '<g class="chessB">' + DEFrook + '</g>'; - default_rel["wQ"] = '<g class="chessW">' + DEFqueen + '</g>'; - default_rel["Wq"] = '<g class="chessW">' + DEFqueen + '</g>'; - default_rel["bQ"] = '<g class="chessB">' + DEFqueen + '</g>'; - default_rel["Bq"] = '<g class="chessB">' + DEFqueen + '</g>'; - default_rel["wK"] = '<g class="chessW">' + DEFking + '</g>'; - default_rel["bK"] = '<g class="chessB">' + DEFking + '</g>'; - default_rel["P"] = - '<g class="model-pred-P">' + // Cross - '<line x1="-17" y1="-17" x2="17" y2="17" />' + - '<line x1="17" y1="-17" x2="-17" y2="17" /></g>'; - default_rel["Q"] = - '<circle class="model-pred-Q" cx="0" cy="0" r="17" />'; // Circle - - var game_rel = {}; - game_rel["Entanglement"] = {}; - game_rel["Entanglement"]["R"] = - '<circle class="model-pred-R" cx="0" cy="0" r="25" />'; - - game_rel["Connect4"] = {}; - game_rel["Connect4"]["P"] = - '<circle class="model-pred-P" cx="0" cy="0" r="40" />'; - game_rel["Connect4"]["Q"] = - '<circle class="model-pred-Q" cx="0" cy="0" r="40" />'; - - - var background = {}; - background["Connect4"] = '<rect x="0" y="0" width="500" height="500" ' + - 'stroke-width="5" rx="5" ry="5" id="board_connect4" />'; - - - // Create new svg element [elem], child of svg, set attributes, scale. - var svg_from_string = function (th, x, y, sizex, sizey, s, attrs) { - var parser = new DOMParser (); - var svgs = '<svg version="1.1" xmlns="http://www.w3.org/2000/svg">'; - var scfx = (th.elem_size_x - 10) / sizex; - var scfy = (th.elem_size_y - 10) / sizey; - var sc = "scale(" + scfx + "," + scfy + ")"; - var gs = '<g transform="translate(' + x + "," + y + ") " + sc + '">'; - var doc = parser.parseFromString(svgs+ gs+ s +'</g></svg>', "text/xml"); - var elem = document.adoptNode(doc.childNodes[0]).childNodes[0]; - var elem_in = elem.childNodes[0]; - for (var i = 0; i < attrs.length; i++) { - elem_in.setAttribute (attrs[i][0], attrs[i][1].toString()); - } - return (elem); - } - - - // Public methods - - var shapes_rel_svg = function (game, posx, posy, sizex, sizey, rn, attrs) { - var svg_s = default_rel[rn]; - if (game_rel[game] != undefined) { - if (game_rel[game][rn] != undefined) { - svg_s = game_rel[game][rn]; - } - } - if (svg_s == undefined) { return (undefined) }; - return (svg_from_string (this, posx, posy, sizex, sizey, svg_s, attrs)); - } - this.rel_svg = shapes_rel_svg; - - var shapes_circle = function (cx, cy, r, attrs) { - return (svg_from_string (this, cx, cy, - this.elem_size_x - 10, this.elem_size_y - 10, - '<circle cx="0" cy="0" r="' + r + '" />', - attrs)); - } - this.circle = shapes_circle; - - var shapes_rect = function (x, y, w, h, attrs) { - var rs = '<rect x="0" y="0" width="' + w + '" height="' + h + '" />' - return (svg_from_string (this, x - w/2, y - w/2, this.elem_size_x - 10, - this.elem_size_y - 10, rs, attrs)); - } - this.rect = shapes_rect; - - var shapes_line = function (x1, y1, x2, y2, attrs) { - var sign = function (x) { - if (x > 0.01) { return (1); } - else if (x < -0.01) { return (-1); } - else { return (0); } - } - var dx = this.elem_size_x * sign (x1 - x2); - var dy = this.elem_size_y * sign (y1 - y2); - var nx1 = x1 - dx; - var nx2 = x2 + dx; - var ny1 = y1 - dy; - var ny2 = y2 + dy; - var ls = '<line x1="' + nx1 + '" y1="' + ny1 + - '" x2="' + nx2 + '" y2="' + ny2 + '" />'; - return (svg_from_string (this, 0, 0, this.elem_size_x - 10, - this.elem_size_y - 10, ls, attrs)); - } - this.line = shapes_line; - - var shapes_background_svg = function (game, x, y, w, h, attrs) { - var bg = background[game]; - if (bg == undefined) { return (undefined); } - var ws = (this.elem_size_x - 10) / (w / 500); - var hs = (this.elem_size_y - 10) / (h / 500); - return (svg_from_string (this, x, y, ws, hs, bg, attrs)); - } - this.background_svg = shapes_background_svg; - - return (this); -} - -var SHAPES = new Shapes (); Modified: trunk/Toss/WebClient/Main.js =================================================================== --- trunk/Toss/WebClient/Main.js 2011-05-30 01:25:16 UTC (rev 1465) +++ trunk/Toss/WebClient/Main.js 2011-05-30 20:31:01 UTC (rev 1466) @@ -243,7 +243,7 @@ "-elem-" + CUR_PLAY_I); var li = new_play_item (GAME_NAME, CUR_PLAY_I); old_li.parentNode.replaceChild (li, old_li); - if (PLAYS[CUR_PLAY_I][ST.PLAYER_STR] == "computer") { + if (ST.players.length==1 && PLAYS[CUR_PLAY_I][ST.players[0]]=="computer") { var mv_time = document.getElementById("speed").value; suggest_move_async (mv_time, make_move); } @@ -462,7 +462,7 @@ document.getElementById("working").innerHTML = "Working..."; if (m != "") { show_move (new Move (m)); f() } }; - CONN.suggest (time, play_py_id (CUR_PLAY_I), fm); + CONN.suggest (ST.players[0]+1, time, play_py_id (CUR_PLAY_I), fm); } function suggest_move_click () { Copied: trunk/Toss/WebClient/State.js (from rev 1465, trunk/Toss/WebClient/Drawing.js) =================================================================== --- trunk/Toss/WebClient/State.js (rev 0) +++ trunk/Toss/WebClient/State.js 2011-05-30 20:31:01 UTC (rev 1466) @@ -0,0 +1,545 @@ +// JavaScript Toss Module -- Drawing + +var SVG_WIDTH = 500; +var SVG_HEIGHT = 500; +var SVG_MARGINX = 50; +var SVG_MARGINY = 50; +var VIEW_MIRROR = 0; + + +// ------ Move Object ----- + +// Create a move from the string [s]. +function Move (s) { + var vals = []; + var arr = strip('(', ')', s).split(','); + for (var i = 0; i < arr.length; i++) { + if (arr[i].indexOf(':') > -1) { + var v = arr[i].substring (arr[i].indexOf(':')+1, arr[i].length); + vals.push (strip ('\'', ' ', strip ('{', '}', v))); + } + } + vals.sort (); + this.matched = vals; + this.length = vals.length; + this.rule = strip ("'", " ", + s.substring (s.indexOf("},")+3, s.lastIndexOf(','))); + this.matched_str = strip (' ', ' ', this.matched.toString ()); + this.def_str = s; + this.player = parseInt(s.substring(0, 1)) - 1; + return (this) +} + +function move_did_match (s) { + for (var i = 0; i < this.matched.length; i++) { + if (this.matched[i] == s) { return (true) } + } + return (false); +} +Move.prototype.did_match = move_did_match; + + +// --------- Elem and Rel Objects ----- + +function Elem (id, x, y) { + this.id = id; + this.x = x; + this.y = y; +} + +function Rel (name, args) { + this.name = name; + this.args = args; +} + + +// --------- State Object ------ + + +// Object representing a state of the system (game). +function State (game, info_string) { + // We create an SVG box with margins depending on the game. + this.game = game; + + var create_svg_box = function (margx, margy, parent_id) { + SVG_MARGINX = margx; + SVG_MARGINY = margx; + var svg = document.createElementNS('http://www.w3.org/2000/svg','svg'); + svg.setAttribute('id', 'svg'); + var wx = SVG_WIDTH + 2*SVG_MARGINX + 20; + var wy = SVG_HEIGHT + 2*SVG_MARGINY + 20; + svg.setAttribute('viewBox', '-10 -10 ' + wx + " " + wy); + document.getElementById(parent_id).appendChild(svg); + } + + if (game == "Tic-Tac-Toe" || game == "Concurrent-Tic-Tac-Toe") { + create_svg_box (130, 130, "board"); // bigger margins needed + } else { + create_svg_box (40, 40, "board"); + } + + // Private: Translate position from Model coordinates to SVG coordinates. + var translate_pos = function (pos, minx, miny, width, height) { + var x = ((pos[0] - minx) * SVG_WIDTH) / width; + if (VIEW_MIRROR == 0) { + var y = ((pos[1] - miny) * SVG_HEIGHT) / height; + } else { + var y = ((height - (pos[1] - miny))*SVG_WIDTH) / height; + } + return ([x + SVG_MARGINX, y + SVG_MARGINY]) + }; + + // The info is a $-separated array of 4 components. + var res_arr = []; + res_arr = info_string.split("$"); + if (res_arr.length != 4) { alert (res_arr); return (undefined); } + + // The first component gives the dimenstions of the structure. + var dim = strip('(', ')', res_arr[0]).split(','); + this.maxx = parseFloat(strip(' ', ' ', dim[0])); + this.minx = parseFloat(strip(' ', ' ', dim[1])); + this.maxy = parseFloat(strip(' ', ' ', dim[2])); + this.miny = parseFloat(strip(' ', ' ', dim[3])); + this.width = Math.max (SVG_WIDTH / 100, (this.maxx - this.minx)); + this.height = Math.max (SVG_HEIGHT / 100, (this.maxy - this.miny)); + + // The second component is the list of elements of the structure. + var l = convert_python_list(',', res_arr[1]); + this.elems = []; + for (var i = 0; i < l.length; i++) { + var e = convert_python_list (';', l[i]); + var pos = translate_pos ([parseFloat(e[1]), parseFloat(e[2])], + this.minx, this.miny, this.width, this.height); + this.elems.push (new Elem (e[0], pos[0], pos[1])); + } + + var find_elem = function (elem_id, els) { + for (var i = 0; i < els.length; i++) { + if (els[i].id == elem_id) { return (els[i]); } + } + return (undefined); + } + + // The third component are the relations in the structure. + var r = convert_python_list(';', res_arr[2]); + var rels = []; + for (var i = 0; i < r.length; i++) { + var rel_name = strip(' ', '\'', r[i].substring(1,r[i].indexOf(','))); + var args_s = r[i].substring(r[i].indexOf('[')+1, r[i].indexOf(']')); + var args = convert_python_list (',', args_s); + var is_undefined = false; + for (var j = 0; j < args.length; j++) { + args[j] = find_elem (args[j], this.elems); + if (args[j] == undefined) { is_undefined = true }; + } + if (rel_name[0] != "_" && args_s != "''" && is_undefined == false) { + rels.push (new Rel (rel_name, args)); + } + } + this.rels = rels; + + var in_lst = function (lst, elem) { + for (var j = 0; j < lst.length; j++) { + if (lst[j] == elem) { return (true); } + } + return (false); + } + + // The fourth component is either the list of possible moves. + // If there are no moves possible, it is the payoff. + if (res_arr[3].substring(2, 3) == "(") { + var move_strs = convert_python_list (';', res_arr[3]); + var mvs = []; + var pls = []; + for (i = 0; i < move_strs.length; i++) { + var new_mv = new Move (move_strs[i]); + mvs.push (new_mv); + if (! in_lst(pls, new_mv.player)) { pls.push (new_mv.player); } + } + this.moves = mvs; + this.players = pls; + this.payoff = ""; + } else { + this.moves = []; + this.players = []; + this.payoff = res_arr[3]; + }; + + return (this); +} + +// Get moves applicable to [elem] in a game. +function state_get_moves (elem, other) { + var elem_moves = []; + for (i = 0; i < this.moves.length; i++) { + if (this.moves[i].did_match(elem)) { + if (other == "") { + elem_moves.push(this.moves[i]) + } else if (this.moves[i].did_match(other)) { + elem_moves.push(this.moves[i]) + } + } + } + return (elem_moves) +} +State.prototype.get_moves = state_get_moves; + + +// ------ Drawing functions ---- + +// Helper: to draw chess board we distinguish even/odd placed elements. +function elem_class (elemid) { + var elem_cl = "model-elem"; + var is_int = function (s) { return (parseInt(s).toString() == s) }; + if (is_int (elemid.substring(1))) { + var psum = elemid.charCodeAt(0) + parseInt (elemid.substring(1)); + elem_cl = "model-elem-" + (psum % 2); + }; + return (elem_cl); +} + +// Draw the model. +function state_draw_model (game) { + var draw_background = function (game) { + var x = SVG_MARGINX; + var y = SVG_MARGINY; + var w = SVG_WIDTH + 2 * x; + var h = SVG_HEIGHT + 2 * x; + var bg = SHAPES.background_svg (game, 0, 0, w, h, []); + if (bg != undefined) {document.getElementById("svg").appendChild(bg);} + } + + // Draw the element [elem]. + var draw_elem = function (game, elem) { + if (game != "Connect4") { + var r = SHAPES.rect ( + elem.x, elem.y, 2 * SHAPES.elem_size_x, 2 * SHAPES.elem_size_y, + [["id", "elem_" + elem.id], ["class", elem_class(elem.id)], + ["onclick", ("handle_elem_click('" + elem.id + "')")]]); + document.getElementById("svg").appendChild(r); + } else { + var circ = SHAPES.circle ( + elem.x, elem.y, 30, + [["id", "elem_" + elem.id], ["class", elem_class(elem.id)], + ["onclick", "handle_elem_click('" + elem.id + "')"]]); + document.getElementById("svg").appendChild(circ); + } + } + + + // Draw relation [rel_name] between elements [args]. + function draw_rel (game, rel) { + if (rel.args.length == 1) { + var ihatrs = [["id", "pred_" + rel.args[0].id + "_" + rel.name], + ["onclick","handle_elem_click('"+rel.args[0].id+"')"]] + var pos = [rel.args[0].x, rel.args[0].y]; + var f = SHAPES.rel_svg (game, pos[0],pos[1],20,20, rel.name,ihatrs); + if (f != undefined) { + document.getElementById("svg").appendChild(f); + } else { + var circ = SHAPES.circle ( + pos[0], pos[1], SHAPES.elem_size_x - 10, + [["id", "pred_" + rel.args[0].id + "_" + rel.name], + ["class", "model-pred-" + rel.name], + ["stroke-width", (SHAPES.elem_size_x / 10) + 2], + ["onclick", ("handle_elem_click('"+rel.args[0].id+"')")]]); + document.getElementById("svg").appendChild(circ); + } + } + if (rel.args.length == 2) { + if (rel.name == "E") { + var l = SHAPES.line (rel.args[0].x, rel.args[0].y, + rel.args[1].x, rel.args[1].y, + [["class", "model-edge-E"]]); + document.getElementById("svg").appendChild(l); + } + } + } + + // Main draw_model function. + var sqrt = Math.round (Math.sqrt (this.elems.length)); + if (sqrt * sqrt == this.elems.length) { // perhaps a grid + SHAPES.elem_size_x = SVG_WIDTH / (2.0 * (sqrt-1)); + SHAPES.elem_size_y = SVG_HEIGHT / (2.0 * (sqrt-1)); + } else { + SHAPES.elem_size_x = SVG_WIDTH / 20; + SHAPES.elem_size_y = SVG_HEIGHT / 20; + } + draw_background (game); + for (var i = 0; i < this.elems.length; i++) { + draw_elem (game, this.elems[i]); + } + for (var i = 0; i < this.rels.length; i++) { + draw_rel (game, this.rels[i]); + } +} +State.prototype.draw_model = state_draw_model; + +// Highlight the element [elem]. +function state_highlight_elem (elemid) { + var e = document.getElementById ("elem_" + elemid); + e.setAttribute ("class", "model-elem-highlight"); +} +State.prototype.highlight_elem = state_highlight_elem; + +// Unhighlight the element [elem]. +function state_unhighlight_elem (elemid) { + var e = document.getElementById ("elem_" + elemid); + e.setAttribute ("class", elem_class(elemid)); +} +State.prototype.unhighlight_elem = state_unhighlight_elem; + + + + +// ------------ Shape Drawings in SVG ------------------- + +function Shapes () { + this.elem_size_x = 25; // suggested size of elements + this.elem_size_y = 25; // suggested size of elements + + var DEFpawn = '<g transform="translate(-22.5,-22.5)"> \ + <path \ + d="M 22,9 C 19.792,9 18,10.792 18,13 C 18,13.885 18.294,14.712 18.781,15.375 C 16.829,16.497 15.5,18.588 15.5,21 C 15.5,23.034 16.442,24.839 17.906,26.031 C 14.907,27.089 10.5,31.578 10.5,39.5 L 33.5,39.5 C 33.5,31.578 29.093,27.089 26.094,26.031 C 27.558,24.839 28.5,23.034 28.5,21 C 28.5,18.588 27.171,16.497 25.219,15.375 C 25.706,14.712 26,13.885 26,13 C 26,10.792 24.208,9 22,9 z " \ + class="chess-path-A" /> \ + </g>'; + + var DEFknight = '<g transform="translate(-22.5,-22.5)"> \ + <path \ + d="M 22,10 C 32.5,11 38.5,18 38,39 L 15,39 C 15,30 25,32.5 23,18" \ + class="chess-path-B" /> \ + <path \ + d="M 24,18 C 24.384,20.911 18.447,25.369 16,27 C 13,29 13.181,31.343 11,31 C 9.9583,30.056 12.413,27.962 11,28 C 10,28 11.187,29.232 10,30 C 9,30 5.9968,31 6,26 C 6,24 12,14 12,14 C 12,14 13.886,12.098 14,10.5 C 13.274,9.5056 13.5,8.5 13.5,7.5 C 14.5,6.5 16.5,10 16.5,10 L 18.5,10 C 18.5,10 19.282,8.0081 21,7 C 22,7 22,10 22,10" \ + class="chess-path-B" /> \ + <path \ + d="M 9 23.5 A 0.5 0.5 0 1 1 8,23.5 A 0.5 0.5 0 1 1 9 23.5 z" \ + transform="translate(0.5,2)" \ + class="chess-path-C" /> \ + <path \ + d="M 15 15.5 A 0.5 1.5 0 1 1 14,15.5 A 0.5 1.5 0 1 1 15 15.5 z" \ + transform="matrix(0.866,0.5,-0.5,0.866,9.6926,-5.1734)" \ + class="chess-path-C" /> \ + <path \ + d="M 37,39 C 38,19 31.5,11.5 25,10.5" \ + class="chess-path-D" /> \ + </g>'; + + var DEFbishop = '<g transform="translate(-22.5,-22.5)"> \ + <path \ + d="M 9,36 C 12.385,35.028 19.115,36.431 22.5,34 C 25.885,36.431 32.615,35.028 36,36 C 36,36 37.646,36.542 39,38 C 38.323,38.972 37.354,38.986 36,38.5 C 32.615,37.528 25.885,38.958 22.5,37.5 C 19.115,38.958 12.385,37.528 9,38.5 C 7.6459,38.986 6.6771,38.972 6,38 C 7.3541,36.055 9,36 9,36 z " \ + style="stroke-linecap:butt;" class="chess-path-B" /> \ + <path \ + d="M 15,32 C 17.5,34.5 27.5,34.5 30,32 C 30.5,30.5 30,30 30,30 C 30,27.5 27.5,26 27.5,26 C 33,24.5 33.5,14.5 22.5,10.5 C 11.5,14.5 12,24.5 17.5,26 C 17.5,26 15,27.5 15,30 C 15,30 14.5,30.5 15,32 z " \ + style="stroke-linecap:butt;" class="chess-path-B" /> \ + <path \ + d="M 25 10 A 2.5 2.5 0 1 1 20,10 A 2.5 2.5 0 1 1 25 10 z" \ + transform="translate(0,-2)" \ + style="stroke-linecap:butt;" class="chess-path-Bx" /> \ + <path \ + d="M 17.5,26 L 27.5,26" \ + style="stroke-linecap:butt;" class="chess-path-D" /> \ + <path \ + d="M 15,30 L 30,30" \ + style="stroke-linecap:butt;" class="chess-path-D" /> \ + <path \ + d="M 22.5,15.5 L 22.5,20.5" \ + style="stroke-linecap:butt;" class="chess-path-D" /> \ + <path \ + d="M 20,18 L 25,18" \ + style="stroke-linecap:butt;" class="chess-path-D" /> \ + </g>'; + + var DEFrook = '<g transform="translate(-22.5,-22.5)"> \ + <path \ + d="M 9,39 L 36,39 L 36,36 L 9,36 L 9,39 z " \ + style="stroke-linecap:butt;" class="chess-path-Bx" /> \ + <path \ + d="M 12,36 L 12,32 L 33,32 L 33,36 L 12,36 z " \ + style="stroke-linecap:butt;" class="chess-path-B" /> \ + <path \ + d="M 11,14 L 11,9 L 15,9 L 15,11 L 20,11 L 20,9 L 25,9 L 25,11 L 30,11 L 30,9 L 34,9 L 34,14" \ + style="stroke-linecap:butt;" class="chess-path-B" /> \ + <path \ + d="M 34,14 L 31,17 L 14,17 L 11,14" \ + style="stroke-linecap:butt;" class="chess-path-B" /> \ + <path \ + d="M 31,17 L 31,29.5 L 14,29.5 L 14,17" \ + style="stroke-linecap:butt;" class="chess-path-B" /> \ + <path \ + d="M 31,29.5 L 32.5,32 L 12.5,32 L 14,29.5" \ + class="chess-path-B" /> \ + <path \ + d="M 11,14 L 34,14" \ + class="chess-path-D" /> \ + </g>'; + + var DEFqueen = '<g transform="translate(-22.5,-22.5)"> \ + <path \ + d="M 9 13 A 2 2 0 1 1 5,13 A 2 2 0 1 1 9 13 z" \ + transform="translate(-1,-1)" \ + style="fill-rule: none;" class="chess-path-B" /> \ + <path \ + d="M 9 13 A 2 2 0 1 1 5,13 A 2 2 0 1 1 9 13 z" \ + transform="translate(15.5,-5.5)" \ + style="fill-rule: none;" class="chess-path-B" /> \ + <path \ + d="M 9 13 A 2 2 0 1 1 5,13 A 2 2 0 1 1 9 13 z" \ + transform="translate(32,-1)" \ + style="fill-rule: none;" class="chess-path-B" /> \ + <path \ + d="M 9 13 A 2 2 0 1 1 5,13 A 2 2 0 1 1 9 13 z" \ + transform="translate(7,-4.5)" \ + style="fill-rule: none;" class="chess-path-B" /> \ + <path \ + d="M 9 13 A 2 2 0 1 1 5,13 A 2 2 0 1 1 9 13 z" \ + transform="translate(24,-4)" \ + style="fill-rule: none;" class="chess-path-B" /> \ + <path \ + d="M 9,26 C 17.5,24.5 30,24.5 36,26 L 38,14 L 31,25 L 31,11 L 25.5,24.5 L 22.5,9.5 L 19.5,24.5 L 14,10.5 L 14,25 L 7,14 L 9,26 z " \ + style="stroke-linecap:butt;" class="chess-path-B" /> \ + <path \ + d="M 9,26 C 9,28 10.5,28 11.5,30 C 12.5,31.5 12.5,31 12,33.5 C 10.5,34.5 10.5,36 10.5,36 C 9,37.5 11,38.5 11,38.5 C 17.5,39.5 27.5,39.5 34,38.5 C 34,38.5 35.5,37.5 34,36 C 34,36 34.5,34.5 33,33.5 C 32.5,31 32.5,31.5 33.5,30 C 34.5,28 36,28 36,26 C 27.5,24.5 17.5,24.5 9,26 z " \ + style="stroke-linecap:butt;" class="chess-path-B" /> \ + <path \ + d="M 11.5,30 C 15,29 30,29 33.5,30" \ + class="chess-path-D" /> \ + <path \ + d="M 12,33.5 C 18,32.5 27,32.5 33,33.5" \ + class="chess-path-D" /> \ + <path \ + d="M 10.5,36 C 15.5,35 29,35 34,36" \ + class="chess-path-D" /> \ + </g>'; + + var DEFking = '<g transform="translate(-22.5,-22.5)"> \ + <path d="M 22.5,11.625 L 22.5,6" class="chess-path-B" /> \ + <path d="M 22.5,25 C 22.5,25 27,17.5 25.5,14.5 C 25.5,14.5 24.5,12 22.5,12 C 20.5,12 19.5,14.5 19.5,14.5 C 18,17.5 22.5,25 22.5,25" \ + style="fill:stroke-linecap:butt;" class="chess-path-B" /> \ + <path d="M 11.5,37 C 17,40.5 27,40.5 32.5,37 L 32.5,30 C 32.5,30 41.5,25.5 38.5,19.5 C 34.5,13 25,16 22.5,23.5 L 22.5,27 L 22.5,23.5 C 19,16 9.5,13 6.5,19.5 C 3.5,25.5 11.5,29.5 11.5,29.5 L 11.5,37 z " \ + class="chess-path-B" /> \ + <path d="M 20,8 L 25,8" class="chess-path-B" /> \ + <path d="M 11.5,29.5 C 17,27 27,27 32.5,30" class="chess-path-D" /> \ + <path d="M 11.5,37 C 17,34.5 27,34.5 32.5,37" \ + class="chess-path-D" /> \ + <path d="M 11.5,33.5 C 17,31.5 27,31.5 32.5,33.5" \ + class="chess-path-D" /> \ + </g>'; + + var default_rel = {}; + default_rel["wP"] = '<g class="chessW">' + DEFpawn + '</g>'; + default_rel["bP"] = '<g class="chessB">' + DEFpawn + '</g>'; + default_rel["wN"] = '<g class="chessW">' + DEFknight + '</g>'; + default_rel["bN"] = '<g class="chessB">' + DEFknight + '</g>'; + default_rel["wB"] = '<g class="chessW">' + DEFbishop + '</g>'; + default_rel["bB"] = '<g class="chessB">' + DEFbishop + '</g>'; + default_rel["wR"] = '<g class="chessW">' + DEFrook + '</g>'; + default_rel["bR"] = '<g class="chessB">' + DEFrook + '</g>'; + default_rel["wQ"] = '<g class="chessW">' + DEFqueen + '</g>'; + default_rel["Wq"] = '<g class="chessW">' + DEFqueen + '</g>'; + default_rel["bQ"] = '<g class="chessB">' + DEFqueen + '</g>'; + default_rel["Bq"] = '<g class="chessB">' + DEFqueen + '</g>'; + default_rel["wK"] = '<g class="chessW">' + DEFking + '</g>'; + default_rel["bK"] = '<g class="chessB">' + DEFking + '</g>'; + default_rel["P"] = + '<g class="model-pred-P">' + // Cross + '<line x1="-17" y1="-17" x2="17" y2="17" />' + + '<line x1="17" y1="-17" x2="-17" y2="17" /></g>'; + default_rel["Q"] = + '<circle class="model-pred-Q" cx="0" cy="0" r="17" />'; // Circle + + var game_rel = {}; + game_rel["Entanglement"] = {}; + game_rel["Entanglement"]["R"] = + '<circle class="model-pred-R" cx="0" cy="0" r="25" />'; + + game_rel["Connect4"] = {}; + game_rel["Connect4"]["P"] = + '<circle class="model-pred-P" cx="0" cy="0" r="40" />'; + game_rel["Connect4"]["Q"] = + '<circle class="model-pred-Q" cx="0" cy="0" r="40" />'; + + + var background = {}; + background["Connect4"] = '<rect x="0" y="0" width="500" height="500" ' + + 'stroke-width="5" rx="5" ry="5" id="board_connect4" />'; + + + // Create new svg element [elem], child of svg, set attributes, scale. + var svg_from_string = function (th, x, y, sizex, sizey, s, attrs) { + var parser = new DOMParser (); + var svgs = '<svg version="1.1" xmlns="http://www.w3.org/2000/svg">'; + var scfx = (th.elem_size_x - 10) / sizex; + var scfy = (th.elem_size_y - 10) / sizey; + var sc = "scale(" + scfx + "," + scfy + ")"; + var gs = '<g transform="translate(' + x + "," + y + ") " + sc + '">'; + var doc = parser.parseFromString(svgs+ gs+ s +'</g></svg>', "text/xml"); + var elem = document.adoptNode(doc.childNodes[0]).childNodes[0]; + var elem_in = elem.childNodes[0]; + for (var i = 0; i < attrs.length; i++) { + elem_in.setAttribute (attrs[i][0], attrs[i][1].toString()); + } + return (elem); + } + + + // Public methods + + var shapes_rel_svg = function (game, posx, posy, sizex, sizey, rn, attrs) { + var svg_s = default_rel[rn]; + if (game_rel[game] != undefined) { + if (game_rel[game][rn] != undefined) { + svg_s = game_rel[game][rn]; + } + } + if (svg_s == undefined) { return (undefined) }; + return (svg_from_string (this, posx, posy, sizex, sizey, svg_s, attrs)); + } + this.rel_svg = shapes_rel_svg; + + var shapes_circle = function (cx, cy, r, attrs) { + return (svg_from_string (this, cx, cy, + this.elem_size_x - 10, this.elem_size_y - 10, + '<circle cx="0" cy="0" r="' + r + '" />', + attrs)); + } + this.circle = shapes_circle; + + var shapes_rect = function (x, y, w, h, attrs) { + var rs = '<rect x="0" y="0" width="' + w + '" height="' + h + '" />' + return (svg_from_string (this, x - w/2, y - w/2, this.elem_size_x - 10, + this.elem_size_y - 10, rs, attrs)); + } + this.rect = shapes_rect; + + var shapes_line = function (x1, y1, x2, y2, attrs) { + var sign = function (x) { + if (x > 0.01) { return (1); } + else if (x < -0.01) { return (-1); } + else { return (0); } + } + var dx = this.elem_size_x * sign (x1 - x2); + var dy = this.elem_size_y * sign (y1 - y2); + var nx1 = x1 - dx; + var nx2 = x2 + dx; + var ny1 = y1 - dy; + var ny2 = y2 + dy; + var ls = '<line x1="' + nx1 + '" y1="' + ny1 + + '" x2="' + nx2 + '" y2="' + ny2 + '" />'; + return (svg_from_string (this, 0, 0, this.elem_size_x - 10, + this.elem_size_y - 10, ls, attrs)); + } + this.line = shapes_line; + + var shapes_background_svg = function (game, x, y, w, h, attrs) { + var bg = background[game]; + if (bg == undefined) { return (undefined); } + var ws = (this.elem_size_x - 10) / (w / 500); + var hs = (this.elem_size_y - 10) / (h / 500); + return (svg_from_string (this, x, y, ws, hs, bg, attrs)); + } + this.background_svg = shapes_background_svg; + + return (this); +} + +var SHAPES = new Shapes (); Modified: trunk/Toss/WebClient/index.html =================================================================== --- trunk/Toss/WebClient/index.html 2011-05-30 01:25:16 UTC (rev 1465) +++ trunk/Toss/WebClient/index.html 2011-05-30 20:31:01 UTC (rev 1466) @@ -11,7 +11,7 @@ <link rel="stylesheet" type="text/css" href="Style.css" media="screen" title="Default"/> <script type="text/javascript" src="crypto-sha256.js"> </script> <script type="text/javascript" src="Connect.js"> </script> - <script type="text/javascript" src="Drawing.js"> </script> + <script type="text/javascript" src="State.js"> </script> <script type="text/javascript" src="Main.js"> </script> <script type="text/javascript" src="Login.js"> </script> </head> Modified: trunk/Toss/WebClient/profile.html =================================================================== --- trunk/Toss/WebClient/profile.html 2011-05-30 01:25:16 UTC (rev 1465) +++ trunk/Toss/WebClient/profile.html 2011-05-30 20:31:01 UTC (rev 1466) @@ -9,7 +9,7 @@ <link rel="stylesheet" type="text/css" href="Style.css" media="screen" title="Default"/> <script type="text/javascript" src="crypto-sha256.js"> </script> <script type="text/javascript" src="Connect.js"> </script> - <script type="text/javascript" src="Drawing.js"> </script> + <script type="text/javascript" src="State.js"> </script> <script type="text/javascript" src="Main.js"> </script> <script type="text/javascript" src="Login.js"> </script> </head> This was sent by the SourceForge.net collaborative development platform, the world's largest Open Source development site. |