[ovirt-devel] Sortable columns in UI

[Michal Kenneth]

I must chime in as well (for old time sake … :) 
Nice to see things evolving in the GUI - this one specifically was there from day ONE.

Great work, Vojtech!!!

Miki

On May 13, 2014, at 8:06 PM, Vojtech Szocs <vszocs at redhat.com> wrote:

> Thanks Malini & Einav :-)
> 
> Indeed, the patch only adds the necessary infrastructure; sorting must be
> enabled for individual columns (either server-side or client-side sorting).
> 
> Currently, sort icon (triangle) is positioned to the left of column header
> text. Alternatively, it could be positioned to the right-corner of column
> header, but this would interfere with resize area (mouse area where cursor
> changes, indicating that user can click and drag to resize).
> 
> Each column that supports sorting uses following (default) styling:
> - mouse move over the header
>  -> text color changes from black to dark grey
>  -> cursor changes to "hand" (CSS cursor:pointer)
> - using default GWT CellTable triangle icon
> 
> (Above default styling can be changed anytime.)
> 
> Vojtech
> 
> 
> ----- Original Message -----
>> From: "Einav Cohen" <ecohen at redhat.com>
>> To: "Vojtech Szocs" <vszocs at redhat.com>, "Malini Rao" <mrao at redhat.com>
>> Cc: devel at ovirt.org
>> Sent: Tuesday, May 13, 2014 4:54:38 PM
>> Subject: Re: [ovirt-devel] Sortable columns in UI
>> 
>> Many thanks, Vojtech, for making it happen - it is highly appreciated!
>> Clarifying that, to my understanding, just the infrastructure is in
>> place - there aren't any sortable columns in the GUI yet. In order
>> to turn columns in the GUI to sortable, need to follow Vojtech's
>> instructions below for each relevant column.
>> 
>> ----
>> Thanks,
>> Einav
>> 
>> ----- Original Message -----
>>> From: "Malini Rao" <mrao at redhat.com>
>>> To: "Vojtech Szocs" <vszocs at redhat.com>
>>> Cc: devel at ovirt.org
>>> Sent: Tuesday, May 13, 2014 10:48:44 AM
>>> Subject: Re: [ovirt-devel] Sortable columns in UI
>>> 
>>> Yay!!!! Thank you for making this happen. This is a basic need that users
>>> have talked to me about in almost all UX conversations I have had so far!
>>> 
>>> ----- Original Message -----
>>> From: "Vojtech Szocs" <vszocs at redhat.com>
>>> To: devel at ovirt.org
>>> Sent: Tuesday, May 13, 2014 10:37:51 AM
>>> Subject: [ovirt-devel] Sortable columns in UI
>>> 
>>> Hey guys,
>>> 
>>> oVirt UI has been missing column sort functionality for quite a while
>>> now, but here's some good news.
>>> 
>>> I've just merged patch [1] that adds support for both server-side and
>>> client-side sorting of table columns. This patch adds the necessary
>>> infra/API; column sorting must be enabled per-column for given table,
>>> just like with column resizing.
>>> 
>>> [1] http://gerrit.ovirt.org/#/c/25910/
>>> 
>>> Currently, only TextColumnWithTooltip (and its subclasses) support
>>> sorting, however this can easily be changed in future by having the
>>> column class extend SortableColumn.
>>> 
>>> To enable sorting:
>>> 
>>>  // Enables server-side sorting via search query
>>>  // ... SORTBY name ASC|DESC
>>>  column.makeSortable("name"); // consider using shared constant
>>> 
>>>  -or-
>>> 
>>>  // Enables client-side sorting using comparator
>>>  column.makeSortable(comparator);
>>> 
>>> In order for server-side sorting to work properly, corresponding
>>> SearchableListModel must apply the search options while executing
>>> "Search" query.
>>> 
>>> For example, in DataCenterListModel:
>>> 
>>>  @Override
>>>  public boolean supportsServerSideSorting() {
>>>    // Default is false
>>>    return true;
>>>  }
>>> 
>>>  @Override
>>>  protected void syncSearch() {
>>>    // Append "SORTBY" clause to search query
>>>    String search = applySortOptions(getSearchString());
>>>    ...
>>>  }
>>> 
>>> If a model doesn't support server-side sorting, client-side sorting
>>> will be used as fall back (assuming a comparator was provided).
>>> 
>>> In general, all main tab list models in WebAdmin utilize "Search"
>>> query, so we can enable server-side sorting for columns that exist
>>> within main tab tables.
>>> 
>>> As for sub tabs (whose list models generally don't use "Search"
>>> query, but also don't support paging at the moment), these can
>>> simply use client-side sorting, i.e. reuse existing comparators
>>> defined in Linq class.
>>> 
>>> PS: I've attached a screenshot depicting sorted column in action.
>>> 
>>> Regards,
>>> Vojtech
>>> 
>>> _______________________________________________
>>> Devel mailing list
>>> Devel at ovirt.org
>>> http://lists.ovirt.org/mailman/listinfo/devel
>>> _______________________________________________
>>> Devel mailing list
>>> Devel at ovirt.org
>>> http://lists.ovirt.org/mailman/listinfo/devel
>>> 
>> 
> _______________________________________________
> Devel mailing list
> Devel at ovirt.org
> http://lists.ovirt.org/mailman/listinfo/devel