fix attribute of data

remove unused parameters

7 files changed, 282 insertions, 283 deletions

diff --git a/blocks/eda-frontend/src/components/SchematicEditor/Helper/ComponentDrag.js b/blocks/eda-frontend/src/components/SchematicEditor/Helper/ComponentDrag.js
index 97f07e59..61d22b5f 100644
--- a/blocks/eda-frontend/src/components/SchematicEditor/Helper/ComponentDrag.js
+++ b/blocks/eda-frontend/src/components/SchematicEditor/Helper/ComponentDrag.js
@@ -231,7 +231,7 @@ export default function LoadGrid (container, sidebar, outline) {
       return null
     }
 
-    graph.addEdge = function (edge, parent, source, target, index) {
+    graph.addEdge = function (_edge, _parent, source, target) {
       if (source == null || target == null) {
         return null
       }
@@ -362,7 +362,7 @@ export default function LoadGrid (container, sidebar, outline) {
 
       // White in-place editor text color
       const mxCellEditorStartEditing = mxCellEditor.prototype.startEditing
-      mxCellEditor.prototype.startEditing = function (cell, trigger) {
+      mxCellEditor.prototype.startEditing = function () {
         mxCellEditorStartEditing.apply(this, arguments)
 
         if (this.textarea != null) {
@@ -584,7 +584,7 @@ export default function LoadGrid (container, sidebar, outline) {
   }
 
   // Updates the terminal and control points in the cloned preview.
-  mxEdgeSegmentHandler.prototype.clonePreviewState = function (point, terminal) {
+  mxEdgeSegmentHandler.prototype.clonePreviewState = function (point) {
     const clone = mxEdgeHandler.prototype.clonePreviewState.apply(this, arguments)
     clone.cell = clone.cell.clone()
 
@@ -604,7 +604,7 @@ export default function LoadGrid (container, sidebar, outline) {
   }
 
   const mxEdgeHandlerConnect = mxEdgeHandler.prototype.connect
-  mxEdgeHandler.prototype.connect = function (edge, terminal, isSource, isClone, me) {
+  mxEdgeHandler.prototype.connect = function (edge, terminal, isSource) {
     let result = null
     const model = this.graph.getModel()
 
@@ -649,7 +649,7 @@ export default function LoadGrid (container, sidebar, outline) {
     const marker = mxConnectionHandlerCreateMarker.apply(this, arguments)
 
     // Uses complete area of cell for new connections (no hotspot)
-    marker.intersects = function (state, evt) {
+    marker.intersects = function () {
       return true
     }
 
diff --git a/blocks/eda-frontend/src/components/SchematicEditor/Helper/KeyboardShortcuts.js b/blocks/eda-frontend/src/components/SchematicEditor/Helper/KeyboardShortcuts.js
index a0750b6b..06affdbe 100644
--- a/blocks/eda-frontend/src/components/SchematicEditor/Helper/KeyboardShortcuts.js
+++ b/blocks/eda-frontend/src/components/SchematicEditor/Helper/KeyboardShortcuts.js
@@ -29,35 +29,35 @@ export default function keyboardShortcuts (graph) {
   // })
 
   // Undo - Ctrl + Z
-  keyHandler.bindControlKey(90, function (evt) {
+  keyHandler.bindControlKey(90, function () {
     if (graph.isEnabled()) {
       editorUndo()
     }
   })
 
   // Redo - Ctrl + A
-  keyHandler.bindControlKey(65, function (evt) {
+  keyHandler.bindControlKey(65, function () {
     if (graph.isEnabled()) {
       editorRedo()
     }
   })
 
   // Zoom In - Ctrl + I
-  keyHandler.bindControlKey(73, function (evt) {
+  keyHandler.bindControlKey(73, function () {
     if (graph.isEnabled()) {
       editorZoomIn()
     }
   })
 
   // Zoom Out - Ctrl + O
-  keyHandler.bindControlKey(79, function (evt) {
+  keyHandler.bindControlKey(79, function () {
     if (graph.isEnabled()) {
       editorZoomOut()
     }
   })
 
   // Zoom Out - Ctrl + Y
-  keyHandler.bindControlKey(89, function (evt) {
+  keyHandler.bindControlKey(89, function () {
     if (graph.isEnabled()) {
       editorZoomAct()
     }
diff --git a/blocks/eda-frontend/src/components/SchematicEditor/Helper/ToolbarTools.js b/blocks/eda-frontend/src/components/SchematicEditor/Helper/ToolbarTools.js
index d21b55ce..e898e720 100644
--- a/blocks/eda-frontend/src/components/SchematicEditor/Helper/ToolbarTools.js
+++ b/blocks/eda-frontend/src/components/SchematicEditor/Helper/ToolbarTools.js
@@ -21,7 +21,7 @@ const {
   mxPoint
 } = new mxGraphFactory()
 
-export default function toolbarTools (grid, unredo) {
+export default function toolbarTools (grid) {
   graph = grid
 
   undoManager = new mxUndoManager()
diff --git a/blocks/eda-frontend/src/redux/actions/authActions.js b/blocks/eda-frontend/src/redux/actions/authActions.js
index 7fff2eb9..19e22808 100644
--- a/blocks/eda-frontend/src/redux/actions/authActions.js
+++ b/blocks/eda-frontend/src/redux/actions/authActions.js
@@ -109,7 +109,7 @@ export const login = (email, password, toUrl) => {
 }
 
 // Handle api call for user sign up
-export const signUp = (email, password, reenterPassword, history) => (dispatch) => {
+export const signUp = (email, password, reenterPassword) => (dispatch) => {
   const body = {
     email,
     username: email,
@@ -133,7 +133,6 @@ export const signUp = (email, password, reenterPassword, history) => (dispatch)
             data: 'Successfully Signed Up! A verification link has been sent to your email account.'
           }
         })
-        // history.push('/login')
       }
     })
     .catch((err) => {
@@ -229,7 +228,7 @@ const signUpError = (message) => (dispatch) => {
 }
 
 // Api call for Google oAuth login or sign up
-export const googleLogin = (host, toUrl) => {
+export const googleLogin = (host) => {
   return function (dispatch) {
     api.get('auth/o/google-oauth2/?redirect_uri=' + host + '/api/auth/google-callback')
       .then((res) => {
@@ -253,7 +252,7 @@ export const googleLogin = (host, toUrl) => {
 }
 
 // Api call for GitHub OAuth login or sign up
-export const githubLogin = (host, toUrl) => {
+export const githubLogin = (host) => {
   return function (dispatch) {
     api.get('auth/o/github/?redirect_uri=' + host + '/api/auth/github-callback')
       .then((res) => {
diff --git a/blocks/eda-frontend/src/redux/actions/saveSchematicActions.js b/blocks/eda-frontend/src/redux/actions/saveSchematicActions.js
index 3003ea35..53c67034 100644
--- a/blocks/eda-frontend/src/redux/actions/saveSchematicActions.js
+++ b/blocks/eda-frontend/src/redux/actions/saveSchematicActions.js
@@ -165,7 +165,7 @@ export const setSchShared = (share) => (dispatch, getState) => {
 }
 
 // Action for Loading Gallery schematics
-export const loadGallery = (saveId) => (dispatch, getState) => {
+export const loadGallery = (saveId) => (dispatch) => {
   // Find the gallery schematic that matches the given save_id
   const data = GallerySchSample.find(sample => sample.save_id === saveId)
 
@@ -201,14 +201,14 @@ export const loadGallery = (saveId) => (dispatch, getState) => {
       console.error('Error converting xcos to xml:', error)
     })
   } else {
-    handleGalleryLoad(dispatch, data, data.dataDump)
+    handleGalleryLoad(dispatch, data, data.data_dump)
     dispatch(setLoadingDiagram(false))
   }
   window.loadGalleryComplete = true
 }
 
 // Action for Loading local exported schematics
-export const openLocalSch = (obj) => (dispatch, getState) => {
+export const openLocalSch = (obj) => (dispatch) => {
   const data = obj
 
   dispatch({ type: actions.CLEAR_DETAILS })
diff --git a/blocks/eda-frontend/src/utils/Sigbuilder-graph.js b/blocks/eda-frontend/src/utils/Sigbuilder-graph.js
index e8524726..91c2e2e6 100644
--- a/blocks/eda-frontend/src/utils/Sigbuilder-graph.js
+++ b/blocks/eda-frontend/src/utils/Sigbuilder-graph.js
@@ -3,7 +3,7 @@ import Highcharts from 'highcharts'
 import { getmethod, showModalWindow } from './dependencies'
 
 const {
-    mxEvent
+  mxEvent
 } = new mxGraphFactory()
 
 export const graphSigbuilder = ""
@@ -13,114 +13,114 @@ let wind = ""
 
 // Function to create a chart with responsive points for Sigbuilder
 function createDraggablePointsChartSigbuilder (graphParameters, pointsHistory, xmin, xmax, ymin, ymax, chartType, points, method, xmaxtitle, step, stepname) {
-    graphParameters.mtd = method
-    const subtitle = updateSubtitleForSigbuilderGraph(points, graphParameters.mtd, xmaxtitle, graphParameters.PeriodicOption)
-    pointsHistory.push(graphParameters.graphPoints.slice())
+  graphParameters.mtd = method
+  const subtitle = updateSubtitleForSigbuilderGraph(points, graphParameters.mtd, xmaxtitle, graphParameters.PeriodicOption)
+  pointsHistory.push(graphParameters.graphPoints.slice())
 
-    sigbuilderGraph = Highcharts.chart('drag_sig_chart', {
-        chart: {
-            type: chartType,
-            animation: false,
-            events: {
-                click: function (e) {
-                    const xValue = e.xAxis[0].value
-                    const yValue = e.yAxis[0].value
-                    addPointsOnChart(graphParameters, pointsHistory, xValue, yValue)
-                }
-            }
-        },
-        tooltip: {
-            enabled: false
-        },
-        title: {
-            text: ""
-        },
-        subtitle: {
-            text: subtitle
-        },
+  sigbuilderGraph = Highcharts.chart('drag_sig_chart', {
+    chart: {
+      type: chartType,
+      animation: false,
+      events: {
+        click: function (e) {
+          const xValue = e.xAxis[0].value
+          const yValue = e.yAxis[0].value
+          addPointsOnChart(graphParameters, pointsHistory, xValue, yValue)
+        }
+      }
+    },
+    tooltip: {
+      enabled: false
+    },
+    title: {
+      text: ""
+    },
+    subtitle: {
+      text: subtitle
+    },
 
-        yAxis: {
-            title: {
-                text: 'Output'
-            },
-            min: parseFloat(ymin),
-            max: parseFloat(ymax),
-            gridLineWidth: 1,
-            gridLineDashStyle: 'dash'
-        },
+    yAxis: {
+      title: {
+        text: 'Output'
+      },
+      min: parseFloat(ymin),
+      max: parseFloat(ymax),
+      gridLineWidth: 1,
+      gridLineDashStyle: 'dash'
+    },
 
-        xAxis: {
-            title: {
-                text: 'time'
-            },
-            min: parseFloat(xmin),
-            max: parseFloat(xmax),
-            gridLineWidth: 1,
-            gridLineDashStyle: 'dash'
-        },
+    xAxis: {
+      title: {
+        text: 'time'
+      },
+      min: parseFloat(xmin),
+      max: parseFloat(xmax),
+      gridLineWidth: 1,
+      gridLineDashStyle: 'dash'
+    },
 
-        plotOptions: {
-            series: {
-                point: {
-                    events: {
-                        drag: function (e) {
-                            if (e.y >= ymax) {
-                                this.y = ymax
-                                return false
-                            }
-                            if (e.y <= ymin) {
-                                this.y = ymin
-                                return false
-                            }
-                            if (e.x >= xmax) {
-                                this.x = xmax
-                                return false
-                            }
-                            if (e.x <= xmin) {
-                                this.x = xmin
-                                return false
-                            }
-                        },
-                        drop: function (e) {
-                            pointsHistory.push(graphParameters.graphPoints.slice())
-                        },
-                        dblclick: function (e) {
-                            const graphObject = e
-                            editPointsValue(graphObject, graphParameters, pointsHistory)
-                        },
-                        contextmenu: function (e) {
-                            const graphObject = e
-                            removePointsFromChart(graphObject, graphParameters, pointsHistory)
-                        }
-                    },
-                    stickyTracking: false
-                },
-                column: {
-                    stacking: 'normal'
-                },
-                marker: {
-                    enabled: true,
-                    symbol: 'url(../images/plus-icon.png)'
-                }
+    plotOptions: {
+      series: {
+        point: {
+          events: {
+            drag: function (e) {
+              if (e.y >= ymax) {
+                this.y = ymax
+                return false
+              }
+              if (e.y <= ymin) {
+                this.y = ymin
+                return false
+              }
+              if (e.x >= xmax) {
+                this.x = xmax
+                return false
+              }
+              if (e.x <= xmin) {
+                this.x = xmin
+                return false
+              }
+            },
+            drop: function () {
+              pointsHistory.push(graphParameters.graphPoints.slice())
+            },
+            dblclick: function (e) {
+              const graphObject = e
+              editPointsValue(graphObject, graphParameters, pointsHistory)
+            },
+            contextmenu: function (e) {
+              const graphObject = e
+              removePointsFromChart(graphObject, graphParameters, pointsHistory)
             }
+          },
+          stickyTracking: false
         },
-        series: [{
-            draggableX: true,
-            draggableY: true,
-            showInLegend: false,
-            data: graphParameters.graphPoints,
-            step,
-            name: stepname
-        }]
-    })
+        column: {
+          stacking: 'normal'
+        },
+        marker: {
+          enabled: true,
+          symbol: 'url(../images/plus-icon.png)'
+        }
+      }
+    },
+    series: [{
+      draggableX: true,
+      draggableY: true,
+      showInLegend: false,
+      data: graphParameters.graphPoints,
+      step,
+      name: stepname
+    }]
+  })
 }
 
 export function updateSubtitleForSigbuilderGraph (points, method, xmaxtitle, periodicFlag) {
   let subTitle = ""
   if (periodicFlag === "y") {
-      subTitle = "<b>" + points + " points, Method: " + getmethod(method) + ", periodic, T = " + xmaxtitle + "</b>"
+    subTitle = "<b>" + points + " points, Method: " + getmethod(method) + ", periodic, T = " + xmaxtitle + "</b>"
   } else {
-      subTitle = "<b>" + points + " points, Method: " + getmethod(method) + ", aperiodic</b>"
+    subTitle = "<b>" + points + " points, Method: " + getmethod(method) + ", aperiodic</b>"
   }
   return subTitle
 }
@@ -136,7 +136,7 @@ function autoscaleFunctionalityForGraph (graphParameters, pointsHistory) {
   graphParameters.xmin = 0 // set min x axis value
   graphParameters.xmax = maxXValueNew + diffX // set max x axis value
   if (minYValueNew > 0) {
-      minYValueNew = 0
+    minYValueNew = 0
   }
   graphParameters.ymin = minYValueNew - diffY // set min y axis value
   graphParameters.ymax = maxYValueNew + diffY // set max y axis value
@@ -178,9 +178,9 @@ export function editPointsValue (graphObject, graphParameters, pointsHistory) {
 
     let value = 0
     if (((graphObject.point.options[keys[i]]).toString()).includes(".")) {
-        value = (graphObject.point.options[keys[i]]).toFixed(6)
+      value = (graphObject.point.options[keys[i]]).toFixed(6)
     } else {
-        value = (graphObject.point.options[keys[i]])
+      value = (graphObject.point.options[keys[i]])
     }
     // Input
     const input = document.createElement("input")
@@ -216,7 +216,7 @@ export function editPointsValue (graphObject, graphParameters, pointsHistory) {
   content.appendChild(myform)
   const height = 150
   wind = showModalWindow(graphSigbuilder, 'Scilab Multiple Values Request', content, 200, height)
-  wind.addListener(mxEvent.DESTROY, function (evt) {
+  wind.addListener(mxEvent.DESTROY, function () {
     graphWind.style.pointerEvents = "auto"
   })
   // Executes when button 'cancelBtn' is clicked
@@ -266,57 +266,57 @@ export function editPointsValue (graphObject, graphParameters, pointsHistory) {
 }
 
 export function removePointsFromChart (graphObject, graphParameters, pointsHistory) {
-    const counter = graphObject.point.index
-    sigbuilderGraph.series[0].data[counter].remove()
+  const counter = graphObject.point.index
+  sigbuilderGraph.series[0].data[counter].remove()
+  pointsHistory.push(graphParameters.graphPoints.slice())
+  graphParameters.points = sigbuilderGraph.series[0].data.length
+  graphParameters.xmaxTitle = sigbuilderGraph.xAxis[0].getExtremes().dataMax.toFixed(6)
+  sigbuilderGraph.setTitle(null, { text: updateSubtitleForSigbuilderGraph(graphParameters.points, graphParameters.mtd, graphParameters.xmaxTitle, graphParameters.PeriodicOption) })
+}
+
+export function addPointsOnChart (graphParameters, pointsHistory, xValue, yValue) {
+  document.getElementById("messageLabel").innerHTML = ""
+  if (xValue === 0 && yValue === 0) {
+    graphParameters.flag_for_zeros = true
+  }
+  const points = graphParameters.graphPoints
+  const xArry = []
+  for (let i = 0; i < points.length; i++) {
+    xArry[i] = points[i][0]
+  }
+  xArry[points.length] = xValue
+  const result = checkDuplicateXValues(xArry)
+  const mtdCheck = [0, 1, 2].includes(graphParameters.mtd)
+  if (result) {
+    sigbuilderGraph.series[0].addPoint([xValue, yValue])
     pointsHistory.push(graphParameters.graphPoints.slice())
     graphParameters.points = sigbuilderGraph.series[0].data.length
     graphParameters.xmaxTitle = sigbuilderGraph.xAxis[0].getExtremes().dataMax.toFixed(6)
     sigbuilderGraph.setTitle(null, { text: updateSubtitleForSigbuilderGraph(graphParameters.points, graphParameters.mtd, graphParameters.xmaxTitle, graphParameters.PeriodicOption) })
-}
-
-export function addPointsOnChart (graphParameters, pointsHistory, xValue, yValue) {
-    document.getElementById("messageLabel").innerHTML = ""
-    if (xValue === 0 && yValue === 0) {
-        graphParameters.flag_for_zeros = true
-    }
-    const points = graphParameters.graphPoints
-    const xArry = []
-    for (let i = 0; i < points.length; i++) {
-        xArry[i] = points[i][0]
-    }
-    xArry[points.length] = xValue
-    const result = checkDuplicateXValues(xArry)
-    const mtdCheck = [0, 1, 2].includes(graphParameters.mtd)
-    if (result) {
-        sigbuilderGraph.series[0].addPoint([xValue, yValue])
-        pointsHistory.push(graphParameters.graphPoints.slice())
-        graphParameters.points = sigbuilderGraph.series[0].data.length
-        graphParameters.xmaxTitle = sigbuilderGraph.xAxis[0].getExtremes().dataMax.toFixed(6)
-        sigbuilderGraph.setTitle(null, { text: updateSubtitleForSigbuilderGraph(graphParameters.points, graphParameters.mtd, graphParameters.xmaxTitle, graphParameters.PeriodicOption) })
+  } else {
+    if (mtdCheck) {
+      sigbuilderGraph.series[0].addPoint([xValue, yValue])
+      pointsHistory.push(graphParameters.graphPoints.slice())
+      graphParameters.points = sigbuilderGraph.series[0].data.length
+      graphParameters.xmaxTitle = sigbuilderGraph.xAxis[0].getExtremes().dataMax.toFixed(6)
+      sigbuilderGraph.setTitle(null, { text: updateSubtitleForSigbuilderGraph(graphParameters.points, graphParameters.mtd, graphParameters.xmaxTitle, graphParameters.PeriodicOption) })
     } else {
-        if (mtdCheck) {
-            sigbuilderGraph.series[0].addPoint([xValue, yValue])
-            pointsHistory.push(graphParameters.graphPoints.slice())
-            graphParameters.points = sigbuilderGraph.series[0].data.length
-            graphParameters.xmaxTitle = sigbuilderGraph.xAxis[0].getExtremes().dataMax.toFixed(6)
-            sigbuilderGraph.setTitle(null, { text: updateSubtitleForSigbuilderGraph(graphParameters.points, graphParameters.mtd, graphParameters.xmaxTitle, graphParameters.PeriodicOption) })
-        } else {
-            document.getElementById("messageLabel").innerHTML = "ERROR IN SPLINE : " + getmethod(graphParameters.mtd)
-            throw new Error("incorrect")
-        }
+      document.getElementById("messageLabel").innerHTML = "ERROR IN SPLINE : " + getmethod(graphParameters.mtd)
+      throw new Error("incorrect")
     }
+  }
 }
 
 function checkDuplicateXValues (xxArry) {
-    const arrayForCompare = []
-    const result = xxArry.slice(0).every(function (item, index, array) {
-        if (arrayForCompare.indexOf(item) > -1) {
-            array.length = 0
-            return false
-        } else {
-            arrayForCompare.push(item)
-            return true
-        }
-    })
-    return result
+  const arrayForCompare = []
+  const result = xxArry.slice(0).every(function (item, index, array) {
+    if (arrayForCompare.indexOf(item) > -1) {
+      array.length = 0
+      return false
+    } else {
+      arrayForCompare.push(item)
+      return true
+    }
+  })
+  return result
 }
diff --git a/blocks/eda-frontend/src/utils/dependencies.js b/blocks/eda-frontend/src/utils/dependencies.js
index 5f4a65ce..aae50e6f 100644
--- a/blocks/eda-frontend/src/utils/dependencies.js
+++ b/blocks/eda-frontend/src/utils/dependencies.js
@@ -16,138 +16,138 @@ window.inBitMap = '0'
 window.outBitMap = '0'
 
 export function showModalWindow (graph, title, content, width, height) {
-    const background = document.createElement('div')
-    background.style.position = 'absolute'
-    background.style.left = '0px'
-    background.style.top = '0px'
-    background.style.right = '0px'
-    background.style.bottom = '0px'
-    background.style.background = 'black'
-    mxUtils.setOpacity(background, 50)
-    document.body.appendChild(background)
-
-    if (mxClient.IS_IE) {
-        new mxDivResizer(background)
-    }
-
-    const x = Math.max(0, document.body.scrollWidth / 2 - width / 2)
-    const y = Math.max(10, (document.body.scrollHeight || document.documentElement.scrollHeight) / 2 - height * 2 / 3)
-    const wind = new mxWindow(title, content, x, y, width, height, false, true)
-    wind.setClosable(true)
-
-    // Fades the background out after after the window has been closed
-    wind.addListener(mxEvent.DESTROY, function (evt) {
-        graph.setEnabled(true)
-        mxEffects.fadeOut(background, 50, true, 10, 30, true)
-    })
-
-    graph.setEnabled(false)
-    graph.tooltipHandler.hide()
-    wind.setVisible(true)
-    return wind
+  const background = document.createElement('div')
+  background.style.position = 'absolute'
+  background.style.left = '0px'
+  background.style.top = '0px'
+  background.style.right = '0px'
+  background.style.bottom = '0px'
+  background.style.background = 'black'
+  mxUtils.setOpacity(background, 50)
+  document.body.appendChild(background)
+
+  if (mxClient.IS_IE) {
+    new mxDivResizer(background)
+  }
+
+  const x = Math.max(0, document.body.scrollWidth / 2 - width / 2)
+  const y = Math.max(10, (document.body.scrollHeight || document.documentElement.scrollHeight) / 2 - height * 2 / 3)
+  const wind = new mxWindow(title, content, x, y, width, height, false, true)
+  wind.setClosable(true)
+
+  // Fades the background out after after the window has been closed
+  wind.addListener(mxEvent.DESTROY, function () {
+    graph.setEnabled(true)
+    mxEffects.fadeOut(background, 50, true, 10, 30, true)
+  })
+
+  graph.setEnabled(false)
+  graph.tooltipHandler.hide()
+  wind.setVisible(true)
+  return wind
 }
 
 export function updateDetails (graph, cell, details, detailsInstance, styleName, geometryCell, create = false) {
-    const enc = new mxCodec(mxUtils.createXmlDocument())
-    const node = enc.encode(details)
-
-    const fullStyleName = styleName
-    if (styleName != null) {
-        const idx = styleName.indexOf(';')
-        if (styleName.startsWith("SELF_SWITCH")) {
-            const stateOpen = detailsInstance.stateOpen
-            styleName = stateOpen ? "SELF_SWITCH_OFF" : "SELF_SWITCH_ON"
-        } else {
-            if (idx !== -1) {
-                styleName = styleName.substring(0, idx)
-            }
-        }
-    }
-
-    const stylesheet = graph.getStylesheet()
-    const style = stylesheet.styles[styleName]
-
-    const dimensionForBlock = detailsInstance.getDimensionForDisplay()
-    let height = dimensionForBlock.height
-    let width = dimensionForBlock.width
-    if (geometryCell.height != null && geometryCell.height > 1) {
-        height = geometryCell.height
-    }
-    if (geometryCell.width != null && geometryCell.width > 1) {
-        width = geometryCell.width
-    }
-
-    /*
-     * When a particular block is loaded for the first time, the image in the
-     * style of the block will be a path to the image. Set the label in the
-     * style property of the block has a html image, and set the image in the
-     * style property as null
-     *
-     * NOTE: Since the image of any block need not be changed for every
-     * movement of that block, the image must be set only once.
-     */
-    if (style != null && style.image != null) {
-        // Make label as a image html element
-        const label = '<img src="' + style.image + '" height="' + (height * 0.9) + '" width="' + (width * 0.9) + '">'
-
-        // Set label
-        style.label = label
-        style.imagePath = style.image
-        // Set image as null
-        style.image = null
-
-        // Add the label as a part of node
-        node.setAttribute('label', label)
+  const enc = new mxCodec(mxUtils.createXmlDocument())
+  const node = enc.encode(details)
+
+  const fullStyleName = styleName
+  if (styleName != null) {
+    const idx = styleName.indexOf(';')
+    if (styleName.startsWith("SELF_SWITCH")) {
+      const stateOpen = detailsInstance.stateOpen
+      styleName = stateOpen ? "SELF_SWITCH_OFF" : "SELF_SWITCH_ON"
+    } else {
+      if (idx !== -1) {
+        styleName = styleName.substring(0, idx)
+      }
     }
-
-    /*
-     * If a particular block with image tag in its style property has been
-     * invoked already, the image tag would be null for any successive
-     * instances of the same block. Hence, set the label from the label tag in
-     * style which was set when that blockModel was invoked on the first time.
-     */
-    if (style != null && style.label != null) {
-        // Set label from the label field in the style property
-        node.setAttribute('label', style.label)
-    }
-
-    const parent = graph.getDefaultParent()
-    node.setAttribute('parent', parent.id)
-
-    if (create) {
-        return graph.insertVertex(parent, null, node, geometryCell.x, geometryCell.y, width, height, fullStyleName)
-    }
-
-    cell.setValue(node)
+  }
+
+  const stylesheet = graph.getStylesheet()
+  const style = stylesheet.styles[styleName]
+
+  const dimensionForBlock = detailsInstance.getDimensionForDisplay()
+  let height = dimensionForBlock.height
+  let width = dimensionForBlock.width
+  if (geometryCell.height != null && geometryCell.height > 1) {
+    height = geometryCell.height
+  }
+  if (geometryCell.width != null && geometryCell.width > 1) {
+    width = geometryCell.width
+  }
+
+  /*
+   * When a particular block is loaded for the first time, the image in the
+   * style of the block will be a path to the image. Set the label in the
+   * style property of the block has a html image, and set the image in the
+   * style property as null
+   *
+   * NOTE: Since the image of any block need not be changed for every
+   * movement of that block, the image must be set only once.
+   */
+  if (style != null && style.image != null) {
+    // Make label as a image html element
+    const label = '<img src="' + style.image + '" height="' + (height * 0.9) + '" width="' + (width * 0.9) + '">'
+
+    // Set label
+    style.label = label
+    style.imagePath = style.image
+    // Set image as null
+    style.image = null
+
+    // Add the label as a part of node
+    node.setAttribute('label', label)
+  }
+
+  /*
+   * If a particular block with image tag in its style property has been
+   * invoked already, the image tag would be null for any successive
+   * instances of the same block. Hence, set the label from the label tag in
+   * style which was set when that blockModel was invoked on the first time.
+   */
+  if (style != null && style.label != null) {
+    // Set label from the label field in the style property
+    node.setAttribute('label', style.label)
+  }
+
+  const parent = graph.getDefaultParent()
+  node.setAttribute('parent', parent.id)
+
+  if (create) {
+    return graph.insertVertex(parent, null, node, geometryCell.x, geometryCell.y, width, height, fullStyleName)
+  }
+
+  cell.setValue(node)
 }
 
 // To convert graph points to array which have been converted
 // to objects because of dragging the points
 export function objToArrayList (graphPoints) {
-    const tempPoints = []
-    for (let i = 0; i < graphPoints.length; i++) {
-        if (graphPoints[i].x) {
-            tempPoints.push([graphPoints[i].x, graphPoints[i].y])
-        } else {
-            tempPoints.push(graphPoints[i])
-        }
+  const tempPoints = []
+  for (let i = 0; i < graphPoints.length; i++) {
+    if (graphPoints[i].x) {
+      tempPoints.push([graphPoints[i].x, graphPoints[i].y])
+    } else {
+      tempPoints.push(graphPoints[i])
     }
-    return tempPoints
+  }
+  return tempPoints
 }
 
 // For Sigbuilder block
 export function getmethod (mtd) {
-    let METHOD = ""
-    switch (mtd) {
-        case 0: METHOD = "zero order"; break
-        case 1: METHOD = "linear"; break
-        case 2: METHOD = "order 2"; break
-        case 3: METHOD = "not_a_knot"; break
-        case 4: METHOD = "periodic"; break
-        case 5: METHOD = "monotone"; break
-        case 6: METHOD = "fast"; break
-        case 7: METHOD = "clamped"; break
-        default: METHOD = "zero order"; break
-    }
-    return METHOD
+  let METHOD = ""
+  switch (mtd) {
+    case 0: METHOD = "zero order"; break
+    case 1: METHOD = "linear"; break
+    case 2: METHOD = "order 2"; break
+    case 3: METHOD = "not_a_knot"; break
+    case 4: METHOD = "periodic"; break
+    case 5: METHOD = "monotone"; break
+    case 6: METHOD = "fast"; break
+    case 7: METHOD = "clamped"; break
+    default: METHOD = "zero order"; break
+  }
+  return METHOD
 }