summaryrefslogtreecommitdiff
path: root/minesweeper/index.html
diff options
context:
space:
mode:
authorGravatar Chris Xiong <chirs241097@gmail.com> 2019-02-10 11:16:07 +0800
committerGravatar Chris Xiong <chirs241097@gmail.com> 2019-02-10 11:16:07 +0800
commit9d3c8c0e6e1a7ba43bf3dc19350d1dca68b657a3 (patch)
tree339de0698c13e1763d3361d70fb1266621025c91 /minesweeper/index.html
downloadweb-9d3c8c0e6e1a7ba43bf3dc19350d1dca68b657a3.tar.xz
Initial commit.
Diffstat (limited to 'minesweeper/index.html')
-rw-r--r--minesweeper/index.html211
1 files changed, 211 insertions, 0 deletions
diff --git a/minesweeper/index.html b/minesweeper/index.html
new file mode 100644
index 0000000..fc18254
--- /dev/null
+++ b/minesweeper/index.html
@@ -0,0 +1,211 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+<meta name="viewport" content="width=device-width">
+<title>Chrisoft::Minesweeper</title>
+<link rel="icon" href="../favicon.png">
+<link rel="stylesheet" type="text/css" href="../common.css">
+<link rel="stylesheet" type="text/css" href="../panel.css">
+<link rel="stylesheet" type="text/css" href="/theme0a.css" id="theme0a">
+<link rel="stylesheet" type="text/css" href="/theme0b.css" id="theme0b">
+<link rel="stylesheet" type="text/css" href="/theme1a.css" id="theme1a">
+<link rel="stylesheet" type="text/css" href="/theme1b.css" id="theme1b">
+<link rel="stylesheet" type="text/css" href="/theme2a.css" id="theme2a">
+<link rel="stylesheet" type="text/css" href="/theme2b.css" id="theme2b">
+<link rel="stylesheet" type="text/css" href="/theme3a.css" id="theme3a">
+<link rel="stylesheet" type="text/css" href="/theme3b.css" id="theme3b">
+<script type="text/javascript" src="../panel.js"></script>
+<script type="text/javascript" src="minesweeper.js"></script>
+<style>
+div#OptionsContainer
+{
+ text-align:center;
+ margin:auto;
+}
+select
+{
+ background-color:#CCC;
+ border:1px #999 solid;
+ padding:0.5em 0.2em;
+}
+button
+{
+ border:none;
+ color:white;
+ padding:0.5em 2em;
+ text-align:center;
+ background-color:#4A4;
+ transition-duration: 0.2s;
+}
+button:hover
+{
+ background-color:#6C6;
+}
+button.off
+{
+ background-color:#A44;
+}
+button.off:hover
+{
+ background-color:#C66;
+}
+button.disabled:hover, button.disabled
+{
+ background-color:#888;
+}
+div#containerDiv
+{
+ margin:auto;
+ position:relative;
+}
+div.clickable
+{
+ position:absolute;
+ text-align:center;
+ border:1px black solid;
+}
+div.overlay
+{
+ pointer-events:none;
+ display:table;
+ position:absolute;
+ text-align:center;
+}
+div.trans
+{
+ transition:100ms;
+}
+div.modal
+{
+ background-color:rgba(0,0,0,0.6);
+ color:#FFF;
+ width:60%;
+ min-height:40%;
+ position:absolute;
+ left:50%;
+ top:50%;
+ transform:translate(-50%,-50%);
+ transition:100ms;
+ font-size:1.4em;
+ padding:1em;
+}
+@media(max-width:768px)
+{
+ div.modal{width:90%;min-height:60%;font-size:1.2em;}
+}
+@media all
+{
+ #panel{left:-15em;}
+}
+div{
+ -webkit-user-select:none !important;
+ -webkit-touch-callout:none !important;
+}
+div#progress{
+ position:fixed;
+ top:0;
+ left:0;
+ width:0%;
+ height:2px;
+ background-color:#47c;
+ transition:width 1s;
+ z-index:9999;
+}
+div.mine{background-color:rgba(255,192,0,0.6);}
+div.detonated{background-color:rgba(255,0,0,0.6);}
+div.flag{background-color:rgba(0,255,0,0.6);}
+div.flagw{background-color:rgba(255,0,255,0.6);}
+div.dug{background-color:rgba(160,160,192,0.8);}
+div.normal{background-color:rgba(128,128,160,0.6);}
+.one{color:#00f;}
+.two{color:#008000;}
+.three{color:#f00;}
+.four{color:#000080;}
+.five{color:#800000;}
+.six{color:#008080;}
+.seven{color:#000;}
+.eight{color:#7e7e7e;}
+</style>
+<script>
+ function loadTheme(){
+ var thm=document.cookie.replace(new RegExp("(?:(?:^|.*;\\s*)thm\\s*\\=\\s*([^;]*).*$)|^.*$"),"$1");
+ if(thm.length<2||'0123z'.indexOf(thm[0])==-1||'abz'.indexOf(thm[1])==-1)thm='zz';
+ var ent="";
+ var d=new Date();
+ if(thm[0]=='z')
+ {
+ var m=d.getMonth()+1;
+ if(m>=3&&m<6)thm='0'+thm[1];
+ else if(m>=6&&m<9)thm='1'+thm[1];
+ else if(m>=9&&m<12)thm='2'+thm[1];
+ else thm='3'+thm[1];
+ }
+ if(thm[1]=='z')
+ {if(d.getHours()>=18||d.getHours()<6)thm=thm[0]+'b';else thm=thm[0]+'a';}
+ ent=`theme${thm}`;
+ var R=new RegExp('theme[0-4][ab]');
+ for(var i=0;i<document.styleSheets.length;++i)
+ {
+ if(R.exec(document.styleSheets[i].ownerNode.id)!==null&&document.styleSheets[i].ownerNode.id!=ent)
+ document.styleSheets[i].disabled=true;
+ else document.styleSheets[i].disabled=false;
+ }
+}
+loadTheme();
+</script>
+</head>
+<body onload="init();">
+<div id="progress"></div>
+<div id="panel" class="TText">
+ <ul id="panellist">
+ <li><a href="/"><h1>Chrisoft</h1></a></li>
+ <li><span><h3>Minesweeper</h3></span></li>
+ <li><span>
+ Difficulty:
+ <select id="bsize" class="TText">
+ <option value="1">Easy</option>
+ <option value="2">Normal</option>
+ <option value="3">Hard</option>
+ </select>
+ </li>
+ <li><span>Multimine:
+ <button id="multim" onclick="multiminetoggle();" class="off TText">Off</button></span>
+ </li>
+ <li><span>Effects:
+ <button id="efx" class="TText" onclick="efxtoggle();">On</button></span>
+ </li>
+ <li><span>Sounds:
+ <button id="sfx" class="TText" onclick="sfxtoggle();">On</button></span>
+ </li>
+ <!--<li><span>I can't count:
+ <button id="remm" class="TText" onclick="remmtoggle();">No thx</button></span>
+ </li>-->
+ <li><a href="javascript:void(0);" onclick="document.getElementById('help').style.opacity='1';document.getElementById('help').style.zIndex='1000';">Help</a></li>
+ <li><span>version: 0.8.8+b1</span></li>
+</div>
+<div id="OptionsContainer" class="TText">
+ <button class="TText" id="start" onclick="gameInit();">New Game</button>
+ <button class="TText" id="st" onclick="systemtest();" style="display:none;" class="disabled">I'm ready, dismantle the mines!</button>
+ <br>Mines:<span id="mines"></span>
+</div>
+<div id="containerDiv">
+</div>
+<div class="modal TText" style="opacity:0;text-align:center;z-index:-999;" id="result" onclick="this.style.opacity='0';this.style.zIndex='-999';">
+</div>
+<div class="modal TText" style="opacity:0;z-index:-999;" id="help" onclick="this.style.opacity='0';this.style.zIndex='-999';">
+ <p>
+ <b>Mobile devices from Apple are not supported...</b><br>
+ Left click / tap and hold on untouched cell = reveal cell<br>
+ Right click / tap on untouched cell = toggle flag in cell<br>
+ Right click / tap on revealed cell = reveal surrounding cells if feasible<br>
+ </p>
+ <p>
+ In multimine mode, there might be multiple (6 max) mines in a single cell.
+ Use right click or short tap to increase flag count, left click or long tap
+ to decrease flag count. To finish a multimine game, you have to flag all cells
+ with mines correctly and click the "I'm ready, dismantle the mines!" button.
+ </p>
+</div>
+</body>
+</html>
generated by cgit v1.2.3 (git 2.39.1) at 2024-11-22 10:57:16 +0000