lolita-file-upload 0.6.2 → 0.7.1

data/VERSION

@@ -1 +1 @@
-0.6.2
+0.7.1

data/app/assets/javascripts/lolita/file-upload/application.js

@@ -0,0 +1 @@
+//= require lolita/file-upload/gallery

data/app/assets/javascripts/lolita/file-upload/gallery.js.coffee

@@ -0,0 +1,129 @@
+class LolitaFileUploadGallery
+  @_instance: null
+  _initialized: false
+  _imageQueue: []
+
+  @buttonTitle = ""
+  @buttonImage = ""
+
+  GALLERY_SELECTOR = "#fixed-gallery"
+  SLIDER_SELECTOR = "#fixed-gallery .slider"
+  CLOSE_BUTTON_SELECTOR = "#fixed-gallery .close"
+  TAPE_SELECTOR = "#fixed-gallery .slider ul"
+  IMAGE_SELECTOR = "#fixed-gallery .slider li img"
+
+  @get: ->
+    if not @_instance?
+      @_instance = new @
+    @_instance
+
+  init: ->
+    @_observeImageDropping()
+    @_createSlider()
+    @_addImagesToDOM()
+    @_observeCloseButton()
+    @_addButtonToTinyMCE()
+    @._initialized = true
+
+  toggle: ->
+    @_gallery().toggle()
+    @_slider().elastislide("refresh")
+
+  add: (filePath, originalFilePath) ->
+    if @_isImagePath(filePath)
+      $imageContainer = @_imageContainer(filePath, originalFilePath)
+      if @._initialized
+        @_addToDOM($imageContainer)
+      else
+        @_addToQueue($imageContainer)
+
+  _observeImageDropping: ->
+    tinyMCE.onAddEditor.add( (mgr, editor) =>
+      @_observeDropOnTinyMCEEditor(editor)
+    )
+
+  _createSlider: ->
+    @_slider().elastislide({
+      imageW: 100
+      border: 2
+      margin: 5
+    })
+
+  _makeImagesDraggable: ->
+    $(IMAGE_SELECTOR).draggable("destroy")
+    $(IMAGE_SELECTOR).draggable({
+      appendTo: "body"
+      zIndex: 20000
+      helper: "clone"
+      cursor: "move"
+    })
+
+  _addImagesToDOM: ->
+    while image = @._imageQueue.shift()
+      @_addToDOM(image)
+  
+  _observeCloseButton: ->
+    $(CLOSE_BUTTON_SELECTOR).mouseenter(->
+      $(this).addClass("ui-state-hover")
+    ).mouseleave(->
+      $(this).removeClass("ui-state-hover")
+    ).click(=>
+      @_gallery().hide()
+    )
+
+  _addButtonToTinyMCE: ->
+    TinyMCEConfigManager.get().config.addAfter("buttons", "gallery", "image")
+    TinyMCEConfigManager.get().config.addFunction("setup", (editor) ->
+      editor.addButton("gallery", {
+        title: LolitaFileUploadGallery.buttonTitle
+        image: LolitaFileUploadGallery.buttonImage
+        onclick: ->
+         LolitaFileUploadGallery.get().toggle()
+      })
+    )
+
+  _gallery: ->
+    $(GALLERY_SELECTOR)
+
+  _slider: ->
+    $(SLIDER_SELECTOR)
+
+  _isImagePath: (filePath) ->
+    filePath.match(/\.(jpg|jpeg|gif|png|ico)$/)
+
+  _tape: ->
+    $(TAPE_SELECTOR)
+
+  _imageContainer: (imagePath, originalImagePath) ->
+    $("<li><a href='#'>" + @_imageTag(imagePath, originalImagePath) + "</a></li>")
+
+  _imageTag: (imagePath, originalImagePath) ->
+    "<img src='"+ imagePath + "' alt='" + imagePath + "' data-original-url='" + originalImagePath + "' />"
+
+  _addToDOM: ($imageContainer) ->
+    @_tape().append($imageContainer)
+    @_slider().elastislide("add", $imageContainer)
+    @_makeImagesDraggable()
+
+  _addToQueue: ($imageContainer) ->
+    @._imageQueue.push($imageContainer)
+
+  _observeDropOnTinyMCEEditor: (newEditor) ->
+    self = this
+    newEditor.onInit.add( (editor) ->
+      $(editor.contentDocument).ready ->
+        self._editorContainer(editor).droppable({
+          drop: (event, ui) =>
+            editor.selection.setContent(self._insertableImageTag(ui.draggable))
+        })
+    )
+
+  _editorContainer: (editor) ->
+    $("#" + editor.editorContainer).find(".mceIframeContainer")
+
+  _insertableImageTag: (draggableImage) ->
+    imageSrc = draggableImage.data("original-url")
+    "<img src='" + imageSrc + "' alt='" + imageSrc + "' />"
+
+
+window.LolitaFileUploadGallery = LolitaFileUploadGallery

