2546: Endow Workspace Resources Explorer with filtering and display features

Task-Url: https://support.d4science.org/issues/2546

Added tooltip in order to display item name tooltip for item shown in the grid
Added parameter to Resource Explorer constructor to sort by column passed

git-svn-id: https://svn.d4science.research-infrastructures.eu/gcube/trunk/portlets/widgets/workspace-explorer@128813 82a268e6-3cf1-43bd-a215-b396298e98cf
This commit is contained in:
Francesco Mangiacrapa 2016-05-25 10:04:00 +00:00
parent a4a0cec916
commit 3069c1440d
6 changed files with 158 additions and 75 deletions

View File

@ -83,7 +83,7 @@ public class WorkspaceExplorerController implements EventHandler {
public WorkspaceExplorerController(FilterCriteria filterCriteria, String heightPanel) {
bindEvents();
//As default all items are showable and selectable
wsExplorer = new WorkspaceExplorer(eventBus, filterCriteria, ItemType.values(), ItemType.values(), null, false);
wsExplorer = new WorkspaceExplorer(eventBus, filterCriteria, ItemType.values(), ItemType.values(), null, false, null);
workspaceExplorerPanel = new WorkspaceExplorerPanel(5, wsExplorer.getPanel(), breadcrumbs, navigation, heightPanel);
}
@ -101,7 +101,7 @@ public class WorkspaceExplorerController implements EventHandler {
public WorkspaceExplorerController(FilterCriteria filterCriteria, List<String> showProperties, String heightPanel) {
bindEvents();
//As default all items are showable and selectable
wsExplorer = new WorkspaceExplorer(eventBus, filterCriteria, ItemType.values(), ItemType.values(), showProperties, false);
wsExplorer = new WorkspaceExplorer(eventBus, filterCriteria, ItemType.values(), ItemType.values(), showProperties, false, null);
workspaceExplorerPanel = new WorkspaceExplorerPanel(5, wsExplorer.getPanel(), breadcrumbs, navigation, heightPanel);
}

View File

@ -22,18 +22,13 @@ import org.gcube.portlets.widgets.wsexplorer.shared.FilterCriteria;
import org.gcube.portlets.widgets.wsexplorer.shared.Item;
import org.gcube.portlets.widgets.wsexplorer.shared.ItemType;
import com.github.gwtbootstrap.client.ui.Alert;
import com.github.gwtbootstrap.client.ui.Button;
import com.github.gwtbootstrap.client.ui.constants.AlertType;
import com.github.gwtbootstrap.client.ui.constants.ButtonType;
import com.google.gwt.core.shared.GWT;
import com.google.gwt.event.dom.client.ClickEvent;
import com.google.gwt.event.dom.client.ClickHandler;
import com.google.gwt.dom.client.Element;
import com.google.gwt.dom.client.Style;
import com.google.gwt.event.shared.HandlerManager;
import com.google.gwt.user.client.rpc.AsyncCallback;
import com.google.gwt.user.client.ui.DockPanel;
import com.google.gwt.user.client.ui.HorizontalPanel;
import com.google.gwt.user.client.ui.ScrollPanel;
import com.google.gwt.user.client.ui.VerticalPanel;
@ -49,21 +44,67 @@ public class WorkspaceResourcesExplorerPanel extends DockPanel implements HasWor
private Breadcrumbs breadcrumbs = new Breadcrumbs(eventBus);
private boolean isSelect = false;
private String captionTxt;
private Alert alertConfirm;
// private WorkspaceExplorerController controller;
private List<WorskpaceExplorerSelectNotificationListener> listeners = new ArrayList<WorskpaceExplorerSelectNotificationListener>();
private VerticalPanel mainVP = new VerticalPanel();
private HorizontalPanel footerHP = new HorizontalPanel();
private WorkspaceExplorer wsExplorer;
private ScrollPanel centerScrollable = new ScrollPanel();
private ScrollPanel southPanel = new ScrollPanel();
private VerticalPanel centerScrollable = new VerticalPanel();
// private ScrollPanel southPanel = new ScrollPanel();
private String folderId;
private String folderName;
private List<String> showProperties;
private FilterCriteria filterCriteria;
private final int offsetBreadcrumb = 40;
/* (non-Javadoc)
* @see com.google.gwt.user.client.ui.Widget#onLoad()
*/
@Override
protected void onLoad() {
// TODO Auto-generated method stub
super.onLoad();
Element parent = getParent().getElement();
if(parent==null){
GWT.log("WorkspaceResourcesExplorerPanel parent is null");
}else{
GWT.log("WorkspaceResourcesExplorerPanel parent exists");
Style style = parent.getStyle();
if(style==null){
GWT.log("WorkspaceResourcesExplorerPanel style is null");
}else{
GWT.log("WorkspaceResourcesExplorerPanel style exists");
String height = style.getHeight();
GWT.log("WorkspaceResourcesExplorerPanel read height from parent: "+height);
if(height!=null && !height.isEmpty() && height.contains("px")){
String purgedHeight = height.replaceAll("px", "");
int heightToInt = Integer.parseInt(purgedHeight);
int newH = heightToInt-offsetBreadcrumb;
GWT.log("Set new height to center panel: "+newH);
wsExplorer.getPanel().setHeight(newH+"px");
}else
GWT.log("WorkspaceResourcesExplorerPanel read invalid height from parent!");
}
}
// wsExplorer.getPanel().addStyleName("adaptiveHeight");
}
/**
* Sets the height to internal scroll.
*
* @param height the new height to internal scroll
*/
public void setHeightToInternalScroll(int height){
if(height>0){
int newH = height-offsetBreadcrumb;
GWT.log("Set new height to center panel: "+newH);
wsExplorer.getPanel().setHeight(newH+"px");
}
}
/**
* Instantiates a new workspace folder explorer panel.
*
@ -72,7 +113,7 @@ public class WorkspaceResourcesExplorerPanel extends DockPanel implements HasWor
* @throws Exception the exception
*/
public WorkspaceResourcesExplorerPanel(String folderId, String folderName) throws Exception {
initExplorer(folderId, folderName, ItemType.values(), ItemType.values(), null, null, false);
initExplorer(folderId, folderName, ItemType.values(), ItemType.values(), null, null, false, null);
}
/**
@ -87,9 +128,9 @@ public class WorkspaceResourcesExplorerPanel extends DockPanel implements HasWor
if(showOnlyFolders){
ItemType[] itemsType = new ItemType[1];
itemsType[0] = ItemType.FOLDER;
initExplorer(folderId, "", itemsType, itemsType, null, null, false);
initExplorer(folderId, "", itemsType, itemsType, null, null, false, null);
}else{
initExplorer(folderId, "", ItemType.values(), ItemType.values(), null, null, false);
initExplorer(folderId, "", ItemType.values(), ItemType.values(), null, null, false, null);
}
}
@ -107,9 +148,9 @@ public class WorkspaceResourcesExplorerPanel extends DockPanel implements HasWor
if(showOnlyFolders){
ItemType[] itemsType = new ItemType[1];
itemsType[0] = ItemType.FOLDER;
initExplorer(folderId, "", itemsType, itemsType, showProperties, filter, false);
initExplorer(folderId, "", itemsType, itemsType, showProperties, filter, false, null);
}else{
initExplorer(folderId, "", ItemType.values(), ItemType.values(), showProperties, filter, false);
initExplorer(folderId, "", ItemType.values(), ItemType.values(), showProperties, filter, false, null);
}
}
@ -121,16 +162,17 @@ public class WorkspaceResourcesExplorerPanel extends DockPanel implements HasWor
* @param showProperties the show properties - show the input properties as column/s
* @param filter the filter - get only workspace item/s with input key=value like GcubeProperty
* @param showGcubeInfo the show gcube info - if true shows all the properties associated to a file (or a gcube item) by opening a popup window when clicking on the item
* @param sortByColumn the sort by column
* @throws Exception the exception
*/
public WorkspaceResourcesExplorerPanel(String folderId, boolean showOnlyFolders, List<String> showProperties, FilterCriteria filter, boolean showGcubeInfo) throws Exception {
public WorkspaceResourcesExplorerPanel(String folderId, boolean showOnlyFolders, List<String> showProperties, FilterCriteria filter, boolean showGcubeInfo, DISPLAY_FIELD sortByColumn) throws Exception {
if(showOnlyFolders){
ItemType[] itemsType = new ItemType[1];
itemsType[0] = ItemType.FOLDER;
initExplorer(folderId, "", itemsType, itemsType, showProperties, filter, showGcubeInfo);
initExplorer(folderId, "", itemsType, itemsType, showProperties, filter, showGcubeInfo, sortByColumn);
}else{
initExplorer(folderId, "", ItemType.values(), ItemType.values(), showProperties, filter, showGcubeInfo);
initExplorer(folderId, "", ItemType.values(), ItemType.values(), showProperties, filter, showGcubeInfo, sortByColumn);
}
}
@ -145,15 +187,16 @@ public class WorkspaceResourcesExplorerPanel extends DockPanel implements HasWor
* @param showProperties the show properties
* @param filter the filter
* @param showGcubeInfo the show gcube info - shows all the properties associated to a file (or a gcube item) stored into related gcube item by opening a popup window when clicking on the item
* @param sortByColumn the sort by column
* @throws Exception the exception
*/
private void initExplorer(String folderId, String folderName, ItemType[] selectableTypes, ItemType[] showableTypes, List<String> showProperties, FilterCriteria filter, boolean showGcubeInfo) throws Exception{
private void initExplorer(String folderId, String folderName, ItemType[] selectableTypes, ItemType[] showableTypes, List<String> showProperties, FilterCriteria filter, boolean showGcubeInfo, DISPLAY_FIELD sortByColumn) throws Exception{
this.folderId = folderId;
this.folderName = folderName;
this.showProperties = showProperties;
this.filterCriteria = filter;
bindEvents();
wsExplorer = new WorkspaceExplorer(eventBus, filter, showableTypes, selectableTypes, showProperties, showGcubeInfo, new DISPLAY_FIELD[]{DISPLAY_FIELD.ICON, DISPLAY_FIELD.NAME, DISPLAY_FIELD.CREATION_DATE});
wsExplorer = new WorkspaceExplorer(eventBus, filter, showableTypes, selectableTypes, showProperties, showGcubeInfo, sortByColumn, new DISPLAY_FIELD[]{DISPLAY_FIELD.ICON, DISPLAY_FIELD.NAME, DISPLAY_FIELD.CREATION_DATE});
Item item = new Item(folderId, folderName, true);
wsExplorer.loadFolder(item, true);
initPanel("");
@ -257,7 +300,7 @@ public class WorkspaceResourcesExplorerPanel extends DockPanel implements HasWor
* Clear more info.
*/
private void clearMoreInfo(){
southPanel.clear();
// southPanel.clear();
}
/**
@ -272,25 +315,28 @@ public class WorkspaceResourcesExplorerPanel extends DockPanel implements HasWor
add(breadcrumbs, DockPanel.NORTH);
// centerScrollable.setSize(width+"px", height);
setAlertConfirm("", false, null);
// setAlertConfirm("", false, null);
mainVP.add(wsExplorer.getPanel());
mainVP.add(footerHP);
centerScrollable.add(mainVP);
// mainVP.add(wsExplorer.getPanel());
// mainVP.add(footerHP);
centerScrollable.add(wsExplorer.getPanel());
// centerScrollable.getElement().getStyle().setOverflowY(Overflow.SCROLL);
// wsExplorer.getPanel().setHeight("200px");
// wsExplorer.getPanel().getElement().getStyle().setOverflowY(Overflow.SCROLL);
add(centerScrollable, DockPanel.CENTER);
add(footerHP, DockPanel.SOUTH);
// wsExplorer.getItTables().getCellTable().getElement().getStyle().setOverflow(Overflow.VISIBLE);
// add(footerHP, DockPanel.SOUTH);
}
/**
* Sets the alert confirm.
*
* @param html the html
* @param show the show
* @param item the item
* @param selected the selected
*/
private void setAlertConfirm(String html, boolean show, final Item item){
/*private void setAlertConfirm(String html, boolean show, final Item item){
try{
footerHP.remove(alertConfirm);
}catch(Exception e){
@ -328,7 +374,7 @@ public class WorkspaceResourcesExplorerPanel extends DockPanel implements HasWor
alertConfirm.add(yes);
alertConfirm.add(no);
footerHP.insert(alertConfirm,0);
}
}*/
/**
* Notify selected item.
*

View File

@ -63,22 +63,23 @@ public class WorkspaceExplorer implements ShowableTypes, SelectableTypes{
/**
* Instantiates a new workspace explorer - This is the base constructor
* Instantiates a new workspace explorer - This is the base constructor.
*
* @param eventBus the event bus
* @param showableTypes the showable types
* @param selectableTypes the selectable types
* @param displayProperties the display properties
* @param showGcubeInfo the show gcube info
* @param fields the fields
* @param sortByColumn the sort by column
* @param fields the columns to display
*/
private WorkspaceExplorer(HandlerManager eventBus, ItemType[] showableTypes, ItemType[] selectableTypes, List<String> displayProperties, boolean showGcubeInfo, DISPLAY_FIELD[] fields){
private WorkspaceExplorer(HandlerManager eventBus, ItemType[] showableTypes, ItemType[] selectableTypes, List<String> displayProperties, boolean showGcubeInfo, DISPLAY_FIELD sortByColumn, DISPLAY_FIELD[] fields){
this.eventBus = eventBus;
this.showGcubeItemsInfo = showGcubeInfo;
setShowableTypes(showableTypes);
setSelectableTypes(selectableTypes);
explorerPanel = new ScrollPanel();
itTables = new ItemsTable<Item>(eventBus, true, fields, displayProperties, showGcubeItemsInfo);
itTables = new ItemsTable<Item>(eventBus, true, fields, displayProperties, showGcubeItemsInfo, sortByColumn);
}
/**
@ -87,10 +88,10 @@ public class WorkspaceExplorer implements ShowableTypes, SelectableTypes{
* @param eventBus the event bus
* @param showableTypes the showable types
* @param selectableTypes the selectable types
* @param fields the fields
* @param fields the columns to display
*/
public WorkspaceExplorer(HandlerManager eventBus, ItemType[] showableTypes, ItemType[] selectableTypes, DISPLAY_FIELD...fields) {
this(eventBus, showableTypes, selectableTypes, null, false, fields);
this(eventBus, showableTypes, selectableTypes, null, false, null, fields);
// itTables = new ItemsTable<Item>(eventBus, true, fields, null, showGcubeItemsInfo);
}
@ -101,10 +102,10 @@ public class WorkspaceExplorer implements ShowableTypes, SelectableTypes{
* @param showableTypes the showable types
* @param selectableTypes the selectable types
* @param displayProperties the display properties
* @param fields the fields
* @param fields the columns to display
*/
public WorkspaceExplorer(HandlerManager eventBus, ItemType[] showableTypes, ItemType[] selectableTypes, List<String> displayProperties, DISPLAY_FIELD...fields) {
this(eventBus, showableTypes, selectableTypes, displayProperties, false, fields);
this(eventBus, showableTypes, selectableTypes, displayProperties, false, null, fields);
}
@ -117,10 +118,11 @@ public class WorkspaceExplorer implements ShowableTypes, SelectableTypes{
* @param selectableTypes the selectable types
* @param displayProperties the display properties
* @param showGcubeInfo the show gcube info
* @param fields the fields
* @param sortByColumn the sort by column
* @param fields the columns to display
*/
public WorkspaceExplorer(HandlerManager eventBus, FilterCriteria filterCriteria, ItemType[] showableTypes, ItemType[] selectableTypes, List<String> displayProperties, boolean showGcubeInfo, DISPLAY_FIELD...fields) {
this(eventBus, showableTypes, selectableTypes, displayProperties, showGcubeInfo, fields);
public WorkspaceExplorer(HandlerManager eventBus, FilterCriteria filterCriteria, ItemType[] showableTypes, ItemType[] selectableTypes, List<String> displayProperties, boolean showGcubeInfo, DISPLAY_FIELD sortByColumn, DISPLAY_FIELD...fields) {
this(eventBus, showableTypes, selectableTypes, displayProperties, showGcubeInfo, sortByColumn, fields);
this.filterCriteria = filterCriteria;
}

View File

@ -59,8 +59,9 @@ public abstract class AbstractItemsCellTable<T> {
this.eventBus = eventBus;
this.showMoreInfo = fireOnClick;
cellTable = new CellTable<T>(1, CellTableResources.INSTANCE);
cellTable.addStyleName("table-overflow");
cellTable.addStyleName("table-vertical-middle");
cellTable.addStyleName("table-explorer");
// cellTable.getElement().getStyle().setOverflow(Overflow.HIDDEN);
cellTable.addStyleName("table-explorer-vertical-middle");
cellTable.setStriped(true);
cellTable.setCondensed(true);
cellTable.setWidth("100%", true);

View File

@ -64,6 +64,7 @@ public class ItemsTable<T extends Item> extends AbstractItemsCellTable<T> implem
private Column<T, Date> dateColumn;
private List<String> displayProperties;
private boolean showGcubeItemsInfo;
private DISPLAY_FIELD startSortByColumn;
/**
* Instantiates a new items table.
@ -74,8 +75,9 @@ public class ItemsTable<T extends Item> extends AbstractItemsCellTable<T> implem
* @param displayProperties the display properties
* @param showGcubeItemsInfo
*/
public ItemsTable(HandlerManager eventBus, boolean showMoreInfo, DISPLAY_FIELD[] fields, List<String> displayProperties, boolean showGcubeItemsInfo) {
public ItemsTable(HandlerManager eventBus, boolean showMoreInfo, DISPLAY_FIELD[] fields, List<String> displayProperties, boolean showGcubeItemsInfo, DISPLAY_FIELD startSortByColumn) {
super(eventBus, showMoreInfo);
this.startSortByColumn = startSortByColumn;
setDisplayFields(fields);
setDisplayProperties(displayProperties);
setShowGcubeItemsInfo(showGcubeItemsInfo);
@ -149,15 +151,25 @@ public class ItemsTable<T extends Item> extends AbstractItemsCellTable<T> implem
}
if(this.displayFields.contains(DISPLAY_FIELD.NAME)){
//NAME
name = new TextColumn<T>() {
@Override
public String getValue(T object) {
return ((Item) object).getName();
}
//ADDING TOOLTIP
@Override
public void render(com.google.gwt.cell.client.Cell.Context context, T object, SafeHtmlBuilder sb) {
sb.appendHtmlConstant("<div title=\""+((Item) object).getName()+"\">");
super.render(context, object, sb);
sb.appendHtmlConstant("</div>");
};
};
name.setSortable(true);
cellTable.addColumn(name, "Name");
// double width = displayFields.size()>1?50:90;
@ -255,10 +267,8 @@ public class ItemsTable<T extends Item> extends AbstractItemsCellTable<T> implem
if(!(o2 instanceof Item))
return 1;
Item e1 = o1;
Item e2 = o2;
String v1 = e1.getGcubeProperties().get(column);
String v2 = e2.getGcubeProperties().get(column);
@ -319,6 +329,24 @@ public class ItemsTable<T extends Item> extends AbstractItemsCellTable<T> implem
cellTable.setColumnWidth(showGcubeInfoClm, 32.0, Unit.PX);
}
if(startSortByColumn!=null)
switch (startSortByColumn) {
case NAME:
if(this.displayFields.contains(DISPLAY_FIELD.NAME))
cellTable.getColumnSortList().push(name);
break;
case OWNER:
if(this.displayFields.contains(DISPLAY_FIELD.OWNER))
cellTable.getColumnSortList().push(owner);
break;
case CREATION_DATE:
if(this.displayFields.contains(DISPLAY_FIELD.CREATION_DATE))
cellTable.getColumnSortList().push(dateColumn);
break;
default:
break;
}
/*final SingleSelectionModel<Item> selectionModel = new SingleSelectionModel<Item>();
selectionModel.addSelectionChangeHandler(new Handler() {
@Override

View File

@ -12,7 +12,6 @@
/* div.input-append > input, div.input-append > textarea, div.input-append > select, div.input-append > .uneditable-input { */
/* margin-bottom: 0; */
/* } */
.gwt-PopupPanel .gwt-DatePicker {
width: 200px;
}
@ -69,7 +68,7 @@
vertical-align: middle;
}
.form-inline input:FOCUS{
.form-inline input:FOCUS {
border-color: rgba(82, 168, 236, 0.8);
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px
rgba(82, 168, 236, 0.6);
@ -81,11 +80,11 @@
}
/**** GWT DIALOG NEW STYLE****/
.gwt-DialogBoxNew{
.gwt-DialogBoxNew {
border: 8px solid #EEEEEE;
border-radius: 6px 6px 6px 6px;
box-shadow: none;
/* line-height: 7px; */
/* line-height: 7px; */
opacity: 1;
z-index: 2000;
background-color: #FFFFFF;
@ -101,7 +100,6 @@
font-size: 14px;
}
.gwt-DialogBoxNew table {
width: 100%;
}
@ -153,38 +151,46 @@
}
/**** END GWT DIALOG NEW STYLE ****/
/*** TABLE ***/
.table-overflow td, th {
.table-explorer td, th {
overflow: hidden !important;
}
.table-vertical-middle td, th {
.table-explorer th {
text-align: center !important;
}
.table-explorer-vertical-middle td, th {
height: 50%;
vertical-align: middle !important;
}
.table-overflow th{
text-align: center !important;
}
.gcube-item-table{
.gcube-item-table {
margin-top: 10px;
margin-bottom: 10px;
margin-bottom: 10px;
}
.gcube-item-table td{
border-bottom: 1px solid #EEEEEE;
height: 50%;
text-align: center;
vertical-align: middle;
padding: 5px;
.gcube-item-table td {
border-bottom: 1px solid #EEEEEE;
height: 50%;
text-align: center;
vertical-align: middle;
padding: 5px;
}
.gcube-item-table-header{
.gcube-item-table-header {
text-align: center;
font-weight: bold;
}
/******* END TABLE ********/
/******* END TABLE ********/
/* .adaptiveHeight {
Firefox
height: -moz-calc(100% - 40px);
WebKit
height: -webkit-calc(100% - 40px);
Opera
height: -o-calc(100% - 40px);
Standard
height: calc(100% - 40px);
} */