// 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-231.29 297.34l-0.41 1.44 -0.9 4.51c5.3,0.23 10.51,0.75 15.73,1.26l0.98 -6.1 0 0 -15.4 -1.11zm-4.15 20.68c-3.81,20.16 -7.39,40.33 -11.16,60.49 -4.93,28.29 -9.14,56.3 -12.89,84.13 -5.27,40.59 -8.3,80.41 -9.8,119.7l-0.25 3.04 16.24 2.89 0.15 -2.51c1.34,-24.62 3.54,-50.18 6.44,-76.49 3.55,-32.31 7.97,-64.83 12.88,-97.46l9.91 -63.53 4.67 -28.99c-5.27,-0.54 -10.67,-0.96 -16.19,-1.27zm168.15 -19.99l0.19 1.74 0.6 4.22c5.27,-0.52 10.49,-0.87 15.7,-1.05l-0.66 -4.18 -0.06 -0.67 -15.77 -0.06zm2.88 20.71l3.83 26.88 14.3 91.61 10.86 72.5c3.41,25.04 6.27,50.08 8.44,75.11l16.74 -2.17 -2.7 -34.34c-1.72,-17.56 -4.22,-35.01 -6.33,-52.52 -5.19,-35.57 -10.77,-71.02 -16.8,-106.33 -4.13,-23.97 -8.4,-47.95 -12.36,-71.92 -4.45,0.18 -9.76,0.56 -15.98,1.18zm-200.72 -89.86c-22.03,5.47 -42.23,9.35 -58.88,10.13l-5.31 -0.33 -1.36 28.39 6.7 -0.39c15.75,0.78 35.95,-1.53 60.71,-7l5.96 -0.68 1.56 -17.91 -3.64 -13.02 -5.74 0.81zm-321.3 1.12c22.04,5.47 42.24,9.35 58.89,10.13l5.3 -0.32 1.37 28.38 -6.71 -0.39c-15.74,0.78 -35.94,-1.53 -60.71,-7l-5.96 -0.68 -1.55 -17.91 3.64 -13.02 5.73 0.81zm67.01 49.51l4.26 0.2c58.51,3.41 117.73,2.88 177.49,-0.59l5.71 -1.25 5.46 65 -8.12 0.32c-62.72,5.56 -124,6 -183.29,-0.63l-5.55 -1.33 4.04 -61.72zm-33.74 -201.37c13,-6.74 19.48,-11 33.18,-14.92 10.19,-2.92 30.35,-6.83 59.18,-10.55 2.47,3.05 4.06,5.94 7,8.97 3.98,9.18 7.28,18.5 10.21,27.86l0.7 2.25 0 0c-0.07,-6.34 -0.25,-12.73 -0.85,-19.33 -0.7,-2.07 0.61,-3.72 2.72,-3.86 1.83,-0.12 3.06,1.18 2.63,2.98 -0.24,1.02 -1.15,1.57 -2.26,1.92 0.9,9.59 0.96,18.92 0.78,28.34 0.9,3.09 1.8,6.27 2.69,9.5l21.95 -0.42 4.55 -14.52c-0.26,-3.73 -0.55,-7.45 -0.77,-11.2 -0.23,-4.08 0.04,-7.9 0.06,-11.86 -2.05,-0.74 -2.86,-2.09 -2.03,-3.6 0.72,-1.33 2.15,-1.54 3.72,-0.84 1.66,0.74 2.34,2.38 1.37,3.58 -0.12,2.9 -0.15,5.79 -0.2,8.68 -0.04,2.36 0.07,4.9 0.27,7.5l0.84 -2.7c2.45,-8.38 5.33,-16.47 8.72,-24.23l7.32 -8.99c16.19,3.11 30.87,3.94 47.54,7.55 15.75,3.42 27.39,7.69 35.48,12.04 3.11,1.67 6.39,3.57 9.56,4.53l12.92 -8.2 -108.12 -62.18 -71.56 0 -99.46 64.45 11.86 7.25zm119.2 3.53c0.06,1.4 -0.82,2.37 -2.36,2.72 -1.29,0.29 -2.58,-0.28 -3.14,-1.48 -0.46,-0.98 -0.07,-2.07 1.02,-2.92 0.7,-0.54 1.61,-0.67 2.74,-0.36 2.41,-1.9 4.9,-1.71 7.27,-2.73l-3.34 -1.01 -1.16 -3.04c2.58,0.72 5.43,1.64 8.56,2.76l4.97 -1.95 -1.27 3.03 -0.53 0.06c1.63,0.81 3.27,1.46 4.9,2.43 1.23,-0.27 2.27,-0.09 3.03,0.73 0.87,0.94 1.17,2.11 0.45,3.22 -0.62,0.97 -2.15,1.39 -3.35,1 -1.38,-0.46 -2.09,-1.67 -1.95,-2.98 -2.1,-0.92 -4.25,-1.97 -6.3,-2.75 -3.23,1.2 -6.53,1.7 -9.54,3.27zm19.33 -0.87c0.38,0.2 0.73,0.51 0.78,1.08 0.05,0.6 -0.22,0.92 -0.63,1.02 0.18,-0.69 0.14,-1.39 -0.15,-2.1zm-22.77 0.43c0.1,0.13 0.11,0.25 0.02,0.36 -0.47,0.4 -0.45,0.94 -0.34,1.5 -0.42,-0.17 -0.74,-0.48 -0.5,-1.05 0.13,-0.31 0.45,-0.55 0.82,-0.81zm9.17 5.04l2.41 1.41 1.91 -1.17 -1.45 4.67 -0.53 -0.29 -0.72 0.72 -1.62 -5.34zm-2.38 5.87c-0.85,-1.11 -1.96,-1.64 -3.36,-1.11 -1.43,0.54 -2.05,1.67 -1.88,2.96 0.18,1.26 1.13,2.18 2.48,2.34 1.31,0.15 2.25,-0.38 2.83,-1.3l9.11 -0.03c0.34,0.8 1.23,1.43 2.91,1.34 1.36,-0.08 2.31,-1.13 2.39,-2.67 0.08,-1.51 -0.94,-2.37 -2.4,-2.68 -1.18,-0.26 -2.08,0.18 -2.81,1.19l-9.27 -0.04zm-3.4 0.6c-1.06,0.67 -0.69,2.22 0.58,2.23 -0.53,-0.61 -0.7,-1.36 -0.58,-2.23zm16 -0.13c0.4,0.24 0.78,0.69 0.69,1.4 -0.11,0.84 -0.71,1.11 -1.34,1.09 0.5,-0.65 0.7,-1.48 0.65,-2.49zm-131.99 498.22l-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-439.44 59.9c8.9,-0.36 17.93,-0.24 27.05,0.23 -2.68,3.65 -5.48,9.76 -8.33,16.67 -1.73,5.06 -3.35,10.13 -4.89,15.19l-0.9 0c-1.3,-4.69 -3.02,-9.78 -4.85,-14.99 -2.75,-7.56 -5.45,-13.36 -8.08,-17.1zm173.4 159.34c-27.37,7.45 -46.52,10.85 -58.79,10.84l-1.45 8.79 2.27 0.14c16.65,-0.78 36.85,-4.66 58.88,-10.13l2.61 -0.37 -3.52 -9.27zm-248.95 40.86c58.99,1.93 119.04,1.39 180,-1.25l1.79 19.29 -4.47 0.98c-59.76,3.47 -118.98,4 -177.49,0.59l-2.13 -0.1 2.3 -19.51zm183.91 82.95l-1.57 19.78c-64,5.7 -126.37,6.17 -186.52,-0.43l-0.93 -20.36 2.19 0.52c59.29,6.63 120.57,6.19 183.29,0.63l3.54 -0.14zm-254.44 -122.69c27.38,7.46 46.53,10.85 58.79,10.84l1.46 8.79 -2.27 0.14c-16.65,-0.78 -36.85,-4.66 -58.89,-10.13l-2.61 -0.37 3.52 -9.27zm61.18 47.63l-3.1 8.4c-15.76,1.16 -37.1,-1.45 -61.36,-6.02l-1.33 -9.78 1.84 0.21c24.77,5.47 44.97,7.78 60.71,7l3.24 0.19zm197.12 -1.12l3.11 8.39c15.75,1.16 37.1,-1.44 61.36,-6.02l1.32 -9.77 -1.84 0.21c-24.76,5.47 -44.96,7.78 -60.71,7l-3.24 0.19zm116.36 33.32l-0.71 4.86 0 0c-1.78,-0.16 -3.54,-0.33 -5.3,-0.5l0.98 -6.1 0 0 5.03 1.74zm-2.91 19.7l-3.75 25.41 -16.05 108.72c-6.45,44.41 -10.91,88.59 -13.85,132.61l-0.53 2.59 -5.35 -0.95 0.15 -2.51c1.34,-24.62 3.54,-50.18 6.44,-76.49 3.55,-32.31 7.97,-64.83 12.88,-97.46l9.91 -63.53 4.67 -28.99c1.84,0.19 3.67,0.39 5.48,0.61l0 -0.01zm141.31 -19.67l0.58 4.35c1.8,-0.21 3.59,-0.41 5.38,-0.58l-0.6 -4.22 -0.19 -1.74 -5.17 2.19zm21.66 2.72c1.43,-0.05 2.87,-0.09 4.3,-0.12l0 0.01 -0.74 -4.23 -4.28 -0.51 0.06 0.67 0.66 4.18zm-19.13 16.39l2.57 19.41 17.19 113.62c7.17,43.74 12.84,88.2 17.28,133.25l5.91 -0.77 0 0c-2.17,-25.03 -5.03,-50.07 -8.44,-75.11l-10.86 -72.5 -14.3 -91.61 -3.83 -26.88c-1.76,0.18 -3.6,0.37 -5.52,0.59zm59.69 263.34l4.49 -0.58 -8.79 -86.13c-3.84,-28.11 -8.71,-58.65 -13.98,-90.14l-15.43 -88.38 0 0c-1.38,0.02 -2.87,0.06 -4.48,0.12 3.96,23.97 8.23,47.95 12.36,71.92 6.03,35.31 11.61,70.76 16.8,106.33 2.11,17.51 4.61,34.96 6.33,52.52l2.7 34.34zm-259.3 2.71l-9.43 -1.67 7.91 -53.52c2.26,-32.22 6,-65.23 10.93,-98.88 4.58,-30.56 10.03,-61.35 15.91,-92.24l4.4 -21.28c1.47,0.07 2.93,0.14 4.38,0.23 -3.81,20.16 -7.39,40.33 -11.16,60.49 -4.93,28.29 -9.14,56.3 -12.89,84.13 -5.27,40.59 -8.3,80.41 -9.8,119.7l-0.25 3.04zm32.75 -282.21l0.94 -4.56 4.56 -1.27 -0.41 1.44 -0.9 4.51c-1.39,-0.06 -2.79,-0.1 -4.19,-0.12zm-328.23 -232.28l-1.97 12.73 10.97 0.35c0.72,1.04 4.24,0.97 12.62,-1.68 2.87,-0.91 5.08,-2.41 7.7,-3.55 8.36,-3.67 17.28,-6.22 26.68,-7.74 11.98,-1.93 23.15,-4.55 34.81,-6.41 7.06,-1.12 13.93,-1.8 20.41,-2.95 -2.94,-3.03 -4.53,-5.92 -7,-8.97 -28.83,3.72 -48.99,7.63 -59.18,10.55 -13.7,3.92 -20.18,8.18 -33.18,14.92l-11.86 -7.25zm98.54 -51.82c0.55,3.75 1.53,7.48 2.94,11.21 1.41,3.77 3.27,7.54 5.54,11.34 1.71,2.85 3.68,5.6 5.65,8.35 3.84,5.36 7.68,10.72 10.06,17.58l0.41 1.16c-1.39,0.42 -2.23,1.58 -2.02,3.05l-1.13 -3.25c-2.24,-6.44 -5.97,-11.64 -9.69,-16.84 -1.97,-2.76 -3.95,-5.52 -5.77,-8.56 -2.37,-3.96 -4.3,-7.88 -5.78,-11.8 -1.48,-3.94 -2.51,-7.87 -3.09,-11.82l2.88 -0.42zm26.21 54.26l2.23 6.41c-0.14,0.07 -0.27,0.15 -0.4,0.25 -1.09,0.85 -1.48,1.94 -1.02,2.92 0.54,1.17 1.78,1.74 3.04,1.5l2.32 6.67c-1.34,0.55 -1.92,1.66 -1.75,2.91 0.18,1.26 1.13,2.18 2.48,2.34 0.39,0.04 0.76,0.03 1.09,-0.04l1.86 5.35 8.73 -0.44c0.57,-1.62 1.15,-3.29 1.73,-5 0.39,0.12 0.87,0.17 1.44,0.14 0.88,-0.05 1.59,-0.51 2,-1.24 -0.87,2.59 -1.77,5.23 -2.77,7.99l-0.32 0.92 -12.84 0.65 -7.56 -21.72c-0.14,-3.14 -0.34,-6.3 -0.64,-9.48 0.13,-0.04 0.25,-0.08 0.38,-0.13zm2.77 7.97l0.1 0.3c-0.45,0.4 -0.43,0.94 -0.32,1.49 -0.42,-0.17 -0.74,-0.48 -0.5,-1.05 0.12,-0.28 0.39,-0.5 0.72,-0.74zm22.87 -0.5c0.38,0.2 0.73,0.51 0.78,1.08 0.05,0.6 -0.22,0.92 -0.63,1.02 0.18,-0.69 0.14,-1.39 -0.15,-2.1zm-3.62 10.26l0.31 -0.93c0.66,-1.98 1.31,-3.97 1.98,-5.94 1.16,0.28 2.56,-0.15 3.14,-1.06 0.72,-1.11 0.42,-2.28 -0.45,-3.22 -0.29,-0.31 -0.62,-0.53 -0.98,-0.67 0.73,-2.06 1.49,-4.12 2.29,-6.17 0.18,0.08 0.37,0.16 0.57,0.23 -0.01,2.36 -0.11,4.67 -0.14,7.01 -1.27,3.56 -2.45,7.14 -3.64,10.73l-1 3c0.02,-0.12 0.03,-0.24 0.04,-0.37 0.07,-1.4 -0.81,-2.25 -2.12,-2.61zm8.08 -22.38c0.36,-0.86 0.74,-1.72 1.12,-2.57 2.72,-6.04 6.17,-11.17 9.64,-16.33 2.87,-4.26 5.75,-8.54 8.2,-13.35 1.6,-3.13 2.92,-6.29 3.9,-9.47 0.98,-3.17 1.63,-6.39 1.89,-9.67l2.9 0.23c-0.27,3.49 -0.97,6.92 -2.01,10.3 -1.03,3.36 -2.41,6.67 -4.08,9.93 -2.51,4.93 -5.46,9.3 -8.38,13.65 -3.4,5.05 -6.79,10.08 -9.4,15.9 -0.53,1.17 -1.04,2.35 -1.53,3.54 -0.16,-0.79 -0.8,-1.54 -1.78,-1.98 -0.16,-0.07 -0.32,-0.13 -0.47,-0.18zm-23.84 24.06c-1.06,0.67 -0.69,2.22 0.58,2.23 -0.53,-0.61 -0.7,-1.36 -0.58,-2.23zm16 -0.13c0.4,0.24 0.78,0.69 0.69,1.4 -0.11,0.84 -0.71,1.11 -1.34,1.09 0.5,-0.65 0.7,-1.48 0.65,-2.49zm19.31 -30.92c11.88,2.39 23.24,3.3 35.17,5.91 11.65,2.54 23.47,4 35,6.99 7.4,1.92 14.44,5.73 21.8,8.2 6.59,2.21 10.81,2.46 11.13,0.86l2.15 -5.82 -5.35 -1.01c-3.17,-0.96 -6.45,-2.86 -9.56,-4.53 -8.09,-4.35 -19.73,-8.62 -35.48,-12.04 -16.67,-3.61 -31.35,-4.44 -47.54,-7.55l-7.32 8.99zm-62.28 -38.85c8.98,0.14 17.23,-0.57 26.31,-0.42 9.93,0.16 19.86,0.27 29.79,0.46 4.6,0.08 9.19,0.32 13.8,0.35l-1.99 5.8c-4.09,0.09 -8.17,0.17 -12.26,0.26 -9.64,0.2 -19.29,0.07 -28.93,-0.2 -8.26,-0.23 -16.53,-0.29 -24.79,-0.44l-1.93 -5.81zm-89.02 567.99l-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>');color4 = 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');color5 = new fabric.Path('M600 0l-50 0 0 9.17 50 0 0 -9.17zm-585.08 227.19l3.67 1.56c19.75,5.62 38.73,9.09 56.6,9.5l3.13 -0.16 0.08 28.71 -3.99 -1.4c-22.3,0.13 -41.41,-2.18 -57.46,-6.84l-13.75 -10.78 11.72 -20.59zm516.98 66.19l0.49 4.37c5.26,0.36 10.51,1.04 15.75,2.05l-0.38 -2.87 -0.53 -3.55 -15.33 0zm-165.63 2.75l-0.39 3.03c4.79,-1.14 10.36,-1.8 16.46,-2.13l0.39 -3.27 0.19 -1.47 -16.18 0.21 -0.47 3.63zm-2.21 17.19l-2.17 16.91 -9.13 65.97 -12.97 95.33c-3.67,28.86 -6.89,57.72 -9.78,86.58l-0.62 3.73 13.51 5.88 2.31 -5.43c3.6,-30.32 7.48,-60.64 11.6,-90.96l17.13 -123.69 6.71 -56.38c-6.94,0.38 -12.48,1.06 -16.59,2.06zm169.94 -1.47l1.12 9.88c2.39,18.2 4.98,36.39 7.72,54.59l12.08 77.83c4.31,26.93 8.12,53.94 11.49,81.04 2.1,17.02 3.7,34.16 5.1,51.35l12.77 -3.34 0.75 -7.69 -1.49 -30.6 -1.44 -20.58 -5.16 -39.92 -9.59 -62.95 -11.75 -71.78c-1.95,-11.92 -3.79,-23.84 -5.49,-35.73 -4.91,-1.13 -10.31,-1.8 -16.11,-2.1zm-486.32 -227.66c7.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 -90.63 -45.32 -72.27 0 -83.2 54.69 -1.98 23.05zm285.43 143l-3.74 1.56c-20.08,5.62 -39.38,9.09 -57.56,9.5l-3.18 -0.16 -0.08 28.71 4.05 -1.4c22.68,0.13 42.12,-2.18 58.44,-6.84l13.98 -10.78 -11.91 -20.59zm-251.65 49.27l7.42 1.18c55.27,2.21 111.88,2.12 169.63,0.04l6.73 -0.73 12.89 54.59 -15.82 7.37c-58.74,4.66 -117.35,4.85 -175.83,-0.39l-11.04 -5.13 6.02 -56.93zm-31.46 314.37l-50 0 0 9.17 50 0 0 -9.17z');color6 = new fabric.Path('M600 0l-50 0 0 9.17 50 0 0 -9.17zm-211.62 292.21l-0.51 4.6 0 0c-1.89,0.05 -3.73,0.12 -5.53,0.22l0.39 -3.27 0.19 -1.47 5.46 -0.08zm149.15 87.74l14.09 92.39c5.88,36.99 10.49,74.26 14.02,111.78l0.63 3.79 5.25 -1.37 -0.01 0c-1.4,-17.19 -3,-34.33 -5.1,-51.35 -3.37,-27.1 -7.18,-54.11 -11.49,-81.04l-12.08 -77.83c-2.74,-18.2 -5.33,-36.39 -7.72,-54.59l-1.12 -9.88c-1.88,-0.09 -3.79,-0.15 -5.74,-0.17 2.48,22.76 5.95,46.01 9.27,68.27zm46.75 203.25l2.18 -0.56 -1.05 -28.65 -4.42 -71.68c-3.4,-26.38 -7.51,-52.85 -12.08,-79.37l-13.56 -82.5 -0.8 -5.29c-1.43,-0.45 -2.91,-0.84 -4.44,-1.2 1.7,11.89 3.54,23.81 5.49,35.73l11.75 71.78 9.59 62.95 5.16 39.92 1.44 20.58 1.49 30.6 -0.75 7.69zm-31.92 -282.52l-0.4 -2.69 -0.62 -4.61 -4.11 0 0.53 3.55 0.38 2.87c1.41,0.27 2.82,0.56 4.22,0.88l0 0zm-20.46 -7.3l-5.4 0c0.11,1.37 0.23,2.74 0.35,4.11 1.85,0.05 3.7,0.13 5.54,0.26l-0.49 -4.37zm-166.02 5.78c-1.58,0.37 -3.08,0.8 -4.48,1.29l0.37 -2.74 0.75 -5.16 4.22 -0.05 -0.47 3.63 -0.39 3.03zm20.41 11.86l-3.15 28.49c-4.04,34.04 -8.59,68.05 -13.42,102.05l-11 79c-2.87,20.97 -5.53,41.89 -8.11,62.79l-1.86 6.91 -5.85 -2.54 2.31 -5.43c3.6,-30.32 7.48,-60.64 11.6,-90.96l17.13 -123.69 6.71 -56.38c1.79,-0.1 3.67,-0.18 5.64,-0.24l0 0zm-56.9 270.82l-6.03 -2.62 5.53 -31.17c3.02,-28.65 6.29,-57.3 10.13,-85.96l9.79 -70.74 10.64 -76.48 0.01 -0.05c1.25,-0.56 2.78,-1.06 4.6,-1.5l-2.17 16.91 -9.13 65.97 -12.97 95.33c-3.67,28.86 -6.89,57.72 -9.78,86.58l-0.62 3.73zm-196.21 -562.34c13.06,-3.2 26.63,-4.82 40.49,-4.82 13.82,-0.01 27.92,1.58 42.09,4.78l-0.6 2.63c-13.97,-3.15 -27.88,-4.72 -41.49,-4.71 -13.63,0 -26.98,1.59 -39.84,4.74l-0.65 -2.62zm-46.19 240.32c59.21,1.73 116.91,1.23 173.13,-1.47l3.32 18.8 -4.93 0.53c-57.75,2.08 -114.36,2.17 -169.63,-0.04l-4.39 -0.7 2.5 -17.12zm241.75 -39.91c-22.5,6.82 -41.38,9.95 -57.52,10.31l-0.65 7.97 1.24 0.06c18.18,-0.41 37.48,-3.88 57.56,-9.5l2.44 -1.01 -3.07 -7.83zm-57.78 46.06l1.97 7.26c23.42,2.06 38.46,-2.64 58.59,-5.43l2.04 -11.18 -2.52 1.94c-16.32,4.66 -35.76,6.97 -58.44,6.84l-1.64 0.57zm-251.75 -46.06c22.13,6.82 40.69,9.95 56.57,10.31l0.64 7.97 -1.23 0.06c-17.87,-0.41 -36.85,-3.88 -56.6,-9.5l-2.39 -1.01 3.01 -7.83zm56.82 46.06l-1.93 7.26c-23.04,2.06 -37.83,-2.64 -57.62,-5.43l-2.01 -11.18 2.48 1.94c16.05,4.66 35.16,6.97 57.46,6.84l1.62 0.57zm191.74 70.4l-4.73 19.79c-61.75,6.36 -121.18,6.29 -178.25,-0.37l-1.91 -18.94 3.6 1.67c58.48,5.24 117.09,5.05 175.83,0.39l5.46 -2.54zm-217.77 254.46l-50 0 0 9.17 50 0 0 -9.17z'); var cl1='#FFFFFF'; $('#spncl1').css('background-color', cl1); var cl2='#282829'; $('#spncl2').css('background-color', cl2); var cl3='#ED3237'; $('#spncl3').css('background-color', cl3); 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(logo1.set({ left: 520, top: 545, scaleX: 15, scaleY: 15, flipY: false, strokeWidth: 0.03, stroke: '#191919', fill: '#ED3237' }));canvas.add(logo2.set({ left: 0, top: 0, scaleX: 0, scaleY: 0, flipY: false, strokeWidth: 0.03, stroke: '#191919', fill: '#FFFFFF' }));canvast.add(color4.set({ scaleX: 1, scaleY: 1, flipY: false, originX: "center", originY: "center", fill: cl1 }));canvast.add(color5.set({ scaleX: 1, scaleY: 1, flipY: false, originX: "center", originY: "center", fill: cl2 }));canvast.add(color6.set({ scaleX: 1, scaleY: 1, flipY: false, originX: "center", originY: "center", fill: cl3 }));color1.selectable=false;color2.selectable=false;color3.selectable=false;logo1.selectable=false;logo2.selectable=false;color4.selectable=false;color5.selectable=false;color6.selectable=false; var dbplnumber = "13"; var dbteam = "TEAM"; var dbplayer = "PLAYER"; var dbbtag = "btag.svg"; var dbfront3d = "../virtual3d_images/chicago_front_118.virtual"; var dbback3d = "../virtual3d_images/chicago_back_118.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 */ 631,636 $("#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);color4.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(); }); 632,637 $("#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);color5.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(); }); 633,638 $("#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);color6.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(); }); /*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.9"; var dbteamleft = "170"; var dbteamtop = "145"; 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 = "40"; var dbnm1stroke = "0.9"; var dbnm1left = "320"; var dbnm1top = "175"; var dbnm1angle = "-15"; 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 = "40"; var dbnm2stroke = "2"; var dbnm2left = "30"; var dbnm2top = "175"; var dbnm2angle = "15"; 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 = "0"; 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 = "0"; 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();