Oscilloscope Online V2 Used AI

Finished:
- Deployment
- About Page
- Help Page

OO2 Reboot is officially finished.

Finished the eports & imports

Now only the Help page is left, Additionally I'm thinking of adding AOS to it, but there really aren't many places where I can use them. About and Index will be the only 2 pages using them.

Started working on the exports patch. Finished JSON Export (for SVG Plotter)

Also cleaned up my commit history to make it look more professional.

To my great dismay, it would seem that statistics are simply too much for common browsers and computers, I will look for a way to add Background Workers after the Exports and Help.

Here is an example of what it's capable of right now.

Fixed a few bugs in the time scale mode and switched buffer cleaning. Instead of clearing all it will remove earliest vals and append lattest giving it a true Oscilloscope Look.

Completed the following:
- Status Bar
- Clear
- Refresh Rate

Remaining:
- Import/Export
- Statistics
- Help page

After a gruesome 7 hours, I have done the Serial Communications. With the most part done, all that's left are the finishing touches:
- Exports
- Import & Clear
- Refresh Rate
- Status Bar
- Statistics

After all of these, I just need to create the help page and we should be good to go!

Created Status Messages

In SVG Exporter :All buttons are working as expected and the ability to export/import the configs has been added. Just need to add some Status Messages to make it easier to navigate through. And this page will be done and finished.

Done with the SVG Dynamifier and the crude generation code. Now I just need to do the following inside my SVG Maker:

• Status Messages
• Data -> yGap
• Downloading Generated SVG

Approx 1-2 hours of coding.

Then I'll be left with Plotter. I'm also going to add a help page with instructions and an about page so that might take a little longer.

Improved and Finished UIs for Plotters and SVG's

Remaining (only TS parts left now):
UI-Handlers (Dynamifiers)
Serial Comms
uPlot-Handler
Live-Stats

Imporved NodeJS setup using Spawn, Exec and ExecSync to check for dependency insurance and Parrallel Processing between Isolated steps

Applied namespaces to my TS, had to spend a long time to debug how it worked because Terser would remove everything (I did not know that I had to explicitly use 'export' even though this wasn't a module). Restructured it finely and created a uPlot wrapper. I've also added a dual-host script which means I can run Jekyll and HTTP-Server in parallel. Hence being able to edit the UI on the go instead of ON and OFF repeatedlly.

Mostly done on the redo, all that is left is:

1. Serial Communication
2. Fixing Plotter page UI and adding uPlot + Serial to it
3. Fixing SVG Plotter Code (need to create it as a class)
4. Fixing SVG page UI and adding the edited SVG Plotter code to it

Created SVG Page, fixed the bug in the dependent project. Improved my NPM setup so that anyone can easily download and locally use it with only 2 requirements: Ruby and NodeJS.

Also finished the TS for my Setup page with complete scoped Controller for the form. Allowing a controlled environment.

Setting up the new TS written config storing. I'm using a jekyll plugin I previously made to handle the links in the head assets, and I just found a bug in it. It really limits my automated setup for testing and production. So I'm gonna go ahead and fix it.

Styled the plotting page

A bit of NodeJS later, I have now automated most of my repo.

• Build with CDN Assets
• Local Host with Local Assets across entire Router (test on phone without publish)
• TS -> Terser compressed JS

Created a setup page

Rebooting

Added Bootstrap and created my index page

It was a long time, since I'm brand new to TS. BUT I HAVE DONE IT!!

SVG Generator is done additionally I have made it so that anyone can use it.

It is isolated and works a bit like C++ OOP. Each instance is completely self contained and will only affect itself. You can make as many instances you want.

With the app complete, now comes the re-iteration. I know it may seem like I am redoing this for extra shells, but the truth is that this project needs to be really good so I'm doing iteration development which let's me do this very well. This is probably the final iteration as I move all my code into TS and then use a GitHub action to deploy it with compiled JS.

I'll also be using Bootstrap for a more modern style.

I'll also isolate the SVG maker, so that others can use it easily in their own apps.

For now, here is my JSON definition, JSON plays a very important role in this app as it is responsible for seamless data transfer.

Instead of manually clicking to preview, I am now auto-updating at any change.

Also formatted my files a bit and hid y_gap option on log graphs, since they are linear-only options

DONE WITH THE CLEANUP FINALLY

Just need a few more tweeks.

1. Update Help

2. Update Documentation

3. Add JSON export to plotter page

4. Add JSON MCU Command to auto export

5. Figure out a way to input svg config from the MCU allowing for auto SVG Export

Added the download options. I also found a bug with the logarithmic axes and spent some time trying to fix it up. The project is essentially finished, but there is one extremely important and difficult step I must do. Cleaning!!

Most of the code was written when I didn't know JS much so I need to fix it. Replace the numerous constants with a single JSON object so I have more variable names to work with in the future.

Successfully inputting from the config page!!

All that's left now is the downloading. I will also add the option to download the data as a JSON

Created the Config page with a preview. Now I need to take input from said config page

Added Fill. Also enabled the use of alpha for line, point and fill.

Now my svg generator is done. Next I will hook it up with my oscilloscope and create a dedicated configuration page specifically for SVG Export.

SUCCESSFULLY CONNECTING THE POINT ON MY FIRST TRY!!!

Surprisingly easy, I was worried that it'll be difficult cuz of the null vals

Added null val handling, so you can add empty values.

I have once again reached the Scatter Plot milestone. However this time my code is cleanly structured and supports log scales as well. Unlike before where it was limited to linear scales only

CREATED THE Y_SCALE!! WITH LOG SUPPORT THIS TIME!!

Making swift progress I have done the x_scale.

Now the problem is the y_scale. Linear is easy, the issue is with log. How do I decide on the gaps?

I've decided on the config options for the svg export. The user will be redirected to an HTML form with a live preview where he will be able to change his config as per his requirement.

Created the data parser! It isolates all of my data into separate arrays allowing me easier usage instead of complex index and scaling!

Here's an example from the console log.

Mapped my points successfully!!

However, the code is literal garbage. I'll redo it, once again, from scratch. Now that I have a good idea of how it is supposed to be, it should be pretty good! I'll start with a parser that will convert all of my current data into something easily usable. I can then use this parser to transfer only the important stuff to the svg exporter page!

I'm redoing the svg export, with cleaner code, greater functionality and a lot of customization. I'll redirect the user to a new page for the customization options.

Updated the README!!

Here is an example of the SVG export without the fill area option (the previous example doesn't look very good)

Just made an SVG Exporter, also added MCU commands for SVG and PNG Export triggers.

The SVG doesn't export logarithmic scales for now, but instead of failing the chart is exported with linear scales.

Tried to make an SVG generator using AI. Ended up wasting an hour with nothing to gain.

Fixed Timescale issues when importing a .csv with time.
Added a CSV char to automate downloading of data via the MCU Serial Input.

Just added the CSV Import/Export and PNG Export.

Will add a CSV exporting special char to automate storing via the MCU