ActionItem152: menu do usuário

git-svn-id: https://svn.colivre.coop.br/svn/noosfero/trunk@1266 3f533792-8f58-4932-b0fe-aaf55b0a4547

ActionItem152: menu do usuário
git-svn-id: https://svn.colivre.coop.br/svn/noosfero/trunk@1266 3f533792-8f58-4932-b0fe-aaf55b0a4547
AurelioAHeckert
1 parent 6eb1409f
Showing 16 changed files with 162 additions and 104 deletions Show diff stats
app/helpers/application_helper.rb
app/helpers/assets_helper.rb
app/views/layouts/application.rhtml
app/views/layouts/user_menu.rhtml
app/views/shared/categories_menu.rhtml
public/designs/icons/default/community-HC.gif
public/designs/icons/default/edit-HC.gif
public/designs/icons/default/enter-HC.gif
public/designs/icons/default/exit-HC.gif
public/designs/icons/default/search-HC.gif
public/designs/icons/default/style.css
public/images/icons-bar/ico-edit.gif
public/images/icons-bar/ico-enter.gif
public/images/icons-bar/ico-exit.gif
public/images/icons-bar/ico-search.gif
public/stylesheets/menu.css
@@ -119,27 +119,25 @@ module ApplicationHelper
   end
   def shortcut_header_links
-    search_link = ( lightbox_link_to content_tag('span', _('Search')), { :controller => 'search', :action => 'popup' }, { :id => 'open_search'} )
-
-    if logged_in?
-      [
-        ( link_to_homepage '<img src="' +
-          ( (current_user.person.image)? current_user.person.image.public_filename(:icon) : "/images/icons-bar/photo.png" ) +
-          '" alt="Photo" title="" height="20" border="0"/>'+ current_user.login,
-          current_user.login, :id=>"link_go_home" ),
-        ( link_to_myprofile( content_tag('span', _('control panel')), {}, nil, { :id => 'link_edit_profile'} ) ),
-	# O ID icon_accessibility tambem tem que aparcer e testei o link nao ta funcionado.
-        ( link_to content_tag('span', _('Admin')), { :controller => 'admin_panel' }, :id => 'link_admin_panel' if current_user.person.is_admin?), 
-        ( lightbox_link_to content_tag('span', _('Logout')), { :controller => 'account', :action => 'logout_popup'}, :id => 'link_logout'),
-        search_link,
-      ]
-    else
-      [
-        #( link_to _("%s's home") % @environment.name, { :controller=>"home" }, :id=>"link_to_envhome" ),
-        ( lightbox_link_to content_tag('span', _('Login')), { :controller => 'account', :action => 'login_popup' }, :id => 'link_login' ),
-        search_link,
-      ]
-    end.join(" ")
+#    search_link = ( lightbox_link_to content_tag('span', _('Search')), { :controller => 'search', :action => 'popup' }, { :id => 'open_search'} )
+#
+#    if logged_in?
+#      [
+#        ( link_to_homepage '<img src="' +
+#          ( (current_user.person.image)? current_user.person.image.public_filename(:icon) : "/images/icons-bar/photo.png" ) +
+#          '" alt="Photo" title="" height="20" border="0"/>'+ current_user.login,
+#          current_user.login, :id=>"link_go_home" ),
+#        ( link_to_myprofile( content_tag('span', _('control panel')), {}, nil, { :id => 'link_edit_profile'} ) ),
+#        ( link_to content_tag('span', _('Admin')), { :controller => 'admin_panel' }, :id => 'link_admin_panel' if current_user.person.is_admin?), 
+#        ( lightbox_link_to content_tag('span', _('Logout')), { :controller => 'account', :action => 'logout_popup'}, :id => 'link_logout'),
+#        search_link,
+#      ]
+#    else
+#      [
+#        ( lightbox_link_to content_tag('span', _('Login')), { :controller => 'account', :action => 'login_popup' }, :id => 'link_login' ),
+#        search_link,
+#      ]
+#    end.join(" ")
   end
   def link_if_permitted(link, permission = nil, target = nil)
