{config_load file="$language/lang_$language.conf" section="product_info"}
{config_load file="$language/own_lang_$language.conf" section="product_info"}
{config_load file="$language/lang_$language.conf" section="index"}
{config_load file="$language/own_lang_$language.conf" section="index"}

{yes_vars assign="YES"}
{yes_vars assign="YES" contents=1}

<link rel="stylesheet" type="text/css" href="{$tpl_path}javascript/varianten/varianten.css">
<script type="text/javascript" src="{$tpl_path}/javascript/varianten/varianten.js"></script>
{if $slaves}
	<script type="text/javascript" language="javascript" src="{$tpl_path}javascript/jDropDown.js"></script>
	<link rel="stylesheet" type="text/css" href="{$tpl_path}css/jDropDown.css" />
{/if}
{literal}
<script type="text/javascript">
    $(document).ready(function(){
		{/literal}
		{if $INFO.PROPERTIES.0}{literal}
	endless.init({
            targHolderId: "#properties",
            targElementClass: "property",
            outputId:"#endlessOutput",
            imgFollow:true,
            livePreis:true,
            livePreisSrcId:'.prodPrize',
            cartFormId:'#prodBuyForm'
        });		
		{/literal}{/if}
		{literal}
    });
</script>
{/literal}
{if $slave_values|@count > 1}
<!-- Scripteinbindung Slave Sorter -->
<script type="text/javascript" src="{$tpl_path}javascript/sorter.js"></script>
<link rel="stylesheet" type="text/css" href="{$tpl_path}sorterStyle.css">
<!-- Scriptaufruf und Arraygenerierung Slave Sorter -->

{literal}
<!--[if gte IE 7]>
<style type="text/css">
    #jDrop{height:30px;
        padding-top:5px;}
</style>
<![endif]-->
<script type="text/javascript">
    jQuery(function(){
        //Array1 f?r Slave Sorter "Vorgaben"
        sorter.arr_names=[{/literal}{foreach from=$slave_values key=key item=item}"{$key}",{/foreach}{literal}]
        sorter.arr_filter=[ {/literal}
            {foreach from=$slave_values key=key item=item}
        [
                {foreach from=$item key=k item=i}
        "{$i.value}",
        {/foreach}
        ],
        {/foreach}
        {literal}
        ]
        //Array2 f?r Slave Sorter "Slaves"
        sorter.arr_items=[
        {/literal}
            {foreach from=$slaves key=key item=item}
            {literal}{{/literal}
            "link":"{$item.PRODUCTS_LINK}",
                    {foreach from=$item.key_values item=i key=k}
            "{$k}":"{$i}",
            {/foreach}
            {literal}},{/literal}
            {/foreach}
        {literal}
            ]
        //Scriptaufruf und Optionen
        sorter.init({
            target:'div#sortOutput',    // Selektor f?r Ausgabe (div mit ID wird empflohlen)
            counter:false});             // Counter der verf?gbaren Optionen true = anzeigen | false=ausblenden
    })
</script>
{/literal}
{/if}

<!-- ADMIN ZUGANG START -->
<div>
{* Kontrollfeld einblenden für die vereinfachte Kontrolle der MASTER-SLAVE und FSK18 Konfiguration *}
	{* Link einblenden für die direkte Produktbearbeitung *}
	{if $YES.SMARTY_SESSION_customers_status_array.customers_status_name == "Admin"} 
		
		<div style=" position:fixed; top:200px; left:0px; width:220px; padding:5px; background:#F8F9FE; color:#000; font-size:12px; border: 1px solid #fff;z-index: 9999999;">
			{if $PRODUCTS_MASTER == 0 AND $slaves != ""}
				MASTER = JA<br>
			{/if}
			{if $PRODUCTS_MASTER != 0}
				<b>SLAVE = JA<br>
				<a href="{$PRODUCTS_MASTER_LINK|replace:'http://':'https://'}">Link zum MASTER</a></b><br>
			{/if}
			{if $PRODUCTS_FSK18}
				<div style=" background-color:#F00;">Dieses Produkt ist als FSK 18 markiert!</div>
			{else}
				<div style=" background-color:#2ba6cb;color:#fff;">Dieses Produkt ist NICHT als FSK 18 markiert!</div>
			{/if}
			<hr>
			Bestand V1: <strong>{$VERFUEGBARER_BESTAND1} Stk.<br></strong>
			Bestand V2: <strong>{$VERFUEGBARER_BESTAND2} Stk.<br></strong>
			Bestand phys.: <strong>{$PRODUCTS_QUANTITY} Stk.</strong>
			<hr><strong>Zur Artikelbearbeitung: </strong>
			<a href="{$YES.HTTP_SERVER|replace:'http://':'https://'}admin/categories.php?action=new_product&pID={$PRODUCTS_ID}" target="_blank"><strong>[PID: {$PRODUCTS_ID}]</strong></a>
		</div>
	{/if} 
