[Kimchi-devel] [PATCH] [Kimchi] Properly display network interfaces when more than one exists
Socorro Stoppler
socorro at linux.vnet.ibm.com
Tue May 31 13:37:45 UTC 2016
Did you make sure and build the css? Thanks!
On 05/30/2016 07:37 PM, Aline Manera wrote:
> Hi Socorro,
>
> I tried again and I was not able to get the 'unavailable' on
> interfaces neither.
> But the interface list only display one interface right after the
> network creation. Only when I switched tabs, I could see more
> interfaces listed there.
>
>
>
>
> On 05/27/2016 07:37 PM, Socorro Stoppler wrote:
>> Hi Aline,
>>
>> I tried this w/a test env (i.e. --test) so I could have an interface
>> and when I created a VEPA network, it showed the interface. What
>> showed up as unavailable was the Address Space column. Would you
>> mind sending me a picture?
>>
>> Thanks
>> -Socorro
>>
>> On 05/27/2016 12:36 PM, Aline Manera wrote:
>>>
>>> Hi Socorro,
>>>
>>> 1. Once I create a VEPA or Passthrough Bridged network, the
>>> interface column displays "unavailable". If I switch tabs and go
>>> back to Network tab, the interface column displays the interface
>>> values as proposed by this patch.
>>>
>>> 2. I'd suggest to rename the variable name to 'interfaces' just to
>>> reflect that this field can list multiple values.
>>>
>>> Regards,
>>> Aline Manera
>>>
>>> On 05/25/2016 03:03 PM, Socorro Stoppler wrote:
>>>> This patch fixes a bug in the listing of networks in that only one
>>>> network
>>>> interface is being shown regardless of the number of interfaces
>>>> that exist for
>>>> that network.
>>>>
>>>> In addition to now displaying all of the interfaces, in the case
>>>> that there's too many to fit in the column, an ellipsis has been
>>>> added to indicate
>>>> that there's more interfaces than what it being shown. A tooltip
>>>> will be seen when
>>>> the user hovers over the interface(s) to show all of the interfaces.
>>>>
>>>>
>>>> Signed-off-by: Socorro Stoppler <socorro at linux.vnet.ibm.com>
>>>> ---
>>>> ui/css/kimchi.css | 8 ++++++--
>>>> ui/css/src/modules/_network.scss | 9 ++++++---
>>>> ui/js/src/kimchi.network.js | 4 +++-
>>>> ui/pages/tabs/network.html.tmpl | 4 ++--
>>>> 4 files changed, 17 insertions(+), 8 deletions(-)
>>>>
>>>> diff --git a/ui/css/kimchi.css b/ui/css/kimchi.css
>>>> index 49ea39a..72f340c 100644
>>>> --- a/ui/css/kimchi.css
>>>> +++ b/ui/css/kimchi.css
>>>> @@ -2156,12 +2156,16 @@ body.wok-gallery {
>>>>
>>>> #network-root-container .wok-datagrid > .wok-datagrid-header >
>>>> span.column-interface,
>>>> #network-root-container .wok-datagrid > .wok-datagrid-body >
>>>> .wok-datagrid-row > span.column-interface {
>>>> - width: 10.3896%;
>>>> + width: 15.3896%;
>>>> + padding-right: 40px;
>>>> + white-space: nowrap;
>>>> + overflow: hidden;
>>>> + text-overflow: ellipsis;
>>>> }
>>>>
>>>> #network-root-container .wok-datagrid > .wok-datagrid-header >
>>>> span.column-space,
>>>> #network-root-container .wok-datagrid > .wok-datagrid-body >
>>>> .wok-datagrid-row > span.column-space {
>>>> - width: 30%;
>>>> + width: 25%;
>>>> }
>>>>
>>>> #network-root-container .wok-datagrid > .wok-datagrid-header >
>>>> span.column-action,
>>>> diff --git a/ui/css/src/modules/_network.scss
>>>> b/ui/css/src/modules/_network.scss
>>>> index 4627ab5..ab47c89 100644
>>>> --- a/ui/css/src/modules/_network.scss
>>>> +++ b/ui/css/src/modules/_network.scss
>>>> @@ -93,18 +93,21 @@
>>>> }
>>>>
>>>> > span.column-interface {
>>>> - width: 10.3896%;
>>>> + width: 15.3896%;
>>>> + padding-right: 40px;
>>>> + white-space: nowrap;
>>>> + overflow: hidden;
>>>> + text-overflow: ellipsis;
>>>> }
>>>>
>>>> > span.column-space {
>>>> - width: 30%;
>>>> + width: 25%;
>>>> }
>>>>
>>>> > span.column-action {
>>>> width: 25.909%;
>>>> text-align: right;
>>>> }
>>>> -
>>>> }
>>>>
>>>> .wok-datagrid > .wok-datagrid-body > .wok-datagrid-row > span {
>>>> diff --git a/ui/js/src/kimchi.network.js b/ui/js/src/kimchi.network.js
>>>> index 381449d..ac6bf74 100644
>>>> --- a/ui/js/src/kimchi.network.js
>>>> +++ b/ui/js/src/kimchi.network.js
>>>> @@ -35,6 +35,7 @@ kimchi.initNetwork = function() {
>>>> kimchi.initNetworkListView = function() {
>>>> $('.wok-mask').removeClass('hidden');
>>>> kimchi.listNetworks(function(data) {
>>>> + $('[data-toggle="tooltip"]').tooltip();
>>>> for (var i = 0; i < data.length; i++) {
>>>> var network = {
>>>> name : data[i].name,
>>>> @@ -46,7 +47,8 @@ kimchi.initNetworkListView = function() {
>>>> } else {
>>>> network.type = data[i].connection;
>>>> }
>>>> - network.interface = data[i].interfaces ?
>>>> data[i].interfaces[0] : null;
>>>> + network.interface = data[i].interfaces ?
>>>> data[i].interfaces : null;
>>>> + network.interface.join();
>>>> network.addrSpace = data[i].subnet ? data[i].subnet :
>>>> null;
>>>> network.persistent = data[i].persistent;
>>>> kimchi.addNetworkItem(network);
>>>> diff --git a/ui/pages/tabs/network.html.tmpl
>>>> b/ui/pages/tabs/network.html.tmpl
>>>> index 6ddabaa..7e2825d 100644
>>>> --- a/ui/pages/tabs/network.html.tmpl
>>>> +++ b/ui/pages/tabs/network.html.tmpl
>>>> @@ -85,11 +85,11 @@
>>>> </div>
>>>> <div id="modalWindow" class="modal fade network-modal"
>>>> tabindex="-1" role="dialog" aria-labelledby="networkModalLabel"
>>>> aria-hidden="true"> </div>
>>>> <script id="networkItem" type="text/html">
>>>> - <div id='{name}' class='wok-nw-grid-body
>>>> remove-when-logged-off '>
>>>> + <div id='{name}' class='wok-nw-grid-body remove-when-logged-off'>
>>>> <span class='column-state' val="{state}"><span
>>>> class='network-state {state}'><i class="fa fa-power-off"></i><span
>>>> class="wok-nw-loading-icon"></span></span></span><!--
>>>> --><span class='column-name' title="{name}"
>>>> val="{name}">{name}</span><!--
>>>> --><span class='column-type'
>>>> val="{type}">{type}</span><!--
>>>> - --><span class='column-interface'
>>>> val="{interface}">{interface}</span><!--
>>>> + --><span class='column-interface'
>>>> data-placement="top" data-toggle="tooltip" title="{interface}"
>>>> val="{interface}">{interface}</span><!--
>>>> --><span class='column-space'
>>>> val="{addrSpace}">{addrSpace}</span><!--
>>>> --><span class='column-action'
>>>> style="display:none">
>>>> <span class="pull-right">
>>>
>>
>
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.ovirt.org/pipermail/kimchi-devel/attachments/20160531/0ab1950a/attachment.html>
-------------- next part --------------
A non-text attachment was scrubbed...
Name: not available
Type: image/jpeg
Size: 13171 bytes
Desc: not available
URL: <http://lists.ovirt.org/pipermail/kimchi-devel/attachments/20160531/0ab1950a/attachment.jpe>
-------------- next part --------------
A non-text attachment was scrubbed...
Name: not available
Type: image/jpeg
Size: 15169 bytes
Desc: not available
URL: <http://lists.ovirt.org/pipermail/kimchi-devel/attachments/20160531/0ab1950a/attachment-0001.jpe>
More information about the Kimchi-devel
mailing list