spud_photos 0.1.3 → 0.1.4

data/app/assets/javascripts/spud/admin/photos.js

@@ -14,19 +14,26 @@ Spud.Admin.Photos = new function(){
     $('body').on('submit', '#spud_admin_photo_album_form', self.submittedPhotoAlbumForm);
     $('body').on('submit', '#spud_admin_photo_gallery_form', self.submittedPhotoGalleryForm);
     $('body').on('submit', '#spud_admin_photo_form', self.submittedPhotoForm);
-    $('body').on('click', '.spud_admin_photos_btn_remove', self.clickedPhotoRemoveFromLibrary)
+    $('body').on('click', '.spud_admin_photos_btn_remove', self.clickedPhotoRemoveFromAlbum)
     $('body').on('click', '.spud_admin_photo_ui_thumbs_selectable .spud_admin_photo_ui_thumb', self.selectedPhotoUiThumb);
     $('body').on('click', '#spud_admin_photo_album_action_library', self.clickedPhotoLibrary);
+    $('body').on('click', '#spud_admin_photo_album_action_upload, .spud_admin_photo .spud_admin_photos_btn_edit', self.clickedPhotoAddOrEdit);
 
     // html5 drag and drop file 
-    if(typeof(FormData) != 'undefined' && typeof(XMLHttpRequest) != 'undefined'){
+    if(typeof(FormData) != 'undefined' && typeof(XMLHttpRequest) != 'undefined' && (droparea = document.getElementById('spud_admin_photo_upload_queue'))){
       html5upload = true;
       $('#spud_admin_photo_upload_queue').show();
-      var droparea = document.getElementById('spud_admin_photo_upload_queue');
       droparea.addEventListener('dragenter', self.stopDndPropagation, false);
       droparea.addEventListener('dragexit', self.stopDndPropagation, false);
       droparea.addEventListener('dragover', self.stopDndPropagation, false);
       droparea.addEventListener('drop', self.droppedFile, false);
+
+      // prevent accidental drops outside the queue
+      var body = document.getElementsByTagName("body")[0];
+      body.addEventListener('dragenter', self.stopDndPropagation, false);
+      body.addEventListener('dragexit', self.stopDndPropagation, false);
+      body.addEventListener('dragover', self.stopDndPropagation, false);
+      body.addEventListener('drop', self.stopDndPropagation, false);
     }
   };
 
@@ -38,10 +45,11 @@ Spud.Admin.Photos = new function(){
     $('#spud_admin_photo_albums_available .spud_admin_photo_ui_thumb').remove();
   }
 
-  this.clickedPhotoRemoveFromLibrary = function(e){
+  this.clickedPhotoRemoveFromAlbum = function(e){
     $(this).parents('.spud_admin_photo_ui_thumb').fadeOut(200, function(){
       $(this).remove();
     });
+    return false;
   };
 
   /* Handle file uploads passed via iframe (legacy support)
@@ -54,10 +62,10 @@ Spud.Admin.Photos = new function(){
   this.photoLegacyUploadComplete = function(id, html){
     var element = $('#spud_admin_photo_' + id);
     if(element.length > 0){
-      element.replaceWith(htmlhtml);
+      element.replaceWith(html);
     }
     else{
-      var target = $('#spud_admin_photos_selected .spud_admin_photo_ui_thumbs, #spud_admin_photos');
+      var target = $('#spud_admin_photos_selected, #spud_admin_photos');
       target.prepend(html).fadeIn(200);
     }
     $('#dialog').dialog('close');
@@ -99,6 +107,10 @@ Spud.Admin.Photos = new function(){
   -------------------------------- */
 
   this.submittedPhotoForm = function(e){
+    // disable submit button
+    var submit = $(this).find('input[type=submit]');
+    submit.attr('disabled', 'disabled').val(submit.attr('data-loading-text'));
+
     if(html5upload){
       // create a FormData object and attach form values
       var fd = new FormData();
@@ -189,6 +201,33 @@ Spud.Admin.Photos = new function(){
     progressBar.find('.progress').addClass('progress-danger');
   };
 
+  /*
+  * Photo Upload/Edit Form
+  ------------------------------- */  
+  this.clickedPhotoAddOrEdit = function(e){
+    var url = this.href;
+    $.ajax({
+      url:url,
+      success:self.photoUploadFormLoaded
+    });
+    return false;
+  };
+
+  this.photoUploadFormLoaded = function(html){
+    var dialog = $("#dialog");
+    if(dialog.length == 0){
+      dialog = $('<div id="dialog" style="display:hidden;"></div>').appendTo('body');
+    }
+    dialog.html(html);
+    dialog.dialog({
+      width: 500,
+      modal: true,
+      height: 'auto',
+      title: 'Upload Photo',
+      buttons: {}
+    });
+  };
+
   /*
   * Add From Photo Library
   ------------------------------- */

data/app/models/spud_photo.rb

@@ -19,7 +19,7 @@ class SpudPhoto < ActiveRecord::Base
   def dynamic_styles
     admin_styles = {
       :spud_admin_small => '125x125#',
-      :spud_admin_medium => '300x300'
+      :spud_admin_medium => '300x200'
     }
     return admin_styles.merge(Spud::Photos.config.photo_styles)
   end

data/app/views/spud/admin/photo_albums/_form.html.erb

@@ -16,7 +16,7 @@
     <legend>Selected Photos</legend>
     <div id="spud_admin_photo_album_actions" class="control-group">
       <%= link_to "Photo Library", spud_admin_photos_path, :class => "btn btn-primary", :id => 'spud_admin_photo_album_action_library' %>
-      <%= link_to "Upload Photo", new_spud_admin_photo_path, :class => "ajax btn btn-success", :title => "New Photo" %>
+      <%= link_to "Upload Photo", new_spud_admin_photo_path, :class => "btn btn-success", :id => 'spud_admin_photo_album_action_upload' %>
     </div>
     <div id="spud_admin_photo_upload_queue">
       <p>Drag and drop photos here to upload</p>

data/app/views/spud/admin/photos/_photo.html.erb

@@ -2,12 +2,12 @@
   :rel => photo.id,
   :id => "spud_admin_photo_#{photo.id}", 
   :style => "background-image:url('#{photo.photo.url(:spud_admin_small)}')",
-  :class => "spud_admin_photo_ui_thumb spud_admin_photo_ui_thumb_small" do %>
+  :class => "spud_admin_photo_ui_thumb spud_admin_photo_ui_thumb_small spud_admin_photo" do %>
   <div style="display:none;">
     <%= hidden_field_tag 'spud_photo_album[photo_ids][]', photo.id %>
   </div>
   <div class="spud_admin_photo_ui_thumb_controls">
-    <%= link_to 'Edit', edit_spud_admin_photo_path(photo), :class => 'ajax spud_admin_photos_btn_edit' %>
+    <%= link_to 'Edit', edit_spud_admin_photo_path(photo), :class => 'spud_admin_photos_btn_edit' %>
     <%= link_to 'Delete', '#', :class => 'spud_admin_photos_btn_remove' %>
   </div>
 <% end %>

data/lib/spud_photos/version.rb

@@ -1,5 +1,5 @@
 module Spud
 	module Photos
-	  VERSION = "0.1.3"
+	  VERSION = "0.1.4"
 	end
 end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: spud_photos
 version: !ruby/object:Gem::Version
-  version: 0.1.3
+  version: 0.1.4
   prerelease: 
 platform: ruby
 authors:
@@ -13,7 +13,7 @@ date: 2012-04-19 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: rails
-  requirement: &70246767895340 !ruby/object:Gem::Requirement
+  requirement: &70132753170220 !ruby/object:Gem::Requirement
     none: false
     requirements:
     - - ~>
@@ -21,10 +21,10 @@ dependencies:
         version: 3.2.2
   type: :runtime
   prerelease: false
-  version_requirements: *70246767895340
+  version_requirements: *70132753170220
 - !ruby/object:Gem::Dependency
   name: spud_core
-  requirement: &70246767894420 !ruby/object:Gem::Requirement
+  requirement: &70132753162720 !ruby/object:Gem::Requirement
     none: false
     requirements:
     - - ! '>='
@@ -35,10 +35,10 @@ dependencies:
         version: 0.9.0
   type: :runtime
   prerelease: false
-  version_requirements: *70246767894420
+  version_requirements: *70132753162720
 - !ruby/object:Gem::Dependency
   name: paperclip
-  requirement: &70246767893080 !ruby/object:Gem::Requirement
+  requirement: &70132753161700 !ruby/object:Gem::Requirement
     none: false
     requirements:
     - - ! '>='
@@ -46,10 +46,10 @@ dependencies:
         version: '0'
   type: :runtime
   prerelease: false
-  version_requirements: *70246767893080
+  version_requirements: *70132753161700
 - !ruby/object:Gem::Dependency
   name: mysql2
-  requirement: &70246767891900 !ruby/object:Gem::Requirement
+  requirement: &70132753160860 !ruby/object:Gem::Requirement
     none: false
     requirements:
     - - ! '>='
@@ -57,7 +57,7 @@ dependencies:
         version: '0'
   type: :development
   prerelease: false
-  version_requirements: *70246767891900
+  version_requirements: *70132753160860
 description: Spud Photos is a feature complete photo management/gallery for the spud
   engine. Manage multiple galleries, albums, and photos. Use HTML 5 to drag and drop
   many images at once.
@@ -72,9 +72,7 @@ files:
 - app/assets/images/spud/photos/photo_albums_thumb.png
 - app/assets/images/spud/photos/photo_albums_thumb@2x.png
 - app/assets/javascripts/spud/admin/photos.js
-- app/assets/javascripts/spud_photos.js
 - app/assets/stylesheets/spud/admin/photos.css
-- app/assets/stylesheets/spud_photos.css
 - app/controllers/photo_albums_controller.rb
 - app/controllers/photo_galleries_controller.rb
 - app/controllers/spud/admin/photo_albums_controller.rb
@@ -169,7 +167,7 @@ required_ruby_version: !ruby/object:Gem::Requirement
       version: '0'
       segments:
       - 0
-      hash: -1394536087294010782
+      hash: -1093842542963525914
 required_rubygems_version: !ruby/object:Gem::Requirement
   none: false
   requirements:
@@ -178,7 +176,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
       version: '0'
       segments:
       - 0
-      hash: -1394536087294010782
+      hash: -1093842542963525914
 requirements: []
 rubyforge_project: 
 rubygems_version: 1.8.10

data/app/assets/javascripts/spud_photos.js

@@ -1,74 +0,0 @@
-spud_photos = new function(){
-
-  var self = this;
-  var transition;
-
-  this.init = function(){
-    transition = new spud_photos.transitions.slide('#spud_photo_showcase');
-    $('#spud_photo_album_photos').on('click', 'a', self.clickedPhoto);
-  };
-
-  this.clickedPhoto = function(e){
-    e.preventDefault();
-    transition.transition($(this).attr('href'));
-  };
-};
-
-spud_photos.transitions = {};
-
-spud_photos.transitions.fade = function(_container, _firstPhoto){
-
-  var self = this;
-  var z_index = 100;
-  var container = $(_container);
-
-  this.transition = function(photo){
-    z_index++;
-    var image = $('<img/>', {
-      src:photo,
-      style:'position:absolute;left:0;top:0;z-index:'+z_index
-    });
-    container.trigger('spud:photos:transitionStart');
-    container.append(image);
-    image.hide().fadeIn(200, self.fadeCompleted);
-  };
-
-  this.fadeCompleted = function(e){
-    var imgs = container.find('img');
-    if(imgs.length > 1){
-      $(imgs[0]).remove();
-    }
-    container.trigger('spud:photos:transitionComplete');
-  };
-};
-
-spud_photos.transitions.slide = function(_container, _firstPhoto){
-
-  var self = this;
-  var container = $(_container);
-  var slider = $('<div/>', {
-    id:'spud_photos_transition_slider',
-    style:'position:absolute;left:0;top:0;width:400px;height:800px'
-  });
-  container.append(slider);
-
-  this.transition = function(photo){
-    console.log('transition slider');
-    var image = $('<img/>', {
-      src:photo,
-      style:'display:block'
-    });
-    container.trigger('spud:photos:transitionStart');
-    slider.append(image);
-    slider.animate({top:-400}, 500, self.slideCompleted);
-  };
-
-  this.slideCompleted = function(e){
-    var imgs = container.find('img');
-    if(imgs.length > 1){
-      $(imgs[0]).remove();
-    }
-    slider.css('top', 0);
-    container.trigger('spud:photos:transitionComplete');
-  };
-}