diff --git a/index.html b/index.html index ce7eaa7..240a133 100644 --- a/index.html +++ b/index.html @@ -23,7 +23,21 @@
-
+
+ + + +
stats
diff --git a/neomojimixer.css b/neomojimixer.css index 39862d5..558890e 100644 --- a/neomojimixer.css +++ b/neomojimixer.css @@ -34,16 +34,33 @@ img.arms { width: 256px; } +input, button, select { + box-sizing: border-box; +} + button { width: 25px; height: 25px; } -button#random { - width: 250px; +input[type="checkbox"] { + margin: 4px; + width: 17px; + height: 17px; } -button#export { +.export > label { + display: block; + width: 250px; + clear: both; +} + +.export > label > input:not([type="checkbox"]) { + width: 125px; + float: right; +} + +button#random, button#export { width: 250px; } diff --git a/neomojimixer.js b/neomojimixer.js index 6a50a50..a38ad3e 100644 --- a/neomojimixer.js +++ b/neomojimixer.js @@ -251,6 +251,11 @@ const NeomojiMixer = (function(NeomojiMixer) { function exportImage() { //Export image so it can be saved as one PNG let ctx=canvas.getContext("2d"); + let export_mime = document.getElementById("export-mime").value; + let export_options = undefined; + if (document.getElementById("export-quality-enabled").checked) { + export_options = +document.getElementById("export-quality").value; + } ctx.clearRect(0, 0, canvas.width, canvas.height); @@ -274,7 +279,7 @@ const NeomojiMixer = (function(NeomojiMixer) { export_layers.shift() ctx.drawImage(layer, 0, 0, 256, 256); } - let img = canvas.toDataURL("image/png"); + let img = canvas.toDataURL(export_mime, export_options); export_img.src = img; }