added general guided tour

git-svn-id: http://svn.research-infrastructures.eu/public/d4science/gcube/trunk/portlets/user/my-vres@94489 82a268e6-3cf1-43bd-a215-b396298e98cf
This commit is contained in:
Massimiliano Assante 2014-04-07 16:55:00 +00:00
parent 09f14eff62
commit 82d3711da5
18 changed files with 376 additions and 21 deletions

View File

@ -1,6 +1,6 @@
<?xml version="1.0" encoding="UTF-8"?>
<classpath>
<classpathentry kind="src" output="target/my-vres-1.1.0-SNAPSHOT/WEB-INF/classes" path="src/main/java">
<classpathentry kind="src" output="target/my-vres-1.2.0-SNAPSHOT/WEB-INF/classes" path="src/main/java">
<attributes>
<attribute name="optional" value="true"/>
<attribute name="maven.pomderived" value="true"/>
@ -27,8 +27,8 @@
</classpathentry>
<classpathentry kind="con" path="org.eclipse.jdt.launching.JRE_CONTAINER/org.eclipse.jdt.internal.debug.ui.launcher.StandardVMType/JavaSE-1.7">
<attributes>
<attribute name="owner.project.facets" value="java"/>
<attribute name="maven.pomderived" value="true"/>
</attributes>
</classpathentry>
<classpathentry kind="output" path="target/my-vres-1.1.0-SNAPSHOT/WEB-INF/classes"/>
<classpathentry kind="output" path="target/my-vres-1.2.0-SNAPSHOT/WEB-INF/classes"/>
</classpath>

View File

@ -1,5 +1,5 @@
eclipse.preferences.version=1
jarsExcludedFromWebInfLib=
lastWarOutDir=/Users/massi/Documents/workspace/my-vres/target/my-vres-1.1.0-SNAPSHOT
lastWarOutDir=/Users/massi/Documents/workspace/my-vres/target/my-vres-1.2.0-SNAPSHOT
warSrcDir=src/main/webapp
warSrcDirIsOutput=false

View File

@ -1,10 +1,12 @@
<?xml version="1.0" encoding="UTF-8"?>
<project-modules id="moduleCoreId" project-version="1.5.0">
<?xml version="1.0" encoding="UTF-8"?><project-modules id="moduleCoreId" project-version="1.5.0">
<wb-module deploy-name="${module}">
<wb-resource deploy-path="/" source-path="/target/m2e-wtp/web-resources"/>
<wb-resource deploy-path="/" source-path="/src/main/webapp" tag="defaultRootSource"/>
<wb-resource deploy-path="/WEB-INF/classes" source-path="/src/main/java"/>
<wb-resource deploy-path="/WEB-INF/classes" source-path="/target/generated-sources/gwt"/>
<dependent-module archiveName="guided-tour-widget-1.5.0-SNAPSHOT.jar" deploy-path="/WEB-INF/lib" handle="module:/resource/guided-tour-widget/guided-tour-widget">
<dependency-type>uses</dependency-type>
</dependent-module>
<property name="java-output-path" value="/${module}/target/www/WEB-INF/classes"/>
<property name="context-root" value="my-vres"/>
</wb-module>

12
pom.xml
View File

@ -13,7 +13,7 @@
<groupId>org.gcube.portlet.user</groupId>
<artifactId>my-vres</artifactId>
<packaging>war</packaging>
<version>1.1.0-SNAPSHOT</version>
<version>1.2.0-SNAPSHOT</version>
<name>My VREs Portlet</name>
<description>
gCube My VREs Portlet shows only the VO and VREs a user is member of.
@ -72,11 +72,21 @@
<artifactId>custom-portal-handler</artifactId>
<scope>provided</scope>
</dependency>
<dependency>
<groupId>org.gcube.applicationsupportlayer</groupId>
<artifactId>accesslogger</artifactId>
</dependency>
<dependency>
<groupId>org.gcube.applicationsupportlayer</groupId>
<artifactId>aslcore</artifactId>
<scope>provided</scope>
</dependency>
<dependency>
<groupId>org.gcube.portlets.widgets</groupId>
<artifactId>guided-tour-widget</artifactId>
<version>[1.4.0-SNAPSHOT, 2.0.0-SNAPSHOT)</version>
<scope>compile</scope>
</dependency>
<dependency>
<groupId>com.liferay.portal</groupId>
<artifactId>portal-service</artifactId>

