Current File : /home/users/barii/public_html/finansenl.com.pl/system.fotomagnesy.pl/backup_newsystem/js/text.js

function getObjectById(id) {   ///pobieranie elementów przez ID
  var par;
    canvas.forEachObject(function (o) {
        if (o.id === id) {   
            l = o.getLeft();
            t = o.getTop();
            a = o.getAngle();
            canvas.remove(o);
            par = l+'|'+t+'|'+a;
        }     
    });
            return par;
}
function ZmienOrientacje(){
getObjectById('ramka');
      if(canvas.width == 1654){
          canvas.setWidth(1102);
          canvas.setHeight(1654);
      canvas.setOverlayImage('/img/p.png', canvas.renderAll.bind(canvas));                                                                                                
      canvas.renderAll();   
          zmienKsztalt('pion');
      }else{
          canvas.setWidth(1654);
          canvas.setHeight(1102);   
      canvas.setOverlayImage('/img/z.png', canvas.renderAll.bind(canvas));                                                                                                
      canvas.renderAll();   
          zmienKsztalt('poziom');
      }
}
function removeObjectById(id) {///pobieranie elementów przez ID
    canvas.forEachObject(function (o) {if (o.id === id) {canvas.remove(o);}   });
} 
function NotRemoveObjectById(id) {   ///pobieranie elementów przez ID
    canvas.forEachObject(function (o) {if (o.id === id) {}else{canvas.remove(o);}});
}
function getObjectBySrc(id) {   ///popieranie  zaimportowanych danych poprzez src
  var par;
    canvas.forEachObject(function (o) { 
          try {
                if ((o.src).search("kalendarium") != '-1') { 
                    l = o.left;
                    t = o.top;
                    a = o.angle;
                    canvas.remove(o);
                    par = l+'|'+t+'|'+a;  
                }
                
           }
           catch(err){
                    
           }              
    });
            

            return par;
}

$(document).ready(function() {
    function loadImages(container) {
        var imagesToLoad = $(container).find("li.zoom img[src='/img/load.gif']");
        console.log('Liczba znalezionych obrazów do załadowania:', imagesToLoad.length);

        imagesToLoad.each(function(index) {
            if (!$(this).hasClass('loaded')) {
            $(this).addClass('fade-in'); // Add class to start fade-in animation
            if (isNearViewport(this, container) || index < 5) { // Ładuje widoczne i 4 dodatkowe
                this.src = this.getAttribute('data-src');
                console.log('Ustawianie src:', this.src);

                this.onload = function() {
                     $(this).addClass('loaded'); // Add class when image is loaded to change
                    this.removeAttribute('data-src');
                    console.log('Obraz załadowany i data-src usunięte:', this.src);
                };
            }
        }
        });
    }

    function isNearViewport(el, container) {
        var rect = el.getBoundingClientRect();
        var containerRect = $(container).find('.scrollbar')[0].getBoundingClientRect();
        return (
            rect.bottom >= containerRect.top &&
            rect.top <= containerRect.bottom
        );
    }

    function debounce(func, wait, immediate) {
        var timeout;
        return function() {
            var context = this, args = arguments;
            clearTimeout(timeout);
            timeout = setTimeout(function() {
                timeout = null;
                if (!immediate) func.apply(context, args);
            }, wait);
        };
    }

    $('.tabs-container').each(function() {
        var container = this;
        var shape = $('body').data('shape');
        var debouncedLoadImages = debounce(function() { loadImages(container); }, 100);

        $(container).find('.scrollbar').on('scroll', debouncedLoadImages);

        $(container).find('select').change(function() {
            if (this.value == 0) {
                $(container).find(".zoom").show();
            } else {
                $(container).find(".zoom").hide();
                if ($(container).hasClass('tabs-3')) {
                    $(container).find("._kat" + this.value + ".rodzaj"+shape).show();
                } else {
                    $(container).find("._kat" + this.value).show();
                }
                console.log('Kategoria zmieniona na:', this.value);
                
            }
            debouncedLoadImages();
        });
    });




  var $highlight = $('<div class="highlight"></div>').appendTo('.left-menu nav');
  var currentActive = 5;  // Przechowuje indeks aktualnie aktywnego diva
        
$highlight.css('top', $('.left-menu button.active').position().top + 'px');


 $('.left-menu button').click(function() {




    var $this = $(this);
    var indexClicked = $('.left-menu button').index($this);
    var topPosition = $this.position().top;

    // Usuń klasę 'active' z obecnie aktywnego diva
    $('.left-menu button').removeClass('active');

    // Aktualizacja pozycji highlight na podstawie kliknięcia
    if (currentActive === -1) {
      // Jeśli nie ma aktualnie aktywnego diva, ustaw od razu
      $highlight.css('top', topPosition + 'px');
      $this.addClass('active');
      currentActive = indexClicked;
    } else {
      // Animate the highlight, then add active class when animation is complete
      $highlight.animate({top: topPosition + 'px'}, 500, function() {
        // Funkcja callback po zakończeniu animacji
        $this.addClass('active');
        currentActive = indexClicked;
      });
    }
    var element_index = $(this).data('id');


        $("#content1 .tabs-container").hide();
        $("#content1 div.tabs-"+(element_index)).show();

        return false;
  });


});





function SprawdzText() {   /// jeżeli tekst jest standardowy to usuwamy
canvas.forEachObject(function (o) {if(getStyle(o,'__text') == 'tutaj wpisz swój tekst'){canvas.remove(o);}});return null;
}

