397 lines
13 KiB
JavaScript
397 lines
13 KiB
JavaScript
import "jquery-ui";
|
|
import 'datatables.net-bs5';
|
|
|
|
import 'cropperjs/dist/cropper.css';
|
|
import "jquery-cropper/dist/jquery-cropper.js";
|
|
|
|
|
|
|
|
if(typeof pathUplodImageAdd !== 'undefined'){
|
|
|
|
uploderImagesAnnonce();
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
function uploderImagesAnnonce()
|
|
{
|
|
let cropper;
|
|
let base64Home;
|
|
let base64Search;
|
|
let base64Detail1;
|
|
let base64Detail2;
|
|
let base64Detail3;
|
|
let base64Detail4;
|
|
|
|
|
|
$( "#resize-image" ).click(function() {
|
|
|
|
let typeImage = $("#imgPreviewCropper").attr("data-type-img");
|
|
|
|
if(typeImage == "home"){
|
|
|
|
base64Home = $("#imgPreviewCropper").cropper('getCroppedCanvas', {width: widthImgAccueil, height: heightImgAccueil}).toDataURL('image/jpeg', 1);
|
|
|
|
$('#img-preview-home').attr('src', base64Home);
|
|
|
|
}else if(typeImage == "search"){
|
|
|
|
base64Search = $("#imgPreviewCropper").cropper('getCroppedCanvas', {width: 438, height: 240}).toDataURL('image/jpeg', 1);
|
|
$('#img-preview-search').attr('src', base64Search);
|
|
}
|
|
$('#cropperModal').modal('hide');
|
|
});
|
|
|
|
|
|
/***************************************************************************** */
|
|
|
|
$("#upload_image_accueil").on('change', function(e) {
|
|
const file = e.target.files[0];
|
|
|
|
if (file) {
|
|
let reader = new FileReader();
|
|
|
|
reader.onload = function (event) {
|
|
|
|
$("#imgPreviewCropper").attr("src", event.target.result);
|
|
$("#imgPreviewCropper").attr("data-type-img", "home");
|
|
|
|
var image = new Image();
|
|
image.src = reader.result;
|
|
image.onload = function() {
|
|
|
|
if(image.width != widthImgAccueil){
|
|
$('#imgPreviewCropper').cropper('destroy');
|
|
|
|
cropper = $("#imgPreviewCropper").cropper({
|
|
minContainerWidth: widthImgAccueil,
|
|
minContainerHeight: heightImgAccueil,
|
|
minCropBoxWidth: widthImgAccueil,
|
|
minCropBoxHeight: heightImgAccueil,
|
|
zoomable: true,
|
|
dragMode: 'move',
|
|
});
|
|
|
|
if(largeurAnnonce == 1){
|
|
$('.modal-dialog').css({'max-width':"476px"});
|
|
}else if(largeurAnnonce == 2){
|
|
$('.modal-dialog').css({'max-width':"914px"});
|
|
}else if(largeurAnnonce == 3){
|
|
$('.modal-dialog').css({'max-width':"1352px"});
|
|
}else if(largeurAnnonce == 4){
|
|
$('.modal-dialog').css({'max-width':"1790px"});
|
|
}
|
|
|
|
$('#cropperModal').modal('show');
|
|
|
|
}else{
|
|
base64Home = event.target.result;
|
|
$("#img-preview-home").attr("src", event.target.result);
|
|
}
|
|
};
|
|
};
|
|
reader.readAsDataURL(file);
|
|
$("#progress-bar-accueil").css({'width':"0%"});
|
|
$("#progress-bar-accueil").empty().append("0%");
|
|
}
|
|
});
|
|
|
|
$( "#submit-image-accueil" ).click(function() {
|
|
$.ajax({
|
|
url: pathUplodImageAdd,
|
|
type: 'POST',
|
|
data: {type:'home', image64:base64Home},
|
|
xhr: function() {
|
|
var xhr = $.ajaxSettings.xhr();
|
|
if (xhr.upload) {
|
|
xhr.upload.addEventListener('progress', function(evt) {
|
|
var percent = (evt.loaded / evt.total) * 100;
|
|
$("#progress-bar-accueil").css({'width': percent + "%"});
|
|
$("#progress-bar-accueil").empty().append(percent + "%");
|
|
}, false);
|
|
}
|
|
return xhr;
|
|
},
|
|
success: function() {
|
|
$("#progress-bar-accueil").empty().append("Terminer");
|
|
}
|
|
});
|
|
});
|
|
|
|
|
|
/****************************************************************************** */
|
|
|
|
$("#upload_image_search").on('change', function(e) {
|
|
const file = e.target.files[0];
|
|
|
|
if (file) {
|
|
let reader = new FileReader();
|
|
|
|
reader.onload = function (event) {
|
|
|
|
$("#imgPreviewCropper").attr("src", event.target.result);
|
|
$("#imgPreviewCropper").attr("data-type-img", "search");
|
|
|
|
var image = new Image();
|
|
image.src = reader.result;
|
|
image.onload = function() {
|
|
if(image.width != widthImgAccueil){
|
|
$('#imgPreviewCropper').cropper('destroy');
|
|
|
|
cropper = $("#imgPreviewCropper").cropper({
|
|
minContainerWidth: 438,
|
|
minContainerHeight: 240,
|
|
minCropBoxWidth: 438,
|
|
minCropBoxHeight: 240,
|
|
zoomable: true,
|
|
dragMode: 'move',
|
|
});
|
|
|
|
$('.modal-dialog').css({'max-width':"476px"});
|
|
$('#cropperModal').modal('show');
|
|
}else{
|
|
base64Search = event.target.result;
|
|
$("#img-preview-search").attr("src", event.target.result);
|
|
}
|
|
};
|
|
};
|
|
reader.readAsDataURL(file);
|
|
$("#progress-bar-search").css({'width':"0%"});
|
|
$("#progress-bar-search").empty().append("0%");
|
|
}
|
|
});
|
|
|
|
|
|
|
|
$( "#submit-image-search" ).click(function() {
|
|
$.ajax({
|
|
url: pathUplodImageAdd,
|
|
type: 'POST',
|
|
data: {type:'search', image64:base64Search},
|
|
xhr: function() {
|
|
var xhr = $.ajaxSettings.xhr();
|
|
if (xhr.upload) {
|
|
xhr.upload.addEventListener('progress', function(evt) {
|
|
var percent = (evt.loaded / evt.total) * 100;
|
|
$("#progress-bar-search").css({'width': percent + "%"});
|
|
$("#progress-bar-search").empty().append(percent + "%");
|
|
}, false);
|
|
}
|
|
return xhr;
|
|
},
|
|
success: function() {
|
|
$("#progress-bar-search").empty().append("Terminer");
|
|
}
|
|
});
|
|
});
|
|
|
|
|
|
/*********************************************************************************** */
|
|
|
|
|
|
$("#upload_image_detail1").on('change', function(e) {
|
|
|
|
const file = e.target.files[0];
|
|
|
|
if (file) {
|
|
let reader = new FileReader();
|
|
|
|
reader.onloadend = function (event) {
|
|
|
|
$("#img-preview-detail1").attr("src", event.target.result);
|
|
|
|
base64Detail1 = event.target.result;
|
|
|
|
//console.log(base64Detail1);
|
|
};
|
|
reader.readAsDataURL(file);
|
|
|
|
$("#progress-bar-detail1").css({'width':"0%"});
|
|
$("#progress-bar-detail1").empty().append("0%");
|
|
}
|
|
});
|
|
|
|
|
|
|
|
$( "#submit-image-detail1" ).click(function() {
|
|
$.ajax({
|
|
url: pathUplodImageAdd,
|
|
type: 'POST',
|
|
data: {type:'detail1', image64:base64Detail1},
|
|
xhr: function() {
|
|
var xhr = $.ajaxSettings.xhr();
|
|
if (xhr.upload) {
|
|
xhr.upload.addEventListener('progress', function(evt) {
|
|
var percent = (evt.loaded / evt.total) * 100;
|
|
$("#progress-bar-detail1").css({'width': percent + "%"});
|
|
$("#progress-bar-detail1").empty().append(percent + "%");
|
|
}, false);
|
|
}
|
|
return xhr;
|
|
},
|
|
success: function() {
|
|
$("#progress-bar-detail1").empty().append("Terminer");
|
|
}
|
|
});
|
|
});
|
|
|
|
|
|
/******************************************************************************** */
|
|
|
|
|
|
$("#upload_image_detail2").on('change', function(e) {
|
|
|
|
const file = e.target.files[0];
|
|
|
|
if (file) {
|
|
let reader = new FileReader();
|
|
|
|
reader.onloadend = function (event) {
|
|
|
|
$("#img-preview-detail2").attr("src", event.target.result);
|
|
|
|
base64Detail2 = event.target.result;
|
|
|
|
//console.log(base64Detail2);
|
|
};
|
|
reader.readAsDataURL(file);
|
|
|
|
$("#progress-bar-detail2").css({'width':"0%"});
|
|
$("#progress-bar-detail2").empty().append("0%");
|
|
}
|
|
});
|
|
|
|
|
|
|
|
$( "#submit-image-detail2" ).click(function() {
|
|
$.ajax({
|
|
url: pathUplodImageAdd,
|
|
type: 'POST',
|
|
data: {type:'detail2', image64:base64Detail2},
|
|
xhr: function() {
|
|
var xhr = $.ajaxSettings.xhr();
|
|
if (xhr.upload) {
|
|
xhr.upload.addEventListener('progress', function(evt) {
|
|
var percent = (evt.loaded / evt.total) * 100;
|
|
$("#progress-bar-detail2").css({'width': percent + "%"});
|
|
$("#progress-bar-detail2").empty().append(percent + "%");
|
|
}, false);
|
|
}
|
|
return xhr;
|
|
},
|
|
success: function() {
|
|
$("#progress-bar-detail2").empty().append("Terminer");
|
|
}
|
|
});
|
|
});
|
|
|
|
|
|
/*********************************************************************** */
|
|
|
|
$("#upload_image_detail3").on('change', function(e) {
|
|
|
|
const file = e.target.files[0];
|
|
|
|
if (file) {
|
|
let reader = new FileReader();
|
|
|
|
reader.onloadend = function (event) {
|
|
|
|
$("#img-preview-detail3").attr("src", event.target.result);
|
|
|
|
base64Detail3 = event.target.result;
|
|
|
|
//console.log(base64Detail3);
|
|
};
|
|
reader.readAsDataURL(file);
|
|
|
|
$("#progress-bar-detail3").css({'width':"0%"});
|
|
$("#progress-bar-detail3").empty().append("0%");
|
|
}
|
|
});
|
|
|
|
|
|
|
|
$( "#submit-image-detail3" ).click(function() {
|
|
$.ajax({
|
|
url: pathUplodImageAdd,
|
|
type: 'POST',
|
|
data: {type:'detail3', image64:base64Detail3},
|
|
xhr: function() {
|
|
var xhr = $.ajaxSettings.xhr();
|
|
if (xhr.upload) {
|
|
xhr.upload.addEventListener('progress', function(evt) {
|
|
var percent = (evt.loaded / evt.total) * 100;
|
|
$("#progress-bar-detail3").css({'width': percent + "%"});
|
|
$("#progress-bar-detail3").empty().append(percent + "%");
|
|
}, false);
|
|
}
|
|
return xhr;
|
|
},
|
|
success: function() {
|
|
$("#progress-bar-detail3").empty().append("Terminer");
|
|
}
|
|
});
|
|
});
|
|
|
|
|
|
/**************************************************************************** */
|
|
|
|
$("#upload_image_detail4").on('change', function(e) {
|
|
|
|
const file = e.target.files[0];
|
|
|
|
if (file) {
|
|
let reader = new FileReader();
|
|
|
|
reader.onloadend = function (event) {
|
|
|
|
$("#img-preview-detail4").attr("src", event.target.result);
|
|
|
|
base64Detail4 = event.target.result;
|
|
|
|
//console.log(base64Detail4);
|
|
};
|
|
reader.readAsDataURL(file);
|
|
|
|
$("#progress-bar-detail4").css({'width':"0%"});
|
|
$("#progress-bar-detail4").empty().append("0%");
|
|
}
|
|
});
|
|
|
|
|
|
|
|
$( "#submit-image-detail4" ).click(function() {
|
|
$.ajax({
|
|
url: pathUplodImageAdd,
|
|
type: 'POST',
|
|
data: {type:'detail4', image64:base64Detail4},
|
|
xhr: function() {
|
|
var xhr = $.ajaxSettings.xhr();
|
|
if (xhr.upload) {
|
|
xhr.upload.addEventListener('progress', function(evt) {
|
|
var percent = (evt.loaded / evt.total) * 100;
|
|
$("#progress-bar-detail4").css({'width': percent + "%"});
|
|
$("#progress-bar-detail4").empty().append(percent + "%");
|
|
}, false);
|
|
}
|
|
return xhr;
|
|
},
|
|
success: function() {
|
|
$("#progress-bar-detail4").empty().append("Terminer");
|
|
}
|
|
});
|
|
});
|
|
|
|
|
|
}
|
|
|
|
|
|
$('#dataTableAnnonce').DataTable({
|
|
language: {
|
|
url: '../../assets/json/fr-FR.json',
|
|
},
|
|
}); |