<?php echo $this->render('module/header_mobi.phtml'); ?>

<style>

.infoElement{
    display: inline-block;
    text-transform: none;
    margin-left: 20px;
    font-size: 11px;
    color: bisque;
}

</style>

<div class="conBox">
<div class="container widthDiv">
	<div class="row categoryStrap">
		<div class="col-xs-12">
			<?php 
				if( $this->zm == false ){
				if( $this->idCategory > 0 ){
					$Lib_Category = new Lib_Category();
					$dataCategoryParent = $Lib_Category->parentListO($this->idCategory);
					echo "<a href='".@$this->url(array('controller' => 'category', 'action' => 'index'), 'default', true)."'><i class='fa fa-home'></i></a> >> ";
					foreach($dataCategoryParent as $k => $v):
						echo "<a href='".@$this->url(array('controller' => 'category', 'action' => 'index', 'id' => $v['category_id']), 'default', true)."'>".@Lib_Lang::consta(category_name_.$v['category_id']).'</a> >> ';
					endforeach;
				}
				}else{
				if( $this->idCategory > 0 ){
					$Lib_Category = new Lib_Category();
					$dataCategoryParent = $Lib_Category->parentListO($this->idCategory,1);
					echo "<a href='".@$this->url(array('controller' => 'category', 'action' => 'set'), 'default', true)."'><i class='fa fa-home'></i></a> >> ";
					foreach($dataCategoryParent as $k => $v):
						echo "<a href='".@$this->url(array('controller' => 'category', 'action' => 'set', 'id' => $v['category_id']), 'default', true)."'>".@Lib_Lang::consta(category_name_.$v['category_id']).'</a> >> ';
					endforeach;
				}				
				}
			?>
		</div>
	</div>
	
	<div class="row">
		<div class="col-lg-8 col-sm-12 col-xs-12">
			<h3><?php echo @Lib_Lang::consta(product_name_.$this->rowProduct['product_id']); ?></h3>
		</div>		

		
		


		<div class="col-lg-4 col-sm-12 col-xs-12">
	
<script type="text/javascript" language="javascript">

	$(document).ready(function () {
	
	var s = $('#shopProduct');
	var pos = s.offset()
	
	$(window).scroll(function() {
		st = $(window).scrollTop();
		
		if( st >= pos.top ){
			$('#shopProduct').addClass('shopProductPosition');
		}else{
			$('#shopProduct').removeClass('shopProductPosition');	
		}
		
	});
	
	});

</script>	
			
				<div id="shopProduct" style="text-align:right;"></div>				
		
		</div>
		
		
		
		
		
		
		
			
			
		<div class="col-lg-4 col-sm-4 col-xs-12 pull-right">
			<div class="productBox">
			
			
			
			

<script type="text/javascript" language="javascript">
$(document).ready(function () {

});
</script>


<div class="productPhotoConfiguratorBox">
<?php
	$imgmain = '';
	for( $i = 8; $i >= 1; $i-- ){
	
		/*
		if( $i == 1 ) $ti = '';
		else $ti = '_'.$i;
		*/
		$ti = '_'.$i;

		if( $this->rowProduct['product_image'.$ti] ){
			$imgmain = $this->rowProduct['product_image'.$ti];
		}
	}
?>  
<?php if( $imgmain != '' ){ ?>
	<div class="productPhoto"> <img src="<?php echo $this->escape($this->baseUrl); ?>/public/uploads/product/<?php echo$imgmain; ?>.jpeg" class="placeholder" style="width:100%;margin:0 auto;" /></div>
<?php } ?>   
					
					
<?php
	for( $i = 1; $i <= 8; $i++ ){
	
	/*
	if( $i == 1 ) $ti = '';
	else $ti = '_'.$i;
	*/
	
	$ti = '_'.$i;
?>					
	<?php if( $this->rowProduct['product_image'.$ti] ){ ?>
		<a href="<?php echo $this->escape($this->baseUrl); ?>/public/uploads/product/<?php echo$this->rowProduct['product_image'.$ti];?>.jpeg" data-lightbox="zdjecia">
			<img src="<?php echo $this->escape($this->baseUrl); ?>/public/uploads/product/<?php echo$this->rowProduct['product_image'.$ti];?>_w100.jpeg" alt="Thumbnail">
		</a>
	<?php } ?>   
<?php 
	}
?>     




				</div>

				
				<div class="productConfiguratorBox"><?php echo @Lib_Lang::consta(product_description_.$this->rowProduct['product_id']); ?></div>
				<div class="productConfiguratorBox" id="productTable"></div>
			</div>
		</div>
		
		
		
		
		
		
		
		
		

		<div class="col-lg-8 col-sm-8 col-xs-12 pull-right">
		
			<div class="configuratorBox">			
				
	
