(function ($, window, document) { $(document).ready(function () { (function ($) { $.fn.attachGrid = function (clickfunc) { this.each(function (idx, p2w) { var sq_size = $(p2w).hasClass('large') ? 32 : 24; var bd_size = 8 * sq_size; // create fixed sized div var griddiv = $('
'); // add all gridlines specified by attribute // normal Grid Chess grid by default var gridlines = $(p2w).attr("gridlines"); if (typeof gridlines == "undefined") { gridlines = "H2 H4 H6 V2 V4 V6"; } var re = /([HV])([0-8])(:([0-8])-([0-8]))?(:([a-z]*))?/g; while (matches = re.exec(gridlines)) { var val = { dir: matches[1], pos: matches[2], min: (typeof matches[4] != "undefined" ? matches[4] : 0), max: (typeof matches[5] != "undefined" ? matches[5] : 8), col: (typeof matches[7] != "undefined" ? matches[7] : "black") }; var line; if (val.dir == 'H') { val.height = 0; val.width = sq_size * (val.max - val.min); val.top = sq_size * val.pos; val.left = sq_size * val.min; } else { val.height = sq_size * (val.max - val.min); val.width = 0; val.top = sq_size * val.min; val.left = sq_size * val.pos; } line = $('
'); $(griddiv).append(line); } // make click handler to navigate solution // by passing through to underneath p2w elements if (typeof clickfunc != "function") { griddiv.on("click", function (e, q) { if (typeof e.offsetX != "undefined") { if (e.offsetX < 128) { $(".p2w-nav-bwd", $(this).parent()).trigger("click", e) } else { $(".p2w-nav-fwd", $(this).parent()).trigger("click", e) } } }); } else { // Custom function // TODO - not working (never called) griddiv.on("click", function (e) { clickfunc(e); }); } // p2w has habit of re-creating all its html and killing this div // so resurrect it every time it does $(p2w).append(griddiv).bind('DOMSubtreeModified', $.proxy(function () { if ($(".griddiv", this).length == 0 && $(this).html() != "") { $(p2w).attachGrid(clickfunc); } }, p2w)); }) } $.fn.py2WebNin1 = function () { this.each(function (idx, p2wNin1) { var base_id = $(p2wNin1).attr('id'); // find all other p2w-diagram elements with a // base attribute pointing to the id of the // base diagram var siblings = $(".p2w-diagram").filter(function (idx, diagram) { return ($(diagram).attr('base') == base_id); }); // collect all diagram ids var idmap = $(".p2w-solution").filter(function (idx, sol) { var target = $(sol).attr('target'); return siblings.filter(function (idx, sib) { return $(sib).attr('id') == target; }).length == 1; }).map(function (idx, sol) { $(sol).wrap("
"); return $(sol).attr('target'); }); // base and all siblings should already be // contained within a parent div in markup var id = base_id + '-Nin1'; var wrapper = $(p2wNin1).parent(); wrapper.attr('id', id).append(""); // create functions to show one diagram/solution only idmap = $.merge(idmap, [base_id]); var showOne = {}; $.each(idmap, function (idx, id) { showOne[id] = function () { $.each(idmap, function (idx, target) { $("#" + target).hide(); $("#" + target + "-sol").hide(); }) $("#" + id).show(); $("#" + id + "-sol").show(); }; }) // create an animation for the base diagram // so as to display base posiiton Py2Web.init("#" + id); // add whatever partition lines are required by // base's gridlines attribute $(p2wNin1).attachGrid(); // now add special handlers to any elements marked with // the p2w-link class // Each link should have the target attribute pointing // to the id of the appropriate p2w-diagram $(".p2w-link").filter(function (idx, link) { var target = $(link).attr('target'); var count = 0; if (typeof target != "undefined") { count = $.grep(idmap, function (el) { return el == target; }).length; } return count == 1; }).each(function (idx, link) { $(link).on("click", function () { showOne[$(link).attr('target')](); return false; }) }) // initial state - only the base diagram shown showOne[base_id](); }) }; $.fn.printimg = function () { this.each(function (idx, p2w) { var printimg = $(p2w).attr('printimg'); if (typeof printimg != "undefined") { var bd_size = $(p2w).hasClass('large') ? 256 : 192; // create fixed sized div var imagediv = $('
'); imagediv.append(''); // p2w has habit of re-creating all its html and killing this div // so resurrect it every time it does $(p2w).append(imagediv).bind('DOMSubtreeModified', $.proxy(function () { if ($(".imagediv", this).length == 0 && $(this).html() != "") { $(p2w).printimg(); } }, p2w)); } }); }; $.fn.isAfter = function(sel){ return this.prevAll().filter(sel).length !== 0; }; $.fn.isBefore= function(sel){ return this.nextAll().filter(sel).length !== 0; }; $.fn.bullet = function () { var fen = this.attr("data-fen"); var after = this.attr("data-after"); var p2ws = this.closest(".p2w-solution"); var afterNode = p2ws.find("a").filter(function(idx, el) { return $(el).text()==after; }).first(); var bullet = afterNode.clone(true); bullet.html('•') .attr('fen',fen) .on("click", function (e) { e.preventDefault(); $("a.active", $(p2ws)).removeClass('active'); bullet.addClass("active"); $(".p2w-nav-bwd", p2wd).trigger("click"); $(".p2w-nav-fwd", p2wd).trigger("click"); }); afterNode.after(bullet); bullet.before("
"); var nextNode = $(p2ws).contents().filter(function(i,el){ return el.nodeType == 3 && !$(el).text().match(/^\s*$/) && $(el).isAfter(bullet); }).first(); if (nextNode.length == 1) { var text = $(nextNode).text().replace(/^\s+\n/g, ''); $(nextNode).replaceWith( text ); } }; $.fn.replacefen = function () { var fen = this.attr("data-fen"); var target = this.attr("data-target"); var targetNode = this.closest(".p2w-solution").find("a").filter(function(idx, el) { return $(el).text()==target; }).first(); targetNode.attr('fen',fen); }; $.fn.proofgame = function () { this.each(function (idx, p2ws) { var is_PG = false; var game = ""; var p2wd = $(".p2w-diagram#" + $(p2ws).attr('target')); // search until a "dia" text is reached // backtrack till *** or twin marker found and replace the fen with // the final position fen // (N.B. do nothing for non PGs as "dia" will not be found) $("a[fen]", $(p2ws)).each(function (i, a) { if ($(a).next().is("span:contains('dia')")) { var nt = $(a).next().text(); // check that it's the single word 'dia' var re = /\bdia\b/; if (re.exec(nt)) { is_PG = true; var diafen = $(a).attr('fen'); // examine previous links var link = $(a).prevAll("a[fen]").filter(function (idx, el) { // match for *** a) b) ... z) z0) z1) ... return /^\s*(\*\*\*|[a-y]\)|z[0-9]*\))\s*$/.exec($(el).text()); }).first(); if (link.length == 1) { game = link.attr('fen'); link.attr('fen', diafen); } } } }); // if we found "dia" above, it's a PG. if (is_PG) { if (game == "") { game = 'rsbqkbsr/pppppppp/8/8/8/8/PPPPPPPP/RNBQKBNR'; } // insert bullets to reperesent initial fen, before all "1." text var x = $(p2ws).contents().filter(function () { return this.nodeType === 3; }).each(function (i, el, x) { var t = $(el).text(); var firstre = /^\s*1\.\s*$/m; if (firstre.exec(t)) { var clone = $(el).prev("a").clone(true); // create new , to represent game array var clone = $("a", $(p2ws)).first().clone(true); clone.text('').attr('fen', game); var bullet = $(""); bullet.on("click", function (e) { e.preventDefault(); $("a.active", $(p2ws)).removeClass('active'); clone.addClass("active"); $(".p2w-nav-bwd", p2wd).trigger("click"); $(".p2w-nav-fwd", p2wd).trigger("click"); }) clone.append(bullet); // insert game array element & insert break before $(el).before(clone); clone.before("
"); // remove unwanted line break after $(el).replaceWith(" 1."); } }); // for twins, the above will still have left the *** // position = game array. Need to have a pg-fen attr on // the p2w-diagram to reset that if ($(p2wd).has("[pg-fen]")) { $("a.active", $(p2ws)).first().attr('fen', $(p2wd).attr('pg-fen')); } ; // now, make the *** link active (overrides start-node) // and spoof a forwards/backwards to force diagram to redraw $("a.active", $(p2ws)).removeClass('active'); $("a[fen]", $(p2ws)).first().addClass('active'); $(".p2w-nav-fwd", p2wd).trigger("click"); $(".p2w-nav-bwd", p2wd).trigger("click"); } }); }; $(".p2w-diagram[start-node]").each(function (i, p2w) { for (var i = 0; i < $(p2w).attr('start-node'); i++) { $(".p2w-nav-fwd", $(p2w)).trigger("click"); } }); $(".p2w-diagram[start-seek]").each(function (i, p2w) { var p2ws = $(".p2w-solution[target='" + $(p2w).attr('id') + "']"); var seek = $(p2w).attr('start-seek'); var infinity = 1000; while (infinity > 0 && $("a.active + span:contains('" + seek + "')", $(p2ws)).length == 0) { infinity--; $(".p2w-nav-fwd", $(p2w)).trigger("click"); } }); $(".p2w-diagram[start-fen]").each(function (i, p2w) { var p2ws = $(".p2w-solution[target='" + $(p2w).attr('id') + "']"); var fen = $(p2w).attr('start-fen'); var infinity = 1000; while (infinity > 0 && $("a.active[fen='" + fen + "']", $(p2ws)).length == 0) { infinity--; $(".p2w-nav-fwd", $(p2w)).trigger("click"); } }); // add grid to all ".grid" elements $(".p2w-diagram.grid").attachGrid(); // process all N-in-1 ".base" elements $(".p2w-diagram.base").py2WebNin1(); $(".p2w-diagram").printimg(); $(".p2w-solution").proofgame(); //$(".p2w-solution[pg]").proofgame(); $(".p2w-replace-fen").replacefen(); $(".p2w-bullet").bullet(); $("span.comment:has('span.p2w-replace-fen')").remove(); $("span.comment:has('span.p2w-bullet')").remove(); }(jQuery)); }); })(jQuery, window, document);