<?php
/*
* Plugin-Name: Product Designer App
* Plugin-URI: https://productdesignerapp.com
* Author: productdesignerapp
* Page: Templates
*/

if (!defined('ABSPATH'))
{
    exit;
}
?>
<div id="pdapp-studio" class="d-block position-relative overflow-hidden" data-width="0" data-height="0">
    <template v-if="tempModalPX.zoom != undefined">
        <div id="pdapp-viewer-area" class="pdapp-studio-area d-inline-block position-relative overflow-auto pe-1" :data-ratio="tempModalPX.ratio" :data-zoom="tempModalPX.zoom">
            <div class="pdapp-viewport active position-relative" v-if="tempModalViewPort != ''" :style="tempModalViewPort">
                <div style="width: 100%;height: 100%;top: 0px;left: 0px; overflow: hidden;" class="pdapp-viewport-area position-absolute active">
                    <span class="pdapp-border-area"></span>
                    <div class="pdapp-text-arc" :style="'width: '+(tempModalPX.size.width*tempModalPX.ratio*100/tempModalPX.zoom)+'px; height: '+(tempModalPX.size.height*tempModalPX.ratio*100/tempModalPX.zoom)+'px;'"></div>
                    <div class="pdapp-selecto-ref"></div>
                    <svg class="pdapp-selecto-area" width="100%" height="100%" :data-width="tempModalPX.size.width" :data-height="tempModalPX.size.height" x="0" y="0" :view-box.camel="'0 0 '+(tempModalPX.size.width*tempModalPX.ratio*100/tempModalPX.zoom)+' '+(tempModalPX.size.height*tempModalPX.ratio*100/tempModalPX.zoom)" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"></svg>
                </div>
            </div>
        </div>
    </template>
</div>