aboutsummaryrefslogtreecommitdiff
path: root/utils
diff options
context:
space:
mode:
authorCharles Cabergs <me@cacharle.xyz>2020-11-24 12:14:42 +0100
committerCharles Cabergs <me@cacharle.xyz>2020-11-24 12:14:42 +0100
commit74d23da9c88e4ec904320d017f81704a78c72e81 (patch)
tree801b5075e72f1a362676d592fabc17a62ec4e34e /utils
parent992441c88e0b4a75fe4aed0878b5a2c9f4a5180f (diff)
parent3ebcd66cd17741ec7dc7793f9f0121e2ee025fdf (diff)
downloadcacharle.xyz-74d23da9c88e4ec904320d017f81704a78c72e81.tar.gz
cacharle.xyz-74d23da9c88e4ec904320d017f81704a78c72e81.tar.bz2
cacharle.xyz-74d23da9c88e4ec904320d017f81704a78c72e81.zip
Merge branch 'templates'
Diffstat (limited to 'utils')
-rw-r--r--utils/fractal_tree/index.html43
-rw-r--r--utils/fractal_tree/index.template.html14
-rw-r--r--utils/fractal_tree/style.css14
-rw-r--r--utils/langton_ant/index.html16
-rw-r--r--utils/langton_ant/index.template.html3
-rw-r--r--utils/minesweeper/index.html49
-rw-r--r--utils/minesweeper/index.template.html29
-rw-r--r--utils/rot13/index.html35
-rw-r--r--utils/rot13/index.template.html12
-rw-r--r--utils/rot13/style.css7
-rw-r--r--utils/sierpinski_triangle/index.html37
-rw-r--r--utils/sierpinski_triangle/index.template.html8
-rw-r--r--utils/sierpinski_triangle/style.css14
13 files changed, 101 insertions, 180 deletions
diff --git a/utils/fractal_tree/index.html b/utils/fractal_tree/index.html
deleted file mode 100644
index 5c4adf2..0000000
--- a/utils/fractal_tree/index.html
+++ /dev/null
@@ -1,43 +0,0 @@
-<!DOCTYPE html>
-
-<html>
- <head>
- <title>cacharle - fractal tree</title>
- <link rel="stylesheet" type="text/css" href="../../style.css"/>
- <meta charset="utf-8"/>
- <link rel="icon" type="image/png" href="../../favicon.png" />
- <style>
- .settings-item {
- margin-top: 10px;
- display: flex;
- justify-content: flex-start;
- align-items: center;
- }
- .settings-item label {
- margin-right: 5px;
- }
- .settings-item input {
- min-width: 200px;
- }
- </style>
- </head>
-
- <body><div id="page-wrapper">
- <h1>fractal tree</h1>
-
- <canvas width="500" height="500" id="tree-canvas"></canvas>
-
- <div class="settings">
- <div class="settings-item">
- <label>depth</label>
- <input id="depth" min="1" max="11" value="9" type="range"/>
- </div>
- <div class="settings-item">
- <label>angle</label>
- <input id="angle" min="1" max="180" value="45" type="range"/>
- </div>
- </div>
-
- </div></body>
- <script src="script.js" type="text/javascript"></script>
-</html>
diff --git a/utils/fractal_tree/index.template.html b/utils/fractal_tree/index.template.html
new file mode 100644
index 0000000..265f772
--- /dev/null
+++ b/utils/fractal_tree/index.template.html
@@ -0,0 +1,14 @@
+<h1>fractal tree</h1>
+
+<canvas width="500" height="500" id="tree-canvas"></canvas>
+
+<div class="settings">
+ <div class="settings-item">
+ <label>depth</label>
+ <input id="depth" min="1" max="11" value="9" type="range"/>
+ </div>
+ <div class="settings-item">
+ <label>angle</label>
+ <input id="angle" min="1" max="180" value="45" type="range"/>
+ </div>
+</div>
diff --git a/utils/fractal_tree/style.css b/utils/fractal_tree/style.css
new file mode 100644
index 0000000..788de38
--- /dev/null
+++ b/utils/fractal_tree/style.css
@@ -0,0 +1,14 @@
+.settings-item {
+ margin-top: 10px;
+ display: flex;
+ justify-content: flex-start;
+ align-items: center;
+}
+
+.settings-item label {
+ margin-right: 5px;
+}
+
+.settings-item input {
+ min-width: 200px;
+}
diff --git a/utils/langton_ant/index.html b/utils/langton_ant/index.html
deleted file mode 100644
index ad8ef22..0000000
--- a/utils/langton_ant/index.html
+++ /dev/null
@@ -1,16 +0,0 @@
-<!DOCTYPE html>
-<html>
- <head>
- <link rel="stylesheet" type="text/css" href="../../style.css"/>
- <link rel="stylesheet" type="text/css" href="style.css"/>
- <meta charset="utf-8"/>
- <title>cacharle - langton ant</title>
- </head>
- <body>
- <h1>langton ant</h1>
- <table id="table">
- </table>
- <script type="text/javascript" src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
- <script type="text/javascript" src="script.js"></script>
- </body>
-</html>
diff --git a/utils/langton_ant/index.template.html b/utils/langton_ant/index.template.html
new file mode 100644
index 0000000..9efb764
--- /dev/null
+++ b/utils/langton_ant/index.template.html
@@ -0,0 +1,3 @@
+<h1>langton ant</h1>
+<table id="table"></table>
+<script type="text/javascript" src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
diff --git a/utils/minesweeper/index.html b/utils/minesweeper/index.html
deleted file mode 100644
index 8945dbd..0000000
--- a/utils/minesweeper/index.html
+++ /dev/null
@@ -1,49 +0,0 @@
-<!DOCTYPE html>
-
-<html>
- <head>
- <title>cacharle - minesweeper</title>
- <meta charset="utf-8"/>
- <link rel="icon" type="image/png" href="../../favicon.png" />
- <link rel="stylesheet" type="text/css" href="../../style.css"/>
- <link rel="stylesheet" type="text/css" href="style.css"/>
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
- </head>
-
- <body><div id="page-wrapper">
- <h1>minesweeper</h1>
-
- <div id="flash-message" hidden>You lost in asdf seconds</div>
-
- <div class="info-bar">
- <div id="minesweeper-game-info" hidden>
- <div>
- <div id="minesweeper-timer">1:30</div>
- <button id="minesweeper-stop" class="game-state">stop</button>
- </div>
- </div>
-
- <div id="minesweeper-settings">
- <div>
- <label for="width">width</label>
- <input id="minesweeper-width" name="width" type="range" min="3" max="20" value="10"/>
- </div>
- <div>
- <label for="height">height</label>
- <input id="minesweeper-height" name="height" type="range" min="3" max="20" value="10"/>
- </div>
- <div>
- <label for="mine-rate">mine rate</label>
- <input id="minesweeper-mine-rate" name="mine-rate" type="range" min="0" max="100" value="20"/>
- </div>
- </div>
- </div>
-
- <table id="minesweeper-table">
- </table>
-
-
-
- </div></body>
- <script src="script.js" type="text/javascript"></script>
-</html>
diff --git a/utils/minesweeper/index.template.html b/utils/minesweeper/index.template.html
new file mode 100644
index 0000000..bf1ea4d
--- /dev/null
+++ b/utils/minesweeper/index.template.html
@@ -0,0 +1,29 @@
+<h1>minesweeper</h1>
+
+<div id="flash-message" hidden>You lost in asdf seconds</div>
+
+<div class="info-bar">
+ <div id="minesweeper-game-info" hidden>
+ <div>
+ <div id="minesweeper-timer">1:30</div>
+ <button id="minesweeper-stop" class="game-state">stop</button>
+ </div>
+ </div>
+
+ <div id="minesweeper-settings">
+ <div>
+ <label for="width">width</label>
+ <input id="minesweeper-width" name="width" type="range" min="3" max="20" value="10"/>
+ </div>
+ <div>
+ <label for="height">height</label>
+ <input id="minesweeper-height" name="height" type="range" min="3" max="20" value="10"/>
+ </div>
+ <div>
+ <label for="mine-rate">mine rate</label>
+ <input id="minesweeper-mine-rate" name="mine-rate" type="range" min="0" max="100" value="20"/>
+ </div>
+ </div>
+</div>
+
+<table id="minesweeper-table"></table>
diff --git a/utils/rot13/index.html b/utils/rot13/index.html
deleted file mode 100644
index 525e14f..0000000
--- a/utils/rot13/index.html
+++ /dev/null
@@ -1,35 +0,0 @@
-<!DOCTYPE html>
-
-<html>
- <head>
- <title>cacharle - rot13</title>
- <link rel="stylesheet" type="text/css" href="../../style.css"/>
- <meta charset="utf-8"/>
- <link rel="icon" type="image/png" href="../../favicon.png" />
- <style>
- textarea {
- resize: none;
- }
- input {
- width: 50%;
- }
- </style>
- </head>
-
- <body><div id="page-wrapper">
- <h1>rot13</h1>
-
- <p>Implementation of the <a href="https://en.wikipedia.org/wiki/ROT13">rot13</a> encryption</p>
-
- <div>Shift size: <span id="rot13-shift-output"></span></div>
- <input type="range" min=0 max=26 value=13 id="rot13-shift"/>
-
- <h3>Input</h3>
- <textarea cols=120 rows=10 id="rot13-input">rotate me!</textarea>
-
- <h3>Output</h3>
- <textarea cols=120 rows=10 id="rot13-output"></textarea>
-
- </div></body>
- <script src="script.js" type="text/javascript"></script>
-</html>
diff --git a/utils/rot13/index.template.html b/utils/rot13/index.template.html
new file mode 100644
index 0000000..64fffdf
--- /dev/null
+++ b/utils/rot13/index.template.html
@@ -0,0 +1,12 @@
+<h1>rot13</h1>
+
+<p>Implementation of the <a href="https://en.wikipedia.org/wiki/ROT13">rot13</a> encryption</p>
+
+<div>Shift size: <span id="rot13-shift-output"></span></div>
+<input type="range" min=0 max=26 value=13 id="rot13-shift"/>
+
+<h3>Input</h3>
+<textarea cols=120 rows=10 id="rot13-input">rotate me!</textarea>
+
+<h3>Output</h3>
+<textarea cols=120 rows=10 id="rot13-output"></textarea>
diff --git a/utils/rot13/style.css b/utils/rot13/style.css
new file mode 100644
index 0000000..c8046b9
--- /dev/null
+++ b/utils/rot13/style.css
@@ -0,0 +1,7 @@
+textarea {
+ resize: none;
+}
+
+input {
+ width: 50%;
+}
diff --git a/utils/sierpinski_triangle/index.html b/utils/sierpinski_triangle/index.html
deleted file mode 100644
index 036e8ac..0000000
--- a/utils/sierpinski_triangle/index.html
+++ /dev/null
@@ -1,37 +0,0 @@
-<!DOCTYPE html>
-
-<html>
- <head>
- <title>cacharle - sierpinski triangle</title>
- <link rel="stylesheet" type="text/css" href="../../style.css"/>
- <meta charset="utf-8"/>
- <link rel="icon" type="image/png" href="../../favicon.png" />
- <style>
- .settings {
- margin-top: 10px;
- display: flex;
- justify-content: flex-start;
- align-items: center;
- }
- .settings label {
- margin-right: 5px;
- }
- .settings input {
- min-width: 200px;
- }
- </style>
- </head>
-
- <body><div id="page-wrapper">
- <h1>sierpinski triangle</h1>
-
- <canvas width="500" height="500" id="sierpinski-triangle"></canvas>
-
- <div class="settings">
- <label>depth</label>
- <input id="depth" min="1" max="9" value="7" type="range"/>
- </div>
-
- </div></body>
- <script src="script.js" type="text/javascript"></script>
-</html>
diff --git a/utils/sierpinski_triangle/index.template.html b/utils/sierpinski_triangle/index.template.html
new file mode 100644
index 0000000..3bad80c
--- /dev/null
+++ b/utils/sierpinski_triangle/index.template.html
@@ -0,0 +1,8 @@
+<h1>sierpinski triangle</h1>
+
+<canvas width="500" height="500" id="sierpinski-triangle"></canvas>
+
+<div class="settings">
+ <label>depth</label>
+ <input id="depth" min="1" max="9" value="7" type="range"/>
+</div>
diff --git a/utils/sierpinski_triangle/style.css b/utils/sierpinski_triangle/style.css
new file mode 100644
index 0000000..b62fd44
--- /dev/null
+++ b/utils/sierpinski_triangle/style.css
@@ -0,0 +1,14 @@
+.settings {
+ margin-top: 10px;
+ display: flex;
+ justify-content: flex-start;
+ align-items: center;
+}
+
+.settings label {
+ margin-right: 5px;
+}
+
+.settings input {
+ min-width: 200px;
+}