Yeah, it's possible to make 'simple' temporary changes to JavaScript source code without having an IDE like VSCode.
In the movie below we show this process as we modify a TNT Library element source code: TNTSquare. Grab some popcorn and let's watch!
The action steps are outlined again below, for your convenience.
Modifying a 'TNTSquare' with Chrome
Similar modifications could have been made using any library shape or design!
Modifying Shapes/Designs Online with Chrome:
On a desktop device, in Google Chrome (possibly other browsers if you are clever), it's possible to modify some aspects of the library shapes and/or designs within the browser! No IDE required!
Take these steps:
- Open a page for a library graphics element you wish to investigate, like TNTDisk
-
Open the Developer Tools Panel:
- Shift-Control-J or Right-Mouse-Click Canvas >'Inspect'
- Click on the 'Sources' tab
- In the left 'fly-out' window/panel while viewing 'Sources', you will see the HTML page you selected highlighted, such as 'tntDisk.html'
- Above that selected file, there is a
scriptsfolder that houses the JavaScript code that made the image - Click on that folder and you will see a
.jsfile that matches the name of the HTML file you're viewing - Select (click on) that file and in the right panel you will see the source code for the image
- Find the function drawMyDesign Most of the modifications you might like to make are there, but there could be others in initialize or makePicture
- Valid modifications you make there, (once saved using 'Control-S') can be activated by hitting the 'Reload' button on the library page, next to the image. (The file tab shows a (*) for unsaved changes)
- Your changes are not permanent; once you refresh the page with Chrome's 'Refresh' button (the circular arrow icon), or navigate away from it, those temporary changes are lost
If you are a movie fan, hike on over to a screencast we made to illustrate the process of modifying a TNTSquare within Chrome using Chrome Developer Tools.