function init(w,h,nazwa){    /// inicjowanie CANVASU
                    canvas = this.__canvas = new fabric.Canvas(nazwa);

                    canvas.setHeight(h);
                    canvas.setWidth(w);  
                       
                    



                  
$('#texteditor .min.bold').click(boldit); 
$('#texteditor .min.italic').click(italicit)
$('#texteditor .min.underline').click(underlineit);    
$('#texteditor .min.acenter').click(centerit);           
$('#texteditor .min.aright').click(rightit);           
$('#texteditor .min.aleft').click(leftit);           
$('#texteditor .min.ajustify').click(justifyit);             
$('#texteditor .minn #color').change(colorit);       
$('#texteditor .min.totop').click(bringForward);           
$('#texteditor .min.toback').click(sendBackwards);              
$('#texteditor .min.remove').click(removeit);
$('#texteditor .minn.shadowd').click(shadowitdark); 
$('#texteditor .minn.shadowl').click(shadowitlight);
      
$('.min.rotate90right').click(RotateRight);           
$('.min.rotate90left').click(RotateLeft); 
$('.podpanel .min.bold').click(boldit); 
$('.podpanel .min.rotateitright').click(rotate.bind(this, 90));  
$('.podpanel .min.rotateitleft').click(rotate.bind(this, -90)); 
$('.podpanel .min.italic').click(italicit);  
$('.podpanel .min.underline').click(underlineit);    
$('.podpanel .min.acenter').click(centerit);           
$('.podpanel .min.aright').click(rightit);           
$('.podpanel .min.aleft').click(leftit);           
$('.podpanel .min.ajustify').click(justifyit);             
$('.podpanel .min #color').change(colorit);       
$('.podpanel .min.totop').click(bringForward);           
$('.podpanel .min.toback').click(sendBackwards);          
$('.podpanel .min.remove').click(removeit);        
$('.podpanel .min.shadowd').click(shadowitdark); 
$('.podpanel .min.shadowl').click(shadowitlight);

  canvas.on({     
    'object:moving': updateControls,
    'object:scaling': updateControls,
    'object:modified': updateControls,
    'object:resizing': updateControls, 
    'object:rotating': updateControls,     
    'object:selected': updateControls,
    'text:changed': updateControls,      
    'text:entered': updateControls2,       
    'text:exited': updateControls2,
    'selection:created':  updateControls,     
  });                              

canvas.on('object:moving', function (e) {
    var obj = e.target;
    if (obj.id !== 'zdjecie') {
        return; // Opuść funkcję, jeśli to nie zdjęcie
    }

    // Sprawdź, czy na płótnie jest ramka
    var czyRamka = canvas.getObjects().some(o => o.id === 'ramki');

    // Jeśli jest ramka lub strona nie jest /admin.php, zignoruj logikę ograniczania
    if (czyRamka || window.location.href.includes("/admin.php")) {
        return;
    }

    // Aktualizuj koordynaty, aby zapewnić, że są aktualne
    obj.setCoords();

    // Ograniczenia: nie pozwól zdjęciu wyjść poza płótno
    if (obj.currentHeight > obj.canvas.height || obj.currentWidth > obj.canvas.width) {
        return; // Opuść funkcję, jeśli obiekt jest zbyt duży
    }

    // Zabezpieczenie przed wyjściem zdjęcia poza górny-lewy róg płótna
    if (obj.getBoundingRect().top < 0 || obj.getBoundingRect().left < 0) {
        obj.top = Math.max(obj.top, -obj.getBoundingRect().top);
        obj.left = Math.max(obj.left, -obj.getBoundingRect().left);
    }

    // Zabezpieczenie przed wyjściem zdjęcia poza dolny-prawy róg płótna
    if (obj.getBoundingRect().top + obj.getBoundingRect().height > obj.canvas.height ||
        obj.getBoundingRect().left + obj.getBoundingRect().width > obj.canvas.width) {
        obj.top = Math.min(obj.top, obj.canvas.height - obj.getBoundingRect().height + obj.top - obj.getBoundingRect().top);
        obj.left = Math.min(obj.left, obj.canvas.width - obj.getBoundingRect().width + obj.left - obj.getBoundingRect().left);
    }

});
canvas.on('object:rotating', function () {
    updateButtonPosition();
});

canvas.on('object:scaling', function () {
    updateButtonPosition();
});

canvas.on('object:moving', function () {
    updateButtonPosition();
});

function duplicateObject() {
  var activeObject = canvas.getActiveObject();
  if (!activeObject) return;

  activeObject.clone(function(cloned) {
    canvas.discardActiveObject();
    cloned.set({
      left: cloned.left + 10,
      top: cloned.top + 10,
      evented: true,
    });
    canvas.add(cloned);
    canvas.setActiveObject(cloned);
    canvas.requestRenderAll();
  });
}

// Aktualizacja położenia przycisku w zależności od zaznaczenia
function updateButtonPosition() {
    var activeObject = canvas.getActiveObject();
    var button = document.getElementById('followButton');

    if (!activeObject || !button) {
        if (button) button.style.visibility = 'hidden';
        return;
    }

    var rect = activeObject.getBoundingRect(); // Pobierz prostokąt ograniczający obiekt
    var zoom = canvas.getZoom();
    var viewportTransform = canvas.viewportTransform;

    // Obliczenie pozycji przycisku z uwzględnieniem przekształceń widoku i skalowania
    var buttonLeft = rect.left * zoom + viewportTransform[4];
    var buttonTop = (rect.top - button.offsetHeight) * zoom + viewportTransform[5];

    button.style.left = `${buttonLeft}px`;
    button.style.top = `${buttonTop}px`;
    button.style.visibility = 'visible';
}



// Nasłuchiwanie zdarzeń zaznaczenia i odznaczenia

canvas.on('selection:created', function() {
    if (obj = canvas.getActiveObject()) {
        rozwinpodpanel();
       
    }
});







canvas.on('selection:cleared', function() {
  document.getElementById('duplicateButton').style.visibility = 'hidden';
});



document.getElementById('duplicateButton').addEventListener('click', duplicateObject);

canvas.on("selection:cleared", function(e){
      $("#texteditor.editor").hide();

                zwinpodpanel();
 
                //$("#tabs ul li").removeClass('active');
                //$("#content1>div").removeClass('active');
               // $("#content1>div").hide();
               // $(".tabs-3").addClass('active');
               // $("#tabs ul li:nth-child(4)").addClass('active');
               // $(".tabs-3").show();   
             
});    
         
}



function UstawObraz(urlik){  
                $("#obraz.obraz").val(urlik);
                var imge = $('<img src="'+urlik.replace("mini", redlof)+'"/>').load(function(){
                     
              //canvas.clear(); 
                      var ww = this.width; 
                      var hh = this.height;
                      
                      var p = (ww/hh);
                      var k = (canvas.width/canvas.height);
                      
                      if(k<p){                          
                          scale = (canvas.height)/hh;
                      } 
                      else{                        
                          scale = (canvas.width)/ww;
                      } 
                      
                      //alert(scale+' -> '+ww+' -> '+canvas.width+' -> '+(-1)*((canvas.width-(scale*ww)/2)));
                              
                      $('.zdjecie input[type=range]').attr('min',(scale/4));
                      $('.zdjecie input[type=range]').attr('max',(scale*2));
                      $('.zdjecie input[type=range]').attr('step',(scale/20));
                      $('.zdjecie input[type=range]').val(scale);
                      fabric.Image.fromURL(urlik.replace("mini", redlof), function(img) {
                        img.scale(scale).set({
                          left: ((canvas.width-(scale*ww))/2),
                          top: ((canvas.height-(scale*hh))/2),
                          id: 'zdjecie',
                          globalCompositeOperation: 'destination-over',
                        });
                        canvas.add(img).setActiveObject(img);
                        
                canvas.sendToBack(img);
                canvas.bringForward(img);
                });
               });
}

function zwinpodpanel(){

                                 

$('.podpanel').removeClass('rozwiniety-panel-the');  
$('.schowanemobile').hide();
$('.text').hide();

              $('text-areaeditor').removeClass('active'); 
              
        if (obj = canvas.getActiveObject()) {
              obj.canvas.discardActiveObject();
        }
              canvas.discardActiveObject();
canvas.requestRenderAll(); 
              $('text-areaeditor textarea').blur();
}
function rozwinpodpanel(){
                    $('.podpanel').show();    
$('.schowanemobile').css('display', 'inline-flex');                        
$('.podpanel').addClass('rozwiniety-panel-the');;
}


function updateControls2() {
    alert('event');
  }
  
function zmientekst(val){
    if (obj = canvas.getActiveObject()) {
        obj.text = val;
        canvas.renderAll();
    }
}

