How to do active development on Twinkle Tray UI from Build Instructions?

[takanuva15]

Hi, I followed the Build Instructions and I was able to successfully run npm run build to build the executable from the master branch. What I don't understand is how to do active development and testing for new stuff. The build instructions say to run npm run parcel and npm run dev seperately, but when I do that I just get CLI output.

How do I get the actual tray UI to show so that I can modify js code and see the changes live in an updated Tray UI like I would with a react webapp? (I assume Twinkle Tray wasn't developed by modifying some code and then rerunning an entire build and re-installing the exe for every little change that was added?)

[xanderfrangos]

If you're working off the master branch, then what you're doing is correct. npm run parcel and npm run dev separately. If you're running the beta branch (recommended), then you only need to run npm start. Also, make sure Twinkle Tray isn't already running when you run the dev command(s).

Regarding live edits: it works best for CSS edits. React is hit or miss, depending on if you're editing the flyout or Settings window. Any Electron code edits requires a full restart. Native module edits require a rebuild.

I hope that helps!

[takanuva15]

Oh man, thanks for responding so quickly! I had Twinkle Tray already running, which I guess was messing with the dev command. (I think that might be worthwhile to add to the README if you're willing).

Quick question on the whole DDC/CI protocol - how do you know what VCP codes and values to send to trigger actions like changing power state? For example, in the master branch code for toggling off power state, I see:

monitorsThread.send({
  type: "vcp",
  monitor: hwid,
  code: 0xD6,
  value: 4
})

How did you know that we need to send a "0xD6" with value "4" to get the monitor to shut off? (Is there a giant reference table you're using?)

[dziugas1959]

If you're working off the master branch, then what you're doing is correct. npm run parcel and npm run dev separately. If you're running the beta branch (recommended), then you only need to run npm start. Also, make sure Twinkle Tray isn't already running when you run the dev command(s).

Hello, please fix your „Weblate“ merging, since it errors out, as new languages were added and no real way to get them to appear without you updating this program.

[xanderfrangos]

@dziugas1959 It should be fixed now 👍

[xanderfrangos]

Oh man, thanks for responding so quickly! I had Twinkle Tray already running, which I guess was messing with the dev command. (I think that might be worthwhile to add to the README if you're willing).

Quick question on the whole DDC/CI protocol - how do you know what VCP codes and values to send to trigger actions like changing power state? For example, in the master branch code for toggling off power state, I see:

monitorsThread.send({
  type: "vcp",
  monitor: hwid,
  code: 0xD6,
  value: 4
})

How did you know that we need to send a "0xD6" with value "4" to get the monitor to shut off? (Is there a giant reference table you're using?)

@takanuva15 I've used ControlMyMonitor (https://www.nirsoft.net/utils/control_my_monitor.html) to figure out a lot of the DDC/CI stuff. That and reviewing the code/docs/issues from a bunch of other DDC/CI projects. It's not all consolidated in one place, as no manufacturer is consistent with how they implement the DDC protocols. But if you're just trying to understand your own displays, ControlMyMonitor is a great resource.