Remove image - Fix SpinaCMS#376

channainfo · Jun 5, 2018 · 7214431 · 7214431
1 parent 7674138
commit 7214431
Show file tree

Hide file tree

Showing 8 changed files with 36 additions and 8 deletions.
diff --git a/app/assets/javascripts/spina/admin/controllers/image_form_controller.js b/app/assets/javascripts/spina/admin/controllers/image_form_controller.js
@@ -0,0 +1,21 @@
+(() => {
+  const application = Stimulus.Application.start()
+
+  application.register("image-form", class extends Stimulus.Controller {
+    static get targets() {
+      return ["image", "field", "button"]
+    }
+
+    remove(e) {
+      // Prevent link
+      e.preventDefault()
+      e.stopPropagation()
+
+      // Remove image and reset field
+      this.imageTarget.remove()
+      this.buttonTarget.remove()
+      this.fieldTarget.value = null
+    }
+
+  })
+})()
diff --git a/app/assets/stylesheets/spina/_forms.sass b/app/assets/stylesheets/spina/_forms.sass
@@ -852,7 +852,7 @@ input.datepicker
   &:hover .button
     background: tint(#efefef, 20%)
 
-  &:active .button
+  .button:active 
     background: shade(#efefef, 10%)
 
   .placeholder

diff --git a/app/controllers/spina/admin/media_picker_controller.rb b/app/controllers/spina/admin/media_picker_controller.rb
@@ -17,7 +17,7 @@ def show
 
       def select
         if params[:multiple]
-          @images = Image.find(params[:image_ids])
+          @images = Image.where(id: params[:image_ids])
         else 
           @image = Image.find(params[:image_id])
         end

diff --git a/app/controllers/spina/admin/pages_controller.rb b/app/controllers/spina/admin/pages_controller.rb
@@ -53,9 +53,6 @@ def update
             format.html { redirect_to spina.edit_admin_page_url(@page, params: {locale: @locale}), flash: {success: t('spina.pages.saved')} }
             format.js
           else
-            50.times do
-              Rails.logger.info @page.errors.inspect
-            end
             format.html do
               @page_parts = @page.view_template_page_parts(current_theme).map { |part| @page.part(part) }
               render :edit, layout: 'spina/admin/admin'

diff --git a/app/views/spina/admin/media_picker/select.js.erb b/app/views/spina/admin/media_picker/select.js.erb
@@ -1,5 +1,6 @@
 let hidden_input = $("input[data-hidden-field-id='<%= j params[:hidden_field_id] %>']");
 hidden_input.parents('.media_picker').find('.image').remove();
+hidden_input.val("");
 
 <% if @image.present? %>
   hidden_input.parents('.media_picker').append("<%=j render partial: 'spina/admin/images/image', object: @image, locals: {simple: true} %>");

diff --git a/app/views/spina/admin/partables/images/_form.html.haml b/app/views/spina/admin/partables/images/_form.html.haml
@@ -1,14 +1,21 @@
 .horizontal-form-label
   = f.object.title
-.horizontal-form-content
+.horizontal-form-content{data: {controller: "image-form"}}
   = link_to admin_media_picker_path(selected_ids: [f.object.partable_id], hidden_field_id: "media_picker_#{f.object.object_id}"), remote: true, class: 'media_picker clearfix' do
     .placeholder
       %span.button.button-small.button-round
         %i.icon.icon-dots
         =t 'spina.images.choose_image'
 
+      - if f.object.partable.file.attached?
+        %br/
+
+        %span.button.button-small.button-round{data: {action: "click->image-form#remove", target: "image-form.button"}}
+          %i.icon.icon-trash
+          =t 'spina.images.remove_image'
+
     - if f.object.partable.file.attached?
-      .image
+      .image{data: {target: 'image-form.image'}}
         = image_tag variant(f.object.partable.file, resize: "300x300^", crop: "300x300+0+0")
 
-    = f.hidden_field :partable_id, data: {hidden_field_id: "media_picker_#{f.object.object_id}"}
+    = f.hidden_field :partable_id, data: {hidden_field_id: "media_picker_#{f.object.object_id}", target: 'image-form.field'}
diff --git a/config/locales/en.yml b/config/locales/en.yml
@@ -101,6 +101,7 @@ en:
       upload: Upload images
       choose_images: Choose images
       choose_image: Choose image
+      remove_image: Remove image
 
     wysiwyg:
       paragraph: Paragraph

diff --git a/config/locales/nl.yml b/config/locales/nl.yml
@@ -47,6 +47,7 @@ nl:
       delete: Verwijderen
       upload: kies een bestand
       choose_image: Kies afbeelding
+      remove_image: Verwijder afbeelding
 
     forgot_password:
       new: Wachtwoord vergeten