function updateControls() { 

    if (obj = canvas.getActiveObject()) {
    var src = obj.src;
    var idd = obj.id;
    var nak = "/naklejki/";
    var ozd = "/ozdobniki/"
    try {    
         if(obj.type == 'i-text'){
               $('.podpanel .zdjecie').hide();

              $('text-areaeditor').addClass('active');  
              $('text-areaeditor textarea').val(obj.text);
              $('#text_edit').val(obj.text);
              $('.podpanel .text').show();

              $('.tabs-container').hide();
            $('aside nav button').removeClass('active');
              $('aside nav  button[data-id="5"]').addClass('active');
              $('.tabs-5').show();
              
              rozwinpodpanel(); 
             
              $('.fontfamily>span').html(getStyle(obj,'fontFamily'));
              } 
              else if(obj.id == 'zdjecie'){
              $('.podpanel .text').hide();
               $('.podpanel .rodzajczcionki').hide();
              
              $('.podpanel .zdjecie').show();
              rozwinpodpanel();
              }    
              else if(obj.id == 'naklejki'){
              $('.podpanel .text').hide();
              $('.podpanel .rodzajczcionki').hide();
              rozwinpodpanel();
                $("#tabs ul li").removeClass('active');
                $("#content1>div").removeClass('active');
                $("#content1>div").hide();
                $(".tabs-1").addClass('active');
                $("#tabs ul li:nth-child(1)").addClass('active');
                $(".tabs-1").show();
              } 
              else if(obj.id == 'ozdobniki'){
              $('.podpanel .text').hide();
              $('.podpanel .rodzajczcionki').hide();
              rozwinpodpanel();
                $("#tabs ul li").removeClass('active');
                $("#content1>div").removeClass('active');
                $("#content1>div").hide();
                $(".tabs-2").addClass('active');
                $("#tabs ul li:nth-child(2)").addClass('active');
                $(".tabs-2").show();
              }  
              else if(obj.id == 'kalendarzykb'){ 
              $('.podpanel .text').hide();
              $('.podpanel .rodzajczcionki').hide();
              rozwinpodpanel();
                $("#tabs ul li").removeClass('active');
                $("#content1>div").removeClass('active');
                $("#content1>div").hide();
                $(".tabs-2").addClass('active');
                $("#tabs ul li:nth-child(2)").addClass('active');
                $(".tabs-2").show();
                          $('select.ozdobnikikat').val('kalendariumb');
                          $('.dirozdobniki').hide();          
                          $('.dirozdobniki.kalendariumb').show();
                
              } 
              else if(obj.id == 'kalendarzykc'){ 
              $('.podpanel .text').hide();
              $('.podpanel .rodzajczcionki').hide();
              rozwinpodpanel();
                $("#tabs ul li").removeClass('active');
                $("#content1>div").removeClass('active');
                $("#content1>div").hide();
                $(".tabs-2").addClass('active');
                $("#tabs ul li:nth-child(2)").addClass('active');
                $(".tabs-2").show();
                          $('select.ozdobnikikat').val('kalendariumc');
                          $('.dirozdobniki').hide();          
                          $('.dirozdobniki.kalendariumc').show();
              } 
              else{
              $('.podpanel .text').hide();
              $('.podpanel .rodzajczcionki').hide();
              rozwinpodpanel();}
                                     
    }
    catch(err) {
              zwinpodpanel(); 
    }
    
    var sizecorner = canvas.height/80;
       
         /*nowy wygląd zaznaczenia
    transparentCorners: false,
    cornerColor: 'blue',
    cornerStrokeColor: 'red',
    borderColor: 'red',
    cornerSize: 12,
    padding: 10,
    cornerStyle: 'circle',
    borderDashArray: [3, 3]
         */
                  
           
                if($('.podpanel').attr('style')=='top: 0px' || !$('.podpanel').attr('style')){
                      rozwinpodpanel();  
                }       
                                      
             if(getStyle(obj,'fontFamily') != null){   
                $('.plineheight').val((getStyle(obj,'lineHeight')/0.001));
                $('#color').css('background-color',getStyle(obj,'fill'));
                if(getStyle(obj, 'textDecoration') == 'underline') $('#texteditor div.underline').addClass('act');  //spradza czy jest podkrelenie
                else $('#texteditor div.underline').removeClass('act');  
                 
                if(getStyle(obj, 'fontStyle') == 'italic') $('#texteditor div.italic').addClass('act');     //sprawdza czy jest kursywa
                else $('#texteditor div.italic').removeClass('act');     
                
                if(getStyle(obj, 'fontWeight') == 'bold') $('#texteditor div.bold').addClass('act');     //sprawdza czy jest pogrubienie
                else $('#texteditor div.bold').removeClass('act'); 
                                                                       
                if(getStyle(obj, 'textAlign') == 'left') $('#texteditor div.aleft').addClass('act');     //sprawdza czy jest wyrównanie do lewej
                else $('#texteditor div.aleft').removeClass('act');          
                if(getStyle(obj, 'textAlign') == 'center') $('#texteditor div.acenter').addClass('act');     //sprawdza czy jest wyrównanie do srodka 
                else $('#texteditor div.acenter').removeClass('act');          
                if(getStyle(obj, 'textAlign') == 'right') $('#texteditor div.aright').addClass('act');     //sprawdza czy jest wyrównanie do prawej
                else $('#texteditor div.aright').removeClass('act');          
                if(getStyle(obj, 'textAlign') == 'justify') $('#texteditor div.ajustify').addClass('act');     //sprawdza czy jest wyrównanie wyjustowanie
                else $('#texteditor div.ajustify').removeClass('act'); 
                
                
                
                
                            
                if(obj.shadow != null){
                    //$(".pcien").show();        
                    if(obj.shadow.color == '#555555'){$('#texteditor div.shadowd').addClass('act'); 
                    $('#texteditor div.shadowl').removeClass('act');}
                    else{$('#texteditor div.shadowl').addClass('act'); 
                    $('#texteditor div.shadowd').removeClass('act');}
                                        
                }
              
                
                var sc = canvas.getWidth()/$('#myCanvas').width();  
                
                
              }
              else{  
                var sc = canvas.getWidth()/$('#myCanvas').width();
                    
                  try {
                        $( "#target" ).attr("src",obj.getSrc());
                    }
                    catch(err) {
                        // Handle error(s) here
                    } 
  }  
    }
    else{   
      //$("#texteditor.editortxt").hide();
      //$("#texteditor.editor").hide();
    
    }
        
  }

function Logi(){
    //Zapisz();       
       
                if (obj = canvas.getActiveObject()){
                canvas.getActiveObject().hasControls = canvas.getActiveObject().hasBorders = false; }
                canvas.renderAll();        
                          var dataURL = canvas.toDataURL({
                              format: 'jpeg',
                              quality: 1,
                          });            
                                          
                   removeObjectById('zdjecie');
                   //removeObjectById('ramki');

var asdf = canvas.toDatalessJSON();
delete asdf.objects[0];
var json_data = JSON.stringify(asdf); 
                   
                    
                          
        $.ajax({
            async : false,
            type : 'POST',
            data: {          
                imgBase64: dataURL,
                json: json_data,
                funct: 'imp'+$('.wzor').val()
                },
            url : '/js/saveJson.php',
            success : function(data) {
                alert('Zapisano pozycje.');  
                //console.log(data);
                //window.location.href = "http://www.etykietyweselne.pl/admin/edycja_wzory-serca.php";
                
            },
            error : function(error) {
                alert("Błąd: " + error);
            }
        });




}
                                                       
////FUNKCJE DO EDYCJI TEKSTU   //////                  

                             
function fontfamilyit(r) {
    const obj = canvas.getActiveObject();
    if (obj) {
        // Zapisz bieżące pozycje przed zmianą czcionki
        const oldLeft = obj.left;
        const oldTop = obj.top;

        // Ustaw nową czcionkę
        setStyle(obj, 'fontFamily', r);
        $(".fontfamily span").html(r);

        // Przywróć pozycję obiektu
        obj.set({ left: oldLeft, top: oldTop });
        obj.setCoords(); // Aktualizacja współrzędnych po zmianie pozycji

        // Rerender canvas
        canvas.renderAll();
    }
}


function fontsizeit(r){
    if (obj = canvas.getActiveObject()) {
        setStyle(obj,'fontFamily', r);
        canvas.renderAll();
    }
}

function zmienLineHeight(r){
    if (obj = canvas.getActiveObject()) {
        setStyle(obj, 'lineHeight', (r*0.001));
        canvas.renderAll();
    }
}

function zmiencien(r){        
var scale = (canvas.width/900);      
    if (obj = canvas.getActiveObject()) {  
        if(obj.shadow != null){
            obj.shadow = {offsetX:($(".rangetop").val()*scale),offsetY:$(".rangetop").val(),blur:($(".rangeblur").val()*scale),color:obj.shadow.color};
        }
        canvas.renderAll();
    }
}

function zmiencienblur(r){
    if (obj = canvas.getActiveObject()) { 
        if(obj.shadow != null){         
            obj.setShadow = {offsetX:$(".rangetop").val(),offsetY:$(".rangetop").val(),blur:r,color:obj.shadow.color};
        }
        canvas.renderAll();
    }
}
                              
function shadowitdark(){ 
    if (obj = canvas.getActiveObject()) {
        if(obj.shadow != null){
            obj.setShadow(null);
            //$(".pcien").hide();
            $('#texteditor div.minn').removeClass('act');
        }else{
        
            setStyle(obj, 'fill', '#fff');
            obj.setShadow =  $(".rangetop").val() + 'px ' + $(".rangetop").val() +'px '+ $(".rangeblur").val() +'px #333333';
            //$(".pcien").show();   
                  if($('#texteditor div.shadowd').hasClass('act')) $('#texteditor div.shadowd').removeClass('act');
                  else $('#texteditor div.shadowd').addClass('act');
        }
        canvas.renderAll();
    }
}                                 
function shadowitlight(){
    if (obj = canvas.getActiveObject()) {
        if(obj.shadow != null){
            obj.setShadow(null);
            //$(".pcien").hide(); 
            $('#texteditor div.minn').removeClass('act');
        }else{           
            setStyle(obj, 'fill', '#000');
            obj.setShadow = $(".rangetop").val() + 'px ' + $(".rangetop").val() +'px '+ $(".rangeblur").val() +'px #ffffff';
            //$(".pcien").show();
                  if($('#texteditor div.shadowl').hasClass('act')) $('#texteditor div.shadowl').removeClass('act');
                  else $('#texteditor div.shadowl').addClass('act');
        }
        canvas.renderAll();
    }
}

            
function removeit(){
      if (obj = canvas.getActiveObject()) {
        if(obj.id == 'zdjecie'){
             $('.aaa').hide();
        }
        //alert(obj.id);
        canvas.remove(obj);
        //$("#texteditor").hide();
        canvas.renderAll();
    }
} 
           
