<?php
	

	/*
 	 * Header
	 */
	require_once __DIR__ . '/inc/header.inc.php';
	
	

?>
	
	<!-- product info -->
	<div class="grid-container product-information">
		<div class="grid-x grid-padding-x">

			<?php 
			
				/*
				 * Left Column
				 */
				
				echo  '<div class="cell small-12 medium-9 left-column">';

				
					/*
				 	 * Product name & lead
					 */
				
					echo '<div class="product-text text-center medium-text-left">';
						echo '<h1>' . $product->getLead() . '</h1>';
						echo '<h4 class="blue"><i class="fal fa-truck"></i>'. $product->getDeliveryNote() .'</h4>';
					echo '</div>';
			
	
					/*
					 * Product images
					 */
				
					$image_list = '';
					$bullets 	= '';
					foreach($product->images as $i => $image)
					{
						$image_list .= '<li class="is-active orbit-slide">';
							$image_list .= '<figure class="orbit-figure">';
							$image_list .= '<img src="/upload/'.  $image->getUrl() .'" alt="'. $image->getAltText() .'">';
							$image_list .= '<figcaption class="orbit-caption hide">'. $image->getFigcaption() .'!</figcaption>';
							$image_list .= '</figure>';
						$image_list .= '</li>';
					
						$bullets .= '<button class="'. ($i == 0 ? "is-active" : "") .'"data-slide="'. $i .'"><span class="show-for-sr">'. $image->getFigcaption() .'</span></button>';
					}
			  
					echo '<div class="product-images">';
						echo '<div class="orbit" role="region" aria-label="'. $product->getLead() .'" data-orbit>';
					
							// orbit wrapper
							echo '<div class="orbit-wrapper">';
								echo '<ul class="orbit-container">';
									echo $image_list;
								echo '</ul>';
							echo '</div>';
						
							// nav bullets
							echo '<nav class="orbit-bullets">' . $bullets . '</nav>';

						echo '</div>';
					echo '</div>';
					
					
   					/*
   					 * Callout & Intro text
   					 */
				 
 					echo '<div class="product-callout text-center medium-text-left">';
 						echo '<a href="#order-product" class="button primary expanded show-for-small-only" data-smooth-scroll data-offset="-24"><strong>Bestellen</strong></a>';
												
						// product callout
						echo '<div class="callout primary">' . $product->getCallout() . '</div>';
				
						// product description intro
						echo '<p>' . $product->getIntroText(190) . '</p>';
					
 					echo '</div>';
				
				
				
				echo '</div>';
				
				
				/*
				 * Right Column
				 */
				
				echo '<div class="cell small-12 medium-3 right-column show-for-medium">';
					echo '<a href="#order-product" class="button secondary expanded" data-smooth-scroll data-offset="-24"><strong>Bestellen</strong></a>';
					echo '<h3>Hulp nodig bij bestellen?</h3>';
					
					echo '<ul class="no-bullet">';
						echo '<li class="phone">Bel een van onze medewerkers op '. $config->getPhoneLink() .'</li>';
						echo '<li class="email">Stuur een email naar '. $config->getEmailLink() .'</li>';
						echo '<li class="misc">';
							echo '<a href="'. $config->deliverySpecsPage() .'"><i class="fal fa-chevron-right"></i> Aanleverspecificaties</a>';
							echo $product->getTemplateFile('<a href="{url}"><i class="fal fa-chevron-right"></i> Download template (InDesign)</a>');
							echo $product->getArworkSpecs('<a href="{url}"><i class="fal fa-chevron-right"></i> Werktekeningen</a>');
						echo '</li>';
					echo '</ul>';
				
				echo '</div>';
					
						
			?>
	
			
		</div>
	</div>
		
	<?php
		

		/*
		 * Ordering 
		 */
		echo '<div class="grid-container select-product-properties" data-product="'. $product->getUrl() .'">';
			echo '<div class="grid-x grid-padding-x">';
				
				
				/*
			 	 * Line
				 */
				echo '<div class="cell small-12"><hr></div>';
			
			
				/*
			 	 * Left
				 */
				echo '<div class="cell small-12 medium-8" id="order-product">';
					echo '<h2>'. $product->getOrderLead() .'</h2>';
		
					
					/*
					 * Product property steps
					 */
					foreach($product->getProductGroups() as $group)
					{
						
						echo '<div class="product-property-select">';
							echo '<h4>'. $group->getName() .'</h4>';
							echo '<div class="grid-x grid-padding-x align-middle options-row" id="'. $group->getIdName() .'" data-group-name="'. $group->getName() .'" data-update-target="'. $group->getUpdateTarget() .'" data-insert-custom="'. $group->insertCustomElement() .'" '. $group->customSizeAttributes() .'>';
						
							$sub_options_array = [];
																
							foreach($group->getOptions() as $i => $option)
							{	
															
								// columnname
								$columnname = $option->getPostName();

								// sub items
								$sub_option_row = [];

								if( $option->isSelectable() )
								{	
									// show property option
									echo $option->getHtml($group, null, $columnname);
								
									// suboption for material weights
									if( $option->hasOptions() ){
																		
										foreach($option->getOptions() as $sub_option)
										{	
											// only show sub options which can be selected
											if( $sub_option->isSelectable() ) $sub_option_row[] = $sub_option->getHtml( $group, "gewicht",$columnname,$i);
										}
									
										$sub_options_array[] = $sub_option_row;
									}								
								}
							
							
							}
							echo '</div>';
						
							if(!empty($sub_options_array))
							{	
								$display = count($sub_options_array) == 1 ? 'style="display:none;"' : '';
							
								echo '<div class="grid-x grid-padding-x options-row" id="weight" '. $display .' data-update-target="'. $group->getUpdateTarget() .'" data-insert-custom="'. $group->insertCustomElement() .'">';
									echo '<div class="cell small-12"><h4>Gewicht</h4></div>';
							
									foreach($sub_options_array as $row)
									{	
										echo implode("",$row);
									}
									
								echo '</div>';
						
							}
					
					
						
						echo '</div>';
					}
			
				echo '</div>';
		
		
				/*
			 	 * Product preview Sidebar
				 */
				echo '<div class="cell small-12 medium-4 product-sidebar">';
					require_once __DIR__ . '/inc/sidebar.product.php';
				echo '</div>';
	
	
			echo '</div>';
		echo '</div>';		
		
					
					
		/*
		 * Product Outro Text
		 */
		echo '<div class="grid-container">';
			echo '<div class="grid-x grid-padding-x">';
		
				echo '<div class="cell small-12">';
					echo '<br /><h4 class="h2">Productinformatie</h4>';
					echo $product->getTextFull();					
				echo '</div>';
		
			echo '</div>';
		echo '</div>';
		
		
		/*
	 	 * Footer
		 */
		require_once __DIR__ . '/inc/footer.inc.php';

		//d( $product->getPropertyGroups() );

?>