99 lines
1.8 KiB
HTML
99 lines
1.8 KiB
HTML
<!doctype>
|
|
<html>
|
|
<head>
|
|
<style>
|
|
body{
|
|
margin: 25px;
|
|
background: #eee;
|
|
font-family: sans-serif;
|
|
font-size: 16px;
|
|
font-weight: 100;
|
|
line-height: 1.5em;
|
|
}
|
|
#canvas{
|
|
display: block;
|
|
margin-bottom: 20px;
|
|
float:left;
|
|
}
|
|
#sidebar{
|
|
float:left;
|
|
margin-left: 25px;
|
|
width:300px;
|
|
}
|
|
#sidebar hr{
|
|
border:none;
|
|
border-bottom: 2px solid rgba(0,0,0,0.12);
|
|
margin: 1em 0;
|
|
}
|
|
textarea#data{
|
|
width:240px;
|
|
height:50px;
|
|
}
|
|
#goal{
|
|
font-size:20px;
|
|
width:100%;
|
|
padding:5px;
|
|
margin-bottom: 10px;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
|
|
<!-- Game Canvas -->
|
|
<canvas id="canvas"></canvas>
|
|
|
|
<!-- Sidebar -->
|
|
<div id="sidebar">
|
|
|
|
<!-- Meta Settings -->
|
|
<input type="input" id="goal" placeholder="puzzle goal"></input>
|
|
<br>
|
|
contagion threshold:
|
|
<span id="contagionLabel"></span>
|
|
<br>
|
|
<input type="range" min="0" max="12" step="1" value="4" id="contagionSlider">
|
|
|
|
<!-- Simulate -->
|
|
<hr>
|
|
simulation:
|
|
<span id="simIsNotRunning">
|
|
(not running)
|
|
<br>
|
|
<button id="simStart">start sim</button>
|
|
</span>
|
|
<span id="simIsRunning">
|
|
(running! step <span id="sim_step"></span>)
|
|
<br>
|
|
<button id="simNext">next step</button>
|
|
<button id="simStop">stop sim</button>
|
|
</span>
|
|
|
|
<!-- Metrics
|
|
<hr>
|
|
connected:
|
|
<span id="metric_connected"></span>
|
|
<br>
|
|
avg path length:
|
|
<span id="metric_avg_path"></span>
|
|
<br>
|
|
longest path length:
|
|
<span id="metric_longest_path"></span>
|
|
<br>
|
|
avg clustering:
|
|
<span id="metric_clustering"></span>-->
|
|
|
|
<!-- Save & Load -->
|
|
<hr>
|
|
<div style="display:inline-block; width:50px">
|
|
<button id="buttonSave">(s)ave</button>
|
|
<button id="buttonLoad">load</button>
|
|
<button id="buttonClear">clear</button>
|
|
</div>
|
|
<textarea id="data"></textarea>
|
|
|
|
</div>
|
|
|
|
</body>
|
|
</html>
|
|
<script src="Old_Game.js"></script>
|
|
<script src="editor.js"></script> |