Initial commit

This commit is contained in:
Niles Rogoff 2016-08-06 22:12:34 -04:00
commit 887af2a8e5
4 changed files with 141 additions and 0 deletions

3
.gitignore vendored Normal file
View File

@ -0,0 +1,3 @@
out
*.png
tmp

3
README.md Normal file
View File

@ -0,0 +1,3 @@
This is mostly for backup purposes, the chances that you actually want to get this up and running on your own server when you could just as easily run the [2bit](https://gitla.in/nilesrogoff/2bit) project from the command line are slim.
Note that this struggles with images more than a few dozen kilobytes. Even 100 is usually too many. Please be gentle with it.

134
index.html Normal file
View File

@ -0,0 +1,134 @@
<!doctype html>
<html>
<head>
<title>2bit</title>
<style>
.input {
display: inline-block;
padding-left: 100px;
}
</style>
<script>
function loaded() {
setInterval(update, 200);
document.getElementById("submit").disabled = false;
}
function update() {
var out = document.getElementById("out");
var form = window.document.form;
var dither = form.dither;
for (var i = 0; i < dither.length; i++) {
if (dither[i].checked) {
dither = dither[i].value;
break;
}
}
if (dither === "dither-manual") {
dither = form["dither-manual-number"];
}
var nrdither = form.nrdither;
for (var i = 0; i < nrdither.length; i++) {
if (nrdither[i].checked) {
nrdither = nrdither[i].value;
break;
}
}
if (nrdither === "nrdither-manual") {
nrdither = form["nrdither-manual-number"];
}
var bits = form.bits;
for (var i = 0; i < bits.length; i++) {
if (bits[i].checked) {
bits = bits[i].value;
break;
}
}
var percolor = form.percolor[1].checked;
var string = "https://niles.xyz/2bit/out/test8-output-";
if (percolor) {
string = string + "per-color-"
}
if (dither != "dither-none") {
string = string + "dither-";
if (dither == "dither-auto") {
string = string + "auto";
} else {
string = string + dither.value;
}
string = string + "%-";
}
if (nrdither != "nrdither-none") {
string = string + "nonrandom-dither-";
if (nrdither == "nrdither-auto") {
string = string + "auto";
} else {
string = string + nrdither.value;
}
string = string + "pixels-";
}
string = string + bits;
var smallstring = string + "bits-zoom.png"
string = string + "bits.png";
var out = document.getElementById("out");
var small = document.getElementById("small");
if (out.src === string) {
return;
}
out.src = string;
small.src = smallstring;
}
</script>
</head>
<body onload="loaded();">
<form method="post" action="https://niles.xyz:4000/render.pyhtml" enctype="multipart/form-data" name="form">
File: <br />
<div class="input">
<input type="file" name="file" />
</div>
<br />
<br />
Bits:<br />
<div class="input">
<input type="radio" name="bits" value="1" /> 1
<input type="radio" name="bits" value="2" checked="checked" /> 2
<input type="radio" name="bits" value="3" /> 3
<input type="radio" name="bits" value="4" /> 4
<input type="radio" name="bits" value="5" /> 5
<input type="radio" name="bits" value="6" /> 6
<input type="radio" name="bits" value="7" /> 7
<input type="radio" name="bits" value="8" /> 8
<br />
<input type="radio" value="false" name="percolor" checked="checked" /> bits per pixel <br />
<input type="radio" value="true" name="percolor" /> bits per color per pixel
</div>
<br />
<br />
Dither: <br />
<div class="input">
<input type="radio" value="dither-none" name="dither" checked="checked" /> None
<br />
<input type="radio" value="dither-manual" name="dither" /> <input type="text" name="dither-manual-number" value="15" style="width: 1.2em;" /> %
<br />
<input type="radio" value="dither-auto" name="dither" />Auto
</div>
<br />
Non random dither: <br />
<div class="input">
<input type="radio" value="nrdither-none" name="nrdither" checked="checked" /> None
<br />
<input type="radio" value="nrdither-manual" name="nrdither" /> <input value="10" type="text" name="nrdither-manual-number" style="width: 1em;" /> px
<br />
<input type="radio" value="nrdither-auto" name="nrdither" /> Auto
</div>
<br />
<br />
<input id="submit" type="submit" name="submit" value="Render" onclick='this.value = "Please wait, this will take a while"; this.disabled = true' />
</form>
<br />
The only precomputed values for dither and non-random dither are none, 15%, 50% and auto, and none, 7px, 10px and auto respectively
<img src="https://niles.xyz/2bit/test8.png" style="display: inline-block; width: 30%; position: fixed; right: 30%; top: 0px; z-index: -1;">
<img id="out" style="display: inline-block; width: 30%; position: fixed; right: 0px; top: 0px; z-index: -1;">
<img src="https://niles.xyz/2bit/test8-zoom.png" style="display: inline-block; height: 200px; position: fixed; left: 0px; bottom: 0px; z-index: -2;">
<img id="small" style="display: inline-block; height: 200px; position: fixed; left: 700px; bottom: 0px; z-index: -1;">
</body>
</html>

1
render.pyhtml Symbolic link
View File

@ -0,0 +1 @@
/var/www-python/render.pyhtml