// 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('M600 0l-50 0 0 9.17 50 0 0 -9.17zm-407.24 53.89c3.23,-5.2 6.53,-10.7 9.92,-16.5 1.42,-2.57 2.67,-5.25 3.64,-8.1 -5.36,-0.02 -9.91,-0.22 -15.09,-0.33 -7.5,-0.37 -15.01,-0.49 -22.56,-0.29 -9.22,0.15 -18.42,0.74 -27.82,0.74 0.36,1.13 0.77,2.27 1.24,3.4l6.05 11.6 11.05 18.1c9.68,-0.23 18.74,-0.21 28.16,-0.05 1.81,-2.86 3.61,-5.71 5.41,-8.57zm-113.59 194.66l-1.44 25.95c-26.43,-8 -52.91,-17.98 -69.45,-36.49l4.08 -27.82c12.68,15.15 36.03,27.54 66.81,38.36zm82.56 65.64c-30.66,-10.68 -58.91,-24.11 -83.96,-37.86l-5.25 73.75 -13.12 60.62 153.12 11.88 70 -15 -9.2 -52.77 -25.03 -10.47 -86.56 -30.15zm107.53 -65.64l1.44 25.95c26.43,-8 52.91,-17.98 69.45,-36.49l-4.08 -27.82c-12.68,15.15 -36.03,27.54 -66.81,38.36zm-50.32 -213.86c-2.16,5.98 -5.29,11.41 -9.02,16.51 -0.33,0.44 -0.65,0.87 -0.99,1.3 9.8,2.66 19.98,4.47 29.96,6.7 11.74,2.54 22.51,5.44 31.9,8.85 5.37,1.87 10.49,4.32 15.47,7.1 7.94,4.71 14.03,9.05 16.77,12.72l-0.14 -0.82 1.85 -2.47 -14.8 -29.62 -24.91 -13.81 -40.63 -19.79 -7.06 -3.8 2.6 8.64c0.65,2.94 0.18,5.76 -1,8.49zm-88.19 6.39c-3.1,-6.33 -4.76,-11.63 -3.43,-14.79l1.03 -9.35 -2.91 1.17 -26.17 16.53 -44.01 24.22 -12.24 25.45 2.27 3.83 0.05 0.6c0.03,-1.1 2.67,-3.67 7.37,-7.43 2.92,-2.18 5.85,-4.13 8.79,-5.87 7.63,-4.41 16.57,-8.07 26.63,-11.09 9.48,-2.54 17.35,-5 28.13,-7.11l21.63 -4.6c-2.77,-3.8 -5.13,-7.65 -7.14,-11.56zm-80.75 549.75l-50 0 0 9.17 50 0 0 -9.17z');color3 = new fabric.Path('M600 0l-50 0 0 9.17 50 0 0 -9.17zm-331.82 229.15c27.2,-9.66 49.8,-22 64.92,-39.26l-1.93 -13.17c-14.57,16.48 -35.95,29.84 -63.66,40.3l0.67 12.13zm104.44 65.68l-0.47 2.88 -1.13 5.8c3.47,0.23 6.91,0.55 10.35,0.87l1.26 -7.66 -6.2 -2.76 -3.81 0.87zm-4.42 23.41c-6.78,36.02 -12.87,71.99 -18.44,107.94 -4.43,28.69 -8,57.5 -10.87,86.41 -2.38,25.9 -4.01,51.74 -4.98,77.54l10.71 0.84c2.09,-41.22 6.12,-82.67 11.6,-124.28 5.25,-38.24 11.11,-76.76 17.46,-115.51l5.27 -32.07c-3.53,-0.34 -7.11,-0.63 -10.75,-0.87zm175.67 -23.21l0.51 2.88 1.07 5.22c-3.46,0.19 -6.92,0.46 -10.37,0.77l-1.2 -6.87 6.18 -2.83 3.81 0.83zm4.52 22.69c7.21,36.17 13.71,72.31 19.68,108.42 4.72,28.65 8.59,57.42 11.74,86.29 2.65,25.88 4.54,51.7 5.78,77.49l-10.7 0.95c-2.51,-41.2 -6.96,-82.6 -12.86,-124.16 -5.65,-38.17 -11.9,-76.63 -18.64,-115.32l-5.75 -32.85c3.98,-0.37 7.55,-0.64 10.75,-0.82zm-368.56 -242.46c2.42,-4.28 5.05,-8.54 7.97,-12.8 -9.41,-0.16 -18.93,-0.18 -28.61,0.05 3.25,4.93 6.18,9.92 8.85,14.97 1.79,3.68 3.4,7.39 5.17,11.07l0.17 0.06c2.15,-4.45 4.16,-8.91 6.45,-13.35zm-99.58 153.89c-27.2,-9.66 -49.8,-22 -64.92,-39.26l1.94 -13.17c14.57,16.48 35.94,29.84 63.65,40.3l-0.67 12.13zm77.42 38.27c-28.73,-10.14 -54.77,-20.69 -76.95,-31.83l-1.11 14.94c19.83,9.59 41.22,18.85 64.66,27.68 21.99,8.29 44.11,15.88 66.16,23.83 20.12,6.86 38.47,14.79 57.58,22.26l-2.85 -16.34c-11.99,-5.21 -24.17,-10.25 -36.71,-14.99l-70.78 -25.55zm-107.67 323.41l-50 0 0 9.17 50 0 0 -9.17z');color4 = new fabric.Path('M600 0l-50 0 0 9.17 50 0 0 -9.17zm-337.01 295.54c-63.85,-27.67 -124.89,-45.26 -181.48,-70.58l-0.79 10.63c22.18,11.14 48.22,21.69 76.95,31.83l70.78 25.55c12.54,4.74 24.72,9.78 36.71,14.99l-2.17 -12.42zm119.64 1.18l-1.26 7.66c2.35,0.23 4.7,0.46 7.06,0.67l1.4 0.1 0.72 -4.9 -7.92 -3.53zm-3.68 22.39l-5.27 32.07c-6.35,38.75 -12.21,77.27 -17.46,115.51 -5.48,41.61 -9.51,83.06 -11.6,124.28l9.11 0.71c2.61,-38.94 6.44,-78.07 11.64,-117.43 5.15,-36.61 10.4,-73.25 15.78,-109.92l6.5 -44.31 -1.42 -0.12c-2.4,-0.29 -4.83,-0.55 -7.28,-0.79zm154.93 -22.08l1.2 6.87c-2.32,0.2 -4.65,0.43 -6.96,0.67l-1.48 0.14 -0.64 -4.08 7.88 -3.6zm3.76 21.51l5.75 32.85c6.74,38.69 12.99,77.15 18.64,115.32 5.9,41.56 10.35,82.96 12.86,124.16l-9.11 0.8c-3,-38.9 -7.22,-78 -12.83,-117.3 -5.53,-36.56 -11.14,-73.14 -16.9,-109.75l-7.09 -45.17 1.11 -0.12c2.67,-0.3 5.19,-0.56 7.57,-0.79zm-456.72 -101.52c-27.71,-10.46 -49.08,-23.82 -63.65,-40.3l1.55 -10.64c12.87,17.27 37.5,31.4 62.58,42.25l-0.48 8.69zm186.59 0c27.71,-10.46 49.09,-23.82 63.66,-40.3l-1.56 -10.64c-12.87,17.27 -37.5,31.4 -62.58,42.25l0.48 8.69zm-217.51 373.81l-50 0 0 9.17 50 0 0 -9.17z');color5 = new fabric.Path('M600 0l-50 0 0 9.17 50 0 0 -9.17zm-455.73 278.21c-23.44,-8.83 -44.83,-18.09 -64.66,-27.68l-0.06 0.8 -1.78 25c25.05,13.75 53.3,27.18 83.96,37.86l86.56 30.15 25.03 10.47 -5.31 -30.51c-19.11,-7.47 -37.46,-15.4 -57.58,-22.26 -22.05,-7.95 -44.17,-15.54 -66.16,-23.83zm212.01 20.34l-0.89 4.69c2.55,-0.26 5.44,-0.07 7.82,-0.07 2.62,0.04 5.22,0.17 7.81,0.34l1.13 -5.8 0.47 -2.88 -16.34 3.72zm-3.66 19.36l-0.44 2.36 -5.08 16.25 -6.02 28.67 -6.72 56.72 -6.25 47.5 -4.85 71.25 -2.5 48.44 13.15 1.03c0.97,-25.8 2.6,-51.64 4.98,-77.54 2.87,-28.91 6.44,-57.72 10.87,-86.41 5.57,-35.95 11.66,-71.92 18.44,-107.94 -2.64,-0.18 -5.32,-0.33 -8.02,-0.45 -2.76,-0.1 -5.34,-0.09 -7.56,0.12zm207.63 -19.32l4.33 21.67 5.24 16.2 6.31 28.61 7.29 56.65 6.74 47.43 5.57 71.2 1.51 24.43 0 24.11 -11.65 1.03c-1.24,-25.79 -3.13,-51.61 -5.78,-77.49 -3.15,-28.87 -7.02,-57.64 -11.74,-86.29 -5.97,-36.11 -12.47,-72.25 -19.68,-108.42 2.85,-0.16 5.4,-0.25 7.66,-0.28 1.3,-0.03 2.38,-0.01 3.08,0.12 -0.3,0.54 0.12,1.19 0.19,1.78l0.21 2.09 3.19 -2.25 -3.26 -17.2 -2.43 -1.25c0.03,0.34 -0.1,0.67 0.07,1.02 0.13,0.42 0.02,0.91 0.4,1.25 -0.82,-0.22 -2.39,-0.2 -4,-0.18 -2.68,0.05 -5.36,0.16 -8.05,0.31l-1.07 -5.22 -0.51 -2.88 16.38 3.56zm-514.91 -209.85c0.03,-1.1 2.67,-3.67 7.37,-7.43 2.92,-2.18 5.85,-4.13 8.79,-5.87 7.63,-4.41 16.57,-8.07 26.63,-11.09 9.48,-2.54 17.35,-5 28.13,-7.11l21.63 -4.6c2.28,3.12 4.83,6.21 7.67,9.25 0.74,0.81 1.49,1.63 2.24,2.44 -1.2,0.07 -2.36,0.43 -3.48,1.08 -10.33,2.2 -20.79,2.99 -30.95,5.12 -8.51,1.49 -16.81,3.4 -25.53,4.46 -5.9,0.72 -10.65,1.1 -17.21,4.69 -2.27,0.93 -4.08,2.06 -5.62,3.29 -4.47,1.68 -7.92,4.03 -13.41,5.05 -2.5,0.68 -4.63,1.01 -6.25,0.87l-0.01 -0.15zm163.59 -36.24c9.8,2.66 19.98,4.47 29.96,6.7 11.74,2.54 22.51,5.44 31.9,8.85 5.37,1.87 10.49,4.32 15.47,7.1 7.94,4.71 14.03,9.05 16.77,12.72 -2.02,0.36 -5.32,-0.2 -9.54,-1.4 -3.76,-0.86 -7.12,-2.2 -10.68,-3.29 -2.92,-2.28 -8.45,-4.65 -16.81,-6.25l-28.06 -5.37c-8.31,-1.91 -16.22,-2.84 -24.32,-4.27 -3.82,-0.41 -7.51,-1.07 -11.11,-1.92 -1.22,-0.4 -2.37,-1.14 -3.65,-1.22 3.64,-3.88 6.94,-7.58 10.07,-11.65zm-129.76 196.05c-30.78,-10.82 -54.13,-23.21 -66.81,-38.36l2.97 -20.3c15.12,17.26 37.72,29.6 64.92,39.26l-1.08 19.4zm190.09 0c30.78,-10.82 54.13,-23.21 66.81,-38.36l-2.97 -20.3c-15.12,17.26 -37.72,29.6 -64.92,39.26l1.08 19.4zm-219.26 342.28l-50 0 0 9.17 50 0 0 -9.17z');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>');color6 = 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');color7 = new fabric.Path('M600 0l-50 0 0 9.17 50 0 0 -9.17zm-333.05 240.17l1.44 25.95c26.43,-8 52.91,-17.98 69.45,-36.48l-4.08 -27.83c-12.68,15.15 -36.03,27.54 -66.81,38.36zm-219.27 -155.98c7.19,-5.11 12.94,-9.99 19.83,-13.09 8.86,-3.99 21.08,-6.3 36.08,-8.35 25.17,-3.45 50.8,-0.97 76.66,-2.15 15.95,0.1 31.98,-0.23 47.86,0.29 12.94,1.6 26.42,0.77 38.81,4.79 6.86,1.75 13.44,4.31 19.78,7.62 4.85,2.7 9.08,6.07 12.89,9.91l-3.83 -31.44 -70.12 -35.06 1.1 1.05 -3.85 6.15 -5.28 0.44c-28.64,1.1 -57.22,1.23 -85.74,0.24l-8.5 -2.2 -0.18 -9.58 -73.53 48.33 -1.98 23.05zm136.71 221.62c30.66,-10.68 58.91,-24.11 83.96,-37.86l5.25 73.75 13.12 60.62 -153.12 11.88 -70 -15 9.2 -52.76 25.03 -10.48 86.56 -30.15zm-103.03 -65.64l-1.44 25.95c-26.43,-8 -52.91,-17.98 -69.45,-36.48l4.08 -27.83c12.68,15.15 36.03,27.54 66.81,38.36zm-31.36 350.66l-50 0 0 9.17 50 0 0 -9.17z');color8 = new fabric.Path('M600 0l-50 0 0 9.17 50 0 0 -9.17zm-517.56 220.78c-27.2,-9.67 -49.8,-22.01 -64.92,-39.27l1.94 -13.17c14.57,16.48 35.94,29.84 63.65,40.3l-0.67 12.14zm489.58 254l-15.38 -97.5c-3.47,-21.44 -6.82,-42.91 -9.9,-64.44 -3.31,-0.54 -7.02,-0.96 -10.74,-1.25 0.55,4.5 1.15,9.02 1.77,13.57 4.49,32.61 9.44,65.15 14.65,97.66 4.69,29.3 9.13,58.61 13.2,87.92 3.8,27.43 6.51,53.24 8.47,79.95 3.45,-0.31 6.9,-0.61 10.35,-0.92 -2.84,-37.77 -6.63,-76.21 -12.42,-114.99zm-27.25 -176.03c-0.31,-2.29 -0.62,-4.58 -0.93,-6.88l-10.1 -0.69c0.2,2.09 0.42,4.19 0.64,6.29 3.48,0.32 7.01,0.75 10.39,1.28zm-167.85 26.48c0.66,-4.77 1.24,-9.51 1.77,-14.24 -4.18,0.3 -7.96,0.73 -11.14,1.25 -2.66,21.79 -5.2,43.56 -8.7,65.18l-13.45 97.8c-5.44,39.21 -10.12,77.7 -13.28,114.73 3.44,0.32 6.9,0.64 10.3,0.96 2.05,-26.68 5.67,-52.59 9.46,-79.97 4.07,-29.32 7.61,-58.82 12.3,-88.12 5.2,-32.51 8.26,-64.98 12.74,-97.59zm3.26 -28.51l0.53 -5.5 -10.61 0.72 -0.78 6.07c3.33,-0.57 7.03,-1 10.86,-1.29zm-114.31 -75.94c27.2,-9.67 49.8,-22.01 64.92,-39.27l-1.93 -13.17c-14.57,16.48 -35.95,29.84 -63.66,40.3l0.67 12.14zm-77.42 38.26c28.73,-10.14 54.77,-20.69 76.95,-31.83l1.11 14.94c-19.83,9.59 -41.22,18.85 -64.65,27.68 -22,8.29 -44.12,15.88 -66.17,23.83 -20.12,6.86 -38.47,14.79 -57.58,22.26l2.85 -16.34c12,-5.21 24.18,-10.24 36.71,-14.99l70.78 -25.55zm-138.45 331.79l-50 0 0 9.17 50 0 0 -9.17z');color9 = new fabric.Path('M600 0l-50 0 0 9.17 50 0 0 -9.17zm-516.87 287.17c63.85,-27.67 124.89,-45.27 181.48,-70.59l0.79 10.63c-22.18,11.14 -48.22,21.69 -76.95,31.83l-70.78 25.55c-12.53,4.75 -24.71,9.78 -36.71,14.99l2.17 -12.41zm297.7 77.55c2.27,-15.36 4.63,-35.89 6.83,-54.17 -3.13,0.09 -6.15,0.24 -8.97,0.44 -0.53,4.73 -1.11,9.47 -1.77,14.24 -4.48,32.61 -7.54,65.08 -12.74,97.59 -4.69,29.3 -8.23,58.8 -12.3,88.12 -3.79,27.38 -7.41,53.29 -9.46,79.97 2.96,0.27 5.87,0.53 8.71,0.78 2.88,-39.41 9.72,-77.96 15.32,-117.26 5.53,-36.56 8.98,-73.21 14.38,-109.71zm8.6 -68.46c0.25,-1.96 0.5,-3.86 0.74,-5.69l-9.46 0.65 -0.53 5.5c3.05,-0.24 6.18,-0.39 9.25,-0.46zm162.99 126.56c-5.21,-32.51 -10.16,-65.05 -14.65,-97.66 -0.62,-4.55 -1.22,-9.07 -1.77,-13.57 -2.94,-0.23 -5.88,-0.39 -8.66,-0.46 2.19,18.14 4.52,38.39 6.77,53.59 5.4,36.5 10.96,72.92 16.49,109.48 5.6,39.3 11.45,77.88 14.33,117.3 3.06,-0.27 6.11,-0.54 9.16,-0.81 -1.96,-26.71 -4.67,-52.52 -8.47,-79.95 -4.07,-29.31 -8.51,-58.62 -13.2,-87.92zm-18.04 -125.35c-0.22,-2.1 -0.44,-4.2 -0.64,-6.29l-8.98 -0.61c0.28,2.04 0.55,4.17 0.83,6.37 2.81,0.08 5.78,0.26 8.79,0.53zm-269.18 -88.83c27.71,-10.46 49.09,-23.82 63.66,-40.3l-1.56 -10.64c-12.87,17.27 -37.5,31.4 -62.58,42.25l0.48 8.69zm-182.09 0c-27.71,-10.46 -49.08,-23.82 -63.65,-40.3l1.55 -10.64c12.87,17.27 37.5,31.4 62.58,42.25l-0.48 8.69zm-33.11 382.19l-50 0 0 9.17 50 0 0 -9.17z');color10 = new fabric.Path('M600 0l-50 0 0 9.17 50 0 0 -9.17zm-398.14 269.83c23.44,-8.83 44.82,-18.09 64.65,-27.68l0.06 0.8 1.78 25c-25.05,13.75 -53.3,27.18 -83.96,37.86l-86.56 30.15 -25.03 10.48 5.31 -30.52c19.11,-7.47 37.46,-15.4 57.58,-22.26 22.05,-7.95 44.17,-15.54 66.17,-23.83zm341.98 22.04c0.31,2.3 0.62,4.59 0.93,6.88 2.65,0.42 5.22,0.91 7.59,1.44 2.06,0.63 4.08,1.64 5.42,2.45 -0.07,-0.44 -0.26,-0.78 -0.19,-1.34l2.43 -0.39 -1.55 -8.05 -14.63 -0.99zm2.9 20.97c3.08,21.53 6.43,43 9.9,64.44l15.38 97.5c5.79,38.78 9.58,77.22 12.42,114.99 3.99,-0.35 7.97,-0.7 11.95,-1.06l0 -24.1 -1.51 -24.44 -5.57 -71.19 -6.73 -47.44 -7.3 -56.64 -6.31 -28.61 -4.4 -13.59 -4.94 -0.6c-0.13,-0.98 0.15,-1.96 0.1,-2.94 -0.03,-0.81 -0.08,-1.64 -0.38,-2.12 -0.83,-0.78 -2.43,-1.58 -4.8,-2.38 -2.08,-0.72 -4.78,-1.32 -7.81,-1.82zm-187.89 64.58c3.5,-21.62 6.04,-43.39 8.7,-65.18 -3.51,0.58 -6.3,1.27 -8.1,2.06 -1.23,0.55 -2.48,1.13 -3.66,1.9 -0.33,0.41 -0.43,1.28 -0.46,2.28l-0.19 3.22 -2.67 -2.67 -0.21 -4.38 -1.05 5.44 -5.24 16.2 -6.31 28.61 -7.3 56.64 -6.73 47.44 -5.58 71.19 -1.51 24.44 0 24.1c4.39,0.39 8.96,0.81 13.58,1.24 3.16,-37.03 7.84,-75.52 13.28,-114.73l13.45 -97.8zm10.47 -79.41l0.78 -6.07 -13.63 0.92 -1.78 9.22 2.07 0.18c1.04,-1.13 2.61,-1.89 4.64,-2.33 2.2,-0.76 4.9,-1.4 7.92,-1.92zm-102.37 -57.84c30.78,-10.82 54.13,-23.21 66.81,-38.36l-2.97 -20.3c-15.12,17.26 -37.72,29.6 -64.92,39.27l1.08 19.39zm-185.59 0c-30.78,-10.82 -54.13,-23.21 -66.81,-38.36l2.97 -20.3c15.12,17.26 37.72,29.6 64.92,39.27l-1.08 19.39zm-31.36 350.66l-50 0 0 9.17 50 0 0 -9.17z'); var cl1='#282829'; $('#spncl1').css('background-color', cl1); var cl2='#09767A'; $('#spncl2').css('background-color', cl2); var cl3='#503270'; $('#spncl3').css('background-color', cl3); var cl4='#BDBFC1'; $('#spncl4').css('background-color', cl4); var cl5='#FFFFFF'; $('#spncl5').css('background-color', cl5); 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(color3.set({ scaleX: 1, scaleY: 1, flipY: false, originX: "center", originY: "center", fill: cl3 }));canvas.add(color4.set({ scaleX: 1, scaleY: 1, flipY: false, originX: "center", originY: "center", fill: cl4 }));canvas.add(color5.set({ scaleX: 1, scaleY: 1, flipY: false, originX: "center", originY: "center", fill: cl5 }));canvas.add(logo1.set({ left: 520, top: 552, scaleX: 15, scaleY: 15, flipY: false, strokeWidth: 0.03, stroke: '#191919', fill: '#FFFFFF' }));canvas.add(logo2.set({ left: 0, top: 0, scaleX: 0, scaleY: 0, flipY: false, strokeWidth: 0, stroke: '#191919', fill: '#FFFFFF' }));canvast.add(color6.set({ scaleX: 1, scaleY: 1, flipY: false, originX: "center", originY: "center", fill: cl1 }));canvast.add(color7.set({ scaleX: 1, scaleY: 1, flipY: false, originX: "center", originY: "center", fill: cl2 }));canvast.add(color8.set({ scaleX: 1, scaleY: 1, flipY: false, originX: "center", originY: "center", fill: cl3 }));canvast.add(color9.set({ scaleX: 1, scaleY: 1, flipY: false, originX: "center", originY: "center", fill: cl4 }));canvast.add(color10.set({ scaleX: 1, scaleY: 1, flipY: false, originX: "center", originY: "center", fill: cl5 }));color1.selectable=false;color2.selectable=false;color3.selectable=false;color4.selectable=false;color5.selectable=false;logo1.selectable=false;logo2.selectable=false;color6.selectable=false;color7.selectable=false;color8.selectable=false;color9.selectable=false;color10.selectable=false; var dbplnumber = "9"; var dbteam = "TEAM"; var dbplayer = "PLAYER"; var dbbtag = "btag.svg"; var dbfront3d = "../virtual3d_images/new_york_front_121.virtual"; var dbback3d = "../virtual3d_images/new_york_back_121.virtual"; var dbtagleft = "235"; var dbtagtop = "375"; var dbtagsize = "35"; 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 */ 655,662 $("#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);color6.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(); }); 656,663 $("#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);color7.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(); }); 657,664 $("#color3").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')); color3.set('fill', col);color8.set('fill', col); $('#newcolor').css('background-color', newcol); var color3atr = $(this).attr('title'); $('#color3val').val(color3atr); $(this).closest('.panel').children('.panel-heading').children('.picker').css('background-color', col); canvas.renderAll(); canvast.renderAll(); }); 658,665 $("#color4").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')); color4.set('fill', col);color9.set('fill', col); $('#newcolor').css('background-color', newcol); var color4atr = $(this).attr('title'); $('#color4val').val(color4atr); $(this).closest('.panel').children('.panel-heading').children('.picker').css('background-color', col); canvas.renderAll(); canvast.renderAll(); }); 659,666 $("#color5").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')); color5.set('fill', col);color10.set('fill', col); $('#newcolor').css('background-color', newcol); var color5atr = $(this).attr('title'); $('#color5val').val(color5atr); $(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 = "30"; var dbteamstroke = "0.3"; var dbteamleft = "170"; var dbteamtop = "125"; 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 = "0.5"; var dbnm1left = "305"; var dbnm1top = "140"; var dbnm1angle = "-25"; 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 = "50"; var dbnm2stroke = "0.5"; var dbnm2left = "30"; var dbnm2top = "140"; 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 = "0"; var dbplayerstroke = "0"; var dbplayerleft = "0"; var dbplayertop = "0"; 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 = "0"; var dbnm3stroke = "2"; var dbnm3left = "0"; var dbnm3top = "0"; 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 = "0"; var dbnm4stroke = "2"; var dbnm4left = "0"; var dbnm4top = "0"; 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();