/* Completed at 2018/10/21 22:06 (GMT+8) and won't change unless there are big bugs. All levels will be edited in an external file, so nothing will be changed here. I'll try my best to add new levels, please look forward. And, this code is written for Monthly Contest: https://www.sololearn.com/learn/13433 . There are also many awesome games! At last, thanks everyone who supports me. ✩°｡⋆⸜(* ॑꒳ ॑* )⸝ '18/10/21 Flandre Scarlet(雨宮桜) * Fixed: Boolean Calculation '18/10/21 23:34 (GMT+8) * Fixed: removed "**" operator with help with Burey '18/10/22 02:42 (GMT+8) * Modified: auto scroll code to bottom '18/10/22 09:44 (GMT+8) * Modified: more wall blocks added '18/10/22 16:36 (GMT+8) */ window.onload = () => { loadgame ("https://dl.dropboxusercontent.com/s/irs4x1nt99tp86w/Coding%20Game%20Levels.txt", start, loadingMessages); } // loading functions function loadgame(textAddress, actions, loadingMsg){ loadingMsg(); var txtFile = new XMLHttpRequest(); try{ txtFile.open("GET", textAddress, true); }catch(e){ return null; } levels = ""; txtFile.onreadystatechange = () => { if(txtFile.readyState !== 4) return; // Makes sure the document is ready to parse. if(txtFile.status !== 200) return; // Makes sure it's found the file. var allText=txtFile.responseText; levels = txtFile.responseText. split("\n"); actions(); // Will separate each line into an array } txtFile.send(null); } function loadingMessages(){ lmsg = "Loading."; loading = setInterval(()=>{ lmsg += "."; Data.getEl("loading").innerHTML = lmsg; }, 200); } function start(){ clearInterval(loading); Data.getEl("loading").innerHTML = ""; if(!levels) alert("Levels loading failed"); sd = SaveData.create(levels.length); setTimeout(()=>{alert("I'll try my best adding new levels.\n\nThanks for playing my game.\nEnjoy yourself!✩°｡⋆⸜(* ॑꒳ ॑* )⸝")},100); setups(); speed = 5; spnums = 60; // obstacles/holes stop = false; working = false; cmds = []; backups = []; scopes = []; inCondition = false; indents = 0; home = [25,75]; // default goal = [75,25]; // default setupObjects(); setupButtons(); picorder = 0; createSubmenu(); createMenu(); // game record currlvl = 0; // current level moves = 0; steps = 0; } function loadLevel(num){ var data = levels[num-1].split(","); currlvl = parseInt(data[0]); STAT = null; var h = data[1].split(" "); home = [parseInt(h[0]), parseInt(h[1])]; showPlace(home); var g = data[2].split(" "); goal = [parseInt(g[0]), parseInt(g[1])]; obstacles = []; var obs = data[3].split(" "); for(var p=0; p0){ // have data if(m{ loadLevel(num); Data.getSt("MENU").display = "none"; }); } for(var p=0; p{ var sthbgst = Data.getSt("SthBG"); if(sthbgst.display=="none"){ sthbgst.display="block"; }else{ sthbgst.display="none"; } }); var sthBG = crtMenuPcs("SthBG", "#ff8"); rect("SthBG", [10,60], [90,60], 60); sthBG.style.display = "none"; sthBG.style.paddingLeft = "2%"; sthBG.innerHTML = "
Creator: Flandre Scarlet

Best Thanks: Kishalaya Saha

Contest Post: 2D Web Game

