forked from 505e06b2/Image-to-Braille
-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
41 lines (40 loc) · 1.5 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Given an image, this page will display a text version using braille as 1-bit pixels">
<title>Image to Braille</title>
<link rel="stylesheet" href="style.css">
<script src="braille.js"></script>
<script src="dithering.js"></script>
<script src="main.js"></script>
</head>
<body>
<textarea id="text" readonly></textarea>
<div id="options">
<div><a href="https://github.com/505e06b2/Image-to-Braille" target="_blank">Open Repo</a></div>
<div><input id="file" type="file" accept="image/*"></div>
<div title="Toggle dark theme"><input type="checkbox" id="darktheme"> Dark Theme</div>
<div title="Invert black with white"><input type="checkbox" id="inverted"> Invert</div>
<div title="Monochrome dithering"><input type="checkbox" id="dithering"> Dithering</div>
<div title="Disable placeholder spacing"><input type="checkbox" id="monospace"> Monospace</div>
<div title="Greyscale Mode">
<select id="greyscale_mode">
<option value="luminance">Luminance</option>
<option value="lightness">Lightness</option>
<option value="average">Average</option>
<option value="value">Value</option>
</select>
</div>
<div>
<input type="number" min="2" value="50" step="2" max="500" id="width">
Width (characters)
</div>
<div>
<button id="clipboard">Copy to clipboard</button>
</div>
<div>
Character Count: <span id="charcount">0</span>
</div>
</div>
</body>
</html>