function rotate(r) {
if (obj = canvas.getActiveObject()) {
  let originX;
  let originY;



  switch (obj.angle+r) {
    case 0:
      originX = "left";
      originY = "top";
      break;

    case 90:
      originX = "left";
      originY = "bottom";
      break;

    case 180:
      originX = "right";
      originY = "bottom";
      break;

    case 270:
      originX = "right";
      originY = "top";
      break;

    case 360:
      originX = "left";
      originY = "top";
      break;
  }

  obj.set({
      angle:(obj.angle+r),
      originX,
      originY
    })
    .setCoords();

  canvas.renderAll();
}   
}
           
function boldit(){
    if (obj = canvas.getActiveObject()) {
        var isBold = getStyle(obj,'fontWeight') === 'bold';
        setStyle(obj,'fontWeight', isBold ? '' : 'bold');       
        if($('#texteditor div.bold').hasClass('act')) $('#texteditor div.bold').removeClass('act');
        else $('#texteditor div.bold').addClass('act');
        canvas.renderAll();
    }
        canvas.renderAll();
}                    
function italicit(){
    if (obj = canvas.getActiveObject()) {
        var isItalic = getStyle(obj, 'fontStyle') === 'italic';
        setStyle(obj, 'fontStyle', isItalic ? '' : 'italic');     
        if($('#texteditor div.italic').hasClass('act')) $('#texteditor div.italic').removeClass('act');
        else $('#texteditor div.italic').addClass('act');
        canvas.renderAll();
    }
        canvas.renderAll();
}                   
function underlineit(){
    if (obj = canvas.getActiveObject()) {
        var isUnderline = (getStyle(obj, 'textDecoration') || '').indexOf('underline') > -1;
        obj.textDecoration = isUnderline ? 'underline' : '';
        if($('#texteditor div.underline').hasClass('act')) $('#texteditor div.underline').removeClass('act');
        else $('#texteditor div.underline').addClass('act');
        canvas.renderAll();
    }
        canvas.renderAll();
}                      
function centerit(){
    if (obj = canvas.getActiveObject()) {
        setStyle(obj, 'textAlign', 'center');
        if($('#texteditor div.acenter').hasClass('act')) $('#texteditor div.acenter').removeClass('act');
        else $('#texteditor div.acenter').addClass('act');
        $('#texteditor div.aright').removeClass('act');
        $('#texteditor div.aleft').removeClass('act');   
        $('#texteditor div.ajustify').removeClass('act');
        canvas.renderAll();
    }
}                     
function leftit(){
    if (obj = canvas.getActiveObject()) {
        setStyle(obj, 'textAlign', 'left');       
        if($('#texteditor div.aleft').hasClass('act')) $('#texteditor div.aleft').removeClass('act');
        else $('#texteditor div.aleft').addClass('act');
        $('#texteditor div.acenter').removeClass('act');
        $('#texteditor div.aright').removeClass('act');
        $('#texteditor div.ajustify').removeClass('act');
        canvas.renderAll();
    }
}                              
function rightit(){
    if (obj = canvas.getActiveObject()) {
        setStyle(obj, 'textAlign', 'right');   
        if($('#texteditor div.aright').hasClass('act')) $('#texteditor div.aright').removeClass('act');
        else $('#texteditor div.aright').addClass('act');   
        $('#texteditor div.acenter').removeClass('act');
        $('#texteditor div.aleft').removeClass('act');      
        $('#texteditor div.ajustify').removeClass('act');
        canvas.renderAll();
    }
}                                
function justifyit(){
    if (obj = canvas.getActiveObject()) {
        setStyle(obj, 'textAlign', 'justify');   
        if($('#texteditor div.ajustify').hasClass('act')) $('#texteditor div.ajustify').removeClass('act');
        else $('#texteditor div.ajustify').addClass('act');   
        $('#texteditor div.acenter').removeClass('act');
        $('#texteditor div.aleft').removeClass('act'); 
        $('#texteditor div.aright').removeClass('act');
        canvas.renderAll();
    }
}                       
function colorit(){
    if (obj = canvas.getActiveObject()) {
        //alert(this.value);
        obj.set('fill', '#'+this.value);


    }
        canvas.renderAll();
}

function bringForward() {
    var activeObject = canvas.getActiveObject();
    if (activeObject) {
      canvas.bringForward(activeObject);
    }
        canvas.renderAll();
};

  function sendBackwards() {
    var activeObject = canvas.getActiveObject();
    if (activeObject) {
      canvas.sendBackwards(activeObject);
    }
  };
  
  function RotateRight() {
    var activeObject = canvas.getActiveObject();
    if (activeObject) {
        activeObject.setAngle(activeObject.getAngle()+90);
	      canvas.renderAll();
    }
  };

  function RotateLeft() {
    var activeObject = canvas.getActiveObject();
    if (activeObject) {
        activeObject.setAngle(activeObject.getAngle()-90);
	      canvas.renderAll();
    }
  };
    
function setStyle(object, styleName, value) {
  if (object.setSelectionStyles && object.isEditing) {
    var style = { };
    style[styleName] = value;
    object.setSelectionStyles(style);
  }
  else {
    object[styleName] = value;
  }
}
function getStyle(object, styleName) {
  return (object.getSelectionStyles && object.isEditing)
    ? object.getSelectionStyles()[styleName]
    : object[styleName];
}


/////EDYTOR TEKSTY --  KONIEC /////
                    
function dodaj(text, l, t, font, fontSize, color, textAlign) {
    $('.sidebar-content').removeClass('open');

    // Ustawienie pozycji i rozmiaru tekstu na płótnie
    const canvasWidth = canvas.width;
    const canvasHeight = canvas.height;
    const textLeft = (canvasWidth - (19 * fontSize)) / 6;
    const textTop = (canvasHeight - (2 * fontSize)) / 3 - 100;

    // Tworzenie nowego obiektu tekstu z podanymi parametrami
    const newText = new fabric.IText(text, {
        left: textLeft * 2,
        top: textTop * 2,
        fontSize: fontSize * 3,
        lineHeight: 0.8,
        textAlign: textAlign,
        fontFamily: font,
        fill: color,
        lockUniScaling: true,
        rotatingPointOffset: 25
    });

    // Dodawanie tekstu do płótna i ustawienie go jako aktywny obiekt
    canvas.add(newText);
    canvas.setActiveObject(newText);

    // Przejście bezpośrednio do edycji tekstu
    newText.enterEditing();
    canvas.renderAll();
}
             
function dodaj3(text,l,t,font,f,color,align){  
$('.sidebar-content').removeClass('open');   

                    text =  new fabric.IText(text, {left: l, top: t, id: 'text1',fontSize: f,fontWeight: 'normal', lineHeight:0.8,textAlign: align, fontFamily:font, lockUniScaling: true, rotatingPointOffset: 25});
                        text.fill = color;        
                    canvas.add(text).setActiveObject(text);
                    text.animate('top', '+=160', {
                      duration: 400,
                      onChange: canvas.renderAll.bind(canvas),
                      easing: fabric.util.ease.easeOutBounce,
                    });
text.selectAll();
text.enterEditing();  
                                   
}

