another attempt to make download
This commit is contained in:
parent
53f84b5d08
commit
9745030288
13
main.js
13
main.js
@ -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) {
|
||||||
@ -107,10 +109,3 @@ function adjustButtons(width) {
|
|||||||
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;
|
|
||||||
}
|
|
@ -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
13
ui/button.js
@ -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);
|
||||||
|
Loading…
Reference in New Issue
Block a user