Mailing-List: contact dev-help@cloudstack.apache.org; run by ezmlm
Precedence: bulk
Reply-To: dev@cloudstack.apache.org
Message-ID: <56442AC3.5000202@gmail.com>
Date: Wed, 11 Nov 2015 21:59:31 -0800
From: ilya <ilya.mailing.lists@gmail.com>
User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.11;
 rv:31.0) Gecko/20100101 Thunderbird/31.7.0
MIME-Version: 1.0
To: dev@cloudstack.apache.org
Subject: Re: UI customization
References: 
 <CA+tvHLOthQncEDOHk-+gwZ+o_pu2ZyB3QjZL5RF03BmDh3iKhQ@mail.gmail.com>
	<CAAt5S3YFOKiwdTL3egVvQ6eE+rdjcPTANxFj745=ujtfr6tTXQ@mail.gmail.com>
	<CAKTWcSnUBmx6OcibbMuWFbKAjjuNz=tStyCNm-a2SYJ5Vsx16Q@mail.gmail.com>
	<75c4635ea51b360b375b5b4f8a5d8a3d@ant.ee>
 <CA+tvHLOmak4ZR9KzwzRSi3Qv=dy2cYCSUjzykq3=Vy8we12XLA@mail.gmail.com>
In-Reply-To: 
 <CA+tvHLOmak4ZR9KzwzRSi3Qv=dy2cYCSUjzykq3=Vy8we12XLA@mail.gmail.com>
Content-Type: text/plain; charset=utf-8
Content-Transfer-Encoding: 8bit

As per Vadim, plugins is the way to go.

Regards
-ilya


On 11/11/15 6:45 AM, Илья Толстихин wrote:
> Many thanks.
> 
> 2015-11-09 18:29 GMT+06:00 Vadim Kimlaychuk <vadim@kickcloud.net>:
> 
>> From my opinion better way is to write a plugin:
>> http://docs.cloudstack.apache.org/en/latest/plugins.html#how-to-write-a-plugin-overview
>> and follow UI customization guide:
>> http://support.citrix.com/servlet/KbServlet/download/38315-102-714564/CloudPlatform_4.5_User_Interface_Customization.pdf
>>
>> Doing direct changes to cloudStack.js that are not contributed back to
>> community is guaranteed way to have problems after updates. You will have
>> to merge your code with mainstream all the time.
>>
>> Another way is to implement your own interface based on CS REST API. Doing
>> that for just 1 button is overkill for sure, but such changes will never
>> end as soon as you start to customize. Think about it. The easiest way is
>> not always the best one.
>>
>> Vadim.
>>
>> On 2015-11-09 13:58, Kshitij Kansal wrote:
>>
>> Hi,
>>>
>>> You can find the scripts at the location
>>> "client/target/generated-webapp/scripts/". Make changes to cloudstack.js
>>> here.
>>>
>>> *Note: *First remove the corresponding gz file(in your case
>>> cloudstack.js.gz) otherwise the changes won't reflect.
>>>
>>> *The changes in generated-webapps are not saved and tracked in git. So
>>> make
>>> sure to copy your changes to actual scripts (in ui/scripts) before finally
>>> rebuilding the project. *The changes made this way are directly reflected
>>>
>>> by refreshing the page.
>>>
>>> PS: Not sure if its the correct way to develop but it works :). Once
>>> again,
>>> make sure to copy your changes back to correct scripts before building the
>>> project.
>>>
>>> Regards,
>>> Kshitij
>>>
>>> On Mon, Nov 9, 2015 at 12:34 PM, Wei ZHOU <ustcweizhou@gmail.com> wrote:
>>>
>>> I guess you worked on old version before.
>>> in 4.6, something changed. you might compress cloudStack.js to get
>>> cloudStack.js.gz as well.
>>>
>>> 2015-11-08 15:05 GMT+01:00 Илья Толстихин <inosinum@gmail.com>:
>>>
>>> Hi all,
>>>
>>> Could please help with the process of UI customization:
>>>
>>> I have CloudStack 4.6.0 built from the source.
>>> I want to add a custom button to the WebUI menu.
>>> In file ui/scripts/cloudStack.js I added my button into sections array
>>>
>>> *sections: {*
>>> * /***
>>> * * Dashboard*
>>> * */*
>>> * dashboard: {},*
>>> * instances: {},*
>>> * affinityGroups: {},*
>>> * storage: {},*
>>> * network: {},*
>>> * templates: {},*
>>> * events: {},*
>>> * projects: {},*
>>> * accounts: {},*
>>>
>>> * domains: {}, //domain-admin and root-admin only*
>>>
>>> * regions: {}, //root-admin only*
>>> * system: {}, //root-admin only*
>>> * 'global-settings': {}, //root-admin only*
>>> * configuration: {}, //root-admin only*
>>> * plugins: {},*
>>> * test: {*
>>> * title: 'TestSection',*
>>> * id: 'TestSection',*
>>> * show: function(args){*
>>> * var div = document.createElement('div');*
>>> * div.innerHTML = "<h1>Test section</h1>";*
>>> * return div;*
>>> * }*
>>> * }*
>>> * }*
>>>
>>> and in sectionPreFilter array
>>>
>>> *sectionPreFilter: function(args) {*
>>> * var sections = [];*
>>>
>>> * if (isAdmin()) {*
>>> * sections = ["dashboard", "instances", "storage",
>>> "network", "templates", "accounts", "domains", "events", "system",
>>> "global-settings", "configuration", "projects", "regions",
>>> "affinityGroups", "test"];*
>>>
>>> After building the project, the button was added to the menu, but when I
>>> edit cloudStack.js and restart jetty UI doesn't change, any changes are
>>> applied only after the full project rebuild with command mvn
>>> -Pdeveloper,systemvm -DskipTests clean install.
>>> Jetty version 6.1.26
>>>
>>> How to apply changes without rebuilding project?
>>> And is it possible to apply it without restart Jetty?
>>>
>>
>