Merge branch 'main' into NavbarRevamp

Author: Arnabdaz

LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2023 Satvik Ramaprasad
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

README.md

@@ -1,23 +1,28 @@
-# GSoC'22 Project - [WIP]VueJS Simulator
+# CircuitVerse Frontend Vue
 
-## New Frontend Framework for Simulator UI.
-- [Phase-1 Report](https://blog.circuitverse.org/posts/devjitchoudhury_gsoc22_phase1_report/)
-- [Phase-2 Report](https://blog.circuitverse.org/posts/devjitchoudhury_gsoc22_phase2_report/)
+## Installation
+To set up the project on your local machine, follow these steps:
 
-### Project Goals - 
-1. Replacing JqueryUI with a modern frontend framework.
-2. Decoupling the Simulator from backend
-3. Dividing into Components
-4. State Management
-5. Refactoring CSS
-6. Internationalization using Vue-i18n
+1. Clone the repository to your local machine using the following command:
+```
+git clone https://github.com/CircuitVerse/cv-frontend-vue.git
+```
+2. Navigate to the project directory:
+```
+cd cv-frontend-vue
+```
+3. Install the project dependencies:
+```
+npm install
+```
+4. Start the development server:
+```
+npm run dev
+```
 
-
-### To Dos -
-1. **Vue Project Integration** into the Main Repository or finding a way for the simulators in two different repositories to work in sync.
-2. **API Integration and Testing**
-3. **Embed Feature** - Discuss and implement the embeding of circuits feature.
-4. **Internationalization of Simulator** - Internationalization is already set up using Vue-i18n but progressive work needs to be done on it.
-5. **Refactoring of Styles** - Refactor the global stylesheet to local stylesheets for individual components. There is also a scope of removing SASS using modern CSS features.
-6. Few components - Verilog Module, Quick-Button, Testbench, and Timing-Diagram are yet to be converted to Vue. 
-7. With the removal of jQuery-UI, there is also a scope of removing the use of jQuery from the project.
+## To Dos -
+1. **Creating the mobile version of the vue simulator** 
+2. **Testing and bug fixing**
+3. **Typescript integration & style Refactoring**
+4. **Creating the desktop application** 
+5. **Removing JQuery**

package-lock.json

@@ -12,7 +12,7 @@
         "postinstall": "husky install"
     },
     "dependencies": {
-        "@fortawesome/fontawesome-free": "^5.15.4",
+        "@fortawesome/fontawesome-free": "^6.5.1",
         "@mdi/font": "5.9.55",
         "@tiptap/core": "^2.0.3",
         "@tiptap/extension-character-count": "^2.0.3",
@@ -28,6 +28,7 @@
         "dom-to-image": "^2.6.0",
         "driver.js": "^0.9.8",
         "esbuild": "^0.14.45",
+        "interactjs": "^1.10.17",
         "jquery": "^3.6.0",
         "pinia": "^2.0.14",
         "vue": "^3.2.25",

package.json

@@ -0,0 +1,79 @@
+[
+    {
+        "title": "Decrease Size",
+        "icon": "fa-chevron-left",
+        "class": "timing-diagram-smaller",
+        "type": "primary",
+        "click": "smaller"
+    },
+    {
+        "title": "Increase Size",
+        "icon": "fa-chevron-right",
+        "class": "timing-diagram-larger",
+        "type": "primary",
+        "click": "larger"
+    },
+    {
+        "title": "Decrease Height",
+        "icon": "fa-chevron-up",
+        "class": "timing-diagram-small-height",
+        "type": "primary",
+        "click": "smallHeight"
+    },
+    {
+        "title": "Increase Height",
+        "icon": "fa-chevron-down",
+        "class": "timing-diagram-large-height",
+        "type": "primary",
+        "click": "largeHeight"
+    },
+    {
+        "title": "Download As Image",
+        "icon": "fa-download",
+        "class": "timing-diagram-download",
+        "type": "primary",
+        "click": "download"
+    },
+    {
+        "title": "Reset Timing Diagram",
+        "icon": "fa-undo",
+        "class": "timing-diagram-reset",
+        "type": "tertiary",
+        "click": "reset"
+    },
+    {
+        "title": "Autocalibrate Cycle Units",
+        "icon": "fa-magic",
+        "class": "timing-diagram-calibrate",
+        "type": "tertiary",
+        "click": "calibrate"
+    },
+    {
+        "title": "Zoom In",
+        "icon": "fa-search-plus",
+        "class": "timing-diagram-zoom-in",
+        "type": "primary",
+        "click": "zoomIn"
+    },
+    {
+        "title": "Zoom Out",
+        "icon": "fa-search-minus",
+        "class": "timing-diagram-zoom-out",
+        "type": "primary",
+        "click": "zoomOut"
+    },
+    {
+        "title": "Resume auto-scroll",
+        "icon": "fa-play",
+        "class": "timing-diagram-resume",
+        "type": "primary",
+        "click": "resume"
+    },
+    {
+        "title": "Pause auto-scroll",
+        "icon": "fa-pause",
+        "class": "timing-diagram-pause",
+        "type": "primary",
+        "click": "pause"
+    }
+]

src/assets/constants/Panels/TimingDiagramPanel/buttons.json

@@ -0,0 +1,24 @@
+[
+    {
+        "label": "Light Themes",
+        "options": [
+            { "value": "default" },
+            { "value": "solarized" },
+            { "value": "elegant" },
+            { "value": "neat" },
+            { "value": "idea" },
+            { "value": "neo" }
+        ]
+    },
+    {
+        "label": "Dark Themes",
+        "options": [
+            { "value": "blackboard" },
+            { "value": "cobalt" },
+            { "value": "night" },
+            { "value": "the-matrix" },
+            { "value": "midnight" },
+            { "value": "monokai" }
+        ]
+    }
+]

src/assets/constants/Panels/VerilogEditorPanel/THEMES.json

@@ -1,6 +1,6 @@
 <template>
     <table class="content-table">
-        <tbody style="display: block; max-height: 70vh; overflow-y: scroll">
+        <tbody style="display: block; max-height: 70vh;">
             <tr>
                 <th v-for="tableHeading in tableHeader" :key="tableHeading">
                     {{ tableHeading }}

src/components/DialogBox/BooleanTable.vue

@@ -8,7 +8,7 @@
         :is-persistent="true"
         :table-header="tableHeader"
         :table-body="tableBody"
-        message-text="BooleanLogicTable"
+        message-text="Boolean Logic Table"
         @button-click="
             (selectedOption, circuitItem, circuitNameVal) =>
                 dialogBoxConformation(selectedOption)
@@ -690,9 +690,15 @@ function generateCircuit() {
 function printBooleanTable() {
     console.log($('.messageBox .v-card-text')[0])
     var sTable = $('.messageBox .v-card-text')[0].innerHTML
+    console.log('This is the table')
     console.log(sTable)
+
     var style =
-        '<style> table {font: 20px Calibri;} table, th, td {border: solid 1px #DDD;border-collapse: collapse;} padding: 2px 3px;text-align: center;} </style>'
+        `<style>
+        table {font: 40px Calibri;}
+        table, th, td {border: solid 1px #DDD;border-collapse: 0;}
+        tbody {padding: 2px 3px;text-align: center;} 
+        </style>`.replace(/\n/g, "")
     var win = window.open('', '', 'height=700,width=700')
     var htmlBody = `
                        <html><head>\