diff options
| author | Alexander <alex.malcev1980@gmail.com> | 2020-01-18 05:09:14 +0300 |
|---|---|---|
| committer | Alexander <alex.malcev1980@gmail.com> | 2020-01-18 05:09:14 +0300 |
| commit | 95ece3d1213abaaca1fa72d016010734850f2332 (patch) | |
| tree | 97f854d332e6b5bd3e924dad021ab49b405a3737 | |
| parent | bea53ea5a80e6b49ddbbdcb5684226ce6d65f4e7 (diff) | |
Update to version 3.0.0.
| -rw-r--r-- | .gitignore | 1 | ||||
| -rw-r--r-- | feedback/css/style.css | 20 | ||||
| -rw-r--r-- | feedback/js/process-forms.js | 29 |
3 files changed, 46 insertions, 4 deletions
diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..723ef36 --- /dev/null +++ b/.gitignore @@ -0,0 +1 @@ +.idea
\ No newline at end of file diff --git a/feedback/css/style.css b/feedback/css/style.css index 3d06210..56fbd6e 100644 --- a/feedback/css/style.css +++ b/feedback/css/style.css @@ -261,6 +261,26 @@ textarea.form-control { border-radius: 4px; position: relative; min-height: 100%; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; +} + +.form-attachments__item-image { + display: block; + max-width: 100%; + height: auto; + margin-top: auto; + margin-left: auto; + margin-right: auto; +} + +.form-attachments__item-name { + margin-top: auto; + max-width: 100%; + overflow: hidden; + word-wrap: break-word; } .form-attachments__item-size { diff --git a/feedback/js/process-forms.js b/feedback/js/process-forms.js index 3ad8eda..5b11828 100644 --- a/feedback/js/process-forms.js +++ b/feedback/js/process-forms.js @@ -330,6 +330,7 @@ ProcessForm.prototype = function () { // событие при изменении элемента input с type="file" (name="attachment[]) $(document).on('change', _this._settings.selector + ' input[name="attachment[]"]', function (e) { var file, fileId, removeLink, output = []; + for (var i = 0, length = e.target.files.length; i < length; i++) { if (_this._attachmentsItems.length === _this._attachmentsMaxItems) { e.target.value = null; @@ -341,16 +342,36 @@ ProcessForm.prototype = function () { id: fileId, file: file }); - removeLink = '<div class="form-attachments__item">' + + if (file.type.match(/image.*/)) { + var reader = new FileReader(); + reader.readAsDataURL(file); + reader.addEventListener('load', function (e) { + //console.log(fileId); + //'<img src="' + e.target.result + '" style="display: block; width: 100%; height: auto;">' + + removeLink = '<div class="form-attachments__item" data-id="' + fileId + '">' + + '<div class="form-attachments__item-wrapper">' + + '<img class="form-attachments__item-image" src="' + e.target.result + '">' + + '<div class="form-attachments__item-name">' + file.name + '</div>' + + '<div class="form-attachments__item-size">' + (file.size / 1024).toFixed(1) + 'Кб' + '</div>' + + '<div class="form-attachments__item-link" data-id="' + fileId + '">×</div>' + + '</div>' + + '</div>'; + _this._form.find('.form-attachments__items').append(removeLink); + }); + + continue; + } + removeLink = '<div class="form-attachments__item" data-id="' + fileId + '">' + '<div class="form-attachments__item-wrapper">' + '<div class="form-attachments__item-name">' + file.name + '</div>' + '<div class="form-attachments__item-size">' + (file.size / 1024).toFixed(1) + 'Кб' + '</div>' + - '<div class="form-attachments__item-link" data-id=' + fileId + '>×</div>' + + '<div class="form-attachments__item-link" data-id="' + fileId + '">×</div>' + '</div>' + '</div>'; - output.push(removeLink); + //output.push(removeLink); + _this._form.find('.form-attachments__items').append(removeLink); } - _this._form.find('.form-attachments__items').append(output.join("")); + //_this._form.find('.form-attachments__items').append(output.join("")); e.target.value = null; }); } |