</div>
<!-- ADMIN ZUGANG ENDE -->

<div class="reveal" id="prodDetModalContact" data-reveal>
	<div class="modal-content"><br><br>
		<div class="callout primary hollow"><p>Felder, die mit einem * markiert wurden sind Pflichtfelder.</p></div>
		<form data-standardTxt='Artikelname: {$PRODUCTS_NAME} {if $PRODUCTS_MODEL} Artikelnummer: {$PRODUCTS_MODEL}{/if}' name="contact_us" action="shop_content.php?action=send&amp;coID=7" method="post" class="ajaxForm">
			<label>Ihr Name</label>
			<input placeholder="Max Mustemann"  type="text" name="name" >
			<label>Ihre Email-Adresse*:</label><input placeholder="max@mustermann.de" required type="email" name="email" {if $YES.SMARTY_SESSION_customers_email_address} {/if}><br>
			<label>Ihre Nachricht:</label><textarea  name="message_body" wrap="soft" cols="21" rows="10" placeholder="Ich habe folgende Fragen zum Artikel"></textarea><br>
			<div class="row">
			{$YES_CAPTCHA}
			<div class="small-12 large-12"><br>Ihre Daten werden in unserer Kundendatenbank aufgenommen.</div>
			<div class="small-12 large-12"><a href="/Datenschutzerklaerung-_-2.html" target="_blank" class="float-left">Es gilt unsere Datenschutzerklärung</a><br><button class="button float-right" type="submit" border="0" title="Weiter" value="Weiter"><i class="fi-mail size-16"></i> Absenden</button></div>
			</div>
		</form>
	</div>
	<button class="close-button" data-close aria-label="Close modal" type="button">
		<span aria-hidden="true">&times;</span>
	</button>
