{% extends 'layoutEshop3d.html.twig' %}
{% block page_contents %}
{% for message in app.flashes('notice') %}
<div class="flash-notice">
<div class='notice'>{{ message }}</div>
</div>
{% endfor %}
{% for message in app.flashes('error') %}
<div class="flash-error">
<div class='error'>{{ message }}</div>
</div>
{% endfor %}
{# {% block title %}{{ 'Hello E-shop 3D' }}{% endblock %}#}
{# we setup images for 3D space #}
{% set gallery3DInfo = [] %}
{% set gallery3DInfo = gallery3DInfo|merge({'image_size_horisontal': '4.8 3.2 0.1'}) %}
{% set gallery3DInfo = gallery3DInfo|merge({'frame_size_horisontal': '5.2 3.6 0.1'}) %}
{% set gallery3DInfo = gallery3DInfo|merge({'image_size_vertical': '3.2 4.8 0.1'}) %}
{% set gallery3DInfo = gallery3DInfo|merge({'frame_size_vertical': '3.6 5.2 0.1'}) %}
{# we prepare textures #}
{% set textureArray = [] %}
{% set textureArray = textureArray|merge({'floor-texture-1': ''}) %}
{% set textureArray = textureArray|merge({'floor-texture-2': ''}) %}
{% set textureArray = textureArray|merge({'ceil-texture-1': ''}) %}
{% set textureArray = textureArray|merge({'wall-texture-1': ''}) %}
{% set textureArray = textureArray|merge({'wall-texture-2': ''}) %}
{% set textureArray = textureArray|merge({'background-front': ''}) %}
{% set textureArray = textureArray|merge({'background-back': ''}) %}
{% set textureArray = textureArray|merge({'background-left': ''}) %}
{% set textureArray = textureArray|merge({'background-right': ''}) %}
{% set textureArray = textureArray|merge({'image-help-1': ''}) %}
{% set textureArray = textureArray|merge({'button-play': ''}) %}
{% set textureArray = textureArray|merge({'button-home': ''}) %}
{% set textureArray = textureArray|merge({'button-help': ''}) %}
{% set textureArray = textureArray|merge({'button-exit-1': ''}) %}
{% set textureArray = textureArray|merge({'gallery-logo': ''}) %}
{% set textureArray = textureArray|merge({'cart-texture-1': ''}) %}
{% set textureArray = textureArray|merge({'info-texture-1': ''}) %}
{% set textureArray = textureArray|merge({'bg-texture-1': ''}) %}
{% set textureArray = textureArray|merge({'bg-texture-2': ''}) %}
{% set textureArray = textureArray|merge({'bg-texture-3': ''}) %}
{% set textureArray = textureArray|merge({'bg-texture-4': ''}) %}
{% if textureItemCollection is defined %}
{% for textureItem in textureItemCollection %}
{% if 'http' in textureItem.galleryItemFile %}
{% set texturePath = textureItem.galleryItemFile %}
{% else %}
{% set texturePath = userDirs['web'] ~ '/images/' ~ textureItem.galleryItemFile %}
{% endif %}
{% if textureItem.galleryItemName is defined and textureItem.galleryItemName != '' %}
{% set textureKey = textureItem.galleryItemName %}
{# {% set textureArray[textureKey] = texturePath %}#}
{% set textureArray = textureArray|merge({(textureKey): (texturePath)}) %}
{% endif %}
{% endfor %}
{% endif %}
{% if textureArray['wall-texture-2'] == '' %}
{% set textureArray = textureArray|merge({'wall-texture-2': (textureArray['wall-texture-1'])}) %}
{% endif %}
{% set tourArray = [] %}
<!-- X3D -->
<div style="width: 100vw; height: 90vh; display:block; right:0; left:0; box-sizing: border-box; position: absolute; left: 0; right: 0; background-color: Black;" id="x3d" class="x3d_container">
<!-- menu -->
<div style="position: absolute; left: 0px; width: 100%; height: 50px; display:block; border-right: 1px solid #EA5B0C; background-color: #222; opacity: 0.8; text-align:center; font-family: helvetica, sans-serif; font-weight: bold; font-size: 10px; color: #EA5B0C; padding-top:5px; z-index: 3; vertical-align: top;" id="x3d_menu">
<div style="margin-right:2px; display:inline-block" id="x3d_menu_viewpoint_home">
<button id="button_viewpoint_home" onclick="changeViewpoint('x3d_viewpoint_home')" style="font-family: helvetica, sans-serif; font-weight: normal; font-size: 10px; background-color: black; border: 1px solid #333; color: white;padding:2px; background-image: url( '/images/x3dmenu_home.png' ); background-size: 40px 40px; height: 42px; width: 42px;" title="Home Viewpoint"></button>
</div>
<div style="margin-right:2px; display:inline-block" id="x3d_menu_viewpoint_menu">
<button id="button_viewpoint_menu" onclick="changeViewpoint('x3d_viewpoint_menu')" style="font-family: helvetica, sans-serif; font-weight: normal; font-size: 10px; background-color: black; border: 1px solid #333; color: white;padding:2px; background-image: url( '/images/x3dmenu_menu.png' ); background-size: 40px 40px; height: 42px; width: 42px;" title="Menu Viewpoint"></button>
</div>
<div style="margin-right:7px; display:inline-block" id="x3d_menu_tour">
<button id="gallery_button_viewpoint" onclick="changeViewpoint('x3d_viewpoint_tour')" style="font-family: helvetica, sans-serif; font-weight: normal; font-size: 10px; background-color: black; border: 1px solid #333; color: white;padding:2px; background-image: url( '/images/x3dmenu_walk.png' ); background-size: 31px 31px; height: 33px; width: 33px;" title="Tour"></button>
</div>
<!--
<div style="margin-top:7px" id="x3d_menu_viewpoint_1">
<button id="button_viewpoint_1" onclick="changeViewpoint('x3d_viewpoint_1')" style="font-family: helvetica, sans-serif; font-weight: normal; font-size: 10px; background-color: black; border: 1px solid #333; color: white;padding:2px; background-image: url( '/images/x3dmenu_eye.png' ); background-size: 31px 31px; height: 33px; width: 33px;" title="viewpoint 1"></button>
</div>
<div style="margin-top:7px" id="x3d_menu_viewpoint_2">
<button id="button_viewpoint_2" onclick="changeViewpoint('x3d_viewpoint_2')" style="font-family: helvetica, sans-serif; font-weight: normal; font-size: 10px; background-color: black; border: 1px solid #333; color: white;padding:2px; background-image: url( '/images/x3dmenu_eye.png' ); background-size: 31px 31px; height: 33px; width: 33px;" title="viewpoint 2"></button>
</div>
<div style="margin-top:7px" id="x3d_menu_viewpoint_3">
<button id="button_viewpoint_3" onclick="changeViewpoint('x3d_viewpoint_3')" style="font-family: helvetica, sans-serif; font-weight: normal; font-size: 10px; background-color: black; border: 1px solid #333; color: white;padding:2px; background-image: url( '/images/x3dmenu_eye.png' ); background-size: 31px 31px; height: 33px; width: 33px;" title="viewpoint 3"></button>
</div>
-->
{% for category in childNodes %}
{% set catId = category.categoryId %}
{% set viewpoint = 'category_viewpoint_' ~ catId %}
<span style="margin-right:2px; display:inline-block" id="root_category_menu_viewpoint_{{ catId }}">
<button id="category_button_viewpoint_{{ catId }}" onclick="changeViewpoint('root_category_viewpoint_{{ catId }}')" style="font-family: helvetica, sans-serif; font-weight: strong; font-size: 10px; background-color: black; padding-top:2px; padding-bottom:2px; border: 1px solid #333; color: white; height: 33px;" title="{{ category.categoryName }}">{{ category.categoryName }}</button>
</span>
{% endfor %}
<span style="margin-right:7px; display:inline-block" id="x3d_menu_defaultscreen">
<button id="button_defaultscreen" onclick="sceneResize('normal')" style="font-family: helvetica, sans-serif; font-weight: normal; font-size: 10px; background-color: black; border: 1px solid #333; color: white;padding:2px; background-image: url( '/images/x3dmenu_defaultscreen.png' ); background-size: 31px 31px; height: 33px; width: 33px;" title="default screen"></button>
</span>
<span style="margin-right:2px; display:inline-block" id="x3d_menu_fullscreen">
<button id="button_fullscreen" style="font-family: helvetica, sans-serif; font-weight: normal; font-size: 10px; background-color: black; border: 1px solid #333; color: white;padding:2px; background-image: url( '/images/x3dmenu_fullscreen.png' ); background-size: 31px 31px; height: 33px; width: 33px;" title="full screen"></button>
</span>
</div>
<!-- product detail info -->
<div style="position: absolute; right: 0px; width: 0px; height: 100%; display:block; border-left: 1px solid #EFEFEF; background-color: #222; opacity: 0.8; text-align:left; font-family: helvetica, sans-serif; font-weight: bold; font-size: 10px; color: #FFF; padding-top:5px; padding-left:8px; padding-right:15px; z-index: 5;" id="x3d_product_detail">
<div style="margin-top:1px" id="x3d_product_detail_close" style="text-align: left; float: left;">
<button id="button_product_detail_close" style="font-family: helvetica, sans-serif; font-weight: normal; font-size: 10px; background-color: black; border: 1px solid #333; color: white;padding:2px; background-image: url( '{{ textureArray['button-exit-1'] }}' ); background-size: 31px 31px; height: 33px; width: 33px;" title="default screen"></button>
</div>
<div id="x3d_product_name" style="font-weight: bold; font-size: 22px; margin-top:8px"></div>
<div>
<span style="font-weight: normal; font-size: 11px;">{{ 'product.key'|trans }}: </span>
<span id="x3d_product_key" style="font-weight: bold; font-size: 16px;"></span>
</div>
<div>
<span style="font-weight: normal; font-size: 11px;">{{ 'eshop.price'|trans }}: </span>
<span id="x3d_product_price" style="font-weight: bold; font-size: 16px;"></span>
{{ app.session.get('eshopCurrency').currencyKey }}
</div>
<div style="margin-top:8px">
<span id="x3d_product_description" style="font-weight: normal; font-size: 16px"></span>
</div>
<div style="margin-top:8px">
<span>
<img id="x3d_product_image" src="" alt="Product Image" style="height: 25vw"></img>
</span>
</div>
<div style="margin-top:8px" id="x3d_button_addcart" style="text-align: left; float: left;">
<input hidden id="x3d_product_id" name="x3d_product_id" value="">
<input hidden id="x3d_eshop_id" name="x3d_eshop_id" value="{{ eshop.eshopId }}">
<button id="button_addcart" style="font-family: helvetica, sans-serif; font-weight: normal; font-size: 10px; background-color: DarkGreen; border: 1px solid #333; color: white;padding:2px; height: 33px; width: 233px" title="Add to basket">Add to basket</button>
</div>
<div style="margin-top:6px" id="x3d_product_detail_close2" style="text-align: left; float: left;">
<button id="button_product_detail_close2" style="font-family: helvetica, sans-serif; font-weight: normal; font-size: 10px; background-color: black; border: 1px solid #333; color: white;padding:2px; background-image: url( '{{ textureArray['button-exit-1'] }}' ); background-size: 31px 31px; height: 33px; width: 33px;" title="default screen"></button>
</div>
</div>
<!-- result info message -->
<div style="position: absolute; top: 0px; width: 100%; height: 0px; display:block; border-bottom: 1px solid #EFEFEF; background-color: #000; opacity: 0.8; text-align:center; font-family: helvetica, sans-serif; font-weight: bold; font-size: 10px; color: #FFF; padding-top:0px; z-index: 5;" id="x3d_info_message">
<table border='0' id='infoMessageTable' class='infoMessageTable' align="center" cellpadding='0' cellspacing='0' style="display: none">
<tr>
<td valign='top'>
<x3d width='50px' height='35px' profile='Immersive' version='3.3' xmlns:xsd='http://www.w3.org/2001/XMLSchema-instance' xsd:noNamespaceSchemaLocation='http://www.web3d.org/specifications/x3d-3.3.xsd'>
<scene>
<Transform DEF = 'CubeGallery'
translation = '0 0 0'
scale = '10 10 10'>
<Inline nameSpaceName="LogoCubex" mapDEFToID="true" url="/Logo_Cubes_Noclick.x3d" />
</Transform>
</scene>
</x3d>
</td>
<td valign='top'>
<div id="x3d_info_message_text" style="font-weight: normal; font-size: 16px; margin-top: 7px; margin-left:5px"></div>
</td>
<td valign='top'>
<div style="margin-top:1px; text-align: left; float: left;" id="x3d_info_message_close">
<button id="button_info_message_close" style="font-family: helvetica, sans-serif; font-weight: normal; font-size: 10px; background-color: black; border: 1px solid #333; color: white;margin-left:12px; background-image: url( '{{ textureArray['button-exit-1'] }}' ); background-size: 25px 25px; height: 27px; width: 27px; margin-top: 2px; display: none" title="close message panel"></button>
</div>
</td>
</tr>
</table>
</div>
<!-- quick basket -->
<div style="position: absolute; top: 0px; right: 0px; width: 50%; height: 0px; display:block; background-color: #000; opacity: 0.8; text-align:center; font-family: helvetica, sans-serif; font-weight: bold; font-size: 10px; color: #FFF; padding-top:0px; z-index: 1; margin-left: auto; margin-right: auto;text-align: left; float: left;" id="x3d_quick_basket">
<table border='0' id='quickBasketTable' class='quickBasketTable' align="center" cellpadding='0' cellspacing='0' style="display: none">
<tr>
<td valign='top'>
<div id="x3d_quick_basket_title" style="font-weight: normal; font-size: 16px; margin-top: 7px; margin-left:5px"><h4>Quick Basket</h4></div>
</td>
</tr>
<tr>
<td valign='top'>
<div id="x3d_quick_basket_text" style="font-weight: normal; font-size: 16px; text-align: left; margin-top: 7px; margin-left:5px"></div>
<div style="margin-top:1px; display: inline-block; text-align: left; float: left;" id="x3d_quick_basket_open">
<button id="button_quick_basket_open" style="font-family: helvetica, sans-serif; font-weight: bold; font-size: 12px; background-color: Gray; border: 1px solid #111; color: white; margin-left:12px; background-size: 25px 25px; height: 27px; width: 150px; margin-top: 2px" title="Go to Basket" value="Go to Basket" onclick="window.location.href='/eshop/{{ eshop.eshopId }}/basket';">{{ 'eshop.go_to_basket'|trans }}</button>
</div>
<div style="margin-top:1px;text-align: left; display: inline-block; float: left; " id="x3d_quick_basket_close">
<button id="button_quick_basket_close" style="font-family: helvetica, sans-serif; font-weight: bold; font-size: 12px; background-color: Gray; border: 1px solid #111; color: white; margin-left:12px; background-size: 25px 25px; height: 27px; width: 27px; margin-top: 2px" title="close quick basket panel" value="x">x</button>
</div>
</td>
</tr>
<tr>
<td valign='top'>
</td>
</tr>
</table>
</div>
<x3d width='100%' height="90vh" id="x3d_section" style="height: 90vh; border-bottom: 2px solid #EA5B0C;background-color: #222;">
<scene id="x3d_scene">
<NavigationInfo headlight="true" visibilityLimit="0.0" type='"FLY", "WALK", "ANY"' avatarSize="0.25, 2.4, 0.75" speed='2.0'></NavigationInfo>
<!-- <Background backUrl='[]' bind='false' bottomUrl='[]' crossOrigin='""' description='""' frontUrl='"http://easycommerc.cz/users/Kantona/images/Bg-007-01.jpeg"' groundAngle='[]' groundColor='(0,0,0)' isActive='false' leftUrl='http://easycommerc.cz/users/Kantona/images/Bg-007-02.jpeg' metadata='X3DMetadataObject' rightUrl='"http://easycommerc.cz/users/Kantona/images/Bg-007-03.jpeg"' scaling='false' skyAngle='[]' skyColor='(0,0,0)' topUrl='"http://easycommerc.cz/users/Kantona/images/Bg-007-04.jpeg"' transparency='0/1' ></Background> -->
{% if isStartGuide is not defined %}
{% set isStartGuide = false %}
{% endif %}
{% if isStartGuide is defined and isStartGuide %}
<Transform DEF='TourAvatarWrapper' id='TourAvatarWrapper'>
<viewpoint orientation='0 1 0 -0.2' position='0 3 0' DEF='x3d_viewpoint_tour' id='x3d_viewpoint_tour'></viewpoint>
</Transform>
<viewpoint orientation='0 1 0 1' position='-10 3 0' id='x3d_viewpoint_2'></viewpoint>
<Transform DEF='AvatarWrapper' id='AvatarWrapper'>
<viewpoint orientation='0 1 0 -0' position='0 3 9' id='x3d_viewpoint_1'></viewpoint>
</Transform>
{% else %}
<Transform DEF='AvatarWrapper' id='AvatarWrapper'>
<viewpoint orientation='0 1 0 -0' position='0 3 9' id='x3d_viewpoint_1'></viewpoint>
</Transform>
<viewpoint orientation='0 1 0 1' position='-10 3 0' id='x3d_viewpoint_2'></viewpoint>
<Transform DEF='TourAvatarWrapper' id='TourAvatarWrapper'>
<viewpoint orientation='0 1 0 -0.2' position='0 3 0' DEF='x3d_viewpoint_tour' id='x3d_viewpoint_tour'></viewpoint>
</Transform>
{% endif %}
<viewpoint orientation='0 1 0 0.5' position='-10 3 -13' id='x3d_viewpoint_3'></viewpoint>
<viewpoint orientation='0 1 0 -0' position='0 3 8' id='x3d_viewpoint_home'></viewpoint>
<viewpoint orientation='0 1 0 -0' position='0 3 15' id='x3d_viewpoint_menu'></viewpoint>
<DirectionalLight ambientIntensity='0.835991' direction='0.584419 0.286636 0.75914'></DirectionalLight>
<Background groundColor='0.2 0.2 0 0.3 0.3 0 0.5 0.5 0.3 0.1 0.3 0.4 0 0.2 0.4' skyAngle='0.04 0.05 0.1 1.309 1.570' skyColor='0.8 0.8 0.2 0.8 0.8 0.2 0.1 0.1 0.6 0.1 0.1 0.6 0.1 0.25 0.8 0.6 0.6 0.9'></Background>
<!-- <PositionInterpolator DEF='UserTranslation1' key='0 0.3 0.5 0.8 1.0' keyValue='-12 0 0 -2 0 20 12 0 -20 12 0 0 -12 0 0'/></PositionInterpolator> -->
<TimeSensor DEF='CLOCK' cycleInterval='33' loop='true' enabled='true'></TimeSensor>
<Transform DEF='CategoriesBox' translation='0 0 0' rotation='0 1 0 -0.13117953405799'>
{# Root Categories#}
{% set rootCategoryX = -7 %}
{% set bDistance = 20 %}
{% set catCount = 0 %}
{% set countRootCategories = childNodes|length %}
{% set gamma = -(180 / countRootCategories) %}
{% set beta = 90 %}
{% set alfa = (180 - beta) - gamma %}
{% set shopWidth = (countRootCategories + 2) * 10 %}
{% set yRotation = null %}
{% set xPos = 20 %}
{% set zPos = -30 %}
{% for category in childNodes %}
{% set catCount = catCount + 1 %}
{% set curGamma = gamma * catCount %}
{% set curAlfa = (180 - beta) - curGamma %}
{# {% set zPos = (bDistance * sin(deg2rad(curGamma)))/sin(deg2rad(90)) %}#}
{# $xPos = ($bDistance * sin(deg2rad($curAlfa)))/sin(deg2rad(90));#}
{% set xPos = (xPos - 10) %}
{# {% set zPos = (zPos + 20) %}#}
{% set curGamma = gamma * catCount %}
{% if yRotation == null %}
{% set yRotation = 1.5 %}
{% else %}
{% set yRotation = yRotation - 3.3/countRootCategories %}
{% endif %}
{% set yRotation = 0.0 %}
{% set catId = category.categoryId %}
{% set categoryProductCount = categoryProducts[catId]|length %}
{% if category.categoryName|length > 30 %}
{% set labelFontSize = 0.3 %}
{% set smallLabelFontSize = 0.12 %}
{% elseif category.categoryName|length > 15 %}
{% set labelFontSize = 0.5 %}
{% set smallLabelFontSize = 0.2 %}
{% else %}
{% set labelFontSize = 0.7 %}
{% set smallLabelFontSize = 0.3 %}
{% endif %}
{% if 'http' in category.image1 %}
{% set imgPath = category.image1 %}
{% set path = imgPath %}
{% set imageThumbPath = 'users/' ~ user.userName ~ '/images/thumb_' ~ path %}
{% set imgSysPath = category.image1 %}
{% set isURL = true %}
{% else %}
{% set imgPath = userDirs['web'] ~ '/images/' ~ category.image1 %}
{% set imgPath = userDirs['images'] ~ category.image1 %}
{% endif %}
{# we prepare the category box size #}
{% set thumbWidth = 150 %}
{% set thumbHeight = 150 %}
{% set maxThumbHeight = 150 %}
{% set width = 150 %}
{% set tourViewPoint = [] %}
{% set tourViewPoint = tourViewPoint|merge({'x': (-(xPos + 2))}) %}
{% set tourViewPoint = tourViewPoint|merge({'y': 0}) %}
{% set tourViewPoint = tourViewPoint|merge({'z': (zPos + 15.55)}) %}
{% set tourArray = tourArray|merge([tourViewPoint]) %}
<Transform translation='{{ -(xPos + 2) }} 5.7 {{ zPos + 0.55 }}' rotation='0 1 0 {{ yRotation }}'>
<viewpoint position='0 -2.2 8.5' id='root_category_viewpoint_{{ catId }}'></viewpoint>
<!-- category label background -->
<Transform translation='0 0.1 0.0'>
<shape onclick="changeViewpoint('root_category_viewpoint_{{ catId }}')">
<appearance>
<material diffuseColor='0 0 0' specularColor='0 0 0' transparency='0.4'></material>
</appearance>
<box size='6.5,1.3,0.01'></box>
</shape>
</Transform>
<!-- category label -->
<Transform translation='0.0 -0.1 0.05'>
<shape onclick="changeViewpoint('root_category_viewpoint_{{ catId }}')">
<appearance>
<material ambientIntensity='0.7' diffuseColor='1 1 1' specularColor='1 1 1'></material>
</appearance>
<text string='{{ category.categoryName }}' solid='false'>
<fontstyle family="TYPEWRITER" style="BOLDITALIC" size="{{ labelFontSize }}"></fontstyle>
</text>
</shape>
</Transform>
<!-- category arch -->
<Transform translation='0 1 -0.5' rotation='1 0 0 1.60'>
<Shape>
<Appearance>
<Material ambientIntensity='0.1'></Material>
<ImageTexture url='{{ textureArray['wall-texture-2'] }}'></ImageTexture>
<TextureTransform scale='1 2.5'/>
</Appearance>
<Cylinder height='0.4' radius='2.05'></Cylinder>
</Shape>
</Transform>
<!-- category image -->
<Transform translation='0 1 -0.5' rotation='1 0 0 1.60'>
<Shape>
<Appearance>
<Material ambientIntensity='0.1' diffuseColor='1 1 1' specularColor='1 1 1' transparency='0.4'></Material>
</Appearance>
<Cylinder height='0.5' radius='1.8'></Cylinder>
</Shape>
</Transform>
<Transform translation='0 1.7 -0.3'>
<shape onclick="changeViewpoint('root_category_viewpoint_{{ catId }}')">
<appearance>
<material diffuseColor='0 0 0' specularColor='0 0 0'></material>
<ImageTexture url='{{ imgPath }}'></ImageTexture>
<TextureTransform scale='1 1'/>
</appearance>
<Box size='{{ thumbWidth/100 }} {{ thumbHeight/100 }} {{ thumbWidth/100 }}'/>
</shape>
</Transform>
<!-- category - left column -->
<Transform translation='-3.5 -4.15 0'>
<shape>
<appearance>
<Material ambientIntensity='0.1'></Material>
<ImageTexture url='{{ textureArray['wall-texture-2'] }}'></ImageTexture>
<TextureTransform scale='0.5 1'/>
</appearance>
<box size='0.7, 10,0.7'></box>
</shape>
</Transform>
<!-- category - right column -->
<Transform translation='3.5 -4.15 0'>
<shape>
<appearance>
<Material ambientIntensity='0.1'></Material>
<ImageTexture url='{{ textureArray['wall-texture-2'] }}'></ImageTexture>
<TextureTransform scale='0.5 0.5'/>
</appearance>
<box size='0.7, 10,0.7'></box>
</shape>
</Transform>
<Transform translation='2.1 -5.55 0'>
<shape>
<appearance>
<material diffuseColor='0 0 0' specularColor='0 0 0' transparency='0.4'></material>
</appearance>
<box size='2.1, 10, 0.01'></box>
</shape>
</Transform>
<!-- small label title -->
<Transform translation='2.2 -3.1 0.55'>
<shape onclick="changeViewpoint('root_category_viewpoint_{{ catId }}')">
<appearance>
<material diffuseColor='1 1 1' specularColor='1 1 1'></material>
</appearance>
<text string='{{ category.categoryName }}' solid='false'>
<fontstyle family="TYPEWRITER" style="BOLDITALIC" size="{{ smallLabelFontSize }}"></fontstyle>
</text>
</shape>
</Transform>
<!-- small label background -->
<Transform translation='2.5 -2.7 0.5'>
<shape onclick="changeViewpoint('root_category_viewpoint_{{ catId }}')">
<appearance>
<material diffuseColor='0 0 0'></material>
</appearance>
<box size='2.8,0.5,0.01'></box>
</shape>
</Transform>
{# subcategories as list#}
{% set subCategories = category.children %}
{% set subCategoriesCount = subCategories|length %}
{# we count products in subcategories#}
{% set subCatProductCount = 0 %}
{% for subCat in subCategories %}
{% set subCatProductCount = subCatProductCount + categoryProducts[category.categoryId]|length %}
{% endfor %}
{% set positionZ = subCatProductCount * 2 %}
{% set subCatCount = 0 %}
{% set productPositionZ = 3 %}
{% set productPositionY = -2.8 %}
{% for subCat in subCategories %}
{% set subCatId = subCat.categoryId %}
{% set productPositionY = productPositionY - 0.55 %}
<!-- small label title -->
<Transform translation='2.2 {{ productPositionY-0.3 }} 0.55'>
<shape onclick="changeViewpoint('category_viewpoint_{{ subCatId }}')">
<appearance>
<material diffuseColor='1 1 1' specularColor='1 1 1'></material>
</appearance>
<text string='{{ subCat.categoryName }}' solid='false'>
<fontstyle family="TYPEWRITER" style="BOLDITALIC" size="{{ smallLabelFontSize }}"></fontstyle>
</text>
</shape>
</Transform>
<!-- small label background -->
<Transform translation='2.5 {{ productPositionY + 0.1 }} 0.5'>
<shape onclick="changeViewpoint('category_viewpoint_{{ subCatId }}')">
<appearance>
<material diffuseColor='0.2 0.2 0.2'></material>
</appearance>
<box size='2.8,0.5,0.01'></box>
</shape>
</Transform>
{% endfor %}
<!-- special products in front of main categories -->
{# {% set categoryProductLocationZ = 2 * categoryProductCount + 1.8 %}#}
{% set frontCategoryLocationZ = 7 %}
{% set categoryProductLocationZ = 2 * categoryProductCount + frontCategoryLocationZ %}
<Transform translation='-2.3 -4.7 {{ frontCategoryLocationZ }}' rotation='0 1 0 0'>
{% set rootCategoryX = rootCategoryX + 3.3 %}
{# displays products in category #}
{% set productCount = 0 %}
{% set isURL = false %}
{% set categoryId = category.categoryId %}
{% for product in categoryProducts[categoryId] %}
{% set productCount = productCount + 1 %}
{% set productPositionX = productCount * 21 %}
{% set productPositionZ = productCount * 2 %}
{% if 'http' in product.image1 %}
{% set imgPath = product.image1 %}
{% set imgSysPath = product.image1 %}
{% set isURL = true %}
{% else %}
{% set imgPath = userDirs['web'] ~ '/images/' ~ product.image1 %}
{% set imgSysPath = userDirs['images'] ~ '/' ~ product.image1 %}
{% endif %}
{# we prepare the product box size #}
{% set thumbWidth = 147 %}
{% set thumbHeight = 147 %}
{% set maxThumbHeight = 147 %}
{% set width = 147 %}
{# we load VAT #}
{% set productVAT = null %}
{% if product is defined and product.productVAT is defined and product.productVAT > 0 %}
{# VAT is derived from productVAT #}
{% set productVAT = product.productVAT %}
{% elseif eshop.preferredVAT is defined and eshop.preferredVAT > 0 %}
{# VAT is derived from eshop VAT #}
{% set productVAT = eshop.preferredVAT %}
{% endif %}
{% if category.categoryName|length > 15 %}
{% set labelFontSize = 0.2 %}
{% elseif category.categoryName|length > 30 %}
{% set labelFontSize = 0.1 %}
{% else %}
{% set labelFontSize = 0.4 %}
{% endif %}
{# we get price(s) to display#}
{% set displayPrice = null %}
{% set displayPriceVAT = null %}
{% set defaultDisplayPrice = null %}
{% set defaultDisplayPriceVAT = null %}
{% for price in categoryProductPrices[categoryId] %}
{% if price.productId == product.productId %}
{# we get price level according to logged contact-customer #}
{% if app.session.get('contact') is defined and app.session.get('contact').priceLevel is defined and price.priceLevelId == app.session.get('contact').priceLevel.priceLevelId %}
{# we get netto or brutto value according to e-shop configuration #}
{% if eshop.displayNettoPrices is defined and eshop.displayNettoPrices == true %}
{% set displayPrice = price.nettoValue|round(eshop.roundPrice, 'ceil') %}
{% else %}
{% set displayPrice = price.bruttoValue|round(eshop.roundPrice, 'ceil') %}
{% endif %}
{% if eshop.displayNettoPrices is defined and eshop.displayNettoPrices == true %}
{% set displayPrice = displayPrice + (displayPrice * (productVAT/100)) %}
{% set displayPriceVATLabel = 'product.price_with_VAT'|trans %}
{% else %}
{% set displayPrice = displayPrice - (displayPrice * (productVAT/100)) %}
{% set displayPriceVATLabel = 'product.price_without_VAT'|trans %}
{% endif %}
{% elseif price.priceLevelId == 1 %}
{# we get default price level #}
{# we get netto or brutto value according to e-shop configuration #}
{% if eshop.displayNettoPrices is defined and eshop.displayNettoPrices == true %}
{% set displayPrice = price.nettoValue|round(eshop.roundPrice, 'ceil') %}
{% else %}
{% set displayPrice = price.bruttoValue|round(eshop.roundPrice, 'ceil') %}
{% endif %}
{% if eshop.displayNettoPrices is defined and eshop.displayNettoPrices == true %}
{% set displayPrice = displayPrice + (displayPrice * (productVAT/100)) %}
{% set displayPriceVATLabel = 'product.price_with_VAT'|trans %}
{% else %}
{% set displayPrice = displayPrice - (displayPrice * (productVAT/100)) %}
{% set displayPriceVATLabel = 'product.price_without_VAT'|trans %}
{% endif %}
{% endif %}
{% endif %}
{% endfor %}
{% set maxLength = 20 %}
{% if product.productName|length > maxLength %}
{% set productName = product.productName|slice(0, maxLength) ~ ".." %}
{% else %}
{% set productName = product.productName %}
{% endif %}
{% if productName|length > 11 %}
{% set productLabelFontSize = 0.15 %}
{% elseif productName|length > 20 %}
{% set productLabelFontSize = 0.07 %}
{% elseif productName|length > 50 %}
{% set productLabelFontSize = 0.05 %}
{% else %}
{% set productLabelFontSize = 0.25 %}
{% endif %}
{% if displayPrice|length > 3 %}
{% set priceLabelFontSize = 0.15 %}
{% elseif displayPrice|length > 10 %}
{% set priceLabelFontSize = 0.10 %}
{% else %}
{% set priceLabelFontSize = 0.25 %}
{% endif %}
<!-- product viewpoint -->
<viewpoint orientation='0 1 0 1.6' position='3.5 1.2 -{{ productPositionZ }}' id='product_viewpoint_{{ product.productId }}'></viewpoint>
<Transform translation='0 1.25 -{{ productPositionZ }}'>
<shape onclick="changeViewpoint('product_viewpoint_{{ product.productId }}')">
<Appearance>
<Material diffuseColor='0 0 0' emissiveColor='0 0 0'></Material>
<ImageTexture url='{{ imgPath }}'></ImageTexture>
</Appearance>
<Box size='{{ (thumbWidth/100)|number_format }} {{ (thumbHeight/100)|number_format }} {{ (thumbWidth/100)|number_format }}'/>
</Shape>
</Transform>
<!-- product name -->
<Transform translation='0.85 -0.1 -{{ productPositionZ + 0.07 }}' rotation='0 1 0 1.545'>
<shape onclick="getProductDetail('{{ eshop.eshopId }}','{{ product.productId }}')">
<appearance>
<material specularColor='0 1 0'></material>
</appearance>
<text string='{{ productName }} {{ productLabelFontSize }}' solid='false'>
<fontstyle family="TYPEWRITER" style="BOLDITALIC" size="{{ productLabelFontSize }}"></fontstyle>
</text>
</shape>
</Transform>
<!-- more info button -->
<Transform translation='0 2.25 -{{ (productPositionZ - 0.55) }}'>
<Shape onclick="getProductDetail('{{ eshop.eshopId }}','{{ product.productId }}')">
<Appearance>
<Material diffuseColor='0 0 0' emissiveColor='0 0 0'></Material>
<ImageTexture url='{{ textureArray['info-texture-1'] }}'></ImageTexture>
<TextureTransform scale='1 1'></TextureTransform>
</Appearance>
<Box size='0.5 0.5 0.5'/>
</Shape>
</Transform>
<!-- price label - right -->
<Transform translation='0.33 1.85 -{{ (productPositionZ - 0.0) }}' rotation='0 1 0 1.6'>
<shape>
<appearance>
<material diffuseColor='0 0 0' specularColor='0 0 0'></material>
</appearance>
<text string='{{ displayPrice }}' solid='false'>
<fontstyle family="TYPEWRITER" style="BOLDITALIC" size="{{ priceLabelFontSize }}"></fontstyle>
</text>
</shape>
</Transform>
<Transform translation='0.33 1.7 -{{ (productPositionZ - 0.05) }}' rotation='0 1 0 1.6'>
<shape>
<appearance>
<material diffuseColor='0 0 0' specularColor='0 0 0'></material>
</appearance>
<text string='{{ app.session.get('eshopCurrency').currencyKey }}' solid='false'>
<fontstyle family="TYPEWRITER" style="BOLDITALIC" size="0.15"></fontstyle>
</text>
</shape>
</Transform>
<!-- price label - left -->
<Transform translation='-0.01 1.85 -{{ (productPositionZ + 0.25) }}' rotation='0 1 0 -1.6'>
<shape>
<appearance>
<material diffuseColor='0 0 0' specularColor='0 0 0'></material>
</appearance>
<text string='{{ displayPrice }}' solid='false'>
<fontstyle family="TYPEWRITER" style="BOLDITALIC" size="{{ priceLabelFontSize }}"></fontstyle>
</text>
</shape>
</Transform>
<Transform translation='-0.01 1.7 -{{ (productPositionZ + 0.15) }}' rotation='0 1 0 -1.6'>
<shape>
<appearance>
<material diffuseColor='0 0 0' specularColor='0 0 0'></material>
</appearance>
<text string='{{ app.session.get('eshopCurrency').currencyKey }}' solid='false'>
<fontstyle family="TYPEWRITER" style="BOLDITALIC" size="0.15"></fontstyle>
</text>
</shape>
</Transform>
<Transform translation='0 2.25 -{{ productPositionZ }}'>
<Shape>
<Appearance>
<Material diffuseColor='1 1 1' emissiveColor='1 1 1'></Material>
</Appearance>
<Box size='0.5 0.5 0.5'/>
</Shape>
</Transform>
<!-- add to basket button -->
<Transform translation='0 2.25 -{{ (productPositionZ + 0.55) }}'>
<Shape onclick="addBasket('{{ eshop.eshopId }}','{{ product.productId }}',1,{{ displayPrice }})">
<Appearance>
<Material diffuseColor='0 1 0'></Material>
<ImageTexture url='{{ textureArray['cart-texture-1'] }}'></ImageTexture>
<TextureTransform scale='1 1'></TextureTransform>
</Appearance>
<Box size='0.5 0.5 0.5'/>
</Shape>
</Transform>
<!-- product shelf -->
<Transform translation='0 0.33 -{{ productPositionZ }}'>
<Shape onclick="getProductDetail('{{ eshop.eshopId }}','{{ product.productId }}')">
<Appearance>
<Material diffuseColor='0 0 0' emissiveColor='0 0 0'></Material>
</Appearance>
<Box size='1.6 0.3 1.6'/>
</Shape>
</Transform>
<Transform translation='0 -0.25 -{{ productPositionZ }}'>
<Shape>
<Appearance>
<Material diffuseColor='0.1 0.1 0.1' emissiveColor='0.1 0.1 0.1' transparency='0.4'></Material>
</Appearance>
<Box size='1.3 {{ (thumbHeight/100) }} 1.3'/>
</Shape>
</Transform>
{% endfor %}
</Transform>
{# subcategories as shelves #}
{% set subCategories = category.children %}
{% set subCategoriesCount = subCategories|length %}
{# we count products in subcategories #}
{% set subCatProductCount = 0 %}
{% set subCatProductCount = 0 %}
{% for subCat in subCategories %}
{% set subCatId = subCat.categoryId %}
{% set subCatProductCount = subCatProductCount + categoryProducts[subCatId]|length %}
{% set positionZ2 = (subCatProductCount * 1) %}
{% set positionZ = (2 * subCatProductCount + 1.8) %}
{% endfor %}
<Transform translation='-2.3 -4.2 0' rotation='0 1 0 0'>
{% set subCatCount = 0 %}
{% set preProductPositionZ = productPositionZ %}
{% set productPositionZ = categoryProductLocationZ - (2 * frontCategoryLocationZ) %}
{% for subCat in subCategories %}
{% set subCatCount = subCatCount + 1 %}
{% set subCatId = subCat.categoryId %}
{% set subCatPositionX = ((subCatCount * 5)-3) %}
{% set subCatPositionZ = -19 %}
{% if subCat.categoryName|length > 13 %}
{% set labelFontSize = 0.4 %}
{% set bgLength = 0.275 %}
{% elseif subCat.categoryName|length > 22 %}
{% set labelFontSize = 0.3 %}
{% set bgLength = 0.2 %}
{% else %}
{% set labelFontSize = 0.6 %}
{% set bgLength = 0.375 %}
{% endif %}
{% set subCatBgLength = (subCat.categoryName|length * bgLength) %}
{% if subCatYPosition is defined %}
{% set subCatYPosition = subCatYPosition + 1 %}
{% else %}
{% set subCatYPosition = 4 %}
{% endif %}
<viewpoint orientation='0 1 0 1.6' position='7 1.7 -{{ (productPositionZ + 1.3) }}' id='category_viewpoint_{{ subCatId }}'></viewpoint>
<!-- subcategory label background -->
<Transform translation='0 {{ (subCatYPosition + 0.2) }} -{{ (productPositionZ + 3) }}' rotation='0 1 0 1.54'>
<shape onclick="changeViewpoint('category_viewpoint_{{ subCatId }}')">
<appearance>
<material diffuseColor='0.2 0.2 0.2'></material>
</appearance>
<box size='{{ subCatBgLength }},0.7,0.01'></box>
</shape>
</Transform>
<!-- subcategory label -->
<Transform translation='0.1 {{ (subCatYPosition - 0.05) }} -{{ (productPositionZ + 1) }}' rotation='0 1 0 1.54'>
<shape onclick="changeViewpoint('category_viewpoint_{{ subCatId }}')">
<appearance>
<material diffuseColor='1 1 1' specularColor='1 1 1'></material>
</appearance>
<text string='{{ subCat.categoryName }}::QQW2::{{ preProductPositionZ }}:{{ productPositionZ }}' solid='false'>
<fontstyle family="TYPEWRITER" style="BOLDITALIC" size="{{ labelFontSize }}"></fontstyle>
</text>
</shape>
</Transform>
{% set productCount = 0 %}
{% for product in categoryProducts[subCat.categoryId] %}
{% set productCount = productCount + 1 %}
{% set productPositionX = (productCount * 21) %}
{% set productRowCount = 2 %}
{% if productCount % productRowCount == 0 %}
{% set productPositionY = -1 %}
{% else %}
{% set productPositionY = 1.2 %}
{% set productPositionZ = productPositionZ + 2 %}
{% endif %}
{% set isURL = false %}
{% if 'http' in product.image1 %}
{% set imgPath = product.image1 %}
{% set imgSysPath = product.image1 %}
{% set isURL = true %}
{% else %}
{% set imgPath = userDirs['web'] ~ '/images/' ~ product.image1 %}
{% set imgSysPath = userDirs['images'] ~ '/' ~ product.image1 %}
{% endif %}
{# we prepare the product box size#}
{# @to_continue #}
{% set thumbWidth = 120 %}
{% set maxThumbHeight = 120 %}
{# we load VAT #}
{% set productVAT = null %}
{% if product is defined and product.productVAT is defined and product.productVAT > 0 %}
{# VAT is derived from productVAT #}
{% set productVAT = product.productVAT %}
{% elseif eshop.preferredVAT is defined and eshop.preferredVAT > 0 %}
{# VAT is derived from eshop VAT #}
{% set productVAT = eshop.preferredVAT %}
{% endif %}
{# we get price(s) to display #}
{% set displayPrice = null %}
{% set displayPriceVAT = null %}
{% set defaultDisplayPrice = null %}
{% set defaultDisplayPriceVAT = null %}
{% for price in categoryProductPrices[subCat.categoryId()] %}
{% if price.productId == product.productId %}
{# we get price level according to logged contact-customer #}
{% if app.session.get('contact') is defined and app.session.get('contact').priceLevel.priceLevelId is defined and app.session.get('contact').priceLevel and price.priceLevelId == app.session.get('contact').priceLevel.priceLevelId %}
{# we get netto or brutto value according to e-shop configuration #}
{% if eshop.displayNettoPrices is defined and eshop.displayNettoPrices == true %}
{% set displayPrice = price.nettoValue|round(eshop.roundPrice, 'ceil') %}
{% else %}
{% set displayPrice = price.bruttoValue|round(eshop.roundPrice, 'ceil') %}
{% endif %}
{% if eshop.displayNettoPrices is defined and eshop.displayNettoPrices == true %}
{% set displayPrice = displayPrice + (displayPrice * (productVAT/100)) %}
{% set displayPriceVATLabel = 'product.price_with_VAT'|trans %}
{% else %}
{% set displayPrice = displayPrice - (displayPrice * (productVAT/100)) %}
{% set displayPriceVATLabel = 'product.price_without_VAT'|trans %}
{% endif %}
{% elseif price.priceLevelId == 1 %}
{# we get default price level #}
{# we get netto or brutto value according to e-shop configuration #}
{% if eshop.displayNettoPrices is defined and eshop.displayNettoPrices == true %}
{% set displayPrice = price.nettoValue|round(eshop.roundPrice, 'ceil') %}
{% else %}
{% set displayPrice = price.bruttoValue|round(eshop.roundPrice, 'ceil') %}
{% endif %}
{% if eshop.displayNettoPrices is defined and eshop.displayNettoPrices == true %}
{% set displayPrice = displayPrice + (displayPrice * (productVAT/100)) %}
{% set displayPriceVATLabel = 'product.price_with_VAT'|trans %}
{% else %}
{% set displayPrice = displayPrice - (displayPrice * (productVAT/100)) %}
{% set displayPriceVATLabel = 'product.price_without_VAT'|trans %}
{% endif %}
{% endif %}
{% endif %}
{% endfor %}
{% set displayPackPrice = null %}
{% set displayPackPriceVAT = null %}
{% set defaultDisplayPackPrice = null %}
{% set defaultDisplayPackPriceVAT = null %}
{% if isPackSaleModule %}
{% for price in categoryProductPrices[subCat.categoryId] %}
{% if price.productId == product.productId %}
{% if app.session.get('contact') is defined and app.session.get('contact').priceLevel is defined and price.priceLevelId == app.session.get('contact').priceLevel.priceLevelId %}
{# we get netto or brutto value according to e-shop configuration #}
{% if eshop.displayNettoPrices is defined and eshop.displayNettoPrices %}
{% set displayPackPrice = price.nettoValue|round(eshop.roundPrice, 'ceil') %}
{% else %}
{% set displayPackPrice = price.bruttoValue|round(eshop.roundPrice, 'ceil') %}
{% endif %}
{% if eshop.displayNettoPrices is defined and eshop.displayNettoPrices %}
{% set displayPackPriceVAT = displayPrice + (displayPrice * (productVAT/100)) %}
{% set displayPriceVATLabel = 'product.price_with_VAT'|trans %}
{% else %}
{% set displayPackPriceVAT = displayPrice - (displayPrice * (productVAT/100)) %}
{% set displayPriceVATLabel = 'product.price_without_VAT'|trans %}
{% endif %}
{% elseif price.priceLevelId == 1 %}
{# we get default price level#}
{% if eshop.displayNettoPrices is defined and eshop.displayNettoPrices %}
{% set displayPackPrice = price.nettoValue|round(eshop.roundPrice, 'ceil') %}
{% else %}
{% set displayPackPrice = price.bruttoValue|round(eshop.roundPrice, 'ceil') %}
{% endif %}
{% if eshop.displayNettoPrices is defined and eshop.displayNettoPrices %}
{% set displayPackPriceVAT = displayPrice + (displayPrice * (productVAT/100)) %}
{% set displayPriceVATLabel = 'product.price_with_VAT'|trans %}
{% else %}
{% set displayPackPriceVAT = displayPrice - (displayPrice * (productVAT/100)) %}
{% set displayPriceVATLabel = 'product.price_without_VAT'|trans %}
{% endif %}
{% endif %}
{% endif %}
{% endfor %}
{% endif %}
{% set maxLength = 20 %}
{% if product.productName|length > maxLength %}
{% set productName = product.productName|slice(0, maxLength) ~ ".." %}
{% else %}
{% set productName = product.productName %}
{% endif %}
{% if productName|length > 11 %}
{% set productLabelFontSize = 0.15 %}
{% elseif productName|length > 20 %}
{% set productLabelFontSize = 0.07 %}
{% elseif productName|length > 50 %}
{% set productLabelFontSize = 0.05 %}
{% else %}
{% set productLabelFontSize = 0.25 %}
{% endif %}
{% if displayPrice|length > 3 %}
{% set priceLabelFontSize = 0.15 %}
{% elseif displayPrice|length > 10 %}
{% set priceLabelFontSize = 0.10 %}
{% else %}
{% set priceLabelFontSize = 0.25 %}
{% endif %}
<!-- product viewpoint -->
<viewpoint orientation='0 1 0 1.6' position='6.0 1.25 -{{ productPositionZ }}' id='product_viewpoint_{{ product.productId }}'></viewpoint>
<!-- product box -->
<Transform translation='0 {{ (productPositionY + 1.25) }} -{{ productPositionZ }}'>
<shape onclick="changeViewpoint('product_viewpoint_{{ product.productId }}')">
<Appearance>
<Material diffuseColor='0 0 0' emissiveColor='0 0 0' transparency='0.5'></Material>
<ImageTexture url='{{ imgPath }}'></ImageTexture>
</Appearance>
<Box size='{{ (thumbWidth/100)|number_format }} {{ (thumbHeight/100)|number_format }} {{ (thumbWidth/100) }}'/>
</Shape>
</Transform>
<!-- product name -->
<Transform translation='0.8 {{ (productPositionY + 0.4) }} -{{ (productPositionZ - 0.78) }}' rotation='0 1 0 1.54'>
<shape onclick="getProductDetail('{{ eshop.eshopId }}','{{ product.productId }}')">
<appearance>
<material specularColor='0 1 0'></material>
</appearance>
<text string='{{ productName }}' solid='false'>
<fontstyle family="TYPEWRITER" style="BOLDITALIC" size="{{ productLabelFontSize }}"></fontstyle>
</text>
</shape>
</Transform>
<!-- more info button -->
<Transform translation='0 {{ (productPositionY + 2.25) }} -{{ (productPositionZ - 0.55) }}'>
<Shape onclick="getProductDetail('{{ eshop.eshopId }}','{{ product.productId }}')">
<Appearance>
<Material diffuseColor='0 0 0' emissiveColor='0 0 0'></Material>
<ImageTexture url='{{ textureArray['info-texture-1'] }}'></ImageTexture>
<TextureTransform scale='1 1'></TextureTransform>
</Appearance>
<Box size='0.5 0.5 0.5'/>
</Shape>
</Transform>
<!-- price label - right -->
<Transform translation='0.3 {{ (productPositionY + 2.25) }} -{{ (productPositionZ - 0.25) }}' rotation='0 1 0 1.6'>
<shape>
<appearance>
<material diffuseColor='0 0 0' specularColor='0 0 0'></material>
</appearance>
<text string='{{ displayPrice }}' solid='false'>
<fontstyle family="TYPEWRITER" style="BOLDITALIC" size="{{ (priceLabelFontSize) }}"></fontstyle>
</text>
</shape>
</Transform>
<Transform translation='0.3 {{ (productPositionY + 2.1) }} -{{ (productPositionZ - 0.15) }}' rotation='0 1 0 1.6'>
<shape>
<appearance>
<material diffuseColor='0 0 0' specularColor='0 0 0'></material>
</appearance>
<text string='{{ app.session.get('eshopCurrency').currencyKey }}' solid='false'>
<fontstyle family="TYPEWRITER" style="BOLDITALIC" size="0.15"></fontstyle>
</text>
</shape>
</Transform>
<!-- price label - left -->
<Transform translation='-0.3 {{ (productPositionY + 2.25) }} -{{ (productPositionZ + 0.25) }}' rotation='0 1 0 -1.6'>
<shape>
<appearance>
<material diffuseColor='0 0 0' specularColor='0 0 0'></material>
</appearance>
<text string='{{ displayPrice }}' solid='false'>
<fontstyle family="TYPEWRITER" style="BOLDITALIC" size="{{ (priceLabelFontSize) }}"></fontstyle>
</text>
</shape>
</Transform>
<Transform translation='-0.3 {{ (productPositionY + 2.1) }} -{{ (productPositionZ + 0.15) }}' rotation='0 1 0 -1.6'>
<shape>
<appearance>
<material diffuseColor='0 0 0' specularColor='0 0 0'></material>
</appearance>
<text string='{{ app.session.get('eshopCurrency').currencyKey }}' solid='false'>
<fontstyle family="TYPEWRITER" style="BOLDITALIC" size="0.15"></fontstyle>
</text>
</shape>
</Transform>
<Transform translation='0 {{ (productPositionY + 2.25) }} -{{ (productPositionZ) }}'>
<Shape>
<Appearance>
<Material diffuseColor='1 1 1' emissiveColor='1 1 1'></Material>
</Appearance>
<Box size='0.5 0.5 0.5'/>
</Shape>
</Transform>
<!-- add to basket button -->
<Transform translation='0 {{ (productPositionY + 2.25) }} -{{ (productPositionZ + 0.55) }}'>
<Shape onclick="addBasket('{{ eshop.eshopId }}','{{ product.productId }}',1, {{ displayPrice }})">
<Appearance>
<Material diffuseColor='0 1 0'></Material>
<ImageTexture url='{{ textureArray['cart-texture-1'] }}'></ImageTexture>
<TextureTransform scale='1 1'></TextureTransform>
</Appearance>
<Box size='0.5 0.5 0.5'/>
</Shape>
</Transform>
{% if productCount is divisible by(productRowCount) %}
<!-- product shelf - bottom -->
<Transform translation='0 -0.57 -{{ productPositionZ }}'>
<Shape onclick="getProductDetail('{{ eshop.eshopId }}','{{ product.productId }}')">
<Appearance>
<Material diffuseColor='0 0 0' emissiveColor='0 0 0'></Material>
</Appearance>
<Box size='1.6 0.2 1.6'/>
</Shape>
</Transform>
<Transform translation='0 -1.2 -{{ productPositionZ }}'>
<Shape>
<Appearance>
<Material diffuseColor='0.1 0.1 0.1' emissiveColor='0.1 0.1 0.1' transparency='0.4'></Material>
</Appearance>
<Box size='1.3 {{ (thumbHeight/100)|number_format }} 1.3'/>
</Shape>
</Transform>
{% else %}
<!-- product shelf - top -->
<Transform translation='0 1.63 -{{ productPositionZ }}'>
<Shape onclick="getProductDetail('{{ eshop.eshopId }}','{{ product.productId }}')">
<Appearance>
<Material diffuseColor='0 0 0' emissiveColor='0 0 0'></Material>
</Appearance>
<Box size='1.6 0.2 1.6'/>
</Shape>
</Transform>
<Transform translation='0 1.63 -{{ productPositionZ }}'>
<Shape>
<Appearance>
<Material diffuseColor='0.1 0.1 0.1' emissiveColor='0.1 0.1 0.1' transparency='0.4'></Material>
</Appearance>
<Box size='1.3 0.21 1.3'/>
</Shape>
</Transform>
{% endif %}
{% endfor %}
{% endfor %}
</Transform>
</Transform>
{% endfor %}
<!-- Free Worlds -->
{% if eshop3D is defined and eshop3D.freeWorlds is defined %}
{% for freeWorld in eshop3D.freeWorlds %}
<Transform translation='{{ freeWorld.preferredPosition }}' rotation='{{ freeWorld.preferredRotation }}' scale='{{ freeWorld.preferredScale }}'>
<Inline url='"{{ freeWorld.xmlFile }}"' >
</Inline>
</Transform>
{% endfor %}
{% endif %}
<!-- Tour -->
{% set tourPeriod = 1/(tourArray|length) %}
{% set tourCurrentKey = 0 %}
{% set tourKey = '' %}
{% set tourKeyValue = '' %}
{% set tourCount = 0 %}
{% set tourFirstKeyValue = '' %}
{% for tourViewpoint in tourArray %}
{# <HR>tourViewpoint: {{ dump(tourViewpoint) }}#}
{% set tourKey = tourKey ~ ' ' ~ tourCurrentKey|trans %}
{% set tourCurrentKey = tourCurrentKey + tourPeriod %}
{% set tourKeyValue = tourKeyValue ~ ' ' ~ tourViewpoint["x"]|trans ~ ' ' ~ tourViewpoint["y"]|trans ~ ' ' ~ tourViewpoint["z"]|trans %}
{% if tourCount == 0 %}
{% set tourFirstKeyValue = tourViewpoint["x"]|trans ~ ' ' ~ tourViewpoint["y"]|trans ~ ' ' ~ tourViewpoint["z"]|trans %}
{% endif %}
{% set tourCount = tourCount + 1 %}
{% endfor %}
{% set tourKey = tourKey ~ ' 1' %}
{% set tourKeyValue = tourKeyValue ~ ' ' ~ tourFirstKeyValue %}
<!-- <PositionInterpolator DEF='UserTranslation1' key='0 0.3 0.5 0.8 1.0' keyValue='-12 0 0 -2 0 20 12 0 -20 12 0 0 -12 0 0'/></PositionInterpolator> -->
<PositionInterpolator DEF='UserTranslation1' key='{{ tourKey }}' keyValue='{{ tourKeyValue }}'></PositionInterpolator>
<!-- floor -->
<Shape>
<Appearance>
<Material ambientIntensity='0.1'/></Material>
<ImageTexture url='{{ textureArray['floor-texture-1'] }}'></ImageTexture>
<TextureTransform scale='15 15'></TextureTransform>
</Appearance>
<IndexedFaceSet solid='false' coordIndex='0 1 2 3 -1'>
<Coordinate point='-{{ (shopWidth/2)|round(2, 'ceil') }} 0 15.3 {{ (shopWidth/2)|round(2, 'ceil') }} 0 15.3 {{ (shopWidth/2)|round(2, 'ceil') }} 0 -70 -{{ (shopWidth/2)|round(2, 'ceil') }} 0 -70'/>
</IndexedFaceSet>
</Shape>
<!-- ceil -->
<!-- <Shape>
<Appearance>
<Material ambientIntensity='0.1' diffuseColor='0 0 0' specularColor='0 0 0' transparency='0.8'></Material>
</Appearance>
<IndexedFaceSet solid='false' coordIndex='0 1 2 3 -1'>
<Coordinate point='<?= -(round($shopWidth/2)) ?> 8.9 15.3 <?= (round($shopWidth/2)) ?> 8.9 15.3 <?= (round($shopWidth/2)) ?> 8.9 -70 <?= -(round($shopWidth/2)) ?> 8.9 -70'/>
</IndexedFaceSet>
</Shape> -->
<!-- back wall - top -->
<Transform translation='0 8.4 15.3'>
<Shape>
<Appearance>
<Material ambientIntensity='0.1'></Material>
<ImageTexture url='{{ textureArray['wall-texture-1'] }}'></ImageTexture>
<TextureTransform scale='15 0.7'></TextureTransform>
</Appearance>
<Box size='{{ shopWidth }} 2.2 0.4'/>
</Shape>
</Transform>
<!-- back floor rim -->
<Transform translation='0.0 0.0 15.3'>
<Shape>
<Appearance>
<Material ambientIntensity='0.1' diffuseColor='0 0 0' specularColor='0 0 0' transparency='0.3'></Material>
</Appearance>
<Box size='{{ (shopWidth + 2) }} 0.4 2.2'/>
</Shape>
</Transform>
<!-- front wall - top -->
<Transform translation='0 8.4 -69.8'>
<Shape>
<Appearance>
<Material ambientIntensity='0.1'></Material>
<ImageTexture url='{{ textureArray['wall-texture-1'] }}'></ImageTexture>
<TextureTransform scale='15 0.7'></TextureTransform>
</Appearance>
<Box size='{{ shopWidth }} 2.2 0.4'/>
</Shape>
</Transform>
<!-- front floor rim -->
<Transform translation='0.0 0.0 -69.8'>
<Shape>
<Appearance>
<Material ambientIntensity='0.1' diffuseColor='0 0 0' specularColor='0 0 0' transparency='0.3'></Material>
</Appearance>
<Box size='{{ (shopWidth + 2) }} 0.4 2.2'/>
</Shape>
</Transform>
<!-- front left column -->
<Transform translation='-{{ (shopWidth/2)|round(2, 'ceil') }} 4.6 -69.8'>
<Shape>
<Appearance>
<Material ambientIntensity='0.1'></Material>
<ImageTexture url='{{ textureArray['wall-texture-1'] }}'></ImageTexture>
<TextureTransform scale='0.5 2'/>
</Appearance>
<Box size='1.5 9.2 1.5'/>
</Shape>
</Transform>
<!-- middle left column -->
<Transform translation='-{{ (shopWidth/2)|round(2, 'ceil') }} 4.6 -25.8'>
<Shape>
<Appearance>
<Material ambientIntensity='0.1'></Material>
<ImageTexture url='{{ textureArray['wall-texture-1'] }}'></ImageTexture>
<TextureTransform scale='0.5 2'/>
</Appearance>
<Box size='1.5 9.2 1.5'/>
</Shape>
</Transform>
<!-- back left column -->
<Transform translation='-{{ (shopWidth/2)|round(2, 'ceil') }} 4.6 15.3'>
<Shape>
<Appearance>
<Material ambientIntensity='0.1'></Material>
<ImageTexture url='{{ textureArray['wall-texture-1'] }}'></ImageTexture>
<TextureTransform scale='0.5 2'/>
</Appearance>
<Box size='1.5 9.2 1.5'/>
</Shape>
</Transform>
<!-- front right column -->
<Transform translation='{{ (shopWidth/2)|round(2, 'ceil') }} 4.6 -69.8'>
<Shape>
<Appearance>
<Material ambientIntensity='0.1'></Material>
<ImageTexture url='{{ textureArray['wall-texture-1'] }}'></ImageTexture>
<TextureTransform scale='0.5 2'/>
</Appearance>
<Box size='1.5 9.2 1.5'/>
</Shape>
</Transform>
<!-- middle right column -->
<Transform translation='{{ (shopWidth/2)|round(2, 'ceil') }} 4.6 -25.8'>
<Shape>
<Appearance>
<Material ambientIntensity='0.1'></Material>
<ImageTexture url='{{ textureArray['wall-texture-1'] }}'></ImageTexture>
<TextureTransform scale='0.5 2'/>
</Appearance>
<Box size='1.5 9.2 1.5'/>
</Shape>
</Transform>
<!-- back right column -->
<Transform translation='{{ (shopWidth/2)|round(2, 'ceil') }} 4.6 15.3'>
<Shape>
<Appearance>
<Material ambientIntensity='0.1'></Material>
<ImageTexture url='{{ textureArray['wall-texture-1'] }}'></ImageTexture>
<TextureTransform scale='0.5 2'/>
</Appearance>
<Box size='1.5 9.2 1.5'/>
</Shape>
</Transform>
<!-- left panel below ceiling -->
<Transform translation='-{{ (shopWidth/2)|round(2, 'ceil') }} 8.4 -27.2'>
<Shape>
<Appearance>
<Material ambientIntensity='0.1'></Material>
<ImageTexture url='{{ textureArray['wall-texture-1'] }}'></ImageTexture>
<TextureTransform scale='15 0.7'></TextureTransform>
</Appearance>
<Box size='0.4 2.2 85'/>
</Shape>
</Transform>
<!-- right panel below ceiling -->
<Transform translation='{{ (shopWidth/2)|round(2, 'ceil') }} 8.4 -27.2'>
<Shape>
<Appearance>
<Material ambientIntensity='0.1'></Material>
<ImageTexture url='{{ textureArray['wall-texture-1'] }}'></ImageTexture>
<TextureTransform scale='15 0.7'></TextureTransform>
</Appearance>
<Box size='0.4 2.2 85'/>
</Shape>
</Transform>
<!-- left floor rim -->
<Transform translation='-{{ (shopWidth/2)|round(2, 'ceil') }} 0.0 -27.2'>
<Shape>
<Appearance>
<Material ambientIntensity='0.1' diffuseColor='0 0 0' specularColor='0 0 0' transparency='0.3'></Material>
</Appearance>
<Box size='2.2 0.4 87'/>
</Shape>
</Transform>
<!-- right floor rim -->
<Transform translation='{{ (shopWidth/2)|round(2, 'ceil') }} 0.0 -27.2'>
<Shape>
<Appearance>
<Material ambientIntensity='0.1' diffuseColor='0 0 0' specularColor='0 0 0' transparency='0.3'></Material>
</Appearance>
<Box size='2.2 0.4 87'/>
</Shape>
</Transform>
</Transform>
<Route fromNode="CLOCK" fromField ="fraction_changed" toNode="UserTranslation1" toField="set_fraction"> </Route>
<Route fromNode="UserTranslation1" fromField ="value_changed" toNode="TourAvatarWrapper" toField="translation"> </Route>
</scene>
</x3d>
</div>
<script>
//we setup full screen 3d canvas
//var buttonFullscreen = document.getElementById("button_fullscreen");
//buttonFullscreen.click(); // this will trigger the click event
//$( document ).ready(function() {
//console.log( "ready!" );
//document.getElementById("button_fullscreen").click();
//});
</script>
{% endblock %}