diff --git a/resources/views/admin_pages/download_pages/tshirt.blade.php b/resources/views/admin_pages/download_pages/tshirt.blade.php
index 04e1e27..8156b12 100644
--- a/resources/views/admin_pages/download_pages/tshirt.blade.php
+++ b/resources/views/admin_pages/download_pages/tshirt.blade.php
@@ -33,7 +33,7 @@
-
+
@@ -48,210 +48,99 @@
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();
- 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);
+ setTimeout(function(){
- } 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();
+ frontCanvas.backgroundImage = 0;
+ frontCanvas.clear();
+ frontCanvas.renderAll();
setTimeout(function(){
- side_canvas.backgroundImage = 0;
- side_canvas.clear();
- side_canvas.renderAll();
+ frontCanvas.loadFromJSON(tmp_frontCanvas, function(objects, options) {
+ frontCanvas.renderAll();
+ frontCanvas.selection = false;
+ });
- setTimeout(function(){
+ },1000);
- side_canvas.loadFromJSON(canvas_json, function(objects, options) {
- side_canvas.renderAll();
- side_canvas.selection = false;
- });
+ } ,500);
+ });
- },1000);
+ 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();
- } ,500);
- });
- }, 1000);
- }
+ setTimeout(function(){
- // var frontCanvas = new fabric.StaticCanvas( document.getElementById("frontCanvas"));
- // tmp_frontCanvas = {!! json_encode($client_design_array[0]->ContentFront) !!};
- // console.log(tmp_frontCanvas)
+ backCanvas.backgroundImage = 0;
+ backCanvas.clear();
+ backCanvas.renderAll();
- // 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);
+ setTimeout(function(){
+ 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();
- // 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();
+ setTimeout(function(){
- // setTimeout(function(){
+ rightCanvas.loadFromJSON(tmp_rightCanvas, function(objects, options) {
+ rightCanvas.renderAll();
+ rightCanvas.selection = false;
+ });
- // backCanvas.backgroundImage = 0;
- // backCanvas.clear();
- // backCanvas.renderAll();
+ },1000);
+ } ,500);
- // setTimeout(function(){
+ });
- // backCanvas.loadFromJSON(tmp_backCanvas, function(objects, options) {
- // backCanvas.renderAll();
- // backCanvas.selection = false;
- // });
+ 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();
- // },1000);
- // } ,500);
+ setTimeout(function(){
- // });
-
- // 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();
+ leftCanvas.backgroundImage = 0;
+ leftCanvas.clear();
+ leftCanvas.renderAll();
- // setTimeout(function(){
+ setTimeout(function(){
- // rightCanvas.backgroundImage = 0;
- // rightCanvas.clear();
- // rightCanvas.renderAll();
+ leftCanvas.loadFromJSON(tmp_leftCanvas, function(objects, options) {
+ leftCanvas.renderAll();
+ leftCanvas.selection = false;
+ });
- // setTimeout(function(){
+ },1000);
+ } ,500);
- // 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(){
@@ -491,7 +380,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) {
@@ -516,20 +405,11 @@
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;
@@ -544,11 +424,6 @@
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');
@@ -564,6 +439,7 @@
var children = gElem.childNodes;
var xforms = gElem.getAttribute('transform');
+ // console.log(xforms);
var parts = /translate\(\s*([^\s,)]+)[ ,]([^\s,)]+)/.exec(xforms);
var firstX = parts[1],
@@ -591,14 +467,13 @@
}
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(""));
}
}
@@ -704,7 +579,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');
@@ -855,7 +730,6 @@
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;
@@ -872,20 +746,9 @@
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();
}
@@ -927,20 +790,7 @@
},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();
- }
-