From 2afdf0cdbf4902d01a6ea6569ed6c6cd066e2814 Mon Sep 17 00:00:00 2001 From: Suchita Lad Date: Wed, 16 Jul 2025 12:03:19 +0530 Subject: Added flip and mirror icon --- .../SchematicEditor/Helper/ToolbarTools.js | 29 +++++++++++++++++++++- .../components/SchematicEditor/SchematicToolbar.js | 7 ++++++ blocks/eda-frontend/src/utils/GalleryUtils.js | 19 ++++++++++++++ 3 files changed, 54 insertions(+), 1 deletion(-) diff --git a/blocks/eda-frontend/src/components/SchematicEditor/Helper/ToolbarTools.js b/blocks/eda-frontend/src/components/SchematicEditor/Helper/ToolbarTools.js index 73e3a1ac..5db83d44 100644 --- a/blocks/eda-frontend/src/components/SchematicEditor/Helper/ToolbarTools.js +++ b/blocks/eda-frontend/src/components/SchematicEditor/Helper/ToolbarTools.js @@ -5,7 +5,7 @@ import { useSelector } from 'react-redux' import mxGraphFactory from 'mxgraph' -import { styleToObject } from '../../../utils/GalleryUtils' +import { styleToObject, objectToStyle } from '../../../utils/GalleryUtils' import { getPortType, InputPort, OutputPort } from './ComponentDrag' import { portSize, getParameter } from './SvgParser' @@ -111,6 +111,33 @@ export function Rotate () { } } +// vertically +export function Flip () { + const cell = graph.getSelectionCell() + if (cell && cell.CellType === 'Component') { + const model = graph.getModel() + const currentStyle = model.getStyle(cell) || '' + const styleMap = styleToObject(currentStyle) + + styleMap.flip = styleMap.flip === 'true' ? 'false' : 'true' + model.setStyle(cell, objectToStyle(styleMap)) + } +} + +// horizontally +export function Mirror () { + const cell = graph.getSelectionCell() + if (cell && cell.CellType === 'Component') { + const model = graph.getModel() + const currentStyle = model.getStyle(cell) || '' + const styleMap = styleToObject(currentStyle) + + styleMap.mirror = styleMap.mirror === 'true' ? 'false' : 'true' + + model.setStyle(cell, objectToStyle(styleMap)) + } +} + // PRINT PREVIEW OF SCHEMATIC export function PrintPreview () { const title = useSelector(state => state.saveSchematic.title) diff --git a/blocks/eda-frontend/src/components/SchematicEditor/SchematicToolbar.js b/blocks/eda-frontend/src/components/SchematicEditor/SchematicToolbar.js index b992db10..38b1f0f0 100644 --- a/blocks/eda-frontend/src/components/SchematicEditor/SchematicToolbar.js +++ b/blocks/eda-frontend/src/components/SchematicEditor/SchematicToolbar.js @@ -22,8 +22,10 @@ import { } from '@material-ui/core' import { makeStyles } from '@material-ui/core/styles' import AddBoxOutlinedIcon from '@material-ui/icons/AddBoxOutlined' +import ArrowDownwardIcon from '@material-ui/icons/ArrowDownward' import ClearAllIcon from '@material-ui/icons/ClearAll' import CloseIcon from '@material-ui/icons/Close' +import CompareArrowsIcon from '@material-ui/icons/CompareArrows' import CreateNewFolderOutlinedIcon from '@material-ui/icons/CreateNewFolderOutlined' import DeleteIcon from '@material-ui/icons/Delete' import DescriptionIcon from '@material-ui/icons/Description' @@ -64,6 +66,8 @@ import { editorZoomIn, editorZoomOut, renderGalleryXML, + Flip, + Mirror, saveXml } from './Helper/ToolbarTools' import { @@ -512,7 +516,10 @@ export default function SchematicToolbar ({ _mobileClose, gridRef }) { 'pipe', { icon: , label: 'Undo', action: editorUndo }, { icon: , label: 'Redo', action: editorRedo }, + 'pipe', { icon: , label: 'Rotate', action: Rotate }, + { icon: , label: 'Flip', action: Flip }, + { icon: , label: 'Mirror', action: Mirror }, 'pipe', { icon: , label: 'Zoom In', action: editorZoomIn }, { icon: , label: 'Zoom Out', action: editorZoomOut }, diff --git a/blocks/eda-frontend/src/utils/GalleryUtils.js b/blocks/eda-frontend/src/utils/GalleryUtils.js index 7e6a6bf7..32aac61e 100644 --- a/blocks/eda-frontend/src/utils/GalleryUtils.js +++ b/blocks/eda-frontend/src/utils/GalleryUtils.js @@ -176,6 +176,25 @@ export const styleToObject = (style) => { return styleObject } +export const objectToStyle = (styleObject) => { + let style = '' + + for (const key in styleObject) { + if (Object.hasOwnProperty.call(styleObject, key)) { + const value = styleObject[key] + if (value !== undefined && value !== null && value !== '') { + if (key === 'default') { + style += `${value};` + } else { + style += `${key}=${value};` + } + } + } + } + + return style +} + export const saveToFile = (filename, filetype, data) => { const blob = new Blob([data], { type: filetype + ';charset=utf-8' }) saveAs(blob, filename) -- cgit From 1a02da8b8a81b88a6f0f56e5900fa85cc6dda198 Mon Sep 17 00:00:00 2001 From: Suchita Lad Date: Wed, 16 Jul 2025 12:16:01 +0530 Subject: Added objectToStyle function --- blocks/eda-frontend/src/utils/GalleryUtils.js | 20 +++++++------------- 1 file changed, 7 insertions(+), 13 deletions(-) diff --git a/blocks/eda-frontend/src/utils/GalleryUtils.js b/blocks/eda-frontend/src/utils/GalleryUtils.js index 32aac61e..767f4f05 100644 --- a/blocks/eda-frontend/src/utils/GalleryUtils.js +++ b/blocks/eda-frontend/src/utils/GalleryUtils.js @@ -177,21 +177,15 @@ export const styleToObject = (style) => { } export const objectToStyle = (styleObject) => { - let style = '' - - for (const key in styleObject) { - if (Object.hasOwnProperty.call(styleObject, key)) { - const value = styleObject[key] - if (value !== undefined && value !== null && value !== '') { - if (key === 'default') { - style += `${value};` - } else { - style += `${key}=${value};` - } - } + let style = styleObject.default + for (const [key, value] of Object.entries(styleObject)) { + if (key === 'default') { + continue } + if (value !== undefined && value !== null && value !== '') { + style += `;${key}=${value}` + } } - return style } -- cgit From 2f0b4defead36d2e8e7449d4ec788b0457594b48 Mon Sep 17 00:00:00 2001 From: Suchita Lad Date: Wed, 16 Jul 2025 12:34:46 +0530 Subject: Change flip and mirror icon --- .../eda-frontend/src/components/SchematicEditor/SchematicToolbar.js | 3 +-- blocks/eda-frontend/src/utils/GalleryUtils.js | 6 ++---- 2 files changed, 3 insertions(+), 6 deletions(-) diff --git a/blocks/eda-frontend/src/components/SchematicEditor/SchematicToolbar.js b/blocks/eda-frontend/src/components/SchematicEditor/SchematicToolbar.js index 38b1f0f0..b91b43bd 100644 --- a/blocks/eda-frontend/src/components/SchematicEditor/SchematicToolbar.js +++ b/blocks/eda-frontend/src/components/SchematicEditor/SchematicToolbar.js @@ -22,7 +22,6 @@ import { } from '@material-ui/core' import { makeStyles } from '@material-ui/core/styles' import AddBoxOutlinedIcon from '@material-ui/icons/AddBoxOutlined' -import ArrowDownwardIcon from '@material-ui/icons/ArrowDownward' import ClearAllIcon from '@material-ui/icons/ClearAll' import CloseIcon from '@material-ui/icons/Close' import CompareArrowsIcon from '@material-ui/icons/CompareArrows' @@ -518,7 +517,7 @@ export default function SchematicToolbar ({ _mobileClose, gridRef }) { { icon: , label: 'Redo', action: editorRedo }, 'pipe', { icon: , label: 'Rotate', action: Rotate }, - { icon: , label: 'Flip', action: Flip }, + { icon: , label: 'Flip', action: Flip }, { icon: , label: 'Mirror', action: Mirror }, 'pipe', { icon: , label: 'Zoom In', action: editorZoomIn }, diff --git a/blocks/eda-frontend/src/utils/GalleryUtils.js b/blocks/eda-frontend/src/utils/GalleryUtils.js index 767f4f05..37322592 100644 --- a/blocks/eda-frontend/src/utils/GalleryUtils.js +++ b/blocks/eda-frontend/src/utils/GalleryUtils.js @@ -179,12 +179,10 @@ export const styleToObject = (style) => { export const objectToStyle = (styleObject) => { let style = styleObject.default for (const [key, value] of Object.entries(styleObject)) { - if (key === 'default') { + if (key === 'default' || value == null || value === '') { continue } - if (value !== undefined && value !== null && value !== '') { - style += `;${key}=${value}` - } + style += `;${key}=${value}` } return style } -- cgit