A CodeCoupler Application is a container in which an application runs. It can look like a classic desktop windows with titlebar or fill the whole stage like a website would do.
Let's start with the absolute minimum with a file
testing-buttons.js in a subfolder
1 2 3 4 5 6 7
ui part you define how you would like to present the application to the world. The
iconHtml should be something that can be resized by setting a
font-size. If you are using
fontawsome icons it's a good idea to add the classname
fa-fw to show all your application icons
with the same width.
Now let's go back to our sidebar
items definition and integrate our new application:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17
If you click on the new icon you will see an application window which can be draged inside the current stage, minimized, maximized, collapsed and closed.
Let's start modifying the appearance. To do this you have to implement a method
init. Inwith this
method you have to call
super.init(config) with an object as argument with different properties.
We will now look at first into the prorperty
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15
Basically you can define here all
configuration options from
jsPanel with a few exceptions
In this example we set the
panelSize to get a litle bit more space and the
the name from the
ui settings will be used as title, but with this setting you can overwrite this.
Please note that in the sidebar the name from the
ui settings is still used.