function zmienKalendarz(urlik){

            var x;
            var y;
            var a;
            
            tmp2 = getObjectBySrc("/kalendarium/");
            if(tmp2){
            var res = tmp2.split("|");
                x = Math.round(res[0]);
                y = Math.round(res[1]);
                a = Math.round(res[2]);
                
            }
            
            if(urlik.search("kalendariumb") != '-1'){
                var kalendarzyk = 'kalendarzykb';
            }
            else if(urlik.search("kalendariumc") != '-1'){
                var kalendarzyk = 'kalendarzykc';
            }
            
            
            fabric.Object.prototype.transparentCorners = false;
                    var radius = 300; 
                    fabric.Image.fromURL(urlik.replace("mini", redlof), function(img) {
                      img.scale(0.7).set({
                        left: x,
                        top: y,
                        angle: a,
                        id: kalendarzyk,
                        lockScalingX: true,
                        lockScalingY: true
                      });
                      canvas.add(img).setActiveObject(img);  
                      
              });
}

                    
function dodaj2(text,l,t,font,f,color,align){                    
                    wierszyk =  new fabric.IText(text, {left: l*2, top: t*2, id: 'text1',fontSize: f*2, lineHeight:1,textAlign: align, fontFamily:font, lockUniScaling: true, rotatingPointOffset: 25});
                        wierszyk.fill = color;
                    canvas.add(wierszyk);              
}    
function dodajNaklejke(urlik,scale,x,y,idd){
$('.wzor').val(urlik.replace('/elementy/dodatki/','').replace('.png','')); ///ustawia url wzoru który jest obecnie edytowany
                          
            //$('.overwhite').show();      
                        NotRemoveObjectById('zdjecie');
                        //canvas.clear(); 
            try {
                        window['imp'+urlik.replace("_", "").replace("/elementy/dodatki/", "").replace(".jpg", "").replace(".png", "")](1);  
                }catch(err) {}   
            
            
            
            var imge = $('<img src="'+urlik+'"/>').load(function(){
               scale = canvas.height/this.height;     
            
                                      
            fabric.Object.prototype.transparentCorners = false;
                            
            fabric.Image.fromURL(urlik.replace("mini", redlof), function(img) {
              img.scale(scale).set({
                left: x,
                top: y,
                globalCompositeOperation: 'destination-over', 
                id: idd
              });                                   
                            
                  canvas.add(img).setActiveObject(img);                    
                    
                                                         
                  canvas.sendToBack(img);
                  canvas.item(0).selectable = false;     
            
            });
            
                
              
               
                   //$('.overwhite').delay(1500).hide();         
});     
              
               
                  
              canvas.renderAll();         
        $("#tabs ul li:nth-child(3)").addClass('active');     
                   $('.sidebar-content').removeClass('open');
                   $('close-area').hide();

                 
}        


function dodajNaklejkeNaklejki(urlik,scale,x,y,a){
                       
            //$('.overwhite').show();  
            //alert(canvas.width);
            
            fabric.Object.prototype.transparentCorners = false;
            var radius = 300;
                            
            fabric.Image.fromURL(urlik.replace("mini", redlof), function(img) {
            scale = ((canvas.width*0.3)/img.width);
              img.scale(scale).set({
                left: ((canvas.width-(img.width*scale))/2),
                top: ((canvas.height-(img.height*scale))/2),        
                id: a
              });
              canvas.add(img).setActiveObject(img);     
                 
                                                                                                       
                  canvas.renderAll();  
                   //$('.overwhite').delay(1500).hide(); 
                   $('.sidebar-content').removeClass('open');
                   $('close-area').hide();
}); 
                                                  
} 

function CountIloscWzorow(ksztalt){

if(ksztalt == 'kartkapion') ksztalt = 'pion';  
if(ksztalt == 'kartkapoziom') ksztalt = 'poziom';


$("select.tlakat > option").each(function() {
    if(this.value == 0){$(this).show();}                            
    else if($('div.tabs-3 li.rodzaj'+ksztalt+'.dirtla._kat'+this.value).length > 0 ){$(this).show();$('div.tabs-3 li.rodzaj'+ksztalt+'.dirtla._kat'+this.append(' ('+$('div.tabs-3 li.rodzaj'+ksztalt+'.dirtla._kat'+this.value).length+')'))}
    else {$(this).hide();}
});                    

}      
function CountIloscWzorow2(ksztalt){

$("select.tlakat > option").each(function() {                      
    $(this).show();$('div.tabs-3 li.rodzaj'+ksztalt+'.dirtla._kat'+this.append(' ('+$('div.tabs-3 li.rodzaj'+ksztalt+'.dirtla._kat'+this.value).length+')'));
});                    

}