View File

@ -1,6 +1,14 @@
package org.gcube.portlet.user.my_vres.client;
import org.gcube.portlet.user.my_vres.client.resources.TourResources;
import org.gcube.portlets.widgets.guidedtour.client.GCUBEGuidedTour;
import org.gcube.portlets.widgets.guidedtour.client.GuidedTourResourceProvider;
import org.gcube.portlets.widgets.guidedtour.resources.client.GuidedTourResource;
import com.google.gwt.core.client.EntryPoint;
import com.google.gwt.core.client.GWT;
import com.google.gwt.core.client.RunAsyncCallback;
import com.google.gwt.user.client.Window;
import com.google.gwt.user.client.ui.RootPanel;
/**
@ -13,6 +21,24 @@ public class MyVREs implements EntryPoint {
*/
public void onModuleLoad() {
RootPanel.get("myVREsDIV").add(new VresPanel());
showGuidedTour();
}
private void showGuidedTour() {
GWT.runAsync(GCUBEGuidedTour.class, new RunAsyncCallback() {
public void onSuccess() {
GCUBEGuidedTour.showTour(MyVREs.class.getName(), new GuidedTourResourceProvider() {
@Override
public GuidedTourResource getResource() {
TourResources resources = GWT.create(TourResources.class);
return resources.quickTour();
}
});
}
public void onFailure(Throwable caught) {
Window.alert("Could not check show tour");
}
});
}
}

View File

@ -6,7 +6,7 @@
You are not subscribed to anything,
begin by
<a class="vrelink" href="/group/data-e-infrastructure-gateway/join-new/"><span class="important">joining</span></a> something. <br /><br />
<a class="vrelink" href="/group/data-e-infrastructure-gateway/join-new/"><span class="important">Find out</span></a> the what is available in the infrastructure!
<a class="vrelink" href="/group/data-e-infrastructure-gateway/join-new/"><span class="important">Find out</span></a> the what is available in the infrastructure.
</div>
</g:HTMLPanel>
</ui:UiBinder>

View File

