simple_form_bs5_file_input 0.0.2 → 0.0.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +4 -4
- data/.gitignore +2 -0
- data/Gemfile.lock +110 -87
- data/README.md +33 -0
- data/assets/javascripts/simple_form_bs5_file_input.js +116 -20
- data/assets/stylesheets/simple_form_bs5_file_input.sass +6 -0
- data/config/locales/en.yml +3 -0
- data/config/locales/fr.yml +4 -1
- data/lib/has_one_attached_deletable.rb +4 -3
- data/lib/simple_form_bs5_file_input/single_deletable_file_input.rb +64 -13
- data/lib/simple_form_bs5_file_input/version.rb +1 -1
- data/pkg/simple_form_bs5_file_input-0.0.2.gem +0 -0
- data/pkg/simple_form_bs5_file_input-0.0.3.gem +0 -0
- metadata +9 -6
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA256:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: ce2c3270b2eca308b30ab139a6c4c8df318b424f625f8c6960689a2a800bc5d0
|
|
4
|
+
data.tar.gz: cd16c846ae93111c0e24b4679300cd01c3fc8dd57b392ac311841f7615f71bd4
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: 29bf87c40cc7d39872d0f0849e5b205dc50853545cbd4bde6b601ae6cae9b874391cc94362e2faaadc509090764a4b4b7a98a73d2a5549ac95ba2840c51ea210
|
|
7
|
+
data.tar.gz: 3f626b446645c0ee7f0f82cc97683497d9378ac93b97afc632e62b364e477f13b5af9ca33041088262055389274a5de14fdd47f5df7e47789f64d5ef60a20b26
|
data/.gitignore
ADDED
data/Gemfile.lock
CHANGED
|
@@ -1,105 +1,112 @@
|
|
|
1
1
|
PATH
|
|
2
2
|
remote: .
|
|
3
3
|
specs:
|
|
4
|
-
simple_form_bs5_file_input (0.0.
|
|
4
|
+
simple_form_bs5_file_input (0.0.5)
|
|
5
5
|
rails
|
|
6
6
|
simple_form
|
|
7
7
|
|
|
8
8
|
GEM
|
|
9
9
|
remote: https://rubygems.org/
|
|
10
10
|
specs:
|
|
11
|
-
actioncable (
|
|
12
|
-
actionpack (=
|
|
13
|
-
activesupport (=
|
|
11
|
+
actioncable (7.0.3)
|
|
12
|
+
actionpack (= 7.0.3)
|
|
13
|
+
activesupport (= 7.0.3)
|
|
14
14
|
nio4r (~> 2.0)
|
|
15
15
|
websocket-driver (>= 0.6.1)
|
|
16
|
-
actionmailbox (
|
|
17
|
-
actionpack (=
|
|
18
|
-
activejob (=
|
|
19
|
-
activerecord (=
|
|
20
|
-
activestorage (=
|
|
21
|
-
activesupport (=
|
|
16
|
+
actionmailbox (7.0.3)
|
|
17
|
+
actionpack (= 7.0.3)
|
|
18
|
+
activejob (= 7.0.3)
|
|
19
|
+
activerecord (= 7.0.3)
|
|
20
|
+
activestorage (= 7.0.3)
|
|
21
|
+
activesupport (= 7.0.3)
|
|
22
22
|
mail (>= 2.7.1)
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
23
|
+
net-imap
|
|
24
|
+
net-pop
|
|
25
|
+
net-smtp
|
|
26
|
+
actionmailer (7.0.3)
|
|
27
|
+
actionpack (= 7.0.3)
|
|
28
|
+
actionview (= 7.0.3)
|
|
29
|
+
activejob (= 7.0.3)
|
|
30
|
+
activesupport (= 7.0.3)
|
|
28
31
|
mail (~> 2.5, >= 2.5.4)
|
|
32
|
+
net-imap
|
|
33
|
+
net-pop
|
|
34
|
+
net-smtp
|
|
29
35
|
rails-dom-testing (~> 2.0)
|
|
30
|
-
actionpack (
|
|
31
|
-
actionview (=
|
|
32
|
-
activesupport (=
|
|
33
|
-
rack (~> 2.0, >= 2.0
|
|
36
|
+
actionpack (7.0.3)
|
|
37
|
+
actionview (= 7.0.3)
|
|
38
|
+
activesupport (= 7.0.3)
|
|
39
|
+
rack (~> 2.0, >= 2.2.0)
|
|
34
40
|
rack-test (>= 0.6.3)
|
|
35
41
|
rails-dom-testing (~> 2.0)
|
|
36
42
|
rails-html-sanitizer (~> 1.0, >= 1.2.0)
|
|
37
|
-
actiontext (
|
|
38
|
-
actionpack (=
|
|
39
|
-
activerecord (=
|
|
40
|
-
activestorage (=
|
|
41
|
-
activesupport (=
|
|
43
|
+
actiontext (7.0.3)
|
|
44
|
+
actionpack (= 7.0.3)
|
|
45
|
+
activerecord (= 7.0.3)
|
|
46
|
+
activestorage (= 7.0.3)
|
|
47
|
+
activesupport (= 7.0.3)
|
|
48
|
+
globalid (>= 0.6.0)
|
|
42
49
|
nokogiri (>= 1.8.5)
|
|
43
|
-
actionview (
|
|
44
|
-
activesupport (=
|
|
50
|
+
actionview (7.0.3)
|
|
51
|
+
activesupport (= 7.0.3)
|
|
45
52
|
builder (~> 3.1)
|
|
46
53
|
erubi (~> 1.4)
|
|
47
54
|
rails-dom-testing (~> 2.0)
|
|
48
55
|
rails-html-sanitizer (~> 1.1, >= 1.2.0)
|
|
49
|
-
activejob (
|
|
50
|
-
activesupport (=
|
|
56
|
+
activejob (7.0.3)
|
|
57
|
+
activesupport (= 7.0.3)
|
|
51
58
|
globalid (>= 0.3.6)
|
|
52
|
-
activemodel (
|
|
53
|
-
activesupport (=
|
|
54
|
-
activerecord (
|
|
55
|
-
activemodel (=
|
|
56
|
-
activesupport (=
|
|
57
|
-
activestorage (
|
|
58
|
-
actionpack (=
|
|
59
|
-
activejob (=
|
|
60
|
-
activerecord (=
|
|
61
|
-
activesupport (=
|
|
62
|
-
marcel (~> 1.0
|
|
59
|
+
activemodel (7.0.3)
|
|
60
|
+
activesupport (= 7.0.3)
|
|
61
|
+
activerecord (7.0.3)
|
|
62
|
+
activemodel (= 7.0.3)
|
|
63
|
+
activesupport (= 7.0.3)
|
|
64
|
+
activestorage (7.0.3)
|
|
65
|
+
actionpack (= 7.0.3)
|
|
66
|
+
activejob (= 7.0.3)
|
|
67
|
+
activerecord (= 7.0.3)
|
|
68
|
+
activesupport (= 7.0.3)
|
|
69
|
+
marcel (~> 1.0)
|
|
63
70
|
mini_mime (>= 1.1.0)
|
|
64
|
-
activesupport (
|
|
71
|
+
activesupport (7.0.3)
|
|
65
72
|
concurrent-ruby (~> 1.0, >= 1.0.2)
|
|
66
73
|
i18n (>= 1.6, < 2)
|
|
67
74
|
minitest (>= 5.1)
|
|
68
75
|
tzinfo (~> 2.0)
|
|
69
|
-
|
|
70
|
-
autoprefixer-rails (10.3.3.0)
|
|
76
|
+
autoprefixer-rails (10.4.7.0)
|
|
71
77
|
execjs (~> 2)
|
|
72
|
-
bcrypt (3.1.
|
|
73
|
-
bootsnap (1.
|
|
74
|
-
msgpack (~> 1.
|
|
75
|
-
bootstrap (5.1.
|
|
78
|
+
bcrypt (3.1.18)
|
|
79
|
+
bootsnap (1.11.1)
|
|
80
|
+
msgpack (~> 1.2)
|
|
81
|
+
bootstrap (5.1.3)
|
|
76
82
|
autoprefixer-rails (>= 9.1.0)
|
|
77
83
|
popper_js (>= 2.9.3, < 3)
|
|
78
84
|
sassc-rails (>= 2.0.0)
|
|
79
85
|
builder (3.2.4)
|
|
80
|
-
concurrent-ruby (1.1.
|
|
86
|
+
concurrent-ruby (1.1.10)
|
|
81
87
|
crass (1.0.6)
|
|
82
|
-
devise (4.8.
|
|
88
|
+
devise (4.8.1)
|
|
83
89
|
bcrypt (~> 3.0)
|
|
84
90
|
orm_adapter (~> 0.1)
|
|
85
91
|
railties (>= 4.1.0)
|
|
86
92
|
responders
|
|
87
93
|
warden (~> 1.2.3)
|
|
94
|
+
digest (3.1.0)
|
|
88
95
|
erubi (1.10.0)
|
|
89
96
|
execjs (2.8.1)
|
|
90
|
-
ffi (1.15.
|
|
91
|
-
globalid (0.
|
|
97
|
+
ffi (1.15.5)
|
|
98
|
+
globalid (1.0.0)
|
|
92
99
|
activesupport (>= 5.0)
|
|
93
|
-
i18n (1.
|
|
100
|
+
i18n (1.10.0)
|
|
94
101
|
concurrent-ruby (~> 1.0)
|
|
95
|
-
jquery-rails (4.
|
|
102
|
+
jquery-rails (4.5.0)
|
|
96
103
|
rails-dom-testing (>= 1, < 3)
|
|
97
104
|
railties (>= 4.2.0)
|
|
98
105
|
thor (>= 0.14, < 2.0)
|
|
99
|
-
listen (3.7.
|
|
106
|
+
listen (3.7.1)
|
|
100
107
|
rb-fsevent (~> 0.10, >= 0.10.3)
|
|
101
108
|
rb-inotify (~> 0.9, >= 0.9.10)
|
|
102
|
-
loofah (2.
|
|
109
|
+
loofah (2.18.0)
|
|
103
110
|
crass (~> 1.0.2)
|
|
104
111
|
nokogiri (>= 1.5.9)
|
|
105
112
|
mail (2.7.1)
|
|
@@ -107,48 +114,62 @@ GEM
|
|
|
107
114
|
marcel (1.0.2)
|
|
108
115
|
method_source (1.0.0)
|
|
109
116
|
mini_mime (1.1.2)
|
|
110
|
-
mini_portile2 (2.
|
|
111
|
-
minitest (5.
|
|
112
|
-
msgpack (1.
|
|
117
|
+
mini_portile2 (2.8.0)
|
|
118
|
+
minitest (5.15.0)
|
|
119
|
+
msgpack (1.5.2)
|
|
120
|
+
net-imap (0.2.3)
|
|
121
|
+
digest
|
|
122
|
+
net-protocol
|
|
123
|
+
strscan
|
|
124
|
+
net-pop (0.1.1)
|
|
125
|
+
digest
|
|
126
|
+
net-protocol
|
|
127
|
+
timeout
|
|
128
|
+
net-protocol (0.1.3)
|
|
129
|
+
timeout
|
|
130
|
+
net-smtp (0.3.1)
|
|
131
|
+
digest
|
|
132
|
+
net-protocol
|
|
133
|
+
timeout
|
|
113
134
|
nio4r (2.5.8)
|
|
114
|
-
nokogiri (1.
|
|
115
|
-
mini_portile2 (~> 2.
|
|
135
|
+
nokogiri (1.13.6)
|
|
136
|
+
mini_portile2 (~> 2.8.0)
|
|
116
137
|
racc (~> 1.4)
|
|
117
138
|
orm_adapter (0.5.0)
|
|
118
|
-
pg (1.
|
|
139
|
+
pg (1.3.5)
|
|
119
140
|
popper_js (2.9.3)
|
|
120
|
-
racc (1.
|
|
121
|
-
rack (2.2.3)
|
|
141
|
+
racc (1.6.0)
|
|
142
|
+
rack (2.2.3.1)
|
|
122
143
|
rack-test (1.1.0)
|
|
123
144
|
rack (>= 1.0, < 3)
|
|
124
|
-
rails (
|
|
125
|
-
actioncable (=
|
|
126
|
-
actionmailbox (=
|
|
127
|
-
actionmailer (=
|
|
128
|
-
actionpack (=
|
|
129
|
-
actiontext (=
|
|
130
|
-
actionview (=
|
|
131
|
-
activejob (=
|
|
132
|
-
activemodel (=
|
|
133
|
-
activerecord (=
|
|
134
|
-
activestorage (=
|
|
135
|
-
activesupport (=
|
|
145
|
+
rails (7.0.3)
|
|
146
|
+
actioncable (= 7.0.3)
|
|
147
|
+
actionmailbox (= 7.0.3)
|
|
148
|
+
actionmailer (= 7.0.3)
|
|
149
|
+
actionpack (= 7.0.3)
|
|
150
|
+
actiontext (= 7.0.3)
|
|
151
|
+
actionview (= 7.0.3)
|
|
152
|
+
activejob (= 7.0.3)
|
|
153
|
+
activemodel (= 7.0.3)
|
|
154
|
+
activerecord (= 7.0.3)
|
|
155
|
+
activestorage (= 7.0.3)
|
|
156
|
+
activesupport (= 7.0.3)
|
|
136
157
|
bundler (>= 1.15.0)
|
|
137
|
-
railties (=
|
|
138
|
-
sprockets-rails (>= 2.0.0)
|
|
158
|
+
railties (= 7.0.3)
|
|
139
159
|
rails-dom-testing (2.0.3)
|
|
140
160
|
activesupport (>= 4.2.0)
|
|
141
161
|
nokogiri (>= 1.6)
|
|
142
162
|
rails-html-sanitizer (1.4.2)
|
|
143
163
|
loofah (~> 2.3)
|
|
144
|
-
railties (
|
|
145
|
-
actionpack (=
|
|
146
|
-
activesupport (=
|
|
164
|
+
railties (7.0.3)
|
|
165
|
+
actionpack (= 7.0.3)
|
|
166
|
+
activesupport (= 7.0.3)
|
|
147
167
|
method_source
|
|
148
|
-
rake (>=
|
|
168
|
+
rake (>= 12.2)
|
|
149
169
|
thor (~> 1.0)
|
|
170
|
+
zeitwerk (~> 2.5)
|
|
150
171
|
rake (13.0.6)
|
|
151
|
-
rb-fsevent (0.11.
|
|
172
|
+
rb-fsevent (0.11.1)
|
|
152
173
|
rb-inotify (0.10.1)
|
|
153
174
|
ffi (~> 1.0)
|
|
154
175
|
responders (3.0.1)
|
|
@@ -165,16 +186,18 @@ GEM
|
|
|
165
186
|
simple_form (5.1.0)
|
|
166
187
|
actionpack (>= 5.2)
|
|
167
188
|
activemodel (>= 5.2)
|
|
168
|
-
sprockets (4.0.
|
|
189
|
+
sprockets (4.0.3)
|
|
169
190
|
concurrent-ruby (~> 1.0)
|
|
170
191
|
rack (> 1, < 3)
|
|
171
|
-
sprockets-rails (3.
|
|
172
|
-
actionpack (>=
|
|
173
|
-
activesupport (>=
|
|
192
|
+
sprockets-rails (3.4.2)
|
|
193
|
+
actionpack (>= 5.2)
|
|
194
|
+
activesupport (>= 5.2)
|
|
174
195
|
sprockets (>= 3.0.0)
|
|
175
196
|
sqlite3 (1.4.2)
|
|
176
|
-
|
|
197
|
+
strscan (3.0.3)
|
|
198
|
+
thor (1.2.1)
|
|
177
199
|
tilt (2.0.10)
|
|
200
|
+
timeout (0.3.0)
|
|
178
201
|
tzinfo (2.0.4)
|
|
179
202
|
concurrent-ruby (~> 1.0)
|
|
180
203
|
warden (1.2.9)
|
|
@@ -182,7 +205,7 @@ GEM
|
|
|
182
205
|
websocket-driver (0.7.5)
|
|
183
206
|
websocket-extensions (>= 0.1.0)
|
|
184
207
|
websocket-extensions (0.1.5)
|
|
185
|
-
zeitwerk (2.4
|
|
208
|
+
zeitwerk (2.5.4)
|
|
186
209
|
|
|
187
210
|
PLATFORMS
|
|
188
211
|
ruby
|
data/README.md
CHANGED
|
@@ -101,6 +101,39 @@ The new field is still compatible with the `direct_upload` param.
|
|
|
101
101
|
Please remember to include the `activestorage.js` library in order to use the direct_upload feature.
|
|
102
102
|
Direct upload will send the file BEFORE the page submission. You will get a progress bar in the file field while the file is uploading.
|
|
103
103
|
|
|
104
|
+
## Resize
|
|
105
|
+
|
|
106
|
+
You can add an option to the field to resize the image after upload (of course it has to be an image!).
|
|
107
|
+
|
|
108
|
+
Add `resize: true` to your field.
|
|
109
|
+
|
|
110
|
+
You can also specify a ratio for the cropper. For example `resize: 1` will lock the aspect ratio to a square. Beware of the float constraints in rails. If you want a 4/3 ratio use `resize: 4/3.to_f` as 4/3 otherwise gives 1.
|
|
111
|
+
|
|
112
|
+
|
|
113
|
+
The resizer is based on [CropperJS](https://github.com/fengyuanchen/cropperjs) so you have to add cropper and jquery-cropper to your dependencies:
|
|
114
|
+
```
|
|
115
|
+
yarn add cropperjs
|
|
116
|
+
yarn add jquery-cropper
|
|
117
|
+
```
|
|
118
|
+
then include the js files in your application.js file:
|
|
119
|
+
```
|
|
120
|
+
//= require cropperjs/dist/cropper
|
|
121
|
+
//= require jquery-cropper/dist/jquery-cropper
|
|
122
|
+
```
|
|
123
|
+
and include the css in your application.sass file:
|
|
124
|
+
```
|
|
125
|
+
@import 'cropperjs/dist/cropper'
|
|
126
|
+
```
|
|
127
|
+
|
|
128
|
+
In your `config/application.yml`, to support `+repage`, you have to add `+` method in supported operations.
|
|
129
|
+
```ruby
|
|
130
|
+
module MyApp
|
|
131
|
+
class Application < Rails::Application
|
|
132
|
+
# ...
|
|
133
|
+
config.active_storage.supported_image_processing_methods = ["+"]
|
|
134
|
+
end
|
|
135
|
+
end
|
|
136
|
+
```
|
|
104
137
|
|
|
105
138
|
## I18n
|
|
106
139
|
|
|
@@ -1,40 +1,132 @@
|
|
|
1
|
-
/*global $, document, window */
|
|
1
|
+
/*global $, document, window, bootstrap */
|
|
2
2
|
window.inputSingleDeletableFile = {
|
|
3
|
-
|
|
3
|
+
onFileDelete: function (e) {
|
|
4
4
|
'use strict';
|
|
5
5
|
var $scope = $(this).parents('.js-sdfi-deletable-file');
|
|
6
6
|
e.preventDefault();
|
|
7
7
|
e.stopPropagation();
|
|
8
|
-
$('.js-sdfi-deletable-
|
|
8
|
+
$('.js-sdfi-deletable-file__infos-field', $scope).val('');
|
|
9
|
+
$('.js-sdfi-deletable-file__delete-field', $scope).val('true');
|
|
9
10
|
$('input[type="file"]', $scope).val('');
|
|
10
11
|
$scope.removeClass('sdfi-deletable-file--with-file');
|
|
11
|
-
// $('.custom-file-preview', scope).hide();
|
|
12
12
|
},
|
|
13
13
|
|
|
14
|
-
|
|
14
|
+
onFileSelected: function () {
|
|
15
15
|
'use strict';
|
|
16
16
|
var $scope = $(this).parents('.js-sdfi-deletable-file'),
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
17
|
+
$resizeModal = $('.js-sdfi-deletable-file__resize', $scope),
|
|
18
|
+
files = this.files,
|
|
19
|
+
file,
|
|
20
20
|
hasPreview = $('.js-sdfi-deletable-file__preview', $scope).length > 0,
|
|
21
|
+
hasResize = $resizeModal.length > 0,
|
|
22
|
+
modal,
|
|
21
23
|
reader,
|
|
22
24
|
size;
|
|
23
|
-
|
|
25
|
+
|
|
26
|
+
if (!files.length) {
|
|
27
|
+
return;
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
file = files[0];
|
|
31
|
+
|
|
32
|
+
if (!hasResize) {
|
|
33
|
+
// name display is delayed if we need to resize
|
|
24
34
|
$scope.addClass('sdfi-deletable-file--with-file');
|
|
25
|
-
$('.js-sdfi-deletable-file__label', $scope).html(
|
|
26
|
-
$('.js-sdfi-deletable-
|
|
35
|
+
$('.js-sdfi-deletable-file__label', $scope).html(file.name);
|
|
36
|
+
$('.js-sdfi-deletable-file__delete-field', $scope).val('');
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
if (/^image\/\w+$/.test(file.type) && (hasResize || hasPreview)) {
|
|
40
|
+
reader = new FileReader();
|
|
41
|
+
reader.readAsDataURL(file);
|
|
42
|
+
if (hasResize) {
|
|
43
|
+
reader.onload = function () {
|
|
44
|
+
modal = new bootstrap.Modal($resizeModal, {
|
|
45
|
+
backdrop: 'static',
|
|
46
|
+
keyboard: false
|
|
47
|
+
});
|
|
48
|
+
$resizeModal.attr('data-image-result', this.result);
|
|
49
|
+
$resizeModal.attr('data-filename', file.name);
|
|
50
|
+
modal.show();
|
|
51
|
+
};
|
|
52
|
+
} else if (hasPreview) {
|
|
53
|
+
size = $('.js-sdfi-deletable-file__preview', $scope).attr('data-size')
|
|
54
|
+
.split('x');
|
|
55
|
+
reader.onload = function (e) {
|
|
56
|
+
$('.js-sdfi-deletable-file__preview', $scope).html('<img src="' + e.target.result + '" width="' + size[0] + '" height="auto" class="img-fluid img-thumbnail">');
|
|
57
|
+
};
|
|
58
|
+
}
|
|
27
59
|
}
|
|
28
|
-
|
|
29
|
-
|
|
60
|
+
},
|
|
61
|
+
|
|
62
|
+
onResizeModalShown: function (e) {
|
|
63
|
+
'use strict';
|
|
64
|
+
var $modal = $(e.target),
|
|
65
|
+
$scope = $modal.parents('.js-sdfi-deletable-file'),
|
|
66
|
+
$imgContainer = $('.js-sdfi-sdfi-deletable-file__resize-image', $scope),
|
|
67
|
+
$image,
|
|
68
|
+
image = $modal.attr('data-image-result'),
|
|
69
|
+
ratio = $imgContainer.attr('data-ratio');
|
|
70
|
+
|
|
71
|
+
$imgContainer.html('<img class="js-" src="' + image + '">');
|
|
72
|
+
|
|
73
|
+
$image = $('img', $imgContainer);
|
|
74
|
+
$image.css('opacity', 0);
|
|
75
|
+
setTimeout(function () {
|
|
76
|
+
// init cropper with a small delay
|
|
77
|
+
$image.cropper({
|
|
78
|
+
aspectRatio: ratio,
|
|
79
|
+
autoCropArea: 1,
|
|
80
|
+
movable: false,
|
|
81
|
+
guides: false,
|
|
82
|
+
background: false,
|
|
83
|
+
viewMode: 1,
|
|
84
|
+
zoomable: false,
|
|
85
|
+
crop: function (data) {
|
|
86
|
+
$('.js-sdfi-deletable-file__infos-field', $scope).val(JSON.stringify(data.detail));
|
|
87
|
+
}
|
|
88
|
+
});
|
|
89
|
+
$image.css('opacity', 1);
|
|
90
|
+
}, 100);
|
|
91
|
+
},
|
|
92
|
+
|
|
93
|
+
onResizeModalCancel: function (e) {
|
|
94
|
+
'use strict';
|
|
95
|
+
var $scope = $(e.target).parents('.js-sdfi-deletable-file');
|
|
96
|
+
$('.js-sdfi-deletable-file__infos-field', $scope).val('');
|
|
97
|
+
$('.js-sdfi-deletable-file__delete-field', $scope).val('true');
|
|
98
|
+
$('input[type="file"]', $scope).val('');
|
|
99
|
+
$scope.removeClass('sdfi-deletable-file--with-file');
|
|
100
|
+
},
|
|
101
|
+
|
|
102
|
+
onResizeModalValidate: function (e) {
|
|
103
|
+
'use strict';
|
|
104
|
+
var $scope = $(e.target).parents('.js-sdfi-deletable-file'),
|
|
105
|
+
$resizeModal = $('.js-sdfi-deletable-file__resize', $scope),
|
|
106
|
+
$imgContainer = $('.js-sdfi-sdfi-deletable-file__resize-image', $scope),
|
|
107
|
+
$image = $('img', $imgContainer),
|
|
108
|
+
filename = $resizeModal.attr('data-filename'),
|
|
109
|
+
hasPreview = $('.js-sdfi-deletable-file__preview', $scope).length > 0,
|
|
110
|
+
imageData,
|
|
111
|
+
resizeModal = $resizeModal[0],
|
|
112
|
+
modal = bootstrap.Modal.getInstance(resizeModal),
|
|
113
|
+
size;
|
|
114
|
+
|
|
115
|
+
$scope.addClass('sdfi-deletable-file--with-file');
|
|
116
|
+
$('.js-sdfi-deletable-file__label', $scope).html(filename);
|
|
117
|
+
$('.js-sdfi-deletable-file__delete-field', $scope).val('');
|
|
118
|
+
|
|
119
|
+
// set the preview if we have preview
|
|
120
|
+
if (hasPreview) {
|
|
30
121
|
size = $('.js-sdfi-deletable-file__preview', $scope).attr('data-size')
|
|
31
122
|
.split('x');
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
123
|
+
imageData = $image.data('cropper')
|
|
124
|
+
.getCroppedCanvas()
|
|
125
|
+
.toDataURL();
|
|
126
|
+
|
|
127
|
+
$('.js-sdfi-deletable-file__preview', $scope).html('<img src="' + imageData + '" width="' + size[0] + '" height="auto" class="img-fluid img-thumbnail">');
|
|
37
128
|
}
|
|
129
|
+
modal.hide();
|
|
38
130
|
},
|
|
39
131
|
|
|
40
132
|
bindEvents: function (field) {
|
|
@@ -43,8 +135,12 @@ window.inputSingleDeletableFile = {
|
|
|
43
135
|
$('.js-sdfi-deletable-file__change-btn', $(field)).on('click', function () {
|
|
44
136
|
$('input[type="file"]', $(field)).click();
|
|
45
137
|
});
|
|
46
|
-
$('.js-sdfi-deletable-file__delete-btn', $(field)).on('click', this.
|
|
47
|
-
$('input[type="file"]', $(field)).on('change', this.
|
|
138
|
+
$('.js-sdfi-deletable-file__delete-btn', $(field)).on('click', this.onFileDelete);
|
|
139
|
+
$('input[type="file"]', $(field)).on('change', this.onFileSelected);
|
|
140
|
+
|
|
141
|
+
$('.js-sdfi-deletable-file__resize', field).on('shown.bs.modal', this.onResizeModalShown);
|
|
142
|
+
$('.js-sdfi-deletable-file__resize-cancel', field).on('click', this.onResizeModalCancel);
|
|
143
|
+
$('.js-sdfi-deletable-file__resize-validate', field).on('click', this.onResizeModalValidate);
|
|
48
144
|
}
|
|
49
145
|
};
|
|
50
146
|
|
data/config/locales/en.yml
CHANGED
data/config/locales/fr.yml
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
class ActiveRecord::Base
|
|
2
|
-
def self.has_one_attached_deletable(name,
|
|
2
|
+
def self.has_one_attached_deletable(name, **options)
|
|
3
3
|
class_eval do
|
|
4
4
|
attr_accessor :"#{name}_delete"
|
|
5
5
|
attr_accessor :"#{name}_infos"
|
|
@@ -14,6 +14,7 @@ class ActiveRecord::Base
|
|
|
14
14
|
define_method :"resize_#{name}" do
|
|
15
15
|
return unless send(name).attached?
|
|
16
16
|
|
|
17
|
+
|
|
17
18
|
params = JSON(send("#{name}_infos"))
|
|
18
19
|
# reset the infos to prevent multiple resize if multiple save
|
|
19
20
|
instance_variable_set :"@#{name}_infos", nil
|
|
@@ -30,7 +31,7 @@ class ActiveRecord::Base
|
|
|
30
31
|
variant = Rails::VERSION::MAJOR >= 6 ? send(name).variant(**transformations)
|
|
31
32
|
: send(name).variant(combine_options: transformations)
|
|
32
33
|
|
|
33
|
-
variant_url = variant.processed.
|
|
34
|
+
variant_url = variant.processed.url
|
|
34
35
|
downloaded_image = URI.open(variant_url)
|
|
35
36
|
attachable = { io: downloaded_image, filename: send(name).filename.to_s }
|
|
36
37
|
|
|
@@ -48,6 +49,6 @@ class ActiveRecord::Base
|
|
|
48
49
|
end
|
|
49
50
|
end
|
|
50
51
|
|
|
51
|
-
has_one_attached name
|
|
52
|
+
has_one_attached name, **options
|
|
52
53
|
end
|
|
53
54
|
end
|
|
@@ -16,17 +16,13 @@ class SingleDeletableFileInput < SimpleForm::Inputs::Base
|
|
|
16
16
|
<div class="sdfi-deletable-file__delete-btn js-sdfi-deletable-file__delete-btn"></div>
|
|
17
17
|
<div class="sdfi-deletable-file__upload-background"></div>
|
|
18
18
|
<div class="sdfi-deletable-file__upload-progress"></div>
|
|
19
|
-
<input type="hidden" name="%s" class="js-sdfi-deletable-
|
|
19
|
+
<input type="hidden" name="%s" class="js-sdfi-deletable-file__infos-field" %s />
|
|
20
|
+
<input type="hidden" name="%s" class="js-sdfi-deletable-file__delete-field" %s />
|
|
20
21
|
</div>
|
|
21
22
|
%s
|
|
23
|
+
%s
|
|
22
24
|
</div>
|
|
23
|
-
', has_file_class, input_field(wrapper_options), field_classes(wrapper_options), change_file_text, field_id, existing_file_name_or_default_text,
|
|
24
|
-
end
|
|
25
|
-
|
|
26
|
-
def preview_div
|
|
27
|
-
if options[:preview]
|
|
28
|
-
format('<div class="sdfi-deletable-file__preview js-sdfi-deletable-file__preview" data-size="%s">%s</div>', preview_image_width, preview_image_tag)
|
|
29
|
-
end
|
|
25
|
+
', has_file_class, input_field(wrapper_options), field_classes(wrapper_options), change_file_text, field_id, existing_file_name_or_default_text, input_infos_name, input_infos_value, input_delete_name, input_delete_value, preview_div, resize_div)
|
|
30
26
|
end
|
|
31
27
|
|
|
32
28
|
def has_file_class
|
|
@@ -61,14 +57,52 @@ class SingleDeletableFileInput < SimpleForm::Inputs::Base
|
|
|
61
57
|
end
|
|
62
58
|
end
|
|
63
59
|
|
|
64
|
-
def
|
|
60
|
+
def input_delete_name
|
|
65
61
|
"#{@builder.object_name}[#{attribute_name.to_s}_delete]"
|
|
66
62
|
end
|
|
67
63
|
|
|
68
|
-
def
|
|
64
|
+
def input_delete_value
|
|
69
65
|
"value='true'" if @builder.object.send("#{attribute_name}_delete") == 'true'
|
|
70
66
|
end
|
|
71
67
|
|
|
68
|
+
def input_infos_name
|
|
69
|
+
"#{@builder.object_name}[#{attribute_name.to_s}_infos]"
|
|
70
|
+
end
|
|
71
|
+
|
|
72
|
+
def input_infos_value
|
|
73
|
+
"value='#{@builder.object.send("#{attribute_name}_infos")}'" if @builder.object.send("#{attribute_name}_infos")
|
|
74
|
+
end
|
|
75
|
+
|
|
76
|
+
def preview_div
|
|
77
|
+
if options[:preview]
|
|
78
|
+
format('<div class="sdfi-deletable-file__preview js-sdfi-deletable-file__preview" data-size="%s">%s</div>', preview_image_width, preview_image_tag)
|
|
79
|
+
end
|
|
80
|
+
end
|
|
81
|
+
|
|
82
|
+
def resize_div
|
|
83
|
+
if options[:resize]
|
|
84
|
+
format('<div class="sdfi-deletable-file__resize js-sdfi-deletable-file__resize modal" tabindex="-1">
|
|
85
|
+
<div class="modal-dialog">
|
|
86
|
+
<div class="modal-content">
|
|
87
|
+
<div class="modal-header">
|
|
88
|
+
<h5 class="modal-title">%s</h5>
|
|
89
|
+
<button type="button" class="btn-close js-sdfi-deletable-file__resize-cancel" data-bs-dismiss="modal" aria-label="%s"></button>
|
|
90
|
+
</div>
|
|
91
|
+
<div class="modal-body">
|
|
92
|
+
<div class="sdfi-sdfi-deletable-file__resize-image js-sdfi-sdfi-deletable-file__resize-image" data-ratio="%s">
|
|
93
|
+
|
|
94
|
+
</div>
|
|
95
|
+
</div>
|
|
96
|
+
<div class="modal-footer">
|
|
97
|
+
<button type="button" class="btn btn-sm btn-secondary js-sdfi-deletable-file__resize-cancel" data-bs-dismiss="modal">%s</button>
|
|
98
|
+
<button type="button" class="btn btn-sm btn-primary js-sdfi-deletable-file__resize-validate">%s</button>
|
|
99
|
+
</div>
|
|
100
|
+
</div>
|
|
101
|
+
</div>
|
|
102
|
+
</div>', modal_title, close_btn_text, resize_ratio, close_btn_text, validate_btn_text)
|
|
103
|
+
end
|
|
104
|
+
end
|
|
105
|
+
|
|
72
106
|
private
|
|
73
107
|
|
|
74
108
|
def file_attachment
|
|
@@ -83,13 +117,30 @@ class SingleDeletableFileInput < SimpleForm::Inputs::Base
|
|
|
83
117
|
options[:preview] == true ? default_preview_image_width : options[:preview].to_i
|
|
84
118
|
end
|
|
85
119
|
|
|
120
|
+
def resize_ratio
|
|
121
|
+
options[:resize] == true ? '' : options[:resize]
|
|
122
|
+
end
|
|
123
|
+
|
|
86
124
|
def preview_image_tag
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
125
|
+
return unless should_display_file? || file_attachment&.variable?
|
|
126
|
+
variant = file_attachment.variant(resize: "#{preview_image_width}x")
|
|
127
|
+
path = url_helpers.polymorphic_url variant, only_path: true
|
|
128
|
+
image_tag path, class: 'img-fluid img-thumbnail', width: preview_image_width
|
|
90
129
|
end
|
|
91
130
|
|
|
92
131
|
def default_preview_image_width
|
|
93
132
|
1000
|
|
94
133
|
end
|
|
134
|
+
|
|
135
|
+
def modal_title
|
|
136
|
+
I18n.t('simple_form_bs5_file_input.modal_title')
|
|
137
|
+
end
|
|
138
|
+
|
|
139
|
+
def close_btn_text
|
|
140
|
+
I18n.t('simple_form_bs5_file_input.modal_close')
|
|
141
|
+
end
|
|
142
|
+
|
|
143
|
+
def validate_btn_text
|
|
144
|
+
I18n.t('simple_form_bs5_file_input.modal_validate')
|
|
145
|
+
end
|
|
95
146
|
end
|
|
Binary file
|
|
Binary file
|
metadata
CHANGED
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
|
2
2
|
name: simple_form_bs5_file_input
|
|
3
3
|
version: !ruby/object:Gem::Version
|
|
4
|
-
version: 0.0.
|
|
4
|
+
version: 0.0.5
|
|
5
5
|
platform: ruby
|
|
6
6
|
authors:
|
|
7
7
|
- Pierre-andré Boissinot
|
|
8
|
-
autorequire:
|
|
8
|
+
autorequire:
|
|
9
9
|
bindir: bin
|
|
10
10
|
cert_chain: []
|
|
11
|
-
date:
|
|
11
|
+
date: 2022-05-30 00:00:00.000000000 Z
|
|
12
12
|
dependencies:
|
|
13
13
|
- !ruby/object:Gem::Dependency
|
|
14
14
|
name: rails
|
|
@@ -73,6 +73,7 @@ extensions: []
|
|
|
73
73
|
extra_rdoc_files: []
|
|
74
74
|
files:
|
|
75
75
|
- ".eslintrc.yml"
|
|
76
|
+
- ".gitignore"
|
|
76
77
|
- ".sass-lint.yml"
|
|
77
78
|
- Gemfile
|
|
78
79
|
- Gemfile.lock
|
|
@@ -89,12 +90,14 @@ files:
|
|
|
89
90
|
- lib/simple_form_bs5_file_input/single_deletable_file_input.rb
|
|
90
91
|
- lib/simple_form_bs5_file_input/version.rb
|
|
91
92
|
- pkg/simple_form_bs5_file_input-0.0.1.gem
|
|
93
|
+
- pkg/simple_form_bs5_file_input-0.0.2.gem
|
|
94
|
+
- pkg/simple_form_bs5_file_input-0.0.3.gem
|
|
92
95
|
- simple_form_bs5_file_input.gemspec
|
|
93
96
|
homepage: https://github.com/noesya/simple_form_bs5_file_input
|
|
94
97
|
licenses:
|
|
95
98
|
- MIT
|
|
96
99
|
metadata: {}
|
|
97
|
-
post_install_message:
|
|
100
|
+
post_install_message:
|
|
98
101
|
rdoc_options: []
|
|
99
102
|
require_paths:
|
|
100
103
|
- lib
|
|
@@ -109,8 +112,8 @@ required_rubygems_version: !ruby/object:Gem::Requirement
|
|
|
109
112
|
- !ruby/object:Gem::Version
|
|
110
113
|
version: '0'
|
|
111
114
|
requirements: []
|
|
112
|
-
rubygems_version: 3.1.
|
|
113
|
-
signing_key:
|
|
115
|
+
rubygems_version: 3.1.6
|
|
116
|
+
signing_key:
|
|
114
117
|
specification_version: 4
|
|
115
118
|
summary: Simple Form BS5 File Input
|
|
116
119
|
test_files: []
|