function zmienKsztalt(ksztalt,admin){
                      if(admin != 1) CountIloscWzorow(ksztalt);
                      else CountIloscWzorow2(ksztalt);
        if(ksztalt == 'imiennik'){
        canvas.clear(); 
            $('.ksztalt').val('imiennik');
            $('.wrapper').removeClass('kwadrat'); 
            $('.wrapper').removeClass('zserce');  
            $('.wrapper').removeClass('pion');   
            $('.wrapper').removeClass('poziom');  
            $('.wrapper').removeClass('kolo');   
            $('.wrapper').removeClass('serce'); 
            $('.wrapper').removeClass('kalendarz');
            $('.wrapper').removeClass('serce');
            $('.wrapper').addClass('imiennik');
            $('li.dirtla').removeClass('pokazaneklientowi');            
            $('li.dirtla').hide();
            $('.rodzajroczek').show();   
            $('.tabs-3 li').addClass('niepozakuj');   
            $('.tabs-3 li.rodzajimiennik').addClass('pokazaneklientowi');   
            $('.tabs-3 li.rodzajimiennik').removeClass('niepozakuj');
            canvas.setWidth(1181);
            canvas.setHeight(402);
            setTimeout(function(){
            try { dodajNaklejke3('img/mini/makiety/serce/___puste.png',1,0,0,'imiennik');}
            catch(err) {
            }});
        }else if(ksztalt == 'spioszki'){
        canvas.clear(); 
            $('.ksztalt').val('spioszki');
            $('.wrapper').removeClass('kwadrat'); 
            $('.wrapper').removeClass('zserce');  
            $('.wrapper').removeClass('pion');   
            $('.wrapper').removeClass('poziom');  
            $('.wrapper').removeClass('kolo');   
            $('.wrapper').removeClass('serce'); 
            $('.wrapper').removeClass('kalendarz');
            $('.wrapper').removeClass('serce');
            $('.wrapper').addClass('spioszki');
            $('li.dirtla').removeClass('pokazaneklientowi');            
            $('li.dirtla').hide();
            $('.rodzajspioszki').show();   
            $('.tabs-3 li').addClass('niepozakuj');   
            $('.tabs-3 li.rodzajspioszki').addClass('pokazaneklientowi');   
            $('.tabs-3 li.rodzajspioszki').removeClass('niepozakuj');
            canvas.setWidth(838);
            canvas.setHeight(1158);
            setTimeout(function(){
            try { dodajNaklejke3('img/mini/makiety/serce/___puste.png',1,0,0,'spioszki');}
            catch(err) {
            }});
        }else if(ksztalt == 'roczek'){
        canvas.clear(); 
            $('.ksztalt').val('roczek');
            $('.wrapper').removeClass('kwadrat'); 
            $('.wrapper').removeClass('zserce');  
            $('.wrapper').removeClass('pion');   
            $('.wrapper').removeClass('poziom');  
            $('.wrapper').removeClass('kolo');   
            $('.wrapper').removeClass('serce'); 
            $('.wrapper').removeClass('kalendarz');
            $('.wrapper').removeClass('serce');
            $('.wrapper').addClass('roczek');
            $('li.dirtla').removeClass('pokazaneklientowi');            
            $('li.dirtla').hide();
            $('.rodzajroczek').show();   
            $('.tabs-3 li').addClass('niepozakuj');   
            $('.tabs-3 li.rodzajroczek').addClass('pokazaneklientowi');   
            $('.tabs-3 li.rodzajroczek').removeClass('niepozakuj');
            canvas.setWidth(827);
            canvas.setHeight(1157);
            setTimeout(function(){
            try { dodajNaklejke3('img/mini/makiety/serce/___puste.png',1,0,0,'roczek');}
            catch(err) {
            }});
        }else if(ksztalt == 'polaroid'){
        canvas.clear(); 
            $('.ksztalt').val('polaroid');
            $('.wrapper').removeClass('kwadrat'); 
            $('.wrapper').removeClass('zserce');  
            $('.wrapper').removeClass('pion');   
            $('.wrapper').removeClass('poziom');  
            $('.wrapper').removeClass('kolo');   
            $('.wrapper').removeClass('serce'); 
            $('.wrapper').removeClass('kalendarz');
            $('.wrapper').removeClass('serce');
            $('.wrapper').removeClass('roczek');
            $('.wrapper').addClass('polaroid');
            $('li.dirtla').removeClass('pokazaneklientowi');            
            $('li.dirtla').hide();
            $('.rodzajpolaroid').show();   
            $('.tabs-3 li').addClass('niepozakuj');   
            $('.tabs-3 li.rodzajpolaroid').addClass('pokazaneklientowi');   
            $('.tabs-3 li.rodzajpolaroid').removeClass('niepozakuj');
            canvas.setWidth(886);
            canvas.setHeight(1182);
            setTimeout(function(){
            try { dodajNaklejke3('img/mini/makiety/serce/___puste.png',1,0,0,'polaroid');}
            catch(err) {
            }});
        }else if(ksztalt == 'butelka'){
        canvas.clear(); 
            $('.ksztalt').val('butelka');
            $('.wrapper').removeClass('kwadrat'); 
            $('.wrapper').removeClass('zserce');  
            $('.wrapper').removeClass('pion');   
            $('.wrapper').removeClass('poziom');  
            $('.wrapper').removeClass('kolo');   
            $('.wrapper').removeClass('serce'); 
            $('.wrapper').removeClass('kalendarz');
            $('.wrapper').removeClass('serce');
            $('.wrapper').removeClass('roczek');
            $('.wrapper').addClass('butelka');
            $('li.dirtla').removeClass('pokazaneklientowi');            
            $('li.dirtla').hide();
            $('.rodzajbutelka').show();   
            $('.tabs-3 li').addClass('niepozakuj');   
            $('.tabs-3 li.rodzajbutelka').addClass('pokazaneklientowi');   
            $('.tabs-3 li.rodzajbutelka').removeClass('niepozakuj');
            canvas.setWidth(626);
            canvas.setHeight(1181);
            setTimeout(function(){
            try { dodajNaklejke3('img/mini/makiety/serce/___puste.png',1,0,0,'butelka');}
            catch(err) {
            }});
        }else if(ksztalt == 'mis'){
        canvas.clear(); 
            $('.ksztalt').val('mis');
            $('.wrapper').removeClass('kwadrat'); 
            $('.wrapper').removeClass('zserce');  
            $('.wrapper').removeClass('pion');   
            $('.wrapper').removeClass('poziom');  
            $('.wrapper').removeClass('kolo');   
            $('.wrapper').removeClass('serce'); 
            $('.wrapper').removeClass('kalendarz');
            $('.wrapper').removeClass('serce');
            $('.wrapper').removeClass('roczek');
            $('.wrapper').removeClass('polaroid');
            $('.wrapper').addClass('mis');
            $('li.dirtla').removeClass('pokazaneklientowi');            
            $('li.dirtla').hide();
            $('.rodzajmis').show();   
            $('.tabs-3 li').addClass('niepozakuj');   
            $('.tabs-3 li.rodzajmis').addClass('pokazaneklientowi');   
            $('.tabs-3 li.rodzajmis').removeClass('niepozakuj');
            canvas.setWidth(768);
            canvas.setHeight(1181);
            setTimeout(function(){
            try { dodajNaklejke3('img/mini/makiety/serce/___puste.png',1,0,0,'mis');}
            catch(err) {
            }});
        }else if(ksztalt == 'serce'){
        canvas.clear(); 
            $('.ksztalt').val('serce');
            $('.wrapper').removeClass('kwadrat'); 
            $('.wrapper').removeClass('zserce');  
            $('.wrapper').removeClass('pion');   
            $('.wrapper').removeClass('poziom');  
            $('.wrapper').removeClass('kolo');   
            $('.wrapper').removeClass('serce'); 
            $('.wrapper').removeClass('kalendarz');
            $('.wrapper').addClass('serce');
            $('li.dirtla').removeClass('pokazaneklientowi');            
            $('li.dirtla').hide();
            $('.rodzajserce').show();   
            $('.tabs-3 li').addClass('niepozakuj');   
            $('.tabs-3 li.rodzajserce').addClass('pokazaneklientowi');   
            $('.tabs-3 li.rodzajserce').removeClass('niepozakuj');
            canvas.setWidth(976);
            canvas.setHeight(897);
            setTimeout(function(){
            try { dodajNaklejke3('img/mini/makiety/serce/___puste.png',1,0,0,'serce');}
            catch(err) {
            }});
        }else if(ksztalt == 'kwadrat'){
        canvas.clear(); 
            $('.ksztalt').val('kwadrat');
            $('.wrapper').removeClass('kwadrat'); 
            $('.wrapper').removeClass('zserce');  
            $('.wrapper').removeClass('pion');   
            $('.wrapper').removeClass('poziom');  
            $('.wrapper').removeClass('kolo');   
            $('.wrapper').removeClass('serce');    
            $('.wrapper').removeClass('kalendarz');
            $('.wrapper').addClass('kwadrat'); 
            $('li.dirtla').removeClass('pokazaneklientowi');               
            $('li.dirtla').hide();
            $('.rodzajkwadrat').show();
            $('.tabs-3 li').addClass('niepozakuj');
            $('.tabs-3 li.rodzajkwadrat').removeClass('niepozakuj'); 
            $('.tabs-3 li.rodzajkwadrat').addClass('pokazaneklientowi');
            canvas.setWidth(897);
            canvas.setHeight(897);
            setTimeout(function(){
            try {dodajNaklejke3('img/mini/makiety/kwadrat/___puste.png',1,0,0,'kwadrat');}
            catch(err) {
            }});
        }else if(ksztalt == 'zkwadrat'){
        canvas.clear(); 
            $('.ksztalt').val('zkwadrat');
            $('.wrapper').removeClass('kwadrat'); 
            $('.wrapper').removeClass('zserce');  
            $('.wrapper').removeClass('pion');   
            $('.wrapper').removeClass('poziom');  
            $('.wrapper').removeClass('kolo');     
            $('.wrapper').removeClass('kalendarz');
            $('.wrapper').removeClass('serce');
            $('.wrapper').addClass('zkwadrat');
            $('li.dirtla').removeClass('pokazaneklientowi');              
            $('li.dirtla').hide();
            $('.rodzajzkwadrat').show();
            $('.tabs-3 li').addClass('niepozakuj');
            $('.tabs-3 li.rodzajzkwadrat').removeClass('niepozakuj');   
            $('.tabs-3 li.rodzajzkwadrat').addClass('pokazaneklientowi');
            canvas.setWidth(1272);
            canvas.setHeight(1272);
            setTimeout(function(){
            try {dodajNaklejke3('img/mini/makiety/kwadrat/___puste.png',1,0,0,'zkwadrat');}
            catch(err) {
            }});
        }else if(ksztalt == 'kolo'){
            canvas.clear(); 
            $('.ksztalt').val('kolo');
            $('.wrapper').removeClass('kwadrat');   
            $('.wrapper').removeClass('zserce');  
            $('.wrapper').removeClass('pion');   
            $('.wrapper').removeClass('poziom'); 
            $('.wrapper').removeClass('kolo');   
            $('.wrapper').removeClass('serce'); 
            $('.wrapper').removeClass('kalendarz');
            $('.wrapper').addClass('kolo');
            $('li.dirtla').removeClass('pokazaneklientowi');           
            $('li.dirtla').hide();
            $('.rodzajkolo').show();
            $('.tabs-3 li').addClass('niepozakuj');
            $('.tabs-3 li.rodzajkolo').removeClass('niepozakuj');    
            $('.tabs-3 li.rodzajkolo').addClass('pokazaneklientowi');
            canvas.setWidth(897);
            canvas.setHeight(897);
            setTimeout(function(){
            try {dodajNaklejke3('img/mini/makiety/kolo/___puste.png',1,0,0,'kolo');}
            catch(err) {
            }});
        }else if(ksztalt == 'bombka'){
            canvas.clear(); 
            $('.ksztalt').val('bombka');
            $('.wrapper').removeClass('kwadrat'); 
            $('.wrapper').removeClass('zserce');    
            $('.wrapper').removeClass('pion');   
            $('.wrapper').removeClass('poziom'); 
            $('.wrapper').removeClass('kolo');   
            $('.wrapper').removeClass('serce'); 
            $('.wrapper').removeClass('kalendarz');  
            $('.wrapper').removeClass('kolo');
            $('.wrapper').addClass('bombka'); 
            $('li.dirtla').removeClass('pokazaneklientowi');   
            $('li.dirtla').hide();
            $('.rodzajbombka').show();
            $('.tabs-3 li').addClass('niepozakuj');
            $('.tabs-3 li.rodzajbombka').removeClass('niepozakuj'); 
            $('.tabs-3 li.rodzajbombka').addClass('pokazaneklientowi');
            canvas.setWidth(776);
            canvas.setHeight(918);
            setTimeout(function(){
            try {dodajNaklejke3('img/mini/makiety/kolo/___puste.png',1,0,0,'bombka');}
            catch(err) {
            }});
        }else if(ksztalt == 'zkolo'){
            canvas.clear(); 
            $('.ksztalt').val('zkolo');
            $('.wrapper').removeClass('kwadrat'); 
            $('.wrapper').removeClass('zserce');   
            $('.wrapper').removeClass('pion');   
            $('.wrapper').removeClass('poziom'); 
            $('.wrapper').removeClass('kolo');   
            $('.wrapper').removeClass('serce');   
            $('.wrapper').removeClass('kalendarz');
            $('.wrapper').addClass('zkolo');  
            $('li.dirtla').removeClass('pokazaneklientowi');    
            $('li.dirtla').hide();      
            $('.rodzajzkolo').show();
            $('.tabs-3 li').addClass('niepozakuj');
            $('.tabs-3 li.rodzajzkolo').removeClass('niepozakuj');  
            $('.tabs-3 li.rodzajzkolo').addClass('pokazaneklientowi');
            canvas.setWidth(897);
            canvas.setHeight(897);
            setTimeout(function(){
            try {dodajNaklejke3('img/mini/makiety/kolo/___puste.png',1,0,0,'zkolo');}
            catch(err) {
            }});
        }else if(ksztalt == 'zserce'){
            canvas.clear(); 
            $('.ksztalt').val('zserce');
            $('.wrapper').removeClass('kwadrat'); 
            $('.wrapper').removeClass('zkolo');  
            $('.wrapper').removeClass('pion');   
            $('.wrapper').removeClass('poziom'); 
            $('.wrapper').removeClass('kolo');   
            $('.wrapper').removeClass('serce');   
            $('.wrapper').removeClass('kalendarz');
            $('.wrapper').addClass('zserce');  
            $('li.dirtla').removeClass('pokazaneklientowi');    
            $('li.dirtla').hide();      
            $('.rodzajzkolo').show();
            $('.tabs-3 li').addClass('niepozakuj');
            $('.tabs-3 li.rodzajzserce').removeClass('niepozakuj');  
            $('.tabs-3 li.rodzajzserce').addClass('pokazaneklientowi');
            canvas.setWidth(976);
            canvas.setHeight(897);
            setTimeout(function(){
            try {dodajNaklejke3('img/mini/makiety/serce/___puste.png',1,0,0,'zserce');}
            catch(err) {
            }});
        }else if(ksztalt == 'pion'){
            canvas.clear(); 
            $('.ksztalt').val('pion');
            $('.wrapper').removeClass('kwadrat');  
            $('.wrapper').removeClass('zserce');  
            $('.wrapper').removeClass('pion');   
            $('.wrapper').removeClass('poziom'); 
            $('.wrapper').removeClass('kolo');   
            $('.wrapper').removeClass('serce');
            $('.wrapper').removeClass('kalendarz');
            $('.wrapper').addClass('pion'); 
            $('li.dirtla').removeClass('pokazaneklientowi');    
            $('li.dirtla').hide();
            $('.rodzajpion').show();
            $('.tabs-3 li').addClass('niepozakuj');
            $('.tabs-3 li.rodzajpion').removeClass('niepozakuj');  
            $('.tabs-3 li.rodzajpion').addClass('pokazaneklientowi');
            canvas.setWidth(1102);
            canvas.setHeight(1654);
            setTimeout(function(){
            try {dodajNaklejke3('img/mini/makiety/kolo/___puste.png',1,0,0,'p');}
            catch(err) {
            }});
        } else if(ksztalt == 'poziom'){
            canvas.clear(); 
            $('.ksztalt').val('poziom');
            $('.wrapper').removeClass('kwadrat');  
            $('.wrapper').removeClass('pion');   
            $('.wrapper').removeClass('zserce');  
            $('.wrapper').removeClass('poziom'); 
            $('.wrapper').removeClass('kolo');   
            $('.wrapper').removeClass('serce');
            $('.wrapper').addClass('poziom');   
            $('.wrapper').removeClass('kalendarz');  
            $('li.dirtla').removeClass('pokazaneklientowi');   
            $('li.dirtla').hide();
            $('.rodzajpoziom').show();
            $('.tabs-3 li').addClass('niepozakuj');
            $('.tabs-3 li.rodzajpoziom').removeClass('niepozakuj');   
            $('.tabs-3 li.rodzajpoziom').addClass('pokazaneklientowi');
            canvas.setWidth(1654);
            canvas.setHeight(1102);
            setTimeout(function(){
            try {dodajNaklejke3('img/mini/makiety/kolo/___puste.png',1,0,0,'z');}
            catch(err) {
            }});
        }else if(ksztalt == 'kartkapion'){
            canvas.clear(); 
            $('.ksztalt').val('kartkapion');
            $('.wrapper').removeClass('kwadrat');  
            $('.wrapper').removeClass('zserce');  
            $('.wrapper').removeClass('pion');   
            $('.wrapper').removeClass('poziom'); 
            $('.wrapper').removeClass('kolo');   
            $('.wrapper').removeClass('serce');
            $('.wrapper').removeClass('kalendarz');
            $('.wrapper').addClass('pion');      
            $('.wrapper').addClass('kartkapion');
            $('li.dirtla').removeClass('pokazaneklientowi');      
            $('li.dirtla').hide();
            $('.rodzajpion').show();
            $('.tabs-3 li').addClass('niepozakuj');
            $('.tabs-3 li.rodzajpion').removeClass('niepozakuj');  
            $('.tabs-3 li.rodzajpion').addClass('pokazaneklientowi');
            canvas.setWidth(1102);
            canvas.setHeight(1654);
            setTimeout(function(){
            try {dodajNaklejke3('img/mini/makiety/kolo/___puste.png',1,0,0,'p');}
            catch(err) {
            }});
        } else if(ksztalt == 'kartkapoziom'){
            canvas.clear(); 
            $('.ksztalt').val('kartkapoziom');
            $('.wrapper').removeClass('zserce');  
            $('.wrapper').removeClass('kwadrat');  
            $('.wrapper').removeClass('pion');   
            $('.wrapper').removeClass('poziom'); 
            $('.wrapper').removeClass('kolo');   
            $('.wrapper').removeClass('serce');
            $('.wrapper').addClass('poziom');       
            $('.wrapper').addClass('kartkapoziom'); 
            $('.wrapper').removeClass('kalendarz'); 
            $('li.dirtla').removeClass('pokazaneklientowi');   
            $('li.dirtla').hide();
            $('.rodzajpoziom').show();
            $('.tabs-3 li').addClass('niepozakuj');
            $('.tabs-3 li.rodzajpoziom').removeClass('niepozakuj');  
            $('.tabs-3 li.rodzajpoziom').addClass('pokazaneklientowi');
            canvas.setWidth(1654);
            canvas.setHeight(1102);
            setTimeout(function(){
            try {dodajNaklejke3('img/mini/makiety/kolo/___puste.png',1,0,0,'z');}
            catch(err) {
            }});
        } else if(ksztalt == 'etykietaserce'){
            canvas.clear(); 
            $('.ksztalt').val('etykietaserce');
            $('.wrapper').removeClass('zserce');  
            $('.wrapper').removeClass('kwadrat');  
            $('.wrapper').removeClass('pion');   
            $('.wrapper').removeClass('poziom'); 
            $('.wrapper').removeClass('kolo');   
            $('.wrapper').removeClass('serce');  
            $('.wrapper').removeClass('etykietaserce');  
            $('.wrapper').removeClass('kalendarz');
            $('.wrapper').addClass('etykietaserce'); 
            $('li.dirtla').removeClass('pokazaneklientowi');   
            $('li.dirtla').hide();
            $('.rodzajetykietaserce').show();
            $('.tabs-3 li').addClass('niepozakuj');
            $('.tabs-3 li.rodzajetykietaserce').removeClass('niepozakuj'); 
            $('.tabs-3 li.rodzajetykietaserce').addClass('pokazaneklientowi');
            canvas.setWidth(984);
            canvas.setHeight(1411);
            setTimeout(function(){
            try {dodajNaklejke3('img/etykietaserce_pusta.png',1,0,0,'etykietaserce');}
            catch(err) {
            }});
        }else if(ksztalt == 'kalendarz'){
            canvas.clear(); 
            $('.ksztalt').val('kalendarz');
            $('.wrapper').removeClass('kwadrat');  
            $('.wrapper').removeClass('zserce');  
            $('.wrapper').removeClass('pion');   
            $('.wrapper').removeClass('poziom'); 
            $('.wrapper').removeClass('kolo');   
            $('.wrapper').removeClass('serce');
            $('.wrapper').addClass('kalendarz'); 
            $('li.dirtla').removeClass('pokazaneklientowi');   
            $('li.dirtla').hide();
            $('.rodzajkalendarz').show();
            $('.tabs-3 li').addClass('niepozakuj');
            $('.tabs-3 li.rodzajkalendarz').removeClass('niepozakuj');      
            $('.tabs-3 li.rodzajkalendarz').addClass('pokazaneklientowi');
            canvas.setWidth(1643);
            canvas.setHeight(2354);
            setTimeout(function(){
            try {dodajNaklejke3('img/mini/makiety/kolo/___puste.png',1,0,0,'kalendarz');}
            catch(err) {
            }});
        }else if(ksztalt == 'stopka'){
            canvas.clear(); 
            $('.ksztalt').val('stopka');
            $('.wrapper').removeClass('kwadrat');  
            $('.wrapper').removeClass('zserce');  
            $('.wrapper').removeClass('pion');   
            $('.wrapper').removeClass('poziom'); 
            $('.wrapper').removeClass('kolo');   
            $('.wrapper').removeClass('serce');  
            $('.wrapper').removeClass('kalendarz');
            $('.wrapper').addClass('stopka');   
            $('li.dirtla').removeClass('pokazaneklientowi');   
            $('li.dirtla').hide();
            $('.rodzajstopka').show();
            $('.tabs-3 li').addClass('niepozakuj');
            $('.tabs-3 li.rodzajstopka').removeClass('niepozakuj');  
            $('.tabs-3 li.rodzajstopka').addClass('pokazaneklientowi');
            canvas.setWidth(786);
            canvas.setHeight(1213);
            setTimeout(function(){
            try {dodajNaklejke3('img/mini/makiety/kolo/___puste.png',1,0,0,'stopka');}
            catch(err) {
            }});
        }

};

