Web Development

Running Maintenance and Additions to Disassembler App

by Cory on March 9, 2020 10:28 AM

I made some updates to the app:


Current app screenshot

So I made some modifications to the app. I fixed a few bugs and added buttons to show examples directly on the page, as someone on hacker news suggested. Oh and, by the way, did I mention I submitted it to hacker news? I got a single whole comment!

So changes include fixing the overflow on the modal (?) popup on small screens. Previously, if the text overflowed, it just went off the box. Now it gives you a scrollbar instead.

The bigger change was that I added a sub navigation bar that lets you click on examples that show the traces for my sample files instead of users having to upload the files themselves. This required a small re-architecture of the app. Since I now have multiple pages, I needed to use Angular routing and figure that stuff out. I'd actually been a little reluctant to get into that mess, but t wasn't as bad as I thought. I also had to refactor the instruction-list component I made because it was hard coded to take input from the upload service only. I changed it so that the instruction-list component takes a list of Instruction objects through an input parameter, making it much more versatile and stateless. :D

So when you click on an example, instead of giving the user an option to upload a file, it automatically makes an HTTP request to a file in my assets folder to pass to the instruction-list display. To do this, Angular requires you to create an HttpClient instance and read the file info through an HTTP GET request. So, even though the file is on the same server, I have this loading screen while the data is loaded through HTTP:

Example loading

And then the result is nearly identical to the uploaded result:

Example binary display

This Thought is part of Web Development

General Web Development Thoughts and Odds and Ends

back to the