@ -0,0 +1,155 @@
<!-- this is your main configuration XML (example name GuidedTour.xml), the
source tag have to link this file: -->
<guidedtour width="780" height="450" usemask="false">
<title>Social Collaboration Facilities</title>
<guide>http://goo.gl/SXwcjh
</guide>
<themecolor>BLUE</themecolor>
<steps>
<step showTitle="true" v-alignment="ALIGN_TOP">
<title>Overview</title>
<bodies>
<body><![CDATA[
<div style="line-height: 19px; padding: 10px; font-size: 14px; ">
<div style="padding-bottom: 40px;">
<b>Social Networking </b>
and <b>Shared Workspace</b> services are features of this social collaboration portal you should know about.
</div>
<div style="padding-bottom: 40px;"><b>Social networking</b> services realize a shared status wall where users can post messages and share links and files with their coworkers.</div>
<div style="padding-bottom: 40px;">
The <a href="/group/data-e-infrastructure-gateway/workspace" target="_blank"><b>Shared Workspace</b></a>, is a service for managing files in the cloud. Through the workspace you can manage, upload and delete files as you wish.
You can <b>share folders</b> with any users you would so as to maximize collaboration among members.
</div>
<div style="padding-bottom: 10px;">
Discover more about the Collaboration Facilities through this quick tour, click next.
</div>
</div>
]]>
</body>
</bodies>
<images>
<image url="images/tour/1.png" />
</images>
</step>
<step showTitle="true" v-alignment="ALIGN_TOP">
<title>The Dockbar</title>
<bodies>
<body><![CDATA[
<div style="line-height: 19px; padding: 10px; font-size: 14px; ">
<div style="padding-bottom: 10px;">
The Dockbar is <b>very important</b>, it is always on the top of the page and contains 4 icons (links) always accessible as shown in the figure.
</div>
<div style="padding-bottom: 10px;">
Each icon points to a <b>key application of the System</b>, please take few seconds to locate them (on your top-left corner of the page).
</div>
<div style="padding-top: 10px;">
<ul style="list-style-type: circle; padding-left: 10px;">
<li><b>Home Social</b> is the page behind this tour and contains your personalized news feed;</li>
<li><b>Workspace</b> is the application for sharing your data and for your private cloud storage;</li>
<li><b>Messages</b> allows you to exchange private messages with the other users of the System;</li>
<li><b>Notifications</b> keeps you up-to-date to what is happening and it is related to you. To know how to <b>tune/change how you get notified</b> see the next step.</b> </li>
</ul>
</div>
<div style="padding-top: 10px;">
<b>Please note:</b> whenever you receive a new notification or message the related icon gets red.
</div>
</div>
]]>
</body>
</bodies>
<images>
<image url="images/tour/2.png" />
</images>
</step>
<step showTitle="false" v-alignment="ALIGN_MIDDLE">
<title>Notification Settings</title>
<bodies>
<body><![CDATA[
<div style="line-height: 19px; padding: 10px; font-size: 14px; ">
<div style="padding-bottom: 10px;">
To open the <b>Notification Settings</b> go to the <a href="/group/data-e-infrastructure-gateway/notifications" target="_blank">Notifications Page</a>
and click Notification Settings (top-right). See the red rectangle in the figure to locate the settings.
</div>
</div>
]]>
</body>
<body><![CDATA[
<div style="line-height: 19px; padding: 10px; font-size: 14px; ">
<div style="padding-bottom: 20px;">
<b>Notification Settings</b> are very <b>fine grained</b>. For each Notification generated by the System you can choose <b>whether to and how to</b> get notified.
</div>
<div style="padding-bottom: 10px;">
For each type of notification you can choose to be notified through this <b>portal</b>, via <b>email</b> or <b>none</b> by clicking off. By default almost all the notification types are set to ON.
</div>
</div>
]]>
</body>
</bodies>
<images>
<image url="images/tour/3.jpg" />
<image url="images/tour/4.jpg" />
</images>
</step>
<step showTitle="false" v-alignment="ALIGN_MIDDLE">
<title>Posting News</title>
<bodies>
<body><![CDATA[
<div style="line-height: 19px; padding: 10px; font-size: 14px; ">
<div style="padding-bottom: 40px;">
When <b>posting a news</b> you can use some useful features:
<div style="padding-top: 15px;">
If you <b>paste a link</b> the System will try to create a preview of it.
</div>
<div style="padding-top: 15px;">
If you want to <b>post a file</b> instead use the attachment icon and pick the file from your disk.
</div>
<div style="padding-top: 15px;">
You can also use the “@” to <b>mention</b> someone. In this case the mentioned user will receive a notification.
</div>
<div style="padding-top: 15px;">
Finally, if you want <b>everyone in a group to be notified</b> about your update, select the +notification to members in the "Share with" dropdown menu.
They will receive a notification about your post, unless they decided not to in their settings.
</div>
</div>
</div>
]]>
</body>
</bodies>
<images>
<image url="images/tour/5.jpg" />
</images>
</step>
<step showTitle="false" v-alignment="ALIGN_MIDDLE">
<title>Join New</title>
<bodies>
<body><![CDATA[
<div style="padding-bottom: 40px;">
<div style="line-height: 19px; padding: 10px; font-size: 14px; ">
<div style="padding-bottom: 15px;">
You can check the <b>virtual environments</b> and the communities available on the System by clicking on Join New in the menu of the Social Home page:
</div>
<div style="padding-bottom: 15px;">
For each <b>virtual environment</b> you can ask to join.
Your request will be reviewed by a responsible person in the related community and approved (depending on the scope of the community).
</div>
<div style="padding-bottom: 15px;">
You will be notified whether your request will be approved or not via email. While the request is in the approval phase the related icon will be listed as pending.
</div>
</div>
<div style="line-height: 19px; padding: 10px; font-size: 14px; ">
<div style="padding-top: 1px;">
The tour is over, remember to click on the "Don't show this again" checkbox <b>located at the bottom of this window</b> to not make this popup appear in the future. Thank you for taking this tour.
</div>
</div>
</div>
]]>
</body>
</bodies>
<images>
<image url="images/tour/6.jpg" />
</images>
</step>
</steps>
</guidedtour>

View File