<script type="text/javascript" language="javascript">

	$(document).ready(function () {
	
		var box1 = [<?php $iBox = 0;
				foreach( $this->panelBox as $key => $val ){
					$iBox++;
					if( count($box)!=$iBox ) echo'"'.$val.'",';
					else  echo'"'.$val.'"';
				}
			?>];
		var boxMax1 = <?php echo count($this->panelBox)-1; ?>;

		$(".configuratorDivElement").hide();
		$('[data-field="sizeBox"]').addClass('active');
		$('#sizeBox').show();
	
		$(".configuratorMenuElement").click(function(){			
			$(".configuratorDivElement").hide();
			$(".configuratorMenuElement").removeClass('active');
			$(this).addClass('active');
			var idele = $(this).attr('data-field');
			$("#"+idele).show();	
			$('#nextBoxButton').attr('actual',idele);	
			$('#nextBoxButton').attr('actualid',box1.indexOf(idele));


			$('html, body').animate({
				scrollTop: $("#"+idele).offset().top
			}, 500);
	
		});
	
	});

</script>			

<style>

.changeUnit{
	color: #000;
    padding: 5px;
    border: 1px solid #555;
}

.changeUnitSelected{
	color: #fff;
    font-weight: bold;
	background:#f26522;
}

.unitInputHidden{
	display:none;
}

.elementProductSubType{
	display:block;
}

</style>				

	
<script type="text/javascript" language="javascript">

	$(document).ready(function () {
	
		var defUnit = '<?php if( isset($this->configUnit) ) echo$this->configUnit; else echo'mm'; ?>';
	
		$('.unitInfo').html(defUnit);
		$('.unitElement, .unitInput').attr('unit',defUnit);
		$('.changeUnit[cmd="'+defUnit+'"]').addClass('changeUnitSelected');		
		if( $('.unitElement:first').attr('unit') == 'cm' ){				
			$(".unitElement").each(function(index) {
				$(this).html(parseInt($(this).html())/10);
			});						
			$(".unitInput").each(function(index) {
				$(this).val(parseInt($(this).val())/10);
			});		
		}
		
		
	
		$('.unitInput').change(function(){
			if( $(this).attr('unit') == 'mm' ) $('[name="'+$(this).attr('nF')+'"]').val($(this).val()).change();
			else $('[name="'+$(this).attr('nF')+'"]').val($(this).val()*10).change();
		});
	
		$('.changeUnit').click(function(){
		
			$('.changeUnit').removeClass('changeUnitSelected');
			$(this).addClass('changeUnitSelected');

			$.post( "<?php echo $this->url(array('controller' => 'product', 'action' => 'config'), 'default', true); ?>", {'field':'unit', 'value':$(this).attr('cmd')} );
			
			if( $(this).attr('cmd') != $('.unitElement:first').attr('unit') ){	
			
				$('.unitInfo').html($(this).attr('cmd'));
				$('.unitElement, .unitInput').attr('unit',$(this).attr('cmd'));
			
				if( $(this).attr('cmd') == 'cm' ){
				
					$(".unitElement").each(function(index) {
						$(this).html(parseInt($(this).html())/10);
					});		
				
					$(".unitInput").each(function(index) {
						$(this).val(parseInt($(this).val())/10);
					});		
					
				}else{
				
					$(".unitElement").each(function(index) {
						$(this).html(parseFloat($(this).html())*10);
					});	
				
					$(".unitInput").each(function(index) {
						$(this).val(parseFloat($(this).val())*10);
					});		
					
				}
				
			}
		
		});
	
	});

</script>	


			
<?php echo $this->render('product/index_size.phtml'); ?>

<?php echo $this->render('product/index_body.phtml'); ?>	
			
<?php echo $this->render('product/index_front.phtml'); ?>

<?php echo $this->render('product/index_front_2.phtml'); ?>		
					
<?php echo $this->render('product/index_type.phtml'); ?>	

<?php echo $this->render('product/index_accessories.phtml'); ?>	

<?php echo $this->render('product/index_legs.phtml'); ?>

<?php echo $this->render('product/index_handles.phtml'); ?>	