data/app/assets/stylesheets/lolita/file-upload/application.css

@@ -0,0 +1,4 @@
+/*
+*= require lolita/file-upload/uploader
+*= require lolita/file-upload/gallery
+*/

data/app/assets/stylesheets/lolita/file-upload/gallery.css

@@ -0,0 +1,26 @@
+#fixed-gallery {
+  position: fixed;
+  bottom: 0px;
+  left: 0px;
+  border-bottom: 4px solid #CCC;
+  background-color: #e9e9e9;
+  z-index: 100;
+  width: 100%;
+  border-bottom: 4px solid #CCC;
+  -moz-box-shadow: #666 2px 2px 15px;
+  -webkit-box-shadow: #666 2px 2px 15px;
+  box-shadow: #666 2px 2px 15px;
+  display:none;
+  overflow: hidden;
+  height: 120px;
+}
+#fixed-gallery .close{
+  z-index: 100;
+  position: absolute;
+  top: 3px;
+  left: 5px;
+  margin: 2px;
+  width: 16px;
+  padding: 4px;
+  cursor: pointer;
+}

data/{vendor/assets/stylesheets/lolita/upload/lolita_file_upload.css.scss → app/assets/stylesheets/lolita/file-upload/uploader.css.erb}

@@ -24,8 +24,8 @@
 }
 .filelist .file-item .window:hover {border-color: #887bd4; height: 200px;}
 .filelist .file-item .window .links {display: none; position: absolute; top: 80px; padding: 10px 0; text-align: center; width: 100%; background: #f6f6f6;}
-.filelist .file-item .window .links .edit_link {margin-right: 10px; background: image-url("lolita/upload/edit.png") no-repeat left center; padding-left: 15px;}
-.filelist .file-item .window .links .delete_link {background: image-url("lolita/upload/delete.png") no-repeat left center; padding-left: 15px;}
+.filelist .file-item .window .links .edit_link {margin-right: 10px; background: url(<%= asset_path "lolita/file-upload/edit.png" %>) no-repeat left center; padding-left: 15px;}
+.filelist .file-item .window .links .delete_link {background: url(<%= asset_path "lolita/file-upload/delete.png" %>) no-repeat left center; padding-left: 15px;}
 .filelist .file-item .window:hover .links {display: block;}
 .filelist .file-item img {max-width: 100%;}
 .filelist .file-item p {height: 40px; line-height: 20px; text-align: center; margin: 5px 0; color: #777;}
@@ -55,12 +55,12 @@
 #main #content .box .edit-file-form .file-editor .action-links {clear: both; padding-top: 20px; overflow: hidden;}
 #main #content .box .edit-file-form .file-editor .action-links .navigation {
   float: left;
-  .back {margin-right: 15px; padding-left: 15px; background: image-url("lolita/upload/back.png") no-repeat left center;}
-  .previous {padding-left: 15px; margin-right: 10px; background: image-url("lolita/upload/prev.png") no-repeat left center}
-  .next {padding-right: 15px; background: image-url("lolita/upload/next.png") no-repeat right center}
+  .back {margin-right: 15px; padding-left: 15px; background: url(<%= asset_path "lolita/file-upload/back.png" %>) no-repeat left center;}
+  .previous {padding-left: 15px; margin-right: 10px; background: url(<%= asset_path "lolita/file-upload/prev.png" %>) no-repeat left center}
+  .next {padding-right: 15px; background: url(<%= asset_path "lolita/file-upload/next.png" %>) no-repeat right center}
 }
 #main #content .box .edit-file-form .file-editor .action-links .actions {
   float: right;
-  .delete {padding-left: 15px; margin-right: 10px; background: image-url("lolita/upload/delete.png") no-repeat left center}
-  .save {padding-left: 15px; background: image-url("lolita/upload/save.png") no-repeat left center}
+  .delete {padding-left: 15px; margin-right: 10px; background: url(<%= asset_path "lolita/file-upload/delete.png" %>) no-repeat left center}
+  .save {padding-left: 15px; background: url(<%= asset_path "lolita/file-upload/save.png" %>) no-repeat left center}
 }

data/app/views/components/lolita/configuration/tab/files/_cells.html.erb

@@ -7,6 +7,6 @@
   <% end %>
 </td>
 <td style="margin-top: 3px; border-bottom: 2px solid #E1E1E1; width: 55px;text-align: center; font-size: 14px; padding: 7px 20px; vertical-align: middle;">
-  <%= link_to image_tag("lolita/upload/edit.png"),send(:"edit_lolita_#{tab.dbi.klass.model_name.singular}_upload_path", "#{tab.dbi.klass.model_name.singular}_id" => (resource.nil? || resource.new_record?) ? 0 : resource.id, :association => tab.association.name, :id=>file.id),:remote=>true %>
-  <%= link_to image_tag("lolita/upload/delete-picture.png"),send(:"lolita_#{tab.dbi.klass.model_name.singular}_upload_path", "#{tab.dbi.klass.model_name.singular}_id" => (resource.nil? || resource.new_record?) ? 0 : resource.id, :association => tab.association.name, :id=>file.id),:method=>:delete,:remote=>true,:confirm=>"Are you sure?" %>
+  <%= link_to image_tag("lolita/file-upload/edit.png"),send(:"edit_lolita_#{tab.dbi.klass.model_name.singular}_upload_path", "#{tab.dbi.klass.model_name.singular}_id" => (resource.nil? || resource.new_record?) ? 0 : resource.id, :association => tab.association.name, :id=>file.id),:remote=>true %>
+  <%= link_to image_tag("lolita/file-upload/delete-picture.png"),send(:"lolita_#{tab.dbi.klass.model_name.singular}_upload_path", "#{tab.dbi.klass.model_name.singular}_id" => (resource.nil? || resource.new_record?) ? 0 : resource.id, :association => tab.association.name, :id=>file.id),:method=>:delete,:remote=>true,:confirm=>"Are you sure?" %>
 </td>

data/app/views/components/lolita/configuration/tab/files/_file.html.erb

@@ -1,6 +1,6 @@
 <% if file.send(tab.uploader).to_s =~ /(jpg|jpeg|png|gif)$/i %>
   <% url = file.send(tab.uploader).normalized.blank? ? file.send(tab.uploader).url : file.send(tab.uploader).normalized.url %>
-  <%= image_tag(url) %>
+  <%= image_tag(url, :title => file.title || File.basename(url)) %>
 <% else %>
   <%= link_to file.send(tab.uploader).url, file.send(tab.uploader).url %>
 <% end %>

data/app/views/components/lolita/configuration/tab/files/_fixed_gallery.html.haml

@@ -1,32 +1,14 @@
-:css
-  #fixed-gallery {
-    position: fixed;
-    top: 0px;
-    left: 0px;
-    border-bottom: 4px solid #CCC;
-    background-color: white;
-    z-index: 200001;
-    width: 100%;
-    display: block;
-    border-bottom: 4px solid #CCC;
-    -moz-box-shadow: #666 2px 2px 15px;
-    -webkit-box-shadow: #666 2px 2px 15px;
-    box-shadow: #666 2px 2px 15px;
-    display:none;
-    overflow: auto;
-  }
-  #fixed-gallery button{
-    position: fixed;
-    right: 35px;
-    z-index: 200001;
-  }
-
-%div{:id=>"fixed-gallery"}
-  - resource_class.lolita.tabs.select{|tab| tab.type == :files}.each do |tab|
-    %h1= tab.title
-    / - files = tab.association_type == :one ? [resource.send(tab.association.name)].compact :  resource.send(tab.association.name)
-    / - files.each do |file|
-    /   - if file.send(tab.uploader).to_s =~ /(jpg|jpeg|png|gif)$/i 
-    /     - url = file.send(tab.uploader).normalized.blank? ? file.send(tab.uploader).url : file.send(tab.uploader).normalized.url
-    /     = #image_tag(url)
-  %button{:onclick=>"$('#fixed-gallery').hide();"}Aizvērt
+#fixed-gallery
+  .slider.es-carousel-wrapper
+    .es-carousel
+      %ul
+  %div.close.ui-state-default.ui-corner-all
+    %span.ui-icon.ui-icon-closethick
+    
+:javascript
+  $(function(){
+    LolitaFileUploadGallery.buttonTitle = '#{t('lolita.tinymce.gallery')}'
+    LolitaFileUploadGallery.buttonImage = '#{asset_path('lolita/tinymce_gallery.png')}'
+    LolitaFileUploadGallery.get().init()
+  })
+  

