improved stylesheet and functional tests in community block plugin

Francisco Marcelo A. Lima Júnior
1 parent 565789d3
Showing 4 changed files with 128 additions and 113 deletions Show diff stats
app/helpers/application_helper.rb
plugins/community_block/public/style.css
plugins/community_block/test/functional/commmunity_block_plugin_profile_design_controller_test.rb
plugins/community_block/views/community_block.rhtml
@@ -1250,19 +1250,11 @@ module ApplicationHelper
     already_reported_message = _('You already reported this profile.')
     report_profile_message = _('Report this profile for abusive behaviour')
-    if type == :button || type == :button_without_text
+    if type == :button
       if user.already_reported?(profile)
-        if type == :button
-          button(:alert, text, url, :class => klass+' disabled', :disabled => true, :title => already_reported_message)
-        elsif type == :button_without_text
-          button_without_text(:alert, text, url, :class => klass+' disabled', :disabled => true, :title => already_reported_message)
-        end
+        button(:alert, text, url, :class => klass+' disabled', :disabled => true, :title => already_reported_message)
       else
-        if type == :button
-          button(:alert, text, url, :class => klass, :title => report_profile_message)
-        elsif type == :button_without_text
-          button_without_text(:alert, text, url, :class => klass, :title => report_profile_message)
-        end
+        button(:alert, text, url, :class => klass, :title => report_profile_message)
       end
     elsif type == :link
       if user.already_reported?(profile)
@@ -20,15 +20,86 @@
   margin-left: 2px;
 }
-#content .box-1 .community-block .community-block-title {
+#content .box-1 .community-block .community-block-title .menu-submenu {
+  bottom: 154px;
+  right: -120px;
+}
+
+#content .box-1 .community-block .community-block-title .menu-submenu-header {
+  display: none;
+}
+
+#content .box-1 .community-block .community-block-title .menu-submenu-content {
+  border: 1px solid #888a85;
+  border-radius: 4px;
+  background-color: #efefef;
+  background-image: none;
+}
+
+#content .box-1 .community-block .community-block-title .menu-submenu-content h4 {
+  display: none;
+}
+
+#content .box-1 .community-block .community-block-title .menu-submenu-content ul {
+  list-style: none;
+}
+
+#content .box-1 .community-block .community-block-title .menu-submenu-content li {
+  padding: 7px;
+  font-size: 10px;
+}
+
+#content .box-1 .community-block .community-block-title .menu-submenu-content a {
+  color: #000;
+}
+
+#content .box-1 .community-block .community-block-title .menu-submenu-footer {
+  display: none;
+}
+
+#content .box-1 .community-block .community-block-title h1 {
   //border: 1px solid #00F;
   font-variant: small-caps;
   color: #555753;
   text-align: left;
   padding-left: 10px;
-  margin: 0px;
+  margin: 0px 0px 2px 0px;
+}
+
+#content .box-1 .community-block .community-block-button {
+  border: 1px solid #CCCCCC;
+  border-radius: 4px;
+  float: right;
+  height: 22px;
+  line-height: 22px;
+  margin-top: 1px;
+  margin-right: 1px;
+  background-color: #F4F4F4;
+  background-position: center center;
+  background-repeat: no-repeat;
+  cursor: pointer;
+}
+
+#content .box-1 .community-block .community-block-button.icon-add {
+  width: 20px;
+  background-image: url('/designs/icons/default/Tango/16x16/actions/add.png');
+}
+
+#content .box-1 .community-block .community-block-button.icon-remove {
+  width: 20px;
+  background-image: url('/designs/icons/default/Tango/16x16/actions/remove.png');
+} 
+
+#content .box-1 .community-block .community-block-button.icon-arrow {
+  width: 16px;
+  background-image: url('/images/top-arrow.png');
+} 
+
+#content .box-1 .community-block .community-block-button:hover {
+  background-color: #DDDDDD;
 }
+
 #content .box-1 .community-block .community-block-description {
   //border: 1px solid #0F0;
   font-style: italic;
