Skip to content

Commit 732bb5e

Browse files
authored
week 05 update by Om Santosh Suneri
1 parent 22d82b8 commit 732bb5e

File tree

1 file changed

+143
-0
lines changed

1 file changed

+143
-0
lines changed
Lines changed: 143 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,143 @@
1+
---
2+
title: "GSoC’25 Week 05 Update by Om Santosh Suneri"
3+
excerpt: "AI-powered Debugger for Music Blocks"
4+
category: "DEVELOPER NEWS"
5+
date: "2025-07-06"
6+
slug: "2025-07-06-gsoc-25-omsuneri-week05"
7+
author: "@/constants/MarkdownFiles/authors/om-santosh-suneri.md"
8+
tags: "gsoc25,sugarlabs,week05,Debugger,AI,Music Blocks"
9+
image: "assets/Images/GSOC.png"
10+
---
11+
12+
<!-- markdownlint-disable -->
13+
14+
# Week 05 Progress Report by Om Santosh Suneri
15+
16+
**Project:** [AI-powered Debugger for Music Blocks](https://github.com/omsuneri/AI-powered-Debugger-for-Music-Blocks)
17+
**Mentors:** [Walter Bender](https://github.com/walterbender/) [Sumit Srivastava](https://github.com/sum2it)
18+
**Assisting Mentors:** [Devin Ulibarri](https://github.com/pikurasa/)
19+
**Reporting Period:** 2025-06-29 - 2025-07-05
20+
21+
---
22+
23+
## Goal for This Week
24+
25+
**Migrating Music Blocks JSON-to-Text Converter to Streamlit App**
26+
27+
---
28+
29+
## This Week’s Achievements
30+
31+
### Introduction
32+
33+
This week, I focused on one of the key deliverables of the project — **integrating the JSON-to-Text Representation Converter into a Streamlit application**. This marks a major step in our plan to create a seamless debugging experience for Music Blocks users. The converter, which was originally built using JavaScript, is now fully functional in Python via Streamlit and ready for integration with the AI-powered debugger.
34+
35+
### What I Did
36+
37+
#### Goal
38+
39+
The previous tool was a **client-side JavaScript converter** that parsed JSON representations of Music Blocks projects and produced a structured, readable **tree-view text format**. The aim this week was to **translate this logic into Python** and build a **Streamlit interface** to make the tool backend-friendly and easily integrable with the AI Debugger app.
40+
41+
#### Migration from JavaScript to Python
42+
43+
Converting the JavaScript-based logic to Python wasn’t a simple one-to-one translation. It involved rethinking data structures, managing recursion differently, and carefully ensuring that **each Music Blocks "block" type was accurately represented** in the output.
44+
45+
Key technical components of the migration included:
46+
47+
* **Parsing the block structure**:
48+
49+
* Each block in the JSON is structured like `[block_id, block_type, ..., connections]`
50+
* The Python version uses dictionaries (`block_map`) and recursion to follow nested or sequential connections (`clamp` and `stack` logic).
51+
52+
* **Handling specific block types**:
53+
54+
* Each block type (like `start`, `setmasterbpm2`, `newnote`, `repeat`, etc.) has a distinct logic for representation.
55+
* For example, the `setmasterbpm2` block may include a divider block to represent beat values (like `4/4 = 1.00`), which must be parsed recursively.
56+
57+
* **Redacting base64-encoded content**:
58+
59+
* Just like in the JS version, the Python converter checks for base64 strings (e.g., audio/image data) and replaces them with `"data"` to keep the output clean and safe.
60+
61+
* **Maintaining tree formatting**:
62+
63+
* I replicated the `├──` and `` styled tree structure for visual clarity.
64+
* Indentation is handled dynamically based on the depth of recursion.
65+
66+
#### Enhancements Added
67+
68+
While rewriting, I also took the opportunity to **extend the support to more block types** that weren’t handled earlier — for example:
69+
70+
* `arc`
71+
* `incrementOne`
72+
* `pitch`
73+
* `text`
74+
* `settransposition`
75+
76+
This ensures that even **newer or more complex Music Blocks projects** are parsed correctly and comprehensively.
77+
78+
#### The Streamlit App
79+
80+
Once the backend logic was ready, I integrated it with a user-friendly Streamlit interface. The app consists of:
81+
82+
* A **text area** for JSON input.
83+
* A **convert button** to trigger the parsing.
84+
* A cleanly formatted **output section** with scrollable, monospaced text.
85+
* Error handling for invalid or empty JSON.
86+
87+
---
88+
89+
### Why It Matters
90+
91+
Music Blocks is used in educational environments. One of the biggest challenges new users face is **understanding how blocks connect and function** under the hood. By converting the visual block code into a readable text format, this tool:
92+
93+
* Makes debugging more accessible for students.
94+
* Helps educators explain project logic in class.
95+
* Provides an exportable, printable format of block logic.
96+
97+
#### Foundational Component for the Debugger
98+
99+
This converter will play a **crucial role** in the **AI-powered Music Blocks Debugger**. By giving a structured, simplified text representation of the project:
100+
101+
* The LLM (Large Language Model) will better understand the project logic.
102+
* It enables **embedding**, **chunk retrieval**, and **semantic search** for debugging.
103+
* Users will be able to see both their visual project and a clean text summary on the same platform.
104+
105+
#### Seamless Integration Ahead
106+
107+
Now that the converter is in Streamlit (and Python), integrating it into the AI Debugger system becomes straightforward:
108+
109+
* No need to mix JavaScript and Python — the backend stays unified.
110+
* Users can input JSON and debug in the **same interface**.
111+
* It aligns with the vector database and LLM pipeline we’re building.
112+
113+
### 📸 Preview
114+
115+
Here’s a quick preview of the app:
116+
117+
<a href=""><img src="https://i.ibb.co/XZt6MF9k/Screenshot-2025-07-05-at-3-09-15-PM.png" alt="Convertor Streamlit interface"></a>
118+
119+
120+
### Final Thoughts
121+
122+
Rewriting an entire logic-heavy JavaScript app into Python was both challenging and rewarding. It made me deeply understand how each block works in Music Blocks and how a simple but well-structured parser can bring clarity to even the most complex visual projects.
123+
124+
---
125+
126+
## Next Week’s Roadmap
127+
128+
* Integrate the Streamlit-based converter directly into the AI Debugger interface.
129+
* Improve the understanding of actions in the project by enhancing the LLM prompts.
130+
131+
## Resources & References
132+
133+
- **Repository:** [JSON to Text representation](https://github.com/omsuneri/JSON-to-Text-representation)
134+
- **Repository:** [AI-powered Debugger for Music Blocks](https://github.com/omsuneri/AI-powered-Debugger-for-Music-Blocks)
135+
- **Debugger Streamlit App:** [Music Blocks Debugger](https://debuggmb.streamlit.app/)
136+
- **Directory for Projects:** [Embedding Project Set](https://github.com/omsuneri/AI-powered-Debugger-for-Music-Blocks/tree/main/data/docs)
137+
138+
139+
## Acknowledgments
140+
141+
Thank you to my mentors, the Sugar Labs community, and fellow GSoC contributors for ongoing support.
142+
143+
---

0 commit comments

Comments
 (0)