1280: Workspace GUI: quote and available feature improvements

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

Added following How-To: share, upload, public link

Updated pom version at 6.10

git-svn-id: http://svn.d4science-ii.research-infrastructures.eu/gcube/trunk/portlets/user/workspace@120176 82a268e6-3cf1-43bd-a215-b396298e98cf
This commit is contained in:
Francesco Mangiacrapa 2015-11-03 15:36:20 +00:00
parent b6c136fa7b
commit 504dc4f539
4 changed files with 79 additions and 41 deletions

View File

@ -11,7 +11,7 @@
<groupId>org.gcube.portlets.user</groupId> <groupId>org.gcube.portlets.user</groupId>
<artifactId>workspace</artifactId> <artifactId>workspace</artifactId>
<packaging>war</packaging> <packaging>war</packaging>
<version>6.9.0-SNAPSHOT</version> <version>6.10.0-SNAPSHOT</version>
<name>gCube Workspace Portlet</name> <name>gCube Workspace Portlet</name>
<description> <description>
gcube Workspace Portlet is a portlet for users workspace management gcube Workspace Portlet is a portlet for users workspace management

View File

@ -3,6 +3,8 @@
*/ */
package org.gcube.portlets.user.workspace.client.view; package org.gcube.portlets.user.workspace.client.view;
import org.gcube.portlets.user.workspace.client.resources.Resources;
import com.github.gwtbootstrap.client.ui.Label; import com.github.gwtbootstrap.client.ui.Label;
import com.github.gwtbootstrap.client.ui.Popover; import com.github.gwtbootstrap.client.ui.Popover;
import com.github.gwtbootstrap.client.ui.constants.Placement; import com.github.gwtbootstrap.client.ui.constants.Placement;
@ -12,6 +14,7 @@ import com.google.gwt.uibinder.client.UiBinder;
import com.google.gwt.uibinder.client.UiField; import com.google.gwt.uibinder.client.UiField;
import com.google.gwt.user.client.ui.Composite; import com.google.gwt.user.client.ui.Composite;
import com.google.gwt.user.client.ui.FlowPanel; import com.google.gwt.user.client.ui.FlowPanel;
import com.google.gwt.user.client.ui.HasVerticalAlignment;
import com.google.gwt.user.client.ui.HorizontalPanel; import com.google.gwt.user.client.ui.HorizontalPanel;
import com.google.gwt.user.client.ui.Widget; import com.google.gwt.user.client.ui.Widget;
@ -23,24 +26,33 @@ import com.google.gwt.user.client.ui.Widget;
public class WorkspaceFeatures extends Composite { public class WorkspaceFeatures extends Composite {
@UiField @UiField
Label ws_quote_alert; HorizontalPanel ws_features;
@UiField
FlowPanel ws_features;
@UiField @UiField
HorizontalPanel hp_feautures; HorizontalPanel hp_feautures;
@UiField @UiField
Label dnd; com.google.gwt.user.client.ui.Label how_to;
@UiField @UiField
Label plk; Label ws_quote;
private Popover overDnD = new Popover(); @UiField
Label shf; //Share Folders & Files
private Popover overShF= new Popover();
@UiField
Label upl; //DRAG & DROP
private Popover overUpload = new Popover();
@UiField
Label plk; //PUBLIC LINK
private Popover overPlk = new Popover(); private Popover overPlk = new Popover();
@UiField @UiField
FlowPanel fp1; FlowPanel fp1;
@ -59,7 +71,7 @@ public class WorkspaceFeatures extends Composite {
* 2015 * 2015
*/ */
interface WorkspaceFeaturesUiBinder extends interface WorkspaceFeaturesUiBinder extends
UiBinder<Widget, WorkspaceFeatures> { UiBinder<Widget, WorkspaceFeatures> {
} }
/** /**
@ -68,34 +80,64 @@ public class WorkspaceFeatures extends Composite {
public WorkspaceFeatures() { public WorkspaceFeatures() {
initWidget(uiBinder.createAndBindUi(this)); initWidget(uiBinder.createAndBindUi(this));
hp_feautures.setVerticalAlignment(HasVerticalAlignment.ALIGN_MIDDLE);
ws_features.setVerticalAlignment(HasVerticalAlignment.ALIGN_MIDDLE);
hp_feautures.setCellWidth(fp1, "33%"); hp_feautures.setCellWidth(fp1, "33%");
hp_feautures.setCellWidth(fp2, "33%"); hp_feautures.setCellWidth(fp2, "33%");
hp_feautures.setCellWidth(fp3, "33%"); hp_feautures.setCellWidth(fp3, "33%");
fp3.getElement().getStyle().setTextAlign(com.google.gwt.dom.client.Style.TextAlign.RIGHT); how_to.addStyleName("margin-right-10");
initPopupDndFeature(); shf.addStyleName("margin-right-10");
upl.addStyleName("margin-right-10");
plk.addStyleName("margin-right-10");
initPopupShareFeature();
initPopupUploadFeature();
initPopupPlkFeature(); initPopupPlkFeature();
// ws_features.add
} }
/** /**
* *
*/ */
private void initPopupDndFeature() { private void initPopupShareFeature() {
overDnD.setAnimation(true); overShF.setAnimation(false);
overDnD.setWidget(dnd); overShF.setWidget(shf);
overDnD.setHeading("Workspace DnD"); overShF.setHeading("Workspace Share Folders and Files");
overDnD.setText("Drag & Drop your files from Desktop to upload to Workspace"); String icon = "<span style=\"margin-right:5px\">"+Resources.getIconShareFolder().getSafeHtml().asString()+"</span>";
overDnD.setPlacement(Placement.TOP); overShF.setText(icon+"The quickest way to share something is using the Share Folder. Locate the folder with the files you want to share and then click 'Share'");
overDnD.setTrigger(Trigger.HOVER); overShF.setHtml(true);
overDnD.reconfigure(); overShF.setPlacement(Placement.TOP);
overShF.setTrigger(Trigger.HOVER);
overShF.reconfigure();
}
/**
*
*/
private void initPopupUploadFeature() {
overUpload.setAnimation(false);
overUpload.setWidget(upl);
overUpload.setHeading("Workspace Upload Files and Archives");
String iconUploadDND = "<span style=\"margin-right:5px\">"+Resources.getIconHand().getSafeHtml().asString()+"</span>";
String iconUploadFile = "<span style=\"margin-right:5px\">"+Resources.getIconFileUpload().getSafeHtml().asString()+"</span>";
String iconUploadArchive = "<span style=\"margin-right:5px\">"+Resources.getIconArchiveUpload().getSafeHtml().asString()+"</span>";
overUpload.setText("You can upload files in the Workspace in several ways:<br/>"
+iconUploadDND+ "1 - Drop your files from Desktop;<br/>"
+iconUploadFile+ "2 - Click 'Upload' and Browse Files;<br/>"
+iconUploadArchive+ "3 - Upload a zip file to unzip directly its content in the Workspace.<br/>");
overUpload.setHtml(true);
overUpload.setPlacement(Placement.TOP);
overUpload.setTrigger(Trigger.HOVER);
overUpload.reconfigure();
// overImgUpload.show(); // overImgUpload.show();
} }
private void initPopupPlkFeature() { private void initPopupPlkFeature() {
overPlk.setAnimation(true); overPlk.setAnimation(false);
overPlk.setWidget(plk); overPlk.setWidget(plk);
overPlk.setHeading("Workspace Public Link"); overPlk.setHeading("Workspace Public Link");
overPlk.setText("Create links to files in your Workspace to download them. You can send the links to anyone by pasting them into Workspace Message, your emails, instant messages, etc."); String icon = "<span style=\"margin-right:5px\">"+Resources.getIconPublicLink().getSafeHtml().asString()+"</span>";
overPlk.setText(icon+"Create links to files in your Workspace to download them. You can send the links to anyone by pasting them into Workspace Message, your emails, instant messages, etc.");
overPlk.setHtml(true);
overPlk.setPlacement(Placement.TOP); overPlk.setPlacement(Placement.TOP);
overPlk.setTrigger(Trigger.HOVER); overPlk.setTrigger(Trigger.HOVER);
overPlk.reconfigure(); overPlk.reconfigure();
@ -106,28 +148,21 @@ public class WorkspaceFeatures extends Composite {
* @param html * @param html
*/ */
public void updateQuotes(String html) { public void updateQuotes(String html) {
ws_quote_alert.setText(html); ws_quote.setText(html);
} }
// public void showImgUploadDnD(boolean show) {
// if (show)
// overImgUpload.show();
// else
// overImgUpload.hide();
// }
/** /**
* @param bool * @param bool
*/ */
public void setQuoteVisible(boolean bool) { public void setQuoteVisible(boolean bool) {
ws_quote_alert.setVisible(bool); ws_quote.setVisible(bool);
} }
/** /**
* @param bool * @param bool
*/ */
public void setDndFeatureVisible(boolean bool) { public void setDndFeatureVisible(boolean bool) {
dnd.setVisible(bool); upl.setVisible(bool);
} }
} }

View File

@ -5,15 +5,18 @@
<b:Alert close="false" animation="false"> <b:Alert close="false" animation="false">
<g:HorizontalPanel ui:field="hp_feautures" width="100%"> <g:HorizontalPanel ui:field="hp_feautures" width="100%">
<g:FlowPanel ui:field="fp1"> <g:FlowPanel ui:field="fp1">
<b:Label ui:field="ws_quote_alert" type="INFO"></b:Label> <b:Label ui:field="ws_quote" type="INFO"></b:Label>
</g:FlowPanel> </g:FlowPanel>
<g:FlowPanel ui:field="fp2"> <g:FlowPanel ui:field="fp2">
</g:FlowPanel> </g:FlowPanel>
<g:FlowPanel ui:field="fp3"> <g:FlowPanel ui:field="fp3">
<g:FlowPanel ui:field="ws_features"> <g:HorizontalPanel ui:field="ws_features" verticalAlignment="middle">
<b:Label ui:field="dnd" text="DnD" styleName="margin-right-5"></b:Label> <g:Label ui:field="how_to">How-to:</g:Label>
<b:Label ui:field="plk" text="PlK" styleName="margin-right-5"></b:Label> <b:Label ui:field="shf" text="Share"></b:Label>
</g:FlowPanel> <b:Label ui:field="plk" text="Public Link"></b:Label>
<b:Label ui:field="upl" text="Upload"></b:Label>
<!-- <b:Label ui:field="upa" text="Upload Archive"></b:Label> -->
</g:HorizontalPanel>
</g:FlowPanel> </g:FlowPanel>
</g:HorizontalPanel> </g:HorizontalPanel>
</b:Alert> </b:Alert>

View File

@ -391,6 +391,6 @@
width: 33%; width: 33%;
} }
.margin-right-5{ .margin-right-10{
margin-right: 5px; margin-right: 10px;
} }