r7080 - in dumbhippo/trunk/server: src/com/dumbhippo/server/blocks src/com/dumbhippo/server/impl src/com/dumbhippo/web/servlets web/images3



Author: marinaz
Date: 2007-12-18 16:25:22 -0600 (Tue, 18 Dec 2007)
New Revision: 7080

Added:
   dumbhippo/trunk/server/web/images3/facebook_gradient_bottom.gif
   dumbhippo/trunk/server/web/images3/facebook_gradient_top.gif
Modified:
   dumbhippo/trunk/server/src/com/dumbhippo/server/blocks/GroupMemberBlockView.java
   dumbhippo/trunk/server/src/com/dumbhippo/server/impl/FacebookTrackerBean.java
   dumbhippo/trunk/server/src/com/dumbhippo/web/servlets/FacebookServlet.java
Log:
Bling up design for Facebook according to the mockups from Mike.
Try to make "Edit accounts" link visible only to the owner of the profile.

Modified: dumbhippo/trunk/server/src/com/dumbhippo/server/blocks/GroupMemberBlockView.java
===================================================================
--- dumbhippo/trunk/server/src/com/dumbhippo/server/blocks/GroupMemberBlockView.java	2007-12-18 21:47:16 UTC (rev 7079)
+++ dumbhippo/trunk/server/src/com/dumbhippo/server/blocks/GroupMemberBlockView.java	2007-12-18 22:25:22 UTC (rev 7080)
@@ -110,7 +110,7 @@
 		case FOLLOWER:
 			return "Started following";
 		case INVITED:
-			return "Invited";
+			return "Invited to";
 		case ACTIVE:
 			return "Joined";
 		}	

Modified: dumbhippo/trunk/server/src/com/dumbhippo/server/impl/FacebookTrackerBean.java
===================================================================
--- dumbhippo/trunk/server/src/com/dumbhippo/server/impl/FacebookTrackerBean.java	2007-12-18 21:47:16 UTC (rev 7079)
+++ dumbhippo/trunk/server/src/com/dumbhippo/server/impl/FacebookTrackerBean.java	2007-12-18 22:25:22 UTC (rev 7080)
@@ -602,9 +602,9 @@
 		User user = account.getOwner();
 
 		StringBuilder fbmlSb = new StringBuilder("");
-		fbmlSb.append("<fb:visible-to-owner><fb:subtitle>" +
+		fbmlSb.append("<fb:subtitle><fb:fbml version='1.1'><fb:visible-to-owner>" +
 		              "<a href='http://apps.facebook.com/mugshot'>Edit Accounts</a>" +
-		              "</fb:subtitle></fb:visible-to-owner>");
+		              "</fb:visible-to-owner></fb:fbml></fb:subtitle>");
 		
 		// add the accounts ribbon
         List<ExternalAccountView> lovedAccounts = new ArrayList<ExternalAccountView>();
@@ -623,6 +623,11 @@
 			}			
 		});
 		
+		fbmlSb.append("<div style='background: url(\"http://dogfood.mugshot.org/images3/facebook_gradient_bottom.png\";) bottom left repeat-x;'>");
+		
+		fbmlSb.append("<div style='float:left'>Find me online:</div>");
+		
+		fbmlSb.append("<div style='float:left'>");
 		for (ExternalAccountView a : lovedAccounts) {
             String imageTitle = a.getExternalAccount().getSiteName();
             if (a.getExternalAccount().getLinkText().length() >0 )
@@ -633,7 +638,7 @@
 					      "</a>");
 		}		
 
-		fbmlSb.append("<div style='margin-top:5px;margin-bottom:5px;'>Latest activity:</div>");
+		fbmlSb.append("</div></div>");
 		
 		Pageable<BlockView> pageableMugshot = new Pageable<BlockView>("mugshot");
 		pageableMugshot.setPosition(0);
@@ -641,14 +646,16 @@
 		pageableMugshot.setFlexibleResultCount(true);
 		stacker.pageStack(AnonymousViewpoint.getInstance(Site.NONE), user, pageableMugshot, true);
 		int resultsCount = 0;