@ -0,0 +1,145 @@
<!-- this is your main configuration XML (example name GuidedTour.xml), the
source tag have to link this file: -->
<guidedtour width="780" height="450" usemask="false">
<title>Social Collaboration Facilities</title>
<guide>http://goo.gl/SXwcjh
</guide>
<themecolor>BLUE</themecolor>
<steps>
<step showTitle="true" v-alignment="ALIGN_TOP">
<title>Overview</title>
<bodies>
<body><![CDATA[
<div style="line-height: 19px; padding: 10px; font-size: 14px; ">
<div style="padding-bottom: 40px;">
<b>Social Networking </b>
and <b>Shared Workspace</b> services are features of this social collaboration portal you should know about.
</div>
<div style="padding-bottom: 40px;"><b>Social networking</b> services realize a shared status wall where users can post messages and share links and files with their coworkers.</div>
<div style="padding-bottom: 40px;">
The <a href="/group/data-e-infrastructure-gateway/workspace" target="_blank"><b>Shared Workspace</b></a>, is a service for managing files in the cloud. Through the workspace you can manage, upload and delete files as you wish.
You can <b>share folders</b> with any users you would so as to maximize collaboration among members.
</div>
<div style="padding-bottom: 10px;">
Discover more about the Collaboration Facilities through this quick tour, click next.
</div>
</div>
]]>
</body>
</bodies>
<images>
<image url="images/tour/1.png" />
</images>
</step>
<step showTitle="true" v-alignment="ALIGN_TOP">
<title>The Dockbar</title>
<bodies>
<body><![CDATA[
<div style="line-height: 19px; padding: 10px; font-size: 14px; ">
<div style="padding-bottom: 10px;">
The Dockbar is <b>very important</b>, it is always on the top of the page and contains 4 icons (links) always accessible as shown in the figure.
</div>
<div style="padding-bottom: 10px;">
Each icon points to a <b>key application of the System</b>, please take few seconds to locate them (on your top-left corner of the page).
</div>
<div style="padding-top: 10px;">
<ul style="list-style-type: circle; padding-left: 10px;">
<li><b>Home Social</b> is the page behind this tour and contains your personalized news feed;</li>
<li><b>Workspace</b> is the application for sharing your data and for your private cloud storage;</li>
<li><b>Messages</b> allows you to exchange private messages with the other users of the System;</li>
<li><b>Notifications</b> keeps you up-to-date to what is happening and it is related to you. To know how to <b>tune/change how you get notified</b> see the next step.</b> </li>
</ul>
</div>
<div style="padding-top: 10px;">
<b>Please note:</b> whenever you receive a new notification or message the related icon gets red.
</div>
</div>
]]>
</body>
</bodies>
<images>
<image url="images/tour/2.png" />
</images>
</step>
<step showTitle="false" v-alignment="ALIGN_MIDDLE">
<title>Notification Settings</title>
<bodies>
<body><![CDATA[
<div style="line-height: 19px; padding: 10px; font-size: 14px; ">
<div style="padding-bottom: 10px;">
To open the <b>Notification Settings</b> go to the <a href="/group/data-e-infrastructure-gateway/notifications" target="_blank">Notifications Page</a>
and click Notification Settings (top-right). See the red rectangle in the figure to locate the settings.
</div>
</div>
]]>
</body>
<body><![CDATA[
<div style="line-height: 19px; padding: 10px; font-size: 14px; ">
<div style="padding-bottom: 20px;">
<b>Notification Settings</b> are very <b>fine grained</b>. For each Notification generated by the System you can choose <b>whether to and how to</b> get notified.
</div>
<div style="padding-bottom: 10px;">
For each type of notification you can choose to be notified through this <b>portal</b>, via <b>email</b> or <b>none</b> by clicking off. By default almost all the notification types are set to ON.
</div>
</div>
]]>
</body>
</bodies>
<images>
<image url="images/tour/3.jpg" />
<image url="images/tour/4.jpg" />
</images>
</step>
<step showTitle="false" v-alignment="ALIGN_MIDDLE">
<title>Posting News</title>
<bodies>
<body><![CDATA[
<div style="line-height: 19px; padding: 10px; font-size: 14px; ">
<div style="padding-bottom: 40px;">
When <b>posting a news</b> you can use some useful features:
<div style="padding-top: 15px;">
If you <b>paste a link</b> the System will try to create a preview of it.
</div>
<div style="padding-top: 15px;">
If you want to <b>post a file</b> instead use the attachment icon and pick the file from your disk.
</div>
<div style="padding-top: 15px;">
You can also use the “@” to mention someone. In this case the mentioned user will receive a notification.
</div>
<div style="padding-top: 15px;">
Finally, if you want <b>everyone in a group to be notified</b> about your update, select the +notification to members in the "Share with" dropdown menu.
They will receive a notification about your post, unless they decided not to in their settings.
</div>
</div>
</div>
]]>
</body>
</bodies>
<images>
<image url="images/tour/5.jpg" />
</images>
</step>
<step showTitle="false" v-alignment="ALIGN_MIDDLE">
<title>Join New</title>
<bodies>
<body><![CDATA[
<div style="line-height: 19px; padding: 10px; font-size: 14px; ">
<div style="padding-bottom: 15px;">
You can check the <b>virtual environments</b> available on the System by clickin on Join New:
</div>
</div>
<div style="line-height: 19px; padding: 10px; font-size: 14px; ">
<div style="padding-top: 1px;">
The tour is over, remember to click on the "Don't show this again" checkbox <b>located at the bottom of this window</b> to not make this popup appear in the future. Thank you for taking this tour.
</div>
</div>
]]>
</body>
</bodies>
<images>
<image url="images/tour/5.jpg" />
</images>
</step>
</steps>
</guidedtour>

