simple_form_bs5_file_input 0.1.1 → 0.1.3

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 2fcf36f702c77c1551143f7db895119ff9e97556f97a931e55900e3432f402d0
-  data.tar.gz: d0bf284ad4ff6fddd906bd6818f38a8917d46739a2b097a2479cdaede1f0c719
+  metadata.gz: e3e8fedf5f192642394251e54de774c6eee4a3d0bd8aaf1743fe5764fdd08894
+  data.tar.gz: bcf4c4237b630ea3eda4c0aaa469e5f555c85c1003e5580272df34d77460989d
 SHA512:
-  metadata.gz: 4efe42b607e0e4a17fabe348ab84e3d95389a155889d56cec6001b76fa322411409e1999d097c4c5a941d487d1006d4905bb13fb7bb4717f65d935882af87031
-  data.tar.gz: 78afdfc7bb77b27c7a6ccec1b7a6756f897e7256e8019b60eaed69ea037e798f41b68a3451ae8d42b7cbabc470f0edbecefeb5d31c2123b6d664ec2ddfb73e85
+  metadata.gz: f72252369cf36f53ac1f5380e3140aff36e0bcc11bef09ab2f2bfc3442916d2eb48e307ecc148ca8e186fea587120009326137e8980f666b3c35a79fb8535ae8
+  data.tar.gz: f83dd485981568672cde5863750ef4623df3e5d729f9dc4af9a1b7c06fba4ce84187cae5481c003341a727f57b41f9e4ab9fe8fce55cd89a59db68b60085a257

data/Gemfile.lock

@@ -1,7 +1,7 @@
 PATH
   remote: .
   specs:
-    simple_form_bs5_file_input (0.1.1)
+    simple_form_bs5_file_input (0.1.2)
       rails
       simple_form
 

data/LICENSE

@@ -1,6 +1,6 @@
 MIT License
 
-Copyright (c) 2021 Noesya
+Copyright (c) 2021-2023 Noesya
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

data/README.md

@@ -139,6 +139,17 @@ end
 
 **Simple Form Bootstrap 5 File Input** uses the I18n API to manage the texts displayed. Feel free to overwrite the keys or add languages.
 
+## Notes
+
+### Callbacks
+
+When the resize feature is activated **Simple Form Bootstrap 5 File Input** uses an `after_commit` hook to resize the image. The model linked to the attachment will then be touched.  
+It might cause a problem because messing with others `after_commit` hooks. For example it messes with the Devise `confirmable` module, where the confirmation email is also send on after_commit.   
+Before Rails 7.1 after_commit is the only hook executed backward. So if you add after_commit :function1, then after_commit :function2, function2 will be executed BEFORE function1.  
+After Rails 7.1 after_commit follows the regular order, so function1 will be executed before function2.  
+So for Devise Confirmable, it must be declared AFTER the `has_one_attached_deletable` declaration if Rails version < 7.1, and declared BEFORE the `has_one_attached_deletable` declaration if Rails version >= 7.1
+
+
 ## Information
 
 ### Supported Ruby / Rails versions

data/assets/javascripts/simple_form_bs5_file_input.js

@@ -49,6 +49,7 @@ window.inputSingleDeletableFile = {
                 };
             } else {
                 // Previewable images
+                $('.js-sdfi-deletable-file__infos-field', $scope).val('');
                 $scope.addClass('sdfi-deletable-file--with-file');
                 $('.js-sdfi-deletable-file__label', $scope).html(file.name);
                 $('.js-sdfi-deletable-file__delete-field', $scope).val('');
@@ -60,6 +61,7 @@ window.inputSingleDeletableFile = {
             }
         } else {
             // Non-resizable and non-previewable files
+            $('.js-sdfi-deletable-file__infos-field', $scope).val('');
             $scope.addClass('sdfi-deletable-file--with-file');
             $('.js-sdfi-deletable-file__label', $scope).html(file.name);
             $('.js-sdfi-deletable-file__delete-field', $scope).val('');
@@ -76,7 +78,7 @@ window.inputSingleDeletableFile = {
             image = $modal.attr('data-image-result'),
             ratio = $imgContainer.attr('data-ratio');
 
-        $imgContainer.html('<img class="js-" src="' + image + '">');
+        $imgContainer.html('<img class="js-image" src="' + image + '">');
 
         $image = $('img', $imgContainer);
         $image.css('opacity', 0);
@@ -98,6 +100,14 @@ window.inputSingleDeletableFile = {
         }, 100);
     },
 
+    onResizeModalRotate: function (e) {
+        'use strict';
+        var $scope = $(e.target).parents('.js-sdfi-deletable-file'),
+            $imgContainer = $('.js-sdfi-sdfi-deletable-file__resize-image', $scope),
+            $image = $('.js-image', $imgContainer);
+        $image.cropper('rotate', 90);
+    },
+
     onResizeModalCancel: function (e) {
         'use strict';
         var $scope = $(e.target).parents('.js-sdfi-deletable-file');
@@ -145,8 +155,9 @@ window.inputSingleDeletableFile = {
         });
         $('.js-sdfi-deletable-file__delete-btn', $(field)).on('click', this.onFileDelete);
         $('input[type="file"]', $(field)).on('change', this.onFileSelected);