+		String backgroundColor = "#FFFFFF";
 		for (BlockView blockView : pageableMugshot.getResults()) {
 			if (resultsCount == INITIAL_BLOCKS_PER_PAGE - 1) {
 				resultsCount++;
 				break;
 			}
+			backgroundColor = (resultsCount % 2 == 0 ? "#FFFFFF" : "#CCCCCC");
 			resultsCount++;
 			fbmlSb.append(
-			    "<table cellspacing='0' cellpadding='0'>" +
+			    "<table cellspacing='0' cellpadding='0' style='background-color: " + backgroundColor + ";'>" +
 			    "<tbody><tr><td>" +
 	            "<img src='http://mugshot.org"; + blockView.getIcon() + "' title='" + blockView.getTypeTitle() + "' style='width: 16; height: 16; border: none; margin-right: 3px;'/>" +
 			    "</td><td>" +
@@ -664,8 +671,10 @@
 			String visitMugshotText = "Visit my Mugshot Page"; 
 			if (resultsCount == INITIAL_BLOCKS_PER_PAGE);
 			    visitMugshotText = visitMugshotText + " To See More";
-		    fbmlSb.append("<a target='_blank' style='font-size:12px;font-weight:bold;padding-top:15px;' href='" + getAbsoluteUrl("/person?who=" + user.getId().toString()) + "'>" +
+			fbmlSb.append("<div style='background: url(\"http://dogfood.mugshot.org/images3/facebook_gradient_top.png\";) top left repeat-x;text-align: center;'>");    
+		    fbmlSb.append("<a target='_blank' style='font-size:12px;font-weight:bold;' href='" + getAbsoluteUrl("/person?who=" + user.getId().toString()) + "'>" +
 				          visitMugshotText + "</a>");
+		    fbmlSb.append("</div>");
 		}
 		return fbmlSb.toString();
 	}

Modified: dumbhippo/trunk/server/src/com/dumbhippo/web/servlets/FacebookServlet.java
===================================================================
--- dumbhippo/trunk/server/src/com/dumbhippo/web/servlets/FacebookServlet.java	2007-12-18 21:47:16 UTC (rev 7079)
+++ dumbhippo/trunk/server/src/com/dumbhippo/web/servlets/FacebookServlet.java	2007-12-18 22:25:22 UTC (rev 7080)
@@ -176,7 +176,7 @@
 
         xml.appendTextNode("fb:header", "Musgshot");
         xml.appendTextNode("div", "Mugshot allows you and your friends to see your activity from lots of other sites on the internet in a single place in your profile.",
-                           "style", "margin-left:45px; margin-bottom:10px;font-weight:bold;");
+                           "style", "margin-bottom:10px;font-weight:bold;");
 		if (user != null && errorMessage == null) {
 			// check if there are mugshot params, process them, and display an appropriate message
 	        @SuppressWarnings("unchecked")
@@ -337,20 +337,20 @@
 			String floatStyle = "";
 			String labelWidth = "180";
 			String leftSideWidth = "width:490px;";
-			String categoryNameLeftMargin = "margin-left:-178px;";
+			String categoryNameLeftMargin = "margin-left:0px;";
 			if (user.getAccount().getHasAcceptedTerms()) {
 			    xml.appendTextNode("span", "Updates to the information below will be reflected in ",
-				    	           "style", "margin-left:15px;");
+				    	           "style", "color:#666666;margin-left:15px;");
 		        xml.appendTextNode("a", "your Mugshot account", "href",
 				                   baseUrl + "/person?who=" + user.getId(), "target", "_blank");
 		        xml.append(".");
 		    } else {
 			    xml.appendTextNode("span", "Fill in the information for accounts you want to display updates from.",
-		    	                   "style", "margin-left:15px;");		
+		    	                   "style", "color:#666666;margin-left:15px;");		
 			    floatStyle="float:left;";
 			    labelWidth="120";
 			    leftSideWidth = "width:430px;";
