From 37654d5b8d433a5de95efb8d6e5e2dad5ef13370 Mon Sep 17 00:00:00 2001 From: Thomlam Date: Fri, 9 Jun 2023 07:59:29 +0200 Subject: [PATCH 1/2] Feature(Editor) --- back-end/package-lock.json | 7 +- .../components/agility/UI/TextAreaEditor.vue | 160 ++++++++---------- .../src/components/agility/UI/ToolsEditor.vue | 4 +- .../components/retrospective/CreateRetro.vue | 2 +- .../src/lib/pixi-tools-v2/types/pixi-enums.ts | 1 - 5 files changed, 79 insertions(+), 95 deletions(-) diff --git a/back-end/package-lock.json b/back-end/package-lock.json index 43fbfd36d..68a4f7dcf 100644 --- a/back-end/package-lock.json +++ b/back-end/package-lock.json @@ -3498,7 +3498,6 @@ "version": "1.0.30001495", "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001495.tgz", "integrity": "sha512-F6x5IEuigtUfU5ZMQK2jsy5JqUUlEFRVZq8bO2a+ysq5K7jD6PPc9YXZj78xDNS3uNchesp1Jw47YXEqr+Viyg==", - "dev": true, "funding": [ { "type": "opencollective", @@ -4209,8 +4208,7 @@ "node_modules/electron-to-chromium": { "version": "1.4.425", "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.425.tgz", - "integrity": "sha512-wv1NufHxu11zfDbY4fglYQApMswleE9FL/DSeyOyauVXDZ+Kco96JK/tPfBUaDqfRarYp2WH2hJ/5UnVywp9Jg==", - "dev": true + "integrity": "sha512-wv1NufHxu11zfDbY4fglYQApMswleE9FL/DSeyOyauVXDZ+Kco96JK/tPfBUaDqfRarYp2WH2hJ/5UnVywp9Jg==" }, "node_modules/emittery": { "version": "0.13.1", @@ -6937,7 +6935,6 @@ "version": "3.5.3", "resolved": "https://registry.npmjs.org/memfs/-/memfs-3.5.3.tgz", "integrity": "sha512-UERzLsxzllchadvbPs5aolHh65ISpKpM+ccLbOJ8/vvpBKmAWf+la7dXFy7Mr0ySHbdHrFv5kGFCUHHe6GFEmw==", - "dev": true, "dependencies": { "fs-monkey": "^1.0.4" }, @@ -8515,7 +8512,6 @@ "version": "3.2.0", "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-3.2.0.tgz", "integrity": "sha512-0zTyLGyDJYd/MBxG1AhJkKa6fpEBds4OQO2ut0w7OYG+ZGhGea09lijvzsqegYSik88zc7cUtIlnnO+/BvD6gQ==", - "dev": true, "dependencies": { "@types/json-schema": "^7.0.8", "ajv": "^6.12.5", @@ -10096,7 +10092,6 @@ "version": "5.86.0", "resolved": "https://registry.npmjs.org/webpack/-/webpack-5.86.0.tgz", "integrity": "sha512-3BOvworZ8SO/D4GVP+GoRC3fVeg5MO4vzmq8TJJEkdmopxyazGDxN8ClqN12uzrZW9Tv8EED8v5VSb6Sqyi0pg==", - "dev": true, "peer": true, "dependencies": { "@types/eslint-scope": "^3.7.3", diff --git a/front-end/src/components/agility/UI/TextAreaEditor.vue b/front-end/src/components/agility/UI/TextAreaEditor.vue index b32185cf7..1eca51e2f 100644 --- a/front-end/src/components/agility/UI/TextAreaEditor.vue +++ b/front-end/src/components/agility/UI/TextAreaEditor.vue @@ -1,5 +1,72 @@ + + - - diff --git a/front-end/src/components/agility/UI/ToolsEditor.vue b/front-end/src/components/agility/UI/ToolsEditor.vue index aebe5befd..a02a36be6 100644 --- a/front-end/src/components/agility/UI/ToolsEditor.vue +++ b/front-end/src/components/agility/UI/ToolsEditor.vue @@ -10,7 +10,7 @@ background="gradiant" class="h-9" > - +
@@ -171,6 +171,7 @@ +
@@ -195,6 +196,7 @@ import { useProjectStore } from '@/store/modules/project.store'; import { type MenuOptions, ContextMenu, ContextMenuItem } from '@imengyu/vue3-context-menu'; import { DownloadType, LiteralGeometryTypes } from '@/lib/pixi-tools-v2/types/pixi-enums'; +import TextAreaEditor from '@/components/agility/UI/TextAreaEditor.vue'; import BlueprintModal from '@/components/agility/modals/Blueprint.vue'; import ColorPickerOption from '@/components/agility/UI/ColorPickerOption.vue'; import ShareProject from '@/components/agility/UI/ShareProject.vue'; diff --git a/front-end/src/components/retrospective/CreateRetro.vue b/front-end/src/components/retrospective/CreateRetro.vue index 647a91a69..5899435fd 100644 --- a/front-end/src/components/retrospective/CreateRetro.vue +++ b/front-end/src/components/retrospective/CreateRetro.vue @@ -62,7 +62,7 @@ export default defineComponent({ // Utiliser une fonction fléchée try { const response = await http.get(`/calls/is_product_owner/`); - // TODO: Ici, il faut définir la valeur de isPO + // TODO: Kevin - Ici, il faut définir la valeur de isPO (Kevin met en anglais ton commentaire sinon baston) // this.isPO = response.data.isPO; isPO.value = true; } catch (error) { diff --git a/front-end/src/lib/pixi-tools-v2/types/pixi-enums.ts b/front-end/src/lib/pixi-tools-v2/types/pixi-enums.ts index 23c449f6a..06b940df6 100644 --- a/front-end/src/lib/pixi-tools-v2/types/pixi-enums.ts +++ b/front-end/src/lib/pixi-tools-v2/types/pixi-enums.ts @@ -13,7 +13,6 @@ import { } from '../model/template'; export const GeometryTypes = { - //TODO Mettre les objet à la place via constructeur - Thomas rectangle: Rectangle, circle: Circle, From a51c8ce019a8668e78ddfb4eb036e96535685b68 Mon Sep 17 00:00:00 2001 From: Thomlam Date: Thu, 15 Jun 2023 18:17:59 +0200 Subject: [PATCH 2/2] feature(AddMoreActionClick) : Add finaly action click for toggle oblique, Italic and more --- .../components/agility/UI/TextAreaEditor.vue | 88 ++++++++++++++++--- 1 file changed, 75 insertions(+), 13 deletions(-) diff --git a/front-end/src/components/agility/UI/TextAreaEditor.vue b/front-end/src/components/agility/UI/TextAreaEditor.vue index 1eca51e2f..cab4664c5 100644 --- a/front-end/src/components/agility/UI/TextAreaEditor.vue +++ b/front-end/src/components/agility/UI/TextAreaEditor.vue @@ -21,18 +21,11 @@ Italic -
@@ -42,13 +35,21 @@ +
+
+ +
@@ -76,7 +77,16 @@ import { TextContainer } from '@/lib/pixi-tools-v2/class/textContainer'; const isTextAreaEdited = ref(false); +const isBold = ref(false); +const isItalic = ref(false); +const isOblique = ref(false); + + const projectStore = useProjectStore(); +const selectedContainers = computed(() => projectStore.getSelected); +const fontFamily = ref('Arial'); +const fontAlignment = ref('left'); +const fontSize = ref('12'); const toggleTextAreaEditor = () => { @@ -87,4 +97,56 @@ const toggleTextAreaEditor = () => { watch(isTextAreaEdited, (val) => { projectStore.scene.viewport.manager.isEditingContainerProperties = val; }) + +const toggleItalic = () => { + isItalic.value = !isItalic.value; + const ctn = selectedContainers.value[0] + if (ctn instanceof TextContainer && isItalic) { + ctn.textGraphic.textSprite.fontStyle = "italic"; + } + else ctn.textGraphic.textSprite.fontStyle = "normal"; +} +const toggleBold = () => { + isBold.value = !isBold.value; + const ctn = selectedContainers.value[0] + if (ctn instanceof TextContainer && isBold) { + ctn.textGraphic.textSprite.fontWeight = "bold"; + } + else if (ctn instanceof TextContainer) ctn.textGraphic.textSprite.fontWeight = "bold"; + else return; + projectStore.scene.viewport.socketPlugin.emit( + 'ws-text-updated', + ctn.uuid, + ctn.serializeData() + ) +} +const toggleOblique= () => { + isOblique.value = !isOblique.value; + const ctn = selectedContainers.value[0] + if (ctn instanceof TextContainer && isOblique) { + ctn.textGraphic.textSprite.fontStyle = "oblique"; + + + } + else if (ctn instanceof TextContainer) ctn.textGraphic.textSprite.fontStyle = "normal"; + else return; + projectStore.scene.viewport.socketPlugin.emit( + 'ws-text-updated', + ctn.uuid, + ctn.serializeData() + ) +} + + + + + +const GetTextArea = ()=> { + const ctn = selectedContainers.value[0] + if (ctn instanceof TextContainer) { + } + if(parent instanceof TextContainer){ + + } +}