-
+        
         $('.js-sdfi-deletable-file__resize', field).on('shown.bs.modal', this.onResizeModalShown);
+        $('.js-sdfi-deletable-file__resize-rotate', field).on('click', this.onResizeModalRotate);
         $('.js-sdfi-deletable-file__resize-cancel', field).on('click', this.onResizeModalCancel);
         $('.js-sdfi-deletable-file__resize-validate', field).on('click', this.onResizeModalValidate);
     }

data/assets/stylesheets/simple_form_bs5_file_input.sass

@@ -68,6 +68,8 @@
         width: 0%
 
     &__resize
+        .modal-footer
+            justify-content: space-between
         .sdfi-sdfi-deletable-file__resize-image
             img
                 max-width: 100%

data/config/locales/en.yml

@@ -1,6 +1,7 @@
 en:
   simple_form_bs5_file_input:
     modal_close: Close
+    modal_rotate: Rotate the image
     modal_title: Resize the image
     modal_validate: Validate  
     replace_file: 'Change the file'

data/config/locales/fr.yml

@@ -1,6 +1,7 @@
 fr:
   simple_form_bs5_file_input:
     modal_close: Fermer
+    modal_rotate: Tourner l'image
     modal_title: Cadrer l'image
     modal_validate: Valider
     replace_file: Remplacer le fichier

data/lib/has_one_attached_deletable.rb

@@ -21,12 +21,16 @@ class ActiveRecord::Base
 
         # From Rails 6, ImageProcessing uses an 'auto-orient' by default to interpret the EXIF Orientation metadata.
         # We declare it in the transformations hash for Rails 5
-        transformations = {
-          :'auto-orient' => true,
-          crop: "#{params['width'].round}x#{params['height'].round}+#{params['x'].round}+#{params['y'].round}",
+        transformations = { :'auto-orient' => true }
+        # Handle rotation
+        transformations[:rotate] = params['rotate'] if params['rotate'].present?
+        # Handle cropping
+        transformations[:crop] = "#{params['width'].round}x#{params['height'].round}+#{params['x'].round}+#{params['y'].round}"
+        # Finalize by repaging
+        transformations.merge!({
           repage: true,
           :'+' => true
-        }
+        })
 
         variant = Rails::VERSION::MAJOR >= 6  ? send(name).variant(**transformations)
                                               : send(name).variant(combine_options: transformations)

data/lib/simple_form_bs5_file_input/single_deletable_file_input.rb

@@ -92,12 +92,17 @@ class SingleDeletableFileInput < SimpleForm::Inputs::Base
                       </div>
                     </div>
                     <div class="modal-footer">
-                      <button type="button" class="btn btn-sm btn-secondary js-sdfi-deletable-file__resize-cancel" data-bs-dismiss="modal">%s</button>
-                      <button type="button" class="btn btn-sm btn-primary js-sdfi-deletable-file__resize-validate">%s</button>
+                      <button type="button" class="btn btn-sm js-sdfi-deletable-file__resize-rotate" aria-label="%s">
+                      <i class="bi bi-arrow-clockwise"></i>
+                      </button>
+                      <div>
+                        <button type="button" class="btn btn-sm btn-secondary js-sdfi-deletable-file__resize-cancel" data-bs-dismiss="modal">%s</button>
+                        <button type="button" class="btn btn-sm btn-primary js-sdfi-deletable-file__resize-validate">%s</button>
+                      </div>
                     </div>
                   </div>
                 </div>
-              </div>', modal_title, close_btn_text, resize_ratio, close_btn_text, validate_btn_text)
+              </div>', modal_title, close_btn_text, resize_ratio, rotate_btn_text, close_btn_text, validate_btn_text)
     end
   end
 
@@ -141,6 +146,10 @@ class SingleDeletableFileInput < SimpleForm::Inputs::Base
     I18n.t('simple_form_bs5_file_input.modal_close')
   end
 
+  def rotate_btn_text
+    I18n.t('simple_form_bs5_file_input.modal_rotate')
+  end
+
   def validate_btn_text
     I18n.t('simple_form_bs5_file_input.modal_validate')
   end

data/lib/simple_form_bs5_file_input/version.rb

@@ -1,3 +1,3 @@
 module SimpleFormBs5FileInput
-  VERSION = "0.1.1".freeze
+  VERSION = "0.1.3".freeze
 end

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: simple_form_bs5_file_input
 version: !ruby/object:Gem::Version
-  version: 0.1.1
+  version: 0.1.3
 platform: ruby
 authors:
 - Pierre-andré Boissinot
-autorequire: 
+autorequire:
 bindir: bin
 cert_chain: []
-date: 2023-10-12 00:00:00.000000000 Z
+date: 2023-11-20 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: rails
@@ -94,7 +94,7 @@ homepage: https://github.com/noesya/simple_form_bs5_file_input
 licenses:
 - MIT
 metadata: {}
-post_install_message: 
+post_install_message:
 rdoc_options: []
 require_paths:
 - lib
@@ -110,7 +110,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
       version: '0'
 requirements: []
 rubygems_version: 3.1.4
-signing_key: 
+signing_key:
 specification_version: 4
 summary: Simple Form BS5 File Input
 test_files: []