data/app/views/components/lolita/configuration/tab/files/_image.html.erb

@@ -16,7 +16,9 @@
   <p><%= File.basename(file.send(tab.uploader).url) %></p>
 </div>
 <script>
-  $('#fixed-gallery').append("<%=escape_javascript(render_component(*tab.build("",:file,:file=>file,:format=>"html")))%>");
+  <% if file.send(tab.uploader).preview %>
+    LolitaFileUploadGallery.get().add('<%= file.send(tab.uploader).preview.url %>', '<%= file.send(tab.uploader).url %>')
+  <% end %>
   <% if tab.association_type == :many
       ids = "#{resource_name}[#{tab.association.name.to_s.singularize}_ids][]"
     else

data/app/views/components/lolita/configuration/tab/files/_row.html.erb

@@ -1,6 +1,8 @@
 <tr id="upload_<%=tab.association.name%>_row_<%=file.id%>" data-<%=tab.association.name%>-id="<%=file.id%>">
   <%= render_component *tab.build("",:cells,:file=>file) %>
   <script>
-    $('#fixed-gallery').append("<%=escape_javascript(render_component(*tab.build("",:file,:file=>file,:format=>"html")))%>");
+    <% if file.send(tab.uploader).preview %>
+      LolitaFileUploadGallery.get().add('<%= file.send(tab.uploader).preview.url %>', '<%= file.send(tab.uploader).url %>)
+    <% end %>
   </script>
 </tr>

data/app/views/components/lolita/configuration/tab/files/_upload_script.html.erb

@@ -1,5 +1,5 @@
   <% unless ::I18n.locale.to_s.downcase=="en" %>
-  <%= javascript_include_tag "lolita/upload/I18n/#{Lolita.locale}.js"%>
+  <%= javascript_include_tag "lolita/file-upload/I18n/#{Lolita.locale}.js"%>
 <% end %>
 <script type="text/javascript">  
  $(function(){  
@@ -40,7 +40,7 @@
     },
 
     // Flash settings
-    flash_swf_url : "<%=asset_path("lolita/upload/plupload.flash.swf")%>",
+    flash_swf_url : "<%=asset_path("lolita/file-upload/plupload.flash.swf")%>",
     init:{
       FileUploaded:function(uploader, file, info){
         <% if tab.association_type == :many %>

data/config/locales/en.yml

@@ -1,4 +1,11 @@
 en:
+  components:
+    lolita:
+      configuration:
+        tab:
+          files:
+          fixed_gallery:
+            close: Close
   lolita:
     uploads_controller:
       update:
@@ -7,6 +14,8 @@ en:
     upload:
       errors:
         "file too big": "file too big (max %{value} %{unit})"
+      gallery:
+        close: "Close"
     tabs:
       titles:
         files: "Files"

data/config/locales/lv.yml

@@ -1,4 +1,11 @@
 lv:
+  components:
+    lolita:
+      configuration:
+        tab:
+          files:
+          fixed_gallery:
+            close: Aizvērt
   lolita:
     uploads_controller:
       update:

data/lib/lolita-file-upload.rb

@@ -33,15 +33,6 @@ Lolita::Hooks.component(:"/lolita/configuration/tab/form").around do
   end
 end
 
-Lolita::Hooks.component(:"/lolita/configuration/field/string/text/display").around do
-  field = self.component_locals[:field]
-  if field.dbi.klass.lolita.tabs.by_type(:files)
-    self.render_component "lolita/configuration/field/string/text_gallery", :display, :field => field
-  else
-    let_content
-  end
-end
-
 require 'lolita-file-upload/module'
 
 if defined?(Rails)
@@ -49,8 +40,10 @@ if defined?(Rails)
 end
 
 Lolita.after_setup do 
-  Lolita.application.assets << "lolita/upload/application_vendor.css"
-  Lolita.application.assets <<  "lolita/upload/application_vendor.js"
+  Lolita.application.assets << "lolita/file-upload/application_vendor.css"
+  Lolita.application.assets <<  "lolita/file-upload/application_vendor.js"
+  Lolita.application.assets <<  "lolita/file-upload/application.css"
+  Lolita.application.assets <<  "lolita/file-upload/application.js"
 end
 
 # How to connect multimedia engine with lolita resources

data/lib/lolita-file-upload/rails.rb

@@ -2,12 +2,12 @@ if defined?(Rails)
   require "lolita-file-upload/rails/file_upload_routes"
   module LolitaFileUpload
     class Engine < Rails::Engine
-      initializer "add assets directories from pipeline", :group => :all do |app|
+      initializer "add assets directories to pipeline", :group => :all do |app|
        app.config.assets.precompile += [
-         "lolita/upload/application_vendor.js",
-         "lolita/upload/application_vendor.css",
-         "lolita/upload/I18n/lv.js",
-         "lolita/upload/I18n/ru.js"
+         "lolita/file-upload/application_vendor.js",
+         "lolita/file-upload/application_vendor.css",
+         "lolita/file-upload/I18n/lv.js",
+         "lolita/file-upload/I18n/ru.js"
         ]
       end
     end

data/lolita-file-upload.gemspec

@@ -5,11 +5,11 @@
 
 Gem::Specification.new do |s|
   s.name = "lolita-file-upload"
-  s.version = "0.6.2"
+  s.version = "0.7.1"
 
   s.required_rubygems_version = Gem::Requirement.new(">= 0") if s.respond_to? :required_rubygems_version=
   s.authors = ["ITHouse", "Arturs Meisters"]
-  s.date = "2012-09-05"
+  s.date = "2012-10-04"
   s.description = "File upload gem for Lolita with with fulll integration - models, controller, views"
   s.email = "support@ithouse.lv"
   s.extra_rdoc_files = [
@@ -24,18 +24,22 @@ Gem::Specification.new do |s|
     "README.rdoc",
     "Rakefile",
     "VERSION",
+    "app/assets/images/lolita/file-upload/back.png",
+    "app/assets/images/lolita/file-upload/delete.png",
+    "app/assets/images/lolita/file-upload/edit.png",
+    "app/assets/images/lolita/file-upload/next.png",
+    "app/assets/images/lolita/file-upload/prev.png",
+    "app/assets/images/lolita/file-upload/save.png",
     "app/assets/images/lolita/tinymce_gallery.png",
-    "app/assets/images/lolita/upload/back.png",
-    "app/assets/images/lolita/upload/delete.png",
-    "app/assets/images/lolita/upload/edit.png",
-    "app/assets/images/lolita/upload/next.png",
-    "app/assets/images/lolita/upload/prev.png",
-    "app/assets/images/lolita/upload/save.png",
+    "app/assets/javascripts/lolita/file-upload/application.js",
+    "app/assets/javascripts/lolita/file-upload/gallery.js.coffee",
+    "app/assets/stylesheets/lolita/file-upload/application.css",
+    "app/assets/stylesheets/lolita/file-upload/gallery.css",
+    "app/assets/stylesheets/lolita/file-upload/uploader.css.erb",
     "app/controllers/lolita/uploads_controller.rb",
     "app/models/lolita/upload/file.rb",
     "app/uploaders/file_uploader.rb",
     "app/views/components/lolita/configuration/field/file/_display.html.haml",
-    "app/views/components/lolita/configuration/field/string/text_gallery/_display.html.haml",
     "app/views/components/lolita/configuration/tab/files/_cells.html.erb",
     "app/views/components/lolita/configuration/tab/files/_destroy.js.erb",
     "app/views/components/lolita/configuration/tab/files/_display.html.erb",
@@ -98,26 +102,30 @@ Gem::Specification.new do |s|
     "test_orm/support.rb",
     "test_orm/uploaders/list_image_uploader.rb",
     "test_orm/uploaders/main_image_uploader.rb",
-    "vendor/assets/images/lolita/upload/plupload/backgrounds.gif",
-    "vendor/assets/images/lolita/upload/plupload/buttons-disabled.png",
-    "vendor/assets/images/lolita/upload/plupload/buttons.png",
-    "vendor/assets/images/lolita/upload/plupload/delete.gif",
-    "vendor/assets/images/lolita/upload/plupload/done.gif",
-    "vendor/assets/images/lolita/upload/plupload/error.gif",
-    "vendor/assets/images/lolita/upload/plupload/plupload-bw.png",
-    "vendor/assets/images/lolita/upload/plupload/plupload.png",
-    "vendor/assets/images/lolita/upload/plupload/throbber.gif",
-    "vendor/assets/images/lolita/upload/plupload/transp50.png",
-    "vendor/assets/javascripts/lolita/upload/I18n/lv.js",
-    "vendor/assets/javascripts/lolita/upload/I18n/ru.js",
-    "vendor/assets/javascripts/lolita/upload/application_vendor.js",
-    "vendor/assets/javascripts/lolita/upload/jquery.ui.plupload.js",
-    "vendor/assets/javascripts/lolita/upload/plupload.flash.swf",
-    "vendor/assets/javascripts/lolita/upload/plupload.full.js",
-    "vendor/assets/stylesheets/lolita/upload/application_vendor.css",
-    "vendor/assets/stylesheets/lolita/upload/jquery.ui.plupload.css.erb",
-    "vendor/assets/stylesheets/lolita/upload/lolita_file_upload.css.scss",
-    "vendor/assets/stylesheets/lolita/upload/plupload.queue.css"
+    "vendor/assets/images/lolita/file-upload/elastislide/nav.png",
+    "vendor/assets/images/lolita/file-upload/elastislide/pattern.png",
+    "vendor/assets/images/lolita/file-upload/plupload/backgrounds.gif",
+    "vendor/assets/images/lolita/file-upload/plupload/buttons-disabled.png",
+    "vendor/assets/images/lolita/file-upload/plupload/buttons.png",
+    "vendor/assets/images/lolita/file-upload/plupload/delete.gif",
+    "vendor/assets/images/lolita/file-upload/plupload/done.gif",
+    "vendor/assets/images/lolita/file-upload/plupload/error.gif",
+    "vendor/assets/images/lolita/file-upload/plupload/plupload-bw.png",
+    "vendor/assets/images/lolita/file-upload/plupload/plupload.png",
+    "vendor/assets/images/lolita/file-upload/plupload/throbber.gif",
+    "vendor/assets/images/lolita/file-upload/plupload/transp50.png",
+    "vendor/assets/javascripts/lolita/file-upload/I18n/lv.js",
+    "vendor/assets/javascripts/lolita/file-upload/I18n/ru.js",
+    "vendor/assets/javascripts/lolita/file-upload/application_vendor.js",
+    "vendor/assets/javascripts/lolita/file-upload/jquery.easing.1.3.js",
+    "vendor/assets/javascripts/lolita/file-upload/jquery.elastislide.js",
+    "vendor/assets/javascripts/lolita/file-upload/jquery.ui.plupload.js",
+    "vendor/assets/javascripts/lolita/file-upload/plupload.flash.swf",
+    "vendor/assets/javascripts/lolita/file-upload/plupload.full.js",
+    "vendor/assets/stylesheets/lolita/file-upload/application_vendor.css",
+    "vendor/assets/stylesheets/lolita/file-upload/elastislide.css.erb",
+    "vendor/assets/stylesheets/lolita/file-upload/jquery.ui.plupload.css.erb",
+    "vendor/assets/stylesheets/lolita/file-upload/plupload.queue.css"
   ]
   s.homepage = "http://github.com/ithouse/lolita-file-upload"
   s.licenses = ["MIT"]