用户上传头像功能

app/views/layouts/_logined_header.html.erb

@@ -28,7 +28,7 @@
   <div class="navHomepageProfile">
     <ul>
       <li class="homepageProfileMenuIcon">
-        <%= link_to "<div class='mt5 mb8'>#{image_tag(url_to_avatar(User.current),:width =>"40",:height => "40",:alt=>"头像")}</div>".html_safe,user_activities_path(User.current.id)%>
+        <%= link_to "<div class='mt5 mb8'>#{image_tag(url_to_avatar(User.current),:width =>"40",:height => "40",:alt=>"头像", :id => "nh_user_logo")}</div>".html_safe,user_activities_path(User.current.id)%>
         <ul class="topnav_login_list">
           <li><a href="javascript:void(0);" class="menuGrey">修改资料</a> </li>
           <li><a href="javascript:void(0);" class="menuGrey">账号设置</a> </li>

app/views/layouts/new_base_user.html.erb

@@ -10,7 +10,7 @@
   <%= stylesheet_link_tag 'jquery/jquery-ui-1.9.2', 'new_public', 'user_leftside', :media => 'all' %>
   <%= stylesheet_link_tag 'rtl', :media => 'all' if l(:direction) == 'rtl' %>
   <%= javascript_heads %>
-  <%= javascript_include_tag "bootstrap"%>
+  <%= javascript_include_tag "bootstrap","avatars"%>
   <%= heads_for_theme %>
   <%= call_hook :view_layouts_base_html_head %>
   <%= yield :header_tags -%>
@@ -30,12 +30,12 @@
     <div class="homepageLeft">
       <div class="homepagePortraitContainer">
         <div class="homepagePortraitImage">
-          <%= image_tag(url_to_avatar(@user),width:"206", height: "206") %>
+          <%= image_tag(url_to_avatar(@user),width:"206", height: "206", :id=>'nh_user_tx') %>
           <% if User.current.logged?%>
             <% if User.current == @user%>
               <div>
                 <div class="homepageEditProfile">
-                  <a href="javascript:void(0);" class="homepageEditProfileIcon"></a>
+                  <a href="<%= url_for(:controller => 'my', :action => 'clear_user_avatar_temp') %>" data-remote="true" class="homepageEditProfileIcon"></a>
                 </div>
               </div>
             <% else %>
@@ -174,5 +174,66 @@
   </div>
   <%= render :partial => 'layouts/new_feedback' %>
 </div>
+
+<div id="ajax-modal" style="display:none;"></div>
+<div id="ajax-indicator" style="display:none;">
+  <span><%= l(:label_loading) %></span>
+</div>
+<div id="nh_tx_dialog_html" class="white_content" style="display:none;">
+  <div>
+    <div><a href="javascript:hideModal();" class="box_close"></a></div>
+    <div class="cl"></div>
+    <div class="pro_new">
+      <h3 class="box_h3 mb10">头像设置</h3>
+      <div class="uppicBox">
+        <%= file_field_tag 'avatar[image]',
+                           :id => nil,
+                           :class => 'uppic_btn',
+                           :style => 'width:70px;',#added by young
+                           :size => "1",
+                           :multiple => false,
+                           :onchange => 'addInputAvatar(this);',
+                           :data => {
+                                   :max_file_size => Setting.attachment_max_size.to_i.kilobytes,
+                                   :max_file_size_message => l(:error_attachment_too_big, :max_size => number_to_human_size(Setting.attachment_max_size.to_i.kilobytes)),
+                                   :max_concurrent_uploads => Redmine::Configuration['max_concurrent_ajax_uploads'].to_i,
+                                   :file_type => Redmine::Configuration['pic_types'].to_s,
+                                   :type_support_message => l(:error_pic_type),
+                                   :upload_path => upload_avatar_path(:format => 'js'),
+                                   :description_placeholder => nil ,# l(:label_optional_description)
+                                   :source_type => @user.class.to_s,
+                                   :source_id => @user.id.to_s
+                           } %>
+        <!--<br/>-->
+        <!--<span>只支持jpg,png,gif,大小不超过5M</span>-->
+      </div>
+      <div class="showpicBox">
+        <p>预览</p>
+        <%= image_tag(url_to_avatar(@user), :style=>"width:96px;height:96px;",:class=>"mb5 mt10",:nhname=>'avatar_image') %>
+        <span >96px*96px</span> <br />
+        <div class="mb20"></div>
+        <%= image_tag(url_to_avatar(@user), :style=>"width:48px;height:48px;",:class=>"mb5",:nhname=>'avatar_image') %>
+        <br />
+        <span>48px*48px</span> <br />
+      </div>
+      <div class="cl mb10"></div>
+      <a href="javascript:hideModal();" class=" fr grey_btn mr15"> 取&nbsp;&nbsp;消</a>
+      <a href="<%= url_for(:controller => 'my', :action => 'save_user_avatar') %>" data-remote="true" class="blue_btn fr mr10">确&nbsp;&nbsp;定</a>
+    </div><!--talknew end-->
+    <div class="cl"></div>
+  </div><!--floatbox end-->
+</div>
+
+<script type="text/javascript">
+    $(function(){
+        if($(".top_new").length==0){
+            $("#RSide").css("min-height",$("#LSide").height()-30);
+        }
+        else{
+            $("#RSide").css("min-height",$("#LSide").height()-87);
+        }
+
+    });
+</script>
 </body>
 </html>

