Skip to content

Conversation

@aykevl
Copy link
Member

@aykevl aykevl commented Nov 15, 2020

I have been working on a "preview" feature for the TinyGo extension. It does something similar to play.tinygo.org, but with much more flexibility, a nicer UI, and integrated directly in VS Code.
Eventually this should also end up on play.tinygo.org, but for now I'm focusing on the extension.

You can test it this way:

  1. Clone this repository, check out the preview branch.
  2. Open the folder in VS Code.
  3. Uninstall the TinyGo extension if you have it installed (it might interfere).
  4. Run vsce package (see here).
  5. Press F5.
  6. Select one of the supported targets (arduino or arduino-nano33).
  7. Open a project for TinyGo, and click the "preview" button to the right in the tabbar.
@Nerzal
Copy link

Nerzal commented Nov 15, 2020

Note:
To be able to execute step 4 it is needed to have vsce installed (to install that you need npm)

So step 4 is the following if u have not installed vsce

npm install -g vsce
npm install
vsce package

@Nerzal
Copy link

Nerzal commented Nov 15, 2020

When having a workspace with multiple projects, the extension is unable to locate the correct project and choses a "random" one.
I guess it would be nice, if either

  • it is configureable which main.go to use
  • it tries to preview the currently open main.go file

I have used https://github.com/Nerzal/tinygo-playground for the test.

The result preview always looked like the following screenshot
grafik

I also get this exact preview, when i open other projects, which only contain a single main file

@aykevl
Copy link
Member Author

aykevl commented Nov 15, 2020

When having a workspace with multiple projects, the extension is unable to locate the correct project and choses a "random" one.
I guess it would be nice, if either

  • it is configureable which main.go to use

  • it tries to preview the currently open main.go file

Yes, this should indeed be improved. I think it's best to initially run tinygo build in the directory of the currently open file and maybe make it configurable later (not yet sure how exactly).

This makes it possible to preview things in a folder with multiple projects (and thus multiple main files).
@aykevl
Copy link
Member Author

aykevl commented Nov 16, 2020

I think it's best to initially run tinygo build in the directory of the currently open file

I have implemented this. It uses the directory of the open Go file as the package directory to build. This makes it possible to work in a workspace with multiple projects.

This makes it a lot easier to know which pad to use to connect a wire.
This more accurately simulates the real hardware.
Objects that had something to the left of the outline would jump a little bit on the first movement, because of incorrect offset calculation of the click position.
This has the big advantage that it becomes possible for mouse events to affect the device itself instead of just the outline (which is a rectangle).
This commit also adds the ability for boards to define their own pad areas, as is very important with the BBC micro:bit with its edge connector.
This is necessary especially for the BBC micro:bit, as it is nearly black and would otherwise be hard to distinguish from the black background. There is also the drop-shadow CSS property but unfortunately it doesn't work yet in Chrome / VS Code. It works in Firefox however. See this Chrome bug: https://bugs.chromium.org/p/chromium/issues/detail?id=109224
This is necessary as Go modules may otherwise complain that it's trying to build a package outside of the module it's currently in. Therefore, set the CWD to the package to build and just build the current directory.
I keep confusing anode/cathode terminology...
This required some fiddling with rotation and board-internal connections to appear right. Right now the LEDs are barely visible. This should be fixed in the future, but for now, examples/microbit-blink (in TinyGo) works.
@aykevl
Copy link
Member Author

aykevl commented Nov 22, 2020

Improved the preview feature a lot, most importantly by adding BBC micro:bit support. I can now open the TinyGo project in VS Code, select the microbit in the TinyGo extension, navigate to src/examples/microbit-blink, and click "preview" to see a blinking LED on the BBC micro:bit (although it's not very visible, I hope to improve that in the future).

This simplifies the LED and will be useful in the future.
This is a type of display often used in 240x240 IPS displays, for example in the PineTime. It works with the st7789 driver in the TinyGo drivers repository.
@fiurthorn
Copy link

why is it not merged?

@aykevl
Copy link
Member Author

aykevl commented Dec 29, 2021

I've essentially rewritten all of it with a better design. I'll push it soon!

@aykevl
Copy link
Member Author

aykevl commented May 8, 2022

I've finally pushed the branch, which is at #5.

@aykevl aykevl deleted the preview branch March 22, 2024 18:15
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

3 participants