adds stamp mirror option (button and '=' shortcut)

Signed-off-by: Victor Seiji Hariki <victorseijih@gmail.com>
This commit is contained in:
Victor Seiji Hariki 2023-02-15 00:37:06 -03:00
parent 45f4412ab8
commit 77a6137855
4 changed files with 53 additions and 5 deletions

View file

@ -46,6 +46,12 @@
mask-image: url("../res/icons/file-plus.svg"); mask-image: url("../res/icons/file-plus.svg");
} }
.ui.inline-icon.icon-flip-horizontal::after,
.ui.icon > .icon-flip-horizontal {
-webkit-mask-image: url("../res/icons/flip-horizontal.svg");
mask-image: url("../res/icons/flip-horizontal.svg");
}
.ui.icon > .icon-file-x { .ui.icon > .icon-file-x {
-webkit-mask-image: url("../res/icons/file-x.svg"); -webkit-mask-image: url("../res/icons/file-x.svg");
mask-image: url("../res/icons/file-x.svg"); mask-image: url("../res/icons/file-x.svg");

View file

@ -173,7 +173,16 @@ const _toolbar_input = {
label.appendChild(checkbox); label.appendChild(checkbox);
label.appendChild(new Text(text)); label.appendChild(new Text(text));
return {checkbox, label}; return {
checkbox,
label,
setValue(v) {
checkbox.checked = v;
state[dataKey] = checkbox.checked;
cb && cb();
return checkbox.checked;
},
};
}, },
slider: (state, dataKey, text, options = {}) => { slider: (state, dataKey, text, options = {}) => {

View file

@ -57,6 +57,7 @@ const stampTool = () =>
mouse.listen.world.btn.left.ondragend.on(state.dragendcb); mouse.listen.world.btn.left.ondragend.on(state.dragendcb);
mouse.listen.world.onwheel.on(state.onwheelcb); mouse.listen.world.onwheel.on(state.onwheelcb);
keyboard.onShortcut({key: "Equal"}, state.togglemirror);
// For calls from other tools to paste image // For calls from other tools to paste image
if (opt && opt.image) { if (opt && opt.image) {
@ -90,6 +91,7 @@ const stampTool = () =>
mouse.listen.world.btn.left.ondragend.clear(state.dragendcb); mouse.listen.world.btn.left.ondragend.clear(state.dragendcb);
mouse.listen.world.onwheel.clear(state.onwheelcb); mouse.listen.world.onwheel.clear(state.onwheelcb);
keyboard.deleteShortcut(state.togglemirror, "Delete");
ovLayer.clear(); ovLayer.clear();
}, },
@ -110,11 +112,18 @@ const stampTool = () =>
// Current Scale // Current Scale
state.scale = 1; state.scale = 1;
state.togglemirror = () => {
state.mirrorSetValue(!state.mirrorStamp);
state.redraw();
};
state.selectResource = (resource, nolock = true, deselect = true) => { state.selectResource = (resource, nolock = true, deselect = true) => {
rotation = 0; rotation = 0;
state.setScale(1); state.setScale(1);
if (nolock && state.ctxmenu.uploadButton.disabled) return; if (nolock && state.ctxmenu.uploadButton.disabled) return;
state.mirrorSetValue(false);
console.debug( console.debug(
`[stamp] Selecting Resource '${resource && resource.name}'[${ `[stamp] Selecting Resource '${resource && resource.name}'[${
resource && resource.id resource && resource.id
@ -394,8 +403,11 @@ const stampTool = () =>
if (state.selected) { if (state.selected) {
ovCtx.save(); ovCtx.save();
ovCtx.translate(px, py); ovCtx.translate(px, py);
ovCtx.scale(state.scale, state.scale); ovCtx.scale(
ovCtx.rotate(rotation); state.scale * (state.mirrorStamp ? -1 : 1),
state.scale
);
ovCtx.rotate(rotation * (state.mirrorStamp ? -1 : 1));
ovCtx.drawImage(state.selected.image, 0, 0); ovCtx.drawImage(state.selected.image, 0, 0);
ovCtx.restore(); ovCtx.restore();
@ -488,7 +500,19 @@ const stampTool = () =>
"icon-grid" "icon-grid"
).checkbox ).checkbox
); );
state.ctxmenu.snapToGridLabel = array;
// Mirror Stamp Checkbox
const {checkbox: mirrorCheckbox, setValue: mirrorSetValue} =
_toolbar_input.checkbox(
state,
"mirrorStamp",
"Mirror Stamp",
"icon-flip-horizontal"
);
array.appendChild(mirrorCheckbox);
state.mirrorSetValue = mirrorSetValue;
state.ctxmenu.buttonArray = array;
// Scale Slider // Scale Slider
const scaleSlider = _toolbar_input.slider(state, "scale", "Scale", { const scaleSlider = _toolbar_input.slider(state, "scale", "Scale", {
@ -624,7 +648,7 @@ const stampTool = () =>
} }
}, },
populateContextMenu: (menu, state) => { populateContextMenu: (menu, state) => {
menu.appendChild(state.ctxmenu.snapToGridLabel); menu.appendChild(state.ctxmenu.buttonArray);
menu.appendChild(state.ctxmenu.scaleSlider); menu.appendChild(state.ctxmenu.scaleSlider);
menu.appendChild(state.ctxmenu.resourceManager); menu.appendChild(state.ctxmenu.resourceManager);
}, },

View file

@ -0,0 +1,9 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="M8 3H5a2 2 0 0 0-2 2v14c0 1.1.9 2 2 2h3"></path>
<path d="M16 3h3a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2h-3"></path>
<path d="M12 20v2"></path>
<path d="M12 14v2"></path>
<path d="M12 8v2"></path>
<path d="M12 2v2"></path>
</svg>

After

Width:  |  Height:  |  Size: 425 B