updated css and icons

git-svn-id: http://svn.research-infrastructures.eu/public/d4science/gcube/trunk/portlets/user/notifications@148910 82a268e6-3cf1-43bd-a215-b396298e98cf

.classpath

@@ -1,12 +1,12 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <classpath>
-	<classpathentry kind="src" output="target/notifications-2.3.0-SNAPSHOT/WEB-INF/classes" path="src/main/java">
+	<classpathentry kind="src" output="target/notifications-2.4.0-SNAPSHOT/WEB-INF/classes" path="src/main/java">
 		<attributes>
 			<attribute name="optional" value="true"/>
 			<attribute name="maven.pomderived" value="true"/>
 		</attributes>
 	</classpathentry>
-	<classpathentry excluding="**" kind="src" output="target/notifications-2.3.0-SNAPSHOT/WEB-INF/classes" path="src/main/resources">
+	<classpathentry excluding="**" kind="src" output="target/notifications-2.4.0-SNAPSHOT/WEB-INF/classes" path="src/main/resources">
 		<attributes>
 			<attribute name="maven.pomderived" value="true"/>
 		</attributes>
@@ -35,8 +35,9 @@
 	</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="maven.pomderived" value="true"/>
+			<attribute name="owner.project.facets" value="java"/>
 		</attributes>
 	</classpathentry>
-	<classpathentry kind="output" path="target/notifications-2.3.0-SNAPSHOT/WEB-INF/classes"/>
+	<classpathentry kind="con" path="com.google.gwt.eclipse.core.GWT_CONTAINER"/>
+	<classpathentry kind="output" path="target/notifications-2.4.0-SNAPSHOT/WEB-INF/classes"/>
 </classpath>

.settings/org.eclipse.wst.common.project.facet.core.xml

@@ -2,7 +2,7 @@
 <faceted-project>
   <fixed facet="wst.jsdt.web"/>
   <installed facet="wst.jsdt.web" version="1.0"/>
-  <installed facet="java" version="1.7"/>
   <installed facet="liferay.portlet" version="6.0"/>
   <installed facet="jst.web" version="3.0"/>
+  <installed facet="java" version="1.7"/>
 </faceted-project>

.tern-project

@@ -1 +1,17 @@
-{"ide":{"scriptPaths":[]},"plugins":{"aui":{},"liferay":{},"yui":{}},"libs":["ecma5","browser"]}
+{
+  "plugins": {
+    "aui": {
+      
+    },
+    "liferay": {
+      
+    },
+    "yui": {
+      
+    }
+  },
+  "libs": [
+    "ecma5",
+    "browser"
+  ]
+}

pom.xml

@@ -13,7 +13,7 @@
 	<groupId>org.gcube.portlets.user</groupId>
 	<artifactId>notifications</artifactId>
 	<packaging>war</packaging>
-	<version>2.3.0-SNAPSHOT</version>
+	<version>2.4.0-SNAPSHOT</version>
 	<name>gCube Notifications Portlet</name>
 
 	<properties>
@@ -21,7 +21,7 @@
 		<gwtVersion>2.7.0</gwtVersion>
 		<distroDirectory>distro</distroDirectory>
 		<maven.compiler.source>1.7</maven.compiler.source>
-		<maven.compiler.target>1.7</maven.compiler.target>
+		<maven.compiler.target>1.8</maven.compiler.target>
 		<webappDirectory>${project.build.directory}/${project.build.finalName}</webappDirectory>
 		<liferay.version>6.2.5</liferay.version>
 		<project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>
@@ -42,13 +42,13 @@
 		<dependency>
 			<groupId>com.google.gwt</groupId>
 			<artifactId>gwt-user</artifactId>
-			<version>2.7.0</version>
+			<version>${gwtVersion}</version>
 			<scope>provided</scope>
 		</dependency>
 		<dependency>
 			<groupId>com.google.gwt</groupId>
 			<artifactId>gwt-servlet</artifactId>
-			<version>2.7.0</version>
+			<version>${gwtVersion}</version>
 			<scope>provided</scope>
 		</dependency>
 		<dependency>