app/views/my/save_user_avatar.js.erb

@@ -1,2 +1,3 @@
 $("#nh_user_tx").replaceWith('<%= image_tag(url_to_avatar(@user), :id=>'nh_user_tx',:style=>"width:214px;height:214px;overflow:hidden",:alt=>"头像") %>');
+$("#nh_user_logo").replaceWith('<%= image_tag(url_to_avatar(@user), :id=>'nh_user_logo',:width =>"40",:height => "40",:alt=>"头像") %>');
 hideModal();

public/stylesheets/new_public.css

@@ -424,7 +424,7 @@ a.homepageImageNumber:hover {color:#15bccf;}
 .homepageLeftMenuCourses {font-size:14px; border-bottom:1px solid #dddddd;}
 .homepageLeftMenuCoursesLine {padding-left:25px; height:38px; line-height:38px; vertical-align:middle;}
 .homepageLeftMenuCoursesLine:hover {background-color:#b3e0ee;}
-a.coursesLineGrey {color:#484848; display:block;}
+a.coursesLineGrey {color:#15bccf; display:block;}
 a.coursesLineGrey:hover {color:#ffffff;}
 .homepageLeftMenuMore {height:18px;}
 .homepageLeftMenuMore:hover {background-color:#b3e0ee;}
@@ -671,3 +671,12 @@ div.flash.warning, .conflict {
 .floatbox{ width:420px; border:3px solid #15bccf; background:#fff; padding:5px;}
 a.box_close{ display:block; float:right; width:16px; height:16px; background:url(../images/img_floatbox.png) 0 0 no-repeat;}
 a:hover.box_close{background:url(../images/img_floatbox.png) -22px 0 no-repeat;}
+
+/*个人主页头像*/
+.white_content_users{display:none;position:fixed;top:45%;left:45%;width:210px;height: auto; margin-bottom:20px;padding:10px;border:3px solid #15bccf;background-color:white;z-index:1002;overflow:auto;}
+a.box_close{background:url(../images/img_floatbox.png) -22px 0 no-repeat;}
+.box_h3{ color:#15bccf; font-size:16px;}
+.uppicBox{ width:265px; height:265px; background:#f2f2f5; float:left; color:#666;  text-align:center;}
+.showpicBox{width:133px; height:250px; background:#f2f2f5; float:left; margin-left:20px; text-align:center; padding-top:15px; color:#666;}
+.mr15{ margin-right:15px;}
+.uppic_btn{border:none; width:150px; background:none; margin-bottom:5px; color:#666; margin-top:105px;}