@@ -2,13 +2,13 @@ module AssetsHelper
   def generate_assets_menu()
     '
-      <li><a href="#"><span class="ico-menu-blog"></span> Blogs</a></li>
-      <li><a href="#"><span class="ico-menu-album"></span> Albuns</a></li>
-      <li><a href="#"><span class="ico-menu-product"></span> Produtos</a></li>
-      <li><a href="#"><span class="ico-menu-enterprise"></span> Empreendimentos</a></li>
-      <li><a href="#"><span class="ico-menu-"></span> bli 5</a></li>
-      <li><a href="#"><span class="ico-menu-"></span> bli 6</a></li>
-      <li><a href="#"><span class="ico-menu-"></span> bli 7</a></li>
+      <li><a href="#"><span class="icon-menu-blog"></span> Blogs</a></li>
+      <li><a href="#"><span class="icon-menu-album"></span> Albuns</a></li>
+      <li><a href="#"><span class="icon-menu-product"></span> Produtos</a></li>
+      <li><a href="#"><span class="icon-menu-enterprise"></span> Empreendimentos</a></li>
+      <li><a href="#"><span class="icon-menu-community"></span> Comunidades</a></li>
+      <li><a href="#"><span class="icon-menu-"></span> bli 6</a></li>
+      <li><a href="#"><span class="icon-menu-"></span> bli 7</a></li>
     '
   end
@@ -75,7 +75,11 @@
         </script>
         <div id='user_box'>
-          <%= shortcut_header_links %>
+          <%= render :file => 'layouts/user_menu' %>
+          <%=
+          lightbox_link_to '<span class="icon-menu-search"></span>'+ _('Search'),
+                           { :controller => 'search', :action => 'popup' }, :id => 'open_search'
+          %>
         </div><!-- id='user_box' -->
       </div><!-- id="noosfero_bar" -->
@@ -0,0 +1,36 @@
+<div id="user_menu" class="top_extra_menu">
+
+<% if logged_in? %>
+  <%=
+  link_to_homepage '<img src="' + (
+      (current_user.person.image)? current_user.person.image.public_filename(:icon) : "/images/icons-bar/photo.png"
+    ) +
+    '" alt="'+ current_user.login() +' Icon-Photo" title="" height="20" border="0"/>'+
+    current_user.login, current_user.login, :id=>'link_go_home', :class => 'user_menu_first_link'
+  %>
+  <ul>
+    <li><a href="#"><span class="icon-menu-blog"></span> Meu Blog</a></li>
+    <%=
+      '<li>'+ link_to_myprofile( '<span class="icon-menu-ctrl-panel"></span>'+ _('control panel'),
+                                 {}, nil, :id => 'link_edit_profile' ) +'</li>'+
+      '<li>'+ lightbox_link_to( '<span class="icon-menu-logout"></span>'+ _('Logout'),
+                                { :controller => 'account', :action => 'logout_popup'}, :id => 'link_logout' ) +'</li>'
+    %>
+    <%=
+      '<li>'+ link_to( '<span class="icon-menu-"></span>'+ _('Admin'),
+                       { :controller => 'admin_panel' }, :id => 'link_admin_panel' ) +
+      '</li>' if current_user.person.is_admin?
+    %>
+    <li><a href="#"><span class="icon-menu-"></span><small>essa aba será 100% fechada</small></a></li>
+    <li><a href="#"><span class="icon-menu-"></span> soon...</a></li>
+  </ul>
+
+<% else %>
+
+<%= lightbox_link_to '<span class="icon-menu-login"></span>'+ _('Login'),
+                     { :controller => 'account', :action => 'login_popup' },
+                     :id => 'link_login', :class => 'user_menu_first_link' %>
+
+<% end %>
+
+</div><!-- fim id="user_menu" -->
@@ -13,7 +13,7 @@
 </ul><!-- fim id="cat_menu" -->
 <div id="assets_menu">
