<?php
		

	/*
	 * Get Header
	 */
	require_once 'inc/header.php';
	
	
	$html = '<div class="grid-x grid-padding-x">';
	
		/*
		 * Sidebar 
		 */
		$html .= '<div class="small-12 large-3 cell">';
			$html .= '<div class="sticky" data-sticky data-options="marginTop:8;marginBottom:1;" data-top-anchor="page-calculator:top" data-btm-anchor="page-calculator:bottom">';

				$html .= '<div class="callout sidebar-navigation">';
				
					$html .= '<h3>'. $data["cassette"]->getSectionName() .'</h3>';
					foreach($data["cassette"]->getSideBarNavigation($data["cassette"]->getSectionName()) as $sidebar)
					{
						$html .= $sidebar->getSideBarElements($element->getSectionId(),$data["category_name"],$data["entry_name"]);
					}

				$html .= '</div>';
			
			$html .= '</div>';
		$html .= '</div>';
		
		
		/*
		 * Content
		 */
		$html .= '<div class="small-12 large-9 cell">';
			
			$html .= $data["page"][0]->getProperty("contents");
			
			
			/*
			 * Calculator
			 */
			$html .= '<div class="grid-x grid-padding-x">';
				$html .= '<div class="small-12 large-12 cell calculator">';
				$html .= '<div class="callout large">';
					$html .= '<div class="grid-x grid-padding-x align-bottom">';
		
					$html .= '<div class="small-12 cell text-center">';
						$html .= '<h2>Bereken de totale verwachte kosten</h2>';
						$html .= '<p>Met onze kostentool kunt u zelf eenvoudig de totale verwachte kosten berekenen. Vul hieronder uw te beleggen vermogen in en kies een risicoprofiel.</p>';
					$html .= '</div>';
		
		
					$html .= '<div class="small-12 large-auto cell">';
						$html .= '<label>';
						$html .= 'Bedrag';
						$html .= '<div class="input-group">';
							$html .= '<span class="input-group-label">€</span>';
							$html .= '<input class="input-group-field" type="text" id="calculator-amount" value="750000" placeholder="bedrag">';
							$html .= '</div>';
						$html .= '</label>';
					$html .= '</div>';
				
						
					$html .= '<div class="small-12 large-auto cell">';
						$html .= '<label>';
						$html .= 'Model';
							
							$html .= '<select id="calculator-model">';
								
								// override pagination settings
								$data["cassette"]->setPaginationLimit(20);

								// get modellen
								$models	= $data["cassette"]->getPage("kostencalculator");
								foreach($models as $model)
								{
									$html .= '<option value="'. $model->getProperty("uid") .'">'. $model->getProperty("model") .'</option>';
								}
						
							$html .= '</select>';
						$html .= '</label>';
					$html .= '</div>';
				
		
					$html .= '<div class="small-12 large-3 cell align-bottom">';
						$html .= '<button type="button" class="button expanded primary cost-calculator">Bereken uw kosten</button>';
					$html .= '</div>';

				
					$html .= '<div class="small-12 cell hide" id="view-calculator">';
				
						$html .= '<br /><br />';
						foreach($data["config"]->getSetting("calculator_fields") as $i => $group)
						{
							$html .= '<table class="">';
							foreach($group as $x => $field_arr){
							
								if($i == 0 || $i == 1)
								{
									$html .= '<thead><tr>';
										$html .= '<th width="30%">'. $x .'</th>';
										$html .= '<th width="5%" class="">&nbsp;</th>';
										$html .= '<th width="15%" class="text-left">'. ($i == 0 ? 'Jaar 1' : '') .'</th>';
										$html .= '<th width="15%" class="text-right">&nbsp;</th>';
										$html .= '<th width="5%" class="">&nbsp;</th>';
										$html .= '<th width="15%" class="text-left">'. ($i == 0 ? 'Vanaf jaar 2' : '') .'</th>';
										$html .= '<th width="15%" class="text-right">&nbsp;</th>';
									$html .= '</tr></thead>';	
								}
								elseif($i == 2)
								{
									$html .= '<thead><tr class="total">';
										$html .= '<th width="30%" class="">'. $x .'</th>';
										$html .= '<th width="5%" class="">&nbsp;</th>';
										$html .= '<th width="15%" id="year1_total" class="text-right euro">6.234</th>';
										$html .= '<th width="15%" id="year1_perc_total" class="text-right procent">1,25</th>';
										$html .= '<th width="5%" class="">&nbsp;</th>';
										$html .= '<th width="15%" id="year2_total"class="text-right euro">5.394</th>';
										$html .= '<th width="15%" id="year2_perc_total" class="text-right procent">1,08</th>';
									$html .= '</tr></thead>';	
								}
							
								$html.= '<tbody>';
							
							
								foreach((array) $field_arr as $element)
								{
									$html .= '<tr class="text-right '. $element[3] .'">';
										$html .= '<td class="text-left">'. $element[1] .'</td>';
										$html .= '<td class="">&nbsp;</td>';
										$html .= '<td class="euro" id="year1_'.$element[0] .'">'. $element[2][0] .'</td>';
										$html .= '<td class="procent" id="year1_perc_'.$element[0] .'">'. $element[2][1] .'</td>';
										$html .= '<td class="">&nbsp;</td>';
										$html .= '<td class="euro" id="year2_'.$element[0] .'">'. $element[2][0] .'</td>';
										$html .= '<td class="procent" id="year2_perc_'.$element[0] .'">'. $element[2][1] .'</td>';
									$html .= '</tr>';
								}
							}
							$html .= '</tbody>';
							$html .= '</table>';
						}
					
				
					$html .= '</div>';
				
		
					$html .= '</div>';	
				$html .= '</div>';
			$html .= '</div>';
			$html .= '</div>';
			
		$html .= '</div>';
		
		
		
	$html .= '</div>';
	

	/*
	 * Output html to page
	 */
	echo $data["config"]->wrapAsSection($html,"page-calculator");
	
	
	
	/*
	 * Check if entry has a form
	 */	
	if( $cassetteForm = $data["page"][0]->getForm() )
	{

		$form = '<div class="grid-container">';
			$form .= '<div class="grid-x">';
		
				$form .= '<div class="small-10 small-offset-1 cell text-center">';
					$form .= $cassetteForm->getFormIntro();
				$form .= '</div>';
				
				
				$form .= '<div class="large-12 cell hide" id="contact-general" data-toggler=".hide">';
					$form .= $cassetteForm->getForm();
				$form .= '</div>';
				
				$form .= '</div>';
		$form .= '</div>';
	
		echo $data["config"]->wrapAsSection($form,null,"panel-gray");
	
	}
	
	
	
	/*
	 * Get Footer
	 */
	require_once 'inc/footer.php';
	
?>