jess
/
Graphite
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Plumb frontend for layer visibility toggle

This commit is contained in:
Keavon Chambers 2021-05-07 16:57:45 -07:00
parent 14e61d2328
commit 4975a4e737
2 changed files with 12 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
client/web/src/components/panels/LayerTree.vue
View File

@ -9,8 +9,10 @@
<LayoutCol :class="'list'"> <LayoutCol :class="'list'">
<div class="layer-row" v-for="layer in layers" :key="layer.path"> <div class="layer-row" v-for="layer in layers" :key="layer.path">
<div class="layer-visibility"> <div class="layer-visibility">
<IconButton v-if="layer.visible" @click="hideLayer(layer)" :size="24" title="Visible"><EyeVisible /></IconButton> <IconButton @click="toggleLayerVisibility(layer)" :size="24" title="layer.visible ? 'Visible' : 'Hidden">
<IconButton v-if="!layer.visible" @click="showLayer(layer)" :size="24" title="Hidden"><EyeHidden /></IconButton> <EyeVisible v-if="layer.visible" />
<EyeHidden v-if="!layer.visible" />
</IconButton>
</div> </div>
<div class="layer"> <div class="layer">
<div class="layer-thumbnail"></div> <div class="layer-thumbnail"></div>
@ -82,6 +84,8 @@ import EyeVisible from "../../../assets/svg/24x24-bounds-16x16-icon/visibility-e
import EyeHidden from "../../../assets/svg/24x24-bounds-16x16-icon/visibility-eye-hidden.svg"; import EyeHidden from "../../../assets/svg/24x24-bounds-16x16-icon/visibility-eye-hidden.svg";
import NodeTypePath from "../../../assets/svg/24x24-node-type-icon/node-type-path.svg"; import NodeTypePath from "../../../assets/svg/24x24-node-type-icon/node-type-path.svg";
const wasm = import("../../../wasm/pkg");
export default defineComponent({ export default defineComponent({
components: { components: {
LayoutRow, LayoutRow,
@ -96,21 +100,9 @@ export default defineComponent({
}, },
props: {}, props: {},
methods: { methods: {
hideLayer(layerId: LayerPanelEntry) { async toggleLayerVisibility(path: BigUint64Array) {
const layer = layerId as LayerPanelEntry; const { toggle_layer_visibility } = await wasm;
if (layer) { toggle_layer_visibility(path);
console.log(`Hidden layer ID: ${layer.path}`);
} else {
console.error("hideLayer did not receive valid arguments");
}
},
showLayer(layerId: LayerPanelEntry) {
const layer = layerId as LayerPanelEntry;
if (layer) {
console.log(`Shown layer: ${layer.path}`);
} else {
console.error("showLayer did not receive valid arguments");
}
}, },
}, },
mounted() { mounted() {

3
core/editor/src/dispatcher/mod.rs
View File

@ -36,6 +36,9 @@ impl Dispatcher {
Event::MouseMove(pos) => { Event::MouseMove(pos) => {
editor_state.tool_state.document_tool_data.mouse_state.position = *pos; editor_state.tool_state.document_tool_data.mouse_state.position = *pos;
} }
Event::ToggleLayerVisibility(path) => {
log::debug!("Toggling layer visibility not yet implemented in the Editor Library");
}
Event::KeyUp(_key) => (), Event::KeyUp(_key) => (),
Event::KeyDown(key) => { Event::KeyDown(key) => {
log::trace!("pressed key {:?}", key); log::trace!("pressed key {:?}", key);