View File

@ -0,0 +1,12 @@
package org.gcube.portlet.user.my_vres.client.resources;
import org.gcube.portlets.widgets.guidedtour.resources.client.GuidedTourResource;
import com.google.gwt.resources.client.ClientBundle;
public interface TourResources extends ClientBundle {
@Source("GuidedTour.xml")
GuidedTourResource quickTour();
}

View File

@ -39,11 +39,10 @@ public class ClickableVRE extends HTML {
imageWidth = WIDTH - 20;
name = (vre.getName().length() > 23) ? vre.getName().substring(0, 23) : vre.getName();
imageUrl = vre.getImageURL();
this.setTitle("Enter this VRE");
int imageHeight = 95;
this.setTitle("Enter");
String html = "<div class=\"vreCaption\">" + name + "</div>";
html += "<div style=\"text-align:center\">" +
"<img width=\"" + imageWidth + "\" height=\"" + imageHeight +"\" src=\"" +imageUrl + "\" />" +
html += "<div style=\"display: table; text-align:center; width: 100%; height: 95px;\">" +
"<span style=\"vertical-align:middle; display: table-cell;\"><img style=\"width: " + imageWidth + "px;\" src=\"" +imageUrl + "\" /></span>" +
"</div>";
setHTML(html);
setStyleName("vreButton");

View File

@ -3,17 +3,12 @@
<!-- Inherit the core Web Toolkit stuff. -->
<inherits name='com.google.gwt.user.User' />
<!-- To Comment out -->
<!-- <set-property name="user.agent" value="gecko1_8" /> -->
<!-- <set-property name="user.agent" value="gecko1_8" /> -->
<!-- We need the JUnit module in the main module, -->
<!-- otherwise eclipse complains (Google plugin bug?) -->
<inherits name='com.google.gwt.junit.JUnit' />
<!-- Inherit the default GWT style sheet. You can change -->
<!-- the theme of your GWT application by uncommenting -->
<!-- any one of the following lines. -->
<!-- <inherits name='com.google.gwt.user.theme.chrome.Chrome'/> -->
<!-- <inherits name='com.google.gwt.user.theme.dark.Dark'/> -->
<!-- inherits GCUBE Quick tour -->
<inherits name='org.gcube.portlets.widgets.guidedtour.GuidedTour' />
<!-- Other module inherits -->
<!-- Specify the app entry point class. -->

View File

@ -16,6 +16,17 @@
<servlet-name>jUnitHostImpl</servlet-name>
<servlet-class>com.google.gwt.junit.server.JUnitHostImpl</servlet-class>
</servlet>
<!-- Quick Tour -->
<servlet>
<servlet-name>quicktourServlet</servlet-name>
<servlet-class>org.gcube.portlets.widgets.guidedtour.server.TourServiceImpl</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>quicktourServlet</servlet-name>
<url-pattern>/myvres/quicktourServlet</url-pattern>
</servlet-mapping>
<servlet-mapping>
<servlet-name>jUnitHostImpl</servlet-name>

Binary file not shown.

After

Width:  |  Height:  |  Size: 154 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 16 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 18 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 13 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 18 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 29 KiB