<?php echo $this->render('product/index_options.phtml'); ?>	
					
					
					
					
					
					
				
				</div>
				
				<div class="configuratorDiv">
				
				
		


					<script type="text/javascript" language="javascript">

						$(document).ready(function () {		
						
						
							$(".elementItem").click(function(){
								var idProduct = <?php echo$this->idProduct;?>;
								var product_field = $(this).attr('data-field');
								var product_value = $(this).attr('data-value');
								
								$( "#shopProduct" ).load( "<?php echo $this->url(array('controller' => 'product', 'action' => 'productshop'), 'default', true); ?>", {product_id: idProduct, product_field: product_field, product_value: product_value}, function(){$('#productTable').load( "<?php echo $this->url(array('controller' => 'product', 'action' => 'productshoptable'), 'default', true); ?>", {product_id: <?php echo$this->idProduct; ?>}, function(){} );} );
								
							});	
						
							function changeSize(){
								var idProduct = <?php echo$this->idProduct;?>;
								var product_height = $('[name="input_height"]').val();
								var product_width = $('[name="input_width"]').val();
								var product_depth = $('[name="input_depth"]').val();
								
								if( $('[name="input_height_view"]').attr('unit') == 'mm' ){
									$('[name="input_height_view"]').val(product_height);
									$('[name="input_height_view"]')
										.attr('step',$('[name="input_height"]').attr('step'))
										.attr('max',$('[name="input_height"]').attr('max'))
										.attr('min',$('[name="input_height"]').attr('min'));
								}else{
									$('[name="input_height_view"]').val(product_height/10);
									$('[name="input_height_view"]')
										.attr('step',$('[name="input_height"]').attr('step')/10)
										.attr('max',$('[name="input_height"]').attr('max')/10)
										.attr('min',$('[name="input_height"]').attr('min')/10);
								}
								
								if( $('[name="input_width_view"]').attr('unit') == 'mm' ){
									$('[name="input_width_view"]').val(product_width);
									$('[name="input_width_view"]')
										.attr('step',$('[name="input_width"]').attr('step'))
										.attr('max',$('[name="input_width"]').attr('max'))
										.attr('min',$('[name="input_width"]').attr('min'));
								}else{
									$('[name="input_width_view"]').val(product_width/10);
									$('[name="input_width_view"]')
										.attr('step',$('[name="input_width"]').attr('step')/10)
										.attr('max',$('[name="input_width"]').attr('max')/10)
										.attr('min',$('[name="input_width"]').attr('min')/10);
								}
								
								if( $('[name="input_depth_view"]').attr('unit') == 'mm' ){
									$('[name="input_depth_view"]').val(product_depth);
									$('[name="input_depth_view"]')
										.attr('step',$('[name="input_depth"]').attr('step'))
										.attr('max',$('[name="input_depth"]').attr('max'))
										.attr('min',$('[name="input_depth"]').attr('min'));
								}else{
									$('[name="input_depth_view"]').val(product_depth/10);
									$('[name="input_depth_view"]')
										.attr('step',$('[name="input_depth"]').attr('step')/10)
										.attr('max',$('[name="input_depth"]').attr('max')/10)
										.attr('min',$('[name="input_depth"]').attr('min')/10);
								}
								
								$('a.changeHeight > div').css('background-color','#ddd');
								$("a.changeHeight[cmd='"+product_height+"'] > div").css('background-color','none repeat scroll 0 0 rgb(242, 101, 34)');
								$('a.changeHeight > div').css('display','inline');
								$("a.changeHeight[cmd='"+product_height+"'] > div").css('display','none');
								
								$('a.changeWidth > div').css('background-color','#ddd');
								$("a.changeWidth[cmd='"+product_width+"'] > div").css('background-color','none repeat scroll 0 0 rgb(242, 101, 34)');
								$('a.changeWidth > div').css('display','inline');
								$("a.changeWidth[cmd='"+product_width+"'] > div").css('display','none');
								
								$('a.changeDepth > div').css('background-color','#ddd');
								$("a.changeDepth[cmd='"+product_depth+"'] > div").css('background-color','none repeat scroll 0 0 rgb(242, 101, 34)');								
								$('a.changeDepth > div').css('display','inline');
								$("a.changeDepth[cmd='"+product_depth+"'] > div").css('display','none');
								
								
								$( "#shopProduct" ).load( "<?php echo $this->url(array('controller' => 'product', 'action' => 'productshop'), 'default', true); ?>", {product_id: idProduct, product_height: product_height, product_width: product_width, product_depth: product_depth}, function(){$('#productTable').load( "<?php echo $this->url(array('controller' => 'product', 'action' => 'productshoptable'), 'default', true); ?>", {product_id: <?php echo$this->idProduct; ?>}, function(){} );} );	
																
							}
						
						
							$(function(){	
								var currentValue = $('[name="input_height"]');	
								
								<?php if( $this->rowProduct['product_height_def_only'] == 1 ){
									$valMap = '';
									foreach ( $this->ProductHeight as $key => $val ):
										$valMap = $valMap.$val['product_height_value'].',';
									endforeach;
									echo'var valMap = ['.$valMap.'];';
								} ?>
								
								$("#product_height").slider({ 
									value: <?php echo isset($this->dataSelect['product_height'])?$this->dataSelect['product_height']:$this->rowProduct['product_height_default'];?>,
									max: <?php echo$this->rowProduct['product_height_max'];?>,
									min: <?php echo$this->rowProduct['product_height_min'];?>,
									change: function(event, ui) {
										currentValue.val(ui.value);
										changeSize();
									}
									<?php if( $this->rowProduct['product_height_def_only'] == 1 ){
										echo',
											slide: function(event, ui) {
												return $.inArray(ui.value, valMap) != -1;
											}';
									} ?>
								});	
							});
							
							$('[name="input_height"]').change(function(){
								if( $(this).val() < <?php echo$this->rowProduct['product_height_min'];?> ){
									$(this).val(<?php echo$this->rowProduct['product_height_min'];?>);
								}
								if( $(this).val() > <?php echo$this->rowProduct['product_height_max'];?> ){
									$(this).val(<?php echo$this->rowProduct['product_height_max'];?>);
								}
								$("#product_height").slider( "value", $(this).val() );
							});
							
							$(function(){		
								var currentValue = $('[name="input_width"]');
								
								<?php if( $this->rowProduct['product_width_def_only'] == 1 ){
									$valMap = '';
									foreach ( $this->ProductWidth as $key => $val ):
										$valMap = $valMap.$val['product_width_value'].',';
									endforeach;
									echo'var valMap = ['.$valMap.'];';
								} ?>
								
								$("#product_width").slider({ 
									value: <?php echo isset($this->dataSelect['product_width'])?$this->dataSelect['product_width']:$this->rowProduct['product_width_default'];?>,
									max: <?php echo$this->rowProduct['product_width_max'];?>,
									min: <?php echo$this->rowProduct['product_width_min'];?>,
									change: function(event, ui) {
										currentValue.val(ui.value);
										changeSize();
									}
									<?php if( $this->rowProduct['product_width_def_only'] == 1 ){
										echo',
											slide: function(event, ui) {
												return $.inArray(ui.value, valMap) != -1;
											}';
									} ?>
								});	
							});
							
							$('[name="input_width"]').change(function(){
								if( $(this).val() < <?php echo$this->rowProduct['product_width_min'];?> ){
									$(this).val(<?php echo$this->rowProduct['product_width_min'];?>);
								}
								if( $(this).val() > <?php echo$this->rowProduct['product_width_max'];?> ){
									$(this).val(<?php echo$this->rowProduct['product_width_max'];?>);
								}
								$("#product_width").slider( "value", $(this).val() );
							});
							
							$(function(){		
								var currentValue = $('[name="input_depth"]');
								
								<?php if( $this->rowProduct['product_depth_def_only'] == 1 ){
									$valMap = '';
									foreach ( $this->ProductDepth as $key => $val ):
										$valMap = $valMap.$val['product_depth_value'].',';
									endforeach;
									echo'var valMap = ['.$valMap.'];';
								} ?>
								
								$("#product_depth").slider({ 
									value: <?php echo isset($this->dataSelect['product_depth'])?$this->dataSelect['product_depth']:$this->rowProduct['product_depth_default'];?>,
									max: <?php echo$this->rowProduct['product_depth_max'];?>,
									min: <?php echo$this->rowProduct['product_depth_min'];?>,
									change: function(event, ui) {
										currentValue.val(ui.value);
										changeSize();
									}
									<?php if( $this->rowProduct['product_depth_def_only'] == 1 ){
										echo',
											slide: function(event, ui) {
												return $.inArray(ui.value, valMap) != -1;
											}';
									} ?>
								});	
							});
							
							$('[name="input_depth"]').change(function(){
								if( $(this).val() < <?php echo$this->rowProduct['product_depth_min'];?> ){
									$(this).val(<?php echo$this->rowProduct['product_depth_min'];?>);
								}
								if( $(this).val() > <?php echo$this->rowProduct['product_depth_max'];?> ){
									$(this).val(<?php echo$this->rowProduct['product_depth_max'];?>);
								}
								$("#product_depth").slider( "value", $(this).val() );
							});
							
							
							
							$('#wysokoscHover, #wysokoscHover2').hover(function(){
								$('.wizualizacja').hide();
								$('#wysokosc').show();
							});
							
							$('#szerokoscHover, #szerokoscHover2').hover(function(){
								$('.wizualizacja').hide();
								$('#szerokosc').show();
							});
							
							$('#glebokoscHover, #glebokoscHover2').hover(function(){
								$('.wizualizacja').hide();
								$('#glebokosc').show();
							});
							
							
							$('[name="input_depth"], [name="input_height"], [name="input_depth"]').change(function(){
								changeSize();
							});
							
							
							
							
							
							
							
							
							
							changeSize();
							
						});

					</script>	
				
				
				
				
				
				
				
				
				
				
				
				
				
				
				
				
				
				
				
				
				
				
				
				
				
				
				</div>
				
				
				
				<?php
				
					$box = $this->panelBox;
					
					if( count($box) > 1 ){ 
				
				?>			


<script type="text/javascript" language="javascript">
	
	$(document).ready(function () {		
	
		var box = [<?php $iBox = 0;
				foreach( $box as $key => $val ){
					$iBox++;
					if( count($box)!=$iBox ) echo'"'.$val.'",';
					else  echo'"'.$val.'"';
				}
			?>];
		var boxMax = <?php echo count($box)-1; ?>;
		$('#nextBoxButton').attr('actual',box[0]);
		$('#nextBoxButton').attr('actualid',0);
	
		$('#nextBoxButton').click(function(){
		
			var actual = $(this).attr('actual');
			var actualid = parseInt($(this).attr('actualid'));
			
			if( actualid+1 <= boxMax ){
				$('#nextBoxButton').attr('actual',box[actualid+1]);
				$('#nextBoxButton').attr('actualid',actualid+1);
				$(".configuratorDivElement").hide();
				$(".configuratorMenuElement").removeClass('active');
				$("[data-field='"+box[actualid+1]+"']").addClass('active');
				$("#"+box[actualid+1]).show();
				
                $('html, body').animate({
					scrollTop: $(".configuratorBox").offset().top
				}, 500);
			}else{
				
                $('html, body').animate({
					scrollTop: $("#shopProductTable").offset().top
				}, 200, function(){
					$(".priceConf, .amountConf, .addConf").css('color','red');
					$("#shopProduct").effect( "pulsate", {times:1}, 500 );
				
				});			
			}
		
		});
	
	});

</script>		
				<table width="100%"><tr><td>
				<div class="row text-right">
				<br />
				<div id="nextBox">
					<button id="nextBoxButton"><?php echo @Lib_Lang::translate(front_configurator_next); ?></button>
				</div>
				
				</div>
				</td></tr></table>
				<?php
				
					}
					
				?>
				
				
				
				
			</div>
			
			
			
			
			
			
			
			
			
			
			
		
		
		</div>
	</div>
	
	
	


	<div class="row">
		<div class="col-xs-12">

	<?php if( count($this->dataLinked) > 0 ){ ?>	
	
		<h3><?php echo @Lib_Lang::translate(front_configurator_product_linked); ?></h3>
				
		<?php foreach ($this->dataLinked as $key => $val): ?>
		
	<a href="<?php echo @$this->url(array('controller' => 'product', 'action' => 'index', 'id' => $val['product_id'], 'productname' => Lib_Link::getLinkName(@Lib_Lang::consta(product_name_.$val['product_id']))), 'product', true); ?>" class="categoryLink">
		<div class="col-sm-3 col-xs-4">
		
		<?php /*
			<div class="boxCategory">
				<div class="row text-center categoryPhoto" <?php if( $val['product_image'] ){ ?>style="background-image: url('<?php echo $this->escape($this->baseUrl); ?>/public/uploads/product/<?php echo$val['product_image']; ?>.jpeg');"<?php } ?>></div>
				<div class="row text-center" style="padding-left:20px;padding-right:20px;">
				<?php echo @Lib_Lang::consta(product_name_.$val['product_id']); ?>
				</div>
			</div>
		*/ ?>	
			
			<div class="boxCategoryV2">
				<?php if( $val['product_image'] ){ ?><img src="<?php echo $this->escape($this->baseUrl); ?>/public/uploads/product/<?php echo$val['product_image']; ?>.jpeg" /><?php }else{ ?>
				<img src="<?php echo $this->escape($this->baseUrl); ?>/public/nf.png" />
				<?php } ?>
				<p><?php echo @Lib_Lang::consta(product_name_.$val['product_id']); ?></p>
			</div>
		</div>
	</a>
		
		<?php endforeach; ?>	
		
	<?php } ?>		
		
		</div>
	</div>
	
	
</div>
</div>












<?php echo $this->render('module/footer_mobi.phtml'); ?>