@@ -36,10 +107,3 @@
   padding: 10px;
 }
-#content .box-1 .community-block .community-block-buttons {
-  //border: 1px solid #F00;
-  text-align: left;
-  margin-top: 3px;
-  margin-left: 22px;
-}
-
@@ -42,77 +42,46 @@ class ProfileControllerTest &lt; ActionController::TestCase
     get :index, :profile => @community.identifier
     assert_tag :div, :attributes => {:class => 'community-block-logo'}
     assert_tag :div, :attributes => {:class => 'community-block-info'}
-    assert_tag :h1, :attributes => {:class => 'community-block-title'}
+    assert_tag :div, :attributes => {:class => 'community-block-title'}
     assert_tag :div, :attributes => {:class => 'community-block-description'}
-    assert_tag :div, :attributes => {:class => 'community-block-buttons'}
   end
-
-  # USER LOGGED IN AND COMMUNITY MEMBER #
-
   should 'display *leave* button when the user is logged in and is a member of the community' do
     get :index, :profile => @community.identifier
-    assert_tag :a, :attributes => {:class => 'button icon-remove'}
+    assert_tag :span, :attributes => {:class => 'community-block-button icon-remove'}
   end
   should 'display *send email to administrators* button when the user is logged in and is a member of the community' do
     get :index, :profile => @community.identifier
