blue/fantasy
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

another attempt to make download

Browse Source
This commit is contained in:
Blue 2018-11-20 18:23:43 +03:00
parent 53f84b5d08
commit 9745030288
3 changed files with 17 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
main.js
View File

@ -31,8 +31,8 @@ settings.addHandler(panel.toggle.bind(panel));
let clear = new Button("blank"); let clear = new Button("blank");
clear.addHandler(canvas.clear.bind(canvas)); clear.addHandler(canvas.clear.bind(canvas));
let downloadButton = new Button("download"); let downloadButton = new Button("download", true);
downloadButton.addHandler(download); downloadButton.element.download = "fantasy.png";
window.addEventListener("resize", onWindowResize, false); window.addEventListener("resize", onWindowResize, false);
@ -95,6 +95,8 @@ function paint() {
let shape = factory.createRandomShape(); let shape = factory.createRandomShape();
canvas.draw(shape); canvas.draw(shape);
} }
downloadButton.element.href = canvas.getData();
} }
function adjustButtons(width) { function adjustButtons(width) {
@ -106,11 +108,4 @@ function adjustButtons(width) {
settings.setPosition(c + hc + ws, 25); settings.setPosition(c + hc + ws, 25);
clear.setPosition(2 * c + hc + ws, 25); clear.setPosition(2 * c + hc + ws, 25);
downloadButton.setPosition(3 * c + hc + ws, 25); downloadButton.setPosition(3 * c + hc + ws, 25);
}
function download() {
let data = canvas.getData();
let prev = window.location.href;
window.location.href = data.replace("image/png", "image/octet-stream");
window.location.href = prev;
} }

4
style.css
View File

@ -9,7 +9,7 @@ body {
box-sizing: border-box; box-sizing: border-box;
} }
button { .button {
z-index: 2; z-index: 2;
overflow: hidden; overflow: hidden;
background-color: #00b6ff; background-color: #00b6ff;
@ -28,7 +28,7 @@ button {
transition: background-color 0.2s; transition: background-color 0.2s;
} }
button:hover { .button:hover {
background-color: #2eceff; background-color: #2eceff;
} }

13
ui/button.js
View File

@ -1,10 +1,19 @@
import UI from "./ui.js"; import UI from "./ui.js";
class Button extends UI { class Button extends UI {
constructor(image) { constructor(image, isRef) {
super(document.createElement("button"), Button.width, Button.height); isRef = isRef !== false;
let element;
if (isRef) {
element = document.createElement("a");
element.href = "#";
} else {
element = document.createElement("button");
}
super(element, Button.width, Button.height);
this.element.classList.add("shadow"); this.element.classList.add("shadow");
this.element.classList.add("button");
this.element.style.backgroundImage = "url(images/" + image + ".svg)"; this.element.style.backgroundImage = "url(images/" + image + ".svg)";
this._boundClick = this._onClick.bind(this); this._boundClick = this._onClick.bind(this);
this.element.addEventListener("click", this._boundClick, false); this.element.addEventListener("click", this._boundClick, false);