-  <div id="assets_menu_list">
+  <div id="assets_menu_list" class="top_extra_menu">
     <ul id="assets_menu_ul">
       <%= generate_assets_menu %>
     </ul>
@@ -19,8 +19,14 @@
 .icon-search  { background-image: url(gnome-search.png);       }
 .icon-ok      { background-image: url(gtk-ok.png);             }
 .icon-login   { background-image: url(key-HC.gif);             }
-.ico-menu-           { background-image: url(menu-without-ico-HC.gif) }
-.ico-menu-blog       { background-image: url(blog-HC.gif);            }
-.ico-menu-album      { background-image: url(album-HC.gif);           }
-.ico-menu-product    { background-image: url(product-HC.gif);         }
-.ico-menu-enterprise { background-image: url(enterprise-HC.gif);      }
+.icon-menu-           { background-image: url(menu-without-ico-HC.gif) }
+.icon-menu-blog       { background-image: url(blog-HC.gif);            }
+.icon-menu-album      { background-image: url(album-HC.gif);           }
+.icon-menu-product    { background-image: url(product-HC.gif);         }
+.icon-menu-enterprise { background-image: url(enterprise-HC.gif);      }
+.icon-menu-community  { background-image: url(community-HC.gif);       }
+.icon-menu-ctrl-panel { background-image: url(edit-HC.gif);            }
+.icon-menu-login      { background-image: url(enter-HC.gif);           }
+.icon-menu-logout     { background-image: url(exit-HC.gif);            }
+.icon-menu-search     { background-image: url(search-HC.gif);          }
+
@@ -63,59 +63,6 @@ body.category2 .linkSubMenu { background-image: url(/images/borda-esq-aba-verde.
 body.category3 .linkSubMenu { background-image: url(/images/borda-esq-aba-lilas.gif)    }
 body.category4 .linkSubMenu { background-image: url(/images/borda-esq-aba-vermelho.gif) }
-#user_box {
-  position: absolute;
-  top: 0px;
-  right: 0px;
-}
-
-#user_box a:link,
-#user_box a:visited {
-  font-weight: bold;
-  text-decoration: none;
-  line-height: 20px;
-  color: #FFF;
-  margin-right: 20px;
-  padding-left: 21px;
-  opacity: 0.7;
-	filter: alpha(opacity=70);
-  display: block;
-  float: left;
-  height: 20px;
-  background-position: 0px 0%;
-  background-repeat: no-repeat;
-}
-
-#user_box a:hover,
-#user_box a:active {
-  opacity: 1;
-	filter: alpha(opacity=100);
-}
-
-#user_box a#link_to_envhome {
-  margin-right: 40px;
-}
-
-#user_box #link_go_home,
-#user_box #link_go_home:hover {
-  position: relative;
-  padding: 0px;
-}
-#user_box #link_go_home img {
-  position: absolute;
-  top: -1px;
-  left: -23px;
-  border: none;
-}
-.msie #link_go_home img {
-  top: -1px;
-}
-
-#link_login        { background-image: url(/images/icons-bar/ico-enter.gif)  }
-#open_search       { background-image: url(/images/icons-bar/ico-search.gif) }
-#link_edit_profile { background-image: url(/images/icons-bar/ico-edit.gif)   }
-#link_logout       { background-image: url(/images/icons-bar/ico-exit.gif)   }
-
 #cat_menu {
   padding: 0px;
   margin: 0px;
@@ -233,17 +180,17 @@ body.category4 #assets_menu_list { background-image: url(/images/top-bar/assets-
   padding: 0px;
   overflow: hidden;
   height: 56px;
-  width: 170px;
-  max-width: 165px;
+  width: 165px;
 }
-#assets_menu li {
+.top_extra_menu li {
   margin: 0px;
   padding: 1px 0px 0px 0px;
   list-style: none;
 }
-#assets_menu a {
+#user_box a,
+.top_extra_menu a {
   font-size: 12px;
   font-weight: bold;
   text-decoration: none;
@@ -252,23 +199,33 @@ body.category4 #assets_menu_list { background-image: url(/images/top-bar/assets-
   padding-left: 0px;
   height: 18px;
 }