@@ -86,7 +86,7 @@
 		<dependency>
 			<groupId>org.gcube.core</groupId>
 			<artifactId>common-scope-maps</artifactId>
-			<scope>provided</scope>
+			<scope>compile</scope>
 		</dependency>
 		<dependency>
 			<groupId>org.gcube.dvos</groupId>
@@ -162,8 +162,8 @@
 				<artifactId>maven-compiler-plugin</artifactId>
 				<version>2.3.2</version>
 				<configuration>
-					<source>1.7</source>
-					<target>1.7</target>
+					<source>${maven.compiler.source}</source>
+					<target>${maven.compiler.target}</target>
 				</configuration>
 			</plugin>
 			<!-- SA Plugin -->

src/main/java/org/gcube/portlets/user/notifications/client/view/templates/SingleNotificationView.java

@@ -6,18 +6,16 @@ import org.gcube.portal.databook.client.util.Encoder;
 import org.gcube.portal.databook.shared.Notification;
 import org.gcube.portal.databook.shared.NotificationType;
 import org.gcube.portlets.user.gcubewidgets.client.elements.Span;
-import org.gcube.portlets.user.notifications.client.view.templates.images.NotificationImages;
 
+import com.github.gwtbootstrap.client.ui.Icon;
 import com.google.gwt.core.client.GWT;
 import com.google.gwt.i18n.client.DateTimeFormat;
-import com.google.gwt.resources.client.ImageResource;
 import com.google.gwt.uibinder.client.UiBinder;
 import com.google.gwt.uibinder.client.UiField;
 import com.google.gwt.user.client.Window.Location;
 import com.google.gwt.user.client.ui.Composite;
 import com.google.gwt.user.client.ui.HTML;
 import com.google.gwt.user.client.ui.HTMLPanel;
