Merge branch 'main' into metadata

src/components/DialogBox/CombinationalAnalysis.vue

@@ -35,7 +35,7 @@ import Output from '#/simulator/src/modules/Output'
 import AndGate from '#/simulator/src/modules/AndGate'
 import OrGate from '#/simulator/src/modules/OrGate'
 import NotGate from '#/simulator/src/modules/NotGate'
-import simulationArea from '#/simulator/src/simulationArea'
+import { simulationArea } from '#/simulator/src/simulationArea'
 import { findDimensions } from '#/simulator/src/canvasApi'
 import { confirmSingleOption } from '../helpers/confirmComponent/ConfirmComponent.vue'
 

src/components/DialogBox/InsertSubcircuit.vue

@@ -66,7 +66,7 @@ import { onMounted, onUpdated, ref } from '@vue/runtime-core'
 import { useState } from '#/store/SimulatorStore/state'
 import { createNewCircuitScope, scopeList } from '#/simulator/src/circuit'
 import SubCircuit from '#/simulator/src/subcircuit'
-import simulationArea from '#/simulator/src/simulationArea'
+import { simulationArea } from '#/simulator/src/simulationArea'
 const SimulatorState = useState()
 const flag = ref(true)
 onMounted(() => {

src/components/DialogBox/OpenOffline.vue

@@ -26,11 +26,12 @@
                             type="radio"
                             name="projectId"
                             :value="projectId"
+                            v-model="selectedProjectId"
                         />
                         {{ projectName }}<span></span>
                         <i
                             class="fa fa-trash deleteOfflineProject"
-                            @click="deleteOfflineProject(projectId)"
+                            @click="deleteOfflineProject(projectId.toString())"
                         ></i>
                     </label>
                     <p v-if="JSON.stringify(projectList) == '{}'">
@@ -64,32 +65,39 @@
 <script lang="ts" setup>
 import load from '#/simulator/src/data/load'
 import { useState } from '#/store/SimulatorStore/state'
-import { onMounted, onUpdated, ref, toRaw } from 'vue'
+import { onMounted, onUpdated, ref, reactive } from '@vue/runtime-core'
 const SimulatorState = useState()
-const projectList = ref({})
+const projectList: {
+    [key: string]: string
+} = reactive({})
+const selectedProjectId = ref<string | null>(null)
+
 onMounted(() => {
     SimulatorState.dialogBox.open_project_dialog = false
 })
 
 onUpdated(() => {
-    var data = localStorage.getItem('projectList')
-    projectList.value = JSON.parse(localStorage.getItem('projectList')) || {}
+    const data = localStorage.getItem('projectList')
+    projectList.value = data ? JSON.parse(data) : {}
 })
 
-function deleteOfflineProject(id) {
+function deleteOfflineProject(id: string) {
     localStorage.removeItem(id)
-    const temp = JSON.parse(localStorage.getItem('projectList')) || {}
+    const data = localStorage.getItem('projectList')
+    const temp = data ? JSON.parse(data) : {}
     delete temp[id]
     projectList.value = temp
     localStorage.setItem('projectList', JSON.stringify(temp))
 }
 
 function openProjectOffline() {
     SimulatorState.dialogBox.open_project_dialog = false
-    let ele = $('input[name=projectId]:checked')
-    if (!ele.val()) return
-    load(JSON.parse(localStorage.getItem(ele.val())))
-    window.projectId = ele.val()
+    if (!selectedProjectId.value) return
+    const projectData = localStorage.getItem(selectedProjectId.value)
+    if (projectData) {
+        load(JSON.parse(projectData))
+        window.projectId = selectedProjectId.value
+    }
 }
 
 function OpenImportProjectDialog() {

src/components/Panels/ElementsPanel/ElementsPanel.vue

@@ -142,7 +142,7 @@
 <script lang="ts" setup>
 import PanelHeader from '../Shared/PanelHeader.vue'
 import { elementHierarchy } from '#/simulator/src/metadata'
-import simulationArea from '#/simulator/src/simulationArea'
+import { simulationArea } from '#/simulator/src/simulationArea'
 import { uxvar } from '#/simulator/src/ux'
 import modules from '#/simulator/src/modules'
 import { onBeforeMount, ref } from 'vue'

src/components/Panels/PropertiesPanel/ModuleProperty/ProjectProperty/ProjectProperty.vue

@@ -96,7 +96,7 @@ import { toggleLayoutMode } from '#/simulator/src/layoutMode'
 //     scopeList,
 // } from '#/simulator/src/circuit'
 // import { showMessage } from '#/simulator/src/utils'
-import simulationArea from '#/simulator/src/simulationArea'
+import { simulationArea } from '#/simulator/src/simulationArea'
 import InputGroups from '#/components/Panels/Shared/InputGroups.vue'
 // import MessageBox from '#/components/MessageBox/messageBox.vue'
 // import { ref, Ref, onMounted, watch } from 'vue'

src/components/Panels/PropertiesPanel/PropertiesPanel.vue

@@ -12,7 +12,7 @@
 import ModuleProperty from '#/components/Panels/PropertiesPanel/ModuleProperty/ModuleProperty.vue'
 import LayoutProperty from '#/components/Panels/PropertiesPanel/LayoutProperty/LayoutProperty.vue'
 import { ref, toRaw, onMounted } from 'vue'
-import simulationArea from '#/simulator/src/simulationArea'
+import { simulationArea } from '#/simulator/src/simulationArea'
 import { checkPropertiesUpdate, prevPropertyObjSet } from '#/simulator/src/ux'
 import { layoutModeGet } from '#/simulator/src/layoutMode'
 

src/pages/embed.vue

@@ -165,7 +165,7 @@
 <script lang="ts" setup>
 import { ref, onBeforeMount, onMounted, watch } from 'vue'
 import { useRoute } from 'vue-router'
-import simulationArea, { changeClockTime } from '#/simulator/src/simulationArea'
+import { simulationArea, changeClockTime } from '#/simulator/src/simulationArea'
 import {
     scheduleUpdate,
     updateCanvasSet,

src/simulator/src/Verilog2CV.js

@@ -4,7 +4,7 @@ import {
     changeCircuitName,
 } from './circuit'
 import SubCircuit from './subcircuit'
-import simulationArea from './simulationArea'
+import { simulationArea } from './simulationArea'
 import CodeMirror from 'codemirror/lib/codemirror.js'
 import 'codemirror/lib/codemirror.css'
 

src/simulator/src/backgroundArea.ts

@@ -0,0 +1,20 @@
+import { BackgroundArea } from './interface/backgroundArea'
+import { dots } from './canvasApi';
+
+export const backgroundArea: BackgroundArea = {
+    canvas: null,
+    context: null,
+    setup() {
+        this.canvas = document.getElementById('backgroundArea') as HTMLCanvasElement;
+        this.canvas.width = width;
+        this.canvas.height = height;
+        this.context = this.canvas.getContext('2d');
+        dots(true, false);
+    },
+    clear() {
+        if (!this.context || !this.canvas) {
+            return;
+        }
+        this.context.clearRect(0, 0, this.canvas.width, this.canvas.height);
+    },
+};

src/simulator/src/canvasApi.js

@@ -1,6 +1,6 @@
 /* eslint-disable no-param-reassign */
-import backgroundArea from './backgroundArea'
-import simulationArea from './simulationArea'
+import { backgroundArea } from './backgroundArea'
+import { simulationArea } from './simulationArea'
 import miniMapArea, { removeMiniMap, updatelastMinimapShown } from './minimap'
 import { colors } from './themer/themer'
 import { updateOrder } from './metadata'
@@ -241,7 +241,10 @@ export function moveTo(ctx, x1, y1, xx, yy, dir, bypass = false) {
     xx *= globalScope.scale
     yy *= globalScope.scale
     if (bypass) {
-        ctx.moveTo(xx + globalScope.ox + newX, yy + globalScope.oy + newY)
+        ctx.moveTo(
+            Math.round(xx + globalScope.ox + newX),
+            Math.round(yy + globalScope.oy + newY)
+        )
     } else {
         ctx.moveTo(
             Math.round(xx + globalScope.ox + newX - correction) + correction,

src/simulator/src/circuit.js

@@ -11,7 +11,7 @@
 /* eslint-disable no-alert */
 import CircuitElement from './circuitElement'
 import plotArea from './plotArea'
-import simulationArea from './simulationArea'
+import { simulationArea } from './simulationArea'
 import {
     stripTags,
     uniq,

src/simulator/src/circuitElement.js

@@ -1,7 +1,7 @@
 /* eslint-disable no-multi-assign */
 /* eslint-disable no-bitwise */
 import { scheduleUpdate } from './engine'
-import simulationArea from './simulationArea'
+import { simulationArea } from './simulationArea'
 import {
     fixDirection,
     fillText,
@@ -154,7 +154,7 @@ export default class CircuitElement {
     /**
      * To generate JSON-safe data that can be loaded
      * @memberof CircuitElement
-     * @return {JSON} - the data to be saved
+     * @return {object} - the data to be saved
      */
     saveObject() {
         var data = {
@@ -176,7 +176,7 @@ export default class CircuitElement {
     /**
      * Always overriden
      * @memberof CircuitElement
-     * @return {JSON} - the data to be saved
+     * @return {object} - the data to be saved
      */
     // eslint-disable-next-line class-methods-use-this
     customSave() {
@@ -852,7 +852,8 @@ export default class CircuitElement {
     resolve() {}
 
     /**
-     * Helper Function to process verilog
+     * Helper Function to process Verilog
+     * @return {string}
      */
     processVerilog() {
         // Output count used to sanitize output
@@ -956,8 +957,8 @@ export default class CircuitElement {
     }
 
     /**
-     * Helper Function to generate verilog
-     * @return {JSON}
+     * Helper Function to generate Verilog.
+     * @return {string}
      */
     generateVerilog() {
         // Example: and and_1(_out, _out, _Q[0]);

src/simulator/src/data/load.js

@@ -8,7 +8,7 @@ import {
     gridUpdateSet,
 } from '../engine'
 import { updateRestrictedElementsInScope } from '../restrictedElementDiv'
-import simulationArea from '../simulationArea'
+import { simulationArea } from '../simulationArea'
 
 import { loadSubCircuit } from '../subcircuit'
 import { scheduleBackup } from './backupCircuit'

src/simulator/src/data/save.js

@@ -3,8 +3,8 @@ import { resetup } from '../setup'
 import { update } from '../engine'
 import { stripTags, showMessage } from '../utils'
 import { backUp } from './backupCircuit'
-import simulationArea from '../simulationArea'
-import backgroundArea from '../backgroundArea'
+import { simulationArea } from '../simulationArea'
+import { backgroundArea } from '../backgroundArea'
 import { findDimensions } from '../canvasApi'
 import { projectSavedSet } from './project'
 import { colors } from '../themer/themer'

src/simulator/src/embed.js

@@ -1,7 +1,7 @@
 // /* eslint-disable import/no-cycle */
 // // Helper functions for when circuit is embedded
 // import { scopeList, circuitProperty } from './circuit'
-// import simulationArea from './simulationArea'
+// import { simulationArea } from './simulationArea'
 // import {
 //     scheduleUpdate,
 //     wireToBeCheckedSet,

src/simulator/src/embedListeners.js

@@ -1,7 +1,7 @@
 /* eslint-disable import/no-cycle */
 // Listeners when circuit is embedded
 // Refer listeners.js
-import simulationArea from './simulationArea'
+import { simulationArea } from './simulationArea'
 import {
     scheduleUpdate,
     update,

src/simulator/src/engine.js

@@ -5,7 +5,7 @@
 /* eslint-disable no-bitwise */
 import { layoutModeGet, layoutUpdate } from './layoutMode'
 import plotArea from './plotArea'
-import simulationArea from './simulationArea'
+import { simulationArea } from './simulationArea'
 import { dots, canvasMessage, findDimensions, rect2 } from './canvasApi'
 import { showProperties, prevPropertyObjGet } from './ux'
 import { showError } from './utils'

src/simulator/src/eventQueue.js

@@ -2,7 +2,7 @@
  * Event Queue is simply a priority Queue, basic implementation O(n^2).
  * @category eventQueue
  */
-export default class EventQueue {
+export class EventQueue {
     constructor(size) {
         this.size = size
         this.queue = new Array(size)

src/simulator/src/events.js

@@ -11,7 +11,7 @@ import {
 import { backUp } from './data/backupCircuit'
 import { getNextPosition } from './modules'
 import { generateId } from './utils'
-import simulationArea from './simulationArea'
+import { simulationArea } from './simulationArea'
 import { TestbenchData } from './testbench'
 import { moduleList, updateOrder } from './metadata'
 

src/simulator/src/hotkey_binder/model/actions.js

@@ -1,7 +1,7 @@
 import { defaultKeys } from '../defaultKeys'
 import { addShortcut } from './addShortcut'
 import { updateHTML } from '../view/panel.ui'
-import simulationArea from '../../simulationArea'
+import { simulationArea } from '../../simulationArea'
 import {
     scheduleUpdate,
     wireToBeCheckedSet,

src/simulator/src/interface/backgroundArea.ts

@@ -0,0 +1,6 @@
+export interface BackgroundArea {
+    canvas: HTMLCanvasElement | null;
+    context: CanvasRenderingContext2D | null;
+    setup(): void;
+    clear(): void;
+}

src/simulator/src/interface/simulationArea.ts

@@ -0,0 +1,38 @@
+import { EventQueue } from '../eventQueue'
+export interface SimulationArea {
+    canvas: HTMLCanvasElement;
+    context: CanvasRenderingContext2D|null;
+    selected: boolean;
+    hover: boolean;
+    clockState: number;
+    clockEnabled: boolean;
+    // TODO: make this CircuitElement|null once converted to typescript
+    lastSelected: any|null;
+    stack: any[];
+    prevScale: number;
+    oldx: number;
+    oldy: number;
+    objectList: any[];
+    maxHeight: number;
+    maxWidth: number;
+    minHeight: number;
+    minWidth: number;
+    multipleObjectSelections: any[];
+    copyList: any[];
+    shiftDown: boolean;
+    controlDown: boolean;
+    timePeriod: number;
+    mouseX: number;
+    mouseY: number;
+    mouseDownX: number;
+    mouseDownY: number;
+    simulationQueue: EventQueue;
+    clickCount: number;
+    lock: string;
+    mouseDown: boolean;
+    ClockInterval: NodeJS.Timeout|null;
+    timer: () => void;
+    setup: () => void;
+    changeClockTime: (t: number) => void;
+    clear: () => void;
+}

src/simulator/src/layout/layoutNode.js

@@ -1,5 +1,5 @@
 import { drawCircle } from '../canvasApi'
-import simulationArea from '../simulationArea'
+import { simulationArea } from '../simulationArea'
 import { tempBuffer } from '../layoutMode'
 
 /**

src/simulator/src/layoutMode.js

@@ -2,7 +2,7 @@
 /* eslint-disable no-continue */
 import { dots, correctWidth, fillText, rect2 } from './canvasApi'
 import LayoutBuffer from './layout/layoutBuffer'
-import simulationArea from './simulationArea'
+import { simulationArea } from './simulationArea'
 import {
     fillSubcircuitElements,
     prevPropertyObjGet,

src/simulator/src/listeners.js

@@ -5,7 +5,7 @@ import {
     layoutUpdate,
     // setupLayoutModePanelListeners,
 } from './layoutMode'
-import simulationArea from './simulationArea'
+import { simulationArea } from './simulationArea'
 import {
     scheduleUpdate,
     update,

src/simulator/src/minimap.js

@@ -1,4 +1,4 @@
-import simulationArea from './simulationArea'
+import { simulationArea } from './simulationArea'
 import { colors } from './themer/themer'
 import { layoutModeGet } from './layoutMode'
 import { updateOrder } from './metadata'