-    assert_tag :a, :attributes => {:class => 'button icon-menu-mail'}
+    assert_match /\{&quot;Send an e-mail&quot;:\{&quot;href&quot;:&quot;\/contact\/#{@community.identifier}\/new&quot;\}\}/, @response.body
   end
   should 'display *report* button when the user is logged in and is a member of the community' do
     get :index, :profile => @community.identifier
-    assert_tag :a, :attributes => {:class => 'button icon-alert report-abuse-action'}
+    assert_match /\{&quot;Report abuse&quot;:\{&quot;href&quot;:&quot;\/profile\/#{@community.identifier}\/report_abuse&quot;\}\}/, @response.body
   end
-  
-  # USER LOGGED IN AND NOT MEMBER OF THE COMMUNITY
-
   should 'display *join* button when the user is logged in and is not a member of the community' do
     @community.remove_member @user
     get :index, :profile => @community.identifier
-    assert_tag :a, :attributes => {:class => 'button icon-add'}
-  end
-
-  should 'display *send email to administrators* button when the user is logged in and is not a member of the community' do
-    @community.remove_member @user
-    get :index, :profile => @community.identifier
-    assert_tag :a, :attributes => {:class => 'button icon-menu-mail'}
-  end
-
-  should 'display *report* button when the user is logged in and is not a member of the community' do
-    @community.remove_member @user
-    get :index, :profile => @community.identifier
-    assert_tag :a, :attributes => {:class => 'button icon-alert report-abuse-action'}
+    assert_tag :span, :attributes => {:class => 'community-block-button icon-add'}
   end
-
-  # USER LOGGED IN AND COMMUNITY ADMIN
-
-  should 'display *configure* button when the user is logged in and is community admin' do
+  should 'display *control panel* link option when the user is logged in and is community admin' do
     get :index, :profile => @community.identifier
-    assert_tag :a, :attributes => {:class => 'button icon-menu-ctrl-panel'}
+    assert_match /\{&quot;Control panel&quot;:\{&quot;href&quot;:&quot;\/myprofile\/#{@community.identifier}&quot;\}\}/, @response.body
   end
-
-  # USER NOT LOGGED IN
-
-  should 'not display *send email to administrators* button when the user is not logged in' do
+  should 'display *join* button when the user is not logged in' do
     logout
     get :index, :profile => @community.identifier
-    assert_no_tag :a, :attributes => {:class => 'button icon-menu-mail'}
+    assert_tag :span, :attributes => {:class => 'community-block-button icon-add'}
   end
-  should 'not display *report* button when the user is not logged in' do
+  should 'not display *arrow* button when the user is not logged in' do
     logout
     get :index, :profile => @community.identifier
-    assert_no_tag :a, :attributes => {:class => 'button icon-alert report-abuse-action'}
+    assert_no_tag :span, :attributes => {:class => 'community-block-button icon-arrow'}
   end
-
-  should 'not display *configure* button when the user is logged in and is admin of the community' do
-    logout
-    get :index, :profile => @community.identifier
-    assert_no_tag :a, :attributes => {:class => 'button icon-menu-ctrl-panel link-this-page'}
-  end
-
+  
 end
@@ -3,60 +3,50 @@
     <%= link_to profile_image(profile, :big), profile.url %>
   </div>
   <div class="community-block-info">
-    <h1 class="community-block-title"><%=profile.name%></h1>
-    <div class="community-block-description"><%= profile.description %></div>
-  </div>
-  <div style="clear:both"></div>
-  <div class="community-block-buttons">
-    <% if logged_in? %>
-        
-      <% if profile.members.include?(user) || profile.already_request_membership?(user) %>
-          <%= button_without_text(
-                :remove, 
-                __('Leave community'), 
-                profile.leave_url,
-                :title => _("Leave community"),
-                :style => 'position: relative;') %>
-      <% else %>
-          <%= button_without_text(
-                :add, 
-                __('Join community'), 
-                profile.join_url,
-                :title => _("Join community"),
-                :style => 'position: relative;') %>
-      <% end %>
-      
-      <% if profile.enable_contact? %>
-        <%= button_without_text(
-              :'menu-mail',
-              __('Send an e-mail'),
-              { :profile => profile.identifier,
-                :controller => 'contact',
-                :action => 'new' },
-                :title => _('Send an e-mail to the administrators'),
-                :stle => 'position: relative;') %> 
-      <% end %>
-      
-      <%= report_abuse(profile, :button_without_text) %>
+    <div class="community-block-title">
-      <% if !user.nil? && user.has_permission?('edit_profile', profile) %>
+      <%
+        links = []
-        <%= button_without_text(
-              :'menu-ctrl-panel',
-              __('Control Panel'),
-              profile.admin_url,
-              :title => _('Configure this community'),
-              :style => 'position: relative;') %>
+        if logged_in?
+          if profile.enable_contact?
+            links.push(_('Send an e-mail') => {:href => url_for({:controller => 'contact', :action => 'new', :profile => profile.identifier})})
+          end
+
+          links.push(_('Report abuse') => {:href => url_for({:controller => 'profile', :action => 'report_abuse', :profile => profile.identifier})})
+            
+          if !user.nil? && user.has_permission?('edit_profile', profile)
+            links.push(_('Control panel') => {:href => url_for({:controller => 'profile_editor', :profile => profile.identifier})})
+          end %>
+
+      <%= link_to(
+            content_tag('span','',:class => 'community-block-button icon-arrow'),
+            '#',
+            :onclick => "toggleSubmenu(this,'',#{links.to_json}); return false;",
+            :class => 'simplemenu-trigger') %>
+
+      <% end %>
+      
+      <% if logged_in? %>
+        <% if profile.members.include?(user) || profile.already_request_membership?(user) %>
+            <%= link_to(
+                  content_tag('span', '', :class => 'community-block-button icon-remove'),
+                  profile.leave_url) %>
+        <% else %>
+            <%= link_to(
+                  content_tag('span', '', :class => 'community-block-button icon-add'),
+                  profile.join_url) %>
+        <% end %>
+      <% else %>
+        <%= link_to(
+              content_tag('span', '', :class => 'community-block-button icon-add'),
+              profile.join_not_logged_url) %>
       <% end %>
-    <% else %>
-        <%= button_without_text(
-              :add, 
-              __('Join community'), 
-              profile.join_not_logged_url,
-              :title => _("Join community"),
-              :style => 'position: relative;') %>
-    <% end %>
+      <h1><%=profile.name%></h1>
+    </div>
+    <div class="community-block-description"><%= profile.description %></div>
   </div>
+  <div style="clear:both"></div>
 </div>
	@@ -20,15 +20,86 @@		@@ -20,15 +20,86 @@
20	margin-left: 2px;	20	margin-left: 2px;
21	}	21	}
22		22
23	-#content .box-1 .community-block .community-block-title {	23	+#content .box-1 .community-block .community-block-title .menu-submenu {
		24	+ bottom: 154px;
		25	+ right: -120px;
		26	+}
		27	+
		28	+#content .box-1 .community-block .community-block-title .menu-submenu-header {
		29	+ display: none;
		30	+}
		31	+
		32	+#content .box-1 .community-block .community-block-title .menu-submenu-content {
		33	+ border: 1px solid #888a85;
		34	+ border-radius: 4px;
		35	+ background-color: #efefef;
		36	+ background-image: none;
		37	+}
		38	+
		39	+#content .box-1 .community-block .community-block-title .menu-submenu-content h4 {
		40	+ display: none;
		41	+}
		42	+
		43	+#content .box-1 .community-block .community-block-title .menu-submenu-content ul {
		44	+ list-style: none;
		45	+}
		46	+
		47	+#content .box-1 .community-block .community-block-title .menu-submenu-content li {
		48	+ padding: 7px;
		49	+ font-size: 10px;
		50	+}
		51	+
		52	+#content .box-1 .community-block .community-block-title .menu-submenu-content a {
		53	+ color: #000;
		54	+}
		55	+
		56	+#content .box-1 .community-block .community-block-title .menu-submenu-footer {
		57	+ display: none;
		58	+}
		59	+
		60	+#content .box-1 .community-block .community-block-title h1 {
