array-in-a-matrix/arrayinamatrix.xyz
array-in-a-matrix/arrayinamatrix.xyz
1
0
Fork 0
Code Issues 3 Pull requests Projects Releases Activity

added fractal

Browse source
This commit is contained in:
array-in-a-matrix 2021-10-12 22:03:58 -04:00
parent 5080a4f0b7
commit 218c5a65dc
4 changed files with 1529 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

40
index/games/fractal/index.html Normal file
View file

@ -0,0 +1,40 @@
<!DOCTYPE html>
<html lang="en-US">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Fractal</title>
<link rel="stylesheet" type="text/css" href="/style/style.css" />
<link rel="stylesheet" type="text/css" href="./style.css" />
</head>
<body>
<header class="page-header" role="banner">
<h1 class="project-name">Fractal</h1>
<h2 class="project-tagline">Interactive fractal using <a
href="https://github.com/xaos-project/XaoSjs">XaoS.js</a>.</h2>
<a href="/" class="btn">Home</a>
<a href="../" class="btn">Games</a>
</header>
<div class="container">
<canvas id="canvas">
<p>Your browser doesn't seem to support the &lt;canvas&gt; tag.
Try <a href="http://firefox.com">Firefox</a>.</p>
</canvas>
<div id="controls">
<button id="fullScreenButton" class="btn btn-primary" onclick="goFullScreen();"></button>
<a href="index.html" id="resetButton" class="btn btn-danger">Reset</a>
<a href="#" id="saveCanvasButton" class="btn btn-primary" download="image.png"
onclick="saveCanvas()">Capture</a><br />
</div>
</div>
</div>
<script src="./xaos.js"></script>
<script src="./starter-template.js"></script>
</body>
</html>

12
index/games/fractal/starter-template.js Normal file
View file

@ -0,0 +1,12 @@
function saveCanvas() {
saveCanvasButton.download = "image.png";
saveCanvasButton.href = canvas.toDataURL("image/png").replace("image/png", "image/octet-stream");
}
function goFullScreen() {
if (canvas.requestFullScreen)
canvas.requestFullScreen();
else if (canvas.webkitRequestFullScreen)
canvas.webkitRequestFullScreen();
else if (canvas.mozRequestFullScreen)
canvas.mozRequestFullScreen();
}

67
index/games/fractal/style.css Normal file
View file

@ -0,0 +1,67 @@
#controls {
position: relative;
margin-bottom: 2.5em;
}
#canvas {
width: 100%;
height: 100vh;
margin-bottom: 0.5em;
display: inline-block;
vertical-align: baseline;
}
#fullScreenButton {
position: absolute;
height: 100vh;
width: 100%;
bottom: 3rem;
visibility: hidden;
}
@media only screen and (max-width: 600px) {
#fullScreenButton {
visibility: visible;
opacity: 0;
}
#saveCanvasButton {
visibility: hidden;
}
}
#resetButton {
position: absolute;
left: 0em;
}
#saveCanvasButton {
position: absolute;
right: 0.1em;
visibility: visible;
}
.container {
padding-right: 15px;
padding-left: 15px;
margin-right: auto;
margin-left: auto;
}
@media (min-width: 768px) {
.container {
width: 750px;
}
}
@media (min-width: 992px) {
.container {
width: 970px;
}
}
@media (min-width: 1200px) {
.container {
width: 1170px;
}
}

1410
index/games/fractal/xaos.js Normal file
View file

File diff suppressed because it is too large Load diff