Vectorize magnification options
parent
c10a48e6b6
commit
92baef4b72
File diff suppressed because one or more lines are too long
After Width: | Height: | Size: 11 KiB |
|
@ -68,7 +68,7 @@ const ChooserDiv = (
|
||||||
const svg_url = url;
|
const svg_url = url;
|
||||||
const on_zoom_etc = () => {
|
const on_zoom_etc = () => {
|
||||||
const use_svg = (window.devicePixelRatio >= 3 || (window.devicePixelRatio % 1) !== 0) &&
|
const use_svg = (window.devicePixelRatio >= 3 || (window.devicePixelRatio % 1) !== 0) &&
|
||||||
(get_theme() === "classic.css" || get_theme() === "dark.css");
|
(get_theme() === "classic.css" || get_theme() === "dark.css" || (get_theme() === "winter.css" && url.match(/magnification/)));
|
||||||
div.style.backgroundImage = `url(${use_svg ? svg_url : png_url})`;
|
div.style.backgroundImage = `url(${use_svg ? svg_url : png_url})`;
|
||||||
};
|
};
|
||||||
if (div._on_zoom_etc) { // condition is needed, otherwise it will remove all listeners! (leading to only the last graphic being updated when zooming)
|
if (div._on_zoom_etc) { // condition is needed, otherwise it will remove all listeners! (leading to only the last graphic being updated when zooming)
|
||||||
|
@ -302,21 +302,21 @@ const $choose_stroke_size = $Choose(
|
||||||
const magnifications = [1, 2, 6, 8, 10];
|
const magnifications = [1, 2, 6, 8, 10];
|
||||||
const $choose_magnification = $Choose(
|
const $choose_magnification = $Choose(
|
||||||
magnifications,
|
magnifications,
|
||||||
(scale, is_chosen, reuse_canvas) => {
|
(scale, is_chosen, reuse_canvas, reuse_div) => {
|
||||||
const i = magnifications.indexOf(scale);
|
const i = magnifications.indexOf(scale);
|
||||||
const secret = scale === 10; // 10x is secret
|
const secret = scale === 10; // 10x is secret
|
||||||
const chooser_canvas = ChooserCanvas(
|
const chooser_el = ChooserDiv(
|
||||||
"images/options-magnification.png",
|
"images/options-magnification.svg",
|
||||||
is_chosen, // invert if chosen
|
is_chosen, // invert if chosen
|
||||||
39, (secret ? 2 : 13), // width, height of destination canvas
|
39, (secret ? 2 : 13), // width, height of destination canvas
|
||||||
i*23, 0, 23, 9, // x, y, width, height from source image
|
i*23, 0, 23, 9, // x, y, width, height from source image
|
||||||
8, 2, 23, 9, // x, y, width, height on destination
|
8, 2, 23, 9, // x, y, width, height on destination
|
||||||
reuse_canvas,
|
reuse_div,
|
||||||
);
|
);
|
||||||
if(secret){
|
if(secret){
|
||||||
$(chooser_canvas).addClass("secret-option");
|
$(chooser_el).addClass("secret-option");
|
||||||
}
|
}
|
||||||
return chooser_canvas;
|
return chooser_el;
|
||||||
},
|
},
|
||||||
scale => {
|
scale => {
|
||||||
set_magnification(scale);
|
set_magnification(scale);
|
||||||
|
@ -330,7 +330,7 @@ $choose_magnification.on("update", () => {
|
||||||
$choose_magnification
|
$choose_magnification
|
||||||
.find(".secret-option")
|
.find(".secret-option")
|
||||||
.parent()
|
.parent()
|
||||||
.css({position: "absolute", bottom: "-2px", left: 0, opacity: 0});
|
.css({position: "absolute", bottom: "-2px", left: 0, opacity: 0, height: 2, overflow: "hidden" });
|
||||||
});
|
});
|
||||||
|
|
||||||
const airbrush_sizes = [9, 16, 24];
|
const airbrush_sizes = [9, 16, 24];
|
||||||
|
|
Loading…
Reference in New Issue