Play One Hole
with wind and tee options
Hello all. I've been tweaking the 'practise one hole' feature of WGT to make it a bit easier to customize. The only downside is it means using Javascript again, but the usual rules apply for this.
Copy the blue text in the box below, then right click on the webpage and select Inspect or Inspect Element from the menu to open up the developer tools. In the developer tools, click the Console tab and, at the text cursor, paste in the copied text, then hit your enter [Return] key, (CTRL + enter for IE). Now you can close the developer tools [X].
The four selection boxes contain radio buttons for choosing your Course, Hole, Tee and Wind strength. (Not all the courses experience 20-30mph winds, so although it is available, it won't always apply). Once you have made your selections, hit the GO! button to launch the game client. The picture behind the selection boxes shows the view of the selected hole from the front tee.
Enjoy!
/*
*** PRACTISE ONE HOLE v14.08.2017.1 ***
*/
/*
Set variables
*/
var radio = [15,18,4,3];
var values = [["BOBP3_13_FC","BPB","CAB_11_FC","CHA_14_FC","CON_10_FC","ERH_16_FC","KIOC","MER_12_FC","OAK_09_FC","OLY_11_FC","PEB_14_FC","PH2_13_FC","ROY_10_FC","STA_09_FC","WHI_12_FC"],[1,10,2,11,3,12,4,13,5,14,6,15,7,16,8,17,9,18],[1,2,3,4],[0,1,2]];
var holepic = [["BOBP3_","BPB_","CAB_","CHA_","CON_","ERH_","KIOC_","MER_","OAK_","OLY_","PEB_","PH2_","ROY_","STA_","WHI_"],["H01_","H10_","H02_","H11_","H03_","H12_","H04_","H13_","H05_","H14_","H06_","H15_","H07_","H16_","H08_","H17_","H09_","H18_"],"http://media5.wgt.com/assets/community/images/wgt/courses/","TeeShot.jpg?0.95.6421.22327_1047"]
var cabandwhi = [["MMOoC8I.png","uYsZJgo.png","vDYH7Hm.png","DdHb8yL.png","EbKzAEl.png","i6upJBu.png","DdCREqv.png","FyzX23t.png","8uNphBG.png","6DQK16d.png","e8KWQeb.png","o095Ec6.png","uKGuU2B.png","3lzTRNX.png","2v6luYS.png","7jOtQL7.png","WY5mOsr.png","o0zgrje.png"],["VkHVBh2.png","tzbhIlI.png","SmwTKNg.png","fdDWI8X.png","JsnsmJR.png","9UrjpuQ.png","oNLHEbu.png","S6ozjLc.png","k8Ul1hQ.png","y5Dao2z.png","yy5gWqu.png","dc2s8YZ.png","5fp82Vp.png","uaUfeA6.png","DLiQ8hI.png","KMxmbWp.png","ecbkOdG.png","gOokUOZ.png"]]
var names = ["course","hole","tee","wind"];
var innertext = [["Bandon Dunes","Bethpage Black","Cabo del Sol","Chambers Bay","Congressional","Erin Hills","Kiawah Island","Merion","Oakmont","Olympic","Pebble Beach","Pinehurst No.2","Royal St George's","St Andrews","Whistler"],[1,10,2,11,3,12,4,13,5,14,6,15,7,16,8,17,9,18],["Hack | Amateur","Pro | Tour Pro","Master | TourMaster","Legend | Tour Legend | Champion"],["0-10mph","10-20mph","20-30mph"]];
var launchurl = ["http://www.wgt.com/gameclient.aspx?view=practiceHole&JSON=%7B%22HoleNum%22%3A%22","%22%2C%22GameType%22%3A1%2C%22GameMode%22%3A2%2C%22Wind%22%3A%22","%22%2C%22TeeID%22%3A%22Tee_","%22%2C%22GameCourseId%22%3A%22","%22%2C%22Brand%22%3A%22%22%7D"];
/*
Add forms, fieldsets, legends
*/
var parent = document.querySelector(".onehole");
var teepic = document.createElement("img");
var child = document.createElement("form");
parent.appendChild(teepic);
parent.appendChild(child);
child.setAttribute("id","formbox");
teepic.setAttribute("id","tepic");
for (i=0; i<4; i++){
var field = document.createElement("fieldset");
var leg = document.createElement("legend");
child.appendChild(field);
field.appendChild(leg);
leg.textContent = names[i].toUpperCase();
field.setAttribute("id",names[i]);
/*
Add radio buttons and set attributes
*/
for (j=0; j<radio[i]; j++){
var label = document.createElement("label");
var radiobtn = document.createElement("input");
field.appendChild(label);
label.appendChild(radiobtn);
radiobtn.setAttribute("type","radio");
radiobtn.setAttribute("name",names[i]);
radiobtn.setAttribute("value",values[i][j]);
if (j === 0) {radiobtn.setAttribute("checked","")}
if (i !== 1)label.innerHTML += innertext[i][j]+"<br />";
if (i===1) {if (j % 2 === 1) {radiobtn.outerHTML += innertext[i][j];label.outerHTML += "<br />";} else {radiobtn.outerHTML += innertext[i][j]}}
}
}
/*
Add launch button and hole image
*/
var launch = document.createElement("input");
launch.setAttribute("id","launch");
launch.setAttribute("type","button");
launch.setAttribute("value","GO!");
child.appendChild(launch);
/*
Game launcher
*/
document.querySelector("#launch").addEventListener("mouseup",launchgame);
function launchgame(){
var course = document.querySelectorAll("#course input");
for (i=0;i<course.length;i++){
if (course[i].checked===true) {courseid=course[i].value}
}
var hole = document.querySelectorAll("#hole input");
for (i=0;i<hole.length;i++){
if (hole[i].checked===true) {holeid=hole[i].value}
}
var tee = document.querySelectorAll("#tee input");
for (i=0;i<tee.length;i++){
if (tee[i].checked===true) {teeid=tee[i].value}
}
var wind = document.querySelectorAll("#wind input");
for (i=0;i<wind.length;i++){
if (wind[i].checked===true) {windid=wind[i].value}
}
window.open(launchurl[0]+holeid+launchurl[1]+windid+launchurl[2]+teeid+launchurl[3]+courseid+launchurl[4],"","channelmode=1,fullscreen=1,width=3000,height=2000")
}
/*
Picture changer
*/
var corse = document.querySelectorAll("#course input");
var whole = document.querySelectorAll("#hole input");
for (i=0; i<corse.length; i++){
corse[i].addEventListener("change",picurl);
}
for (i=0; i<whole.length; i++){
whole[i].addEventListener("change",picurl);
}
function picurl(){
for (i=0; i<corse.length; i++) {
if (corse[i].checked === true) {var num1 = i}
}
for (j=0; j<whole.length; j++){
if (whole[j].checked === true) {var num2 = j}
}
if (num1 === 2) {
var tpic = "http://imgur.com/" + cabandwhi[0][num2]
} else if (num1 === 14) {
tpic = "http://imgur.com/" + cabandwhi[1][num2]
} else {
tpic = holepic[2]+holepic[0][num1]+holepic[1][num2]+holepic[3]
}
document.querySelectorAll("#tepic")[0].src = tpic;
}
/*
Add stylesheet
*/
picurl();
var oneholestyle = document.createElement("style");
document.head.appendChild(oneholestyle);
oneholestyle.innerHTML = "#formbox{background-size:contain;display:inline-block;padding:14px 5px;font:bold 1.1em tahoma;width:1043px;position:relative;z-index:20;opacity:0.2;transition:500ms;} #tepic{position:absolute;width:1050px;z-index:10;border-radius:10px;border:2px solid #000;} #formbox:hover {opacity:1;} label:hover{color:white;} input{margin-right:5px;vertical-align:-1px;} fieldset{width:auto;display:inline;border:none;border-radius:10px;} legend{padding:2px 8px;border-radius:5px;transition:opacity 300ms;} label{border-radius:5px;padding:1px 10px 2px 6px;display:block;transition:opacity 300ms;} #course label{background:rgba(0,255,0,0.7);border:1px solid lime;} #hole label{display:inline-block;background:rgba(0,255,255,0.7);border:1px solid cyan;} #tee label{background:rgba(255,255,0,0.7);border:1px solid yellow;} #wind label{background:rgba(255,165,0,0.7);border:1px solid orange;} #course legend{background:rgba(0,255,0,0.7);border:1px solid lime;} #hole legend{background:rgba(0,255,255,0.7);border:1px solid cyan;} #tee legend{background:rgba(255,255,0,0.7);border:1px solid yellow;} #wind legend{background:rgba(255,165,0,0.7);border:1px solid orange;} #launch{background:rgba(0,119,255,0.7);padding:10px 14px;font-size:200%;font-weight:bold;border-radius:10px;outline:none;box-shadow:7px 7px 5px rgba(0,0,0,0.4);border:none;vertical-align:18px;} #launch:hover{color:white;} #launch:active{box-shadow:3px 3px 3px rgba(0,0,0,0.5);} .script{display:none;} .spacer{height:340px;}";
//end