var css = ".pplr-p-right label{color:#000000} #pplr-preview-wrapper img,.pplr-p-left img{visibility:hidden} #pplr-preview{ position: fixed;left:0px;overflow-y: auto;top:-100%;bottom:0;width:100%;height:100%;margin: 0 auto;right: 0px;background: #fff;padding: 20px;z-index:9999999999;background: #f6f6f6;box-sizing:border-box;opacity:0; } #pplr-preview .close{ border: none; position: absolute; top: 0px; right: 0px; z-index: 9999; background: #fff; font-size: 30px; } #pplr-preview-wrapper{float:left;height:100%;max-height:100%;box-sizing:border-box;} .pplr-btn{margin: 10px 0px 10px 0;} .product-personalizer{ float: left; width: 100%; position: relative; } .pplr-preview-btn{margin: 20px 0px 0px 0;} .pplrloadingimage{position:absolute;width:100%;height:100%;top:0px;cursor:wait; z-index: 9999999;} .product-personalizer btn{ margin-top: 10px; } .pplr-swatch .tooltip { text-align: center; background: gray; color: #fff; bottom: 100%; padding: 10px; display: block; position: absolute; width: 100px; left: -23px; margin-bottom: 15px; filter: alpha(opacity=0); -khtml-opacity: 0; -moz-opacity: 0; opacity: 0; visibility: hidden; } .pplr_loader { text-indent: -9999em; background:url('https://doshopify.com/product-personalizer/gears.gif') !important; background-repeat: no-repeat !important; background-position: center !important; min-height:100px; width: 100%; height:100%; left:0px; right:0px; top:0px; bottom:0px; margin:auto; z-index:999; position:absolute; } #pplr-preview-bg,.overlay-bg { position: fixed; left: 0; top: 0; bottom: 0; right: 0; background: rgba(0,0,0,.5); display: block; z-index: 999999999; width: 100%; height: 100%; } .overlay-bg .loader-canvas { background: #000 none repeat scroll 0 0; border: 1px solid #e5e5e5; height: 20px; left: 50%; margin-left: -140px; position: relative; top: 100px; width: 280px; } .overlay-bg .loader-canvas .progress-title { color: #fff; display: block; font-size: 20px; font-weight: bold; height: 25px; line-height: 25px; position: absolute; text-align: center; top: 27px; width: 200%; left: -50%; } .pplr-wrapper{margin-bottom:0px;width: 100%;float: left;text-align: left;position: relative;} .pplr-wrapper label{width:100%;padding-right:10px;text-align: left;float: left;padding: 10px 0px; margin: 0px;} .product-personalizer .pplr_monogram{margin-left:0px;margin-bottom: 10px;} .pplr{position:relative;background:none;box-sizing: border-box;top:0px;bottom:0px;display: block;padding-top:0px !important;} .jscolor{width:50px;text-indent:-9999px;cursor: pointer;margin-bottom: 10px; } .jscroll ul{ list-style: none; text-align: left; float: left; padding: 0px; margin: 0px; } .pplr,.pplr img{ max-width:100%; display:block; box-sizing: border-box; line-height:1.0; position: relative !important; z-index: 1 !important; background-color:transparent !important; text-align:center; } .pplr img{ max-height: inherit; } .blurr img { opacity: 0.1; filter: blur(5px); -webkit-filter: blur(5px); -moz-filter: blur(5px); -o-filter: blur(5px); -ms-filter: blur(5px); min-height: 250px; } .cp-sel-Photos li { float: left; width: 91px; height: 88px; border: 2px solid #f6f6f6; border-width: 0 2px 2px 0; overflow: hidden; position:relative; } .cp-sel-Photos { float: left; width: 100%; } .cp-sel-Photos .pplr_img { display: block; position: relative; height: 88px; width: 88px; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } .fileupload{ display: block; float: left; width: 100%; padding: 10px 0px; margin-bottom: 10px; } .loader-canvas { background: #000 none repeat scroll 0 0; border: 1px solid #e5e5e5; height: 20px; width: 100%; box-sizing: border-box; } .progress { height: 19px; background: #f5f5f5; width: 0%; overflow: hidden; -webkit-transition-property: width; -moz-transition-property: width; -o-transition-property: width; transition-property: width; -webkit-transition-duration: 0.4s; -moz-transition-duration: 0.4s; -o-transition-duration: 0.4s; transition-duration: 0.4s; } .progress-txt{position: absolute; left: 0px; right: 0px; margin: 0 auto; bottom: 0px; text-align: center; line-height: 19px; } .pprl-progressbar{width:100%;float:left;margin-bottom:20px;} .pplr_modify{ position: absolute; left: 0px; bottom: 0px; cursor: pointer; width: 33px; height: 33px; padding: 0px; } .pplr_delete{ position: absolute; right: 0px; bottom: 0px; cursor: pointer; width: 33px; height: 33px; padding: 0px; } .pplr_shadow{ position:absolute;left:0px;right:0px;top:0px;bottom:0px;margin:auto;background: rgba(0, 0, 0, 0.1) none repeat scroll 0 0;line-height:88px;text-align: center;cursor: pointer; } .cp-sel-Photos li:hover a.pplr_modify{display:block;} .crop-modal{display: none; overflow-x: hidden; overflow-y: auto; position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 999999999; background-color: rgba(0, 0, 0, 0.3); } .modal-open { overflow: hidden; } .pplr-modal-box { position: relative; z-index: 99999999; background-clip: padding-box; top: 0px; right: 0px; left: 0px; bottom: 0px; margin: auto; background: #fff; opacity:0; padding:10px; } .pplr-modal-box { width: 1000px;max-width:100%;text-align: center; min-height:410px} .pplr-modal-box header, .pplr-modal-box .pplr-modal-header { border-bottom: 0px solid #ddd; position: relative; height: 40px; width: 100%; background:#fff; padding: 5px 0; } .pplr-modal-box img{float: left; display: block;max-width: 100%; max-height: 100%;} .pplr-popup.pplr-modal-box .pplr-modal-body { position: relative; float: left; height: 100%; width: 100%; padding: 0px; margin: 0 auto; background: no-repeat; } .pplr-modal-box footer, .pplr-modal-box .modal-footer { padding: 1em; border-top: 1px solid #ddd; background: rgba(0, 0, 0, 0.02); text-align: right; } .modal-overlay { opacity: 0; filter: alpha(opacity=0); position: absolute; top: 0; left: 0; z-index: 900; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.3) !important; } a.close { line-height: 30px; text-decoration: none; color: #000; cursor: pointer; opacity: 1 !important; font-size: 20px; float: right; padding: 0px 10px; border: 1px solid #000; } .pplrhleft{float:left;margin:0px;padding:0px;} .jscroll{float: left;} a.close:hover { color: #222; -webkit-transition: color 1s ease; -moz-transition: color 1s ease; transition: color 1s ease; } .pplrdouble{display:none} .pplr-area{ position: absolute !important;opacity: .5;top:0px;left:0px; border: 3px dashed #000;background-color: #eee;cursor: move; cursor: -webkit-move;} .pplr-area:hover{border: 3px dashed blue;} .pplr canvas{z-index: 99;text-align:inherit; position: absolute; top: 0px;background:transparent;left: 0px;max-width:100%;max-height:100%; } span.pplrColor.selected,span.pplrimage.selected{ border: 2px solid #000000; } span.pplrColor,span.pplrimage { border: 2px solid #ffffff; box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.4); cursor: pointer; width: 40px; height: 30px; margin: 2px 4px; float:left; display:inline-block; } .pplrgcolor,.pplrgimage { float: left; width: 100%; margin-bottom: 10px; margin-top: 10px; z-index: 999; } span.pplrgcolor.selected,span.pplrgimage.selected{ border: 2px solid #000000; } .pplr-selecter-options { border: 1px solid #ccc; border-left: 0; border-right: 0; border-width: 0 1px 1px; background-color: #fefefe; border-radius: 0 0 3px 3px; box-shadow: 0 1px 4px rgba(0, 0, 0, 0.15); display: none; left: 0; margin: 0; max-height: 260px; overflow: auto; overflow-x: hidden; padding: 0; position: absolute; top: 100%; width: 100%; *width: auto; z-index:11; } .pplrfontthumb .pplr-selecter-options {z-index:11 !important;} .pplr-selecter-item{float:left; background: #fff; border-bottom: 1px solid #e3e3e3; color: #333; cursor: pointer; display: block; margin: 0; overflow: hidden; padding: 8px 10px; text-overflow: ellipsis; width: 100%; } .selected-font,.pplr-selecter-item:hover{ background-color: #f0f0f0; } .pplr-selecter-selected { background: transparent url(//cdn.shopify.com/s/files/1/1408/6082/t/4/assets/select-arrow.png?5345742621890683607) no-repeat right center; border: 1px solid #f0f0f0; border-radius: 3px; color: #434244; cursor: pointer; display: block; margin: 0; overflow: hidden; padding: 8px 10px; position: relative; text-overflow: clip; z-index: 9; background-color: #ffffff; margin-bottom: 10px; } .pplr-wrapper:last-child { margin-bottom: 10px; } .pplr-swatch { margin:1em 0; } .pplr-swatch .header { margin: 0.5em 0; } .pplr-swatch input { display:none; } .pplr-swatch label { -webkit-border-radius:2px; -moz-border-radius:2px; border-radius:2px; float:left; min-width:{{ width }} !important; height:{{ height }} !important; margin:0; border:#ccc 1px solid; background-color:#ddd; font-size:13px; text-align:center; line-height:{{ height }}; white-space:nowrap; text-transform:uppercase; } .pplr-swatch-element label { padding:0 10px; } .color.pplr-swatch-element label { padding:0; } .pplr-swatch input:checked + label { -webkit-box-shadow:0px 1px 2px rgba(0,0,0,0.8); -moz-box-shadow:0px 1px 2px rgba(0,0,0,0.8); box-shadow:0px 1px 2px rgba(0,0,0,0.8); border-color:transparent; } .pplr-swatch .pplr-swatch-element { float:left; -webkit-transform:translateZ(0); -webkit-font-smoothing:antialiased; margin:0px 10px 10px 0; position:relative; z-index: 10;background: #dddddd; border-radius: 5px; } .ptooltip:hover{z-index:999} .crossed-out { position:absolute; width:100%; height:100%; left:0; top:0; } .pplr-swatch .pplr-swatch-element .crossed-out { display:none; } .pplr-swatch .pplr-swatch-element.soldout .crossed-out { display:block; } .pplr-swatch .pplr-swatch-element.soldout label { filter: alpha(opacity=60); -khtml-opacity: 0.6; -moz-opacity: 0.6; opacity: 0.6; } .pplr-swatch .tooltip { text-align:center; background:gray; color:#fff; bottom:100%; padding: 10px; display:block; position:absolute; width:100px; left:-28px; margin-bottom:15px; filter:alpha(opacity=0); -khtml-opacity: 0; -moz-opacity: 0; opacity:0; visibility:hidden; -webkit-transform: translateY(10px); -moz-transform: translateY(10px); -ms-transform: translateY(10px); -o-transform: translateY(10px); transform: translateY(10px); -webkit-transition: all .25s ease-out; -moz-transition: all .25s ease-out; -ms-transition: all .25s ease-out; -o-transition: all .25s ease-out; transition: all .25s ease-out; -webkit-box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28); -moz-box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28); -ms-box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28); -o-box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28); box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28); z-index: 10000; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box; } .pplrimage .tooltip { width: 200px; left: -80px; } .pplr-swatch .tooltip:before { border-left:solid transparent 10px; border-right:solid transparent 10px; border-bottom:solid gray 10px; top:-10px; content:' '; height:0; left:50%; margin-left:-13px; position:absolute; width:0; } .before:before{display:none;} .sleftbefore:before{left: 13px !important;} .sleftbefore:after{left: 13px !important;} .pplr-swatch .tooltip:after { border-left:solid transparent 10px; border-right:solid transparent 10px; border-top:solid gray 10px; bottom:-10px; content:' '; height:0; left:50%; margin-left:-13px; position:absolute; width:0; } .after:after{display:none;} .sleftafter:before{left: auto !important; right: 0px !important;} .sleftafter:after{left: auto !important; right: 0px !important;} .pplr-swatch .pplr-swatch-element:hover .tooltip { filter:alpha(opacity=100); -khtml-opacity:1; -moz-opacity:1; opacity:1; visibility:visible; -webkit-transform:translateY(0px); -moz-transform:translateY(0px); -ms-transform:translateY(0px); -o-transform:translateY(0px); transform:translateY(0px); } .pplr-swatch.error { background-color:#E8D2D2!important; color:#333!important; padding:1em; border-radius:5px; } .pplr-swatch.error p { margin:0.7em 0; } .pplr-swatch.error p:first-child { margin-top:0; } .pplr-swatch.error p:last-child { margin-bottom:0; } .pplr-swatch.error code { font-family:monospace; } .pplr_rotate{ width: 30px; height: 30px; display: inline-block; position: absolute; left: 0px; right: 0px; margin: auto;} #content .pro_main_c .desc_blk { float: left; } #pplr div{max-width: 100%; display: block; box-sizing: border-box; line-height: 1.0; position: relative; z-index: 1; background-color: transparent !important; text-align: center; float: none; margin: auto; } #pplr div img{ max-width: 100%; display: block; box-sizing: border-box; line-height: 1.0; position: relative; z-index: 1; background-color: transparent !important; text-align: center; } #pplr canvas { z-index: 99; text-align: inherit; position: absolute; top: 0px; background: transparent; left: 0px; max-width: 100%; max-height: 100%; } .pplr-hide input,.pplr-hide textarea,.pplr-hide .pplr-selecter-selected,.pplr-hide .pplr-selecter-options{position:absolute !important;visibility:hidden;z-index:-10000;} .pplr-hide .pplr-swatch{position:absolute;visibility:hidden;z-index:-10000;} .pplr-wrapper label{cursor:pointer;} .pplr .zoomImg{display: none !important;} .pplrfontthumb .pplr-selecter-selected{display: none;} .pplrfontthumb .pplr-selecter-options{ display: block; position: relative; width: auto; float: left; border: 0px; box-shadow: none; } .pplrfontthumb .pplr-selecter-item{ width: auto; float: left; margin: 4px; border-radius: 8px; border: 1px solid #ddd; } .pplrfontthumb .selected-font{} .pplr-arrow-right { width: 0; height: 0; border-left: 10px solid #000; border-right: 10px solid transparent; border-bottom: 7px solid transparent; float: left; padding-top: 0px; text-align: center; border-top: 7px solid transparent; margin-top: 6px; } .pplr-arrow-bottom { width: 0; height: 0; border-left: 7px solid transparent; border-right: 7px solid transparent; border-bottom: 0px solid transparent; float: left; padding-top: 3px; text-align:center; border-top: 10px solid #000; margin-top:7px; margin-right: 6px; } .pplr-wrapper-each{float: left;width: 100%;} .pplr_option{display:none !important} .pplr-swatch .tooltip span{width:100%;float:left;} .pplrfixed{position:fixed !important;} .optionwithclass{margin-left:10px;} .pplr-modal-open{overflow:hidden;height: 100%;position: fixed;width:100%;} ::-webkit-scrollbar { -webkit-appearance: none; width: 7px; } ::-webkit-scrollbar-thumb { border-radius: 4px; background-color: rgba(0,0,0,.5); box-shadow: 0 0 1px rgba(255,255,255,.5); } .oindexlabel{float:left;width:100%;font-weight:bold;padding: 20px 0px 0px 0px;} .ptooltip { position: relative; display: inline-block; color: #fff; background: #000; width: 15px; text-align: center; border-radius: 7px; height: 15px; line-height: 1; cursor: pointer; z-index: 9; } .ptooltip .ptooltiptext { visibility: hidden; min-width: 150px; background-color: gray; color: #fff; text-align: center; border-radius: 0px; padding:7px; position: absolute; z-index: 1; bottom: 150%; left: 0%; margin-left: -20px; max-width: 200px; } .ptooltip:hover .ptooltiptext { visibility: visible; } .ptooltiparrow{position:absolute;width:0;height:0;border-color:transparent;border-style:solid}.ptooltiptext.top .ptooltiparrow{bottom:0;left:50%;margin-left:-8px;border-width:8px 8px 0;border-top-color:gray;top:100%}.ptooltiptext.top-left .ptooltiparrow{right:8px;bottom:0;margin-bottom:-8px;border-width:8px 8px 0;border-top-color:gray}.ptooltiptext.top-right .ptooltiparrow{bottom:0;left:8px;margin-bottom:-8px;border-width:8px 8px 0;border-top-color:gray}.ptooltiptext.right .ptooltiparrow{top:50%;left:0;margin-top:-8px;border-width:8px 8px 8px 0;border-right-color:gray}.ptooltiptext.left .ptooltiparrow{top:50%;right:0;margin-top:-8px;border-width:8px 0 8px 8px;border-left-color:gray}.ptooltiptext.bottom .ptooltiparrow{left:50%;margin-left:-8px;border-width:0 8px 8px;border-bottom-color:gray;bottom:100%}.ptooltiptext.bottom-left .ptooltiparrow{top:0;right:8px;margin-top:-8px;border-width:0 8px 8px;border-bottom-color:gray}.ptooltiptext.bottom-right .ptooltiparrow{top:0;left:8px;margin-top:-8px;border-width:0 8px 8px;border-bottom-color:gray} .pplr-modal-image{height:100% ; width:100%; position: relative; top: 0px; left: 0px;} .crop_header{ top: 0px;z-index: 99999999;position: absolute;background: #fff;left:0px;height: calc(100% - 40px);width: 100%; } .pplrhleft a{cursor:pointer;} .pplr-modal-image header{background:#fff} .pplr-p-left{width:50%;float:left;} .pplr-p-right{width:50%;float:right;overflow-y:scroll;overflow-x:hidden;max-height: 450px;} .pplr_ex_button{width:50%;float:right;} .pplr_mobile{display:none;} @media screen and (max-width: 640px){ .pplr-p-left{width:100%;float:left;} .pplr-p-right{width:100%;float:left;} .pplr-modal-box { max-width:100%;width:100%;} .pplr_ex_button{width:100%} .pplr_mobile{display:block;} .pplr_desktop{display:none;} }", head = document.head || document.getElementsByTagName("head")[0], style = document.createElement("style"); style.type = "text/css"; if (style.styleSheet){ style.styleSheet.cssText = css; } else { style.appendChild(document.createTextNode(css)); } head.appendChild(style);var fontgroup_json={"Celtic":{"Irish Bold":"Irish-Bold.ttf","Celtic One":"Celtic-One.ttf","Celtic Two":"Celtic-Two.ttf","Irish Font":"Irish-Font.ttf","Irish Two":"Irish-Font-Two.ttf"},"Elegant":{"Amperzand":"Amperzand.ttf","Ball":"Ball.ttf","Black":"Black.ttf","Cardinal":"Cardinal.ttf"},"Gothic":{"Elegant Gothic":"Elegant-Gothic.ttf","Amperzand":"Amperzand.ttf"},"Popular-Fonts":{"Constantine":"Constantine.ttf","Hevitas":"Heavitas.ttf","Metro":"Metro.ttf","Norto":"Norto.ttf","Penur one":"Penur-one.ttf","Penur ":"Penur.ttf","Swash":"Swash.ttf","Telagraph":"Telegraph.ttf","Cupcake":"cupcake.ttf"},"Popular":{"amperzand":"Amperzand.ttf","Ball":"Ball.ttf","Black":"Black.ttf","Cardinal":"Cardinal.ttf","Celtic one":"Celtic-One.ttf","Celtic Two":"Celtic-Two.ttf","Century Gothic":"Century-Gothic.ttf","Cponstantine":"Constantine.ttf","Elegant Gothic":"Elegant-Gothic.ttf","Gothic":"Gothic.ttf","Horseback":"Horseback-Bold.ttf","Irish Bold":"Irish-Bold.ttf","Irish two":"Irish-Font-Two.ttf","Irish":"Irish-Font.ttf","Mademoiselle":"Mademoiselle.ttf","Norto":"Norto.ttf","Penur one":"Penur-one.ttf","Penur":"Penur.ttf","Swash":"Swash.ttf","Telegraph":"Telegraph.ttf","Cupcake":"cupcake.ttf"}};var settings_json=["1","500","0","0 0 20px 0px","Saving In Progress","Uploading in Process","Adding To Cart","preview-image","Option Title","add-to-cart","pplr-featured","pplr-swatch","1024x","2","1","Personalize","Yes","No","Click To View Image","1","1","Remove","2","1","1","1","1","1","1","1"];var colorgroup_json={};var imagegroup_json={"Nature":["leaf ornament.png","rose ornament.png"],"Ornament":["ornament line.png","ornament two.png"]};var pricechanger = {};(function() { var wf = document.createElement('script'); wf.src = ('https:' == document.location.protocol ? 'https' : 'http') + '://ajax.googleapis.com/ajax/libs/webfont/1.6.16/webfont.js'; wf.type = 'text/javascript'; var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(wf, s); })(); if (isIE() && isIE() < 9) { var script = document.createElement("script"); script.type = "text/javascript"; script.src = "https://cdnjs.cloudflare.com/ajax/libs/flot/0.8.3/excanvas.min.js"; document.getElementsByTagName("head")[0].appendChild(script); } if (typeof pplr_c_title == 'undefined') { var pplr_c_title = settings_json[8]; } function isSafari() { return !!navigator.userAgent.match(/Version\/[\d\.]+.*Safari/); } var iOS = /iPad|iPhone|iPod/.test(navigator.userAgent) && !window.MSStream; var isMobile = false; if(/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent) ) { isMobile = true; } function isIE() { var myNav = navigator.userAgent.toLowerCase(); return (myNav.indexOf("msie") != -1) ? parseInt(myNav.split("msie")[1]) : false; } function is_int(value) { return !isNaN(value) && parseInt(Number(value)) == value && !isNaN(parseInt(value, 10)); } function decodeHtml(html) { var txt = document.createElement("textarea"); txt.innerHTML = html; return txt.value; } var pplrframe = 1; var font_loaded = false; var pplrloading = false; var checktimout; var pplrimgloading = true; var cimage = false; var pplrloadfinish= 0; var create_pplr = false; var pplr_html ; var pplrcurrentimage=''; var cstmfy_prodata = product_personalizer['cstmfy_prodata'].split(','); var createproduct = cstmfy_prodata[7]; var pplrheight = jQuery(window).height(); var pplr_delay = 0; var add_to_cart = 'input[name=\"add\"],button[name=\"add\"],#buy_it_now,#addToCart,#add-to-cart,.add-to-cart,.AddToCart-product-template,.add_to_cart,#add-to-cart,.' + settings_json[9]; var kkr = /(_compact\.)|(_medium\.)|(_large\.)|(_grande\.)|(_160x160\.)|(_480x480\.)|(_400x400\.)|(_1024x1024\.)|(_2048x2048\.)|(_580x@2x\.)|(_2048x@2x\.)|(_580x\.)|(_600x\.)|(_530x\.)|(_1200x\.)|(_800x\.)|(_100x\.)|(_1024x\.)|(_2000x\.)|(_2048x\.)|(_custompplr\.)/; var queryreplacestring = kkr.toString().replace("custompplr", settings_json[12]); queryreplacestring = new RegExp(queryreplacestring); var queryreplacestring2 = /.+_((?:medium|large|grande)|\d{1,4}x\d{0,4}|x\d{1,4})(@{1}?\d{1}?x{1}?)*[_\.]/; var print_canvas; var PIXEL_RATIO = (function() { var el = document.createElement('canvas'); var ctx = el.getContext('2d'); var dpr = window.devicePixelRatio || 1, bsr = ctx.webkitBackingStorePixelRatio || ctx.mozBackingStorePixelRatio || ctx.msBackingStorePixelRatio || ctx.oBackingStorePixelRatio || ctx.backingStorePixelRatio || 1; return dpr / bsr; })(); if (createproduct > 1) { var script = document.createElement("script"); script.type = "text/javascript"; script.src = "https://cdnjs.cloudflare.com/ajax/libs/html2canvas/0.5.0-alpha1/html2canvas.js"; document.getElementsByTagName("head")[0].appendChild(script); } function pplr_final_print(tis){ jQuery('input').trigger('focusout'); var url_to_print = ''; for (var ii = 0; ii < jQuery('.pplr_print_main').length; ii++) { print_canvas = jQuery('.pplr_print_main').eq(ii).find('canvas').get(0); url_to_print += "&img_to_print[]=" +print_canvas.toDataURL("image/png", 1.0); } var url_to_save = "save2.php"; var store = Shopify.shop; if (typeof __st != 'undefined') { var prd_id = __st.rid; } else { var prd_id = pplr_product.id; } if (createproduct > 2) { url_to_save = "save3.php"; } var ptitle = pplr_product.title; var pplrform = jQuery(".pplrform"); if (pplrform.find("input[name='id']").length !== 0) { var pplrnameid = pplrform.find("input[name='id']"); var pplrvariantid = pplrform.find("input[name='id']").val(); } else { var pplrvariantid = pplrform.find("select[name='id']").val(); var pplrnameid = pplrform.find("select[name='id']"); } for (i = 0; i < pplr_product.variants.length; i++) { if (pplr_product.variants[i].id == pplrvariantid) { var pprice = (pplr_product.variants[i].price / 100 + pplrqty()).toFixed(2); var weight = pplr_product.variants[i].weight; } } var jQuerydate_now = Date.now(); var img_url_each = ""; if (window.navigator.standalone) jQuery.ajaxSetup({ isLocal: true }); jQuery.ajax({ xhr: function() { var xhr = new window.XMLHttpRequest(); xhr.upload.addEventListener("progress", function(evt) { if (evt.lengthComputable) { var percentComplete = (evt.loaded / evt.total) * 100; if (percentComplete > 99) { jQuery(".progress-title").text(settings_json[6]); var originalText = jQuery(".progress-title").text(), i = 0; setInterval(function() { jQuery(".progress-title").append("-"); jQuery(".progress-title").prepend("-"); i++; if (i == 4) { jQuery(".progress-title").html(originalText); i = 0; } }, 500); } jQuery(".loader-canvas .progress").width(percentComplete + "%"); jQuery(".loader-canvas .progress-txt").text(parseInt(percentComplete) + "%"); } }, false); return xhr; }, type: "POST", url: "https://doshopify.com/product-personalizer/server/php/" + url_to_save, crossDomain: true, data: "pd_id=" + prd_id + "&id_img=" + jQuerydate_now + url_to_print + "&title=" + ptitle + "&price=" + pprice + "&weight=" + weight + "&shop=" + store + img_url_each, success: function(data) { console.log(data); if (data == "error") { alert("Product / uploaded Image is corrupted"); } var object = JSON.parse(data); if (createproduct > 2) { for (var ii = 0; ii < object.length; ii++) { var img_ser = ii ; if(img_ser==0){img_ser='';} pplrform.prepend(''); } if (pplrqty() !== 0) { pplr_add_price(pplrqty(), jQuery(tis)); } else { pplrform.submit(); } return; } if (jQuery("select[name='id']")[0] && pplr_product.variants.length > 1) { pplrform.prepend(''); } var variant = object["variants"][0]["id"]; pplrnameid.after(''); pplrnameid.remove(); pplrform.submit(); } }); } function createImgToPrint(id,tis) { if(pplrloadfinish == jQuery('.pplr_print_main').length){ } else{ setTimeout(function() { createImgToPrint(id,tis); },50); return; } jQuery("html,body").animate({ scrollTop: 0 }, 1); setTimeout(function() { pplr_final_print(tis); },100); } function create_pplr_product(event,tis){ if(create_pplr){ return; } PIXEL_RATIO = 1; create_pplr = true; pplrloadfinish= 0; pplr_delay = 100; jQuery('.pplrform').removeClass('pplrform'); jQuery(tis).closest("form").addClass('pplrform'); if (createproduct > 1) { if (jQuery('.product-personalizer').css('display') == 'none') { return; } var notempty = true; jQuery(tis).closest("form").find("input[required],textarea[required]").each(function() { if (jQuery(this).val() === "") { notempty = false; create_pplr = false; return false; } }); jQuery(tis).closest("form").find("input").each(function() { if (jQuery(this)[0].checkValidity() == false) { notempty = false; create_pplr = false; return false; } }); if (notempty) { event.preventDefault(); jQuery('body').scrollTop(0); jQuery("body").addClass("pplr-modal-open"); var checkpplr = first_prod_img(); var maxWwid = jQuery(window).width(); jQuery("body").append('
' + settings_json[4] + '

'); jQuery(".overlay-bg").width(maxWwid); jQuery(".overlay-bg").fadeIn(); var cstmfywidth = cstmfy_prodata[3]; if (parseInt(cstmfywidth) > 1024) { var pplrreplace = "_2048x2048."; } else { var pplrreplace = "_1024x1024."; } if (cstmfy_prodata[0] > 0) { var pplrlarge1 = checkpplr.attr("src").replace(queryreplacestring, pplrreplace); } var pplrlarge = product_personalizer['cstmfy_meta_' + 1].split(',')[18]; var f_pplr = true; var p_k = 1; jQuery("body").append("
"); jQuery(".pplr canvas").remove(); jQuery(".pplr").removeClass("pplr"); function loadpplrtrns(k, pplrlarge, t) { if (product_personalizer['cstmfy_meta_' + k].split(',')[18] !== pplrlarge || f_pplr) { p_k = p_k + 1; jQuery(".pplr").removeClass("pplr"); f_pplr = false; var pplrlarge = product_personalizer['cstmfy_meta_' + k].split(',')[18]; if (cstmfy_prodata[0] > 0) { var pplrlarge = pplrlarge1; } jQuery("#pplr").append("
"); jQuery("#plq_" + k).width(cstmfywidth); jQuery("#plq_" + k).addClass('pplr'); jQuery("#plq_" + k).addClass('pplr_print_main'); jQuery("#plq_" + k + " img").width(cstmfywidth); var imgObj2 = new Image(); imgObj2.onload = function() { checkpplrClass(k, jQuery("#plq_" + k), true); if (t) { if (p_k > 2) { jQuery("#pplr").width(cstmfywidth); } createImgToPrint("pplr",tis); return; } if (k == parseInt(cstmfy_prodata[1])) { if (p_k > 2) { jQuery("#pplr").width(cstmfywidth); } createImgToPrint("pplr",tis); return; } k = k + 1; loadpplrtrns(k, pplrlarge); } imgObj2.src = pplrlarge; } else { if (k == parseInt(cstmfy_prodata[1])) { if (p_k > 2) { jQuery("#pplr").width(cstmfywidth); } createImgToPrint("pplr",tis); } else { var pplrlarge = product_personalizer['cstmfy_meta_' + k].split(',')[18]; k = k + 1; loadpplrtrns(k, pplrlarge); } } } if (cstmfy_prodata[0] > 0 || parseInt(cstmfy_prodata[1]) <2) { loadpplrtrns(1, pplrlarge, true); } else { loadpplrtrns(1, pplrlarge, false); } return false; } } } function pplr_addto_cart(e,tis){ if (createproduct < 2 && jQuery('.pplraddprice')[0]) { var pplrtis = jQuery(tis); if (pplrqty() !== 0) { pplr_add_price(pplrqty(), pplrtis,e); } } } function pplr_hide_duplicate(){ jQuery('.pplr_monogram').each(function() { if (jQuery('input[name=\"' + jQuery(this).attr('name') + '"]:visible').length > 1) { jQuery('input[name=\"' + jQuery(this).attr('name') + '"]:not(:first)').prop('disabled', true).addClass('pplr_hide_duplicate').parent().hide(); } if (jQuery('textarea[name=\"' + jQuery(this).attr('name') + '"]:visible').length > 1) { jQuery('textarea[name=\"' + jQuery(this).attr('name') + '"]:not(:first)').prop('disabled', true).addClass('pplr_hide_duplicate').parent().hide(); } if (jQuery('input[name=\"' + jQuery(this).attr('name') + '"]:visible').length + jQuery('textarea[name=\"' + jQuery(this).attr('name') + '"]:visible').length > 1) { jQuery('textarea[name=\"' + jQuery(this).attr('name') + '"]').prop('disabled', true).addClass('pplr_hide_duplicate').parent().hide(); } }); var p_c_b = ['.pplrjscolor', '.pplr_image', '.pplr-font']; for (index = 0, len = p_c_b.length; index < len; ++index) { jQuery(p_c_b[index]).each(function() { if (jQuery('input[name=\"' + jQuery(this).attr('name') + '"]').parent(".pplr-wrapper:visible").length > 1) { if (jQuery('input[data-frame=\"' + jQuery(this).attr('data-frame') + '"].pplr_check').length < 1) { jQuery('input[name=\"' + jQuery(this).attr('name') + '"]:not(:last)').prop('disabled', true).addClass('pplr_hide_duplicate').parent().hide(); console.log('check'); jQuery('input[name=\"' + jQuery(this).attr('name') + '"]:last').addClass('pplr_show_duplicate'); } } }); } var p_c_c = ['.jscolor']; for (index = 0, len = p_c_c.length; index < len; ++index) { jQuery(p_c_c[index]).each(function() { if (jQuery('select[name=\"' + jQuery(this).attr('name') + '"]:visible').length > 1) { if (jQuery('input[data-frame=\"' + jQuery(this).attr('data-frame') + '"].pplr_check').length < 1) { jQuery('select[name=\"' + jQuery(this).attr('name') + '"]:not(:last)').prop('disabled', true).addClass('pplr_hide_duplicate').parent().hide(); } } if (jQuery('input[name=\"' + jQuery(this).attr('name') + '"]:visible').length > 1) { if (jQuery('input[data-frame=\"' + jQuery(this).attr('data-frame') + '"].pplr_check').length < 1) { jQuery('input[name=\"' + jQuery(this).attr('name') + '"]:not(:last)').prop('disabled', true).addClass('pplr_hide_duplicate').parent().hide(); } } }); } } function pplr_add_price(pplrqty, pplrtis, e) { var notempty = true; pplrtis.closest("form").find("input[required],textarea[required]").each(function() { if (jQuery(this).val() === "") { notempty = false; return false; } }); if (notempty) { if(e){ e.preventDefault(); } var pplrqtyref = pplrqty; var itemqty = pplrtis.closest("form").find("input[name='quantity']"); if (itemqty[0]) { pplrqty = pplrqty * 100 * parseInt(itemqty.val())/settings_json[26]; var pitemqty = parseInt(itemqty.val()); } else { pplrqty = pplrqty * 100; var pitemqty = 1; } jQuery(".pplrcustomref").val(Math.floor((Math.random() * 1000000000) + 1)); var pplr_pro_each = "&" + jQuery(".pplrcustomref").attr("name") + "=" + jQuery(".pplrcustomref").val(); jQuery.ajax({ type: "POST", url: "/cart/add.js", data: "id=" + pricechanger + "&quantity=" + pplrqty + pplr_pro_each, dataType: "json", success: function(data) { jQuery(".pplrcustomprice").val((data.line_price) * pitemqty); jQuery(".overlay-bg").remove(); jQuery('.pplrcustomref').prop('disabled', false); jQuery('.pplrcustomprice').prop('disabled', false); pplrtis.closest("form").submit(); }, error: function() { console.log('product deleted'); jQuery(".overlay-bg").remove(); } }); } } function pplr_unfold(tis) { if (settings_json[0] == 2) { if (jQuery(tis).parent().hasClass('pplr-collapsible')) { if (jQuery(tis).parent().hasClass('pplr-hide')) { jQuery(tis).parent().removeClass('pplr-hide'); jQuery(tis).children('.pplr-arrow').removeClass('pplr-arrow-right'); jQuery(tis).children('.pplr-arrow').addClass('pplr-arrow-bottom'); } else { jQuery(tis).parent().addClass('pplr-hide'); jQuery(tis).children('.pplr-arrow').removeClass('pplr-arrow-bottom'); jQuery(tis).children('.pplr-arrow').addClass('pplr-arrow-right'); } } } } function pplrColor(tis){ jQuery(tis).siblings().removeClass("selected"); jQuery(tis).addClass("selected"); jQuery(tis).parent().siblings(".pplrjscolor").attr("data-value", jQuery(tis).attr("data-color")); jQuery(tis).parent().siblings(".pplrjscolor").val(jQuery(tis).attr("data-name")).trigger("change"); } function pplrselecterselected(tis){ jQuery(tis).siblings(".pplr-selecter-options").toggle(); } function pplrselecteritem(tis){ jQuery(tis).parents('.pplr-selecter-options').siblings(".pplr-selecter-selected").css("font-family", jQuery(tis).css("font-family")); if (settings_json[19] == 2) { jQuery(tis).parents('.pplr-selecter-options').siblings(".pplr-selecter-selected").css("font-family", 'inherit'); } else { jQuery(".pplr-selecter-options").hide(); } jQuery(tis).addClass("selected-font").siblings().removeClass("selected-font"); jQuery(tis).parents('.pplr-selecter-options').siblings(".pplr-font").attr("data-value", jQuery(tis).attr("data-value")); jQuery(tis).parents('.pplr-selecter-options').siblings(".pplr-font").attr("data-height", jQuery(tis).attr("data-height")); jQuery(tis).parents('.pplr-selecter-options').siblings(".pplr-font").val(jQuery(tis).text()).trigger("change"); jQuery(tis).parents('.pplr-selecter-options').siblings(".pplr-selecter-selected").text(jQuery(tis).text()); } function pplr_preview_hide() { jQuery("#pplr-preview").remove(); jQuery("#pplr-preview-bg").remove(); if (parseInt(cstmfy_prodata[8]) < 2) { checkpplrClass(pplrframe); } } function ptooltiptext() { var pplrfolder = jQuery(".product-personalizer"); if(jQuery(".pplr-p-right")[0]){ pplrfolder = jQuery(".pplr-p-right"); } jQuery(".ptooltip").each(function() { jQuery(this).hover(function() { var el1 = jQuery(this); var el2 = jQuery(this).parents("label"); var p1 = el1.offset(); var p2 = el2.offset(); var el3 = jQuery(this).children(".ptooltiptext").width(); var pleft = jQuery(this).position().left+el3/2-el2.width(); if(pleft<0){pleft=0;} var pright = jQuery(this).offset().left-el3/2-el2.offset().left; if(pright>0){pright=0;} jQuery(this).children(".ptooltiptext").css({ 'margin-left': (p2.left - p1.left), 'left': jQuery(this).position().left-el3/2-pleft-pright }); if ((p2.top - pplrfolder.offset().top) < jQuery(this).children(".ptooltiptext").height() && pplrfolder.css('overflow-y')=='scroll') { jQuery(this).children(".ptooltiptext").css('bottom', -jQuery(this).children(".ptooltiptext").height() - 25); jQuery(this).children(".ptooltiptext").addClass('bottom').removeClass('top'); } else { jQuery(this).children(".ptooltiptext").css('bottom', '160%'); jQuery(this).children(".ptooltiptext").addClass('top').removeClass('bottom'); } jQuery(this).find(".ptooltiparrow").css({ 'left': jQuery(this).position().left+7-jQuery(this).children(".ptooltiptext").position().left }); }); }); } function ptooltipswatch() { var pplrfolder = jQuery(".product-personalizer"); if(jQuery(".pplr-p-right")[0]){ pplrfolder = jQuery(".pplr-p-right"); } jQuery(".pplr-swatch-element").each(function() { jQuery(this).mouseover(function() { jQuery(this).css({ 'z-index': 99 }); var p1 = jQuery(this).children(".tooltip").offset(); var p2 = jQuery(this).parent().offset(); if (p1.left - p2.left < 0) { jQuery(this).children(".tooltip").css({ 'left': 0 }); jQuery(this).children(".tooltip").addClass('sleftbefore').removeClass('sleftafter'); } if (p1.left - p2.left + jQuery(this).children(".tooltip").width() - jQuery(this).parent().width() > 0) { jQuery(this).children(".tooltip").css({ 'left': -jQuery(this).children(".tooltip").width() }); jQuery(this).children(".tooltip").addClass('sleftafter').removeClass('sleftbefore'); } if ((p2.top - pplrfolder.offset().top) - 20 < jQuery(this).children(".tooltip").height() && pplrfolder.css('overflow-y')=='scroll') { jQuery(this).children(".tooltip").css({ 'bottom': 'auto', 'top': 40 }); jQuery(this).children(".tooltip").addClass('after').removeClass('before'); } else { jQuery(this).children(".tooltip").css({ 'bottom': '100%', 'top': 'auto' }); jQuery(this).children(".tooltip").addClass('before').removeClass('after'); } }); jQuery(this).mouseout(function() { jQuery(this).css({ 'z-index': 10 }); }); }); } function pplr_modal_correct(t){ if(t){var m_height = 'height';}else{var m_height = 'max-height';} if(jQuery(window).width()<640){ jQuery(".pplr-modal-box").css({"padding":"0px 10px","height":pplrheight}); var extra = 100; if (cstmfy_prodata[10] <3 ) { extra = 0; } jQuery(".pplr-p-left,.pplr-p-right").css('width', '100%'); jQuery(".pplr-modal-box").css("margin-top", 0); jQuery(".crop-modal").css({"height":pplrheight+extra}); jQuery(".pplr-p-left img,.pplr-p-left").css('max-height', (jQuery(".pplr-modal-box").height()-100)/2); jQuery(".pplr-p-right").css(m_height, jQuery(".pplr-modal-box").height()-jQuery(".pplr-p-left").height()-100); jQuery(".crop_header").css('height',jQuery(".pplr-p-right").height()-40); jQuery(".pplr-p-left").css({'width':jQuery(".pplr-p-left img").width(),'float':'left'}); jQuery(".pplr-p-right").css({'width':jQuery(".pplr-main").width(),'float':'left'}); jQuery(".pplr-p-left").css({"margin-left":(jQuery(".pplr-main").width()-jQuery(".pplr-p-left").width())/2}); } else{ jQuery(".pplr-modal-box").css({"padding":"0px 10px","max-height":pplrheight}); var extra = 80; if (cstmfy_prodata[10] <3 ) { extra = 0; } jQuery(".pplr-p-left").css('width', '47%'); jQuery(".pplr-p-right").css({'width':'50%','float':'right'}); jQuery(".pplr-main").css("height", jQuery(".pplr-p-left").height()+extra); jQuery(".pplr-p-left img,.pplr-p-left").css('max-height', (jQuery(".pplr-modal-box").height()-100)); if(jQuery(".pplr-p-left").height()<250){ jQuery(".pplr-p-left").css("min-height", 250); } jQuery(".pplr-p-right").css("height", jQuery(".pplr-p-left").height()); var whpmb = pplrheight-jQuery(".pplr-modal-box").height(); jQuery(".pplr-p-left").css({"margin-left":'0px'}); if(whpmb>0){ jQuery(".pplr-modal-box").css("margin-top", whpmb/2-10); } else{ jQuery(".pplr-modal-box").css("margin-top", 0); } jQuery(".pplr-p-left img").css({"margin-left":(jQuery(".pplr-p-left").width()-jQuery(".pplr-p-left img").width())/2}); } } function cstmfy_personalize_text(tis) { jQuery('.cstmfy_personalize_text').toggle(); if (cstmfy_prodata[10] <3 ) { ptooltiptext(); return; } if(jQuery(window).width()<640){ jQuery('body').scrollTop(0); } jQuery(".pplr canvas").remove(); jQuery(".pplr").removeClass("pplr"); var pplr_imgp = product_personalizer["cstmfy_meta_" + pplrframe].split(",")[18]; var pplrform = jQuery(tis).closest("form"); if (pplrform.find("input[name='id']").length !== 0) { var pplrnameid = pplrform.find("input[name='id']"); var pplrvariantid = pplrform.find("input[name='id']").val(); } else { var pplrvariantid = pplrform.find("select[name='id']").val(); var pplrnameid = pplrform.find("select[name='id']"); } if (cstmfy_prodata[0] > 0) { for (i = 0; i < pplr_product.variants.length; i++) { if (pplr_product.variants[i].id == pplrvariantid) { var pplr_imgp = pplr_product.variants[i]["featured_image"]["src"]; } } } if(settings_json[27]==1){settings_json[27]='ADD TO CART';} var inputvariant= ''; jQuery("body").append('

x
'+pplr_html +inputvariant+'
'); jQuery('.cstmfy_personalize_text').remove(); jQuery("body").addClass("pplr-modal-open"); jQuery("body").find(".crop-modal").show(); var imgObj2 = new Image(); imgObj2.onload = function() { jQuery(".pplr-preview-btn").remove(); pplr_modal_correct(); jQuery(".pplr-modal-box").animate({'opacity': 1}); pplr_hide_duplicate(); LoadPplrWithFont(pplrframe,true); } imgObj2.src = pplr_imgp; ptooltiptext(); ptooltipswatch(); jQuery('input.pplr_check:checked').trigger('click'); } function pplr_prev_left(){ if(settings_json[25] > 1 && cstmfy_prodata[10] < 3 && jQuery(window).width()<641){ if(!jQuery('.pplr-prev-left')[0]){ var pplr = first_prod_img(); var attr = pplr.attr('pplr-src'); if (typeof attr !== typeof undefined && attr !== false) { if (pplr.attr('pplr-src') !== pplr.attr('src')) { pplr.attr('src', pplr.attr('pplr-src')); pplr.removeAttr("pplr-src"); } } jQuery(".pplr canvas").remove(); jQuery(".pplr").removeClass("pplr"); var pplr_imgp = product_personalizer["cstmfy_meta_" + pplrframe].split(",")[18]; var pplrform = jQuery('.product-personalizer').closest("form"); if (pplrform.find("input[name='id']").length !== 0) { var pplrnameid = pplrform.find("input[name='id']"); var pplrvariantid = pplrform.find("input[name='id']").val(); } else { var pplrvariantid = pplrform.find("select[name='id']").val(); var pplrnameid = pplrform.find("select[name='id']"); } if (cstmfy_prodata[0] > 0) { for (i = 0; i < pplr_product.variants.length; i++) { if (pplr_product.variants[i].id == pplrvariantid) { var pplr_imgp = pplr_product.variants[i]["featured_image"]["src"]; } } } jQuery('.product-personalizer').before('
'); var imgObj2 = new Image(); imgObj2.onload = function() { jQuery(".pplrabs").css('width', jQuery(".pplrabs").parent().width()); jQuery(".pplr-prev-left img,.pplr-prev-left").css('max-height', pplrheight/2); jQuery(".pplr-prev-left img").css({"margin-left":(jQuery(".pplr-prev-left").width()-jQuery(".pplr-prev-left img").width())/2}); var maxheight = pplrheight/2; if(maxheight < 250){ var maxheight = 250; } jQuery('.product-personalizer').css({ 'max-height': maxheight, 'overflow-y': ' scroll', 'overflow-x': 'hidden' }); if (cstmfy_prodata[8] > 0) { LoadPplrWithFont(pplrframe); } } imgObj2.src = pplr_imgp; } } } function pplr_delete(tis, k, f,g) { var control = jQuery('.pplr_monogram[data-frame="' + tis + '"]'); control.wrap('
').closest('form').get(0).reset(); control.unwrap(); jQuery(".cp-sel-Photos ul li").remove(); if (k) { jQuery('.img_url[data-frame="' + tis + '"]').attr("src", 'https://doshopify.com/product-personalizer/images/blank.png'); jQuery('.pplr-crop[data-frame="' + tis + '"]').trigger('change'); } else { jQuery('.img_url[data-frame="' + tis + '"]').attr("src", 'https://doshopify.com/product-personalizer/' + product_personalizer['cstmfy_meta_' + tis].split(',')[15]); jQuery('.pplr-crop[data-frame="' + tis + '"]').val(product_personalizer['cstmfy_meta_' + tis].split(',')[22].split("-").join("_")).trigger('change'); } jQuery('.pplr-crop[data-frame="' + tis + '"]').prop('disabled', true); jQuery('.pplrimage[data-frame="' + tis + '"]').removeClass("selected"); if (jQuery('.pplr_monogram[data-frame="' + tis + '"]').hasClass('pplr_text')) { jQuery('.pplr_monogram[data-frame="' + tis + '"]').val('') } if (!f) { jQuery('.crop_header').remove(); jQuery(".crop-modal").hide(); jQuery("body").removeClass("pplr-modal-open"); } if(g){ jQuery('.crop_header').remove(); } } function pplr_option(tis) { var data_frame = jQuery(tis).attr('data-frame'); var data_name = jQuery(tis).attr('name'); jQuery('input[name="' + data_name + '"]').each(function() { if (jQuery(this).attr('data-frame') !== data_frame) { pplr_delete(jQuery(this).attr('data-frame'), true,true); if(!jQuery('.pplr_monogram[data-frame="' + jQuery(this).attr('data-frame') + '"]').hasClass('pplr_option')){ jQuery('.pplr_monogram[data-frame="' + jQuery(this).attr('data-frame') + '"]').prop('disabled', true).addClass('pplr_option'); jQuery(".pplr_aux[data-frame='" + jQuery(this).attr('data-frame') + "']").prop('disabled', true).parents('.pplr-wrapper').addClass('pplr_option'); jQuery(".pplr-swatch-element[data-frame='" + jQuery(this).attr('data-frame') + "']").parent().addClass('pplr_option'); jQuery('.pplr_monogram[data-frame="' + jQuery(this).attr('data-frame') + '"]').trigger('change'); jQuery('.pplr-crop[data-frame="' + jQuery(this).attr('data-frame') + '"]').prop('disabled', true).trigger('change'); } } }); jQuery(".pplr-swatch-element[data-frame='" + data_frame + "']").parent().removeClass('pplr_option'); if(jQuery(".pplr-swatch-element[data-frame='" + data_frame + "']")[0]){jQuery(".pplr-swatch-element[data-frame='" + data_frame + "']").first().trigger('click');} jQuery('.pplr_monogram[data-frame="' + data_frame + '"]').prop('disabled', false).trigger('change').removeClass('pplr_option'); jQuery(".pplr_aux[data-frame='" + data_frame+ "']").parents('.pplr-wrapper').removeClass('pplr_option'); if (jQuery('.pplr_monogram[data-main="' + data_frame + '"]').val()!=='') { jQuery(".pplr_aux[data-frame='" + data_frame + "']").prop('disabled', false); } else{ jQuery(".pplr_aux[data-frame='" + data_frame + "']").prop('disabled', true); } console.log('check'); } function pplr_preview() { jQuery("#pplr-preview").remove(); jQuery("body").append("
Loading...
"); if (cstmfy_prodata[0] > 0) { var pplrlarge = jQuery(".pplr img:first").attr("src"); } else { var pplrlarge = product_personalizer["cstmfy_meta_" + pplrframe].split(",")[18].replace(queryreplacestring, '_1024x1024'); } jQuery("body").append("
"); jQuery("#pplr-preview").append("x
"); jQuery("#pplr-preview").height(pplrheight - 80); jQuery("#pplr-preview img").on("load", function() { jQuery("#pplr-preview-wrapper").height(jQuery("#pplr-preview img").width()); jQuery("#pplr-preview-wrapper").width(jQuery("#pplr-preview img").height()); jQuery("#pplr-preview").width(jQuery("#pplr-preview img").width()); jQuery("#pplr-preview").height(jQuery("#pplr-preview img").height()); var margin = (pplrheight - jQuery("#pplr-preview").height()) / 2 - 20; jQuery("#pplr-preview").css({ "top": margin, "bottom": margin }); jQuery(".pplr canvas").remove(); jQuery(".pplr").removeClass("pplr"); jQuery("#pplr-preview-wrapper").addClass("pplr"); if (cstmfy_prodata[0] > 0) { pplrlarge = false; } for (var j = 0; j < cstmfy_prodata[1]; j++) { ChangeCanvas(j + 1, pplrlarge); } }); } function pplronload(pplr) { if (parseInt(cstmfy_prodata[8]) < 2) { pplr.parent().append("
Loading...
"); pplr.parent().addClass("blurr"); } } function chooseimage(tis) { var name = jQuery(tis).attr("name"); var lock_color = jQuery(tis).attr("data-color"); jQuery('.pplrimage[name="' + name + '"]').removeClass("selected"); jQuery(tis).addClass("selected"); jQuery('.img_url[name="' + name + '"]').attr("src", jQuery(tis).attr("data-image")); jQuery('.pplr_monogram[name="' + name + '"]').val(jQuery(tis).attr("data-val")).trigger("change"); if(lock_color!==''){jQuery('[c-color="single"]').attr('data-color',lock_color).trigger('change');} }; function isElementVisible(el) { var convertPoint = window.webkitConvertPointFromNodeToPage; if ("getBoundingClientRect" in el) { var rect = el.getBoundingClientRect(), vWidth = window.innerWidth || document.documentElement.clientWidth, vHeight = window.innerHeight || document.documentElement.clientHeight, efp = function(x, y) { return document.elementFromPoint(x, y) }; if (rect.left + rect.width / 4 < 1) { return false; } else { return true; } } else if (convertPoint) { return true; } } function queryimgmatch(t) { var gmatch = false; var pplrRefImage = t.attr("src").split("?")[0].replace(queryreplacestring, ".").split("/products/").pop().split(".")[0]; for (var j = 0; j < pplr_product["images"].length; j++) { var searchUrl = pplr_product["images"][j]; searchUrl = searchUrl.split("?")[0].replace(queryreplacestring, ".").split("/products/").pop().split(".")[0]; if (pplrRefImage.indexOf(searchUrl) > -1) { gmatch = true; } } if (gmatch) { return true; } else { return false; } } function checkopacity(t) { if (t.parents().css("opacity") > 0.2 && t.css("opacity") > 0.2) { return true; } else { return false; } } function first_prod_img() { var pplrsrcset = jQuery("body img[srcset*='/products/\']:visible"); for (i = 0; i < pplrsrcset.length; i++) { var srcset = pplrsrcset.attr('src'); if (typeof srcset !== typeof undefined && srcset !== false) { } else{ pplrsrcset.attr('src',pplrsrcset.attr('srcset')); } } var pplrimg = jQuery("body img[src*='/products/\']:visible"); var pplrwidths = pplrimg.map(function() { if (queryimgmatch(jQuery(this))) { return jQuery(this).width(); } else { return 0; } }).get(); var pplrmaxwidth = Math.max.apply(null, pplrwidths); var pplrnotfound = true; for (i = 0; i < pplrimg.length; i++) { if (queryimgmatch(pplrimg.eq(i))) { if (pplrimg.eq(i).parents().hasClass("pplr-p-left")) { if (pplrnotfound) { var first_prod_img = pplrimg.eq(i); var pplrnotfound = false; return first_prod_img; } } } } for (i = 0; i < pplrimg.length; i++) { if (queryimgmatch(pplrimg.eq(i))) { if (pplrimg.eq(i).parents().hasClass("pplr-prev-left")) { if (pplrnotfound) { var first_prod_img = pplrimg.eq(i); var pplrnotfound = false; return first_prod_img; } } } } for (i = 0; i < pplrimg.length; i++) { if (queryimgmatch(pplrimg.eq(i))) { if (pplrimg.eq(i).parents().hasClass(settings_json[10])) { if (pplrnotfound) { var first_prod_img = pplrimg.eq(i); var pplrnotfound = false; return first_prod_img; } } } } for (i = 0; i < pplrimg.length; i++) { if (queryimgmatch(pplrimg.eq(i))) { if (pplrimg.eq(i).parents().hasClass("slick-active") || pplrimg.eq(i).parents().hasClass("flex-active-slide") || pplrimg.eq(i).parents().hasClass("is-selected") || pplrimg.eq(i).parents().hasClass("product-single__photo") || pplrimg.eq(i).hasClass("product-single__image") || pplrimg.eq(i).parents().hasClass("product-single__photo-wrapper") || pplrimg.eq(i).parents().hasClass("pplr-p-left") || pplrimg.eq(i).parents().hasClass(settings_json[10])) { if (pplrnotfound) { var first_prod_img = pplrimg.eq(i); var pplrnotfound = false; return first_prod_img; } } } } if (pplrnotfound) { for (i = 0; i < pplrimg.length; i++) { if (queryimgmatch(pplrimg.eq(i))) { var pplrimgnew = pplrimg.eq(i); var visible = isElementVisible(pplrimgnew.parent()[0]); if (checkopacity(pplrimg.eq(i)) && pplrimg.eq(i).width() > (pplrmaxwidth - 100) && visible && pplrnotfound) { var first_prod_img = pplrimg.eq(i); pplrnotfound = false; break; } } } } if (pplrnotfound) { for (i = 0; i < pplrimg.length; i++) { if (queryimgmatch(pplrimg.eq(i))) { if (checkopacity(pplrimg.eq(i)) && pplrimg.eq(i).width() > (pplrmaxwidth - 100) && pplrnotfound) { var first_prod_img = pplrimg.eq(i); pplrnotfound = false; break; } } } } if (pplrnotfound) { for (i = 0; i < pplrimg.length; i++) { if (checkopacity(pplrimg.eq(i)) && pplrnotfound) { var first_prod_img = pplrimg.eq(i); pplrnotfound = false; break; } } } if (pplrnotfound) { for (i = 0; i < pplrimg.length; i++) { if (pplrnotfound) { var first_prod_img = pplrimg.eq(i); pplrnotfound = false; break; } } } if (pplrnotfound) { var first_prod_img = jQuery("body img[src*='/products/\']:visible").first(); } return first_prod_img; } function LoadPplrWithFont(frame, t, tis, k) { clearTimeout(checktimout); pplrframe = frame; var pplr_load = parseInt(cstmfy_prodata[8]); if (tis) { var pplrline = product_personalizer['cstmfy_meta_' + frame].split(',')[7]; if (parseInt(pplrline) < 1) { pplrl = 1; } if (!jQuery(tis).hasClass('pplr-crop')) { limitTextarea(tis, pplrline, product_personalizer['cstmfy_meta_' + frame].split(',')[17]); } if (jQuery(tis).hasClass('pplr_text')) { if (jQuery(tis).val() !== '') { if (jQuery(".pplr-wrapper[data-main='" + frame + "']").css('display') !== 'none') { if(!jQuery(".jscolor[data-frame='" + frame + "']").hasClass("pplr_hide_duplicate")){ jQuery(".jscolor[data-frame='" + frame + "']").prop('disabled', false); } if(!jQuery(".pplr-font[data-frame='" + frame + "']").hasClass("pplr_hide_duplicate")){ jQuery(".pplr-font[data-frame='" + frame + "']").prop('disabled', false); } if(!jQuery(".pplrjscolor[data-frame='" + frame + "']").hasClass("pplr_hide_duplicate")){ jQuery(".pplrjscolor[data-frame='" + frame + "']").prop('disabled', false); } } } else { if(!jQuery(".jscolor[data-frame='" + frame + "']").hasClass("pplr_show_duplicate")){ jQuery(".jscolor[data-frame='" + frame + "']").prop('disabled', true); } if(!jQuery(".pplr-font[data-frame='" + frame + "']").hasClass("pplr_show_duplicate")){ jQuery(".pplr-font[data-frame='" + frame + "']").prop('disabled', true); } if(!jQuery(".pplrjscolor[data-frame='" + frame + "']").hasClass("pplr_show_duplicate")){ jQuery(".pplrjscolor[data-frame='" + frame + "']").prop('disabled', true); } } } } if (t) { var p_c_a = ['.pplr_monogram', '.jscolor']; for (index = 0, len = p_c_a.length; index < len; ++index) { jQuery(p_c_a[index]).each(function() { var thisframe = jQuery(p_c_a[index] + "[data-frame='" + frame + "']"); if (jQuery(this).attr('data-frame') !== frame) { if (jQuery(this).attr('name') == thisframe.attr('name') && thisframe.hasClass('cp-sel-Photos') === false) { if (jQuery(this).val() !== thisframe.val()) { jQuery(this).val(thisframe.val()); if (pplr_load < 2) { checkpplrClass(jQuery(this).attr('data-frame')); } if (k) { checkpplrClass(jQuery(this).attr('data-frame')); } } } } }); } var p_c_c = ['.pplr-font', '.pplrjscolor']; for (index = 0, len = p_c_c.length; index < len; ++index) { jQuery(p_c_c[index]).each(function() { var thisframe = jQuery(p_c_c[index] + "[data-frame='" + frame + "']"); if (jQuery(this).attr('data-frame') !== frame) { if (jQuery(this).attr('name') == thisframe.attr('name') && thisframe.hasClass('cp-sel-Photos') === false) { if (jQuery(this).val() !== thisframe.val()) { jQuery(this).val(thisframe.val()); jQuery(this).attr('data-value', thisframe.attr('data-value')); jQuery(this).parent().find('span[data-color=\"' + thisframe.attr('data-value') + '"]').addClass('selected').siblings().removeClass('selected'); jQuery(this).parent().find('.pplr-selecter-selected').text(thisframe.val()).css('font-family',thisframe.attr('data-value').replace(".ttf", "")); if (pplr_load < 2) { checkpplrClass(jQuery(this).attr('data-frame')); } if (k) { checkpplrClass(jQuery(this).attr('data-frame')); } } } } }); } } if (pplr_load < 2) { checkpplrClass(frame, false, false); } if (k) { checkpplrClass(frame, false, false); } pplrqty(); } function pplrnewload() { var pplr = first_prod_img(); jQuery(".pplr canvas").remove(); jQuery('.pplr_loader').remove(); jQuery('.blurr').removeClass('blurr'); jQuery('.pplr').removeClass('pplr'); pplr.parent().addClass('pplr'); LoadPplrWithFont(1); } var recursivetime1; function recursivelycheck(recursivetime,pplrcurrentimage) { checktimout = setTimeout(function() { var pplr = first_prod_img(); var attr = pplr.attr('pplr-src'); if (typeof attr !== typeof undefined && attr !== false) { if (pplr.attr('pplr-src') !== pplr.attr('src')) { pplr.attr('src', pplr.attr('pplr-src')); pplr.removeAttr("pplr-src"); checkpplrClass(pplrframe, false, true); } } if (jQuery('.pplr')[0]) { if (pplr.attr('src') !== pplrcurrentimage || pplr.attr('src') !== jQuery('.pplr img:first').attr('src')) { console.log('Image Changed'); checkpplrClass(pplrframe, false, true); pplrcurrentimage = jQuery('.pplr img:first').attr('src'); } } else { checkpplrClass(pplrframe, false, true); } recursivetime1 = recursivetime + 100; if (recursivetime1 < 10000) { recursivelycheck(recursivetime,pplrcurrentimage); } }, 100); } if (cstmfy_prodata[10] < 3) { setTimeout(function() { jQuery('.single-option-selector,form[action="/cart/add"] input[type=radio],select[name="id"],input[name="id"]').change(function() { pplr_prev_left(); if(!jQuery(this).hasClass('pplr_check')){ if (cstmfy_prodata[8] > 0 || jQuery('.pplr')[0]) { recursivelycheck(100,pplrcurrentimage); } else { jQuery(".pplr canvas").remove(); } } }); jQuery('body img[src*="/products/"],.flex-next, .flex-prev, .swatch-element,.flickity-prev-next-button,.pplr').each(function() { jQuery(this).on('touchstart click', function() { if (!jQuery(this).parent().hasClass('pplr')) { if (cstmfy_prodata[8] > 0 || jQuery('.pplr')[0]) { recursivelycheck(100,pplrcurrentimage); } else { jQuery(".pplr canvas").remove(); } } }); }); }, 200); } function checkpplrClass(pplrframe, d, t) { if (d) { var checkpplr = d.find("img"); jQuery(".pplr canvas").remove(); jQuery(".pplr").removeClass("pplr"); checkpplr.parent().addClass("pplr"); CheckpplrImage(pplrframe, false); } else { jQuery('.pplr_loader').remove(); jQuery('.blurr').removeClass('blurr'); var checkpplr = first_prod_img(); if (jQuery(".pplr")[0]) { if (jQuery(".pplr img:first").attr("src") !== checkpplr.attr("src")) { jQuery(".pplr canvas").remove(); jQuery(".pplr").removeClass("pplr"); checkpplr.parent().addClass("pplr"); } } else { checkpplr.parent().addClass("pplr"); } if (t) { for (var j = 0; j < cstmfy_prodata[1]; j++) { CheckpplrImage(j + 1, true); } } else { CheckpplrImage(pplrframe); } } } function CheckpplrImage(frame, t) { var pplr = jQuery(".pplr img:first"); pplr.removeAttr("srcset"); var pplrRefImage = pplr.attr("src").split("?")[0].replace(queryreplacestring, ".").split("/products/").pop().split(".").slice(0, -1).join("."); var pplrRefImage2 = pplr.attr("src").split("?")[0].split("/products/").pop().split(".").slice(0, -1).join(".").split("_").slice(0, -1).join("_"); if (cstmfy_prodata[0] > 0) { var pplr_search_image = true; if (pplr_product["variants"][0]["featured_image"]) { var searchUrlFirst = pplr_product["variants"][0]["featured_image"]["src"]; for (var j = 0; j < pplr_product["variants"].length; j++) { if (pplr_product["variants"][j]["featured_image"]) { var searchUrl = pplr_product["variants"][j]["featured_image"]["src"]; searchUrl = searchUrl.split("?")[0].replace(queryreplacestring, ".").split("/products/").pop().split(".").slice(0, -1).join("."); if (pplrRefImage === searchUrl || pplrRefImage2 === searchUrl) { ChangeCanvas(frame); pplr_search_image = false; break; } else {} } } if (pplr_search_image) { if (t) { jQuery(".pplr canvas").remove(); } else { pplr.attr("pplr-src", pplr.attr("src")); pplr.attr("src", searchUrlFirst); pplr.parent().addClass("pplr"); pplronload(pplr); var imgObj3 = new Image(); imgObj3.onload = function() { setTimeout(function() { ChangeCanvas(frame); }, 0); } imgObj3.src = searchUrlFirst; } } } else { ChangeCanvas(frame); } } else { var searchUrl = product_personalizer["cstmfy_meta_" + frame].split(",")[18]; var searchUrlFirst = searchUrl; searchUrl = searchUrl.split("?")[0].replace(queryreplacestring, ".").split("/products/").pop().split(".").slice(0, -1).join("."); if (t) { if (pplrRefImage === searchUrl || pplrRefImage2 === searchUrl) { ChangeCanvas(frame); } else { jQuery('.pplr canvas').remove(); } } else { if (pplrRefImage !== searchUrl) { pplr.attr("pplr-src", pplr.attr("src")); pplr.attr("src", searchUrlFirst); pplr.parent().addClass("pplr"); pplronload(pplr); var imgObj3 = new Image(); imgObj3.onload = function() { ChangeCanvas(frame); } imgObj3.src = searchUrlFirst; } else { ChangeCanvas(frame); } } } } var eqn = 1; var mainCanvas; function ChangeCanvas(frame, k) { jQuery('.pplr_loader').remove(); jQuery('.blurr').removeClass('blurr'); var canheight = jQuery('.pplr img:first').height(); var canwidth = jQuery('.pplr img:first').width(); if(canheight<1){ canheight = jQuery('.pplr').height(); } console.log(canheight); mainCanvas = document.createElement('canvas'); mainCanvas.width = canwidth*PIXEL_RATIO; mainCanvas.height = canheight*PIXEL_RATIO; mainCanvas.style.width = canwidth; mainCanvas.style.height = canheight; eqn = 1; recursivecanvasbottom(mainCanvas,frame,eqn); } function recursivecanvasbottom(mainCanvas,frame,eqn){ var varifycanvas = product_personalizer['cstmfy_meta_' + frame].split(',')[18]; if (product_personalizer['cstmfy_meta_' + eqn].split(',')[13] == 3) { jQuery(".product-personalizer").append('
'); var imgObj = new Image(); imgObj.crossOrigin = 'Anonymous'; imgObj.onload = function() { jQuery(".pplrloadingimage").remove(); var imginfo = jQuery('.pplr-crop[data-frame="' + eqn + '"]').val().split('_'); if (imginfo.length < 5) { var angle = 0; } else { var angle = imginfo[4]; } if (product_personalizer['cstmfy_meta_' + eqn].split(',')[18] === varifycanvas) { if (product_personalizer['cstmfy_meta_' + eqn].split(',')[16] == 2) { getText(mainCanvas, eqn, imginfo[0], imginfo[1], imginfo[2], imginfo[3], angle,imgObj); } } if(eqn==cstmfy_prodata[1]){ eqn = 1; recursivecanvasmiddle(mainCanvas,frame,eqn); } else{ eqn = eqn + 1; setTimeout(function() { recursivecanvasbottom(mainCanvas,frame,eqn); },pplr_delay) } } imgObj.src = jQuery('.img_url[data-frame=\"' + eqn + '"]').attr('src'); } else { if (product_personalizer['cstmfy_meta_' + eqn].split(',')[18] === varifycanvas) { getText(mainCanvas, eqn); } if(eqn==cstmfy_prodata[1]){ eqn = 1; recursivecanvasmiddle(mainCanvas,frame,eqn); } else{ eqn = eqn + 1; recursivecanvasbottom(mainCanvas,frame,eqn); } }; } function recursivecanvasmiddle(mainCanvas,frame){ var canheight = mainCanvas.height; var canwidth = mainCanvas.width; var ctxRef = mainCanvas.getContext('2d'); var imgObj = new Image(); imgObj.crossOrigin = 'Anonymous'; imgObj.onload = function(){ if (isSafari() && iOS) { var s = detectVerticalSquash(imgObj); } else { var s = 1 } ctxRef.drawImage(imgObj, 0, 0, imgObj.naturalWidth*s, imgObj.naturalHeight*s, 0, 0, canwidth, canheight); eqn = 1; setTimeout(function() { recursivecanvastop(mainCanvas,frame,eqn); },pplr_delay); }; imgObj.src = jQuery('.pplr img:first').attr('src'); } function recursivecanvastop(mainCanvas,frame,eqn){ var varifycanvas = product_personalizer['cstmfy_meta_' + frame].split(',')[18]; if (product_personalizer['cstmfy_meta_' + eqn].split(',')[13] == 3) { jQuery(".product-personalizer").append('
'); var imgObj = new Image(); imgObj.crossOrigin = 'Anonymous'; imgObj.onload = function() { jQuery(".pplrloadingimage").remove(); var imginfo = jQuery('.pplr-crop[data-frame="' + eqn + '"]').val().split('_'); if (imginfo.length < 5) { var angle = 0; } else { var angle = imginfo[4]; } if (product_personalizer['cstmfy_meta_' + eqn].split(',')[18] === varifycanvas) { if (product_personalizer['cstmfy_meta_' + eqn].split(',')[16] == 1) { getText(mainCanvas, eqn, imginfo[0], imginfo[1], imginfo[2], imginfo[3], angle,imgObj); } } if(eqn==cstmfy_prodata[1]){ if(jQuery('.pplr canvas')[0]){ jQuery('.pplr canvas').remove(); } jQuery('.pplr').append(mainCanvas); jQuery('.pplr canvas').css('left', jQuery('.pplr img:first').css('padding-left')); jQuery('.pplr canvas').css('top', jQuery('.pplr').css('padding-top')); jQuery('.pplr canvas').css('margin-left', jQuery('.pplr img:first').offset().left-jQuery('.pplr').offset().left); jQuery('.pplr canvas').css('margin-top', jQuery('.pplr img:first').css('margin-top')); jQuery('.pplr canvas').css('width', jQuery('.pplr img:first').width()); jQuery('.pplr img:first').css('border', 0); pplrloadfinish=pplrloadfinish+1; jQuery("#pplr-preview").css("opacity", 1); jQuery(".pplr-modal-box").css('opacity', 1); } else{ eqn = eqn + 1; setTimeout(function() { recursivecanvastop(mainCanvas,frame,eqn); },pplr_delay) } } imgObj.src = jQuery('.img_url[data-frame=\"' + eqn + '"]').attr('src'); } else { if (product_personalizer['cstmfy_meta_' + eqn].split(',')[18] === varifycanvas) { getText(mainCanvas, eqn); } if(eqn==cstmfy_prodata[1]){ if(jQuery('.pplr canvas')[0]){ jQuery('.pplr canvas').remove(); } jQuery('.pplr').append(mainCanvas); jQuery('.pplr canvas').css('left', jQuery('.pplr img:first').css('padding-left')); jQuery('.pplr canvas').css('top', jQuery('.pplr').css('padding-top')); jQuery('.pplr canvas').css('margin-left', jQuery('.pplr img:first').offset().left-jQuery('.pplr').offset().left); jQuery('.pplr canvas').css('margin-top', jQuery('.pplr img:first').css('margin-top')); jQuery('.pplr canvas').css('width', jQuery('.pplr img:first').width()); jQuery('.pplr img:first').css('border', 0); pplrloadfinish=pplrloadfinish+1; jQuery("#pplr-preview").css("opacity", 1); jQuery(".pplr-modal-box").css('opacity', 1); } else{ eqn = eqn + 1; recursivecanvastop(mainCanvas,frame,eqn); } }; } function pplrCHex(hex, opacity) { hex = hex.replace('#', ''); r = parseInt(hex.substring(0, 2), 16); g = parseInt(hex.substring(2, 4), 16); b = parseInt(hex.substring(4, 6), 16); result = 'rgba(' + r + ',' + g + ',' + b + ',' + opacity + ')'; return result; } function capitalize(text) { return text.replace(/\b\w/g, function(m) { return m.toUpperCase(); }); } function limitTextarea(textarea, maxLines, maxChar) { var lines = textarea.value.replace(/\\r/g, '').split('\n'), lines_removed, char_removed, i, pos; if (maxLines && lines.length > maxLines) { lines = lines.slice(0, maxLines); lines_removed = 1 } if (maxChar) { i = lines.length; while (i-- > 0) if (lines[i].length > maxChar) { l = lines[i].slice(-1); pos = lines[i].lastIndexOf(' '); if (pos < 0) { lines[i] = lines[i].slice(0, maxChar); if (maxLines && lines.length < maxLines) { lines[i] = lines[i] + '\n' + l; } } else { lines[i] = lines[i].substring(0, pos) + '\n' + lines[i].substring(pos + 1); } char_removed = 1; } if (char_removed || lines_removed) { textarea.value = lines.join('\n') } } } function wrapText(context, text, x, y, maxWidth, font, areafSize, align, valign, maxlinenumber, line_height, h, fheight) { var linebreaks = text.split('\n'); for (var ii = 0; ii < linebreaks.length; ii++) { var words = linebreaks[ii]; var i, textWidth, fSize, textHeight; for (i = areafSize; i > 1; i--) { textWidth = get_tex_width(words, i + 'pt ' + font); textHeight = (getTextHeight(font, i).height) * line_height * linebreaks.length; if (textWidth < maxWidth && textHeight < h) { areafSize = i; fSize = i; break; } } } var lineHeightprime = (getTextHeight(font, fSize).height)* line_height; var lineHeight = (getTextHeight(font, fSize * fheight).height) * line_height; if (valign == '2') { y += (h - lineHeightprime * linebreaks.length) / 2 - lineHeight / 2 + areafSize / 2; } if (valign == '3') { y += (h - lineHeightprime * linebreaks.length); } var linenumber = 1; for (var ii = 0; ii < linebreaks.length; ii++) { var words = linebreaks[ii]; context.font = (fSize * fheight + 'pt') + ' ' + font; var testWidth = context.measureText(words).width; if (align == 'left') { var fixalign = maxWidth / 2; } if (align == 'right') { var fixalign = -maxWidth / 2 + testWidth; } if (align == 'center') { var fixalign = testWidth / 2; } y += lineHeight; context.fillText(words, x - fixalign, y); linenumber = linenumber + 1; } } function getTextHeight(font, areaFsize, dtxt) { if (dtxt) { var Hg = dtxt; } else { var Hg = 'Hgf'; } var text = jQuery('' + Hg + '').css({ fontFamily: font, 'font-size': areaFsize + 'pt' }); var block = jQuery('
'); var div = jQuery('
'); div.append(text, block); var body = jQuery('body'); body.append(div); try { var result = {}; block.css({ verticalAlign: 'baseline' }); result.ascent = block.offset().top - text.offset().top; block.css({ verticalAlign: 'bottom' }); result.height = block.offset().top - text.offset().top; result.width = text.width(); result.descent = result.height - result.ascent; } finally { div.remove(); } return result; }; function get_tex_width(txt, font) { this.element = document.createElement('canvas'); this.context = this.element.getContext("2d"); this.context.font = font; return this.context.measureText(txt).width; } function detectVerticalSquash(img) { var iw = img.naturalWidth, ih = img.naturalHeight; var canvas = document.createElement('canvas'); canvas.width = 1; canvas.height = ih; var ctx = canvas.getContext('2d'); ctx.drawImage(img, 0, 0); var data = ctx.getImageData(0, 0, 1, ih).data; var sy = 0; var ey = ih; var py = ih; while (py > sy) { var alpha = data[(py - 1) * 4 + 3]; if (alpha === 0) { ey = py; } else { sy = py; } py = (ey + sy) >> 1; } var ratio = (py / ih); return (ratio === 0) ? 1 : ratio; } function getText(mainCanvas, eqn, uileft, uitop, perwidth, perheight, a,imgObj) { var canwidth = mainCanvas.width; var canheight= mainCanvas.height ; var ctxRef = mainCanvas.getContext('2d'); var cstmfy_meta = product_personalizer['cstmfy_meta_' + eqn].split(','); if (cstmfy_meta[23] == 1) { if (jQuery('.pplr_monogram:eq(' + (eqn - 1) + ')').val() !== '' || cstmfy_prodata[10] ==2) { var pplrstr = jQuery('.pplr_monogram:eq(' + (eqn - 1) + ')').val(); } else { var pplrstr = decodeHtml(cstmfy_meta[9]); } } else { var pplrstr = jQuery('.pplr_monogram:eq(' + (eqn - 1) + ')').val(); } var text = pplrstr.replace(/\\/g, ''); var ratio = 1; var type = cstmfy_meta[10]; var inputtype = cstmfy_meta[13]; if (jQuery('.img_url')[0]) { var image = jQuery('.img_url[data-frame=\"' + eqn + '"]').attr('src'); } var angle = cstmfy_meta[11]; var diameter = ratio * parseInt(cstmfy_meta[5]) * canheight / 500; var xpos = ratio * cstmfy_meta[2] * canwidth / 100; var ypos = ratio * cstmfy_meta[3] * canheight / 100; var width = ratio * cstmfy_meta[4] * canwidth / 100; var height = ratio * cstmfy_meta[14] * canheight / 100; var fcase = cstmfy_meta[19]; if(fcase==2){ text= text.toUpperCase(); } if(fcase==3){ text= text.toLowerCase(); } if(fcase==4){ text= capitalize(text); } var align = cstmfy_meta[20]; var valign = cstmfy_meta[30]; var color = cstmfy_meta[6]; if (jQuery('.pplr_text[data-frame=\"' + eqn + '"]').length !== 0) { var color = jQuery('.pplr_text[data-frame=\"' + eqn + '"]').attr('data-color'); } if (jQuery('.jscolor[data-frame=\"' + eqn + '"]').length !== 0) { var color = '#' + jQuery('input.jscolor[data-frame=\"' + eqn + '"]').val(); } if (jQuery('.pplrjscolor[data-frame=\"' + eqn + '"]').length !== 0) { var color = jQuery('.pplrjscolor[data-frame=\"' + eqn + '"]').attr('data-value'); } if (jQuery('input.pplr-font[data-frame=\"' + eqn + '"]').length !== 0) { var fName = jQuery('input.pplr-font[data-frame=\"' + eqn + '"]').attr('data-value').replace('.ttf', '').replace('_', ''); var fheight = jQuery('input.pplr-font[data-frame=\"' + eqn + '"]').attr('data-height'); } else { var fName = cstmfy_meta[0].split('/').pop(-1).replace('.ttf', '').replace('_', ''); var fheight = 1; } var dfName = cstmfy_meta[0].split('/').pop(-1).replace('.ttf', '').replace('_', ''); var opacity = 1 - cstmfy_meta[12] / 127; var line_height = cstmfy_meta[28]; var fSize = ratio * cstmfy_meta[1] * .75 * (canheight / 500); var areafSize = fSize; var dfSize = fSize; var adjust = diameter; if (diameter < 0) { var inwardFacing = true; var textInside = true; var startAngle = 0; diameter = -diameter; } else { var inwardFacing = false; var startAngle = 180; var textInside = false; } align = align.toLowerCase(); var clockwise = align == 'right' ? 1 : -1; startAngle = startAngle * (Math.PI / 180); if (inputtype == 3) { if (!uileft) uileft = 0; if (!uitop) uitop = 0; if (!perwidth) perwidth = width; if (!perheight) perheight = height; if (type > 2) { var radius = diameter / 2; if (isSafari() && iOS) { var s = detectVerticalSquash(imgObj); } else { var s = 1 } var arc = width / radius; if (!inwardFacing) { var angle = arc / 2 + Math.PI / 2; } else { var angle = 3 * Math.PI / 2 - arc / 2; } var x = parseInt(uileft); for (var sx = 0; sx < width; sx++) { var x = x + parseInt(perwidth) / width; if (!inwardFacing) { var y = ypos + radius - radius * Math.sin(angle); } else { y = ypos - radius - radius * Math.sin(angle); } ctxRef.drawImage(imgObj, x * s, uitop * s, 1, perheight * s, sx + xpos - width / 2, y, 5, height); if (!inwardFacing) { angle = angle - arc / width; } else { angle = angle + arc / width; } } return; } var ay = height; var extraY = ay - ay * Math.cos(angle * Math.PI / 180); var extraX = height * Math.sin(angle * Math.PI / 180); var c = 0; var d = 0; var rto = perwidth / perheight; var slm = height; var rto2 = width / height; if (parseInt(a) == -90) { c = ay; d = (parseInt(width) - parseInt(height)) / 2; height = width; width = slm; var rto2 = width / height; } if (parseInt(a) == 90) { c = 0; d = (-parseInt(width) - parseInt(height)) / 2; height = width; width = slm; var rto2 = width / height; } if (parseInt(a) == -180) { c = parseInt(height); d = -parseInt(width); } if (parseInt(a) == 270) { c = -ay; d = ay; } angle = parseInt(angle) - parseInt(a); if (isSafari() && iOS) { var s = detectVerticalSquash(imgObj); console.log('apple'); } else { var s = 1; } ctxRef.save(); ctxRef.translate(xpos - width / 2 - extraX - d, ypos + extraY + c); ctxRef.rotate(-angle * Math.PI / 180); if (rto2 > rto) { ctxRef.drawImage(imgObj, parseInt(uileft) * s, parseInt(uitop) * s, parseInt(perwidth) * s, parseInt(perheight) * s, (width - height * rto) / 2, 0, height * rto, height); } else { ctxRef.drawImage(imgObj, parseInt(uileft) * s, parseInt(uitop) * s, parseInt(perwidth) * s, parseInt(perheight) * s, 0, (height - width / rto) / 2, width, width / rto); } ctxRef.restore(); return; } var div = document.createElement('div'); div.innerHTML = text; div.style.position = 'absolute'; div.style.top = '-10000px'; div.style.left = '-10000px'; div.style.fontFamily = fName; div.style.fontSize = fSize; document.body.appendChild(div); var textMaxWidth = div.offsetWidth; var fonts = parseInt(fSize); var i; for (i = fonts; i > 1; i--) { div.style.fontSize = i + 'pt'; div.innerHTML = text; var textWidth = div.offsetWidth; var textHeight = div.offsetHeight; if (textWidth < width) { fSize = i * fheight; div.style.fontSize = fSize + 'pt'; textWidth = div.offsetWidth; textHeight = div.offsetHeight; break; } } jQuery(div).remove(); fSize = fSize + 'pt'; if (!textInside) diameter += textHeight * 2; mainCanvas.style.backgroundColor = 'none'; ctxRef.fillStyle = pplrCHex(color, opacity); if (inputtype == 2) { if (type == 1) { var maxlinenumber = parseInt(cstmfy_meta[7]); wrapText(ctxRef, text, xpos, ypos, width, fName, parseInt(areafSize), align, valign, maxlinenumber, line_height, height, fheight); return (mainCanvas); } ctxRef.font = (parseInt(areafSize) + 'pt') + ' ' + fName; ctxRef.save(); var ay = width / 2; var extra = ay * Math.sin(angle * Math.PI / 180); var extra2 = ay - ay * Math.cos(angle * Math.PI / 180); var ad = height; var extraY = ad - ad * Math.cos(angle * Math.PI / 180); var extraX = ad * Math.sin(angle * Math.PI / 180); ctxRef.translate(xpos - extra2 - extraX, ypos - extra + extraY); ctxRef.rotate(-angle * Math.PI / 180); var maxlinenumber = jQuery("input[name='cstmfy_wrap[]']:eq(" + eqn + ")").val(); wrapText(ctxRef, text, 0, 0, width, fName, parseInt(areafSize), align, valign, maxlinenumber, line_height, height); ctxRef.restore(); return ; } ctxRef.font = fSize + ' ' + fName; var fixalign = textWidth / 2; if (type == 1) { if (align == 'left') { var fixalign = width / 2; } if (align == 'right') { var fixalign = -width / 2 + textWidth; } if (align == 'center') { var fixalign = textWidth / 2; } ctxRef.fillText(text, xpos - fixalign, ypos + fonts / 2 + parseInt(fSize) / 2); return ; } if (type == 2) { ctxRef.save(); var ay = width / 2; var extra = ay * Math.sin(angle * Math.PI / 180); var extra2 = ay - ay * Math.cos(angle * Math.PI / 180); var ad = height - fonts / 2 - parseInt(fSize) / 2; var extraY = ad - ad * Math.cos(angle * Math.PI / 180); var extraX = ad * Math.sin(angle * Math.PI / 180); ctxRef.translate(xpos - extra2 - extraX, ypos + fonts / 2 + parseInt(fSize) / 2 - extra + extraY); ctxRef.rotate(-angle * Math.PI / 180); ctxRef.textAlign = align; if (align == 'left') { ctxRef.fillText(text, -width / 2, 0); } if (align == 'right') { ctxRef.fillText(text, width / 2, 0); } if (align == 'center') { ctxRef.fillText(text, 0, 0); } ctxRef.restore(); return ; } ctxRef.save(); if (((['left', 'center'].indexOf(align) > -1) && inwardFacing) || (align == 'right' && !inwardFacing)) text = text.split('').reverse().join(''); ctxRef.translate(xpos, ypos - adjust / 2); startAngle += ((Math.PI + angle) * !inwardFacing); ctxRef.textBaseline = 'middle'; ctxRef.textAlign = 'center'; if (align == 'center') { for (var j = 0; j < text.length; j++) { var charWid = ctxRef.measureText(text[j]).width; if (inwardFacing) { var kerning = 0; } else { var kerning = 2*Math.tan((charWid / 2) / (diameter / 2 - textHeight ))* getTextHeight(fName, parseInt(fSize), text[j]).height; } startAngle += ((charWid + (j == text.length - 1 ? 0 : kerning )) / (diameter / 2 - textHeight / 2 + fonts / 2)) / 2 * -clockwise; } } ctxRef.rotate(startAngle); for (var j = 0; j < text.length; j++) { var charWid = ctxRef.measureText(text[j]).width; if (inwardFacing) { var kerning = 0; } else { var kerning = 2*Math.tan((charWid / 2) / (diameter / 2 - textHeight))* getTextHeight(fName, parseInt(fSize), text[j]).height; } ctxRef.rotate((charWid / 2) / (diameter / 2 - textHeight / 2 + fonts / 2) * clockwise); if (inwardFacing) { ctxRef.fillText(text[j], 0, (0 - diameter / 2)); } else { ctxRef.fillText(text[j], 0, -1 * (0 - diameter / 2 + textHeight) + fonts / 2); } ctxRef.rotate((charWid / 2 + kerning) / (diameter / 2 - textHeight / 2 + fonts / 2) * clockwise); } ctxRef.restore(); return ; }; function withouthtml5pplr(input, inputfile, frame) { var formData = new FormData(); formData.append("files", inputfile.files[0]); jQuery.ajax({ xhr: function() { jQuery(".pprl-progressbar").remove(); jQuery(input).after('
' + settings_json[5] + '

'); var xhr2 = new window.XMLHttpRequest(); xhr2.upload.addEventListener("progress", function(evt) { if (evt.lengthComputable) { var percentComplete = (evt.loaded / evt.total) * 100; jQuery(".loader-canvas .progress").width(percentComplete + "%"); jQuery(".loader-canvas .progress-txt").text(parseInt(percentComplete) + "%"); if (percentComplete > 99) { jQuery(".pprl-progressbar .progress-title").text("Please Wait while image loading"); var originalText = jQuery(".pprl-progressbar .progress-title").text(); i = 0; setInterval(function() { jQuery(".pprl-progressbar .progress-title").append("-"); i++; if (i == 4) { jQuery(".pprl-progressbar .progress-title").html(originalText); i = 0; } }, 500); } } }, false); return xhr2; }, url: "https://doshopify.com/product-personalizer/server/php/upload.php", type: "POST", data: formData, processData: false, contentType: false, success: function(data) { canvasimagepplr(input, data, frame); } }); } function fileuploadpplr(tis, e) { jQuery(tis).closest("form").attr("enctype", "multipart/form-data"); jQuery(".cp-sel-Photos ul li").remove(); var frame = jQuery(tis).attr("data-frame"); if (window.FileReader && !isSafari() && !iOS && product_personalizer['cstmfy_meta_' + frame].split(',')[10] < 2) { var file = e.target.files[0]; if (file) { if (/^image\//i.test(file.type)) { readURL(file, tis, frame); } else { alert("Not a valid image!"); } } } else { withouthtml5pplr(tis, e.target, frame); } }; function readURL(file, input, frame) { var reader = new FileReader(); jQuery(input).after('
' + settings_json[5] + '

'); reader.onloadend = function() { var targetthis = reader.result; canvasimagepplr(input, dataurlToBlobUrl(targetthis), frame); } reader.onprogress = function(data) { if (data.lengthComputable) { var percentComplete = parseInt(((data.loaded / data.total) * 100), 10); jQuery(".loader-canvas .progress").width(percentComplete + "%"); jQuery(".loader-canvas .progress-txt").text(parseInt(percentComplete) + "%"); } } reader.readAsDataURL(file); }; function dataurlToBlobUrl(url) { var parts = url.split(',', 2); var mime = parts[0].substr(5).split(';')[0]; var blob = b64toBlob(parts[1], mime); return URL.createObjectURL(blob); } function b64toBlob(b64Data, contentType, sliceSize) { contentType = contentType || ''; sliceSize = sliceSize || 512; var byteCharacters = atob(b64Data); var byteArrays = []; for (var offset = 0; offset < byteCharacters.length; offset += sliceSize) { var slice = byteCharacters.slice(offset, offset + sliceSize); var byteNumbers = new Array(slice.length); for (var i = 0; i < slice.length; i++) { byteNumbers[i] = slice.charCodeAt(i); } var byteArray = new Uint8Array(byteNumbers); byteArrays.push(byteArray); } var blob = new Blob(byteArrays, { type: contentType }); return blob; } function cropperpplr(data_name, frame, nwidth, nheight, ratio) { var recheck; jQuery(".pplr-modal-img").cropper({ aspectRatio: ratio, zoomOnWheel: false, rotatable: true, scalable: true, minContainerWidth: 100, minCropBoxWidth:100, minCropBoxHeight:100, checkOrientation: true, minContainerWidth: jQuery("pplr-p-right").width(), strict: false, viewMode: 1, crop: function(e) { clearTimeout(recheck); recheck = setTimeout(function() { recalluipplr(e, data_name, frame, nwidth, nheight); }, 300); } }); } function pplr_modify(data_name, frame, nwidth, nheight, ratio) { if (cstmfy_prodata[10] >2 ) { jQuery('.crop_header').show(); return; } jQuery(".crop-modal").show(); jQuery(".pplr canvas").remove(); jQuery(".pplr").removeClass("pplr"); jQuery("body").addClass("pplr-modal-open"); jQuery(".pplr-modal-box").css('opacity', 0); cropperpplr(data_name, frame, nwidth, nheight, ratio); } function pplr_hide(tis,k) { if(k){ jQuery('.crop_header').hide(); return; } jQuery(".pplr-modal-img").cropper('destroy'); jQuery(".crop-modal").hide(); jQuery("body").removeClass("pplr-modal-open"); jQuery(".pplr canvas").remove(); jQuery(".pplr").removeClass("pplr"); jQuery('.pplr-crop[data-frame="' + tis + '"]').trigger('change'); } function canvasimagepplr(input, target, frame) { LoadPplrWithFont(frame); var pplr = jQuery(".pplr img:first"); var data_name = jQuery(input).attr("data_name"); jQuery('.pplr-crop[data_name="' + data_name + '"]').prop("disabled", false); jQuery('.img_url[data_name="' + data_name + '"]').attr("src", target); var pplr_dd = 'pplr_delete(' + frame + ',true)'; if (cstmfy_prodata[10] <3 ) { jQuery(".crop-modal").remove(); jQuery("body").append('

✔

✔
'); } else{ pplr_dd = 'pplr_delete(' + frame + ',true,true,true)'; jQuery('.pplr-modal-body').append('

✔
'); } setTimeout(function() { var imgObj2 = new Image(); imgObj2.onload = function() { var imgObj3 = new Image(); imgObj3.onload = function() { jQuery(".pprl-progressbar").remove(); if (cstmfy_prodata[10] <3 ) { jQuery("body").addClass("pplr-modal-open"); jQuery("body").find(".crop-modal").show(); var nwidth = jQuery(".pplr-modal-img").get(0).naturalWidth; var nheight = jQuery(".pplr-modal-img").get(0).naturalHeight; var min_width = product_personalizer["cstmfy_meta_" + frame].split(",")[32]; var min_height = product_personalizer["cstmfy_meta_" + frame].split(",")[33]; if (min_width > nwidth || min_height > nheight) { jQuery(".pplr-modal-box").css('opacity', 1); jQuery(".pplr-modal-box").css('max-width', 400); jQuery(".pplr-main").text('Sorry min width ' + min_width + 'px & min height ' + min_height + 'px'); pplr_delete(frame, false, true); return; } pplr_modal_correct(true); } jQuery(".pplr canvas").remove(); jQuery(".pplr").removeClass("pplr"); var ratio = (pplr.width() * product_personalizer["cstmfy_meta_" + frame].split(",")[4]) / (product_personalizer["cstmfy_meta_" + frame].split(",")[14] * pplr.height()); if (product_personalizer["cstmfy_meta_" + frame].split(",")[31] < 2) { ratio = ''; } jQuery(input).parent().find("ul").append('
    • '); cropperpplr(data_name, frame, nwidth, nheight, ratio); } imgObj3.src = target; } imgObj2.src = pplr.attr('src'); }, 500); } function recalluipplr(ui, data_name, frame, nwidth, nheight) { var awr = 1; var uileft = Math.abs(parseInt(ui.x)); var uitop = Math.abs(parseInt(ui.y)); var perwidth = Math.abs(parseInt(ui.width)); var perheight = Math.abs(parseInt(ui.height)); var rotate = parseInt(ui.rotate); if (rotate == -90) { var uileft = nwidth - Math.abs(parseInt(ui.y)) - perheight; perheight = Math.abs(parseInt(ui.width)); var uitop = Math.abs(parseInt(ui.x)); perwidth = Math.abs(parseInt(ui.height)); } if (rotate == 90) { var uileft = Math.abs(parseInt(ui.y)); perheight = Math.abs(parseInt(ui.width)); var uitop = nheight - Math.abs(parseInt(ui.x)) - perwidth; perwidth = Math.abs(parseInt(ui.height)); } if (rotate == -180) { var uitop = nheight - Math.abs(parseInt(ui.y)) - Math.abs(parseInt(ui.height)); var uileft = nwidth - Math.abs(parseInt(ui.x)) - perwidth; } jQuery('.pplr-crop[data_name="' + data_name + '"]').val((uileft * awr) + "_" + (uitop * awr) + "_" + (perwidth * awr) + "_" + (perheight * awr) + "_" + (rotate * awr)).trigger("change"); } function pplrqty() { var pplrqty = 0; jQuery(".pplraddprice").each(function() { if (jQuery(this).val() !== "" && jQuery(this).val() !== "blank") { pplrqty = pplrqty + parseFloat(jQuery(this).attr("data-price")); } }); if (jQuery(".pplrcur")[0]) { if (jQuery(".pplrcur").attr('data-cur-place') == 'right') { jQuery(".pplrcur").text((pplr_product.price / 100 + pplrqty).toFixed(2) + jQuery(".pplrcur").attr('data-cur')); } else { jQuery(".pplrcur").text(jQuery(".pplrcur").attr('data-cur') + (pplr_product.price / 100 + pplrqty).toFixed(2)); } } return pplrqty; } function pplr_Ready() { if (window.pplr_Loaded) { return; } var prodata = cstmfy_prodata; var cstmfy_all = prodata[0]; var cstmfy_count = prodata[1]; var url = prodata[2]; var url1 = prodata[2]; var img_size = prodata[3]; var preview = prodata[9]; var customize = prodata[10]; if (prodata.length > 13) { var cstmfy_preview_text = prodata[13]; } else { var cstmfy_preview_text = 'PREVIEW'; } var text = ''; var cstmfy_name = ''; var cstmfy_default = ''; var imageon = false; var gcolor = false; var pricechange = false; var pcropper = false var fontface = ''; var loadfont = ''; var pplrfontthumb = ''; if (settings_json[19] == 2) { var pplrfontthumb = ' pplrfontthumb '; } for (var x = 1; x <= cstmfy_count; x++) { var ccolor = ''; var cfont = ''; var meta = product_personalizer["cstmfy_meta_" + x].split(","); var frame = x; var cstmfy_name = decodeHtml(meta[8].replace("\\", "")); if (cstmfy_name == '') { var cstmfy_prop = x; } else { var cstmfy_prop = decodeHtml(meta[8].replace("\\", "")); } var tooltip = decodeHtml(meta[29]); if (tooltip !== '1' && jQuery.trim(tooltip) !== '') { if (settings_json[13] == 2) { cstmfy_name += ' ?' + tooltip + ''; } else { cstmfy_name += ' (' + tooltip + ')'; } } var cstmfy_class = " pplr-" + meta[8].split(' ').join('-').toLowerCase(); var cstmfy_class_opt = " pplr-" + meta[8].split(' ').join('-').toLowerCase(); var cstmfy_default = decodeHtml(meta[9].replace("\\", "")); var cstmfy_color = meta[6]; var cstmfy_required = ''; var placeholder_default = ''; var default_value = decodeHtml(meta[9]); var oindex= ''; if(meta[38]=='1') { var pattern= ''; } else{ var pattern= ''; } if (meta[23] == '1' && customize !==2 ) { var cstmfy_required = 'required'; var placeholder_default = decodeHtml(meta[9].replace("\n", " ").replace("\\", "")); var default_value = ''; } if (customize ==2 ) { var default_value = ''; } var optionwith = ''; var optionwithclass = ''; for (var y = x; y > 0; y--) { var z = y + 1; if (z > cstmfy_count) { var z = cstmfy_count; } if (product_personalizer["cstmfy_meta_" + y].split(",")[23] == 3) { var optionwith = ' '; optionwithclass = ' optionwithclass '; } else if (product_personalizer["cstmfy_meta_" + z].split(",")[23] == 3) { if (x == y) { var checked = 'checked'; } else { var checked = ''; } var optionwith = ' '; optionwithclass = ' optionwithclass '; break; } else { break; } } if (meta[23] <3 && meta[37]!=='1' && meta[37]!=='' && typeof(meta[37]) !== 'undefined') { oindex= ''; optionwithclass = ' optionwithclass '; } var pplr_arrow_main = ""; if (settings_json[0] == 2 && x != 1 && optionwith === '' && meta[21] != 1) { if (meta[23] != '1' || meta[21] != 1) { cstmfy_class = cstmfy_class + ' pplr-collapsible pplr-hide '; var pplr_arrow_main = "
    "; } } if (settings_json[0] == 2) { cstmfy_class_opt = cstmfy_class_opt + ' pplr-collapsible pplr-hide '; var pplr_arrow = "
    "; } else { var pplr_arrow = ""; } var cstmfy_fontname = meta[24].split('{{')[0]; if(meta[24].split('{{').length>1){ cstmfy_fontname+= ' ?' + meta[24].split('{{')[1].replace("}}", "") + ''; } var cstmfy_fontnamel = meta[24].split('{{')[0]; if (cstmfy_fontnamel == '') { cstmfy_fontnamel = 'Font'; } var cstmfy_colorname = meta[25].split('{{')[0]; if(meta[25].split('{{').length>1){ cstmfy_colorname+= ' ?' + meta[25].split('{{')[1].replace("}}", "") + ''; } var cstmfy_colornamel = meta[25].split('{{')[0]; if (cstmfy_colornamel == '') { cstmfy_colornamel = 'Color'; } var fcase = meta[19]; if (fcase == 1) { var transform = 'inherit'; } if (fcase == 2) { var transform = 'uppercase'; } if (fcase == 3) { var transform = 'lowercase'; } if (fcase == 4) { var transform = 'capitalize'; } var display = ""; var typedisabled = ""; var typeclass = ""; var cstmfy_input_type = meta[13]; if (cstmfy_input_type > 2) { var display = "display:none;"; var typedisabled = "disabled"; var typeclass = " cp-sel-Photos "; } var cstmfy_max = meta[17]; var crop = meta[22]; var priceclass = ''; var dataprice = ''; var disabled = ""; var ypos = meta[3]; var deselect = ""; var fileupload = 'fileupload '; if (ypos > 100) { var fileupload = ''; } if (meta[26] == 2) { var priceclass = ' pplraddprice'; var dataprice = 'data-price="' + meta[27] + '"'; var pricechange = true; } if (meta[26] >1 || meta[23] > 1 || prodata[10] > 1) { if (cstmfy_default == '') { var disabled = "disabled"; } } if (prodata[10] > 1) { if (default_value == '') { var disabled = "disabled"; } } if (meta[23] == 2) { if (settings_json[22] == 2) { var deselect = "" + settings_json[21] + ""; } else { var deselect = ""; } } if (prodata[4] !== '0' || meta[35] !== '1') { if(cstmfy_input_type !== 3){ if (prodata[4] == 1 || meta[35] == '2') { var ccolor = "
    "; var gcolor = true; } else { if (meta[35] !== '1') { var colorgroup = colorgroup_json[meta[35]]; } else { var colorgroup = colorgroup_json[prodata[4]]; } if (Array.isArray(colorgroup) || typeof(colorgroup) !== 'undefined') { var colorkey = Object.keys(colorgroup)[0]; if (!is_int(colorkey)) { var dcolorname = Object.keys(colorgroup)[0]; var dcolordata = colorgroup[dcolorname]; } else { var dcolorname = colorgroup[0]; var dcolordata = colorgroup[0]; } var ecolor = ''; for (var y = 0; y < Object.keys(colorgroup).length; ++y) { var selectcolor = ''; var colorkey = Object.keys(colorgroup)[y]; if (!is_int(colorkey)) { var tooltip = '
    ' + colorkey + '
    '; var colorname = colorkey; var colordata = colorgroup[colorkey]; } else { var tooltip = ''; var colorname = colorgroup[y]; var colordata = colorgroup[y]; } if (colordata == cstmfy_color) { selectcolor = 'selected'; dcolorname = colorname; dcolordata = colordata; } ecolor += '' + tooltip + ''; } ccolor = "
    "; ccolor += ecolor + "
    "; } } } var color_choice = ' data-color="'+cstmfy_color+'" '; } else{ var color_choice = ' c-color="single" data-color="'+cstmfy_color+'" '; } var myfont = meta[0].split('/'); var fct = myfont.length; loadfont += "
    .
    "; fontface += "@font-face {font-family: '" + myfont[fct - 1].replace(".ttf", "") + "';src: url('https://doshopify.com/product-personalizer/" + meta[0] + "') format('truetype');} "; var font_list = ''; if (prodata[6] !== '1' || meta[34] !== '1' ) { if(cstmfy_input_type !== 3){ if (meta[34] !== '1') { var fontgroup = fontgroup_json[meta[34]]; } else { var fontgroup = fontgroup_json[prodata[6]]; } if (Array.isArray(fontgroup) || typeof(fontgroup) !== 'undefined') { var fontkey = Object.keys(fontgroup)[0]; if (!is_int(fontkey)) { var selectfontname = fontkey; if (fontgroup[fontkey] instanceof Array) { var selectedfontval = fontgroup[fontkey][0]; var selectedfamily = fontgroup[fontkey][0].replace(".ttf", ""); } else { var selectedfontval = fontgroup[fontkey]; var selectedfamily = fontgroup[fontkey].replace(".ttf", ""); } } else { var selectedfontval = fontgroup[0]; var selectfontname = fontgroup[0].replace(".ttf", ""); var selectedfamily = fontgroup[0].replace(".ttf", ""); } for (var y = 0; y < Object.keys(fontgroup).length; ++y) { var fontkey = Object.keys(fontgroup)[y]; var selected_font = ""; if (meta[0] !== '') { if (!is_int(fontkey)) { if (fontgroup[fontkey] instanceof Array) { var fontfamily = fontgroup[fontkey][0].replace(".ttf", ""); var fontval = fontgroup[fontkey][0]; var fheight = fontgroup[fontkey][1]; } else { var fontfamily = fontgroup[fontkey].replace(".ttf", ""); var fontval = fontgroup[fontkey]; var fheight = 1; } var fontname = fontkey; } else { var fontfamily = fontgroup[y].replace(".ttf", ""); var fontval = fontgroup[y]; var fontname = fontgroup[y].replace(".ttf", ""); var fheight = 1; } if (fontval === myfont[fct - 1] && fontname !== '') { var selectedfontval = fontval; var selectfontname = fontname; var selectedfamily = fontfamily; var selected_font = " selected-font "; var sfheight = fheight; } fontface += "@font-face {font-family: '" + fontfamily + "';src: url('https://doshopify.com/product-personalizer/font/" + Shopify.shop + "/" + fontval + "') format('truetype');} "; loadfont += '
    test
    '; if (settings_json[23] == 2) { fontfamily = 'inherit'; selectedfamily = 'inherit'; } var fontclass = fontfamily.toLowerCase(); font_list += '' + fontname + ''; } } cfont = "
    " + selectfontname + "
    " + font_list + "
    "; } } } if (cstmfy_input_type == 3) { if (meta[21] == 1) { cimage = true; pcropper = true; jQuery('body').addClass('pplefileupload'); var imgsrc = 'https://doshopify.com/product-personalizer/' + meta[15]; text += oindex+"
      "; imageon = true; } else { var imagegroup = imagegroup_json[meta[21]]; if (Array.isArray(imagegroup) || typeof(imagegroup) !== 'undefined') { var displayimagegroup = ''; if (Object.keys(imagegroup).length > 1) { displayimagegroup = ''; } var imgsrc = 'https://doshopify.com/product-personalizer/' + meta[15]; text += oindex+"
      "; for (var y = 0; y < Object.keys(imagegroup).length; ++y) { selectimage = ''; var imagekey = Object.keys(imagegroup)[y]; var vimg_back = ''; var image_name = imagegroup[imagekey]; if (!is_int(imagekey)) { var imagelabel = '' + imagekey + ''; var data_val = imagekey; var data_color = ' data-color="" '; var data_price= ''; if (imagegroup[imagekey] instanceof Array) { var image_name = imagegroup[imagekey][0]; var vimg_back = imagegroup[imagekey][1].split("_"); if(imagegroup[imagekey].length>3) { var data_color = ' data-color="'+imagegroup[imagekey][2]+'" '; var data_price= imagegroup[imagekey][3]; } } } else { var imagelabel = ''; if (imagegroup[imagekey] instanceof Array) { var data_val = image_name[0].replace(".jpg", "").split("/").pop().replace(".jpeg", "").replace(".png", ""); var image_name = image_name[0]; } else { var data_val = image_name.replace(".jpg", "").split("/").pop().replace(".jpeg", "").replace(".png", ""); } } if (meta[15] == 'images/' + Shopify.shop + '/' + image_name) { var selectimage = 'selected'; } var imgsrc = 'https://doshopify.com/product-personalizer/images/' + Shopify.shop + '/' + image_name; if (vimg_back == '') { tooltip = '
      ' + imagelabel + '
      '; text += "" + tooltip + ""; } else { tooltip = '
      ' + imagelabel + '
      '; text += "' + tooltip + ""; } } text += deselect; } text += '
      '; } } else if (cstmfy_input_type == 2) { text += oindex+"
      "; } else { text += oindex+"
      "; } text += cfont + ccolor; } text += loadfont + ""; var pricechangeinput = ''; if (pricechange) { pricechangeinput = ''; } text += pricechangeinput; if (preview > 1) { text += ''; } if (prodata[10] > 1) { text = '
      ' + text + '
      '; } if (prodata[10] > 3) { jQuery('.'+settings_json[9]).hide(); } if (typeof __st != 'undefined') { var pd_id = __st.rid; } else { var pd_id = pplr_product.id; } var pplr_id = jQuery(".product-personalizer"); if (pplr_id[0]) { pplr_id.first().html(text); } if (prodata[10] > 1) { pplr_html= jQuery('.cstmfy_personalize_text').html(); } pplr_id.css({ 'padding': settings_json[2], 'margin': settings_json[3] }); if (settings_json[0] == 3) { pplr_id.css({ 'max-height': settings_json[1] + 'px', 'overflow-y': 'scroll', 'padding': '4%', 'overflow-x': 'hidden' }); var link = ""; jQuery("head").append(link); var wf = document.createElement("script"); wf.src = ("https:" == document.location.protocol ? "https" : "http") + "://cdnjs.cloudflare.com/ajax/libs/malihu-custom-scrollbar-plugin/3.1.5/jquery.mCustomScrollbar.min.js"; wf.type = "text/javascript"; document.getElementsByTagName("head")[0].appendChild(wf); jQuery(window).on("load", function() { // jQuery(".product-personalizer").mCustomScrollbar({theme: "dark-thin"}); jQuery(".pplr-selecter-options").mCustomScrollbar({ theme: "dark-thin" }); }); } if (pcropper) { var link = ""; jQuery("head").append(link); var wf = document.createElement("script"); wf.src = ("https:" == document.location.protocol ? "https" : "http") + "://cdnjs.cloudflare.com/ajax/libs/cropper/2.3.4/cropper.min.js"; wf.type = "text/javascript"; document.getElementsByTagName("head")[0].appendChild(wf); } ptooltiptext(); ptooltipswatch(); var fNamearray = []; for (var j = 0; j < cstmfy_prodata[1]; j++) { var meta = product_personalizer['cstmfy_meta_' + (j + 1)].split(','); if (jQuery('input.pplr-font')[j]) { var selectfonts = jQuery('input.pplr-font:eq(' + j + ')').attr('data-value').replace('.ttf', '').replace('_', ''); fNamearray.push(selectfonts); } else { fNamearray.push(meta[0].split('/').pop(-1).replace('.ttf', '').replace('.TTF', '').replace('_', '')); } } pplr_hide_duplicate(); if (prodata[10] > 1) { jQuery('.cstmfy_personalize_text').hide(); } pplr_id.show(); function dowebfontconfig(pplr) { pplr.parent().addClass('pplr'); pplronload(pplr); WebFontConfig = { custom: { families: fNamearray }, loading: function() {}, active: function() { font_loaded = true; var imgObj3 = new Image(); imgObj3.onload = function() { setTimeout(function() { LoadPplrWithFont(1); console.log('font loaded'); }, 0); } imgObj3.src = pplr.attr('src'); }, inactive: function() { console.log('font error'); var imgObj3 = new Image(); imgObj3.onload = function() { setTimeout(function() { LoadPplrWithFont(1); font_loaded = false; }, 0); } imgObj3.src = pplr.attr('src'); }, timeout: 5000 }; } if (cstmfy_prodata[8] > 0 && cstmfy_prodata[10] <3 ) { var pplr = first_prod_img(); if (typeof pplr !== 'undefined') { dowebfontconfig(pplr); } jQuery(window).on('load', function(font_loaded) { setTimeout(function() { var pplr = first_prod_img(); if (typeof pplr !== 'undefined') { if (jQuery('.pplr').length > 1 || !(pplr.parent().hasClass('pplr')) || jQuery('.pplr').length < 1) { pplrnewload(); console.log('document loaded'); if (jQuery('.pplr').length < 1) { dowebfontconfig(pplr); } } else { if (font_loaded === false) { LoadPplrWithFont(1); console.log('document loaded'); } } } }, 100); }); setTimeout(function() { var pplr = first_prod_img(); if (typeof pplr !== 'undefined') { if (jQuery('.pplr').length > 1 || !(pplr.parent().hasClass('pplr')) || jQuery('.pplr').length < 1) { pplrnewload(); if (jQuery('.pplr').length < 1) { dowebfontconfig(pplr); } } else { if (font_loaded === false) { LoadPplrWithFont(1); console.log('3 second'); } } } }, 3200); } if (gcolor) { var script = document.createElement("script"); script.type = "text/javascript"; script.src = "https://cdnjs.cloudflare.com/ajax/libs/jscolor/2.0.4/jscolor.min.js"; document.getElementsByTagName("head")[0].appendChild(script); } jQuery('input.pplr_check:checked').trigger('click'); window.pplr_Loaded = true; jQuery(document).on('scroll', function() { pplr_prev_left(); }) jQuery(add_to_cart).click(function(e) { create_pplr_product(e,this); pplr_addto_cart(e,this); }); var pplrwidth = jQuery(window).width(); jQuery(window).resize(function() { if (jQuery(window).width() !== pplrwidth) { if(jQuery('.pplr')[0] ){ jQuery('.pplrabs').remove(); LoadPplrWithFont(pplrframe); pplr_modal_correct(); pplrwidth = jQuery(window).width(); } } }) jQuery(document).on('webkitfullscreenchange mozfullscreenchange fullscreenchange', function(e) { pplr_modal_correct(); }); } var pplrReadyCustom = function(callback) { document.readyState === "interactive" || document.readyState === "complete" ? callback() : document.addEventListener("DOMContentLoaded", callback); }; var loadScript = function(url, callback) { var script = document.createElement("script") script.type = "text/javascript"; if (script.readyState) { script.onreadystatechange = function() { if (script.readyState == "loaded" || script.readyState == "complete") { script.onreadystatechange = null; callback(); } }; } else { script.onload = function() { callback(); }; } script.src = url; document.getElementsByTagName("head")[0].appendChild(script); }; if ((typeof $ === 'undefined') && (typeof jQuery === 'undefined')) { loadScript('//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js', function() { jQuery(document).ready(pplr_Ready); pplrReadyCustom(function() { pplr_Ready(jQuery) }); }); } else { var pplrwidth = jQuery(window).width(); jQuery(document).ready(pplr_Ready); pplrReadyCustom(function() { pplr_Ready(jQuery) }); }