-import com.google.gwt.user.client.ui.Image;
 import com.google.gwt.user.client.ui.Widget;
 
 /**
@@ -27,6 +25,7 @@ import com.google.gwt.user.client.ui.Widget;
 public class SingleNotificationView extends Composite {
 
 	private final static  String LINK_TEXT = "likes your post: shared a link. ";
+	private static final String ICON_SIZE = " fa-lg";
 
 	private static NotificationsDayUiBinder uiBinder = GWT
 			.create(NotificationsDayUiBinder.class);
@@ -35,10 +34,7 @@ public class SingleNotificationView extends Composite {
 	UiBinder<Widget, SingleNotificationView> {
 	}
 
-	NotificationImages images = GWT.create(NotificationImages.class);
-
-	@UiField
-	Image notificationImage;
+	@UiField Icon notificationIcon;
 	@UiField HTMLPanel mainPanel;
 	@UiField Span notificationText;
 	@UiField Span timeArea;
@@ -50,6 +46,9 @@ public class SingleNotificationView extends Composite {
 		if (!toShow.isRead()) {
 			mainPanel.addStyleName("unread-notification");
 		}
+		notificationIcon.setStyleName(new StringBuffer(getIconType(toShow.getType())).append(ICON_SIZE).toString());
+		notificationIcon.addStyleName("icon-color");
+		
 		String notificationToShow = toShow.getDescription();
 		GWT.log(notificationToShow);
 		String removeMarkup = notificationToShow.replaceAll("&amp;", "&").replaceAll("&lt;","<").replaceAll("&gt;",">");
@@ -77,7 +76,6 @@ public class SingleNotificationView extends Composite {
 
 		timeArea.setHTML(DateTimeFormat.getFormat("h:mm a").format(toShow.getTime()));
 
-		notificationImage.setResource(getImageType(toShow.getType()));
 
 		switch (toShow.getType()) {
 		case MENTION:
@@ -115,49 +113,55 @@ public class SingleNotificationView extends Composite {
 		}
 	}
 
-	private ImageResource getImageType(NotificationType type) {
+	private String getIconType(NotificationType type) {
 		switch (type) {
 		case LIKE:
-			return images.like();
+			return "fa fa-thumbs-o-up";
 		case COMMENT:
-			return images.comment();
+			return "fa-comment-o";
 		case MENTION:
-			return images.mention();
+			return "fa fa-tag";
 		case MESSAGE:
-			return images.message();
+			return "fa-envelope-o";
 		case WP_FOLDER_ADDEDUSER:
+			return "fa fa-user-plus";
 		case WP_FOLDER_REMOVEDUSER:
+			return "fa-user-times";
 		case WP_FOLDER_SHARE:
+			return "fa fa-folder-open-o";
 		case WP_ITEM_NEW:
+			return "fa-file-text-o";
 		case WP_ITEM_DELETE:
+			return "fa fa-trash-o";
 		case WP_ITEM_UPDATED:
-			return images.share();
+			return "fa fa-files-o";
 		case WP_FOLDER_UNSHARE:
-			return images.unshare();
+			return "fa fa-times-circle-o";
 		case OWN_COMMENT:
-			return images.comment();
+			return "fa-comment-o";
 		case REQUEST_CONNECTION:
-			return images.connectionRequest();
+			return "fa fa-plug";
 		case JOB_COMPLETED_NOK:
-			return images.jobNOK();
+			return "fa fa-exclamation-triangle";
 		case JOB_COMPLETED_OK:
-			return images.jobOK();
+			return "fa fa-check";
 		case CALENDAR_ADDED_EVENT:
-			return images.calendar();
+			return "fa fa-calendar";
 		case CALENDAR_UPDATED_EVENT:
-			return images.calendarEdit();
+			return "fa fa-calendar";
 		case CALENDAR_DELETED_EVENT:
-			return images.calendarDelete();
+			return "fa fa-calendar";
 		case POST_ALERT:
-			return images.postAlert();
+			return "fa fa-rss";
 		case TDM_TAB_RESOURCE_SHARE:
 		case TDM_RULE_SHARE:
 		case TDM_TEMPLATE_SHARE:
-			return images.tableShare();
+			return "fa fa-table";
 		default:
-			return images.generic();
+			return "fa fa-share-alt-square";
 		}
 	}
+	
 	public static String extractOrgFriendlyURL(String portalURL) {
 		String groupRegEx = "/group/";
 		if (portalURL.contains(groupRegEx)) {

src/main/java/org/gcube/portlets/user/notifications/client/view/templates/SingleNotificationView.ui.xml

@@ -6,12 +6,12 @@
 	<g:HTMLPanel ui:field="mainPanel">
 		<b:Row>
 			<b:Column size="1">
-				<b:Image styleName="notification-photo" url=""
-					ui:field="notificationImage" width="30" height="30" />
+				<b:Icon type="APPLE" ui:field="notificationIcon"></b:Icon>
 			</b:Column>
 
 			<b:Column size="1">
 				<e:Span styleName="user-notification-time" ui:field="timeArea" />
+
 			</b:Column>
 
 			<b:Column size="10">

src/main/resources/org/gcube/portlets/user/notifications/Notifications.gwt.xml

@@ -2,7 +2,7 @@
 <module rename-to='notifications'>
 	<!-- Inherit the core Web Toolkit stuff. -->
 	<inherits name='com.google.gwt.user.User' />
-	<add-linker name="xsiframe" />
+
 	<!-- To Comment out -->
 	<!-- <set-property name="user.agent" value="gecko1_8" /> -->
 
@@ -22,5 +22,6 @@
 	<!-- Specify the paths for translatable code -->
 	<source path='client' />
 	<source path='shared' />
-
+	
+	<add-linker name="xsiframe" />
 </module>

src/main/webapp/Notifications.css

@@ -7,6 +7,10 @@ div.portlet-content {
 	padding-top: 0px;
 }
 
+.row {
+    margin-top: 10px;
+}
+
 .notification-btn {
 	font: 16px "Helvetica Neue", Helvetica, Arial, sans-serif;
 	font-style: normal;
@@ -39,7 +43,7 @@ div.portlet-content {
 a.link, a.link:active, a.link:visited {
 	font-family: 'Lucida Grande', Verdana, 'Bitstream Vera Sans', Arial,
 		sans-serif;
-	font-size: 12px;
+	font-size: 14px;
 	cursor: pointer;
 	cursor: hand;
 	text-decoration: none;
@@ -51,6 +55,13 @@ a.link:hover {
 	text-decoration: underline;
 }
 
+.icon-color {
+	color: #3B5998;
+	padding: 2px;
+	border: none;
+	margin-left: 20px;
+}
+
 .new-notifications-show {
 	opacity: 1;
 	background: #D6E2FC;
@@ -70,7 +81,7 @@ a.link:hover {
 	color: #444444;
 	font-family: 'Lucida Grande', Verdana, 'Bitstream Vera Sans', Arial,
 		sans-serif;
-	font-size: 14px;
+	font-size: 16px;
 	font-weight: bold;
 	line-height: 13px;
 	padding-bottom: 5px;
@@ -100,10 +111,10 @@ a.link:hover {
 }
 
 .user-notification-time {
-	color: #999;
+	color: #666;
 	font-family: 'Lucida Grande', Verdana, 'Bitstream Vera Sans', Arial,
 		sans-serif;
-	font-size: 12px;
+	font-size: 14px;
 	padding: 1px;
 	white-space: nowrap;
 }
@@ -121,7 +132,7 @@ a.link:hover {
 	color: #333;
 	font-family: 'Lucida Grande', Verdana, 'Bitstream Vera Sans', Arial,
 		sans-serif;
-	font-size: 12px;
+	font-size: 14px;
 	border-color: #999;
 	border-width: 1px;
 	letter-spacing: normal;

src/main/webapp/Notifications.html

@@ -8,22 +8,13 @@
 <html>
   <head>
     <meta http-equiv="content-type" content="text/html; charset=UTF-8">
-
+	<title>Notifications</title>
     <!--                                                               -->
     <!-- Consider inlining CSS to reduce the number of requested files -->
     <!--                                                               -->
     <link type="text/css" rel="stylesheet" href="Notifications.css">
-
-    <!--                                           -->
-    <!-- Any title is fine                         -->
-    <!--                                           -->
-    <title>Web Application Starter Project</title>
-
-    <!--                                           -->
-    <!-- This script loads your compiled module.   -->
-    <!-- If you add any GWT meta tags, they must   -->
-    <!-- be added before this line.                -->
-    <!--                                           -->
+	<link rel="stylesheet" href="fa/css/font-awesome.min.css">	
+   
     <script type="text/javascript" language="javascript" src="notifications/notifications.nocache.js"></script>
   </head>
 

src/main/webapp/WEB-INF/jsp/Notifications_view.jsp

@@ -7,9 +7,10 @@
 
 <portlet:defineObjects />
 --%>
-<script type="text/javascript" src="<%=request.getContextPath()%>/notifications/js/jquery-1.10.1.min.js"></script>
 <script type="text/javascript" src="<%=request.getContextPath()%>/notifications/js/bootstrap.min.js"></script>
 
+
+
 <script type="text/javascript" language="javascript" src='<%=request.getContextPath()%>/notifications/notifications.nocache.js'></script>
 <div id="notificationsDIV"></div>
 

src/main/webapp/WEB-INF/liferay-portlet.xml

@@ -6,9 +6,10 @@
 		<portlet-name>Notifications</portlet-name>
 		<layout-cacheable>false</layout-cacheable>
 		<instanceable>false</instanceable>
-		<ajaxable>false</ajaxable> 
+		<ajaxable>false</ajaxable>
+		<header-portlet-css>/fa/css/font-awesome.min.css</header-portlet-css>
 		<!-- LOCATION CSS HERE -->
-        <header-portlet-css>/Notifications.css</header-portlet-css>
+		<header-portlet-css>/Notifications.css</header-portlet-css>
 	</portlet>
 	<role-mapper>
 		<role-name>administrator</role-name>