Chrisoft::Minesweeper

From bdbf0454f4d464eed3939a6bf7cb05452f21b15b Mon Sep 17 00:00:00 2001 From: Chris Xiong Date: Sat, 4 Mar 2017 23:48:07 +0800 Subject: Initial upload. --- README.md | 6 + colors-day.css | 16 +++ colors-night.css | 16 +++ common.css | 42 ++++++ index.html | 171 ++++++++++++++++++++++ minesweeper.js | 423 +++++++++++++++++++++++++++++++++++++++++++++++++++++++ panel.css | 51 +++++++ panel.js | 48 +++++++ 8 files changed, 773 insertions(+) create mode 100644 README.md create mode 100644 colors-day.css create mode 100644 colors-night.css create mode 100755 common.css create mode 100644 index.html create mode 100644 minesweeper.js create mode 100644 panel.css create mode 100644 panel.js diff --git a/README.md b/README.md new file mode 100644 index 0000000..4ca9a7a --- /dev/null +++ b/README.md @@ -0,0 +1,6 @@ +# minesweeperjs +A fancy minesweeper in your browser with a "multimine" mode + +Try it live [here](https://chrisoft.org/minesweeper/). + +The code is pretty ugly as _I don't know JS_. Feel free to improve it. diff --git a/colors-day.css b/colors-day.css new file mode 100644 index 0000000..8be76b3 --- /dev/null +++ b/colors-day.css @@ -0,0 +1,16 @@ +body { + background: #FFF; + color: #000; +} +#panel li a.active { +background-color:#CEC; +} +#panel li a:hover:not(.active) { +background-color:#DFD; +} +#panel { +background-color:#EEE; +} +#content .block { +border: 1px solid #333; +} diff --git a/colors-night.css b/colors-night.css new file mode 100644 index 0000000..6ff2c60 --- /dev/null +++ b/colors-night.css @@ -0,0 +1,16 @@ +body { + background: #090933; + color: #FFF; +} +#panel li a.active { +background-color:#449; +} +#panel li a:hover:not(.active) { +background-color:#338; +} +#panel { +background-color:#116; +} +#content .block { +border: 1px solid #338; +} diff --git a/common.css b/common.css new file mode 100755 index 0000000..066b69f --- /dev/null +++ b/common.css @@ -0,0 +1,42 @@ +.CTitle { + font-family: 'FreeMono', 'Courier New', Courier, monospace; +} +.TText { + font-family: 'FreeMono', 'Courier New', Courier, monospace; +} +a:link { +color:#1194FF; +text-decoration:none; +} +a:visited { +color:#20ACFF; +text-decoration:none; +} +a:hover { +color:#3FBFFF; +text-decoration:none; +} +a:active { +color:#CCCCFF; +text-decoration:none; +} +div.comment{ + border:1px solid #CCC; + margin:1em; +} +div.author{ + text-align:right; + padding-right:0.5em; + padding-bottom:0.5em; +} +div.floatingl { + left: 0px; + bottom: -10px; + position: fixed; +} +div.floatingr { + right: 0px; + bottom: -10px; + position: fixed; + transform: rotateY(180deg); +} diff --git a/index.html b/index.html new file mode 100644 index 0000000..3c814ec --- /dev/null +++ b/index.html @@ -0,0 +1,171 @@ + + + + + +Chrisoft::Minesweeper + + + + + + + + + +

Chrisoft
Minesweeper
+ Difficulty: + +
Multimine: + +
Effects: + +
Sounds: + +
Help
version: 0.8.7+b1

+ + +
Mines: +