More Web Games of mine:
1. [Game] Maze
2. Tetris
3. [Game] Challenge 99!"; } function createSubmenu(){ crtPcs("Submenu", "transparent"); rect("Submenu", [0,50], [100,50], 100); //Data.getSt("Submenu").display = "none"; var smbg = Data.crtEl("div", "smbg", "Submenu"); smbg.style.position = "absolute"; smbg.style.background = "white"; smbg.style.opacity = .5; rect("smbg", [0,50], [100,50], 100); // close Submenu var csm = Data.crtEl("div", "closeSM", "Submenu"); csm.style.position = "absolute"; csm.style.background = "#888"; csm.classList.add("menu"); csm.innerText = "❌"; rect("closeSM", [90,5], [100,5], 10); Data.addEL("closeSM", "click", ()=>{ Data.getSt("Submenu").display = "none"; Data.getSt("PicLink").display = "none"; Data.getSt("INSTRUCTIONS").display = "none"; Data.getSt("SettingBG").display = "none"; }); // return to Menu var esc = Data.crtEl("div", "ESC", "Submenu"); esc.style.position = "absolute"; esc.style.background = "yellow"; esc.classList.add("menu"); esc.innerText = "Exit"; rect("ESC", [5,80], [25,80], 10); Data.addEL("ESC", "click", ()=>{ showInfo(""); showInfo("",2); stop = true; working = false; backups = []; resetCode([]); moves = 0; steps = 0; Data.getSt("Submenu").display = "none"; Data.getSt("MENU").display = "block"; Data.getSt("PicLink").display = "none"; Data.getSt("INSTRUCTIONS").display = "none"; Data.getSt("SettingBG").display = "none"; setTimeout(()=>{ stop = false; }, 900/speed+400); }); // instructions var helps = Data.crtEl("div", "HELP", "Submenu"); helps.style.position = "absolute"; helps.style.background = "yellow"; helps.classList.add("menu"); helps.innerText = "Help"; rect("HELP", [5,40], [25,40], 10); Data.addEL("HELP", "click", ()=>{ picorder = 0; if(Data.getSt("INSTRUCTIONS"). display=="none"){ Data.getSt("SettingBG"). display = "none"; Data.getSt("PicLink").display = "block"; Data.getSt("INSTRUCTIONS"). display = "block"; Data.getEl("INSTRUCTIONS").src = "https://i.imgur.com/" + ["JYGY7Se", "qSm51mT", "jRSmzUG", "XkLiAQb"][picorder] + ".png"; }else{ Data.getSt("PicLink"). display = "none"; Data.getSt("INSTRUCTIONS"). display = "none"; } }); var hlppics = Data.crtEl("img", "INSTRUCTIONS", "Submenu"); hlppics.style.position = "absolute"; //hlppics.style.display = "none"; hlppics.src = "https://i.imgur.com/JYGY7Se.png"; rect("INSTRUCTIONS", [30,50], [90,50], 80); Data.addEL("INSTRUCTIONS", "click", ()=>{ picorder += 1; picorder %= 4; hlppics.src = "https://i.imgur.com/" + ["JYGY7Se", "qSm51mT", "jRSmzUG", "XkLiAQb"][picorder] + ".png"; }); // picture link var hlplink = Data.crtEl("a", "PicLink", "Submenu"); hlplink.href = "https://imgur.com/a/6aLHcmW"; hlplink.innerText = "[Instructions Pictures Link]"; hlplink.style.position = "absolute"; hlplink.style.textAlign = "center"; //hlplink.style.display = "none"; rect("PicLink", [30,95], [90,95], 5); // colors for objects var sttn = Data.crtEl("div", "SETTING", "Submenu"); sttn.style.position = "absolute"; sttn.style.background = "yellow"; sttn.classList.add("menu"); sttn.innerText = "Setting"; rect("SETTING", [5,60], [25,60], 10); Data.addEL("SETTING", "click", ()=>{ if(Data.getSt("SettingBG"). display=="none"){ Data.getSt("PicLink"). display = "none"; Data.getSt("INSTRUCTIONS"). display = "none"; Data.getSt("SettingBG"). display = "block"; sttnorder = 0; Data.getEl("SettingPlayer"). click(); }else{ Data.getSt("SettingBG"). display = "none"; } }); var sttnbg = Data.crtEl("div", "SettingBG", "Submenu"); sttnbg.style.position = "absolute"; sttnbg.style.background = "#ff8"; sttnbg.style.display = "none"; rect("SettingBG", [30,55], [90,55], 85); var sttnPlyr = Data.crtEl("div", "SettingPlayer", "SettingBG"); sttnPlyr.style.position = "absolute"; sttnPlyr.style.background = "lightblue"; sttnPlyr.innerText = "Player"; rect("SettingPlayer", [4,10], [24,10], 10); Data.addEL("SettingPlayer", "click", ()=>{ sttnorder = 0; Data.getSt("SettingPlayer"). background = "lightblue"; Data.getSt("SettingGoal"). background = "#ccc"; Data.getSt("SettingWall"). background = "#ccc"; Data.getSt("SettingHole"). background = "#ccc"; }); var sttnGoal = Data.crtEl("div", "SettingGoal", "SettingBG"); sttnGoal.style.position = "absolute"; sttnGoal.style.background = "#ccc"; sttnGoal.innerText = "Goal"; rect("SettingGoal", [28,10], [48,10], 10); Data.addEL("SettingGoal", "click", ()=>{ sttnorder = 1; Data.getSt("SettingPlayer"). background = "#ccc"; Data.getSt("SettingGoal"). background = "lightblue"; Data.getSt("SettingWall"). background = "#ccc"; Data.getSt("SettingHole"). background = "#ccc"; }); var sttnWall = Data.crtEl("div", "SettingWall", "SettingBG"); sttnWall.style.position = "absolute"; sttnWall.style.background = "#ccc"; sttnWall.innerText = "Walls"; rect("SettingWall", [52,10], [72,10], 10); Data.addEL("SettingWall", "click", ()=>{ sttnorder = 2; Data.getSt("SettingPlayer"). background = "#ccc"; Data.getSt("SettingGoal"). background = "#ccc"; Data.getSt("SettingWall"). background = "lightblue"; Data.getSt("SettingHole"). background = "#ccc"; }); var sttnHole = Data.crtEl("div", "SettingHole", "SettingBG"); sttnHole.style.position = "absolute"; sttnHole.style.background = "#ccc"; sttnHole.innerText = "Holes"; rect("SettingHole", [76,10], [96,10], 10); Data.addEL("SettingHole", "click", ()=>{ sttnorder = 3; Data.getSt("SettingPlayer"). background = "#ccc"; Data.getSt("SettingGoal"). background = "#ccc"; Data.getSt("SettingWall"). background = "#ccc"; Data.getSt("SettingHole"). background = "lightblue"; }); function setColors(clr){ function color(c){ return c=="Random"?randomColor():c; } switch(sttnorder){ case 0: Data.getSt("player"). background = color(clr); break; case 1: Data.getSt("goal"). background = color(clr); break; case 2: for(var p=0; p{ setColors(color); }); } sttnColorBtn("red", [14,30]); sttnColorBtn("yellow", [38,30]); sttnColorBtn("sienna", [62,30]); sttnColorBtn("black", [86,30]); sttnColorBtn("white", [14,55]); sttnColorBtn("cyan", [38,55]); sttnColorBtn("magenta", [62,55]); sttnColorBtn("violet", [86,55]); sttnColorBtn("#0cc", [14,80]); sttnColorBtn("#ff8", [38,80]); sttnColorBtn("transparent", [62,80]); sttnColorBtn("Random", [86,80]); } // game setups function setupObjects(){ crtPcs("goal","yellow"); crtPcs("player","red"); for(var p=0; p{ if(!working){ if(inCondition){ if("urdl".includes (cmds[cmds.length-1])){ cmds.push("&"); printsp("and"); } printsp("upIsWall()"); }else print(indent(indents)+"up()"); cmds.push("u"); } }); Data.addEL("right", "click", ()=>{ if(!working){ if(inCondition){ if("urdl".includes (cmds[cmds.length-1])){ cmds.push("&"); printsp("and"); } printsp("rightIsWall()"); }else print(indent(indents)+"right()"); cmds.push("r"); } }); Data.addEL("down", "click", ()=>{ if(!working){ if(inCondition){ if("urdl".includes (cmds[cmds.length-1])){ cmds.push("&"); printsp("and"); } printsp("downIsWall()"); }else print(indent(indents)+"down()"); cmds.push("d"); } }); Data.addEL("left", "click", ()=>{ if(!working){ if(inCondition){ if("urdl".includes (cmds[cmds.length-1])){ cmds.push("&"); printsp("and"); } printsp("leftIsWall()"); }else print(indent(indents)+"left()"); cmds.push("l"); } }); Data.addEL("while", "click", ()=>{ if(!working){ if(!inCondition){ cmds.push("w"); scopes.push("w"); printsp(indent(indents)+"while"); indents += 1; Data.getEl("run"). innerText="↩️"; Data.getEl("while"). innerText="&"; Data.getEl("if"). innerText="|"; inCondition=true; }else{ if("urdl".includes (cmds[cmds.length-1])){ cmds.push("&"); printsp("and"); } } } }); Data.addEL("if", "click", ()=>{ if(!working){ if(!inCondition){ cmds.push("?"); scopes.push("?"); printsp(indent(indents)+"if"); indents += 1; Data.getEl("run"). innerText="↩️"; Data.getEl("while"). innerText="&"; Data.getEl("if"). innerText="|"; inCondition=true; }else{ if("urdl".includes (cmds[cmds.length-1])){ cmds.push("|"); printsp("or"); } } } }); Data.addEL("break", "click", ()=>{ if(!working){ if(inCondition){ if("urdl".includes (cmds[cmds.length-1])){ cmds.push("&"); printsp("and"); } if(cmds[cmds.length-1]!="!"){ cmds.push("!"); printsp("not"); } }else{ cmds.push(">"); print(indent(indents)+"break"); Data.getEl("run").click(); } } }); Data.addEL("run", "click", ()=>{ if(!working){ if(inCondition){ if("w?!".includes (cmds[cmds.length-1])){ printsp("True"); cmds.push("T"); } cmds.push(":"); print(":"); Data.getEl("run"). innerText="⏪"; Data.getEl("while"). innerText="🔄"; Data.getEl("if"). innerText="❓"; inCondition = false; }else if(indents>0){ if(scopes[scopes.length-1] =="w"){ if(":".includes (cmds[cmds.length-1])) print(indent (indents)+"pass") indents -= 1; cmds.push("/"); print(indent(indents)+"#<-"); scopes.pop(); }else if(scopes[scopes. length-1]=="?"){ // if if(":".includes (cmds[cmds.length-1])) print(indent (indents)+"pass") cmds.push(","); print(indent(indents-1) +"else:"); scopes[scopes. length-1]=","; }else if(scopes[scopes. length-1]==","){ // else if(",".includes (cmds[cmds.length-1])) print(indent (indents)+"pass") indents -= 1; cmds.push("."); print(indent(indents)+"#<-"); scopes.pop(); } if(indents==0) Data.getEl("run"). innerText="▶️"; }else if(cmds.length>0){ working = true; commands(0, ...cmds); backups = cmds; cmds = []; showButtons(false); } } }); Data.addEL("del", "click", ()=>{ if(!working){ cmds.pop(); if(">T". includes(cmds[cmds.length-1])) cmds.pop(); resetCode(cmds); } }); Data.addEL("reset", "click", ()=>{ if(!working && (backups.length + cmds.length)){ var cf = confirm("Are you sure to reset your code?"); if(cf) resetCode(backups); } }); Data.addEL("home", "click", ()=>{ if(!STAT && (working || !same(place, home))){ alert("Go Home!"); showInfo("", 2); clear(); stop = true; setTimeout(()=>{ stop = false; moves = 0; steps = 0; setTimeout(goHome, 100); }, 900/speed+400); } }); Data.addEL("menu", "click", ()=>{ Data.getSt("Submenu").display = "block"; }); } function placePlayerGoal(){ rect("goal", [goal[0]-5, goal[1]], [goal[0]+5, goal[1]], 10); rect("player", [home[0]-5, home[1]], [home[0]+5, home[1]], 10); place = [home[0],home[1]]; } function placeObstacles(){ for(var p=0; p": click("break"); break; case ":": case "/": case ",": case ".": click("run"); break; } } // game functions function showPlace(grid){ showInfo("Current: (" + Math.floor(grid[0]/10) + ", " + (9-Math.floor(grid[1]/10)) + ")"); } function goHome(){ moveTo(home); setTimeout(()=>{ STAT = ""; working=false; showButtons(true); }, 900/speed+200); } function same(gridA, gridB){ return gridA[0]==gridB[0] && gridA[1]==gridB[1]; } function slowmove(target, step, left){ if(left>0){ if(stop) return "BRK"; else{ place[0]+=step[0]; place[1]+=step[1]; rect("player", [place[0]-5,place[1]], [place[0]+5,place[1]], 10); setTimeout(()=>{ slowmove(target, step, left-1) }, 20/speed); } }else{ target = [Math.round((target[0]-5)/10)*10+5, Math.round((target[1]-5)/10)*10+5]; // repair when lag place = [target[0], target[1]]; rect("player", [target[0]-5,target[1]], [target[0]+5,target[1]], 10); showPlace(target); } } function moveTo(target){ var x=(target[0]-place[0])/50, y=(target[1]-place[1])/50; slowmove(target, [x,y], 50); } function action(direc){ // direc = "urdl" var dx=0, dy=0; switch(direc){ case "u": dy = isWall("u")?0:-10; break; case "r": dx = isWall("r")?0:10; break; case "d": dy = isWall("d")?0:10; break; case "l": dx = isWall("l")?0:-10; break; } var target = [place[0]+dx, place[1]+dy]; moveTo(target); return target; } function isIn(grid, list){ for(var p=0; p{ var codes = Data.getEl("print_content").innerText.split("\n"); var lines = 0; for(var p=0; p{ alert("Fell Into Hole!"); showInfo(""); showInfo("",2); clear(); working = false; moves = 0; steps = 0; goHome(); }, 900/speed+300); return "FLD"; // failed }else if(cmdstep0){ cmdstep += 1; if(cmd[cmdstep]== "w") sc += 1; else if(cmd[cmdstep]=="/") sc -= 1; } } }else if(cmd[cmdstep]=="?"){ // if var conditions = []; while(cmd[cmdstep]!=":"){ cmdstep += 1; conditions.push (cmd[cmdstep]); } if(!calculateConditions (...conditions)){ var sc = 1; // scopes while(sc>0){ cmdstep += 1; if(cmd[cmdstep]== "?") sc += 1; else if(cmd[cmdstep]==",") sc -= 1; } } }else if(cmd[cmdstep]==","){ // else = if end steps -= 1; var sc = 1; while(sc>0){ cmdstep += 1; if(cmd[cmdstep]=="?") sc += 1; else if(cmd[cmdstep]==".") sc -= 1; } } else if(cmd[cmdstep]==">") // break while(cmd[cmdstep]!="/") cmdstep += 1; else if(cmd[cmdstep]=="/"){ var sc = 1; // scopes while(sc>0){ cmdstep -= 1; if(cmd[cmdstep]=="/") sc += 1; else if(cmd[cmdstep]=="w") sc -= 1; } var conditions = []; while(cmd[cmdstep]!=":"){ cmdstep += 1; conditions.push (cmd[cmdstep]); } if(!calculateConditions (...conditions)){ while(cmd[cmdstep]!="/") cmdstep += 1; } } setTimeout(()=>{ STAT = commands(cmdstep+1, ...cmd) }, 900/speed+300); } }else{ showInfo(""); showInfo("",2); clear(); working = false; moves = 0; steps = 0; alert("Mission Failed..."); goHome(); return "FIN"; // finished } } function indent(idts){ var indspcs = ""; for(var i=0; iinnerHeight?"vh":"vw"; unitlen = innerWidth>innerHeight? innerHeight/100: innerWidth/100; } function setupTextFields(){ //alert(document.constructor.name) document.styleSheets[0].addRule(".txt", "font-size: " + 4 + unit + ";"); document.styleSheets[0].addRule(".txt", "width: " + 100 + unit + ";"); Data.getSt("text_field1").top=0+unit; Data.getSt("text_field2").top=5+unit; } function setupBG(pad=[0,0]){ Data.getSt("bg").width = 100 + unit; Data.getSt("bg").height = 100 + unit; Data.getSt("bg").position = "absolute"; Data.getSt("bg").left = pad[0] + unit; Data.getSt("bg").top = pad[1] + unit; } function setupPrint(){ // ----- print field ----- var pfs = Data.getSt("print_field"); pfs.fontSize = 5 + unit; if(unit=="vw"){ if(innerHeight < 110 * unitlen) pfs.bottom = (innerHeight - 110 * unitlen) + "px"; else pfs.bottom = 0; pfs.left = 0; pfs.width = "100%"; if(printMinimum) pfs.height = "5vw"; else if(printFullScreen){ pfs.height = "100vh"; }else if(innerHeight<105*unitlen) pfs.height = "5vw"; else pfs.height = (innerHeight - 105 * unitlen) + "px"; pfs.top = "auto"; pfs.right = "auto"; }else{ pfs.top = 0; printMinimum = false; printFullScreen = false; if(innerWidth < 140 * unitlen) pfs.right = (innerWidth - 140 * unitlen) + "px"; else pfs.right = 0; pfs.height = "100%"; if(innerWidth < 140 * unitlen) pfs.width = "40vh"; else pfs.width = (innerWidth - 130 * unitlen) + "px"; pfs.left = "auto"; pfs.bottom = "auto"; } // ----- print title ----- var pts = Data.getSt("print_title"); pts.height = 5 + unit; pts.fontSize = 4 + unit; // ----- print minimum ----- var pns = Data.getSt("print_minimum"); pns.height = 5 + unit; pns.width = 5 + unit; pns.right = 7 + unit pns.fontSize = 5 + unit; pns.display=unit=="vw"?"block":"none"; Data.addEL("print_minimum","click",()=>{ printMinimum=!printMinimum; }); // ----- print magnify ----- var pms = Data.getSt("print_magnify"); Data.getEl("print_magnify").innerText = printFullScreen?"▫":"□"; pms.height = 5 + unit; pms.width = 5 + unit; pms.fontSize = 5 + unit; pms.display=unit=="vw"?"block":"none"; Data.addEL("print_magnify","click",()=>{ printMinimum = false; printFullScreen=!printFullScreen; }); // ----- print content ----- var pcs = Data.getSt("print_content"); pcs.height = (Data.getValPx ("print_field", "height")-5*unitlen)+"px"; pcs.fontSize = 4 + unit; pcs.top = 5 + unit; } function printsp(str="", end=" "){ var pct = Data.getEl("print_content") pct.innerText += str + end; pct.scrollTop = pct.scrollHeight; } function print(str="", ...strs){ var pct = Data.getEl("print_content") pct.innerText += str + "\n"; for(var x=0; xpt1[1]?0:180)) + "deg)"; } // rectangles function rect(id, pt1, pt2, width=null, border=0, bdcolor="black"){ var s = Data.getEl(id); var h = width; if(width==null){ h = Data.getValPx(id,"height")/unitlen; s.style.height = h + "%"; }else{ s.style.height = h + "%"; } var w = Math.hypot(pt1[0] - pt2[0], pt1[1]-pt2[1]); s.style.width = w + "%"; s.style.left = (pt1[0]-border)+"%"; s.style.top = (pt1[1]-width/2-border) + "%"; s.style.border = border+"%" +" solid " + bdcolor; s.style.borderRadius = 0; s.style.transformOrigin = (border)+"%" + " " + (width/2+border)+"%"; if(pt2[0]!=pt1[0]) s.style.transform = "rotate(" + (Math.atan((pt2[1]-pt1[1])/(pt2[0]-pt1[0])) *180/Math.PI + (pt2[0]pt1[1]?0:180)) + "deg)"; } // ----- create div shape until here ----- // random parameters function randomColor(){ var color = "#"; var hex = "0123456789abcdef"; for(var p=0; p<6; p++) color += hex[Math.floor(Math. random()*16)]; return color; } function randint(...nums){ if(nums.length==0) return Math.floor(Math.random()*10); else if(nums.length==1) return Math.floor(Math.random() * nums[0]); else if(nums.length==2) return Math.floor(Math.random() * (nums[1]-nums[0])) + Math.ceil(nums[0]); else if(nums.length==3) return Math.floor(Math.floor (Math.random() * (nums[1]-nums[0])/nums[2])*nums[2]) + Math.ceil(nums[0]); } // ----- random parameters until here -----

Coding Game