redesigned sort by comments / posts

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

src/main/java/org/gcube/portlets/user/newsfeed/client/panels/NewsFeedPanel.java

@@ -356,6 +356,7 @@ public class NewsFeedPanel extends Composite {
 					//filterPanelWrapper.setVisible(getFeedToShowId() == null);
 					showFeedTimelineSource = result.isShowTimelineSourceLabel();
 					isInfrastructure = true;
+					filterPanelWrapper.setVisible(getFeedToShowId() == null);
 				}
 			}		
 		});

src/main/java/org/gcube/portlets/user/newsfeed/client/ui/FilterPanel.java

@@ -5,6 +5,7 @@ import org.gcube.portlets.user.newsfeed.client.NewsServiceAsync;
 import org.gcube.portlets.user.newsfeed.client.panels.NewsFeedPanel;
 import org.gcube.portlets.user.newsfeed.shared.UserSettings;
 
+import com.github.gwtbootstrap.client.ui.Dropdown;
 import com.github.gwtbootstrap.client.ui.NavLink;
 import com.google.gwt.core.client.GWT;
 import com.google.gwt.event.dom.client.ClickEvent;
@@ -29,6 +30,9 @@ public class FilterPanel extends Composite {
 	
 	NewsFeedPanel caller;
 	NewsServiceAsync service;
+	@UiField NavLink allUpdatesLink;
+	@UiField NavLink recentCommentsLink;
+	@UiField Dropdown sortByDD;
 
 	public FilterPanel(NewsFeedPanel caller, NewsServiceAsync newsService) {
 		initWidget(uiBinder.createAndBindUi(this));
@@ -36,10 +40,6 @@ public class FilterPanel extends Composite {
 		this.service = newsService;
 	}
 
-	@UiField
-	NavLink allUpdatesLink;
-	@UiField
-	NavLink recentCommentsLink;
 
 	public void removeFilterSelected() {
 		allUpdatesLink.setActive(false);
@@ -48,8 +48,9 @@ public class FilterPanel extends Composite {
 	
 	@UiHandler("recentCommentsLink")
 	void onRecentCommentsLinkClick(ClickEvent e) {
-		allUpdatesLink.setActive(false);
-		recentCommentsLink.setActive(true);
+		allUpdatesLink.setDisabled(false);
+		recentCommentsLink.setDisabled(true);
+		sortByDD.setText("newest Comment");
 		caller.setCurrentFilter(FilterType.RECENT_COMMENTS);
 		int loadedPostsInView = caller.getAllUpdatesSize() + 1;
 		int quantity = loadedPostsInView < 100 ? 100 - loadedPostsInView : loadedPostsInView;
@@ -58,8 +59,9 @@ public class FilterPanel extends Composite {
 	
 	@UiHandler("allUpdatesLink")
 	void onAllUpdatesClick(ClickEvent e) {
-		allUpdatesLink.setActive(true);
-		recentCommentsLink.setActive(false);
+		allUpdatesLink.setDisabled(true);
+		recentCommentsLink.setDisabled(false);	
+		sortByDD.setText("newest 	Post");
 		caller.setCurrentFilter(FilterType.ALL_UPDATES);
 		service.getUserSettings(new AsyncCallback<UserSettings>() {
 			@Override

src/main/java/org/gcube/portlets/user/newsfeed/client/ui/FilterPanel.ui.xml

@@ -3,15 +3,17 @@
 	xmlns:g="urn:import:com.google.gwt.user.client.ui" xmlns:b="urn:import:com.github.gwtbootstrap.client.ui">
 	<ui:style>
 	.margin {
-		margin-bottom: 0 !important; 
-		margin-top: 0 !important; ;
+		margin-bottom: 0 !important;
+		margin-top: -15px !important;
 	}
 	</ui:style>
-	<g:HTMLPanel>
+	<g:HTMLPanel ui:field="mainPanel">
 		<b:NavPills addStyleNames="{style.margin}">
-			<b:NavLink disabled="true">Sort by newest:</b:NavLink>
-			<b:NavLink active="true"  ui:field="allUpdatesLink">Post</b:NavLink>
-			<b:NavLink  ui:field="recentCommentsLink">Commented post</b:NavLink>
+			<b:NavLink disabled="true">Show sorted by:</b:NavLink>
+			<b:Dropdown ui:field="sortByDD"	text="newest Post">
+				<b:NavLink disabled="true" ui:field="allUpdatesLink">newest Post</b:NavLink>
+				<b:NavLink ui:field="recentCommentsLink">newest Comment</b:NavLink>
+			</b:Dropdown>
 		</b:NavPills>
 	</g:HTMLPanel>
 </ui:UiBinder> 

src/main/webapp/NewsFeed.css

@@ -9,6 +9,19 @@ table {
 	font-size: 20px;
 }
 
+#newsfeedDIV .nav .dropdown-toggle .caret {
+    margin-top: 5px !important;
+	border-top: 7px solid #000;
+    border-right: 7px solid transparent;
+    border-left: 7px solid transparent;	
+    border-top-color: #08c;
+    order-bottom-color: #08c;
+}
+
+#newsfeedDIV .nav-pills > li.disabled > a {
+   padding-right: 0;
+}
+
 .image-preview-attachment {
 	align: left !important;
 	margin: 5px !important;