function dodajNaklejke3(urlik,scale,x,y,a){

            var imge = $('<img src="'+urlik+'"/>').load(function(){
                      var ww = this.width;
                      var hh = this.height;
                      var center = canvas.getCenter();
                  canvas.setOverlayImage('/img/'+a+'.png',
                      canvas.renderAll.bind(canvas), {
                          scaleX:1,
                          scaleY:1,
                          top: center.top,
                          left: center.left,
                          originX: 'center',
                          originY: 'center'
                  });                                                                                              
                  canvas.renderAll();  
                                                                    
            }); 
        
              $("#bottomcol").animate({
                height: '150px'
              },500);
              $("#bottomcol .material-icons").html('keyboard_arrow_up');
            
            fabric.Object.prototype.transparentCorners = false;
            var radius = 300;
                            
            fabric.Image.fromURL(urlik.replace("mini", redlof), function(img) {
              img.scale(scale).set({
                left: x,
                top: y,        
                globalCompositeOperation: 'source-over',
                id: 'ramka'
              });                                
              //canvas.add(img).setActiveObject(img);       
              //canvas.sendToBack(img);
              //canvas.item(0).selectable = false;
                 
                            
}); 

        getObjectById('ramka');
                                                   
} 


function zciemnij(val){
                //alert('tak');
                //$('.overwhite').fadeTo(val, 0.9);
                //$('.overwhite').delay(val+50).hide(0);
                //alert('tak');
}


