diff options
Diffstat (limited to 'SameGameJS/index.html')
| -rw-r--r-- | SameGameJS/index.html | 144 |
1 files changed, 144 insertions, 0 deletions
diff --git a/SameGameJS/index.html b/SameGameJS/index.html new file mode 100644 index 0000000..ced352d --- /dev/null +++ b/SameGameJS/index.html @@ -0,0 +1,144 @@ +<!DOCTYPE html> +<html> +<head> +<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> +<title>Chrisoft::Same Game</title> +<link rel="icon" href="../favicon.png"> +<link rel="stylesheet" type="text/css" href="../common.css"> +<script type="text/javascript" src="samegame.js"></script> +<style> +div#OptionsContainer +{ + text-align:center; + margin:auto; +} +button +{ + border:none; + color:white; + padding:0.5em 2em; + text-align:center; + background-color:#44AA44; + -webkit-transition-duration: 0.4s; + transition-duration: 0.4s; +} +button:hover +{ + background-color:#66CC66; +} +div#containerDiv +{ + position:absolute; + top:7em; + left:50%; + transform:translate(-50%,0%); + -webkit-transform:translate(-50%,0%); +} +div.clickable +{ + position:absolute; + transition: 0.5s; +} +div.red{background-color:rgba(255,0,0,0.6);} +div.green{background-color:rgba(0,255,0,0.6);} +div.blue{background-color:rgba(0,0,255,0.6);} +div.orange{background-color:rgba(255,192,0,0.6);} +div#endgameDiv +{ + position:absolute; + top:50%; + left:50%; + font-size:0px; + border:0px 0px; + width:20em; + text-align:center; + transform:translate(-50%,-50%) rotate(180deg); + -webkit-transform:translate(-50%,-50%) rotate(180deg); + transition-duration: 0.4s; +} +div#scDiv +{ + position:absolute; + top:50%; + left:50%; + color:rgba(0,0,0,0); + width:20em; + font-size:2em; + z-index:100; + text-align:center; + transform:translate(-50%,-50%); + -webkit-transform:translate(-50%,-50%); +} +</style> +</head> +<body onload="init();"> +<script type="text/javascript" language="javascript"> +function changeImage(img){ + document.getElementById('aqt').src=img; +} +var thm=document.cookie.replace(new RegExp("(?:(?:^|.*;\\s*)thm\\s*\\=\\s*([^;]*).*$)|^.*$"),"$1"); +link = document.createElement( "link" ); +switch(thm) +{ + case "day": + link.href = "../colors-day.css"; + break; + case "night": + link.href = "../colors-night.css"; + break; + case "auto": + default: + var c=new Date(); + if(c.getHours()>=6&&c.getHours()<18) + {link.href = "../colors-day.css";} + else + {link.href = "../colors-night.css";} + break; +} +link.type="text/css"; +link.rel="stylesheet"; +document.getElementsByTagName("head")[0].appendChild(link); +</script> +<table border="0" style="margin:auto;width:66%;"> +<tr> + <td class="CTitle"> + <span style="font-size:2em;"><a href="../">Chrisoft</a>::Same Game</span> + </td> +</tr> +</table> +<div id="OptionsContainer" class="TText"> + Board size: + <select id="bsize"> + <option value="1">Small</option> + <option value="2">Normal</option> + <option value="3">Large</option> + </select> + + Number of colours: + <select id="ccnt"> + <option value="2">2</option> + <option value="3">3</option> + <option value="4">4</option> + </select> + + Seed: + <input type="text" id="seed"></input> + <button id="start" onclick="gameInit();">Start!</button> + <!--<button id="AIstart">Greedy solver</button>--> + <br> + Score: <span id="score"></span> + + Optimal score by greedy strategy:<span id="scoreopt"></span> + + Seed:<span id="cseed"></span> +</div> +<div id="containerDiv"> +<div id="endgameDiv" class="TText">Game over! Score: <span id="egscore"></span></div> +<div id="scDiv" class="TText"></div> +</div> + +<div class="floatingl"> +<img src="../koishi_norm.png" alt="" width="320em" id="aqt" onmouseover="changeImage('../koishi_hovr.png')" onmouseout="changeImage('../koishi_norm.png')" onclick="this.remove();"> +</div> +</body> +</html> |