webmaster/merchbay_admin
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update downloader

Browse Source
This commit is contained in:
franknstayn
2022-02-22 22:18:29 +08:00
parent cab28b65ff
commit 7e7a003f22
2 changed files with 220 additions and 72 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
resources/views/admin/main.blade.php
View File

@@ -338,13 +338,11 @@ desired effect
var min = $('#min').datepicker("getDate");
var max = $('#max').datepicker("getDate");
var startDate = new Date(data[10]);
// console.log("store_od", startDate)
} else {
// tbl_order_status
var min = $('#min_tbl_order_status').datepicker("getDate");
var max = $('#max_tbl_order_status').datepicker("getDate");
var startDate = new Date(data[5]);
// console.log("order", startDate)
}

290
resources/views/admin_pages/download_pages/tshirt.blade.php
View File

@@ -48,99 +48,210 @@
var log = document.getElementById('log');
form.addEventListener('submit', logSubmit);
// const sides = ["Front", "Back", "Right", "Left"];
var frontCanvas = new fabric.StaticCanvas( document.getElementById("frontCanvas"));
tmp_frontCanvas = {!! json_encode($client_design_array[0]->ContentFront) !!};
frontCanvas.loadFromJSON(tmp_frontCanvas, function(objects, options) {
frontCanvas.renderAll();
setTimeout(function(){
var frontCanvas = new fabric.StaticCanvas( document.getElementById("frontCanvas"));
var backCanvas = new fabric.StaticCanvas( document.getElementById("backCanvas"));
var leftCanvas = new fabric.StaticCanvas( document.getElementById("leftCanvas"));
var rightCanvas = new fabric.StaticCanvas( document.getElementById("rightCanvas"));
try {
var frontContentRaw = "{{ $client_design_array[0]->ContentFront }}";
var backContentRaw = "{{ $client_design_array[0]->ContentBack }}";
var leftContentRaw = "{{ $client_design_array[0]->ContentLeft }}";
var rightContentRaw = "{{ $client_design_array[0]->ContentRight }}";
console.log(leftContentRaw)
if(frontContentRaw) {
var tmp_frontCanvas = JSON.parse(frontContentRaw.replace(/"/g,'"'));
}
if(backContentRaw) {
var tmp_backCanvas = JSON.parse(backContentRaw.replace(/"/g,'"'));
}
if(leftContentRaw) {
var tmp_leftCanvas = JSON.parse(leftContentRaw.replace(/"/g,'"'));
}
if(rightContentRaw) {
var tmp_rightCanvas = JSON.parse(rightContentRaw.replace(/"/g,'"'));
}
// var tmp_frontCanvas = JSON.parse(frontContentRaw.replace(/"/g,'"'));
// var tmp_leftCanvas = JSON.parse(leftContentRaw.replace(/"/g,'"'));
// var tmp_rightCanvas = JSON.parse(rightContentRaw.replace(/"/g,'"'));
// console.log(frontCanvas)
loadDesigns(frontCanvas, tmp_frontCanvas);
loadDesigns(backCanvas, tmp_backCanvas);
loadDesigns(leftCanvas, tmp_leftCanvas);
loadDesigns(rightCanvas, tmp_rightCanvas);
frontCanvas.backgroundImage = 0;
frontCanvas.clear();
frontCanvas.renderAll();
} catch (error) {
console.log(error)
}
function loadDesigns(side_canvas, canvas_json) {
// console.log(side_canvas, canvas_json)
// let frontCanvas_json = JSON.parse(tmp_frontCanvas);
let objects = [];
Object.entries(canvas_json.objects).forEach(([key, item]) => {
if(item.type == 'image') {
toDataURL(item.src, function(src) {
const images = ada = {...item, src }
objects.push(images)
})
}
});
var final_json = "";
setTimeout(() => {
canvas_json.objects = [];
canvas_json.objects = objects;
final_json = JSON.stringify(canvas_json);
side_canvas.loadFromJSON(final_json, function(objects, options) {
side_canvas.renderAll();
setTimeout(function(){
frontCanvas.loadFromJSON(tmp_frontCanvas, function(objects, options) {
frontCanvas.renderAll();
frontCanvas.selection = false;
});
side_canvas.backgroundImage = 0;
side_canvas.clear();
side_canvas.renderAll();
},1000);
setTimeout(function(){
} ,500);
});
side_canvas.loadFromJSON(canvas_json, function(objects, options) {
side_canvas.renderAll();
side_canvas.selection = false;
});
var backCanvas = new fabric.StaticCanvas( document.getElementById("backCanvas") );
tmp_backCanvas = {!! json_encode($client_design_array[0]->ContentBack) !!};
backCanvas.loadFromJSON(tmp_backCanvas, function(objects, options) {
backCanvas.renderAll();
},1000);
setTimeout(function(){
} ,500);
});
}, 1000);
}
backCanvas.backgroundImage = 0;
backCanvas.clear();
backCanvas.renderAll();
// var frontCanvas = new fabric.StaticCanvas( document.getElementById("frontCanvas"));
// tmp_frontCanvas = {!! json_encode($client_design_array[0]->ContentFront) !!};
// console.log(tmp_frontCanvas)
setTimeout(function(){
// let frontCanvas_json = JSON.parse(tmp_frontCanvas);
// let objects = [];
// Object.entries(frontCanvas_json.objects).forEach(([key, item]) => {
// if(item.type == 'image') {
// toDataURL(item.src, function(src) {
// const images = ada = {...item, src }
// objects.push(images)
// })
// }
// });
// var final_front_json = "";
// setTimeout(() => {
// frontCanvas_json.objects = [];
// frontCanvas_json.objects = objects;
// final_front_json = JSON.stringify(frontCanvas_json);
// frontCanvas.loadFromJSON(final_front_json, function(objects, options) {
// frontCanvas.renderAll();
// setTimeout(function(){
// frontCanvas.backgroundImage = 0;
// frontCanvas.clear();
// frontCanvas.renderAll();
// setTimeout(function(){
// frontCanvas.loadFromJSON(frontCanvas_json, function(objects, options) {
// frontCanvas.renderAll();
// frontCanvas.selection = false;
// });
// },1000);
// } ,500);
// });
// }, 1000);
backCanvas.loadFromJSON(tmp_backCanvas, function(objects, options) {
backCanvas.renderAll();
backCanvas.selection = false;
});
},1000);
} ,500);
});
var rightCanvas = new fabric.StaticCanvas( document.getElementById("rightCanvas") );
tmp_rightCanvas = {!! json_encode($client_design_array[0]->ContentRight) !!};
rightCanvas.loadFromJSON(tmp_rightCanvas, function(objects, options) {
rightCanvas.renderAll();
setTimeout(function(){
rightCanvas.backgroundImage = 0;
rightCanvas.clear();
rightCanvas.renderAll();
setTimeout(function(){
// var backCanvas = new fabric.StaticCanvas( document.getElementById("backCanvas") );
// tmp_backCanvas = {!! json_encode($client_design_array[0]->ContentBack) !!};
// backCanvas.loadFromJSON(tmp_backCanvas, function(objects, options) {
// backCanvas.renderAll();
rightCanvas.loadFromJSON(tmp_rightCanvas, function(objects, options) {
rightCanvas.renderAll();
rightCanvas.selection = false;
});
// setTimeout(function(){
},1000);
} ,500);
// backCanvas.backgroundImage = 0;
// backCanvas.clear();
// backCanvas.renderAll();
});
// setTimeout(function(){
var leftCanvas = new fabric.StaticCanvas( document.getElementById("leftCanvas") );
tmp_leftCanvas = {!! json_encode($client_design_array[0]->ContentLeft) !!};
leftCanvas.loadFromJSON(tmp_leftCanvas, function(objects, options) {
leftCanvas.renderAll();
// backCanvas.loadFromJSON(tmp_backCanvas, function(objects, options) {
// backCanvas.renderAll();
// backCanvas.selection = false;
// });
setTimeout(function(){
// },1000);
// } ,500);
leftCanvas.backgroundImage = 0;
leftCanvas.clear();
leftCanvas.renderAll();
// });
// var rightCanvas = new fabric.StaticCanvas( document.getElementById("rightCanvas") );
// tmp_rightCanvas = {!! json_encode($client_design_array[0]->ContentRight) !!};
// rightCanvas.loadFromJSON(tmp_rightCanvas, function(objects, options) {
// rightCanvas.renderAll();
setTimeout(function(){
// setTimeout(function(){
leftCanvas.loadFromJSON(tmp_leftCanvas, function(objects, options) {
leftCanvas.renderAll();
leftCanvas.selection = false;
});
// rightCanvas.backgroundImage = 0;
// rightCanvas.clear();
// rightCanvas.renderAll();
},1000);
} ,500);
// setTimeout(function(){
});
// rightCanvas.loadFromJSON(tmp_rightCanvas, function(objects, options) {
// rightCanvas.renderAll();
// rightCanvas.selection = false;
// });
// },1000);
// } ,500);
// });
// var leftCanvas = new fabric.StaticCanvas( document.getElementById("leftCanvas") );
// tmp_leftCanvas = {!! json_encode($client_design_array[0]->ContentLeft) !!};
// leftCanvas.loadFromJSON(tmp_leftCanvas, function(objects, options) {
// leftCanvas.renderAll();
// setTimeout(function(){
// leftCanvas.backgroundImage = 0;
// leftCanvas.clear();
// leftCanvas.renderAll();
// setTimeout(function(){
// leftCanvas.loadFromJSON(tmp_leftCanvas, function(objects, options) {
// leftCanvas.renderAll();
// leftCanvas.selection = false;
// });
// },1000);
// } ,500);
// });
function loadPrintFile(){
@@ -380,7 +491,7 @@
function frontContent(fb_height, fb_width, fb_x, fb_y){
var objects = frontCanvas.getObjects();
console.log(objects)
try{
var p_number = '{{ $order_item_array[0]->Number }}';
for (var j in objects) {
@@ -405,11 +516,20 @@
objects[i].setStrokeWidth(getStrokeWidth * 4);
}
}
// if(objects[i].get('type') == "image"){
// // console.log(objects[i])
// let imgUrl = objects[i].getSrc();
// // console.log( objects[i].src = )
// toDataURL(imgUrl, function(dataUrl) {
// objects[i].setAttribute('scr') = dataUrl;
// })
// }
}
}catch(e){
console.log(e)
}
frontCanvas.renderAll();
zoomIn(frontCanvas, fb_width, fb_height, "Front");
var content = frontCanvas.toSVG();
document.getElementById('svgFrontContent').innerHTML = content;
@@ -424,6 +544,11 @@
getElements.removeAttribute('x')
getElements.removeAttribute('y');
getElements.setAttribute("transform", "matrix(1 0 0 1 "+getXAttribute+" "+getYAttribute+")");
// toDataURL(getElements.getAttribute('xlink:href'), function(dataUrl) {
// getElements.setAttributeNS("xlink:href", dataUrl)
// })
}
var allGs = el_id.getElementsByTagName('g');
@@ -439,7 +564,6 @@
var children = gElem.childNodes;
var xforms = gElem.getAttribute('transform');
// console.log(xforms);
var parts = /translate\(\s*([^\s,)]+)[ ,]([^\s,)]+)/.exec(xforms);
var firstX = parts[1],
@@ -467,13 +591,14 @@
}
var contents = JSON.stringify(consolidatedContents1);
var con = jQuery.parseJSON(contents);
var countContents = con.length;
if(countContents != 0){ // check if content
var jContent = $.map(con, function(value) {
return(value);
});
$("#Front_Border").html(jContent.join(""));
}
}
@@ -579,7 +704,7 @@
var el_id = document.getElementById('svgRightContent');
var getAllImageTag = el_id.getElementsByTagName('image');
var getAllImageTag = el_id.getElementsByTagName('image');
for (var i=0; i < getAllImageTag.length ; i++) {
var getElements = getAllImageTag[i];
var getXAttribute = getElements.getAttribute('x');
@@ -730,6 +855,7 @@
canvas.setWidth(canvas.getWidth() * SCALE_FACTOR_X);
var objects = canvas.getObjects();
for (var i in objects) {
var scaleX = objects[i].scaleX;
var scaleY = objects[i].scaleY;
@@ -746,9 +872,20 @@
objects[i].left = tempLeft;
objects[i].top = tempTop;
// if(objects[i].get('type') == "image"){
// let imgUrl = objects[i].src;
// toDataURL(imgUrl, function(dataUrl) {
// // console.log(dataUrl)
// objects[i].src = dataUrl;
// canvas.renderAll();
// })
// }
// canvas.renderAll();
objects[i].setCoords();
}
// console.log(objects)
canvas.renderAll();
}
@@ -790,6 +927,19 @@
},2000); */
}
function toDataURL(url, callback) {
var xhr = new XMLHttpRequest();
xhr.onload = function() {
var reader = new FileReader();
reader.onloadend = function() {
callback(reader.result);
}
reader.readAsDataURL(xhr.response);
};
xhr.open('GET', url);
xhr.responseType = 'blob';
xhr.send();
}
</script>
</body>