-			    categoryNameLeftMargin = "margin-left:-118px;";
+			    categoryNameLeftMargin = "margin-left:0px;";
 		    }
 		    ExternalAccountCategory currentCategory = null;
 		    boolean hadInitialInfo = false;
@@ -371,8 +371,8 @@
 			    } else {
 			    	xml.appendEmptyNode("input", "name", "mugshot_" + externalAccount.getExternalAccountType().name());
 			    }
-			    xml.appendEmptyNode("br");
 			    
+			    xml.openElement("div", "style", "color:#666666;");			    
 			    if (externalAccount.isInfoTypeProvidedBySite()) {
 			        xml.append("Enter your ");
 			        xml.appendTextNode("a", externalAccount.getSiteName(), 
@@ -400,6 +400,7 @@
 			    } else {
 			    	xml.append(" A link to this account will be included in your profile.");
 			    }
+			    xml.closeElement(); // div
 			    
 			    xml.closeElement(); // fb:editor-custom	
 		    }
@@ -414,8 +415,11 @@
 		    xml.closeElement(); // div with the form
 		    
 		    if (!user.getAccount().getHasAcceptedTerms()) {
-		    	xml.openElement("div", "style", "width:200px;float:left;color:#666666;font-weight:bold;margin-top:34px;margin-left:10px;");
-			    xml.append("Do you already have a Mugshot account? Don't fill in this stuff, just verify" +
+		    	xml.openElement("div", "style", "width:200px;float:left;color:#666666;background-color:#EDF2F3;border-width:1px;border-color:#C2D1D4;margin-top:34px;margin-left:10px;padding:8px;");
+		    	xml.openElement("span", "style", "font-weight:bold;");
+		    	xml.append("Do you already have a Mugshot account?");
+		    	xml.closeElement();
+			    xml.append(" Don't fill in this stuff, just verify" +
 			    		   " your Mugshot account by following this link.");
 			    xml.openElement("form", "action", baseUrl + "/facebook-add", "target", "_blank", "method", "GET");
 			    // there didn't seem to be a way to get buttons in fb:editor to open in a new window, which is what we want here, so we are using 
@@ -424,7 +428,10 @@
 			    String buttonStyle = "background-color:#3B5998;color:#ffffff;border-width:1px;padding-top:2px;padding-bottom:2px;padding-right:6px;padding-left:6px;border-top-color:#728199;border-left-color:#728199;border-right-color:#0E1F5B;border-bottom-color:#0E1F5B;margin-top:20px;margin-bottom:30px;";
 			    xml.appendEmptyNode("input", "type", "submit", "value", "Verify My Mugshot Account", "style", buttonStyle);
 			    xml.closeElement();		
-			    xml.append("Want to create a Mugshot account? It's free and easy and helps you see all your friends' activities in one place, share links, and read feeds in a social setting.");
+		    	xml.openElement("span", "style", "font-weight:bold;");
+		    	xml.append("Want to create a Mugshot account?");
+		    	xml.closeElement();
+			    xml.append(" It's free and easy and helps you see all your friends' activities in one place, share links, and read feeds in a social setting.");
 	            xml.openElement("form", "action", baseUrl + "/facebook-signin", "target", "_blank", "method", "GET");
 	            xml.appendEmptyNode("input", "type", "submit", "value", "Create My Mugshot Account", "style", buttonStyle);
 	            xml.closeElement();	

Added: dumbhippo/trunk/server/web/images3/facebook_gradient_bottom.gif
===================================================================
(Binary files differ)


Property changes on: dumbhippo/trunk/server/web/images3/facebook_gradient_bottom.gif
___________________________________________________________________
Name: svn:mime-type
   + application/octet-stream

Added: dumbhippo/trunk/server/web/images3/facebook_gradient_top.gif
===================================================================
(Binary files differ)


Property changes on: dumbhippo/trunk/server/web/images3/facebook_gradient_top.gif
___________________________________________________________________
Name: svn:mime-type
   + application/octet-stream



[Date Prev][Date Next]   [Thread Prev][Thread Next]   [Thread Index] [Date Index] [Author Index]