+ + + + diff --git a/minesweeper.js b/minesweeper.js new file mode 100644 index 0000000..99730fe --- /dev/null +++ b/minesweeper.js @@ -0,0 +1,423 @@ +//Chris Xiong 2017 +//The MIT License +var dimpx,dimx,dimy,cc,firstclick; +var boardn=null; +var boards=null; +var boarde=null; +var ismobile,effects=true,multimine=false,sfxe=true; +var dead,st,solved,animating; +var dx=[-1,-1,-1, 0, 0, 1, 1, 1]; +var dy=[-1, 0, 1,-1, 1,-1, 0, 1]; +var classes=["one","two","three","four","five","six","seven","eight"]; +var queue=[],newqueue=[],flags=[]; +var mines=[],detx,dety,cmines=[],sfx=[]; +function randomInt(min,max) +{ + seed*=214013;seed+=2531011;seed&=0xffffffff; + return min+(seed^seed>>15)%(max-min+1); +} +function efxtoggle() +{ + effects=!effects; + document.getElementById('efx').classList.toggle('off'); + document.getElementById('efx').innerHTML=effects?"On":"Off"; + for(var i=0;i40)||(custy&&custy>40)||(ccc&&custx&&custy&&(ccc>custx*custy-9))) + {console.log("Are you insane?");return;} + firstclick=true;dead=false;solved=false;for(var i=0;i<7;++i)flags[i]=cmines[i]=0; + document.getElementById("result").style.opacity="0"; + document.getElementById("result").style.zIndex="-999";animating=false; + for(var nd=document.getElementById("containerDiv");nd.hasChildNodes();nd.removeChild(nd.lastChild)); + if(document.getElementById("bsize").value=="1") + {dimx=9;dimy=9;cc=10;} + if(document.getElementById("bsize").value=="2") + {dimx=16;dimy=16;cc=40;} + if(document.getElementById("bsize").value=="3") + {dimx=16;dimy=30;cc=99;} + if(custx&&custy&&ccc){dimx=custx;dimy=custy;cc=ccc;} + if((window.innerWidth>window.innerHeight)^(dimxwindow.innerHeight*0.8) + { + dimpx=window.innerHeight*(ismobile?0.9:0.8); + document.getElementById("containerDiv").style.width=dimpx/dimx*dimy+"px"; + document.getElementById("containerDiv").style.height=dimpx+"px"; + } + else + { + dimpx=window.innerWidth*(ismobile?0.9:0.8); + document.getElementById("containerDiv").style.width=dimpx+"px"; + document.getElementById("containerDiv").style.height=dimpx/dimy*dimx+"px"; + } + boards=new Array(dimx+4);for(var i=0;i=2||Math.abs(sy-j)>=2)s.push(i*dimy+j); + for(var i=0;i32)--boardn[x][y]; + if(rnd>57)--boardn[x][y]; + if(rnd>77)--boardn[x][y]; + if(rnd>87)--boardn[x][y]; + if(rnd>95)--boardn[x][y]; + } + ++cmines[-boardn[x][y]]; + for(var j=0;j<8;++j) + { + var cx=x+dx[j],cy=y+dy[j]; + if(cx>=0&&cx=0&&cy=0) + boardn[cx][cy]-=boardn[x][y]; + } + }st=new Date();updateflags(); +} +function mclick(e) +{ + e.preventDefault(); + if(dead||solved||animating)return; + var x=this.x,y=this.y; + if(ismobile) + { + if(multimine) + {if(boards[x][y]>=0)flag(x,y);} + else{if(boards[x][y]==1)deflag(x,y);else if(boards[x][y]==0)flag(x,y);} + if(boards[x][y]==-1)autodig(x,y); + } + else + { + if(boards[x][y]==0)dig(x,y); + else if(boards[x][y]==-1)autodig(x,y); + else if(multimine&&boards[x][y]>0)deflag(x,y); + } +} +function rclick(e) +{ + e.preventDefault(); + if(dead||solved||animating)return; + var x=this.x,y=this.y; + if(ismobile) + { + if(boards[x][y]==0)dig(x,y); + else if(multimine&&boards[x][y]>0)deflag(x,y); + } + else + { + if(multimine) + {if(boards[x][y]>=0)flag(x,y);} + else{if(boards[x][y]==1)deflag(x,y);else if(boards[x][y]==0)flag(x,y);} + } +} +function checksolved() +{ + for(var i=0;i=0&&boards[i][j]!=-1)return false; + return true; +} +var pair=function(_x,_y){this.x=_x;this.y=_y;} +pair.prototype.toString=function() +{ + return this.x+","+this.y; +} +function dfs(x,y) +{ + if(boards[x][y]!=0)return; + newqueue.push(new pair(x,y)); + boards[x][y]=-1;animating=true;bfs(1); +} +function bfs(s) +{ + q=newqueue.slice(0);newqueue=[]; + if(s)playsound('ding.ogg'); + for(var i=0;i0) + { + boarde[x][y].span.innerHTML=boardn[x][y]; + boarde[x][y].span.classList.add(classes[(boardn[x][y]-1)%8]); + } + boarde[x][y].overlay.style.opacity="1"; + boarde[x][y].overlay.style.transform="scale(1,1)"; + boarde[x][y].overlay.classList.add("dug"); + if(boardn[x][y]==0) + { + for(var j=0;j<8;++j) + { + var c=new pair(x+dx[j],y+dy[j]); + if(c.x>=0&&c.x=0&&c.y=0&&cx=0&&cy<=dimy&&boards[cx][cy]>0)c+=boards[cx][cy]; + } + if(c==boardn[x][y]) + { + newqueue=[]; + for(var i=0;i<8;++i) + { + var cx=x+dx[i],cy=y+dy[i]; + if(cx>=0&&cx=0&&cy<=dimy) + { + if(multimine&&boardn[cx][cy]<0&&boards[cx][cy]!=-boardn[cx][cy]) + {die(cx,cy);return;} + if(boards[cx][cy]==0){newqueue.push(new pair(cx,cy));boards[cx][cy]=-1;} + } + } + if(newqueue.length){animating=true;bfs(1);} + } +} +function flag(x,y) +{ + --flags[boards[x][y]];boards[x][y]++; + if(multimine){if(boards[x][y]>6)boards[x][y]=6;boarde[x][y].span.innerHTML=boards[x][y];} + else{if(boards[x][y]>1)boards[x][y]=1;boarde[x][y].span.innerHTML="X";} + ++flags[boards[x][y]]; + boarde[x][y].overlay.classList.add('flag'); + boarde[x][y].overlay.style.opacity="1"; + boarde[x][y].overlay.style.transform="scale(1,1)"; + updateflags(); +} +function deflag(x,y) +{ + --flags[boards[x][y]];--boards[x][y];++flags[boards[x][y]]; + boarde[x][y].span.innerHTML=boards[x][y]; + if(boards[x][y]==0) + { + boarde[x][y].span.innerHTML=""; + boarde[x][y].classList.remove('flag'); + boarde[x][y].classList.add('normal'); + boarde[x][y].overlay.style.opacity="0"; + boarde[x][y].overlay.style.transform="scale(2,2)"; + } + updateflags(); +} +function updateflags() +{ + if(multimine) + { + var s=""; + for(var i=1;i<7;++i)s=s+" x"+i+" "+flags[i]+"/"+cmines[i]; + document.getElementById("mines").innerHTML=s; + } + else + {document.getElementById("mines").innerHTML=flags[1]+"/"+cmines[1];} +} +function cmp(x,y) +{ + return (Math.abs(x.x-detx)+Math.abs(x.y-dety))-(Math.abs(y.x-detx)+Math.abs(y.y-dety)); +} +function die(x,y) +{ + if(dead||boardn[x][y]>=0)return; + dead=true;detx=x;dety=y;mines.sort(cmp); + for(var i=0;i0&&boards[i][j]!=-boardn[i][j]&&(i!=x||j!=y)) + { + boarde[i][j].overlay.classList.remove('flag'); + boarde[i][j].overlay.classList.add('flagw'); + boarde[i][j].span.innerHTML="~~"+boarde[i][j].span.innerHTML+"~~"; + } + boarde[x][y].overlay.classList.add('detonated'); + boarde[x][y].overlay.classList.remove('flag'); + boarde[x][y].overlay.style.opacity="1"; + boarde[x][y].overlay.style.transform="scale(1,1)"; + if(multimine) + { + if(-boardn[x][y]!=boards[x][y]&&boards[x][y]>0) + boarde[x][y].span.innerHTML="~~"+boards[x][y]+"~~"+(boardn[x][y]<0?-boardn[x][y]:""); + else boarde[x][y].span.innerHTML=-boardn[x][y]; + } + var st=1;if(mines[1].toString()!=new pair(x,y).toString)st=0; + playsound('explode.ogg'); + if(effects)setTimeout(dieproc,10,st);else dieproc(st); + window.navigator.vibrate([200,100,300]); +} +function dieproc(p) +{ + if(!dead||p>=mines.length){if(p>=mines.length)showresult(0);document.getElementById("containerDiv").style.transform="none";return;} + var x=mines[p].x,y=mines[p].y;if(effects&&(p%5==0))playsound('explode.ogg',.2); + if(boards[x][y]!=-boardn[x][y]) + { + boarde[x][y].overlay.classList.add('mine'); + boarde[x][y].overlay.classList.remove('flag'); + } + boarde[x][y].overlay.style.opacity="1"; + boarde[x][y].overlay.style.transform="scale(1,1)"; + if(multimine) + { + if(-boardn[x][y]!=boards[x][y]&&boards[x][y]>0) + boarde[x][y].span.innerHTML="~~"+boards[x][y]+"~~"+(boardn[x][y]<0?-boardn[x][y]:""); + else boarde[x][y].span.innerHTML=-boardn[x][y]; + } + if(effects) + document.getElementById("containerDiv").style.transform="translate("+(Math.random()*10-5)+"px,"+(Math.random()*10-5)+"px)"; + if(!effects||(cc>40&&(p&1)))dieproc(p+1);else setTimeout(dieproc,10,p+1); +} +function systemtest() +{ + if(document.getElementById("st").classList.contains("disabled")||solved||dead)return; + for(var i=0;iClick or tap anywhere in the dialog to close it."; + } + else + { + var cs=0,ccor=0,uc=0; + for(var i=0;i=0)++uc; + } + document.getElementById('result').style.opacity="1";document.getElementById('result').style.zIndex="1000"; + document.getElementById('result').innerHTML= + "Game Over!
You uncovered "+(100*uc/(dimx*dimy-cc)).toFixed(2)+"% of the field and located "+(100*ccor/cs).toFixed(2)+"% mines correctly.
Click or tap anywhere in the dialog to close it." + } +} diff --git a/panel.css b/panel.css new file mode 100644 index 0000000..2b1066a --- /dev/null +++ b/panel.css @@ -0,0 +1,51 @@ +#panel ul{ +padding:0; +list-style-type:none; +} +#panel li h1 { +position:relative; +left:-0.6em; +margin:0; +font-weight:normal; +} +#panel li h3 { +position:relative; +left:-0.3em; +margin:0; +font-weight:normal; +} +#panel li { +display:block; +padding-left:1.5em; +padding-top:0.5em; +padding-bottom:0.5em; +} +#panel { +width: 16em; +height:100%; +position:fixed; +top:0; +left:0; +transition:left 0.4s; +z-index:999; +} +#panel .themesw { +text-align:center; +padding-top:0.5em; +} +#content { +margin-left: 16em; +} +#content p{text-indent:2em;} +#content h2{font-weight:normal;} +#content h3{font-weight:normal;} +#content .block { +display: none; +padding: 1em; +} +@media all +{ + #panel{left:-15em;} + #content{margin-left:1em;} + #msgform{width:auto;margin:1em;} +} diff --git a/panel.js b/panel.js new file mode 100644 index 0000000..1f02c5f --- /dev/null +++ b/panel.js @@ -0,0 +1,48 @@ +var fold=true; +function setupevents() +{ + window.ontouchstart=function(e) + { + x1=e.touches[0].screenX; + y1=e.touches[0].screenY; + } + window.ontouchmove=function(e) + { + x2=e.touches[0].screenX; + y2=e.touches[0].screenY; + } + window.ontouchend=function(e) + { + x2=e.changedTouches[0].screenX; + y2=e.changedTouches[0].screenY; + if(Math.abs(x1-x2)<20&&Math.abs(y1-y2)<20) + { + if(x2document.getElementById("panel").getClientRects()[0].right&&!fold) + {document.getElementById("panel").style.left="-15em";fold=true;} + } + if(x2-x1>window.innerWidth*0.2) + {document.getElementById("panel").style.left="0";fold=false;} + if(x1-x2>window.innerWidth*0.2) + {document.getElementById("panel").style.left="-15em";fold=true;} + } + document.getElementById("panel").onmouseenter=function() + { + if(fold) + {document.getElementById("panel").style.left="0";fold=false;} + } + document.getElementById("panel").onmouseleave=function() + { + if(!fold) + {document.getElementById("panel").style.left="-15em";fold=true;} + } +} +function unsetevents() +{ + window.ontouchstart=undefined; + window.ontouchmove=undefined; + window.ontouchend=undefined; + document.getElementById("panel").onmouseenter=undefined; + document.getElementById("panel").onmouseleave=undefined; +} -- cgit v1.2.3