responsivness completed

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

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

@@ -65,6 +65,7 @@ import org.gcube.portlets.widgets.userselection.client.events.UsersFetchedEvent;
 import org.gcube.portlets.widgets.userselection.shared.ItemSelectableBean;
 import org.jsonmaker.gwt.client.base.Defaults;
 
+import com.github.gwtbootstrap.client.ui.Row;
 import com.google.gwt.core.client.GWT;
 import com.google.gwt.core.client.RunAsyncCallback;
 import com.google.gwt.dom.client.Document;
@@ -106,7 +107,7 @@ public class NewsFeedPanel extends Composite {
 	private HorizontalPanel filterPanelWrapper = new HorizontalPanel();
 	private FilterPanel filterPanel;
 	private SimplePanel newUpdatesPanel = new SimplePanel();
-	private VerticalPanel showMoreUpdatesPanel = new VerticalPanel();
+	private Row showMoreUpdatesPanel = new Row();
 	private VerticalPanel newsPanel = new VerticalPanel();
 
 	private NewFeedsAvailable newsFeedAlert;
@@ -262,7 +263,7 @@ public class NewsFeedPanel extends Composite {
 		initWidget(mainPanel);
 		newsPanel.clear();
 		newsPanel.setWidth("100%");
-		showMoreUpdatesPanel.setWidth("100%");
+		showMoreUpdatesPanel.setWidth("60%");
 		newsPanel.setHeight("300px");
 		newsPanel.setHorizontalAlignment(HasAlignment.ALIGN_CENTER);
 		newsPanel.setVerticalAlignment(HasVerticalAlignment.ALIGN_TOP);
@@ -621,7 +622,6 @@ public class NewsFeedPanel extends Composite {
 										// add widget to lookup more feeds: if the size of the returned data is less
 										// than the required disable this feature.
 										if(feeds.size() == SEARCHED_FEEDS_TO_SHOW){
-											showMoreUpdatesPanel.setHorizontalAlignment(HasAlignment.ALIGN_CENTER);
 											showMoreWidget = new ShowMoreFeeds(eventBus);
 											showMoreUpdatesPanel.add(showMoreWidget);
 											newsPanel.add(showMoreUpdatesPanel);
@@ -783,6 +783,7 @@ public class NewsFeedPanel extends Composite {
 						newsPanel.setHeight("");
 						newsPanel.setHorizontalAlignment(HasAlignment.ALIGN_LEFT);
 						newsPanel.setVerticalAlignment(HasVerticalAlignment.ALIGN_TOP);
+						
 						for (EnhancedFeed feed : feeds) {
 							newsPanel.add(new TweetTemplate(false, showFeedTimelineSource, myUserInfo, feed, eventBus)); //in the view
 							allUpdates.add(feed); //in the model
@@ -793,7 +794,6 @@ public class NewsFeedPanel extends Composite {
 						//if you are showing more than feedsMaxPerCategory-1 feeds there is probably more
 						if (feeds.size() >= NewsConstants.FEEDS_MAX_PER_CATEGORY-1 && (!isInfrastructure)) {
 							GWT.log("Show MORE " + NewsConstants.FEEDS_NO_PER_CATEGORY);
-							showMoreUpdatesPanel.setHorizontalAlignment(HasAlignment.ALIGN_CENTER);
 							showMoreWidget = new ShowMoreFeeds(eventBus);
 							showMoreUpdatesPanel.add(showMoreWidget);
 							newsPanel.add(showMoreUpdatesPanel);

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

@@ -1,15 +1,11 @@
 package org.gcube.portlets.user.newsfeed.client.ui;
 
-import org.gcube.portlets.user.newsfeed.client.event.ShowMoreUpdatesEvent;
-
 import com.google.gwt.core.client.GWT;
 import com.google.gwt.dom.client.Style.Unit;
 import com.google.gwt.dom.client.Style.Visibility;
-import com.google.gwt.event.dom.client.ClickEvent;
 import com.google.gwt.event.shared.HandlerManager;
 import com.google.gwt.uibinder.client.UiBinder;
 import com.google.gwt.uibinder.client.UiField;
-import com.google.gwt.uibinder.client.UiHandler;
 import com.google.gwt.user.client.ui.Composite;
 import com.google.gwt.user.client.ui.HTML;
 import com.google.gwt.user.client.ui.HTMLPanel;
@@ -25,15 +21,11 @@ public class ShowMoreFeeds extends Composite {
 	UiBinder<Widget, ShowMoreFeeds> {
 	}
 	
-	private HandlerManager eventBus;
-	
 	@UiField HTML caption;
 	@UiField HTMLPanel panel;
 
-
 	public ShowMoreFeeds(HandlerManager eventBus) {
 		initWidget(uiBinder.createAndBindUi(this));
-		this.eventBus = eventBus;
 		panel.getElement().getStyle().setMarginTop(10, Unit.PX);
 		caption.addStyleName("new-feeds-show");		
 		caption.getElement().getStyle().setBackgroundColor("transparent");
@@ -41,11 +33,7 @@ public class ShowMoreFeeds extends Composite {
 		caption.setHTML("Show more feeds");
 		//done after
 		panel.getElement().getStyle().setVisibility(Visibility.HIDDEN);
-		panel.setWidth("260px");
 	}	
 	
-	@UiHandler("caption")
+	
-	void onClick(ClickEvent e) {
-		eventBus.fireEvent(new ShowMoreUpdatesEvent());
-	}
 }

src/main/java/org/gcube/portlets/user/newsfeed/server/NewsServiceImpl.java

@@ -84,7 +84,7 @@ public class NewsServiceImpl extends RemoteServiceServlet implements NewsService
 	private static final String SESSION_ADMIN_ATTR = "SESSION_ADMIN_ATTR";
 	private static final String USER_SETTINGS_ATTR = "USER_SETTINGS_ATTR";
 
-	public static final String TEST_SCOPE = "/gcube/devsec/devVRE";
+	public static final String TEST_SCOPE = "/gcube/devsec/OpenAireDevVRE";
 
 	private String APP_ID;
 
@@ -139,7 +139,7 @@ public class NewsServiceImpl extends RemoteServiceServlet implements NewsService
 	 */
 	public String getDevelopmentUser() {
 		String user = NewsConstants.TEST_USER;
-		//user = "costantino.perciante";
+//		user = "costantino.perciante";
 		return user;
 	}
 	/**

src/main/webapp/NewsFeed.css

@@ -1,48 +1,8 @@
 @import url(https://fonts.googleapis.com/css?family=Architects+Daughter);
-
+/** 
-/* For phones*/
+ *Media queries for phones at the bottom pf this page
-@media screen and (max-width: 520px)  {
+ *
-	
+ */
-	#comment-highlighterContainer {
-		width: 260px;
-	}
-	
-	.comment-highlighter {
-		width: 230px;
-	}
-	
-	div#comment-inputContainer textarea.post-comment {
-		width: 230px;
-	}
-	
-	.link-preview {
-		width: 260px;
-	}
-
-	div.attachment-preview-container {
-		width: 300px;
-	}
-
-	.linkpreview-desc, .linkpreview-url, .linkpreview-image {
-		display: none;
-	}
-}
-
-@media screen and (max-width: 1024px)  {
-	.link-preview {
-		width: 260px;
-	}
-	
-	div.attachment-preview-container {
-		width: 300px;
-	}
-
-	.linkpreview-desc, .linkpreview-url, .linkpreview-image {
-		display: none;
-	}
-}
-
-
 table {
 	border-collapse: separate !important;
 	border-spacing: 0;
@@ -161,6 +121,7 @@ div#comment-inputContainer textarea.post-comment.comment-dark-color {
 	opacity: 1;
 	background: #D6E2FC;
 	height: 18px;
+	width: 70%;
 }
 
 .new-feeds-available:hover {
@@ -178,7 +139,7 @@ div#comment-inputContainer textarea.post-comment.comment-dark-color {
 
 .feed-filters {
 	margin-top: -5px;
-	width: 600px;
+	width: 90%;
 }
 
 .feed-filters ul {
@@ -588,3 +549,80 @@ a.person-link {
 	transition: background .45s ease-in-out;
 	-moz-transition: background .45s ease-in-out;
 	-webkit-transition: background .45s ease-in-out;
+}
+
+/* For phones*/
+@media screen and (max-width: 520px)  {
+	
+	#comment-highlighterContainer {
+		width: 260px;
+	}
+	
+	.comment-highlighter {
+		width: 230px;
+	}
+	
+	div#comment-inputContainer textarea.post-comment {
+		width: 230px;
+	}
+	
+	.link-preview {
+		width: 260px;
+	}
+
+	div.attachment-preview-container {
+		width: 300px;
+	}
+
+	.linkpreview-desc, .linkpreview-url, .linkpreview-image {
+		display: none;
+	}
+	
+	.new-feeds-show {
+		width: 260px;
+	}
+	
+	.div-table {
+		padding-left: 0;
+		padding-right: 0;
+		margin-left: -15px;
+	}
+	
+	.tweet-actions {
+		width: 280px;
+	}
+}
+
+@media screen and (max-width: 1024px)  {
+	.link-preview {
+		width: 260px;
+	}
+	
+	div.attachment-preview-container {
+		width: 300px;
+	}
+	
+	.new-feeds-show {
+		width: 260px;
+	}
+
+	.linkpreview-desc, .linkpreview-url, .linkpreview-image {
+		display: none;
+	}
+	
+	.div-table-col {
+		display: block;
+   		padding-left: 10px;
+   		padding-bottom: 5px;
+	}
+	
+	.div-table {
+		padding-left: 0;
+		padding-right: 0;
+		margin-left: -10px;
+	}
+	
+	.tweet-actions {
+		width: 280px;
+	}
+}