Hi Jerad,

Thank you for your prompt reply.I also have this concern that "passing an
icon image" as you mentioned above reply since we are maintaining set of
default icons.But IMHO we need to handle the situation like if the gadget
author need to add a totally new function/button which icon image is not
exist already in default icon set.

Your suggestion would be appreciated.

On Tue, Apr 5, 2016 at 8:59 AM, Jerad Rutnam <je...@wso2.com> wrote:

> Hi Rajeenthini,
>
> IMO I think we should handle the width from css end. I will help you on
> it. And have concern in passing an icon image, is this optional? And do we
> have an option of passing an icon class instead?
>
> Regards,
> Jerad
>
>
> On Tue, Apr 5, 2016 at 7:33 AM, Rajeenthini Satkunam <rajeenth...@wso2.com
> > wrote:
>
>> Hi All,
>>
>> Currently I am working on a task that "*Flexibility to add/remove more
>> functions/buttons in the gadget title bar*".Previously we have distinct
>> set of 3 buttons/functions(configuration,maximize,remove) in gadget title
>> bar.By the task I am working on can have more than above three
>> buttons/functions those are custom buttons specific to each and every
>> gadgets add by gadget author.
>>
>> These custom buttons are adding by gadget author through the
>> configuration file of gadget(Gadget.json) as below.
>>
>> "toolbarButtons":{
>>   "custom":[
>>     {
>>       "action": "REFRESH",
>>       "image": "icon://gadget/date-picker/images/stamp.png"
>>     },
>>     {
>>       "action": "DOWNLOAD",
>>       "image": "icon://gadget/date-picker/images/wifi.png"
>>     }
>>   ],
>>   "default":{
>>     "maximize": false,
>>     "configuration": true,
>>     "remove": true
>>   }
>> }
>>
>> *Faced Problem*
>> *============*
>>
>> When adding more than 3 buttons/functions, the issue that I am facing is
>> those set of buttons are not present at the title bar it is situated just
>> below the title bar.You can find the image below.
>>
>>
>> ​
>>
>> In UI/UX perspective my finding is gadget title width is calculated as
>> below
>>
>> .gadget .gadget-heading > .gadget-title {
>>     width: calc(100% - 154px);
>> }
>>
>>
>> *The proposed solution==================*
>>
>> We can have a extra property called width for each and every custom
>> button and we can get the addition(sum) of widths' of all custom buttons
>> and can subtract from 100% of width of title tool bar.
>>
>> "toolbarButtons":{
>>   "custom":[
>>     {
>>       "action": "REFRESH",
>>       "image": "icon://gadget/date-picker/images/stamp.png",
>>
>>       "width": "7px"
>>
>>     }
>>   ],
>>   "default":{
>>     "maximize": false,
>>     "configuration": true,
>>     "remove": true
>>   }
>> }
>>
>> .gadget .gadget-heading > .gadget-title {
>>     width: calc(100% - {Addition of widths});
>> }
>>
>> *Limitations and problems of proposed solution above*
>> *============================================*
>>
>> - For example in case of adding huge number of custom buttons(100
>> buttons) what will happen to gadget title?
>> - Adding different size of button width size will have not proper
>> consistent gadget UI. It may different respect to gadget custom button
>> widths'.
>> - We cannot restrict gadget author to have distinct number of
>> buttons/functions(default functions/buttons 5).
>>
>> Can anyone guide me on this and give me suggestions on "what would be a
>> better solution"?
>>
>> Your suggestions highly appreciated.
>>
>> --
>>
>> *Thank You.*
>>
>> *Rajeenthini Satkunam*
>>
>> *Associate Software Engineer | WSO2*
>>
>>
>> *E:rajeenth...@wso2.com <rajeenth...@wso2.com>*
>>
>> *M :+94770832823 <%2B94770832823>   *
>>
>>
>
>
> --
> *Jerad Rutnam*
> *Software Engineer*
>
> WSO2 Inc.
> lean | enterprise | middleware
> M : +94 77 959 1609 | E : je...@wso2.com | W : www.wso2.com
>



-- 

*Thank You.*

*Rajeenthini Satkunam*

*Associate Software Engineer | WSO2*


*E:rajeenth...@wso2.com <rajeenth...@wso2.com>*

*M :+94770832823   *
_______________________________________________
Dev mailing list
Dev@wso2.org
http://wso2.org/cgi-bin/mailman/listinfo/dev

Reply via email to