</div>
<div class="contentHolder row">
	<h1><span itemprop="name">{$PRODUCTS_NAME}</span></h1>
	<div class="small-12 medium-6 pDetImg columns">
		<div class="borderBox pDetMainImg">
			{if $PRODUCTS_IMAGE}
				<a data-imagelightbox="a" href="{$PRODUCTS_IMAGE|replace:"info_images":"popup_images"}"><img alt="{$PRODUCTS_NAME}" src="{$PRODUCTS_IMAGE|replace:"info_images":"popup_images"}" itemprop="image" title="{$PRODUCTS_NAME}"></a>
			{else}
			<a data-imagelightbox="a" href="{$tpl_path}img/noimg.jpg"><img alt="Keine Grafik vorhanden" src="{$tpl_path}img/noimg.jpg" itemprop="image"></a>
			{/if}
		</div>
		{if $PRODUCTS_IMAGE_1}
		<div class="borderBox hide-for-small-only">
			<div class="pDetImgList">
				<a href="{$PRODUCTS_IMAGE|replace:"info_images":"popup_images"}"><img alt="{$PRODUCTS_NAME} - 0" class="thumbnail" src="{$PRODUCTS_IMAGE}" itemprop="image"> </a>
				<a data-imagelightbox="a" href="{$PRODUCTS_IMAGE_1|replace:"info_images":"popup_images"}"><img alt="{$PRODUCTS_NAME} - 1" class="thumbnail" src="{$PRODUCTS_IMAGE_1}" itemprop="image"> </a>
				{if $PRODUCTS_IMAGE_2}
				<a data-imagelightbox="a" href="{$PRODUCTS_IMAGE_2|replace:"info_images":"popup_images"}"><img alt="{$PRODUCTS_NAME} - 2" class="thumbnail" src="{$PRODUCTS_IMAGE_2|replace:"info_images":"popup_images"}" itemprop="image"> </a>
				{/if}
				{if $PRODUCTS_IMAGE_3}
				<a data-imagelightbox="a" href="{$PRODUCTS_IMAGE_3|replace:"info_images":"popup_images"}"><img alt="{$PRODUCTS_NAME} - 3" class="thumbnail" src="{$PRODUCTS_IMAGE_3|replace:"info_images":"popup_images"}" itemprop="image"> </a>
				{/if}
				{if $PRODUCTS_IMAGE_4}
				<a data-imagelightbox="a" href="{$PRODUCTS_IMAGE_4|replace:"info_images":"popup_images"}"><img alt="{$PRODUCTS_NAME} - 4" class="thumbnail" src="{$PRODUCTS_IMAGE_4|replace:"info_images":"popup_images"}" itemprop="image"> </a>
				{/if}
				{if $PRODUCTS_IMAGE_5}
				<a data-imagelightbox="a" href="{$PRODUCTS_IMAGE_5|replace:"info_images":"popup_images"}"><img alt="{$PRODUCTS_NAME} - 5" class="thumbnail" src="{$PRODUCTS_IMAGE_5|replace:"info_images":"popup_images"}" itemprop="image"> </a>
				{/if}
				
				
			</div>
		</div>
		{/if}
	</div>
	<div class="small-12 medium-6 pDetDetails columns">
		<div class="borderBox">
			<div class="row">

				<div class="small-12 medium-12 pDetDetails columns">
					<div class="pDetPrice ">{if $INFO.PRODUCTS_MASTER_STATUS == 1 AND $slaves AND $PRODUCTS_PRICE|replace:'EUR':'&euro;'|count_characters:true < 40 }<!--ab-->{elseif $PRODUCTS_PRICE|replace:'EUR':'&euro;'|count_characters:true < 40}<!--nur-->{/if} <span class="prodPrize">{$PRODUCTS_PRICE|replace:'EUR':'&euro;'|replace:"Ab":""}</span></div>
					<div class="pDetPriceAddition">
					
					Preis pro laufenden Meter {$INFO.PRODUCTS_TAX_INFO} zzgl. <a class="modalCall" data-src="{$YES.HTTP_SERVER}/popup_shippingcosts.php?products_id={$PRODUCTS_ID}" data-target="modalAjax" href="#">Versandkosten</a>
					<span itemprop="sku" content="{$PRODUCTS_ID}"></span>
					</div>
					{if $INFO.PRODUCTS_VPE_STATUS!=0}
							<div class="prodGp"><i>Grundpreis: {$INFO.PRODUCTS_VPE|replace:'EUR':'&euro;'|replace:"pro":"/"}</i></div>
						{/if}
					{if $INFO.GRADUATED_QUANTITY == "0-0"}
					{else}
					{if $MODULE_graduated_price}<br>{$MODULE_graduated_price|replace:'<div align="center">Staffelpreise</div>':'<div align="left" style="color: #2a81c4;font-weight: 600;font-size: 16px;">Staffelpreise</div>'}<div class="pDetPriceAddition"></div>{/if}	
					{/if}
					
				</div>
				<div class="small-12 medium-12 pDetDetails columns">
					<!-- {if $PRODUCTS_MODEL}
					<div class="border">
						<div class="prod_data_title_1">Artikel Nr.</div><div class="prod_data_txt_1">
						{$PRODUCTS_MODEL}</div>
					</div>
					{/if} -->
					{if $PRODUCTS_EAN}
					<div class="border">
					<div class="prod_data_title_2">EAN</div><div class="prod_data_txt_2"><span itemprop="gtin13">{$PRODUCTS_EAN}</span>
					</div>
					</div>
					{/if}
					<div class="border">
					{if $VERFUEGBARER_BESTAND1 > '0'}
					<div class="prod_data_title_2">Verfügbarkeit</div><div class="prod_data_txt_2"><div class="shipping_icon"><i class="fi-checkbox size-18"></i><span class="shipping_icon_txt">Auf Lager</span></div>
					{else}
					<div class="prod_data_title_2">Verfügbarkeit</div><div class="prod_data_txt_2"><div class="shipping_icon2"><!--<i class="fi-checkbox size-18"></i>--><span class="shipping_icon_txt" style="color: #ff0000;">aktuell nicht verfügbar</span></div>
					{/if}
					</div>
					</div>
					<div class="border">
						<div class="prod_data_title_3">{#text_shippingtime#|replace:':':''}*
						</div>
						<div class="prod_data_txt_3">
						{$INFO.SHIPPING_STATUS_NAME}
						</div>
					</div>

				</div>
				{if $slaves}
				<div class="small-3 medium-3 pDetDetails columns mvari">
					<div class="prod_data_title_4">{#text_variations#}</div>
				</div>
				<div class="small-9 medium-9 pDetDetails columns mvari">
					<div class="vari">
					
						{if $slave_values|@count > 1}
						<div id="sortOutput"></div>
						<div style="font-weight: bold;">Gewählte Variante:<br><span style="color:#d82633;font-weight: bold;">{$INFO.SLAVE_TITLE}</span></div>
					{else}
						
						{if $INFO.PRODUCTS_MASTER_STATUS == 0 AND $INFO.PRODUCTS_FSK18 == 1}
						{else}
							{if $SLAVE_TITLE}
								{#text_selected_variation#}:<br><b style="color: #d82633;">{$SLAVE_TITLE}</b><br /><br>
							{elseif $key_values}
								{#text_selected_variation#}: <br />
								{foreach key=Merkmal item=ausp from=$key_values}<b>{$Merkmal}:</b> {$ausp}<br />
								{/foreach}
					
								<br />
							{/if} 
						
							<div class="ch_titl" >{#text_variations#}:</div>
						{/if}
							<div class="ch_vlue">
								<form style="margin-bottom:5px;">
									<SELECT NAME="liste1" style="width:100%;" onChange="location = form.liste1.options[form.liste1.selectedIndex].value;">
									
									{if $PRODUCTS_MASTER_STATUS == 1 AND $slaves != ""}
									<option SELECTED VALUE="">{#text_please_choose#}...</option>
									{else}
									<option SELECTED VALUE="">{$INFO.SLAVE_TITLE}</option>
									{/if}
										{foreach name=aussen item=data from=$slaves}
										
											<OPTION VALUE="{$data.PRODUCTS_LINK}">{$data.products_name}</OPTION>
										{/foreach}
									</SELECT>
								 </form>		 						 
								 <p><span style="font-weight: bold;">Hinweis:</span><br>Der Preis wird pro laufenden Meter (1000mm) berechnet.<br>Max. Länge: 6000mm am Stück<p>
							</div>						
					{/if}
					</div>
				</div>
				{/if}
				{if $INFO.PROPERTIES.0}
				<div id="properties" style="margin:10px;">
					<p><b>{#properties#}</b></p>
					{foreach from=$INFO.PROPERTIES item=property}
						{$property.title}<br />
						<div id="property" style="padding:10px;">
						{foreach from=$property.values item=pv}
							<label><input type="radio" class="ppv" name="pp_{$property.id}" value="{$pv.price_brutto}" id="{$pv.id}">&nbsp;{$pv.title}&nbsp;({$pv.price_formatted})</label><br />
							{assign var="pv_preselect" value="0"}
						{/foreach}
						</div>
					{/foreach}
				</div>
				{/if}
				
			</div>
			
			<div class="pDetCart">
				{if $PRODUCTS_DATE_AVIABLE}
				<span style="text-align: center">
					{$PRODUCTS_DATE_AVIABLE|replace:". ":"."|replace:",":", den"}
					</span>
				{else}
				

					{$FORM|replace:'name=':'id="prodBuyForm" name='}
						{if $YES.SMARTY_SESSION_customers_email_address!=''}
							{$INFO.WISHLIST_BUTTON|replace:'<a':'<a class="wishlistTrigger"'|replace:'Wunschliste':'Merkliste'}
							{else}
							<a class="modalSend button hollow" data-html="<p>Um diese Funktion nutzen zu können müssen Sie sich erst anmelden.</p><br><a class='button float-right' href='login.php'>zur Anmeldung</a><span class='clearfix'></span>" href="#" style="display: inline-block;"><i class="fi-heart size-16"></i> <span class="hide-for-small-only"> Zur Merkliste</span></a>
						{/if}
						{if $INFO.PRODUCTS_FSK18}
						{else}
						{if $VERFUEGBARER_BESTAND1 <= "0"} {else}
						<button class="button prod_buy cartSubmit greenhov" type="submit"><i class="fi-shopping-cart size-16"></i>  In den Warenkorb</button>
						<!-- <div class="cart_qty_r"><a href="#" class="button cart_qty_button secondary float-left">-</a><a href="#" class="button cart_qty_button float-right primary">+</a>{$ADD_QTY|replace:'<input type="text"':'<input type="number" class="cartQty " min="1" '}</div> -->
						<input type="number" min="1" class="cartQty addcart_qty" onfocus="this.select()" name="products_qty" value="1" size="3">
						
						<input type="hidden" value="{$PRODUCTS_ID}" name="products_id">
						
						
						{* $ADD_QTY|replace:'type="text"':'type="number" min="1" onfocus="this.select()"' *}
						<span class="clearfix"></span>
						{/if}
						{/if}
					{$FORM_END}
				{/if}

			</div>
			


			<div class="pDetData clearfix">
				<div class="small-12 medium-12 large-12 column float-left clearfix">
					{if $INFO.PROPERTIES.0}
					<div id="properties" style="margin:10px; visibility: hidden; height: 0px;">
						<p><b>{#properties#}</b></p>
						{foreach from=$INFO.PROPERTIES item=property}
						<div class="property" style="padding:10px;">
						<h5>{$property.title}</h5>
						{foreach from=$property.values item=pv}						
						 <span><input type="radio" class="ppv" name="pp_{$property.id}" value="{$pv.price_formatted|replace:" ":""|replace:'&nbsp;':''|replace:'EUR':'&euro;'}" id="{$pv.id}" /><img src="/images/product_images/thumbnail_images/{$pv.image}"> {$pv.title} {if $pv.price_formatted!=" 0,00 EUR"}(+{$pv.price_formatted|replace:"EUR":"&euro;"}){/if}</span><br />
						{/foreach}
						</div>
						{/foreach}
					</div>
					<h6 class="prodInfoTitle">Bitte wählen Sie eine Farbe:</h6>
					<div id="endlessOutput"></div>
					{/if}
				</div>
				<div class="small-12 medium-6 large-6 column float-left clearfix">
				</div>
			</div>
			
			
			
			{if $MANUFACTURERS_INFO.manufacturers_image}
			<div class="small-12 medium-12 columns float-center text-center" style="border-top: 1px solid #efab22;border-bottom: 1px solid #efab22;padding-bottom:20px">
				<div class="">
					<a href="../{$MANUFACTURERS_INFO.manufacturers_meta_title}-.-{$INFO.MANUFACTURERS_ID}.html" title="{$MANUFACTURERS_INFO.manufacturers_name}">
					<br><img src="../images/{$MANUFACTURERS_INFO.manufacturers_image}" alt="{$MANUFACTURERS_INFO.manufacturers_name}" width="100px">
					<br><b>{$MANUFACTURERS_INFO.manufacturers_meta_description}</b></a>
				</div>	
			</div>
			{/if}
			<div class="pDetMiniNav">
				<a class="hide-for-small-only printPopup" data-id="{$PRODUCTS_ID}" href="#")><i class="fi-print"></i> Datenblatt</a>
				<a  data-open="prodDetModalContact"><i class="fi-at-sign"></i> Frage zum Artikel</a>
			</div>
			<div class="pDetShort">
			<!-- {if $INFO.PRODUCTS_SHORT_DESCRIPTION}{$INFO.PRODUCTS_SHORT_DESCRIPTION}{/if}-->

			{if $INFO.PRODUCTS_SHORT_DESCRIPTION} <span style="color: #39ae60;font-weight: 600;font-size: 16px;">Kurzbeschreibung:</span><br> {$INFO.PRODUCTS_SHORT_DESCRIPTION}{/if}
			<!-- {if $INFO.PRODUCTS_EXTRA_TEXT} <span style="color: #39ae60;font-weight: 600;font-size: 16px;">Bilderlinks:</span><br> {$INFO.PRODUCTS_EXTRA_TEXT|replace:",":"<br>"}{/if}-->

			</div>
		</div>

	</div>


	<div class="small-12 columns">
		<div class="tab2acco hide-for-small-only">
			<a href="#" class="activeTab" data-accId="panel1">Artikelbeschreibung</a>
			{if $MODULE_product_characteristics}
			<a href="#" class="" data-accId="panel2">Produktdetails</a>
			{/if}
		</div>
		<ul class="accordion" data-accordion role="tablist" id="prodtab2acco">
			<li class="accordion-item is-active" data-accordion-item id="panel1">
				<a href="#" class="accordion-title show-for-small-only" role="tab">Artikelbeschreibung</a>
				<div class="accordion-content is-active" role="tabpanel" data-tab-content  >
					<span itemprop="description"><p>{$PRODUCTS_DESCRIPTION}</p></span>

				</div>
			</li>
			{if $MODULE_product_characteristics}
			<li class="accordion-item" data-accordion-item id="panel2">
				<a href="#" class="accordion-title  show-for-small-only"  role="tab">Produktdetails</a>
				<div class="accordion-content " data-tab-content="" role="tabpanel" >
					{$MODULE_product_characteristics}
				</div>
			</li>
			{/if}
		</ul>
		
		<!-- Parallax-->
		<section id="aluplast">
		  <div class="aluplast-img"></div>
		  <div class="title">
			<img src="https://fensterbauprofi.de/files/product-image/fensterbauprofi-produzent-aluplast.jpg"> 
		  </div>
		</section>
		
		<!-- Aluplast Hersteller-Info-->	
		<div class="clearfix">
			<div class="float-center">
				<div class="row contentHolder2">
					<div class="columns">
						{if $YES.CONTENT.ID_56.text}{$YES.CONTENT.ID_56.text}{/if}
					</div>
				</div>
			</div>
		</div>
		
		<!-- FBP-Info-->	
		<div class="clearfix">
 		<div class="float-center">
	 		<div class="row contentHolder2">
				<div class="columns">
					{if $YES.CONTENT.ID_66.text}{$YES.CONTENT.ID_66.text}{/if}
				</div>
			</div>
		</div>
		</div>
	</div>

	
</div>
<div itemtype="https://schema.org/Offer" itemscope="" itemprop="offers">
	<meta content="{$smarty.server.HTTP_HOST|replace:".de":""|replace:".com":""|replace:".net":""}" itemprop="seller">
	<meta content="{$INFO.CURRENCY}" itemprop="priceCurrency">
	<meta content="{$INFO.PRODUCTS_PRICE_CLEAN|replace:'EUR':''|replace:',':'.'}" itemprop="price">
	<meta content="{$SHIPPING_NAME}" itemprop="availability">
</div>

{$MODULE_also_purchased}

{literal}
<script type="application/ld+json">

{
  "@context": "http://schema.org/",
  "@type": "Product",
  "name": "{/literal}{$PRODUCTS_NAME}{literal}",
  "image": "{/literal}https://{$smarty.server.HTTP_HOST}/images/product_images/popup_images/{$PRODUCTS_ID}_0.jpg{literal}",
  "description": "{/literal}{$PRODUCTS_DESCRIPTION}{literal}",
  "mpn": "{/literal}{$PRODUCTS_MODEL}{literal}",
  "brand": {
    "@type": "Thing",
    "name": "{/literal}{$MANUFACTURERS_INFO.manufacturers_name}{literal}"
  },
  "offers": {
    "@type": "Offer",
    "priceCurrency": "{/literal}{$INFO.CURRENCY}{literal}",
    "price": "{/literal}{$INFO.PRODUCTS_PRICE_CLEAN|replace:'EUR':''|replace:',':'.'}{literal}",
    "priceValidUntil": "{/literal}2020-11-05{literal}",
    "itemCondition": "http://schema.org/UsedCondition",
    "availability": "http://schema.org/InStock",
    "seller": {
      "@type": "Organization",
      "name": "{/literal}{$smarty.server.HTTP_HOST}{literal}"
    }
  }
}
</script>
{/literal}