@extends('layout.basic_front')

@section("content")


</br></br></br></br></br></br></br>
            
        <div id="content" role="main">
                         
                 <div class="tp-caption rev-subtitle subtitle_text" style="z-index: 10;text-align:center;width:100%;">
                    <h2 class="title-underblock custom text-uppercase text-center">{{trans("products.title")}}</h2>
                </div>                     
                    <img id="title_img" style ="width:100%;height:100px;" src="{{asset('images/imgs/background.jpg')}}">
          
        </div><!-- End .page-header -->    

            <div>

                <div class="raw" style="align:center;background-color:#fff;">
                    <ul class="footer-menu" style=" text-align:center;color:black;padding:5px;">
                        @if($langset == 'tw')
                            @foreach($categories as $category)
                            <li><a href="{{URL::to('front/products/'.$category->id)}}" style="color:#303030;">{{$category->name_tw}}</a></li>
                            @endforeach
                        @else
                            @foreach($categories as $category)
                            <li><a href="{{URL::to('front/products/'.$category->id)}}" style="color:#303030;">{{$category->name}}</a></li>
                            @endforeach                       
                        @endif
                    </ul>
                </div>
                @if(!empty($productinfo))
                    {{ HTML::image($productinfo[2],"",['class'=>'image', 'style'=>'width:100%;height:100%;', 'id'=>'priview']) }}
                @else
                    <img style ="width:100%;height:100%;" src="{{asset('images/imgs/Product/product1.jpg')}}">
                @endif
            </div><!-- End #revslider-container -->
            
            
            <!--products list -->
                        @foreach($products as $product)
		<!--如果沒有圖片的話-->
		@if(isset($productimgs[$product->id])) 

                <div class="row" style="width:100%; margin:0;">
                @if($count %2 == 0)
                 <hr class="product_hr">
                    <div class="col-xs-12 col-md-8 col-md-push-4 div_products" style = "height:100%;">

                        <div id="project-gallery-{{$count}}" class="portfolio-media carousel slide" data-ride="carousel" data-interval="7000" style="margin-top: 10%;">

                        <ol class="carousel-indicators" style="bottom:-10%;">
                            <li data-target="#project-gallery-{{$count}}" data-slide-to="0" class="active" style="border-color:#000;">1</li>
                        @for($c =1 ; $c < count($productimgs[$product->id]); $c++)
                            <li data-target="#project-gallery-{{$count}}" data-slide-to="{{$c}}" style="border-color:#000;">{{$c+1}}</li>
                        @endfor
                        </ol>    

                            <!-- Wrapper for slides -->
                        <div class="carousel-inner displayed" >                                                
                            @if(!empty($productimgs))
                                    <div class="item active">
                                        {{ HTML::image($productimgs[$product->id][0],"",['class'=>'image', 'id'=>'priview_slide_img']) }}
                                    </div><!-- End .item -->                                            
                                @for($c =1 ; $c < count($productimgs[$product->id]); $c++)
                                    <div class="item">
                                        {{ HTML::image($productimgs[$product->id][$c],"",['class'=>'image', 'id'=>'priview_slide_img']) }}
                                    </div><!-- End .item -->
                                @endfor                             
                            @else                                    
                                    <div class="item active">
                                        <img src="{{asset('images/imgs/Product/product2.jpg')}}" alt="GENGHUNG">
                                    </div><!-- End .item -->

                                    <div class="item">
                                        <img src="{{asset('images/imgs/Product/product2.jpg')}}" alt="GENGHUNG">
                                    </div><!-- End .item -->

                                    <div class="item">
                                        <img src="{{asset('images/imgs/Product/product2.jpg')}}" alt="GENGHUNG">
                                    </div><!-- End .item -->
                            @endif     
                        </div><!-- End .carousel-inner -->                                               

                            <!-- Controls -->
                            <!--a class="left carousel-control" href="#project-gallery" role="button" data-slide="prev"><i class="fa fa-angle-left"></i></a>
                            <a class="right carousel-control" href="#project-gallery" role="button" data-slide="next"><i class="fa fa-angle-right"></i></a-->
                        </div><!-- End .carousel -->
                    </div><!-- End .col-md-8 -->

                   <div class="col-xs-12 col-md-4 col-md-pull-8 div_products" style="background-color:#00739B;overflow: auto;">
                        <div class="portfolio-details">
                        </br>
                            @if(!empty($product))
                                    @if(Session::get('set_lang')=='tw')
                                        <ul class="portfolio-details-list" style="color:#fff; padding-right:10%">
                                            <h2 class="title-underline" style="color:white;">{{$product->title_tw}}</h2>
                                            <span style="color:white">{{$product->description_tw}}</span>
                                        </ul>                    
                                    @else
                                        <ul class="portfolio-details-list" style="color:#fff; padding-right:10%">
                                            <h2 class="title-underline" style="color:white;">{{$product->title_en}}</h2>
                                            <span style="color:white">{{$product->description_en}}</span>
                                        </ul>                          
                                    @endif    
                            @else                        
                                        <ul class="portfolio-details-list" style="color:#fff; padding-right:10%">
                                            <h2 class="title-underline" style="color:white;">Trainer function</h2>
                                            <li><span style="color:white">Loading weight 45kg</span></li>
                                            <li><span style="color:white">Frame/front fork: Enhanced plastic P.P, all in one</span></li>
                                            <li><span style="color:white ">Detachable and adjustable seat height 44-33cm, breathing and vibration-proof cushion</span></li>
                                            <li><span style="color:white">Tyres: Air tire </span></li>
                                            <li><span style="color:white">Certificate: EN71 </span></li>
                                            <li><span style="color:white">Weigh 4kg </span></li>                                
                                        </ul>
                            @endif
                        </div><!-- End .portfolio-details -->
                        
                    </div><!-- End .col-md-4 -->

                @else
		    @if($count > 1)
                 	<hr class="product_hr">
		    @endif
                    <div class="col-md-8 div_products" style = "height:100%;">

                        <div id="project-gallery-{{$count}}" class="portfolio-media carousel slide" data-ride="carousel" data-interval="7000" style="margin-top: 10%;">

                        <ol class="carousel-indicators" style="bottom:-10%;">
                            <li data-target="#project-gallery-{{$count}}" data-slide-to="0" class="active" style="border-color:#000;">1</li>
                        @for($c =1 ; $c < count($productimgs[$product->id]); $c++)
                            <li data-target="#project-gallery-{{$count}}" data-slide-to="{{$c}}" style="border-color:#000;">{{$c+1}}</li>
                        @endfor
                        </ol>    

                            <!-- Wrapper for slides -->
                        <div class="carousel-inner displayed" >                                                
                            @if(!empty($productimgs))
                                    <div class="item active">
                                        {{ HTML::image($productimgs[$product->id][0],"",['class'=>'image', 'id'=>'priview_slide_img']) }}
                                    </div><!-- End .item -->                                            
                                @for($c =1 ; $c < count($productimgs[$product->id]); $c++)
                                    <div class="item">
                                        {{ HTML::image($productimgs[$product->id][$c],"",['class'=>'image', 'id'=>'priview_slide_img']) }}
                                    </div><!-- End .item -->
                                @endfor                             
                            @else                                    
                                    <div class="item active">
                                        <img src="{{asset('images/imgs/Product/product2.jpg')}}" alt="GENGHUNG">
                                    </div><!-- End .item -->

                                    <div class="item">
                                        <img src="{{asset('images/imgs/Product/product2.jpg')}}" alt="GENGHUNG">
                                    </div><!-- End .item -->

                                    <div class="item">
                                        <img src="{{asset('images/imgs/Product/product2.jpg')}}" alt="GENGHUNG">
                                    </div><!-- End .item -->
                            @endif     
                        </div><!-- End .carousel-inner -->                                               

                            <!-- Controls -->
                            <!--a class="left carousel-control" href="#project-gallery" role="button" data-slide="prev"><i class="fa fa-angle-left"></i></a>
                            <a class="right carousel-control" href="#project-gallery" role="button" data-slide="next"><i class="fa fa-angle-right"></i></a-->
                        </div><!-- End .carousel -->
                    </div><!-- End .col-md-8 -->

                    <div class="col-md-4 div_products" style="background-color:#00739B;overflow: auto;">
                        <div class="portfolio-details">
                        </br>
                            @if(!empty($product))
                                    @if(Session::get('set_lang')=='tw')
                                        <ul class="portfolio-details-list" style="color:#fff; padding-right:10%">
                                            <h2 class="title-underline" style="color:white;">{{$product->title_tw}}</h2>
                                            <span style="color:white">{{$product->description_tw}}</span>
                                        </ul>                    
                                    @else
                                        <ul class="portfolio-details-list" style="color:#fff; padding-right:10%">
                                            <h2 class="title-underline" style="color:white;">{{$product->title_en}}</h2>
                                            <span style="color:white">{{$product->description_en}}</span>
                                        </ul>                          
                                    @endif    
                            @else                        
                                        <ul class="portfolio-details-list" style="color:#fff; padding-right:10%">
                                            <h2 class="title-underline" style="color:white;">Trainer function</h2>
                                            <li><span style="color:white">Loading weight 45kg</span></li>
                                            <li><span style="color:white">Frame/front fork: Enhanced plastic P.P, all in one</span></li>
                                            <li><span style="color:white ">Detachable and adjustable seat height 44-33cm, breathing and vibration-proof cushion</span></li>
                                            <li><span style="color:white">Tyres: Air tire </span></li>
                                            <li><span style="color:white">Certificate: EN71 </span></li>
                                            <li><span style="color:white">Weigh 4kg </span></li>                                
                                        </ul>
                            @endif
                        </div><!-- End .portfolio-details -->
                        
                    </div><!-- End .col-md-4 -->
                @endif
                </div><!-- End .row -->
                        		@endif 
		<!--end img count-->
            @endforeach


@stop