// 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('M199.25 65.01l-49.33 0 0 271.78 142.87 -121.44 -142.87 140 0 16.95 157.53 -133.9 -137.86 135.09 16.88 0 9.49 -8.07 0.97 -3.13 3.8 -0.92 109.31 -92.92 -95.54 93.62c3.46,0.78 8.02,1.57 13.53,2.5 11.18,1.59 24.07,2.92 37.43,4 10.18,0.83 20.92,0.95 32.14,0.67 3.54,0.02 5.49,-0.18 8.77,0.1 12.5,0.02 23.5,-0.07 28.08,-0.65 20.2,-1.78 35.6,-3.54 46.23,-5.73 8.58,-1.77 14.47,-3.59 17.98,-5l11.48 1.97 2.62 13.56 34.16 0 0 -308.48 -13.47 0 -27.71 23.55 2.7 5.65 19.73 -19.34 10.72 0.21 -28.15 23.94 3.25 6.8 20.86 -20.44 10.73 0.2 -29.35 24.94 1.98 4.14 -8.6 26.43 -9.48 4.25c-0.19,-2.63 -0.18,-5.73 0.13,-9.14 0.26,-3 -0.12,-6.23 -1.31,-9.69 -0.13,-0.31 -0.27,-0.63 -0.41,-0.94l-35.46 30.14 33.9 -33.23c-1.33,-2.43 -2.97,-4.94 -4.98,-7.54l-35.61 30.27 33.56 -32.89c-1.63,-2.09 -3.24,-4.17 -4.81,-6.25l-29.92 25.44 28.23 -27.67c-2.88,-3.84 -5.67,-7.68 -8.34,-11.57 -4.58,-6.65 -8.04,-12.79 -10.54,-18.49 -5.06,6.03 -11.23,11.67 -18.55,16.91 -6.65,4.8 -12.98,8.83 -19.11,12.32 -8.13,4.45 -16.06,7.68 -23.84,9.96 -6.33,-1.62 -12.56,-3.85 -18.63,-7.03 -7.92,-4.13 -15.26,-8.54 -21.89,-13.28 -8.14,-5.46 -15.32,-11.79 -21.9,-18.64 -1.45,3.21 -2.97,7.3 -5.03,11.12 -3.9,7.17 -8.19,14.12 -12.7,20.93 -4.12,6.3 -8.85,11.5 -12.26,18.02 -2.06,3.42 -2.94,7.28 -2.93,11.48 -0.06,5.5 -1.1,11.62 -0.39,12.59l-4.39 0.3 -17.04 -43.7 13.34 -39.75zm195.24 0l9.12 19.08 19.47 -19.08 -28.59 0z');color3 = new fabric.Path('M200.72 440.06l8.21 75.13 54.65 5.52 -49.55 40.62 1.96 17.46 -5.22 -1.06 -2.2 -19.64 39.01 -31.99 -43.03 -4.34 -6.47 -59.16 -19.96 56.42 -9.89 -1.05 0.18 -6.99 6.95 0.73 25.36 -71.65zm19.2 -404.4l0.55 1.55 -1.55 1.91 1 -3.46zm16.85 47.23l16.49 46.24 99.18 -3.21 -78.59 60.59 33.69 93.34 -81.91 -56.02 -78.36 60.89 27.97 -95.21 -82.12 -55.71 99.2 -2.82 1.62 -5.62 5.32 13.65 -0.19 0.69 -78.11 2.22 64.66 43.86 -22.02 74.97 61.7 -47.94 64.49 44.1 -26.53 -73.49 61.88 -47.7 -78.09 2.52 -16.05 -44.99c1.59,-2.67 3.14,-5.37 4.62,-8.11 0.4,-0.74 0.78,-1.49 1.15,-2.25zm-8.23 14.41l0.59 -0.44 -0.11 -0.33 -0.48 0.77zm-7.16 11.05l9.34 -7.05 -1.19 -3.34 -2.65 2c-1.3,2.05 -2.62,4.09 -3.96,6.11 -0.5,0.78 -1.02,1.54 -1.54,2.28zm-8.68 12.2l19.61 -14.8 -1.2 -3.34 -11.95 9.02c-2.23,3.03 -4.47,5.96 -6.46,9.12zm-4.25 8.85l25.44 -19.19 -1.19 -3.35 -21.49 16.22c-0.19,0.33 -0.37,0.67 -0.55,1.01 -1.01,1.67 -1.73,3.45 -2.21,5.31zm-0.72 6.19l27.75 -20.94 -1.19 -3.34 -26.2 19.77c-0.25,1.44 -0.36,2.94 -0.36,4.49l0 0.02zm-7.06 7.03l-0.41 0.01 -34.54 26.06 2.97 2.01 33.17 -25.03 -1.19 -3.05zm6.74 -1.14l29.66 -22.38 -1.19 -3.34 -28.18 21.26c-0.06,1.52 -0.18,3.05 -0.29,4.46zm-9.08 1.21l-5.85 0.17 -30.7 23.16 2.96 2.01 33.59 -25.34zm-7.78 0.22l-5.85 0.17 -26.86 20.27 2.96 2 29.75 -22.44zm-7.78 0.22l-5.84 0.17 -23.03 17.37 2.96 2.01 25.91 -19.55zm-7.78 0.22l-5.84 0.17 -19.19 14.48 2.96 2.01 22.07 -16.66zm-7.77 0.22l-5.85 0.17 -15.35 11.58 2.96 2.01 18.24 -13.76zm-7.78 0.23l-5.85 0.16 -11.51 8.69 2.96 2.01 14.4 -10.86zm-7.78 0.22l-5.85 0.16 -7.68 5.8 2.97 2.01 10.56 -7.97zm-7.78 0.22l-5.84 0.16 -3.85 2.9 2.97 2.01 6.72 -5.07zm-7.78 0.22l-5.84 0.17 -0.01 0 2.96 2.01 2.89 -2.18zm33.57 26.91l2.96 2.01 33.29 -25.12 -2.97 0.2 -0.66 -1.71 -32.62 24.62zm37.46 -24.03l31.53 -23.78 -1.2 -3.35 -30.17 22.76c-0.15,1.87 -0.25,3.43 -0.16,4.37zm-33.52 26.7l2.96 2.01 63.67 -48.05 -1.19 -3.34 -65.44 49.38zm3.94 2.67l2.96 2.01 61.32 -46.27 -1.19 -3.34 -63.09 47.6zm3.94 2.68l2.96 2.01 58.97 -44.49 -1.19 -3.35 -60.74 45.83zm3.94 2.67l2.96 2.01 56.72 -42.8 -0.13 0.01 -1.17 -3.27 -58.38 44.05zm3.5 3.01l-1.6 5.45 65.6 -49.5 -5.88 0.19 -58.12 43.86zm-2.13 7.25l-1.61 5.46 75.56 -57.01 -5.88 0.19 -68.07 51.36zm-2.13 7.26l-1.61 5.45 85.51 -64.51 -5.88 0.19 -78.02 58.87zm-2.14 7.26l-1.6 5.45 95.46 -72.03 -5.88 0.19 -87.98 66.39zm-2.13 7.25l-1.6 5.46 105.41 -79.54 -5.88 0.19 -97.93 73.89zm-2.13 7.26l-1.6 5.45 115.36 -87.04 -5.88 0.19 -107.88 81.4zm-2.13 7.25l-1.6 5.46 125.31 -94.55 -5.88 0.19 -117.83 88.9zm-2.13 7.26l-1.6 5.45 135.26 -102.06 -5.88 0.19 -127.78 96.42zm-2.13 7.26l-1.61 5.45 145.22 -109.57 -5.88 0.19 -137.73 103.93zm-2.14 7.25l-0.69 2.39 56.14 -43.63 2.54 1.74 33.23 -25.08 -1.21 -3.33 -90.01 67.91zm58.96 -38.84l2.95 2.02 30.91 -23.32 -1.2 -3.33 -32.66 24.63zm3.93 2.69l2.95 2.02 28.58 -21.57 -1.2 -3.34 -30.33 22.89zm3.92 2.68l2.96 2.02 26.25 -19.81 -1.2 -3.34 -28.01 21.13zm3.93 2.69l2.95 2.02 23.94 -18.06 -1.21 -3.34 -25.68 19.38zm3.93 2.69l2.95 2.01 21.61 -16.3 -1.2 -3.34 -23.36 17.63zm3.92 2.68l2.95 2.02 19.29 -14.56 -1.2 -3.33 -21.04 15.87zm3.93 2.69l2.95 2.01 16.96 -12.8 -1.2 -3.33 -18.71 14.12zm3.92 2.68l2.95 2.02 14.65 -11.05 -1.21 -3.33 -16.39 12.36zm3.93 2.69l2.95 2.01 12.32 -9.29 -1.21 -3.34 -14.06 10.62zm3.93 2.68l2.95 2.02 9.99 -7.54 -1.2 -3.34 -11.74 8.86zm3.92 2.69l2.95 2.02 7.67 -5.79 -1.2 -3.34 -9.42 7.11zm3.93 2.68l2.95 2.02 5.35 -4.03 -1.21 -3.34 -7.09 5.35zm3.92 2.69l2.95 2.02 3.03 -2.29 -1.21 -3.33 -4.77 3.6zm3.93 2.68l2.95 2.02 0.7 -0.53 -1.2 -3.33 -2.45 1.84zm3.93 2.69l0.2 0.14 -0.08 -0.23 -0.12 0.09zm-74.64 328.24l-2.68 -0.54 2.4 -1.93 0.28 2.47zm-3.63 -0.74l-2.91 -0.59 5.86 -4.71 0.3 2.69 -3.25 2.61zm-3.87 -0.79l-2.91 -0.59 9.33 -7.49 0.3 2.69 -6.72 5.39zm-3.87 -0.78l-2.91 -0.6 12.8 -10.26 0.3 2.68 -10.19 8.18zm-3.87 -0.79l-2.91 -0.6 16.27 -13.05 0.3 2.69 -13.66 10.96zm-3.87 -0.79l-2.9 -0.59 19.73 -15.83 0.3 2.68 -17.13 13.74zm-3.86 -0.79l-2.91 -0.59 55.55 -44.56 3.24 0.33 -55.88 44.82zm-3.87 -0.79l-2.91 -0.59 55.11 -44.2 3.24 0.32 -55.44 44.47zm-3.87 -0.79l-2.91 -0.59 54.67 -43.85 3.24 0.33 -55 44.11zm-3.87 -0.79l-2.9 -0.59 54.22 -43.49 3.24 0.32 -54.56 43.76zm-3.86 -0.79l-2.91 -0.59 53.78 -43.14 3.24 0.33 -54.11 43.4zm-3.68 -0.94l0.08 -2.99 50.17 -40.23 3.23 0.32 -53.48 42.9zm0.1 -3.97l0.08 -2.99 45.76 -36.69 3.24 0.32 -49.08 39.36zm0.11 -3.98l0.08 -2.98 41.34 -33.16 3.24 0.33 -44.66 35.81zm0.1 -3.97l0.06 -2.14 0.41 -1.16 36.54 -29.31 3.24 0.33 -40.25 32.28zm0.12 -4.34l0.06 -2.62 35.4 -28.39 0.29 2.63 0.07 0.01 -35.65 28.59 -0.17 -0.22zm0.09 -3.61l0.08 -2.98 34.9 -28 0.29 2.7 -35.27 28.28zm0.1 -3.97l0.08 -2.99 34.41 -27.59 0.29 2.69 -34.78 27.89zm0.11 -3.97l0.08 -2.99 33.91 -27.2 0.29 2.69 -34.28 27.5zm0.1 -3.98l0.08 -2.99 33.42 -26.8 0.29 2.69 -33.79 27.1zm0.1 -3.97l0.08 -2.99 10.54 -8.45 0.58 0.06 0.26 -0.73 21.55 -17.29 0.29 2.69 -33.3 26.71zm0.11 -3.98l0.08 -2.98 6.14 -4.93 3.22 0.34 -9.44 7.57zm0.1 -3.97l0.08 -2.99 1.76 -1.41 3.22 0.34 -5.06 4.06zm0.11 -3.97l0.01 -0.61 0.66 0.07 -0.67 0.54zm29.05 -50.79l-0.13 0.36 0.15 -0.13 -0.02 -0.23zm-0.61 1.7l-1.45 4.09 2.47 -1.98 -0.29 -2.69 -0.73 0.58zm-1.92 5.44l-1.45 4.08 4.78 -3.83 -0.29 -2.69 -3.04 2.44zm-1.92 5.43l-1.45 4.08 7.09 -5.69 -0.29 -2.68 -5.35 4.29zm-1.93 5.43l-1.44 4.09 9.4 -7.55 -0.29 -2.69 -7.67 6.15zm-1.92 5.43l-1.44 4.09 11.71 -9.4 -0.29 -2.69 -9.98 8zm-1.92 5.44l-1.45 4.08 14.04 -11.25 -0.3 -2.69 -12.29 9.86zm-1.92 5.43l-1.45 4.08 16.35 -13.11 -0.3 -2.69 -14.6 11.72zm-1.93 5.43l-1.44 4.08 18.66 -14.96 -0.3 -2.69 -16.92 13.57zm-1.92 5.43l-1.45 4.09 20.98 -16.82 -0.3 -2.69 -19.23 15.42z');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('M395.65 155.86c-5.17,1.17 -14.44,0.62 -21.05,0.56 -15.69,-0.15 -30.71,-1.4 -45.16,-2.44 -12.95,-1.47 -28.57,-1.67 -46.29,-0.88 -11.54,0.91 -23.71,1.62 -37.01,2.02l0.6 0.59 -0.69 -0.59c-2.88,0.09 -5.81,0.17 -8.8,0.22 -12.56,0.28 -26.5,0.72 -31.7,-2.73l-6.2 -4.3 -7.78 -20.33 1.81 -7.88 -1.77 -5.44 1.01 -2.11 -29.72 0 0 260.94 30.55 0 3.48 -11.2 11.05 -0.64c2.3,1.72 8.59,4.84 19.55,6.69 11.33,1.95 23.4,2.74 37.03,2.89 10.21,0.11 21.8,-0.05 33.04,0.08 3.82,0.12 5.35,0.09 8.77,0.1 12.58,-0.13 23.09,-0.41 28.08,-0.81 20.32,-1.03 36.75,-1.06 47.44,-2.89 7.23,-1.24 11.72,-2.28 15.24,-3.83 -0.57,-0.6 -1.17,-1.2 -1.81,-1.81l-95.54 -93.62 108.25 92.01 2.11 -0.53 0.34 1.78 2.41 0.58 0.97 3.13 9.49 8.07 16.88 0 -137.87 -135.09 157.54 133.9 0 -16.95 -142.87 -140 142.87 121.44 0 -224.24 -39.03 0 -6.13 15.72 3.4 18.65 -15.78 5.59c-0.76,1.49 -3.16,2.54 -6.71,3.35z');color6 = new fabric.Path('M409.1 440.06l-8.21 75.13 -54.65 5.52 49.54 40.62 -1.96 17.46 5.22 -1.06 2.21 -19.64 -39.01 -31.99 43.03 -4.34 6.46 -59.16 19.97 56.42 9.88 -1.05 -0.18 -6.99 -6.94 0.73 -25.36 -71.65zm-116.89 -287.28l43.76 33.73 -33.7 93.34 81.91 -56.02 78.36 60.89 -27.97 -95.21 82.13 -55.71 -99.2 -2.82 -1.63 -5.62 -1.13 2.91 2.11 11.6 72 2.05 -64.66 43.86 22.02 74.97 -61.69 -47.94 -64.49 44.1 26.53 -73.49 -39.9 -30.75c-4.61,-0.06 -9.44,-0.02 -14.45,0.11zm123.95 -5.16l27.93 21.07 -2.96 2.01 -28.79 -21.72 3.82 -1.36zm1.24 -4.71l30.63 23.11 -2.96 2.01 -27.64 -20.86 0.71 -0.25 -0.74 -4.01zm1.87 0l5.84 0.17 26.86 20.27 -2.96 2 -29.74 -22.44zm7.77 0.22l5.85 0.17 23.03 17.37 -2.97 2.01 -25.91 -19.55zm7.78 0.22l5.85 0.17 19.19 14.48 -2.96 2.01 -22.08 -16.66zm7.78 0.22l5.85 0.17 15.35 11.58 -2.96 2.01 -18.24 -13.76zm7.78 0.23l5.84 0.16 11.52 8.69 -2.96 2.01 -14.4 -10.86zm7.78 0.22l5.84 0.16 7.68 5.8 -2.96 2.01 -10.56 -7.97zm7.77 0.22l5.85 0.16 3.84 2.9 -2.96 2.01 -6.73 -5.07zm7.78 0.22l5.85 0.17 0 0 -2.96 2.01 -2.89 -2.18zm-33.56 26.91l-2.96 2.01 -29.95 -22.6 3.83 -1.36 29.08 21.95zm-3.94 2.67l-2.96 2.01 -30.98 -23.38 0.09 -0.16 3.62 -1.28 30.23 22.81zm-3.94 2.67l-2.96 2.01 -31.19 -23.53c1.48,-0.47 2.64,-1.02 3.41,-1.67l30.74 23.19zm-3.94 2.68l-2.97 2.01 -33.17 -25.04c1.28,-0.11 2.45,-0.27 3.46,-0.5 0.39,-0.09 0.77,-0.18 1.13,-0.28l31.55 23.81zm-3.94 2.67l-2.97 2.01 -36.4 -27.47c1.89,0.01 3.75,-0.02 5.47,-0.11l33.9 25.57zm-3.5 3.01l1.6 5.45 -45.14 -34.06c1.85,0.04 3.82,0.1 5.78,0.12l37.76 28.49zm2.13 7.25l1.6 5.46 -54.92 -41.44c1.63,0.03 3.26,0.06 4.9,0.08l0.85 0.01 47.57 35.89zm2.13 7.26l1.6 5.45 -64.88 -48.95c1.95,0.08 3.92,0.15 5.9,0.21l57.38 43.29zm2.13 7.26l1.6 5.45 -75.04 -56.62c2.01,0.12 4.02,0.22 6.05,0.32l67.39 50.85zm2.13 7.25l1.61 5.46 -85.35 -64.4c2.04,0.14 4.09,0.27 6.16,0.4l77.58 58.54zm2.14 7.26l1.6 5.45 -95.75 -72.24c2.07,0.15 4.14,0.3 6.22,0.45l87.93 66.34zm2.13 7.25l1.6 5.46 -106.18 -80.12 0.34 0.04 5.9 0.43 98.34 74.19zm2.13 7.26l1.6 5.45 -116.78 -88.11c2.16,0.14 4.26,0.31 6.3,0.51l108.88 82.15zm2.13 7.26l1.6 5.45 -126.92 -95.77c2.04,0.07 4.04,0.16 5.98,0.27l119.34 90.05zm2.13 7.25l0.7 2.39 -56.14 -43.63 -2.54 1.74 -33.23 -25.08 1.2 -3.33 90.01 67.91zm-58.96 -38.84l-2.95 2.02 -30.9 -23.32 1.2 -3.33 32.65 24.63zm-3.92 2.69l-2.95 2.02 -28.59 -21.57 1.21 -3.34 30.33 22.89zm-3.93 2.68l-2.95 2.02 -26.26 -19.81 1.21 -3.34 28 21.13zm-3.92 2.69l-2.95 2.02 -23.94 -18.06 1.2 -3.34 25.69 19.38zm-3.93 2.69l-2.95 2.01 -21.61 -16.3 1.2 -3.34 23.36 17.63zm-3.93 2.68l-2.95 2.02 -19.29 -14.56 1.21 -3.33 21.03 15.87zm-3.92 2.69l-2.95 2.01 -16.97 -12.8 1.21 -3.33 18.71 14.12zm-3.93 2.68l-2.95 2.02 -14.64 -11.05 1.2 -3.33 16.39 12.36zm-3.92 2.69l-2.95 2.01 -12.32 -9.29 1.2 -3.34 14.07 10.62zm-3.93 2.68l-2.95 2.02 -9.99 -7.54 1.2 -3.34 11.74 8.86zm-3.93 2.69l-2.95 2.02 -7.67 -5.79 1.21 -3.34 9.41 7.11zm-3.92 2.68l-2.95 2.02 -5.35 -4.03 1.21 -3.34 7.09 5.35zm-3.93 2.69l-2.95 2.02 -3.02 -2.29 1.2 -3.33 4.77 3.6zm-3.92 2.68l-2.95 2.02 -0.7 -0.53 1.2 -3.33 2.45 1.84zm-3.93 2.69l-0.21 0.14 0.09 -0.23 0.12 0.09zm74.63 328.24l2.68 -0.54 -2.4 -1.93 -0.28 2.47zm3.64 -0.74l2.91 -0.59 -5.87 -4.71 -0.3 2.69 3.26 2.61zm3.87 -0.79l2.91 -0.59 -9.34 -7.49 -0.3 2.69 6.73 5.39zm3.87 -0.78l2.9 -0.6 -12.8 -10.26 -0.3 2.68 10.2 8.18zm3.86 -0.79l2.91 -0.6 -16.27 -13.05 -0.3 2.69 13.66 10.96zm3.87 -0.79l2.91 -0.59 -19.74 -15.83 -0.3 2.68 17.13 13.74zm3.87 -0.79l2.9 -0.59 -55.54 -44.56 -3.24 0.33 55.88 44.82zm3.87 -0.79l2.9 -0.59 -55.1 -44.2 -3.24 0.32 55.44 44.47zm3.87 -0.79l2.9 -0.59 -54.67 -43.85 -3.24 0.33 55.01 44.11zm3.86 -0.79l2.91 -0.59 -54.23 -43.49 -3.24 0.32 54.56 43.76zm3.87 -0.79l2.91 -0.59 -53.79 -43.14 -3.24 0.33 54.12 43.4zm3.68 -0.94l-0.08 -2.99 -50.17 -40.23 -3.24 0.32 53.49 42.9zm-0.11 -3.97l-0.08 -2.99 -45.75 -36.69 -3.24 0.32 49.07 39.36zm-0.1 -3.98l-0.08 -2.98 -41.34 -33.16 -3.24 0.33 44.66 35.81zm-0.11 -3.97l-0.05 -2.14 -0.42 -1.16 -36.53 -29.31 -3.24 0.33 40.24 32.28zm-0.11 -4.34l-0.07 -2.62 -35.39 -28.39 -0.29 2.63 -0.08 0.01 35.66 28.59 0.17 -0.22zm-0.09 -3.61l-0.08 -2.98 -34.9 -28 -0.3 2.7 35.28 28.28zm-0.11 -3.97l-0.08 -2.99 -34.4 -27.59 -0.3 2.69 34.78 27.89zm-0.1 -3.97l-0.08 -2.99 -33.91 -27.2 -0.3 2.69 34.29 27.5zm-0.1 -3.98l-0.08 -2.99 -33.42 -26.8 -0.29 2.69 33.79 27.1zm-0.11 -3.97l-0.08 -2.99 -10.53 -8.45 -0.58 0.06 -0.26 -0.73 -21.55 -17.29 -0.29 2.69 33.29 26.71zm-0.1 -3.98l-0.08 -2.98 -6.15 -4.93 -3.22 0.34 9.45 7.57zm-0.11 -3.97l-0.07 -2.99 -1.76 -1.41 -3.22 0.34 5.05 4.06zm-0.1 -3.97l-0.02 -0.61 -0.65 0.07 0.67 0.54zm-29.05 -50.79l0.13 0.36 -0.15 -0.13 0.02 -0.23zm0.61 1.7l1.44 4.09 -2.47 -1.98 0.3 -2.69 0.73 0.58zm1.92 5.44l1.44 4.08 -4.78 -3.83 0.29 -2.69 3.05 2.44zm1.92 5.43l1.45 4.08 -7.1 -5.69 0.3 -2.68 5.35 4.29zm1.92 5.43l1.45 4.09 -9.41 -7.55 0.3 -2.69 7.66 6.15zm1.93 5.43l1.44 4.09 -11.72 -9.4 0.3 -2.69 9.98 8zm1.92 5.44l1.44 4.08 -14.03 -11.25 0.29 -2.69 12.3 9.86zm1.92 5.43l1.44 4.08 -16.34 -13.11 0.29 -2.69 14.61 11.72zm1.92 5.43l1.45 4.08 -18.66 -14.96 0.29 -2.69 16.92 13.57zm1.93 5.43l1.44 4.09 -20.97 -16.82 0.29 -2.69 19.24 15.42z'); var cl1='#282829'; $('#spncl1').css('background-color', cl1); var cl2='#00AFEF'; $('#spncl2').css('background-color', cl2); var cl3='#FFFFFF'; $('#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: 240, top: 110, scaleX: 12, scaleY: 12, flipY: false, strokeWidth: 0.03, stroke: '#FFFFFF', fill: '#191919' }));canvas.add(logo2.set({ left: 0, top: 0, scaleX: 0, scaleY: 0, flipY: false, strokeWidth: 0, stroke: '', fill: '' }));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 = "4"; var dbteam = "TEAM"; var dbplayer = "PLAYER"; var dbbtag = "btag.svg"; var dbfront3d = "../virtual3d_images/star_front_57.virtual"; var dbback3d = "../virtual3d_images/star_back_57.virtual"; var dbtagleft = "360"; var dbtagtop = "345"; var dbtagsize = "33"; 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 */ 157,162 $("#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(); }); 158,163 $("#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(); }); 159,164 $("#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 = "35"; var dbteamstroke = "1"; var dbteamleft = "297"; var dbteamtop = "185"; 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 = "60"; var dbnm1stroke = "2"; var dbnm1left = "400"; var dbnm1top = "520"; 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 = "0"; var dbnm2stroke = "0"; var dbnm2left = "0"; var dbnm2top = "0"; 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 = "20"; var dbplayerstroke = "1"; var dbplayerleft = "300"; var dbplayertop = "190"; 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 = "80"; var dbnm3stroke = "2"; var dbnm3left = "305"; var dbnm3top = "255"; 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();