-body.category1 #assets_menu a { color: #FDD79E }
-body.category2 #assets_menu a { color: #C4F099 }
-body.category3 #assets_menu a { color: #D6BFD3 }
-body.category4 #assets_menu a { color: #F79494 }
-#assets_menu a:hover {
+body.category1 #user_box a,
+body.category1 .top_extra_menu a { color: #FDD79E }
+body.category2 #user_box a,
+body.category2 .top_extra_menu a { color: #C4F099 }
+body.category3 #user_box a,
+body.category3 .top_extra_menu a { color: #D6BFD3 }
+body.category4 #user_box a,
+body.category4 .top_extra_menu a { color: #F79494 }
+#user_box a:hover,
+.top_extra_menu a:hover {
   background: #3465A4;
   color: #FFF;
 }
-body.category1 #assets_menu a:hover { background: #F57900; color: #FFF }
-body.category2 #assets_menu a:hover { background: #61B60E; color: #FFF }
-body.category3 #assets_menu a:hover { background: #75507B; color: #FFF }
-body.category4 #assets_menu a:hover { background: #CC0000; color: #FFF }
+body.category1 #user_box a:hover,
+body.category1 .top_extra_menu a:hover { background: #F57900; color: #FFF }
+body.category2 #user_box a:hover,
+body.category2 .top_extra_menu a:hover { background: #61B60E; color: #FFF }
+body.category3 #user_box a:hover,
+body.category3 .top_extra_menu a:hover { background: #75507B; color: #FFF }
+body.category4 #user_box a:hover,
+body.category4 .top_extra_menu a:hover { background: #CC0000; color: #FFF }
-#assets_menu a span {
+#user_box a span,
+.top_extra_menu a span {
   display: block;
   width: 18px;
-  height: 18px;
+  height: 100%;
   float: left;
   background-repeat: no-repeat;
   background-position: 50% 50%;
@@ -276,9 +233,66 @@ body.category4 #assets_menu a:hover { background: #CC0000; color: #FFF }
   opacity: 0.7;
 	filter: alpha(opacity=70);
 }
-#assets_menu a:hover span {
+#user_box a:hover span,
+.top_extra_menu a:hover span {
   opacity: 1;
 	filter: alpha(opacity=100);
 }
+/* * * User Box * * * * * * * * * * * */
+
+#user_box {
+  position: absolute;
+  top: 0px;
+  right: 0px;
+}
+
+#open_search {
+  float: right;
+  margin-right: 10px;
+}
+#user_box #open_search:hover {
+  background: none;
+}
+
+/* * * User Menu * * * * * * * * * * * */
+
+#user_menu {
+  position: absolute;
+  top: 0px;
+  right: 180px;
+  width: 130px;
+}
+
+.user_menu_first_link {
+  margin-left: 4px;
+}
+#user_menu .user_menu_first_link:hover {
+  background: none;
+}
+
+#user_menu a img {
+  float: left;
+  border: none;
+  margin: -1px 2px 0px 0px;
+  opacity: 0.7;
+	filter: alpha(opacity=70);
+}
+#user_menu a:hover img {
+  opacity: 1;
+	filter: alpha(opacity=100);
+}
+
+#user_menu ul {
+  position: absolute;
+  top: 21px;
+  right: 0px;
+  width: 130px;
+  max-width: 121px;
+  padding: 2px 4px 5px 5px;
+  margin: 0px;
+  border: 1px solid #FFF;
+  border-top: none;
+  background: #2A5896;
+}
@@ -0,0 +1,36 @@		@@ -0,0 +1,36 @@
	1	+<div id="user_menu" class="top_extra_menu">
	2	+
	3	+<% if logged_in? %>
	4	+ <%=
	5	+ link_to_homepage '<img src="' + (
	6	+ (current_user.person.image)? current_user.person.image.public_filename(:icon) : "/images/icons-bar/photo.png"
	7	+ ) +
	8	+ '" alt="'+ current_user.login() +' Icon-Photo" title="" height="20" border="0"/>'+
	9	+ current_user.login, current_user.login, :id=>'link_go_home', :class => 'user_menu_first_link'
	10	+ %>
	11	+ <ul>
	12	+ <li><a href="#"><span class="icon-menu-blog"></span> Meu Blog</a></li>
	13	+ <%=
	14	+ '<li>'+ link_to_myprofile( '<span class="icon-menu-ctrl-panel"></span>'+ _('control panel'),
	15	+ {}, nil, :id => 'link_edit_profile' ) +'</li>'+
	16	+ '<li>'+ lightbox_link_to( '<span class="icon-menu-logout"></span>'+ _('Logout'),
	17	+ { :controller => 'account', :action => 'logout_popup'}, :id => 'link_logout' ) +'</li>'
	18	+ %>
	19	+ <%=
	20	+ '<li>'+ link_to( '<span class="icon-menu-"></span>'+ _('Admin'),
	21	+ { :controller => 'admin_panel' }, :id => 'link_admin_panel' ) +
	22	+ '</li>' if current_user.person.is_admin?
	23	+ %>
	24	+ <li><a href="#"><span class="icon-menu-"></span><small>essa aba será 100% fechada</small></a></li>
	25	+ <li><a href="#"><span class="icon-menu-"></span> soon...</a></li>
	26	+ </ul>
	27	+
	28	+<% else %>
	29	+
	30	+<%= lightbox_link_to '<span class="icon-menu-login"></span>'+ _('Login'),
	31	+ { :controller => 'account', :action => 'login_popup' },
	32	+ :id => 'link_login', :class => 'user_menu_first_link' %>
	33	+
	34	+<% end %>
	35	+
	36	+</div><!-- fim id="user_menu" -->
	@@ -13,7 +13,7 @@		@@ -13,7 +13,7 @@