function pobierzwgranezdjecia(){}

function dodajNaklejke2(urlik,scale,x,y){    
         removeObjectById('zdjecie');       
              var imge = $('<img src="'+urlik+'"/>').load(function(){
                  var ww = this.width;
                              fabric.Object.prototype.transparentCorners = false;
                              
                                     

            UstawObraz(urlik);    
            
              });
   
              canvas.renderAll();
       pobierzwgranezdjecia();   
       $('#tabs li').removeClass('active');
       $('#content1>div').removeClass('active');
       $('#content1>div').hide();
       $('.tabs-4').addClass('active');
       $('.tabs-4').show(); 
        
}
     
function Tlo(url,w,c){          

fabric.Image.fromURL(olt+url.replace("tloetykiety", ''), function(img) {
              img.scale(w/c);
              canvas.add(img);  
              canvas.sendToBack(img);
              canvas.item(0).selectable = false;   
                    
});                                  
              canvas.renderAll();   
  
}     
  
                                   
function Zapisz() {
    SprawdzText();
    canvas.setOverlayImage('', canvas.renderAll.bind(canvas));                                                                                                
    canvas.renderAll();  
    //var asdf = canvas.toDatalessJSON();       
    //var json_data = JSON.stringify(asdf);
    //canvas.loadFromJSON(json_data,canvas.renderAll.bind(canvas));    
}



// Przykładowe użycie funkcji

    document.addEventListener('keyup', ({ keyCode, ctrlKey } = event) => {
        
      // Check Ctrl key is pressed.
      if (!ctrlKey) {
        return
      }

      // Check pressed button is Z - Ctrl+Z.
      if (keyCode === 90) {
        canvas.undo()
      }

      // Check pressed button is Y - Ctrl+Y.
      if (keyCode === 89) {
        canvas.redo()
      }
    })



function dodajTekstZFormatowaniem(text, left, top, fontFamily, fontSize, lineHeight, textColor) {
    // Podziel tekst na części przed i po znaku „”
    const parts = text.split('”');
    const firstPart = parts[0] + '”';
    const secondPart = parts[1];

    // Tworzenie pierwszego obiektu tekstowego dla tekstu przed znakiem „”
    var firstTextObject = new fabric.Textbox(firstPart, {
        left: left,
        top: top,
        fontFamily: fontFamily,
        fontSize: fontSize,
        lineHeight: lineHeight,
        fill: textColor,
        width: 300,
        textAlign: 'left',
        editable: false
    });

    // Tworzenie drugiego obiektu tekstowego dla tekstu po znaku „”, wycentrowanego
    var secondTextObject = new fabric.Textbox(secondPart, {
        left: left,
        top: top + firstTextObject.height, // Umieszczenie tego tuż pod pierwszym obiektem
        fontFamily: fontFamily,
        fontSize: fontSize,
        lineHeight: lineHeight,
        fill: textColor,
        width: 300,
        textAlign: 'center',
        editable: false
    });

    // Dodawanie obiektów do canvas
    canvas.add(firstTextObject);
    canvas.add(secondTextObject);
    canvas.renderAll();
}