Basic Panel question


#1

I have read all the documentation I could find, but I can’t find a solution for the most simple usecase using a panel.

I have a setting, with an event handler. The event handler fires correctly. Now what I want to be able to do, is update the contents of the panel from that event handler.

Are there any databinding features that I have missed?


#2

there are no databinding features, you can modify dom of the panel from the event handler. What kind of ui elements do you want to have in the panel?


#3

Well, in this case, I want to reload pretty much all of the panel when a specific setting is changed by the user in the preferences.

But the question is more in general: ‘What’s the best approach to deal with this?’ It’s a very common scenario. I want panel contents to change based on a changed file, changed preferences, anything. And without any databinding support, I’m basically forced to recreate the panel contents.

I would almost want to post changed values to an externally hosted webpage, that I show in the panel. But then I have another issue: how to respond to actions from that page?


#4

You either need to recreate panel or update attributes/values of existing dom nodes, it is hard to tell what needs to be done without knowing what type of ui do you have.


#5

Thank you. Can i use a custom Javascript library (or npm module) in my code? For example, if I could recreate something like this: https://codepen.io/gaearon/pen/ZpvBNJ. Then all my databinding issues would be solved!

Update: Upon further reading, it seems I can create my own node.js scripts, using any npm module I want, and execute those using proc. However, the examples all execute a script from the workspace. Can I also execute a script from my plugin like this?


#6

You can use react or preact in your plugin, but that can conflict with other plugins if they decide to use different version of react, and won’t allow you to create cloud9 ui elements like trees.
To use npm modules in the ui, you need to use a custom build step, with webpack or browserify, bundle files, then pass the bundle as a plugin to cloud9