Customizing UI of Sunstone

Development
1

I want to change UI of the Open Nebula Sun Stone. For that I need to change the html files but don’t know the location of these files. Can someone help me locate these html files.

2

You can customize the appearanceof buttons and tabs in Sunstone, or replace logo’s with your own, see:
http://docs.opennebula.org/4.12/administration/sunstone_gui/suns_views.html

hope this is what u meant ?

3

Hello, I know that this is an old topic but I’m posting here to avoid creating a new one.

I would like to modify some html (erb) and CSS files. After editing them I have restarted the sunstone service in my vonecloud appliance but changes doesn’t appear, do I need to compile or somthing similar in order to update changes?

Thanks

4

Answering myself:

In order to see if changes on erb files are applied I needed to restart the httpd service in my vonecloud appliance.

5

If you do changes in JS and CSS files, you need to rebuild assets

npm install
export PATH=$PATH:$PWD/node_modules/.bin

grunt --gruntfile ./Gruntfile.js sass
grunt --gruntfile ./Gruntfile.js requirejs
cp -f dist/main.js dist/main-dist.js
2 Likes
6

Hi,
I am trying to customize some Javascript and HTML file e.g, adding an row to datatable, But changes doesn’t reflect/appear in the webapp UI.
I’ve tried changing env value from ‘prod’ to ‘dev’ and restarting opennebula-sunstone, It works for ‘erb’ file (e.g sunstone/views/_login_standard.erb) but doesn’t work for other JS files (e.g sunstone/public/app/tabs/vms-tab/datatable.js).
So how can we make changes in JS & HTML file in development mode.
Thanks!

7

Hello @ahuertas @rdiaz @ruben
Could you help on the above query?
Blocked with the sunstone UI enhancement.
Thanks in advance!!

8

Hello guys,

You just need to:

  • Set Sunstone to dev mode.
  • Restart Apache or Sunstone depending on what you are using.
  • Clear the browser cache, just in case there is anything left from previous build.

Best,
Álex.

1 Like
9

Thanks @ahuertas it’s working!
Don’t know why but earlier Public-> app folder changes in js were not reflecting with the same process mentioned by you.
Well it is working now!!

Could you please share the steps for the prod as well, it would be much helpful and appreciated.