// JavaScript Document var canvas = new fabric.Canvas('shirtcanvas'); var canvast = new fabric.Canvas('trousercanvas'); var cans = $('#shirtcanvas').parent('.canvas-container'); var cant = $('#trousercanvas').parent('.canvas-container'); cant.css('display','none'); document.getElementById('backlogosb').style.display="none"; $('#showFront').click(function() { cans.css('display','block'); cant.css('display','none'); canvas.calcOffset(); canvast.calcOffset(); $('#showFront').addClass('active'); $('#showBack').removeClass('active'); //updateControls(); document.getElementById('frontlogosb').style.display="block"; document.getElementById('backlogosb').style.display="none"; }); $('#showBack').click(function() { cans.css('display','none'); cant.css('display','block'); canvas.calcOffset(); canvast.calcOffset(); $('#showFront').removeClass('active'); $('#showBack').addClass('active'); //updateControls(); document.getElementById('frontlogosb').style.display="none"; document.getElementById('backlogosb').style.display="block"; }); $('html').keyup(function(e){ if(e.which == 46) { if(cans.css('display')=="block") { var obd = canvas.getActiveObject(); canvas.remove(obd); } else if(cant.css('display')=="block") { var obd = canvast.getActiveObject(); canvast.remove(obd); } } }); function loadBaseShirts() { color1 = new fabric.Path('M600 0l-50 0 0 9.17 50 0 0 -9.17zm-51.15 10.61l47.96 0 0 580.66 -544.3 0 0 -3.35 -47.18 0 0 -581.04 543.52 0 0 3.73zm-498.85 580.22l-50 0 0 9.17 50 0 0 -9.17z');color2 = new fabric.Path('M65.06 51.93c9.39,-3.26 18.67,-6.16 27.89,-8.77l0.16 -2.77c-9.47,2.65 -18.96,5.57 -28.45,8.87l1.07 1.43 -0.67 1.24zm464.83 209.3l3.42 -0.74c3.87,19.75 7.07,39.69 9.79,59.76 3.94,30.15 7.21,60.42 9.89,90.78l4.46 50.9 5.9 69.02 -1.64 17.5 -7.75 -86.56 -4.52 -50.55c-2.72,-30.28 -6.01,-60.57 -9.88,-90.86 -2.83,-19.95 -6,-39.72 -9.67,-59.25zm-107.17 -24.36c0,0 0.85,-0.51 1.85,-0.39 1,0.12 1.52,0.24 2.37,0.37 0.86,0.12 3.88,0.44 4.32,0.63 0.44,0.2 3.81,-0.05 4.89,0.03 1.07,0.07 6.88,-0.45 8.27,-0.35 1.39,0.1 9.26,0.34 11.43,0.15 2.17,-0.2 7.13,-0.73 8.13,-0.76 1,-0.02 2.32,0.1 2.32,0.1l-0.59 3.2c0.51,2.12 0.6,4.23 0.13,6.35 0.68,3.51 0.63,7.03 0.22,10.54 0.33,1.93 0.32,4.13 0.07,6.52l0.35 2.99 1.52 -0.04c4.43,-0.58 11.29,-0.11 12.95,-0.49 1.32,-0.8 2.88,-0.02 4.2,-0.53 4.9,0.22 9.76,0.12 14.51,-0.76 5.8,-0.57 11.38,-0.97 17.39,-1.72l4.16 -0.45 6.52 39.34c3.84,27.84 6.94,55.82 9.73,83.87 2.97,30.09 5.71,60.22 8.11,90.37 2.25,27.84 4.7,55.2 7.27,82.27 -14.19,4.13 -29.23,5.3 -44.89,4.94 -15.63,-0.36 -28.5,-1.51 -35.8,-5.22 -4.39,-2.22 -7.55,-5.79 -9.85,-10.3l-16.46 -26.04 -16.85 25.9c-7.03,12.18 -14.02,16.88 -27.94,16.93 -12.9,0.03 -25.33,-0.66 -37.15,-2.3 -7.05,-0.89 -13.69,-1.97 -19.49,-3.44l2.24 -72.37c1.07,-28.03 2.39,-56.14 4.5,-84.49 1.57,-25.22 3.81,-50.44 6.52,-75.66 2.54,-20.94 5.48,-42.08 9.27,-63.63 2.24,0.65 3.77,0.51 5.66,0.77 1.98,0.27 3.51,0.62 5.94,0.81 2.89,0.23 5.49,0.12 8.5,0.35 3.45,0.43 8.85,1.38 14.12,1.49 5.63,0.05 9.97,1.31 16.18,0.51 1.81,-0.06 3.09,0.65 4.67,0.37l0.3 0 0.46 -3.05c0,0 -0.12,-4.17 0.05,-6.15 0.17,-1.97 -0.22,-3.95 -0.22,-4.39 0,-0.44 -0.03,-4.37 0.07,-5.18 0.1,-0.8 -0.1,-2.59 -0.19,-3.32 -0.1,-0.73 0.12,-3.61 0.17,-4.32 0.05,-0.71 0.07,-3.45 0.07,-3.45zm-67.63 23.73l3.29 0.82c-3.01,16.63 -5.62,33.99 -8.02,51.75 -3.69,29.37 -6.35,59.21 -8.14,89.45 -1.85,30.21 -3.18,60.37 -4.16,90.49l-1.73 63.71 -2.96 -0.66 1.59 -64.03c0.76,-29.76 1.86,-59.69 4,-90.14 1.58,-29.96 4.15,-59.69 7.98,-89.13 2.45,-18.58 5.09,-36.29 8.15,-52.26zm5.76 1.28l3.3 0.36c-2.58,14.56 -4.82,29.55 -6.81,44.89 -3.04,24.02 -5.61,47.99 -7.47,71.89 -1.54,21.21 -2.87,42.36 -3.96,63.43 -1.25,24.07 -2.12,47.57 -2.85,70.85 -0.51,15.36 -0.94,30.22 -1.32,44.73l-3.25 -0.72c0.18,-13.69 0.65,-28.57 1.29,-44.16 0.67,-23.62 1.5,-47.26 2.69,-70.95 0.89,-20.93 2.19,-42.06 3.86,-63.38 1.81,-23.88 4.31,-47.9 7.42,-72.05 2.05,-14.96 4.28,-29.93 7.1,-44.89zm195.04 295.45l3.87 -1.09 -7.62 -84.1 -7.26 -81.56c-2.82,-27.52 -5.98,-55.16 -9.84,-83.09 -2.22,-15.31 -4.64,-30.62 -7.7,-45.92l-3.39 0.39c2.88,15.48 5.29,30.82 7.44,46.09 3.67,27.55 6.86,55.22 9.7,82.98l7.31 81.4 7.49 84.9zm-278.09 -264.72l-3.26 47.67 0.06 49.48c-0.5,16.05 0.31,32.03 0.46,48.05 0.92,17.91 1.99,35.75 4.03,53.14l7.61 -37.5 0.62 -165.31 -1.75 -119.71 -4.55 30.56c-0.85,0.5 -1.67,0.84 -2.48,0.92l1.02 10.61 -1.5 39.07 -0.26 43.02zm-4.34 27l1.86 -28.17 -1.21 -37.26c0.04,-6.7 0.23,-14.07 1.08,-22.33 0.64,-6.23 0.27,-12.01 0.75,-18.94l0.52 -13.49c-0.89,-1.09 -1.19,-3.64 -1.3,-6.66 -0.49,-8.49 -0.65,-16.15 -2.85,-25.74l0.48 26.38c0.3,16.52 0.31,32.89 -0.22,49.58l-1.54 48.02 -2.11 55.47c-0.51,13.24 -0.8,26.06 -0.98,37.99 -0.23,15.27 -0.19,30.15 0.17,44.37 0.26,10.46 1.22,25.35 1.83,38.03 0.69,10.1 1.57,19.48 2.77,27.59l3.99 1.66 -0.14 -4.69c-1.58,-5.74 -1.85,-17.01 -2.77,-25.52l-1.89 -35.15 -0.13 -37.24 1.69 -73.9zm-233.28 -14.54l1.95 69.69c0.3,23.49 -0.13,46.15 -1.14,68.17 -0.85,16.63 -2.31,31.64 -4.03,45.93l-1.43 7.74 4.07 -0.83c1.5,-8.47 2.28,-17.07 3.17,-25.72 1.97,-20.03 2.89,-40.7 3.13,-61.78 0.27,-30.18 -0.38,-60.13 -1.69,-90.53 -1,-28.68 -2.39,-57.29 -2.99,-86.04 -0.02,-21.96 -1.01,-42.1 -0.05,-65.88 -1.44,5.92 -2.48,11.65 -2.85,17.09 -0.35,5.14 0,9.48 -0.93,13.41l0.14 19.56 0.76 35.97 1.89 53.22zm-0.77 69.79l-1.05 -46.23 -0.71 -41.72 -5.82 -85.29 3.58 -3.41 -3.31 -0.7 -6.84 -1.59 -1.2 14.26 -0.2 84.18 2.35 150 8.56 38.39 2.39 -23.71c0.71,-10.95 1.52,-21.47 1.79,-34.51 0.67,-16.09 0.74,-32.72 0.46,-49.67zm61.6 106.47c4.64,-69.72 1.01,-138.47 -0.59,-207.76 -0.89,-39.78 -1.69,-79.62 -1.53,-120.04 0.61,-24.11 1.6,-48.23 3.87,-72.34 -2.93,-5.98 -5.45,-12.41 -7.29,-19.63l-32.17 10.7 -1.34 11.08c-4.53,27.84 -10.79,49.67 -17.4,70.21l-0.46 1.53c0.01,3.5 -0.19,7.19 -0.22,10.73 -0.76,21.94 -0.67,43.97 0.13,66.08 0.47,28.68 1.97,57.23 2.96,85.84 0.83,30.3 2.24,60.4 1.79,90.6 -0.24,21.01 -1.17,41.69 -3.06,61.92l-3.12 25.26 55.59 14.04c1.67,-8.42 2.32,-18.23 2.84,-28.22zm111.27 -208.54c-1.11,44.15 -3.04,88.38 -3.32,132.46 -0.39,36.99 0.75,71.68 3.28,104.3l57.48 -14.35c-2.28,-19.89 -4.05,-41.75 -4.69,-65.99 -0.39,-14.59 0.16,-29.4 0.1,-44.1 -0.06,-12.81 0.32,-25.9 0.81,-38.84l3.25 -85.64c0.5,-13.13 0.74,-26.55 0.91,-40.07 0.29,-22.52 -0.84,-43.87 -1.26,-65.8 -4.5,-15.44 -9.18,-30.81 -12.97,-46.53 -2.5,-11.6 -4.83,-23.32 -6.39,-35.55 -10.4,-4.21 -21.03,-8.02 -31.8,-11.56 -2.37,9.94 -5.35,17.15 -8.66,22.82 2.65,22.24 3.76,45.25 4.31,68.53 1.12,39.57 0.13,79.91 -1.05,120.32zm7.36 -227.88c9.73,2.87 19.07,6.11 28.15,9.58 -0.04,-0.95 -0.23,-1.92 -0.75,-2.96 -8.82,-3.4 -18,-6.56 -27.56,-9.48 0.14,1.06 0.19,2.02 0.16,2.86zm-0.44 6.09c9.89,3.12 19.62,6.53 29.21,10.17l-0.09 -2.73c-9.5,-3.77 -19.1,-7.12 -28.77,-10.16l-0.35 2.72zm-126.18 -4.29c-9.58,2.85 -19.15,5.88 -28.72,9.32l-0.14 2.94c9.58,-3.53 19.24,-6.67 28.97,-9.51l-0.11 -2.75z');logo1 = new fabric.Path('M0.91 1.09c0,0.01 -0.01,0.01 -0.01,0.01 0,0 0,0.01 -0.01,0.01l-0.03 0.03c-0.01,0 -0.02,0.01 -0.02,0.01l-0.1 0.1c0,0 0,0 -0.01,0 -0.01,0.02 -0.03,0.03 -0.04,0.04l-0.03 0.03c-0.01,0.01 -0.02,0.01 -0.02,0.02 -0.01,-0.01 -0.06,-0.07 -0.07,-0.08 -0.03,-0.03 -0.07,-0.08 -0.1,-0.11 -0.01,-0.01 -0.01,-0.02 -0.02,-0.02 0,-0.01 -0.01,-0.01 -0.01,-0.02 -0.03,-0.03 -0.05,-0.05 -0.07,-0.08 -0.03,-0.02 -0.08,-0.09 -0.11,-0.11 -0.07,-0.05 -0.14,-0.05 -0.22,-0.02 -0.01,0.01 -0.03,0.03 -0.04,0.03 0,0.01 0.05,0.07 0.06,0.07l0.07 0.08c0,0 0,0 0.01,0.01 0,0 0.01,0.01 0.01,0.01 0.01,0.01 0.02,0.02 0.02,0.03l0.04 0.04c0.05,0.05 0.1,0.1 0.14,0.16 0,0 0.01,0 0.01,0.01l0.09 0.1c0.01,0.01 0.02,0.02 0.02,0.03 0.01,0.01 0.02,0.01 0.03,0.02 0.04,0.03 0.09,0.06 0.16,0.05 0.05,0 0.09,-0.03 0.13,-0.06 0.02,-0.02 0.04,-0.04 0.07,-0.06l0.07 -0.07c0.02,-0.02 0.13,-0.11 0.13,-0.12 0.01,0 0.01,-0.01 0.02,-0.01 0.06,-0.1 0.05,-0.19 -0.02,-0.27l-0.15 -0.17c-0.01,-0.01 -0.02,-0.02 -0.03,-0.03 0,0 -0.01,-0.01 -0.01,-0.01l-0.09 -0.1c-0.02,-0.02 -0.03,-0.04 -0.05,-0.06 -0.02,-0.02 -0.03,-0.04 -0.05,-0.05 -0.01,-0.02 -0.1,-0.11 -0.1,-0.12 -0.02,0.01 -0.05,0.07 -0.06,0.09 -0.02,0.06 -0.01,0.12 0.02,0.17 0.01,0.03 0.04,0.06 0.06,0.08 0.04,0.04 0.07,0.08 0.1,0.12l0.19 0.2c0.01,0.01 0.02,0.02 0.02,0.02zm-0.35 0.04c0,-0.01 0.01,-0.01 0.02,-0.02 0.04,-0.06 0.06,-0.12 0.04,-0.19 -0.02,-0.07 -0.05,-0.09 -0.09,-0.13l-0.03 -0.04c-0.01,0 -0.01,-0.01 -0.02,-0.02 -0.03,-0.02 -0.06,-0.06 -0.09,-0.09l-0.1 -0.11c-0.01,-0.01 -0.07,-0.07 -0.07,-0.08 0.01,0 0.01,-0.01 0.02,-0.01 0,-0.01 0,-0.01 0.01,-0.01l0.04 -0.04c0.01,-0.01 0.02,-0.02 0.03,-0.03 0.01,0 0.01,-0.01 0.02,-0.01l0.12 -0.11c0,-0.01 0.02,-0.03 0.03,-0.03l0.08 0.09c0.03,0.03 0.05,0.05 0.07,0.08l0.16 0.17c0.04,0.04 0.06,0.07 0.11,0.09 0.07,0.03 0.12,0.02 0.18,-0.01 0.01,0 0.03,-0.02 0.04,-0.03 0,0 -0.02,-0.02 -0.02,-0.02l-0.15 -0.17c-0.01,-0.01 -0.02,-0.02 -0.03,-0.03l-0.05 -0.05c-0.01,-0.01 -0.02,-0.02 -0.03,-0.03 0,-0.01 -0.01,-0.02 -0.02,-0.03 -0.03,-0.04 -0.07,-0.07 -0.1,-0.11l-0.05 -0.05c-0.03,-0.03 -0.03,-0.04 -0.06,-0.06 -0.03,-0.03 -0.09,-0.06 -0.16,-0.05 -0.03,0.01 -0.05,0.02 -0.07,0.03 -0.03,0.01 -0.04,0.03 -0.06,0.05 -0.03,0.02 -0.06,0.05 -0.09,0.07 -0.01,0.01 -0.01,0.02 -0.02,0.03 -0.02,0.01 -0.04,0.03 -0.06,0.05 -0.01,0.01 -0.09,0.08 -0.1,0.09 -0.01,0.02 -0.03,0.05 -0.04,0.09 -0.02,0.06 0,0.12 0.03,0.16 0.02,0.03 0.03,0.04 0.05,0.06l0.15 0.17c0.01,0 0.02,0.02 0.03,0.02 0.01,0.01 0.02,0.02 0.02,0.03l0.08 0.08c0.01,0.01 0.02,0.02 0.03,0.03l0.05 0.06c0.01,0.01 0.09,0.11 0.1,0.11z>');logo2 = new fabric.Path('M0.91 1.09c0,0.01 -0.01,0.01 -0.01,0.01 0,0 0,0.01 -0.01,0.01l-0.03 0.03c-0.01,0 -0.02,0.01 -0.02,0.01l-0.1 0.1c0,0 0,0 -0.01,0 -0.01,0.02 -0.03,0.03 -0.04,0.04l-0.03 0.03c-0.01,0.01 -0.02,0.01 -0.02,0.02 -0.01,-0.01 -0.06,-0.07 -0.07,-0.08 -0.03,-0.03 -0.07,-0.08 -0.1,-0.11 -0.01,-0.01 -0.01,-0.02 -0.02,-0.02 0,-0.01 -0.01,-0.01 -0.01,-0.02 -0.03,-0.03 -0.05,-0.05 -0.07,-0.08 -0.03,-0.02 -0.08,-0.09 -0.11,-0.11 -0.07,-0.05 -0.14,-0.05 -0.22,-0.02 -0.01,0.01 -0.03,0.03 -0.04,0.03 0,0.01 0.05,0.07 0.06,0.07l0.07 0.08c0,0 0,0 0.01,0.01 0,0 0.01,0.01 0.01,0.01 0.01,0.01 0.02,0.02 0.02,0.03l0.04 0.04c0.05,0.05 0.1,0.1 0.14,0.16 0,0 0.01,0 0.01,0.01l0.09 0.1c0.01,0.01 0.02,0.02 0.02,0.03 0.01,0.01 0.02,0.01 0.03,0.02 0.04,0.03 0.09,0.06 0.16,0.05 0.05,0 0.09,-0.03 0.13,-0.06 0.02,-0.02 0.04,-0.04 0.07,-0.06l0.07 -0.07c0.02,-0.02 0.13,-0.11 0.13,-0.12 0.01,0 0.01,-0.01 0.02,-0.01 0.06,-0.1 0.05,-0.19 -0.02,-0.27l-0.15 -0.17c-0.01,-0.01 -0.02,-0.02 -0.03,-0.03 0,0 -0.01,-0.01 -0.01,-0.01l-0.09 -0.1c-0.02,-0.02 -0.03,-0.04 -0.05,-0.06 -0.02,-0.02 -0.03,-0.04 -0.05,-0.05 -0.01,-0.02 -0.1,-0.11 -0.1,-0.12 -0.02,0.01 -0.05,0.07 -0.06,0.09 -0.02,0.06 -0.01,0.12 0.02,0.17 0.01,0.03 0.04,0.06 0.06,0.08 0.04,0.04 0.07,0.08 0.1,0.12l0.19 0.2c0.01,0.01 0.02,0.02 0.02,0.02zm-0.35 0.04c0,-0.01 0.01,-0.01 0.02,-0.02 0.04,-0.06 0.06,-0.12 0.04,-0.19 -0.02,-0.07 -0.05,-0.09 -0.09,-0.13l-0.03 -0.04c-0.01,0 -0.01,-0.01 -0.02,-0.02 -0.03,-0.02 -0.06,-0.06 -0.09,-0.09l-0.1 -0.11c-0.01,-0.01 -0.07,-0.07 -0.07,-0.08 0.01,0 0.01,-0.01 0.02,-0.01 0,-0.01 0,-0.01 0.01,-0.01l0.04 -0.04c0.01,-0.01 0.02,-0.02 0.03,-0.03 0.01,0 0.01,-0.01 0.02,-0.01l0.12 -0.11c0,-0.01 0.02,-0.03 0.03,-0.03l0.08 0.09c0.03,0.03 0.05,0.05 0.07,0.08l0.16 0.17c0.04,0.04 0.06,0.07 0.11,0.09 0.07,0.03 0.12,0.02 0.18,-0.01 0.01,0 0.03,-0.02 0.04,-0.03 0,0 -0.02,-0.02 -0.02,-0.02l-0.15 -0.17c-0.01,-0.01 -0.02,-0.02 -0.03,-0.03l-0.05 -0.05c-0.01,-0.01 -0.02,-0.02 -0.03,-0.03 0,-0.01 -0.01,-0.02 -0.02,-0.03 -0.03,-0.04 -0.07,-0.07 -0.1,-0.11l-0.05 -0.05c-0.03,-0.03 -0.03,-0.04 -0.06,-0.06 -0.03,-0.03 -0.09,-0.06 -0.16,-0.05 -0.03,0.01 -0.05,0.02 -0.07,0.03 -0.03,0.01 -0.04,0.03 -0.06,0.05 -0.03,0.02 -0.06,0.05 -0.09,0.07 -0.01,0.01 -0.01,0.02 -0.02,0.03 -0.02,0.01 -0.04,0.03 -0.06,0.05 -0.01,0.01 -0.09,0.08 -0.1,0.09 -0.01,0.02 -0.03,0.05 -0.04,0.09 -0.02,0.06 0,0.12 0.03,0.16 0.02,0.03 0.03,0.04 0.05,0.06l0.15 0.17c0.01,0 0.02,0.02 0.03,0.02 0.01,0.01 0.02,0.02 0.02,0.03l0.08 0.08c0.01,0.01 0.02,0.02 0.03,0.03l0.05 0.06c0.01,0.01 0.09,0.11 0.1,0.11z>');color3 = new fabric.Path('M600 0l-50 0 0 9.17 50 0 0 -9.17zm-51.15 10.61l47.96 0 0 580.66 -544.3 0 0 -3.35 -47.18 0 0 -581.04 543.52 0 0 3.73zm-498.85 580.22l-50 0 0 9.17 50 0 0 -9.17z');color4 = new fabric.Path('M65.26 525.05l0 -360.18c-1.03,2.3 -2.1,4.6 -3.19,6.9l0 353.28 3.19 0zm425.35 -150.53l0.06 33.37 -0.02 15.5 -0.05 16.15 -0.08 16.14c-0.02,4.46 -0.07,8.89 -0.12,13.33 -0.06,5.93 -0.12,11.87 -0.14,17.79 -0.03,11.31 0.01,22.62 0.05,33.93l0.14 39.37 59.62 -1.07 8.66 0.94 0.65 17.19 -9.11 2.6 -109.38 0.91 -43.75 0.13 -14.14 -18.4 14.75 -2.47c2.25,0.4 17.75,0.87 26.63,1.3 6.9,-13.47 14.02,-26.89 21.32,-40.25l0 -28.87c0,-6.89 -0.02,-11.59 -0.04,-16.38 -0.03,-8.01 -0.07,-16.01 -0.03,-24.02 0.04,-8.54 0.11,-17.09 0.2,-25.63 0.09,-8.57 0.21,-17.11 0.35,-25.64 0.13,-8.3 0.28,-16.61 0.45,-24.89 0.18,-8.31 0.38,-16.62 0.64,-24.89 0.2,-6.42 0.44,-12.78 0.71,-19.09 0.28,-6.39 0.59,-12.75 0.93,-19.07 0.45,-8.22 1.05,-16.25 1.66,-24.28l0.37 -5.06c0.45,-6.04 0.93,-11.89 1.41,-17.74l0.53 -6.59c-1.91,-0.04 -4.26,-0.25 -5.85,-0.26 -2.09,-0.02 -3.22,0.45 -4.2,0.59 -0.97,0.13 -4.82,0.37 -6.74,0.25 -1.91,-0.12 -2.79,0.1 -3.81,0.33 -1.01,0.24 -2.03,0.16 -3.04,0.12 -1.02,-0.04 -4.07,0.53 -5.18,0.7 -1.11,0.18 -3.42,0.1 -4.26,0.04 -0.84,-0.06 -1.7,0.65 -3.24,0.92 -1.54,0.27 -5.33,-0.04 -6.07,-0.1 -0.75,-0.06 -0.75,0.31 -1.49,0.57 -0.74,0.25 -4.51,0.31 -4.51,0.31l-0.32 -0.53c-0.77,-1.01 0.49,-1.6 0.71,-2.3l0 -0.76c-1.1,-2.08 -1.04,-4.13 0.56,-6.16l-0.04 -0.74c-1.3,-3.33 -1.12,-6.96 1.01,-10.98l0.04 -0.59c-1.2,-1.89 -1.02,-3.97 0.47,-6.24l0.01 -0.92c-0.02,-0.77 -0.93,-2.16 0.44,-2.35l0.77 -1.59c-2.89,-0.8 -4.33,-1.15 -5.69,-1.22l20.79 -11.56 114.69 2.19 10.31 28.13 -16.63 14.66c0,0 -0.74,0.51 -1.41,0.39 -0.66,-0.11 -1.36,-0.72 -2.4,-0.93 -1.03,-0.22 -3.55,-0.84 -6.4,-1.25 -2.86,-0.41 -8.6,-0.82 -10.61,-0.82 -2.01,0 -9.1,-0.26 -9.89,-0.38 -0.78,-0.11 -1.77,-0.37 -2.71,-0.23 -0.94,0.14 -4.1,0.51 -5.8,0.53 -0.71,0.01 -2.47,-0.01 -4.39,-0.03l0.48 11.22c0.32,7.51 0.65,15.02 0.93,22.63 0.15,4.25 0.3,8.5 0.44,12.87 0.13,4.28 0.24,8.57 0.31,12.88 0.19,10.77 0.26,21.57 0.32,32.36l0.13 23.94zm-15.4 -42.66l-0.93 106.3 -0.3 118.07c0.46,1.38 0.91,2.76 1.36,4.14l3.94 -0.08 -0.2 -12.51c-0.15,-9.02 -0.08,-18.05 -0.01,-27.08 0.04,-4.47 0.07,-8.95 0.08,-13.41l0.1 -46.9c0.01,-8.2 0.02,-16.4 0.06,-24.59 0.04,-8.41 0.11,-16.81 0.18,-25.21l0.16 -22.11c0.05,-8.6 0.11,-17.21 0.13,-25.8l0.03 -16.91c0,-5.64 -0.01,-11.28 -0.03,-16.91 -0.04,-7.22 -0.11,-14.46 -0.19,-21.69l-0.13 -11.9 -0.32 -36.9 1.56 -0.01c-1.41,-0.06 -3.98,-0.06 -5.86,-0.02l0.47 0.27 -0.1 73.25zm-17.21 29.48c-0.31,14.12 -0.62,28.23 -0.81,42.3 -0.11,7.43 -0.14,14.84 -0.18,22.25l-0.06 10.79 -0.11 11.31c-0.09,7.53 -0.17,15.06 -0.12,22.58l0.19 30.22c1.67,-2.95 3.34,-5.9 5.02,-8.85l0.34 -76.58 1.46 -87.75 1.13 -37.94 0.87 -31.04c-1.48,-0.2 -2.3,-0.38 -3.27,-0.42l-0.45 6.81c-0.33,4.91 -0.66,9.82 -0.92,14.59l-0.29 5.28c-0.68,12.18 -1.36,24.38 -1.82,36.44 -0.37,9.65 -0.56,19.25 -0.75,28.85l-0.23 11.16zm-4.32 -72.89c-0.61,8.12 -1.22,16.25 -1.65,24.21 -0.35,6.38 -0.66,12.73 -0.94,19.04 -0.27,6.4 -0.51,12.75 -0.7,19.04 -0.26,8.31 -0.47,16.6 -0.64,24.87 -0.18,8.31 -0.33,16.6 -0.46,24.88 -0.14,8.56 -0.25,17.1 -0.34,25.62 -0.09,8.54 -0.16,17.08 -0.21,25.62 -0.03,7.99 0,15.99 0.04,23.98 0.02,6.13 0.05,12.37 0.05,16.4l0 23.18c1.66,-3.01 3.33,-6.01 5,-9.01l-0.23 -35.69c-0.04,-7.55 0.04,-15.09 0.13,-22.63 0.04,-3.77 0.08,-7.54 0.11,-11.29l0.06 -10.79c0.03,-7.43 0.07,-14.86 0.17,-22.27 0.2,-14.14 0.51,-28.24 0.82,-42.33l0.23 -11.16c0.19,-9.66 0.38,-19.31 0.75,-28.9 0.47,-12.25 1.14,-24.38 1.81,-36.5l0.3 -5.28c0.27,-4.97 0.59,-9.81 0.92,-14.63l0.42 -6.41c-1.05,0.09 -2.22,0.2 -3.3,0.29l-0.56 6.97c-0.49,5.98 -0.97,11.95 -1.4,17.73l-0.38 5.06zm29.21 74.23c-0.02,8.61 -0.08,17.22 -0.13,25.82l-0.16 22.12c-0.07,8.4 -0.14,16.81 -0.18,25.19 -0.04,8.19 -0.05,16.39 -0.06,24.58l-0.09 46.9c-0.01,4.49 -0.05,8.96 -0.08,13.44 -0.07,9 -0.15,18.01 0,27.01l0.2 12.5 4.95 -0.09 -0.14 -39.42c-0.04,-11.31 -0.08,-22.62 -0.05,-33.93 0.01,-5.95 0.08,-11.89 0.14,-17.82 0.04,-4.44 0.09,-8.89 0.12,-13.31l0.08 -16.14 0.05 -16.14 0 -30.99 -0.04 -17.88 -0.13 -23.93c-0.06,-10.76 -0.13,-21.53 -0.32,-32.32 -0.07,-4.25 -0.19,-8.54 -0.32,-12.84 -0.13,-4.2 -0.28,-8.52 -0.44,-12.85 -0.27,-7.47 -0.6,-15.04 -0.92,-22.61l-0.48 -11.32 1.55 -0.06c-1.66,-0.03 -3.25,-0.07 -4.18,-0.12l0.32 36.78 0.12 11.9c0.08,7.22 0.16,14.46 0.19,21.7 0.02,5.63 0.03,11.28 0.03,16.92l-0.03 16.91zm83.94 -164.88l-189.59 0 0 396.88 189.59 0 0 -396.88zm-507.75 327.25l0 -347.09c-3.3,7.19 -7.82,12.55 -9.48,19.54l-3.67 1.25 -0.93 -1 0 327.3 14.08 0zm235.82 -362.66l0 362.66 21.06 0 0 -326.59 -4.99 -1.34c-2.46,-7.28 -6.8,-14.53 -10.2,-21.79 -2.03,-4.32 -3.99,-8.63 -5.87,-12.94zm-6.18 -14.9l0 377.56 3.19 0 0 -369.68c-1.1,-2.63 -2.16,-5.25 -3.19,-7.88zm-3 377.56l0 -385.39c-1.16,-3.14 -2.28,-6.29 -3.36,-9.43 -7.66,-21.17 -15.59,-40.05 -23.75,-56.92l-0.07 0.27c-51.98,3.23 -103.33,2.93 -154.08,-0.83l-12.71 27.44c-8.43,19.18 -15.26,38.65 -23.49,57.86l0 367 58.61 0 0 -251.36 107.23 0 0 251.36 51.62 0z'); var cl1='#1F5CA9'; $('#spncl1').css('background-color', cl1); var cl2='#FBB138'; $('#spncl2').css('background-color', cl2); canvas.add(color1.set({ scaleX: 1, scaleY: 1, flipY: false, originX: "center", originY: "center", fill: cl1 }));canvas.add(color2.set({ scaleX: 1, scaleY: 1, flipY: false, originX: "center", originY: "center", fill: cl2 }));canvas.add(logo1.set({ left: 70, top: 90, scaleX: 15, scaleY: 15, flipY: false, strokeWidth: 0.03, stroke: '#191919', fill: '#FFFFFF' }));canvas.add(logo2.set({ left: 438, top: 248, scaleX: 13, scaleY: 13, flipY: false, strokeWidth: 0.03, stroke: '#191919', fill: '#FFFFFF' }));canvast.add(color3.set({ scaleX: 1, scaleY: 1, flipY: false, originX: "center", originY: "center", fill: cl1 }));canvast.add(color4.set({ scaleX: 1, scaleY: 1, flipY: false, originX: "center", originY: "center", fill: cl2 }));color1.selectable=false;color2.selectable=false;logo1.selectable=false;logo2.selectable=false;color3.selectable=false;color4.selectable=false; var dbplnumber = "11"; var dbteam = "TEAM"; var dbplayer = "PLAYER"; var dbbtag = "btag.svg"; var dbfront3d = "../virtual3d_images/fury_snf_front_106.virtual"; var dbback3d = "../virtual3d_images/fury_snf_back_106.virtual"; var dbtagleft = "240"; var dbtagtop = "465"; var dbtagsize = "40"; fabric.Image.fromURL(dbbtag, function(oImgj) { oImgj.set({left:dbtagleft, top:dbtagtop}); oImgj.scaleToWidth(dbtagsize); canvas.add(oImgj); oImgj.selectable = false; }); /* mask load */ fabric.Image.fromURL(dbfront3d, function(oImgj) { oImgj.set({left:300, top:300}); oImgj.scaleToWidth(600); canvas.add(oImgj); oImgj.selectable = false; }); fabric.Image.fromURL(dbback3d, function(oImgj) { oImgj.set({left:300, top:300}); oImgj.scaleToWidth(600) canvast.add(oImgj); oImgj.selectable = false; }); /* Color Change in SVG */ 529,533 $("#color1").on("click", "li", function (event) { event.preventDefault(); $('#box').prop('checked', true); var col = $(this).children('span').css('background-color'); var newcol = new fabric.Color(col).toHex(); $('#ctitle').html($(this).attr('title')); color1.set('fill', col);color3.set('fill', col); $('#newcolor').css('background-color', newcol); var color1atr = $(this).attr('title'); $('#color1val').val(color1atr); $(this).closest('.panel').children('.panel-heading').children('.picker').css('background-color', col); canvas.renderAll(); canvast.renderAll(); }); 530,534 $("#color2").on("click", "li", function (event) { event.preventDefault(); $('#box').prop('checked', true); var col = $(this).children('span').css('background-color'); var newcol = new fabric.Color(col).toHex(); $('#ctitle').html($(this).attr('title')); color2.set('fill', col);color4.set('fill', col); $('#newcolor').css('background-color', newcol); var color2atr = $(this).attr('title'); $('#color2val').val(color2atr); $(this).closest('.panel').children('.panel-heading').children('.picker').css('background-color', col); canvas.renderAll(); canvast.renderAll(); }); /*Front Text start*/ /*Front Team text start*/ var teamfrontTControl = document.getElementById('teamfront') function updateControls() { teamfrontTControl.value = teamfront.getText(); } teamfrontTControl.onkeyup = function () { var teamfrontText = document.getElementById('teamfront').value; var nLength = teamfrontText.length; teamfrontText = " "+teamfrontText; $('#teamfrontval').val(teamfrontText); teamfront1.setText(teamfrontText) canvas.renderAll() updateControls() } var dbteamfont = "35"; var dbteamstroke = "0.01"; var dbteamleft = "150"; var dbteamtop = "160"; var teamfront = $('#teamfront').val(); var nLen = teamfront.length; teamfront = " "+teamfront; teamfront1 = new fabric.Text(teamfront, { fontSize: dbteamfont, left: dbteamleft, top: dbteamtop, fill: $('#front_sold_color').val(), fontFamily: $('#name_ffamily').val(), stroke: $('#front_outline_color').val(), strokeWidth: dbteamstroke }); canvas.add(teamfront1); teamfront1.selectable=true; teamfront1.on('selected', function() { $('#scufontfamily').val(this.get("fontFamily")); }); var dbnm1font = "50"; var dbnm1stroke = "2"; var dbnm1left = "235"; var dbnm1top = "120"; var dbnm1angle = "0"; playernumber3 = new fabric.Text(dbplnumber, { fontSize: dbnm1font, left: dbnm1left, top: dbnm1top, fill: $('#front_sold_color').val(), fontFamily: $('#number_ffamily').val(), stroke: $('#front_outline_color').val(), strokeWidth: dbnm1stroke, angle: dbnm1angle }); var dbnm2font = "60"; var dbnm2stroke = "2"; var dbnm2left = "510"; var dbnm2top = "530"; var dbnm2angle = "0"; playernumber4 = new fabric.Text(dbplnumber, { fontSize: dbnm2font, left: dbnm2left, top: dbnm2top, fill: $('#front_sold_color').val(), fontFamily: $('#number_ffamily').val(), stroke: $('#front_outline_color').val(), strokeWidth: dbnm2stroke, angle: dbnm2angle }); canvas.add(playernumber3);canvas.add(playernumber4);playernumber3.selectable=true; playernumber4.selectable=true; playernumber3.on('selected', function() { $('#scufontfamily').val((this.get("fontFamily"))); }); playernumber4.on('selected', function() { $('#scufontfamily').val((this.get("fontFamily"))); }); /*Front Team text end*/ var playernumberTControl = document.getElementById('playernumber') function updateControls() { playernumberTControl.value = playernumber.getText(); } playernumberTControl.onkeyup = function () { var playernumberText = document.getElementById('playernumber').value; var nLength = playernumberText.length; playernumberText = " "+playernumberText; $('#playernumberval').val(playernumberText); playernumber.setText(playernumberText) canvas.renderAll() canvast.renderAll() updateControls() } var dbplayerfont = "30"; var dbplayerstroke = "0.01"; var dbplayerleft = "180"; var dbplayertop = "130"; var PlayerName = $('#playernumber').val(); var nLen = PlayerName.length; PlayerName = " "+PlayerName; playernumber = new fabric.Text(PlayerName, { fontSize: dbplayerfont, left: dbplayerleft, top: dbplayertop, fontFamily: $('#name_ffamily').val(), fontWeight: 'normal', fill: $('#front_sold_color').val(), stroke: $('#front_outline_color').val(), strokeWidth: dbplayerstroke }); canvast.add(playernumber);playernumber.selectable=true; playernumber.on('selected', function() { $('#scufontfamily').val((this.get("fontFamily"))); }); /*Front text EnD*/ var playernumber2TControl = document.getElementById('playernumber2') function updateControls() { playernumber2TControl.value = playernumber2.getText(); } playernumber2TControl.onkeyup = function () { var playernumber2Text = document.getElementById('playernumber2').value $('#playernumber2val').val(playernumber2Text); playernumber2.set({text: playernumber2Text}) playernumber3.set({text: playernumber2Text}) playernumber4.set({text: playernumber2Text}) playernumber5.set({text: playernumber2Text}) canvast.renderAll() canvas.renderAll() updateControls() } var dbnm3font = "150"; var dbnm3stroke = "2"; var dbnm3left = "180"; var dbnm3top = "220"; var dbnm3angle = "0"; playernumber5 = new fabric.Text(dbplnumber, { fontSize: dbnm3font, left: dbnm3left, top: dbnm3top, fill: $('#front_sold_color').val(), fontFamily: $('#number_ffamily').val(), stroke: $('#front_outline_color').val(), strokeWidth: dbnm3stroke, angle: dbnm3angle }); canvast.add(playernumber5);playernumber5.selectable=true playernumber5.on('selected', function() { $('#scufontfamily').val((this.get("fontFamily"))); }); var dbnm4font = "60"; var dbnm4stroke = "2"; var dbnm4left = "400"; var dbnm4top = "520"; var dbnm4angle = "0"; playernumber2 = new fabric.Text(dbplnumber, { fontSize: dbnm4font, left: dbnm4left, top: dbnm4top, fill: $('#front_sold_color').val(), fontFamily: $('#number_ffamily').val(), stroke: $('#front_outline_color').val(), strokeWidth: dbnm4stroke, angle: dbnm4angle }); canvast.add(playernumber2);playernumber2.selectable=true; playernumber2.on('selected', function() { $('#scufontfamily').val((this.get("fontFamily"))); }); $('#down').click(function(){ $('#down').addClass('tsactive'); $('#straight').removeClass('tsactive'); $('#up').removeClass('tsactive'); canvast.remove(playernumber); PlayerName = $('#playernumber').val(); playernumber = new fabric.CurvedText(PlayerName,{ width: 100, height: 50, left: dbplayerleft, top: dbplayertop, textAlign: 'center', fontFamily: $('#scufontfamily').val(), fontWeight: 'normal', fill: $('#front_sold_color').val(), stroke: $('#front_outline_color').val(), radius: 100, fontSize: dbplayerfont, spacing: 7, reverse: true, angle: -5, }); canvast.add(playernumber); playernumber.selectable=true canvast.renderAll() updateControls(); playernumber.on('selected', function() { $('#scufontfamily').val((this.get("fontFamily"))); }); }); $('#up').click(function(){ $('#up').addClass('tsactive'); $('#straight').removeClass('tsactive'); $('#down').removeClass('tsactive'); canvast.remove(playernumber); PlayerName = $('#playernumber').val(); playernumber = new fabric.CurvedText(PlayerName,{ width: 100, height: 50, left: dbplayerleft, top: dbplayertop, fontFamily: $('#scufontfamily').val(), fontWeight: 'normal', fill: $('#front_sold_color').val(), stroke: $('#front_outline_color').val(), radius: 100, fontSize: dbplayerfont, spacing: 7, textAlign: 'center', reverse: false, angle: 7, }); canvast.add(playernumber); playernumber.selectable=true canvast.renderAll() updateControls(); playernumber.on('selected', function() { $('#scufontfamily').val((this.get("fontFamily"))); }); }); $('#straight').click(function(){ $('#straight').addClass('tsactive'); $('#up').removeClass('tsactive'); $('#down').removeClass('tsactive'); canvast.remove(playernumber); PlayerName = $('#playernumber').val(); playernumber = new fabric.Text(PlayerName, { fontSize: dbplayerfont, left: dbplayerleft, top: dbplayertop, fontFamily: $('#scufontfamily').val(), fontWeight: 'normal', fill: $('#front_sold_color').val(), stroke: $('#front_outline_color').val(), }); canvast.add(playernumber); playernumber.selectable=true canvast.renderAll() updateControls(); playernumber.on('selected', function() { $('#scufontfamily').val((this.get("fontFamily"))); }); }); $('#scufontcolor li').click(function() { var col = $(this).data('color'); $('#front_sold_color').val(col); if($('#showFront').hasClass('active')) { try { var selText = canvas.getActiveObject().getText(); if(isNaN(selText)) { canvas.getActiveObject().setFill(col); canvas.renderAll(); } else{ setNumberFillColor(col) } } catch(err) { } } if($('#showBack').hasClass('active')) { try { var selText = canvast.getActiveObject().getText(); if(isNaN(selText)) { canvast.getActiveObject().setFill(col); canvast.renderAll(); } else{ setNumberFillColor(col) } } catch(err) { } } backtcolor_change(col); }); function setNumberFillColor(col){ canvas.setActiveObject(playernumber3); canvas.getActiveObject().setFill(col); canvas.setActiveObject(playernumber4); canvas.getActiveObject().setFill(col); canvas.renderAll(); canvast.setActiveObject(playernumber2); canvast.getActiveObject().setFill(col); canvast.setActiveObject(playernumber5); canvast.getActiveObject().setFill(col); canvast.renderAll(); } function setNumberStrokeColor(col){ canvas.setActiveObject(playernumber3); canvas.getActiveObject().setStroke(col); canvas.setActiveObject(playernumber4); canvas.getActiveObject().setStroke(col); canvas.renderAll(); canvast.setActiveObject(playernumber2); canvast.getActiveObject().setStroke(col); canvast.setActiveObject(playernumber5); canvast.getActiveObject().setStroke(col); canvast.renderAll(); } function backtcolor_change(selected_color) { $('#scufontcolor li').each(function (indx, ele) { if($(ele).data('color') == selected_color) { $(ele).children('span').addClass('selected'); } else { $(ele).children('span').removeClass('selected'); } }); } $('#scufontocolor li').click(function() { var col = $(this).data('color'); $('#front_outline_color').val(col); if($('#showFront').hasClass('active')) { try { var selText = canvas.getActiveObject().getText(); if(isNaN(selText)) { canvas.getActiveObject().setStroke(col); canvas.renderAll(); } else{ setNumberStrokeColor(col) } } catch(err) { } } if($('#showBack').hasClass('active')) { try { var selText = canvast.getActiveObject().getText(); if(isNaN(selText)) { canvast.getActiveObject().setStroke(col); canvast.renderAll(); } else{ setNumberStrokeColor(col) } } catch(err) { } } backtocolor_change(col); }); function backtocolor_change(selected_color) { $('#scufontocolor li').each(function (indx, ele) { if($(ele).data('color') == selected_color) { $(ele).children('span').addClass('selected'); } else { $(ele).children('span').removeClass('selected'); } }); } function setNumberFontFamily(strFontFamily) { canvas.setActiveObject(playernumber3); canvas.getActiveObject().setFontFamily(strFontFamily); canvas.setActiveObject(playernumber4); canvas.getActiveObject().setFontFamily(strFontFamily); canvas.renderAll(); canvast.setActiveObject(playernumber2); canvast.getActiveObject().setFontFamily(strFontFamily); canvast.setActiveObject(playernumber5); canvast.getActiveObject().setFontFamily(strFontFamily); canvast.renderAll(); } document.getElementById('scufontfamily').onchange = function() { if($('#showFront').hasClass('active')) { try { var selText = canvas.getActiveObject().getText(); if(isNaN(selText)) { canvas.getActiveObject().setFontFamily(this.value); canvas.renderAll(); } else{ setNumberFontFamily(this.value); } } catch(err) { } } if($('#showBack').hasClass('active')) { try { var selText = canvast.getActiveObject().getText(); if(isNaN(selText)) { canvast.getActiveObject().setFontFamily(this.value); canvast.renderAll(); } else{ setNumberFontFamily(this.value); } } catch(err) { } } }; /******************************END***************************/ function hidesuccess() { document.getElementById('logosucess').style.display = "none"; } document.getElementById('frontlogos').onchange = function handleImage(e) { var reader = new FileReader(); reader.onload = function (event) { document.getElementById('logosucess').style.display = "inline"; var imgObj = new Image(); imgObj.src = event.target.result; imgObj.onload = function () { logo = new fabric.Image(imgObj); logo.set({left: 160,top: 80}); logo.scaleToWidth(100); canvas.add(logo); canvas.setActiveObject(logo); logo.selectable=true setTimeout(hidesuccess, 5000); } } reader.readAsDataURL(e.target.files[0]); document.getElementById('frontlogos'); } canvas.renderAll(); document.getElementById('backlogos').onchange = function handleImage(e) { var reader = new FileReader(); reader.onload = function (event) { document.getElementById('logosucess').style.display = "inline"; var imgObj = new Image(); imgObj.src = event.target.result; imgObj.onload = function () { logo = new fabric.Image(imgObj); logo.set({left: 160,top: 80}); logo.scaleToWidth(100); canvast.add(logo); canvast.setActiveObject(logo); logo.selectable=true setTimeout(hidesuccess, 5000); } } reader.readAsDataURL(e.target.files[0]); document.getElementById('backlogos'); } canvast.renderAll(); $(window).load(function(){ setTimeout(function(){ $( "#showFront" ).trigger( "click" ); }, 1500); $('#playernumber2').val(dbplnumber); $('#teamfront').val(dbteam); $('#playernumber').val(dbplayer); $x = $('#name_ffamily').val(); $('#teamfront').css("font-family",$x); $('#playernumber').css("font-family",$x); $y = $('#number_ffamily').val(); $('#playernumber2').css("font-family",$y); /*$('#mme a').css('color', ''); $('#mme').parent().css('border', '');*/ $v = $('#name_ffamily').val(); $('#scufontfamily').css("font-family",$v); var dbnff = $('#name_ffamily').val(); $("#scufontfamily > [value=" + dbnff + "]").attr("selected", "true"); }) $('#scufontfamily').change(function() { $('#teamfront').css("font-family", $(this).val()); $('#playernumber').css("font-family", $(this).val()); $('#scufontfamily').css("font-family", $(this).val()); }); } loadBaseShirts(); canvas.calcOffset();