13	</ul><!-- fim id="cat_menu" -->	13	</ul><!-- fim id="cat_menu" -->
14		14
15	<div id="assets_menu">	15	<div id="assets_menu">
16	- <div id="assets_menu_list">	16	+ <div id="assets_menu_list" class="top_extra_menu">
17	<ul id="assets_menu_ul">	17	<ul id="assets_menu_ul">
18	<%= generate_assets_menu %>	18	<%= generate_assets_menu %>
19	</ul>	19	</ul>
	@@ -19,8 +19,14 @@		@@ -19,8 +19,14 @@
19	.icon-search { background-image: url(gnome-search.png); }	19	.icon-search { background-image: url(gnome-search.png); }
20	.icon-ok { background-image: url(gtk-ok.png); }	20	.icon-ok { background-image: url(gtk-ok.png); }
21	.icon-login { background-image: url(key-HC.gif); }	21	.icon-login { background-image: url(key-HC.gif); }
22	-.ico-menu- { background-image: url(menu-without-ico-HC.gif) }
23	-.ico-menu-blog { background-image: url(blog-HC.gif); }
24	-.ico-menu-album { background-image: url(album-HC.gif); }
25	-.ico-menu-product { background-image: url(product-HC.gif); }
26	-.ico-menu-enterprise { background-image: url(enterprise-HC.gif); }	22	+.icon-menu- { background-image: url(menu-without-ico-HC.gif) }
		23	+.icon-menu-blog { background-image: url(blog-HC.gif); }
		24	+.icon-menu-album { background-image: url(album-HC.gif); }
		25	+.icon-menu-product { background-image: url(product-HC.gif); }
		26	+.icon-menu-enterprise { background-image: url(enterprise-HC.gif); }
		27	+.icon-menu-community { background-image: url(community-HC.gif); }
		28	+.icon-menu-ctrl-panel { background-image: url(edit-HC.gif); }
		29	+.icon-menu-login { background-image: url(enter-HC.gif); }
		30	+.icon-menu-logout { background-image: url(exit-HC.gif); }
		31	+.icon-menu-search { background-image: url(search-HC.gif); }
		32	+