☰

Replay Rewrite - Custom Graphics On Replay

Enables the use of custom fields when viewing plays with the replay rewrite script.

  1. // ==UserScript==
  2. // @name           Replay Rewrite - Custom Graphics On Replay
  3. // @description    Enables the use of custom fields when viewing plays with the replay rewrite script.
  4. // @namespace      pbr/cgor
  5. // @include        http://*goallineblitz.com/game/replay.pl?game_id=*&pbp_id=*
  6. // @include        http://glb.warriorgeneral.com/game/replay.pl?game_id=*&pbp_id=*
  7. // @copyright      2010, pabst
  8. // @license        (CC) Attribution Share Alike; http://creativecommons.org/licenses/by-sa/3.0/
  9. // @version        13.12.291
  10. // @require https://greasyfork.org/scripts/1371-libpbr2/code/libpbr2.js?version=3533
  11. // ==/UserScript==
  12.  
  13. var scriptName = "Custom Graphics";
  14. var scriptVersion = "13.12.29";
  15. var scriptWebpage = "http://userscripts.org/scripts/show/54524";
  16.  
  17. // XML stadium descriptions are at the bottom of this file
  18. var useXMLDescription = true;
  19. var useRemoteXML = true;
  20.  
  21. // if XML descriptions = true, set the booleans to image types you want to see.
  22. // if XML descriptions = false, set the booleans to image types you want to see and set the addresses here.
  23. // 1080x480
  24. var enableFieldLayer = true;
  25. var fieldImage = null; //"http://img242.imageshack.us/img242/6797/fieldnewbasefixedkp2.png";
  26. var fieldImageX = 520; //set to the x-axis length of your image if not using xml
  27. var fieldImageY = 1160; //set to the y-axis length of your image if not using xml
  28.  
  29. // 1080x480
  30. var enableLineLayer = true;
  31. var lineImage = "http://img527.imageshack.us/img527/3776/glblinesyk7.png";
  32.  
  33. // 480x91 including outline
  34. var enableLowerDecalLayer = true;
  35. var northEndZoneImage = "http://i10.photobucket.com/albums/a136/ggakma/GLB/ENDZONES/endzone-glb-top.jpg";
  36. var southEndZoneImage = "http://i10.photobucket.com/albums/a136/ggakma/GLB/ENDZONES/endzone-glb-bottom.jpg";
  37.  
  38. // x & y size MUST be set to the size of your image
  39. var enableMiddleDecalLayer = true;
  40. var middleDecalImage = "http://img184.imageshack.us/img184/320/glblogotx0.png";
  41. var middleDecalImageX = 224; //set to the x-axis length of your image if not using xml
  42. var middleDecalImageY = 140; //set to the y-axis length of your image if not using xml
  43.  
  44. // 1080x480
  45. var enableUpperDecalLayer = true;
  46. var upperDecalImage = "http://img515.imageshack.us/img515/9223/glboverlaymappedto100vu7.png";
  47.  
  48. // you can modify the previous variables
  49.  
  50. // don't screw with these
  51. var hometeam = unsafeWindow.home;
  52. var runUpdate = fieldGraphicsUpdate;
  53. var deff = "/images/game/fields/grass_plain.jpg";
  54.  
  55. window.setTimeout( function() {
  56.     init();
  57. }, 100);
  58.  
  59. function activate(e) {
  60.     console.log("activate custom graphics");
  61.  
  62.     lock();
  63.  
  64.     if (fieldImage == null) {
  65.         if (document.getElementById("field_image") != null) {
  66.             console.log("no field_image element yet! failure imminent?");
  67.             fieldImage = document.getElementById("field_image").src;
  68.             deff = fieldImage;
  69.         }
  70.         else {
  71.             fieldImage = deff; //deff @ 51
  72.         }
  73.     }
  74.     var inp = document.getElementById("use_graphics");
  75.     if (inp == null) {
  76.         var br = document.createElement("br");
  77.         inp = document.createElement("input");
  78.         inp.id = "use_graphics";
  79.         inp.type = "checkbox";
  80.         var data = "0";
  81.         if (GM_getValue) {
  82.             data = GM_getValue("use_graphics",0);
  83.             if (data == "1") {
  84.                 inp.checked = true;
  85.             }
  86.         }
  87.  
  88.         var text = document.createElement("text");
  89.         text.textContent = " Use default field";
  90.  
  91.         var footer = document.getElementById("replay_footer");
  92.         footer.style.height = "90px";
  93.  
  94.         var options = document.getElementById("options_popup");
  95.         options.appendChild(br);
  96.         options.appendChild(inp);
  97.         options.appendChild(text);
  98.  
  99.         inp.addEventListener("click",boxClicked,false);
  100.     }
  101.  
  102.     if (inp.checked == false) {
  103.         runUpdate();
  104.     }
  105.     unlock();
  106. }
  107.  
  108. function boxClicked(e) {
  109.     lock();
  110.     if (e.target.checked == false) {
  111.         if (GM_setValue) {
  112.             GM_setValue("use_graphics",0);
  113.         }
  114.  
  115.         var addr = window.location.toString();
  116.         addr = addr.split("game")[0]+"game/team.pl?team_id="+hometeam;
  117.         getInetPage(addr, remoteXMLHandler, null);
  118.     }
  119.     else {
  120.         if (GM_setValue) {
  121.             GM_setValue("use_graphics",1);
  122.         }
  123.  
  124.         var ids = ["upperdecals","middledecals","lowerdecals","linelayer"];
  125.         for (var i=0; i<ids.length; i++) {
  126.             var div = document.getElementById(ids[i]);
  127.             if (div != null) {
  128.                 div.parentNode.removeChild(div);
  129.             }
  130.         }
  131.  
  132.         var saved = useRemoteXML;
  133.         useRemoteXML = false;
  134.         fieldGraphicsUpdate("<root><team id='"+hometeam+"'><field x='520' y='1160'>"+deff+"</field></team></root>");
  135.         useRemoteXML = saved;
  136.     }
  137. }
  138.  
  139. function remoteXMLHandler(addr, page) {
  140.     //console.log(page.responseText);
  141.     var xmlDesc = null;
  142.     var src = page.responseText.split('<div id="team_note_content"');
  143.     if (src.length > 1) {
  144.         src = '<div id="team_note_content"'+src[1];
  145.         src = src.split("</div>")[0]+"</div";
  146.         var div = document.createElement("div");
  147.         div.innerHTML = src;
  148.         src = div.textContent;
  149.         //console.log(src);
  150.  
  151.         xmlDesc = '<root><team id="'+hometeam+'">';
  152.         var found = false;
  153.         var tags = ["field","north","south","middle","upper"];
  154.         for (var i=0; i<tags.length; i++) {
  155.             var layer = "";
  156.             var start = src.indexOf("<"+tags[i]);
  157.             if (start != -1) {
  158.                 var end = src.indexOf("</"+tags[i]+">")+("</"+tags[i]+">").length;
  159.                 layer = src.slice(start, end);
  160.                 xmlDesc += layer;
  161.                 found = true;
  162.             }
  163.         //console.log(start+" -- "+end+" : "+layer);
  164.         }
  165.         if (found == true) {
  166.             xmlDesc += '</team></root>';
  167.         }
  168.         else {
  169.             xmlDesc = null;
  170.         }
  171.     }
  172.     else if (useXMLDescription == true) {
  173.         console.log("No remote XML source. Using xmlDescription.");
  174. 		xmlDesc = xmlDescription;
  175.     }
  176.     
  177.     var saved = useRemoteXML;
  178.     useRemoteXML = false;
  179.     fieldGraphicsUpdate(xmlDesc);
  180.     useRemoteXML = saved;
  181. }
  182.  
  183. function fieldGraphicsUpdate(xml) {
  184.     console.log("xml="+xml);
  185.     if (useRemoteXML == true) {
  186.         //        console.log("hometeam="+hometeam);
  187.         var addr = window.location.toString();
  188.         addr = addr.split("game")[0]+"game/team.pl?team_id="+hometeam;
  189.  
  190.         getInetPage(addr, remoteXMLHandler, null);
  191.         return;
  192.     }
  193.  
  194.     if (xml != null) {
  195.         var parser = new DOMParser();
  196.         var xmlDoc = parser.parseFromString(xml, "application/xml");
  197.         var teams = xmlDoc.getElementsByTagName("team");
  198.         console.log("Remote XML: "+hometeam);
  199.         var found = false;
  200.         for (var i=0; i<teams.length; i++) {
  201.             var t = teams[i];
  202.             if (t.getAttribute("id") == hometeam) {
  203.                 if (setImages(t) == true) {
  204.                     fieldGraphicsInsert();
  205.                     found = true;
  206.                     break;
  207.                 }
  208.             }
  209.         }
  210.         if (found == false) {
  211.             for (var i=0; i<teams.length; i++) {
  212.                 var t = teams[i];
  213.                 if (t.getAttribute("id") == "-1") {
  214.                     if (setImages(t) == true) {
  215.                         fieldGraphicsInsert();
  216.                         break;
  217.                     }
  218.                 }
  219.             }
  220.         }
  221.     }
  222.     else if (useXMLDescription == true) {
  223.         var parser = new DOMParser();
  224.         var xmlDoc = parser.parseFromString(xmlDescription, "application/xml");
  225.         var teams = xmlDoc.getElementsByTagName("team");
  226.         console.log("Local XML: "+hometeam+": number of teams in XML = "+teams.length);
  227.         var found = false;
  228.         for (var i=0; i<teams.length; i++) {
  229.             var t = teams[i];
  230.             if (t.getAttribute("id") == hometeam) {
  231.                 if (setImages(t) == true) {
  232.                     fieldGraphicsInsert();
  233.                     found = true;
  234.                     break;
  235.                 }
  236.             }
  237.         }
  238.         if (found == false) {
  239.             for (var i=0; i<teams.length; i++) {
  240.                 var t = teams[i];
  241.                 if (t.getAttribute("id") == "-1") {
  242.                     if (setImages(t) == true) {
  243.                         fieldGraphicsInsert();
  244.                         break;
  245.                     }
  246.                 }
  247.             }
  248.         }
  249.     }
  250.     else {
  251.         fieldGraphicsInsert();
  252.     }
  253. }
  254.  
  255. function setImages(t) {
  256.     var change = false;
  257.     var f = t.getElementsByTagName("field")[0];
  258.     if (f != null) {
  259.         if ((f.textContent != null) && (f.textContent != "null")) {
  260.             if (f.textContent.length > 0) {
  261.                 fieldImage = f.textContent;
  262.             }
  263.         }
  264.  
  265.         var x = f.getAttribute("x");	
  266.         var y = f.getAttribute("y");
  267.         if (x != null) fieldImageX = parseInt(x);
  268.         if (y != null) fieldImageY = parseInt(y);
  269.         change = true;
  270.     }
  271.     else {
  272.         fieldImage = null;
  273.  
  274.     }
  275.  
  276.     var l = t.getElementsByTagName("line")[0];
  277.     if (l != null) {
  278.         lineImage = l.textContent;
  279.         if (l.textContent.length == 0) lineImage = null;
  280.         change = true;
  281.     }
  282.     else lineImage = null;
  283.  
  284.     var n = t.getElementsByTagName("north")[0];
  285.     if (n != null) {
  286.         northEndZoneImage = n.textContent;
  287.         if (n.textContent.length == 0) northEndZoneImage = null;
  288.         change = true;
  289.     }
  290.     else northEndZoneImage = null;
  291.  
  292.     var s = t.getElementsByTagName("south")[0];
  293.     if (s != null) {
  294.         southEndZoneImage = s.textContent;
  295.         if (s.textContent.length == 0) southEndZoneImage = null;
  296.         change = true;
  297.     }
  298.     else southEndZoneImage = null;
  299.  
  300.     var u = t.getElementsByTagName("upper")[0];
  301.     if (u != null) {
  302.         upperDecalImage = u.textContent;
  303.         if (u.textContent.length == 0) upperDecalImage = null;
  304.         change = true;
  305.     }
  306.     else upperDecalImage = null;
  307.  
  308.     var m = t.getElementsByTagName("middle")[0];
  309.     if (m != null) {
  310.         middleDecalImage = m.textContent;
  311.         if (m.textContent.length == 0) middleDecalImage = null;
  312.         else {
  313.             middleDecalImageX = parseInt(m.getAttribute("xsize"));
  314.             middleDecalImageY = parseInt(m.getAttribute("ysize"));
  315.             change = true;
  316.             if ((middleDecalImageX == null) || (middleDecalImageY == null)) {
  317.                 alert("Replay Rewrite: Image sizes for middle decal aren't included! Fix it!")
  318.                 change = false;
  319.             }
  320.         }
  321.     }
  322.     else middleDecalImage = null;
  323.  
  324.     //console.log(middleDecalImage+" --- "+middleDecalImageX);
  325.     return change;
  326. }
  327.  
  328. function fieldGraphicsInsert() {
  329.     if (document.getElementById("field_image") == null) {
  330.         console.log("FGI: no field_image element. delaying.");
  331.         setTimeout( function() { fieldGraphicsInsert(); }, 1000);
  332.     }
  333.     
  334.     if ((enableFieldLayer == true) && (fieldImage != null)) {
  335.         //        var field = document.getElementById("replay_area");
  336.         //        field.style.backgroundImage = "url("+fieldImage+")";
  337.         var field = document.getElementById("field_image");
  338.         field.src = fieldImage;
  339.         field.style.position = "absolute";
  340.         field.style.left = ((520-fieldImageX)>>1)+"px";
  341.         field.style.top = ((1160-fieldImageY)>>1)+"px";
  342.  
  343.         console.log("("+fieldImageX+","+fieldImageY+") "+fieldImage);
  344.     }
  345.  
  346.     if ((enableLowerDecalLayer == true) && (northEndZoneImage != null) && (southEndZoneImage != null)) {
  347.         var d = document.getElementById("lowerdecals");
  348.         if (d == null) {
  349.             var repdiv = document.getElementById("replay_area");
  350.             var parstyle = repdiv.getAttribute("style");
  351.             if (parstyle == null) parstyle = "";
  352.  
  353.             div = document.createElement("div");
  354.             div.setAttribute("style","position:absolute; z-index:"+lowerDecalLayerZ+";");
  355.             div.setAttribute("id","lowerdecals");
  356.             div.zIndex=lowerDecalLayerZ;
  357.  
  358.             var img = document.createElement("img");
  359.             img.src = northEndZoneImage;
  360.             img.setAttribute("style","position: absolute; top:0px; left:0px; z-index:"+lowerDecalLayerZ+";");
  361.             img.zIndex=lowerDecalLayerZ;
  362.             div.appendChild(img);
  363.  
  364.             var img = document.createElement("img");
  365.             img.src = southEndZoneImage;
  366.             img.setAttribute("style","position: absolute; top:988px; left:0px; z-index:"+lowerDecalLayerZ+";");
  367.             img.zIndex=lowerDecalLayerZ;
  368.             div.appendChild(img);
  369.  
  370.             repdiv.appendChild(div);
  371.         }
  372.     }
  373.  
  374.     if ((enableLineLayer == true) && (lineImage != null)) {
  375.         var d = document.getElementById("linelayer");
  376.         if (d == null) {
  377.             var repdiv = document.getElementById("replay_area");
  378.  
  379.             div = document.createElement("div");
  380.             div.setAttribute("style","position:absolute; z-index:"+lineLayerZ+";");
  381.             div.setAttribute("id","linelayer");
  382.             div.zIndex=lineLayerZ;
  383.  
  384.             var img = document.createElement("img");
  385.             img.src = lineImage;
  386.             img.setAttribute("style","position: absolute; z-index:"+lineLayerZ+";");
  387.             img.zIndex=lineLayerZ;
  388.             div.appendChild(img);
  389.  
  390.             repdiv.appendChild(div);
  391.         }
  392.     }
  393.  
  394.     if ((enableMiddleDecalLayer == true) && (middleDecalImage != null)) {
  395.         var d = document.getElementById("middledecals");
  396.         if (d == null) {
  397.             var repdiv = document.getElementById("replay_area");
  398.             var parstyle = repdiv.getAttribute("style");
  399.             if (parstyle == null) parstyle = "";
  400.  
  401.             div = document.createElement("div");
  402.             div.setAttribute("style","position:absolute; z-index:"+middleDecalLayerZ+";");
  403.             div.setAttribute("id","middledecals");
  404.             div.zIndex=middleDecalLayerZ;
  405.  
  406.             //50 yard line image
  407.             var imgysize = middleDecalImageX;
  408.             var imgxsize = middleDecalImageY; //set to the y-axis length of your image
  409.             var img = document.createElement("img");
  410.             img.src = middleDecalImage;
  411.             img.setAttribute("style","position: absolute; top:"+(540-(imgysize>>1))+"px; left:"+(240-(imgxsize>>1))+"px; z-index:"+middleDecalLayerZ+";");
  412.             img.zIndex=middleDecalLayerZ;
  413.             div.appendChild(img);
  414.  
  415.             repdiv.appendChild(div);
  416.         }
  417.     }
  418.  
  419.     if ((enableUpperDecalLayer == true) && (upperDecalImage != null)) {
  420.         var d = document.getElementById("upperdecals");
  421.         if (d == null) {
  422.             var repdiv = document.getElementById("replay_area");
  423.  
  424.             div = document.createElement("div");
  425.             div.setAttribute("style","position:absolute; z-index:"+upperDecalLayerZ+";");
  426.             div.setAttribute("id","upperdecals");
  427.             div.zIndex=upperDecalLayerZ;
  428.  
  429.             var img = document.createElement("img");
  430.             img.src = upperDecalImage;
  431.             img.setAttribute("style","position: absolute; opacity:0.45; z-index:"+upperDecalLayerZ+";");
  432.             img.zIndex=upperDecalLayerZ;
  433.             div.appendChild(img);
  434.  
  435.             repdiv.appendChild(div);
  436.         }
  437.     }
  438.     runUpdate = function() { 
  439.         someOwnersAreFuckingJackasses();
  440.     };
  441.     unlock();
  442. }
  443.  
  444. function someOwnersAreFuckingJackasses() {
  445.     var fi = document.getElementById("field_image");
  446.     console.log("Jackass who cannot follow directions ahoy!");
  447.     if (fi.naturalWidth == 480) {
  448.         fi.style.width = "480px";
  449.         fi.style.height = "1080px";
  450.         fi.style.top = "40px";
  451.         fi.style.left = "20px";
  452.     }
  453. }
  454.  
  455. //these fields have yard lines already. DISABLE THE LINE LAYER.
  456. //fields[fields.length] = 'http://img517.imageshack.us/img517/2792/glbfieldgrassph5.jpg';
  457. //fields[fields.length] = 'http://img517.imageshack.us/img517/2551/glbfieldturfhl0.jpg';
  458. //fields[fields.length] = 'http://img517.imageshack.us/img517/811/glbfieldwornwh2.jpg';
  459. //fields[fields.length] = 'http://img215.imageshack.us/img215/5927/glbfieldsloppyweatheryf1.jpg';
  460. //fields[fields.length] = 'http://img205.imageshack.us/img205/2179/glbfieldsnowvs1.jpg';
  461. //fields[fields.length] = 'http://img523.imageshack.us/img523/6463/glbfieldrb0.gif';
  462. //fields[fields.length] = 'http://img95.imageshack.us/img95/2734/myfield.jpg';
  463.  
  464. // upper decal images
  465. //img.src = "http://img409.imageshack.us/img409/8636/northshadowxf1.png";
  466. //img.src = "http://img510.imageshack.us/img510/1931/eastshadowhs0.png";
  467.  
  468.  
  469.  
  470.  
  471. //img.src = "http://img515.imageshack.us/img515/9223/glboverlaymappedto100vu7.png";
  472.  
  473. //my unlined field
  474. //"http://img296.imageshack.us/img296/4293/smoothfieldpq9.jpg"
  475.  
  476. // my lines
  477. //"http://img527.imageshack.us/img527/3776/glblinesyk7.png"
  478.  
  479. //two GLB endzones
  480. //north: "http://i10.photobucket.com/albums/a136/ggakma/GLB/ENDZONES/endzone-glb-top.jpg"
  481. //south: "http://i10.photobucket.com/albums/a136/ggakma/GLB/ENDZONES/endzone-glb-bottom.jpg"
  482.  
  483. // GLB logo for the middle
  484. // "http://img184.imageshack.us/img184/320/glblogotx0.png"; 224x140
  485.  
  486. /*
  487.  * To add a stadium for a particular team, just copy/paste a new <team> --> </team> block.
  488.  * set the id to that team's ID number and insert their particular images in the appropriate places.
  489.  * The xsize/ysize options MUST BE SET for the mid field image.
  490.  *
  491.  * The block for id# -1 is the default stadium to use if no ID match can be found.
  492.  */
  493. var xmlDescription = '\n\
  494. <root>\n\
  495.     <team id="0">\n\
  496.         <field>http://img296.imageshack.us/img296/4293/smoothfieldpq9.jpg</field>\n\
  497.         <line>http://img527.imageshack.us/img527/3776/glblinesyk7.png</line>\n\
  498.         <north>http://i10.photobucket.com/albums/a136/ggakma/GLB/ENDZONES/endzone-glb-top.jpg</north>\n\
  499.         <south>http://i10.photobucket.com/albums/a136/ggakma/GLB/ENDZONES/endzone-glb-bottom.jpg</south>\n\
  500.         <middle xsize="224" ysize="140">http://img184.imageshack.us/img184/320/glblogotx0.png</middle>\n\
  501.         <upper></upper>\n\
  502.     </team>\n\
  503.     <team id="-1">\n\
  504.         <field x="'+fieldImageX+'" y="'+fieldImageY+'">'+fieldImage+'</field>\n\
  505.         <line></line>\n\
  506.         <north></north>\n\
  507.         <south></south>\n\
  508.         <middle xsize="" ysize=""></middle>\n\
  509.         <upper></upper>\n\
  510.     </team>\n\
  511. </root>\n\
  512. ';