diff --git a/app/views/albums/show.html.haml b/app/views/albums/show.html.haml index 6bdcafb6b..e916b14d1 100644 --- a/app/views/albums/show.html.haml +++ b/app/views/albums/show.html.haml @@ -5,8 +5,10 @@ = @album.name -if current_user.owns? @album - .button.right#add_photo_button - = link_to 'Add Photos', '#' + .right#add_photo_button + #add_photo_loader + = image_tag 'ajax-loader.gif' + = link_to 'Add Photos', '#', :class => 'button' #add_photo_pane.contextual_pane = render "photos/new_photo", :photo => @photo, :album => @album @@ -27,5 +29,5 @@ = link_to "⇧ albums", albums_path -if current_user.owns? @album - .button.right - = link_to 'Edit Album', edit_album_path(@album) + .right + = link_to 'Edit Album', edit_album_path(@album), :class => 'button' diff --git a/app/views/photos/_new_photo.haml b/app/views/photos/_new_photo.haml index 23e4ad68c..83547fdaa 100644 --- a/app/views/photos/_new_photo.haml +++ b/app/views/photos/_new_photo.haml @@ -7,42 +7,20 @@ onStart: function(event, total) { return confirm("You are about to upload " + total + " photos. Are you sure?"); }, - setName: function(text) { - $("#progress_report_name").text(text); - }, - setStatus: function(text) { - $("#progress_report_status").text(text); - }, - setProgress: function(val) { - //$("#progress_report_bar").css('width', Math.ceil(val*100)+"%"); - }, - onFinishOne: function(event, response, name, number, total) { - //alert(response); - }, onFinish: function(event, total){ - $("#progress_report").delay(600).slideUp(200); - $("#add_photo_box").delay(600).fadeOut(200); + $("#add_photo_button .button").html( "Add Photos" ); + $("#add_photo_loader").fadeOut(0); }, onStart: function(event, total){ - $("#progress_report").slideDown(600); + $("#add_photo_pane").fadeOut(400); + $("#add_photo_button .button").html( "Uploading Photos" ); + $("#add_photo_loader").fadeIn(400); return true; } }); }); -:css - #progress_report, #progress_report_name, #progress_report_status{ - font-size: 12px; - padding: 0; - line-height: auto; - } - = form_for photo, :html => {:multipart => true} do |f| = f.error_messages = f.hidden_field :album_id, :value => album.id = f.file_field :image, :multiple => 'multiple' - - #progress_report{ :style => "display:none;" } - = image_tag "loader.gif" - #progress_report_name - #progress_report_status{ :style => "font-style: italic;" } diff --git a/app/views/photos/show.html.haml b/app/views/photos/show.html.haml index bf5a8f01d..e27988446 100644 --- a/app/views/photos/show.html.haml +++ b/app/views/photos/show.html.haml @@ -27,8 +27,8 @@ = link_to "⇧ #{@album.name}", album_path(@album) -if current_user.owns? @album - .button.right - = link_to 'Delete Photo', @photo, :confirm => 'Are you sure?', :method => :delete + .right + = link_to 'Delete Photo', @photo, :confirm => 'Are you sure?', :method => :delete, :class => 'button' %h4{:class => "show_post_comments"} = "comments (#{@photo.comments.count})" diff --git a/app/views/shared/_group_nav.haml b/app/views/shared/_group_nav.haml index 281aa96c9..bee73edf7 100644 --- a/app/views/shared/_group_nav.haml +++ b/app/views/shared/_group_nav.haml @@ -8,8 +8,8 @@ #add_group_pane.contextual_pane = render "groups/new_group" - - if @group - #friend_pictures + #friend_pictures + - if @group - for friend in @group.people = person_image_link(friend) diff --git a/public/images/ajax-loader.gif b/public/images/ajax-loader.gif new file mode 100644 index 000000000..e40f19a28 Binary files /dev/null and b/public/images/ajax-loader.gif differ diff --git a/public/stylesheets/application.css b/public/stylesheets/application.css index ad207bf50..6867646cb 100644 --- a/public/stylesheets/application.css +++ b/public/stylesheets/application.css @@ -70,7 +70,6 @@ header { color: #555555; background-color: #2b2726; background-color: black; - background-color: white; border-bottom: 3px solid #333333; padding: 6px 0; padding-top: 0; } @@ -381,9 +380,15 @@ h1.big_text { border-bottom: 1px solid #666666; text-align: center; } +.big_text .right { + top: -8px; } + +#content_bottom .right { + top: -5px; } + .right { - float: right; - margin-top: 6px; } + display: inline; + float: right; } .back { position: absolute; @@ -459,3 +464,9 @@ h1.big_text { #group #friend_pictures img { display: none; height: 40px; } + +#add_photo_loader { + position: absolute; + display: none; + left: -25px; + top: 4px; } diff --git a/public/stylesheets/sass/application.sass b/public/stylesheets/sass/application.sass index 75b14624e..0db9a9a97 100644 --- a/public/stylesheets/sass/application.sass +++ b/public/stylesheets/sass/application.sass @@ -75,7 +75,6 @@ header :background :color #2B2726 :color #000 - :color #fff :border :bottom 3px solid #333 :padding 6px 0 @@ -473,10 +472,16 @@ h1.big_text :text :align center +.big_text + .right + :top -8px +#content_bottom + .right + :top -5px + .right + :display inline :float right - :margin - :top 6px .back :position absolute @@ -575,3 +580,9 @@ h1.big_text img :display none :height 40px + +#add_photo_loader + :position absolute + :display none + :left -25px + :top 4px