parent
2ba0771c94
commit
2c337b5c1c
8 changed files with 406 additions and 184 deletions
@ -0,0 +1,28 @@ |
|||||||
|
var OFF = 0, WARN = 1, ERROR = 2; |
||||||
|
|
||||||
|
module.exports = exports = { |
||||||
|
"root": true, |
||||||
|
env: { |
||||||
|
'es6': true, // We are writing ES6 code
|
||||||
|
'browser': true, // for the browser
|
||||||
|
'commonjs': true // and use require() for stylesheets
|
||||||
|
}, |
||||||
|
"parserOptions": { |
||||||
|
"ecmaFeatures": { |
||||||
|
"modules": true |
||||||
|
}, |
||||||
|
"sourceType": "module" |
||||||
|
}, |
||||||
|
"rules":{ |
||||||
|
"no-console": OFF, |
||||||
|
"jsx-quotes": WARN, |
||||||
|
"no-unused-vars": WARN, |
||||||
|
"no-undef": WARN |
||||||
|
|
||||||
|
}, |
||||||
|
"globals": { |
||||||
|
"$": true |
||||||
|
}, |
||||||
|
|
||||||
|
"extends": ["eslint:recommended"] |
||||||
|
}; |
||||||
@ -1,24 +1,128 @@ |
|||||||
/** |
(function($) { |
||||||
* Created by mitri4 on 23.06.17. |
$.fn.invisible = function() { |
||||||
*/ |
return this.each(function() { |
||||||
|
$(this).css("visibility", "hidden"); |
||||||
// $(document).ready(function() {
|
$(this).hide(); |
||||||
//
|
}); |
||||||
// $uploadCrop = $('#stamp').croppie({
|
}; |
||||||
// enableExif: true,
|
$.fn.visible = function() { |
||||||
// viewport: {
|
return this.each(function() { |
||||||
// width: 200,
|
$(this).css("visibility", "visible"); |
||||||
// height: 200,
|
$(this).show(); |
||||||
// type: 'circle'
|
}); |
||||||
// },
|
}; |
||||||
// boundary: {
|
}(jQuery)); |
||||||
// width: 300,
|
|
||||||
// height: 300
|
|
||||||
// }
|
|
||||||
// });
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
// });
|
|
||||||
|
|
||||||
|
|
||||||
|
$(document).ready(function () { |
||||||
|
|
||||||
|
var $uploadCrop, |
||||||
|
rawImg, |
||||||
|
imagePreview, |
||||||
|
imageInputField; |
||||||
|
|
||||||
|
function readFile(input) { |
||||||
|
if (input.files && input.files[0]) { |
||||||
|
var reader = new FileReader(); |
||||||
|
|
||||||
|
reader.onload = function (e) { |
||||||
|
$('#imageCropper').addClass('ready'); |
||||||
|
rawImg = e.target.result; |
||||||
|
$('#containerUpload').trigger("ShowModal"); |
||||||
|
}; |
||||||
|
reader.readAsDataURL(input.files[0]); |
||||||
|
} else { |
||||||
|
alert("Sorry - you're browser doesn't support the FileReader API"); |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
$uploadCrop = $('#imageCropper').croppie({ |
||||||
|
enableExif: true, |
||||||
|
enforceBoundary: false, |
||||||
|
viewport: { |
||||||
|
width: 200, |
||||||
|
height: 200, |
||||||
|
type: 'circle' |
||||||
|
}, |
||||||
|
boundary: { |
||||||
|
width: 300, |
||||||
|
height: 300 |
||||||
|
} |
||||||
|
}); |
||||||
|
|
||||||
|
// select file
|
||||||
|
$('.img_load img').on('click', function() { |
||||||
|
var thisId = $(this).closest('.img_load').attr('id'); |
||||||
|
var tmbId = 'id_tmb_' + thisId.substring(3); |
||||||
|
$('#' + tmbId).val(''); |
||||||
|
$('#id_' + thisId).click(); |
||||||
|
imagePreview = thisId; |
||||||
|
imageInputField = 'id_' + thisId; |
||||||
|
// console.log('#id_' + thisId)
|
||||||
|
}); |
||||||
|
|
||||||
|
// set file in input hidden filed
|
||||||
|
$('.img_load input[type=file]').on('change', function () {readFile(this)}); |
||||||
|
|
||||||
|
$('#containerUpload').on("ShowModal", function( ) { |
||||||
|
$('#containerUpload').visible(); |
||||||
|
$uploadCrop.croppie('bind', { |
||||||
|
url: rawImg |
||||||
|
}).then(function(){ |
||||||
|
console.log('jQuery bind complete'); |
||||||
|
}); |
||||||
|
}); |
||||||
|
|
||||||
|
$('#cropImageBtn').on('click', function (ev) { |
||||||
|
$uploadCrop.croppie('result', { |
||||||
|
type: 'base64', |
||||||
|
format: 'png', |
||||||
|
size: 'viewport' |
||||||
|
}).then(function (resp) { |
||||||
|
// console.log(resp);
|
||||||
|
$('#' + imagePreview + ' img').attr('src', resp); |
||||||
|
$('#containerUpload').trigger("CloseModal"); |
||||||
|
$('#' + imagePreview + ' .del_image').show(); |
||||||
|
}) |
||||||
|
}); |
||||||
|
|
||||||
|
$('#containerUpload').on("CloseModal", function( ) { |
||||||
|
$('#containerUpload').invisible(); |
||||||
|
$('#' + imageInputField).val(''); |
||||||
|
}); |
||||||
|
|
||||||
|
var closeButtons=document.getElementsByClassName("modal-upload__cleaner-btn"); |
||||||
|
|
||||||
|
for (var i = 0; i < closeButtons.length; i++) { |
||||||
|
|
||||||
|
var closeBtn = closeButtons[i]; |
||||||
|
closeBtn.addEventListener('click',function () { |
||||||
|
$('#containerUpload').trigger("CloseModal"); |
||||||
|
}) |
||||||
|
|
||||||
|
} |
||||||
|
|
||||||
|
$('.img_load .del_image').on('click', function(e) { |
||||||
|
e.preventDefault(); |
||||||
|
var this_id = $(this).closest('.img_load').attr('id'); |
||||||
|
var tmb_id = 'id_tmb_' + this_id.substring(3); |
||||||
|
var dlg_msg = $('#dialog-message'); |
||||||
|
dlg_msg.dialog({ |
||||||
|
title: 'Удалить изображение?', |
||||||
|
buttons:{ |
||||||
|
'Да': function(){ |
||||||
|
$('#' + tmb_id).val(''); |
||||||
|
$('#' + this_id + ' img').attr('src', '/static/img/upload-' + this_id + '.png'); |
||||||
|
$('#' + this_id + '-clear_id').attr('checked', true); |
||||||
|
$('#' + this_id + ' .del_image').hide(); |
||||||
|
dlg_msg.dialog('close'); |
||||||
|
}, |
||||||
|
'Нет': function(){ |
||||||
|
dlg_msg.dialog('close'); |
||||||
|
} |
||||||
|
} |
||||||
|
}).html('Нажмите "Да", чтобы удалить изображение'); |
||||||
|
dlg_msg.dialog('open'); |
||||||
|
}); |
||||||
|
|
||||||
|
}); |
||||||
|
|||||||
Loading…
Reference in new issue