/* Were tälking UTF8 */
// GLOBALS
var LOG = false; //false; // ENABLE LOGGING
var PRLOG = false; //false; /** PRICE LOG - REMOVE COMMENTS **/
var INPUTDELAY = 650; // MilliseconCs
var FLOATDELAY = 1300 // Milliseconds for Float Inputs
var SCONFIG = '';
var PHPCALC = false; /** ENABLES PHP + JS CALC COMPARE MODE - MUST BE OFF IN LIVE MODE **/
var xhr = '';
var canvas = new Object();
var bgLayer = new Object();
var WORKSPACE = { width: 550, height: 300, color:'#000000', bgcolor:'#ffffff',
border: 0,
borderDistance: 20,
selectorPadding: 0,
selectorCornerSize: 10,
selectorBorderColor: '#007fe1',
selectorCornerColor: '#007fe1',
selectorCornerStyle: 'circle',
selectorCornerTransparent: false,
selectorSerienText : '#673086',
selectBorderStrokeWidth: 1.5,
selectBorderStrokeColor: '#007fe1', //'rgba(200,0,0,1)',
selectBorderStrokeDashWidth: 5,
veredelungDefault: 0, // 0=Gravur, 1=Druck
scale:'1:1',
scaleFac:1,
dimMax:600,
dimMin:300,
//cutFormColor: 'rgba(220,220,220,1)', //'rgba(241,241,241,1)'
cornerRadius: 3, // in mmm
};
var delay = (function(){
var timer = 0;
return function(callback, ms){
clearTimeout (timer);
timer = setTimeout(callback, ms);
};
})();
$.ajaxSetup({ cache: false });
/** ---------------------------------------------------------------------------*/
/** INIT EVENTS */
/** ---------------------------------------------------------------------------*/
$(document).ready(function()
{
SCONFIG = $('#JSCONFIG').val();
fabric.Object.NUM_FRACTION_DIGITS = 17;
fabric.textureSize = 4096;
//if (fabric.isWebglSupported()) fabric.textureSize = 65536;
if(document.getElementById('lcWorkSpace')===null)
{
}
else
{
canvas = this.__canvas = new fabric.Canvas('lcWorkSpace');
// CANVAS EVENTS
canvas.on({
//'object:moving': function () { updateObjControls('obj_moving')},
//'object:scaling': function () { updateObjControls('obj_scaling')},
//'object:resizing': function () { updateObjControls('obj_resizing')},
//'object:rotating': function () { updateObjControls('obj_rotating')},
//'object:selected': function () { updateObjControls('obj_selected')},
//'object:modified': function () { updateObjControls('obj_modified')},
'selection:created': function () {
var obj = canvas.getActiveObject();
if(obj) { obj.set({'strokeWidth': WORKSPACE.selectBorderStrokeWidth}); }
//updateObjControls('selection:created')
},
//'selection:updated': function () { updateObjControls('selection:updated')},
//'selection:cleared': function () { updateObjControls('selection:cleared')},
'before:selection:cleared':
function () {
var obj = canvas.getActiveObject();
if(obj) { obj.set({'strokeWidth': 0}); }
//hideObjControls
},
//'text:editing:entered': function () { LOG && console.log('Event: text_editing_entered'); },
//'text:editing:exited': function () { LOG && console.log('Event: text_editing_exited'); },
//'text:selection:changed': function () { LOG && console.log('Event: text_editing_changed'); },
//'text:changed': function () { LOG && console.log('Event: text_changed'); },
//'mouse:up': function()
// {
// var obj = canvas.getActiveObject();
// if(obj) { calculateSign('Event: mouse up',0); }
// },
'after:render': function(){ this.calcOffset(); }
});
canvas.stateful = false; // Increases speed (if undone function not needed)
/** canvas.selection = false; **/
canvas.controlsAboveOverlay = true;
//canvas.renderOnAddRemove = false; // better?
canvas.setWidth($('#lcWorkSpace').width());
canvas.setHeight($('#lcWorkSpace').height());
}
// BEFOREUNLOAD
$(window).on('beforeunload', function(){
// SAVE SIGNS IN TMP
//if(SIGN.calculateOnUnload==1)
//{
// if(window.location.href== '')
// {
// $.when(calculateSign('fromUnloadEvent()',1)).done(function(ev) {
// return true;
// });
// }
//}
console.log('FROM WINDOW UNLOAD: SAVE ENTWURF OR NOT!?!?');
//return 'Are you sure you want to leave?';
});
/** REMOVE OBJ ON DEL KEY **/
$('html').keyup(function(e)
{
if(e.keyCode == 46)
{
var hasFocus=0;
$("input").each(function() { if($(this).is(':focus')) { hasFocus=1; }});
$("textarea").each(function() { if($(this).is(':focus')) { hasFocus=1; }});
if(hasFocus==0) { removeLastObj('Remove from KeyEvent'); }
}
});
// INIT IMAGE UPLOADER
$('#lcwork').on('change','#image-upload', function()
{
//var file =this.files[0];
var ext = this.files[0].name.substr((this.files[0].name.lastIndexOf('.') +1)).toLowerCase();
//var ext = file.name.substr((file.name.lastIndexOf('.') +1));
// size check
//if(this.files[0].size>8388608)
if(this.files[0].size > 16777216)
//if(this.files[0].size>2097152)
{
alert('Die angegebene Datei ist größer als 16MB.\nBitte beachten Sie die maximale Dateigröße.');
//parent.scroll(0,0);
//showModalInfoWin("Dateigröß überschritten","Das Bild konnte nicht heraufgeladen werden. Die maximale Dateigröße; beträgt 8MB.");
}
else if(ext!='svg' && ext!='jpg' && ext!='jpeg' && ext!='png' && ext!='eps')
{
alert('Derzeit können nur Dateien vom Typ "SVG","JPEG","PNG" und "EPS" heraufgeladen werden.');
//parent.scroll(0,0);
//showModalInfoWin("Dateiformat ungültig","Derzeit können nur Dateien vom Typ \"SVG\", \"JPEG\" und \"EPS\" heraufgeladen werden.");
}
else
{
uploadWin.open();
uploadImage(this.files[0],1);
}
// reset upload input
$('#image-upload').val('');
});
// IMAGE Remover (AJAX)
$('#lcwork').on('click','.imgDBRemove', function()
{
var id = $(this).data('id');
var parent = $(this).parent().closest('.imgDB');
var active = $(this).next('div.imgDBActive');
$(parent).css({'background-image':'url("https://www.edelstahlbecher.de/xshop/icons/ajax-loader.gif")','background-size':'20px'});
$.ajax({ url: 'https://www.edelstahlbecher.de/scripts/shop.warenkorb-io.php', type: 'GET', cache: false, dataType: "text", data: {'com': 'removeUploads', id: id}, error: function(em)
{
//return true;
},
success: function(em)
{
//alert(em)
if($(active).is(':hidden')) { } else { removeLastObj('ImageRemover'); lcWorkFileHide(); }
$(parent).remove();
return false;
}
});
return false;
});
// IMAGE Adder
$('#lcwork').on('click','.imgDB', function()
{
$('.uploadLogoArea').each(function() { $('.imgDBActive').hide(); });
$(this).find('.imgDBActive').show();
resetCanvas();
var img = $(this).data('img');
//$.when(addImage(img,1)).done(function(ev) { recalcImageContainer(); showHideContainer(); initWorkspace('',0); });
$.when(addImage(img,1)).done(function(ev) { initWorkspace('',0); });
});
// Remove Entwurf
$('#lcremoveDesign').on('click',function()
{
canvas.clear();
$('.uploadLogoArea').each(function() { $('.imgDBActive').hide(); });
$('#lcWorkSpaceContainer').hide();
// SET LCWORKFILE
lcWorkFileHide();
});
// FILTER
$('#gravur').on('click',function()
{
$(this).addClass('active');
$(this).data('active',1);
$('#cmyk').removeClass('active');
$('#cmyk').data('active',0);
$('#lcremoveBG').addClass('active');
refreshFilter();
});
$('#cmyk').on('click',function()
{
$(this).addClass('active');
$(this).data('active',1);
$('#gravur').removeClass('active');
$('#gravur').data('active',0);
refreshFilter();
});
$('#lcscaleBG').on('click',function()
{
if($('.vsliderContainer').is(':hidden'))
{
$(this).addClass('active');
$('.vsliderContainer').show();
}
else
{
$(this).removeClass('active');
$('.vsliderContainer').hide();
}
});
$('.verticalSlider').on('input',function()
{
zoomLevel = ($(this).val() / 20) + 1;
canvas.zoomToPoint(new fabric.Point(canvas.width / 2, canvas.height / 2), zoomLevel); //canvas.getZoom() / zoom
});
$('#lcremoveBG').on('click',function()
{
var obj = canvas.item(0);
if(obj)
{
obj.filters.push(filterRemoveWhite());
obj.applyFilters()
canvas.renderAll();
$(this).addClass('active');
}
});
$('#lcreset').on('click',function()
{
//$('.uploadLogoArea').each(function() { if($('.imgDBActive').is(':visible')) { $(this).trigger('click'); }} )
$('.imgDBActive:visible').trigger('click');
});
});
function recalcImageContainer()
{
var cWidth = $('.stdShopImageLarge').width();
var cHeight = $('.stdShopImageLarge').height();
//console.log('IMG_REAL_SIZE:' + $('#prodImage').width() + ',' + $('#prodImage').height());
//console.log('CONTAINER_SIZE:' + cWidth + ',' + cHeight);
// CHEIGHT ALWAYS = 400
$('#lcWorkSpaceContainer').css({'width':$('.stdShopImageLarge').width()});
}
/* RESIZE ACTION */
var resizeIcon = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA2ZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDowQUIwMDRDNkE0ODRFQjExQTQ1Q0ExRUFGNjFCNTVBMyIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDpDQUNERDBENTg1NjYxMUVCOUZDNEQ3OEUyN0Q3RTQ0NSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDpDQUNERDBENDg1NjYxMUVCOUZDNEQ3OEUyN0Q3RTQ0NSIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ1M2IChXaW5kb3dzKSI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOkI1NEE3NjRCNjQ4NUVCMTE5Rjc2Qzg3QUQ4RTZDMUUyIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjBBQjAwNEM2QTQ4NEVCMTFBNDVDQTFFQUY2MUI1NUEzIi8+IDwvcmRmOkRlc2NyaXB0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";
var imgResize = document.createElement('img');
imgResize.src = resizeIcon;
fabric.Object.prototype.controls.mbr = new fabric.Control({
x: 0.5,
y: 0.5,
offsetY: 0,
cursorStyle: 'pointer',
actionHandler: fabric.controlsUtils.scalingEqually,
actionName: 'scale',
render: renderIcon(imgResize),
cornerSize: 40,
/*padding:200,*/
withConnection: true
});
/* ROTATE ICON */
var rotateIcon = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA2ZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDowQUIwMDRDNkE0ODRFQjExQTQ1Q0ExRUFGNjFCNTVBMyIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo4RUQ1RjFDRjg1NjQxMUVCQTBFREQzNDQ5RDQ5RDc4MCIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo4RUQ1RjFDRTg1NjQxMUVCQTBFREQzNDQ5RDQ5RDc4MCIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ1M2IChXaW5kb3dzKSI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOkMwRkY2MDk1QjQ4NEVCMTFBNDVDQTFFQUY2MUI1NUEzIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjBBQjAwNEM2QTQ4NEVCMTFBNDVDQTFFQUY2MUI1NUEzIi8+IDwvcmRmOkRlc2NyaXB0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";
var imgRotate = document.createElement('img');
imgRotate.src = rotateIcon;
fabric.Object.prototype.controls.mtr = new fabric.Control({
x: 0.5,
y: -0.5,
offsetY: 0,
cursorStyle: 'pointer',
actionHandler: fabric.controlsUtils.rotationWithSnapping,
actionName: 'rotate',
render: renderIcon(imgRotate),
cornerSize: 40,
withConnection: true
});
function deleteObject(eventData, transform) {
var target = transform.target;
var canvas = target.canvas;
canvas.remove(target);
canvas.requestRenderAll();
}
function skewObject(eventData, transform) {
var target = transform.target;
var canvas = target.canvas;
var pointer = canvas.getPointer(event.e);
var posX = pointer.x;
var posY = pointer.y;
console.log(posX+", "+posY);
//console.log(eventData);
//canvas.remove(target);
canvas.requestRenderAll();
}
function renderIcon(icon) {
return function renderIcon(ctx, left, top, styleOverride, fabricObject) {
var size = this.cornerSize;
ctx.save();
ctx.translate(left, top);
ctx.rotate(fabric.util.degreesToRadians(fabricObject.angle));
ctx.drawImage(icon, -size/2, -size/2, size, size);
ctx.restore();
}
}
/** ---------------------------------------------------------------------------*/
/** */
/** INIT WORKSPACE */
/** */
/** ---------------------------------------------------------------------------*/
function initWorkspace(json,reloadFromJS)
{
LOG && console.log('initWorkspace');
if(reloadFromJS!=1) { canvas.clear(); }
$('#lcWorkSpace').hide();
recalcImageContainer();
canvas.setWidth($('#lcWorkSpaceContainer').width());
canvas.setHeight($('#lcWorkSpaceContainer').height());
resetCanvas();
//$('.uploadLogoArea').each(function() { $('.imgDBActive').hide(); });
if(json.length > 0)
{
json = json.replace(/'/g,"\'");
//json = json.replace(/"/g,'\\"');
json = json.replace(/\n/g, "\\n"); //json=replace
json = json.replace(/\r/g, "\\r"); //json=replace
LOG && console.log('initSign from JSON (PHP)');
//console.log(json);
//var start = timer(0);
// canvas.loadFromJSON(json, canvas.renderAll.bind(canvas), function(o, object) {
// var start = timer(0);
// var tdiff = timer(start);
// LOG && console.log(o,object); // 'Object loaded in: ' +tdiff + ', Object:' + fabric.log(o, object));
// });
canvas.loadFromJSON(json, function () {
//canvas.forEachObject(function(o) {
//console.log('JSON: ObjType: ' + o.type);
//console.log(o.type);
//if (o.type === 'image' && o.filters.length !== 0) {
// o.applyFilters(canvas2.renderAll.bind(canvas2));
//}
// });
});
//var tdiff = timer(start);
//LOG && console.log('JSON loads in: ' +tdiff);
//canvas.loadFromDatalessJSON(json, canvas.renderAll.bind(canvas), function(o, object) {
// fabric.log(o, object);
//});
}
else
{
LOG && console.log('init from JS');
}
delay(function() { // CAUSE IMAGES IN JSON ARE NOT LOADED PROPERLY
var startdelay = timer(0);
//for(x=2; x 0)
{
if(toCanvas==1)
{ addImage(xhr.responseText,0);
//showHideContainer();
initWorkspace('',0);
}
//$.when(addImageFunction()).done(function(ev) { showHideContainer(); });
uploadWin.enable();
uploadWin.close();
if(toCanvas==0) // IMAGE UPLOAD IN WK
{
return xhr.responseText;
}
}
else
{
if(xhr.responseText.length > 0)
{
resultError = xhr.responseText.split('|');
}
if(resultError[0]) { errorMessage= 'File/Reason: ' + resultError[0] + '
'; }
if(resultError[1]) { errorMessage= errorMessage + 'Error: ' + resultError[1] + ''; }
uploadWin.enable();
$('.loaderError').show();
$('.loader2').hide();
$('.loaderError').html('Es ist ein Fehler bei der Übertragung aufgetreten:
' + errorMessage + '
'); //xhr.abort();
}
}
}
var formData = new FormData();
formData.append('file', file);
xhr.send(formData);
}
function setBackgroundImage()
{
var timestamp = new Date().getTime();
var bgimage = $('.stdShopImageLarge').css('background-image');
bgimage = bgimage.replace('url(','').replace(')','').replace(/\"/gi, "");
var ext = bgimage.substr( (bgimage.lastIndexOf('.') +1) ).toLowerCase();
if(ext=='jpg' || ext=='jpeg' || ext=='png')
{
fabric.Image.fromURL(bgimage+'?'+timestamp, function(obj) // FORCE BGIMAGE LOADED AGAIN (NOT FROM CACHE -> CHROMIUM BUG)
{
//fabric.util.loadImage(bgimage+'?'+timestamp, function (img)
//{
//var obj = new fabric.Image(img);
/* RESIZE TO WORKCONTAINER */
if(obj.width >= canvas.width)
{
/** CALC NEW RATIO BY WIDTH */
var scaleRatio = canvas.width/obj.width;
if((scaleRatio * obj.height) > canvas.height) { scaleRatio= canvas.height/obj.height; }
//console.log('scaleRatio:' + scaleRatio);
}
else
{
/** CALC NEW RATIO BY HEIGHT */
var scaleRatio = canvas.height/obj.height;
if((scaleRatio * obj.width) > canvas.width) { scaleRatio= canvas.width/obj.width; }
//console.log('scaleRatio:' + scaleRatio);
}
canvas.setBackgroundImage(obj, canvas.renderAll.bind(canvas), {
scaleX: scaleRatio,
scaleY: scaleRatio
});
obj.set({centeredScaling: 1, crossOrigin: "anonymous", selectable: false});
//obj.set({lcFilename: image });
//obj.set({centeredScaling: 1, crossOrigin: "anonymous", clipPath: bgLayer, clip_target: 'bgLayer'});
obj.setCoords();
obj.center();
canvas.renderAll.bind(canvas);
}, { crossOrigin:'anonymous'});
}
else
{
//alert('not available');
}
}
function addImage(image,restore)
{
canvas.clear()
setBackgroundImage();
var im = image.split('|');
//console.log('adding image: ' + restore);
if(restore==1)
{
/** NO NEED TO CHECK RESOLUTION */
var resolution = 150;
var image=im[0];
}
else
{
tmp = im[0].replace(/\.\.\/\.\.\/.*\/\//,'');
image = tmp.replace('..//','');
image = 'https://www.edelstahlbecher.de/' + image;
var resolution = parseInt(im[1]);
}
var timestamp = new Date().getTime();
var ext = image.substr( (image.lastIndexOf('.') +1) ).toLowerCase();
var scaleFactor = 0.8;
if(ext=='jpg' || ext=='jpeg' || ext=='png')
{
fabric.Image.fromURL(image+'?'+timestamp, function(obj) // FORCE IMAGE LOADED AGAIN (NOT FROM CACHE -> CHROMIUM BUG)
{
//fabric.util.loadImage(image,function (img)
//{
//var obj = new fabric.Image(img);
formatObjControls(obj,1);
removeLastObj('Add Image JPEG/PNG');
if(obj.width >= canvas.width)
{
/** CALC NEW RATIO BY WIDTH */
var scaleRatio = (canvas.width/obj.width) * scaleFactor;
if((scaleRatio * obj.height) > (canvas.height * scaleFactor)) { scaleRatio = (canvas.height/obj.height) * scaleFactor; }
//console.log('scaleRatio:' + scaleRatio);
}
else
{
/** CALC NEW RATIO BY HEIGHT */
var scaleRatio = (canvas.height/obj.height) * scaleFactor;
if((scaleRatio * obj.width) > (canvas.width * scaleFactor)) { scaleRatio= (canvas.width/obj.width) * scaleFactor; }
//console.log('scaleRatio:' + scaleRatio);
}
obj.set({centeredScaling: 1, scaleX: scaleRatio, scaleY: scaleRatio});
obj.set({lcFilename: image });
obj.setCoords();
canvas.add(obj);
canvas.renderAll.bind(canvas);
canvas.setActiveObject(obj);
refreshFilter('jpg');
/* ENABLE REMOVE WHITE FILTER */
$('#lcremoveBG').removeClass('inactive');
$('#lcremoveBG').css('background-image','url(https://www.edelstahlbecher.de/xshop/icons/lc_removeBg.png)');
/* IS FULL COLOR DIGITALDRUCK FALSE ? */
// if($('#gravur').data('active')==1)
{
// SET FILTERS
// obj.filters.push(filterRemoveWhite());
// obj.filters.push(filterBlendColor(WORKSPACE.color));
// obj.applyFilters()
// canvas.renderAll();
// obj.set({ mmkTrueColor: 0 });
}
//else
//{ obj.set({ mmkTrueColor: 1 }); }
//register_mmkTrueColor(obj);
centerObjHV();
//if(resolution<150)
//{
// alert('inactive for now');
// $('#errorbar').html('Das heraufgeladene Bild ist sehr gering in der Auflösung und kann daher zu Qualitätseinbußen führen.');
// $('#errorbar').show();
//}
}, {crossOrigin: 'anonymous'});
}
if(ext=='svg')
{
fabric.loadSVGFromURL(image, function(objects, options)
{
var obj = fabric.util.groupSVGElements(objects, options);
formatObjControls(obj,1);
obj.set({ centeredScaling: 1});
obj.set({lcFilename: image });
refreshFilter('svg');
//obj.set({ centeredScaling: 1, clipPath: bgLayer, clip_target: 'bgLayer'});
obj.width>=obj.height ? obj.scaleToWidth(initialWidth) : obj.scaleToWidth(initialHeight);
removeLastObj('Add Image SVG');
canvas.add(obj);
canvas.renderAll.bind(canvas);
canvas.setActiveObject(obj);
centerObjHV();
/* DISABLE REMOVE WHITE FILTER */
$('#lcremoveBG').addClass('inactive');
$('#lcremoveBG').css('background-image','url(https://www.edelstahlbecher.de/xshop/icons/lc_removeBg_inactive.png)');
});
}
resetCanvas();
canvas.renderAll();
/** RESTORE IMAGE UPLOAD AREA IF NOT SHOWN ALREADY **/
/** $('.uploadButton').hide(); **/
var uid = guidGenerator();
url = 'http://localhost/eb4/xuser/uploads/test.png?' + '?q=tdiff';
// SET LCWORKFILE
$('#lcWorkFile').val(image);
$('#userChoiceUploadImage').hide();
$('#userChoiceUploadDesign').show();
$('#userUploadDesignMode').val(1);
$('.imgDBAnfrage').css('background-image','url('+url+')');
$('.uploadLogoArea').show();
if(restore==0)
{
$('.uploadLogoArea').each(function() { $('.imgDBActive').hide(); });
$('.uploadLogoArea').append('');
}
return true;
}
function formatObjControls(obj,mode)
{
obj['setControlVisible']('tl',0);
//obj['setControlVisible']('mtl',0);
//obj['setControlVisible']('mb',0);
obj['setControlVisible']('bl',0);
//obj['setControlVisible']('mbr',0);
// obj['setControlVisible']('mr',0);
//obj['setControlVisible']('mt',0);
obj['hasBorders']= 0; //WORKSPACE.selectorPadding; //4;
obj['padding']= WORKSPACE.selectorPadding; //4;
obj['cornerSize']=WORKSPACE.selectorCornerSize; //8
obj['borderColor']=WORKSPACE.selectorBorderColor;
obj['cornerColor']=WORKSPACE.selectorCornerColor;
obj['cornerStyle']=WORKSPACE.selectorCornerStyle;
obj['transparentCorners'] = WORKSPACE.selectorCornerTransparent;
obj['stroke'] = WORKSPACE.selectBorderStrokeColor;
obj['strokeDashArray'] = [WORKSPACE.selectBorderStrokeDashWidth,WORKSPACE.selectBorderStrokeDashWidth];
obj['strokeWidth'] = WORKSPACE.selectBorderStrokeWidth;
obj['strokeUniform'] = true;
// RE-REGISTER OWN VARS // OR THEY WILL DISAPEAR
//if(typeof obj['mmkObjectID'] !== 'undefined') { obj.set({ mmkObjectID: obj['mmkObjectID'] }); register_mmkObjectID(obj); }
//if((obj['mmkLayerFill']) && $('#ENGRAVEFILLABLE').val()==1) //=='layerFillColor'
//{ obj.set({ mmkLayerFill: 1 }); register_mmkLayerFill(obj); }
// UNREGISTER VARS
//if((obj['mmkLayerFill']) && $('#ENGRAVEFILLABLE').val()==0) //=='layerFillColor'
//{ obj.set({ mmkLayerFill: '' }); register_mmkLayerFill(obj); }
// TRUE COLOR
//if((obj['mmkTrueColor'])==1) { obj.set({ mmkTrueColor: 1 }); register_mmkTrueColor(obj); }
LOG && console.log('FormatObjControls: Obj: '+obj+ ', Mode: ' +mode);
}
function resetCanvas()
{
//canvas.setZoom(1);
canvas.zoomToPoint(new fabric.Point(canvas.width / 2, canvas.height / 2), 1);
canvas.renderAll();
$('#lcscaleBG').removeClass('active');
$('#lcremoveBG').removeClass('active');
$('.vsliderContainer').hide();
$('.verticalSlider').val(0);
}
function removeLastObj(from)
{
/* SKIP BACKGROUND IMAGE */
if(canvas.getObjects().length==2)
{
var last = canvas.item(canvas.getObjects().length-1);
canvas.remove(last);
canvas.renderAll();
}
//console.log('removing last img obj:' + from + ', Layers: ' + canvas.getObjects().length);
if(canvas.getObjects().length==0) // 1 WITH BACKGROUND IMAGE
{
//$('#lcWorkSpaceContainer').hide();
}
}
function showHideContainer()
{
/** CHECK IF AN IMAGE IS SELECTED */
if($('#lcWorkSpaceContainer').is(':hidden'))
{
$('#lcWorkSpaceContainer').show();
//console.log('restoring spaceContainer');
}
}
function refreshFilter(filetype)
{
var obj = canvas.item(0); //canvas.getObjects().length-1);
//console.log('refreshing filter...')
//console.log(obj);
if(obj)
{
if(filetype===undefined)
{
var ext = obj.lcFilename.substr( (obj.lcFilename.lastIndexOf('.') +1) ).toLowerCase();
LOG && console.log('Extension restored from Filename:' + ext);
}
else
{
var ext=filetype;
LOG && console.log('Extension restored by given Filename');
}
/** RESTORE FILTER & COLORS **/
if($('#gravur').data('active')==1)
{
// SET FILTERS
if(ext=='jpg' ||ext=='jpeg' || ext=='png')
{
obj.filters.push(filterRemoveWhite());
obj.filters.push(filterBlendColor(WORKSPACE.color));
obj.applyFilters()
canvas.renderAll();
}
if(ext=='svg')
{
if (obj.type == 'group' || obj.type == 'path-group') { var group = obj; for (var i=0; i < group.getObjects().length; i++) { group.item(i).set({'fill': '#000000'}); console.log('filling group'); }}
else { obj.fill = '#000000'; console.log('filling single'); }
canvas.renderAll();
}
// obj.set({ mmkTrueColor: 0 });
}
else
{
if(ext=='jpg' || ext=='jpeg' || ext=='png')
{ obj.filters = [];
obj.applyFilters()
canvas.renderAll();
}
if(ext=='svg')
{
/* RESTORE FILL */
// if (obj.type == 'group' || obj.type == 'path-group') { var group = obj; for (var i=0; i < group.getObjects().length; i++) { group.item(i).set({'fill': '#ff0000'}); console.log('filling group'); }}
// else { obj.fill = '#ff0000'; console.log('filling single'); }
// canvas.renderAll();
}
}
}
}
function filterRemoveWhite()
{
var filter = new fabric.Image.filters.RemoveColor({
color:'#FFFFFF',
distance: 0.1
});
return filter;
}
function filterBlendColor(color)
{
var filter = new fabric.Image.filters.BlendColor({
color: color,
mode: 'tint',
alpha: 1
});
return filter;
}
function centerObjHV () { var obj = canvas.getActiveObject(); obj.center(); obj.setCoords(); canvas.renderAll();} //updateObjControls('func_centerObjHV'); canvas.renderAll(); }
function centerObjH () { var obj = canvas.getActiveObject(); obj.centerH(); obj.setCoords(); canvas.renderAll();} //updateObjControls('func_centerObjH'); canvas.renderAll(); }
function centerObjV () { var obj = canvas.getActiveObject(); obj.centerV(); obj.setCoords(); canvas.renderAll();} //updateObjControls('func_centerObjV'); canvas.renderAll(); }
// * SAVE ENTWURF TO DISK **/
function lcWorkFileHide()
{
$('#lcWorkFile').val('');
$('#userChoiceUploadImage').show();
$('#userChoiceUploadDesign').hide();
$('#userUploadDesignMode').val(0);
$('.imgDBAnfrage').css('background-image','');
$('.imgDBAnfrage').data('fileraw','');
// $('#lcremoveDesign').trigger('click');
}
function saveLcDesign()
{
var jsondata = JSON.stringify(canvas);
var svgdata = ''; //saveImageAs('svg');
var pngdata = saveImageAs('png');
var parent = $('.imgDBActive:visible').closest('div');
var uploadfile = $(parent).prev('div').data('id');
$.ajax({type: "POST", url: "https://www.edelstahlbecher.de/scripts/shop.warenkorb-io.php", data: { com: 'saveLcDesign', uploadfile: uploadfile, pngdata: pngdata, jsondata: jsondata }}).done(function(ex)
{
//console.log('FILENAME: ' +ex );
data= ex.split('|');
//var previewFile = 'https://www.edelstahlbecher.de/xuser/uploads/' + ex +'_entwurf.png';
//$('.imgDBAnfrage').css('background-image','url("' + previewFile + '")');
//$('.imgDBAnfrage').data('fileraw',ex);
var ts = timer(0);
var previewFile = data[0] + 'xuser/uploads/' + data[1] +'_entwurf.png?'+ ts;
$('.imgDBAnfrage').css('background-image','url("' + previewFile + '")');
$('.imgDBAnfrage').data('fileraw',data[1]);
anfrageWin.open();
$('#create-anfrage').attr('disabled',false);
$('.loader3').hide();
$('.anfrageButtonText').show();
}).fail(function(err) { console.log(err); });
}
// * WRITE IMAGE DATA *//
function saveImageAs(format)
{
var dataURL='';
//$('#schild').css('visibility','hidden'); // better display
// DESELECT ALL OBJECTS
//canvas.deactivateAll().renderAll(); // NOT WORKING IN 2.x
canvas.discardActiveObject();
var addID = new Array();
var removeID=new Array();
switch(format)
{
case 'png':
dataURL = canvas.toDataURL('image/png');
break;
case 'jpeg':
dataURL = buffer.toDataURL('image/png'); // PNG OUTPUT
var ctx = canvas.getContext("2d");
var myImageData = ctx.getImageData(canvas.item(0).getLeft(), canvas.item(0).getTop(), canvas.item(0).get('width'), canvas.item(0).get('height'));
buffer = document.createElement('canvas');
var bufferCtx = buffer.getContext("2d");
buffer.width = canvas.item(0).get('width');
buffer.height = canvas.item(0).get('height');
bufferCtx.putImageData(myImageData, 0, 0);
break;
case 'json':
dataURL = canvas.toJSON();
break;
case 'svg':
// GROUPS
//var engraveGroup = new Array();
//var cutGroup = new Array();
var imageScale = '';
var imageGroup = new Array();
var w,imgScaleFac,i,items,groupX,groupY;
// XY CORRECT
var objX= canvas.item(0).get('left');
var objY= canvas.item(0).get('top');
// FORMAT OBJECTS TO CSVG
LOG && console.log('Create SVG WorkingFile:');
LOG && console.log('------------------------------------------------------------------');
for(x=0; x canvas.item(x).get('height'))
// {
//xcorrect=0;
//ycorrect= $('#HEIGHT').val() - dy;
// ty = $('#HEIGHT').val() - ty;
// dy = $('#HEIGHT').val() - dy;
// }
// else
// {
//xcorrect= $('#WIDTH').val() - dx;
//ycorrect= 0;
// tx = $('#WIDTH').val() - tx;
// dx = $('#WIDTH').val() - dx;
// }
// console.log('XCORR: '+ canvas.item(x).get('scaleX') +'/'+ sx +', YCORR: '+ canvas.item(x).get('scaleY') + '/' + sy);
// BORDER STUFF HERE
//if(x==1)
//{
// console.log('BORDERID: ' + $('#BORDERID').val());
// alert('hold it');
//}
if(x==1)
{
switch($('#BORDERID').val())
{
//case '2': dx=dx - 2; dy = dy - 2; break; //Thin (2mm vom Rand)
//case '3': dx=dx - 5; dy = dy - 5; break; //Thick (5mm vom Rand)
}
//console.log('Layer: ' + x+' Type: '+type+', '+'tx|ty: ' +tx+','+ty+ ' dx|dy: ' +dx+ ',' +dy+ ' sx|sy: ' +sx+ ',' +sy+ ' width/height: ' + obj.get('width')+',' + obj.get('height')+ ' scaleFac: '+SIGN.scaleFac + ' sdx|sdy: ' +sdx+ ',' +sdy);
//console.log('DIM: ' +dx+ ',' +dy+ ',' +tx+ ',' +ty);
//alert('hold it');
}
switch(type)
{
case 'rect' : obj.set({ width: dx,
height: dy,
left: tx,
top: ty,
});
if($('#FORMDATA').val()=='rounded' && x==0)
{
obj.set({ rx: SIGN.cornerRadius, // * SIGN.scaleFac,
ry: SIGN.cornerRadius, // * SIGN.scaleFac,
});
}
break;
case 'ellipse': obj.set({ top: ty,
left: tx,
rx: canvas.item(x).getRx()/SIGN.scaleFac,
ry: canvas.item(x).getRy()/SIGN.scaleFac,
//scaleX: sx/2,
//scaleY: sy/2,
});
break;
case 'circle' : obj.set({ left: tx,
top: ty,
scaleX: sx,
scaleY: sy,
});
break;
case 'image' : w = canvas.item(x).get('width') * canvas.item(x).get('scaleX') / SIGN.scaleFac;
imgScaleFac = w/canvas.item(x).get('width');
obj.set({ top: ty,
left: tx,
scaleX: 1,
scaleY: 1,
});
// push original file name + imgScaleFac to array();
imageScale=imageScale + "" + imgScaleFac +'|';
imageGroup.push(obj.getSrc());
break;
case 'polygon':
case 'triangle':
case 'path' :
case 'path-group':
case 'group' :
if(obj.mmkLayerType=='layerComponent')
{
/** HAS 2 Objects Fixation + Overlay **/
i=0;
items = obj._objects;
var groupX = obj.get('left');
var groupY = obj.get('top');
var groupScaleX = obj.get('scaleX');
var groupScaleY = obj.get('scaleY');
var groupWidth = obj.get('width');
var groupHeight = obj.get('height');
removeID.push(x);
while (i < items.length)
{
LOG && console.log('I: ' + i + ', GROUP Left/Top: ' + obj.left + ',' + obj.top + ', Item Left/Top: ' + items[i].left + ',' + items[i].top + ', Group Width/Height ' + obj.width +',' + obj.height + ', ScaleX/ScaleY ' + obj.scaleX +',' + obj.scaleY +', LAYERDATA: ' + items[i].mmkLayerType + ', OBJECTID: ' + items[i].mmkObjectID);
LOG && console.log('WIDTH/HEIGHT: ' + canvas.width + ', ' + canvas.height);
varx = obj._objects[i].get('left') * groupScaleX + groupX + (groupWidth/2) * groupScaleX;
vary = obj._objects[i].get('top') * groupScaleY + groupY + (groupHeight/2) * groupScaleY;
if(i==0)
{
items[i].set({left: varx, top: vary, scaleX: groupScaleX, scaleY: groupScaleY, fill:'', selectable : true, mmkLayerType: 'layerCompFixation' });
canvas.add(items[i]); canvas.renderAll();
}
i++;
}
}
else
{
obj.set({ top: ty,
left: tx,
scaleX: sx,
scaleY: sy,
});
}
break;
case 'i-text': obj.set({ top: ty,
left: tx,
scaleX: sx,
scaleY: sy,
});
break;
}
// BG LAYER
if(x==0 || obj.mmkLayerType=='layerCutForm' || obj.mmkLayerType=='layerFixation' || obj.mmkLayerType=='layerCompFixation')
{
if(x==0) { obj.set({ shadow:'none' }); }
obj.set({strokeWidth: 0.001, stroke: '#ff0000', fill:'', strokeDashArray: []}); //, shadow: 'none'
//cutGroup.push(canvas.item(x).clone());
}
else if(obj.mmkLayerType=='layerOverlay')
{
removeID.push(x);
}
else
{
if(obj.mmkLayerFill && obj.mmkLayerFill==1) // layerFillColor
{
//ist ein LayerFill auf dem Obj. -> tue nichts
}
else
{
if(obj.get('type')=='image')
{
if($('#ENGRAVEMETHOD option:selected').val()!=8)
{
// delay(function() {
//alert($('#ENGRAVEMETHOD option:selected').val());
//alert('Image');
//var filter2 = new fabric.Image.filters.BlendColor({
//color: '#000000', //, //'rgba(0,0,0,1)',
//mode:'tint',
//alpha: 1//opacity: 1
//});
//fabric.util.removeFromArray(obj.filters,'Tint');
obj.filters.push(filterBlendColor('#000000'));
//LOG && console.log('FILTERS:');
//LOG && console.log(obj.filters);
//obj.set({ fill: '#222222' });
obj.applyFilters();
canvas.renderAll;
// }, FLOATDELAY ); // 1350
}
}
else
{
fillObjWithColor(obj, 'rgba(0,0,0,1)');
//if($('#ENGRAVEMETHOD option:selected').val()!=8)
//{
// obj.set({ fill: 'rgba(0,0,0,1)' });
//}
}
}
}
// obj.setCoords();
//canvas.renderAll();
}
//alert('Hold it!');
//notAFunction();
// REMOVE BORDER LAYER IF NOT PRESENT
if($('#BORDERID').val()>1 && $('#BORDERID').val()<4)
{
var bw = canvas.item(1).get('width');
var bh = canvas.item(1).get('height');
var bwt = 0;
switch($('#BORDERID').val())
{
case '2': bwt=2; break; //Thin
case '3': bwt=5; break; //Thick
}
//var bwt = 5; //parseInt(5 * SIGN.scaleFac);
canvas.item(1).set({ strokeWidth: bwt, stroke: '#000000', fill:'rgba(255,255,255,0)'});
if($('#FORMDATA').val()=='rounded')
{
canvas.item(1).set({ rx: SIGN.cornerRadius, // * SIGN.scaleFac,
ry: SIGN.cornerRadius, // * SIGN.scaleFac,
});
}
}
else { //canvas.item(1).remove();
removeID.unshift(1);
}
obj.setCoords();
canvas.renderAll();
// REMOVE OVERLAYS // BORDER // GROUPS LAYERS ETC.
for(var x = removeID.length; x--;)
{
fx=removeID[x];
canvas.remove(canvas.item(fx));
}
// ADD COMPONENT FIXATIONS
// ADD ORIGINAL IMAGES
var fileList=''; var fileObj='';
for (index = 0; index < imageGroup.length; ++index)
{
fileList = fileList + imageGroup[index] +'\n';
file = imageGroup[index].replace('https://www.edelstahlbecher.de/xuser/uploads/','');
fileObj = fileObj + file +',';
}
if(fileList.length>0)
{
//var text = new fabric.Text('Originaldateien/URL\n' + fileList, { left: 0, top: -80, fontFamily: 'Arial', fontSize: 7 });
//canvas.add(text);
//obj.setCoords();
//canvas.renderAll();
}
obj.setCoords();
canvas.renderAll();
// WRITE SVG DATA
var dim= new Array();
if($('#DIMMODE0').is(':checked')) { dim = $('#DIMSTD').val().split('x'); }
if($('#DIMMODE1').is(':checked')) { dim = [$('#WIDTH').val(),$('#HEIGHT').val()]; }
dataURL = canvas.toSVG({suppressPreamble: 1, viewBox: { x: 0, y: 0, width: dim[0], height: dim[1]}});
//dataURL = canvas.toSVG();
//alert(dataURL);
//alert('Berechne...');
break;
}
return [dataURL,fileObj,imageScale];
}
function guidGenerator() {
var S4 = function() {
return (((1+Math.random())*0x10000)|0).toString(16).substring(1);
};
return (S4()+S4()+"-"+S4()+"-"+S4()+"-"+S4()+"-"+S4()+S4()+S4());
}
function timer(time)
{
var d = new Date();
var now = d.getTime();
if(time==0) { return now; }
else { var ntime = now - time +' ms'; return ntime; }
}