fork/Graphite
1
0
Fork 0
mirror of https://github.com/GraphiteEditor/Graphite.git synced 2026-09-30 12:18:12 +08:00
Code Issues Packages Projects Releases Wiki Activity

Blend modes (#252)

Browse Source 
* Add backend for selecting layer blend mode

* Change dropdown input to support callback on change

* Add debug messages

* Fix canvas update for blend-modes

* Finish up and polish blend modes implementations

* Add changes from code review

Co-authored-by: Keavon Chambers <keavon@keavon.com>
Co-authored-by: Dennis Kobert <dennis@kobert.dev>
This commit is contained in:
George Atkinson
2021-07-23 10:21:07 -07:00
committed by GitHub
co-authored by Keavon Chambers Dennis Kobert
parent 63e3b5c604
commit 8f9168bfe5
18 changed files with 348 additions and 69 deletions
Download Patch File Download Diff File Expand all files Collapse all files
client/web/src/components/panels/Document.vue
+6 -5
View File
@@ -2,7 +2,7 @@
<LayoutCol :class="'document'">
<LayoutRow :class="'options-bar'">
<div class="left side">
<DropdownInput :menuEntries="modeMenuEntries" :default="modeMenuEntries[0][0]" :drawIcon="true" />
<DropdownInput :menuEntries="documentModeEntries" v-model:selectedIndex="documentModeSelectionIndex" :drawIcon="true" />
<Separator :type="SeparatorType.Section" />
@@ -104,11 +104,11 @@
</LayoutCol>
<LayoutCol :class="'viewport'">
<LayoutRow :class="'bar-area'">
<CanvasRuler :origin="0" :majorMarkSpacing="75" :direction="RulerDirection.Horizontal" :class="'top-ruler'" />
<CanvasRuler :origin="0" :majorMarkSpacing="100" :direction="RulerDirection.Horizontal" :class="'top-ruler'" />
</LayoutRow>
<LayoutRow :class="'canvas-area'">
<LayoutCol :class="'bar-area'">
<CanvasRuler :origin="0" :majorMarkSpacing="75" :direction="RulerDirection.Vertical" />
<CanvasRuler :origin="0" :majorMarkSpacing="100" :direction="RulerDirection.Vertical" />
</LayoutCol>
<LayoutCol :class="'canvas-area'">
<div class="canvas" @mousedown="canvasMouseDown" @mouseup="canvasMouseUp" @mousemove="canvasMouseMove" ref="canvas">
@@ -216,7 +216,7 @@ import OptionalInput from "@/components/widgets/inputs/OptionalInput.vue";
import ToolOptions from "@/components/widgets/options/ToolOptions.vue";
import { SectionsOfMenuListEntries } from "@/components/widgets/floating-menus/MenuList.vue";
const modeMenuEntries: SectionsOfMenuListEntries = [
const documentModeEntries: SectionsOfMenuListEntries = [
[
{ label: "Design Mode", icon: "ViewportDesignMode" },
{ label: "Select Mode", icon: "ViewportSelectMode" },
@@ -334,7 +334,8 @@ export default defineComponent({
return {
viewportSvg: "",
activeTool: "Select",
modeMenuEntries,
documentModeEntries,
documentModeSelectionIndex: 0,
viewModeIndex: 0,
snappingEnabled: true,
gridEnabled: true,