mirror of
https://github.com/GraphiteEditor/Graphite.git
synced 2026-09-22 09:58:11 +08:00
mfish33andKeavon Chambers
91e4201cb1
* initial layout system with tool options * cargo fmt * cargo fmt again * document bar defined on the backend * cargo fmt * removed RC<RefCell> * cargo fmt * - fix increment behavior - removed hashmap from layout message handler - removed no op message from layoutMessage * cargo fmt * only send documentBar when zoom or rotation is updated * ctrl-0 changes zoom properly * unfinished layer hook in * fix layerData name * layer panel options bar * basic x/y movment * working transform section * changed messages from tuples to structs * hook up text input * - fixed number input to be more clear - fixed actions for properties message handler * Add styling Co-authored-by: Keavon Chambers <keavon@keavon.com>
65 lines
1.5 KiB
Vue
65 lines
1.5 KiB
Vue
<template>
|
|
<LayoutCol class="properties">
|
|
<LayoutRow class="options-bar">
|
|
<WidgetLayout :layout="propertiesOptionsLayout"></WidgetLayout>
|
|
</LayoutRow>
|
|
<LayoutRow class="sections" :scrollableY="true">
|
|
<WidgetLayout :layout="propertiesSectionsLayout"></WidgetLayout>
|
|
</LayoutRow>
|
|
</LayoutCol>
|
|
</template>
|
|
|
|
<style lang="scss">
|
|
.properties {
|
|
height: 100%;
|
|
|
|
.widget-layout {
|
|
flex: 1 1 100%;
|
|
margin: 0 4px;
|
|
}
|
|
|
|
.options-bar {
|
|
height: 32px;
|
|
flex: 0 0 auto;
|
|
}
|
|
|
|
.sections {
|
|
flex: 1 1 100%;
|
|
}
|
|
}
|
|
</style>
|
|
|
|
<script lang="ts">
|
|
import { defineComponent } from "vue";
|
|
|
|
import { defaultWidgetLayout, UpdatePropertyPanelOptionsLayout, UpdatePropertyPanelSectionsLayout } from "@/dispatcher/js-messages";
|
|
|
|
import LayoutCol from "@/components/layout/LayoutCol.vue";
|
|
import LayoutRow from "@/components/layout/LayoutRow.vue";
|
|
|
|
import WidgetLayout from "@/components/widgets/WidgetLayout.vue";
|
|
|
|
export default defineComponent({
|
|
inject: ["editor", "dialog"],
|
|
data() {
|
|
return {
|
|
propertiesOptionsLayout: defaultWidgetLayout(),
|
|
propertiesSectionsLayout: defaultWidgetLayout(),
|
|
};
|
|
},
|
|
mounted() {
|
|
this.editor.dispatcher.subscribeJsMessage(UpdatePropertyPanelOptionsLayout, (updatePropertyPanelOptionsLayout) => {
|
|
this.propertiesOptionsLayout = updatePropertyPanelOptionsLayout;
|
|
});
|
|
this.editor.dispatcher.subscribeJsMessage(UpdatePropertyPanelSectionsLayout, (updatePropertyPanelSectionsLayout) => {
|
|
this.propertiesSectionsLayout = updatePropertyPanelSectionsLayout;
|
|
});
|
|
},
|
|
components: {
|
|
WidgetLayout,
|
|
LayoutRow,
|
|
LayoutCol,
|
|
},
|
|
});
|
|
</script>
|