24	//border: 1px solid #00F;	61	//border: 1px solid #00F;
25	font-variant: small-caps;	62	font-variant: small-caps;
26	color: #555753;	63	color: #555753;
27	text-align: left;	64	text-align: left;
28	padding-left: 10px;	65	padding-left: 10px;
29	- margin: 0px;	66	+ margin: 0px 0px 2px 0px;
		67	+}
		68	+
		69	+#content .box-1 .community-block .community-block-button {
		70	+ border: 1px solid #CCCCCC;
		71	+ border-radius: 4px;
		72	+ float: right;
		73	+ height: 22px;
		74	+ line-height: 22px;
		75	+ margin-top: 1px;
		76	+ margin-right: 1px;
		77	+ background-color: #F4F4F4;
		78	+ background-position: center center;
		79	+ background-repeat: no-repeat;
		80	+ cursor: pointer;
		81	+}
		82	+
		83	+#content .box-1 .community-block .community-block-button.icon-add {
		84	+ width: 20px;
		85	+ background-image: url('/designs/icons/default/Tango/16x16/actions/add.png');
		86	+}
		87	+
		88	+#content .box-1 .community-block .community-block-button.icon-remove {
		89	+ width: 20px;
		90	+ background-image: url('/designs/icons/default/Tango/16x16/actions/remove.png');
		91	+}
		92	+
		93	+#content .box-1 .community-block .community-block-button.icon-arrow {
		94	+ width: 16px;
		95	+ background-image: url('/images/top-arrow.png');
		96	+}
		97	+
		98	+#content .box-1 .community-block .community-block-button:hover {
		99	+ background-color: #DDDDDD;
30	}	100	}
31		101
		102	+
32	#content .box-1 .community-block .community-block-description {	103	#content .box-1 .community-block .community-block-description {
33	//border: 1px solid #0F0;	104	//border: 1px solid #0F0;
34	font-style: italic;	105	font-style: italic;
	@@ -36,10 +107,3 @@		@@ -36,10 +107,3 @@
36	padding: 10px;	107	padding: 10px;
37	}	108	}
38		109
39	-#content .box-1 .community-block .community-block-buttons {
40	- //border: 1px solid #F00;
41	- text-align: left;
42	- margin-top: 3px;
43	- margin-left: 22px;
44	-}
45	-