Skip to content

Commit 1842d61

Browse files
ThatDeparted2061ThatDeparted2061
committed
chore: Initial commit for final blog gsoc 2025 Harsh Rao
1 parent 71d64ce commit 1842d61

3 files changed

Lines changed: 188 additions & 3 deletions

File tree

‎content/author/Harsh-Rao.md‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
+++
2-
title = "Aman Asrani"
3-
image = "/images/authors/Aman_Asrani .JPG"
4-
description = "Google Summer of Code 2024 @ CircuitVerse"
2+
title = "Harsh Rao"
3+
image = "/images/authors/Harsh_Rao.JPG"
4+
description = "Google Summer of Code 2025 @ CircuitVerse"
55
+++
66

77
Google Summer of Code 2024 @ CircuitVerse || Electronics and Communication Undergraduate at Birla Institute of Technology and Sciences Pilani, Goa Campus || Class of 2027

‎content/posts/Harsh_Rao_2025_final_report‎

Lines changed: 185 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,185 @@
1+
---
2+
title: "Desktop Application & Vue Frontend Updates: GSoC 2025 Final Report"
3+
date: 2025-08-31T14:04:00+05:30
4+
author: Harsh Rao
5+
type: post
6+
---
7+
8+
![gsoc-cover](/static/images/Harsh_Rao/Final_report.png)
9+
10+
**Hey Everyone 😊**,
11+
12+
Welcome to my final blog for Google Summer of Code 2025 for the project **Desktop Application & Vue Frontend Updates**
13+
14+
### What is the Project about🖥
15+
---
16+
17+
> **[_Desktop Application & Vue Frontend Updates:_](https://summerofcode.withgoogle.com/programs/2025/projects/RLcXZOiF)
18+
> The project works on the Vue Simulator **
19+
20+
### New features that have been added and merged include:
21+
- Verilog modules for circuit elements
22+
- Play/Pause button in the simulator
23+
- Improved UI/UX for code editor
24+
- Verilog terminal
25+
- Resizable & draggable view of tools window
26+
- Yosys Upgrade
27+
28+
---
29+
30+
{{< youtube id="6wrr2ERPNHs" >}}
31+
32+
---
33+
34+
[Project link](https://github.com/orgs/CircuitVerse/projects/37/views/1)
35+
36+
---
37+
### Version confusion
38+
CircuitVerse had implemented the versioning system to avoid merging big changes to the simulator directly. This resulted in the formation of V0/, V1/ and SRC/ folders in the vue-simulator. Currently the V0 folder is default source but it can be changed by altering the configuration files. My changes were made and merged into the V1/ folder. In future all these folders will be in sync and users can change between the verisons easily.
39+
40+
### The Verilog feature in CircuitVerse includes
41+
1. Circuit to Verilog - allows users to convert circuit to verilog code
42+
2. Verilog to Circuit - allows users to convert verilog code to circuits
43+
44+
### Adding the Verilog Modules for Circuit Elements
45+
46+
CircuitVerse can generate Verilog for circuits designed in the simulator. The `moduleVerilog()` function generates Verilog modules for circuit elements. Some elements (listed below) were missing these modules, causing calls to undefined Verilog functions. The first week focused on adding the missing Verilog modules.
47+
48+
#### The Verilog Module for the following Circuit elements were added:
49+
50+
- SR Flip Flops
51+
- JK Flip Flops
52+
- ALU
53+
- D-Latch
54+
- ForceGate
55+
- LSB
56+
- MSB
57+
- TestBench element
58+
59+
**Checkout the Below Video for before and after fix**
60+
{{< video src="/videos/Vivek_Gsoc25/VerilogModule.mp4" type="video/mp4" preload="auto" >}}
61+
62+
63+
In total 8 verilog modules were added, some of them are displayed below :
64+
65+
![Circuit to Verilog](/images/Vivek_Kumar_Gsoc2025/ALUVerilog.png)
66+
![Circuit to Verilog](/images/Vivek_Kumar_Gsoc2025/adder.png)
67+
68+
### Bugs which were fixed in the Verilog Modules
69+
70+
- Wrong and incomplete verilog code for adder , the adder
71+
72+
![adder](/images/Vivek_Kumar_Gsoc2025/adder.png)
73+
- Undefined parameters in the Flip Flops
74+
- Missing bitwidth support in some elements
75+
- Inconsistent verilog logic
76+
- SR flip flop wrong logic
77+
78+
### Yosys upgrade and migration
79+
80+
Yosysdigitaljs-server created by Marek Materzok is the technology behind the feature that allows users to convert Verilog code
81+
into circuits in the simulator.
82+
83+
![Yosys feature](/images/Vivek_Kumar_Gsoc2025/yosys.png)
84+
85+
The Circuitverse Yosys forked repo is behind its parent by some 39 PRs, the parent repo had been migrated from js to ts and even the folder structure has been changed.These changes include the server file to receive the request from circuitverse backend, docker file and other configuartion and minor changes from CircuitVerse.
86+
87+
![Verilog to circuit feature](/images/Vivek_Kumar_Gsoc2025/YosysCV.png)
88+
89+
The Yosys repo is now updated, folder structure updated & consistent with its parent and migrated to ts. In the future any changes to its parent can be easily merged with much conflicts between the two.
90+
91+
### Revamping the Verilog code editor and Verilog Terminal
92+
93+
CircuitVerse provides its users the feature of Verilog code editor. Which can be used by the users to write verilog code and then convert them into circuits and further integrate them into their circuits on the simulator.
94+
95+
#### The goal of the Code Editor is to:
96+
97+
The Code Editor enables users to write and edit Verilog code directly inside CircuitVerse. The users can write and edit their verilog code inside the code editor. Once the code is written, it can be sent to backend powered by Yosys, an open-source synthesis tool. The Yosys backend processes the code, parses the output, and automatically generates a visual circuit based on the Verilog description. This ciruit then turns into a black box circuit that can be simulated in the circuitverse simulator and also connected with other circuit elements.
98+
99+
The Code Editor is built using CodeMirror - a powerful and customizable browser-based code editor.
100+
101+
#### The code Editor has the following features currently:
102+
- Syntax highlighting for Verilog
103+
- Smart indentation
104+
- Line numbering
105+
- Theme customization (Solarized, Monokai, Blackboard, and more)
106+
- Reset editor button
107+
108+
But the UI/UX of the code editor is not particularly encouraging for the users, also there are lots of features that can be added to it to make it better.
109+
110+
![Verilog to circuit feature](/images/Vivek_Kumar_Gsoc2025/updatedCodeEditor.png)
111+
#### I have implemented the following things, which were proposed:
112+
- Improved indentation between code and line numbering, between numbering and the edge
113+
- CTRL + S shortcut for the save button
114+
- Option to increase the font size
115+
- Displaying error message properly, maybe a whole terminal experience to display the error message
116+
- Dark default theme in Vue-Simulator
117+
- Code completion
118+
- Code folding and bracket matching
119+
120+
### Verilog Terminal
121+
After the initial changes of font, line-spacing, padding, and auto-bracket matching were implemented to the verilog code editor, there was a need to further improve the verilog code editor and align it with traditional code editors. To do this Verilog code editor terminal was introduced.
122+
123+
The Verilog Terminal provides a console-like view for synthesis/log outputs and errors, reducing context switching. It complements the play/pause control so users can pause simulation, inspect messages, and iterate efficiently.
124+
125+
The verilog terminal logs the process status, success messages, and error logs. It also displays the synatx and other error messages sent from the YOSYS server and displays it to the users, so that they can debug their Verilog Code easily. Further Enhancements can also be added to it, which can include terminal taking commands to save, reset and close the verilog editor and further enhancements.
126+
127+
![Verilog Terminal](/images/Vivek_Kumar_Gsoc2025/verilogTerminal.png)
128+
129+
### Play/Pause Button to the Simulator
130+
The play/pause button halts the simulation engine, clocks, and UI updates. Users can pause to build/debug circuits and conserve browser resources, then resume when ready. This reduces confusion and supports workflows like debugging, testbenches, and timing diagrams.
131+
132+
![Play pause button](/images/Vivek_Kumar_Gsoc2025/playPauseButton.png)
133+
134+
### Resizable & draggable view of tools window
135+
The tools section of the Simulator contains various tools, each having thier own window. In the vue-simulator the windows of the tools are neither resizable and nor draggale which causes a lot fo trouble for the users, as they can neither change the size or drag it somewhere. These tools windows were made resizable and draggable allowing the users to do the both.
136+
137+
### Verilog feature documentation
138+
139+
As part of this project, I documented the Verilog feature in detail with examples for CircuitVerse users.
140+
141+
I also created developer-focused docs to make it easy to set up the Verilog feature locally and extend it further.
142+
143+
#### Documenting the Verilog features:
144+
145+
![doc1](/images/Vivek_Kumar_Gsoc2025/doc1.png)
146+
![doc2](/images/Vivek_Kumar_Gsoc2025/doc2.png)
147+
![doc3](/images/Vivek_Kumar_Gsoc2025/doc3.png)
148+
149+
---
150+
151+
### Pull Requests
152+
- PR : [JK Flip Flop](https://github.com/CircuitVerse/cv-frontend-vue/pull/591)
153+
- PR : [SR Flip Flop](https://github.com/CircuitVerse/cv-frontend-vue/pull/592)
154+
- PR : [ALU](https://github.com/CircuitVerse/cv-frontend-vue/pull/593)
155+
- PR : [D-Latch](https://github.com/CircuitVerse/cv-frontend-vue/pull/594)
156+
- PR : [Force Gate](https://github.com/CircuitVerse/cv-frontend-vue/pull/609)
157+
- PR : [LSB](https://github.com/CircuitVerse/cv-frontend-vue/pull/621)
158+
- PR : [TestBench Element](https://github.com/CircuitVerse/cv-frontend-vue/pull/611)
159+
- PR : [DFF fix](https://github.com/CircuitVerse/cv-frontend-vue/pull/619)
160+
- PR : [TFF fix](https://github.com/CircuitVerse/cv-frontend-vue/pull/620)
161+
- PR : [Adder fix](https://github.com/CircuitVerse/cv-frontend-vue/pull/645)
162+
- PR : [Verilog Code editor](https://github.com/CircuitVerse/cv-frontend-vue/pull/628)
163+
- PR : [Verilog Code editor](https://github.com/CircuitVerse/cv-frontend-vue/pull/640)
164+
- PR : [Pr doc1](https://github.com/CircuitVerse/cv-frontend-vue/pull/628)
165+
- PR : [Pr doc2](https://github.com/CircuitVerse/CircuitVerseDocs/pull/437)
166+
- PR : [Pr doc3](https://github.com/CircuitVerse/CircuitVerseDocs/pull/438)
167+
- PR : [Yosys upgrade](https://github.com/CircuitVerse/yosys2digitaljs-server/pull/6)
168+
- PR : [CI fix](https://github.com/CircuitVerse/yosys2digitaljs-server/pull/7)
169+
170+
---
171+
## Learning
172+
173+
This project taught me a lot about VueJs and how the simulation engine works behind the scenes. I got hands-on with Verilog, writing modules and testbenches, and really improved my digital design skills. Working with Yosys and its move to TypeScript was a great way to learn about backend integration and modern codebases.
174+
175+
I also picked up better object-oriented coding habits and got much faster at debugging tricky issues. Setting up Docker and container networking was new for me, but now I feel confident managing development environments. Overall, I became a more versatile coder and learned a ton from collaborating with the CircuitVerse community.
176+
177+
## Conclusion
178+
179+
---
180+
181+
My journey so far has been exciting and amazing. Each week I stumble upon things I don't know, and I learn it, exeriment with it and then implement it. It has truly been a developers dream till now. My mentors and CircuitVerse community have been very helpful and inspirational in my little journey. Looking forward to contribute and learn more.
182+
183+
I would like to thank,
184+
[Aboobacker MK](https://github.com/tachyons), [Vedant Jain](https://github.com/vedant-jain03), [Niladri Adhikary](https://github.com/niladrix719), [Josh Varga](https://github.com/JoshVarga), [Aman Asrani](https://github.com/tachyons), and other mentors and circuitverse contributors for helping and mentoring me throught the journey.
185+

‎static/images/Harsh_Rao/Final_report.png‎

1.07 MB
Loading

0 commit comments

Comments
 (0)