@extends('layout')
@section('css') 
@parent
{{ HTML::style('css/slideshow.css') }} 
@stop
@section('content')
<div id="intro" class="hide-for-small">
    <div id="introLogo">
        <img src="img/logointro.png" />
        <div id="scrollToContent"><span><img src="img/arrow_entr.png" /></span></div>
    </div>
</div>

<div class="angContainer" ng-cloak ng-app="app" ng-controller="girlCtrl">
<div class="row">
    <div class="small-12 columns">
        <div class="diverlineTop"></div>
        @if($preview)
        <h2 class="htag">Vorschau</h2>
        @else
        <h2 class="htag">Our Girls</h2>
        <div class="diverlineBottom">
	     <a href="/"><img src="img/line.png" /></a>
        </div>

        @endif
        <div class="diverlineBottom"></div>
        <ul class="large-block-grid-5 small-block-grid-2">
            @foreach($schedule as $s)
            <li ng-click="setVisible({{$s->girl->id}})">
                <div class="girl" ng-class="{active: isVisible({{$s->girl->id}})}">
                    <div class="girl_bound">
                        @if($s->checkin_time > Carbon::now())
                        <span class="arrivalDate">Ab: {{ $s->checkin_time->format('d.m') }}</span>
                        @endif
                        
                        <div class="thumb rad3 girlpremium">
                            
                                <img alt="escort Carla" src="thumbs/{{$s->girl->album->id}}/cover_{{$s->girl->album->cover}}_thumb.jpg" class="rad3">
                            
                            <span class="labels">
                                @if($s->girl->is_new === 'yes')
                                <span class="verified"><b class="rad3">new</b></span>
                                @endif
                                @if($preview === 'nutjob')
                                <span class="arrivalDate"><b>Ab {{ $s->checkin_time->format('d.m') }}</b></span>
                                @endif
                            </span> 
                        </div>
                        </a>
 
					
                        
                      
                    </div>
                    
                </div>
                <div class="namePosition">
                <a title="{{$s->girl->public_name}}" href="#girl_{{$s->girl->id}}" class="goToGirl" data-girl_id="{{$s->girl->id}}">{{$s->girl->public_name}}</a>
					</div>
            </li>
            
            @endforeach
        </ul>
    </div>
</div>

						 <div class="row">
						 <div class="small-12 columns">
						<ul class="large-block-grid-5 small-block-grid-2">
						@foreach($schedule as $s)
						<li ng-click="setVisible({{$s->girl->id}})">
							<div ng-class="{active: isVisible({{$s->girl->id}})}">
						@if($s->checkin_time > Carbon::now())
						<span class="arrivalDate">Ab: {{ $s->checkin_time->format('d.m') }}</span>
                        @endif

                        <div class="clear"></div>
							</div>
						</li>
						
@endforeach

						</ul>
						 </div>
						 </
<div class="row">
    @foreach($schedule as $s)
    <article class="small-12 columns girlBox animate-show" ng-show="isVisible({{$s->girl->id}})">
        <h2 id="girl_{{$s->girl->id}}" class="girlHeader">{{$s->girl->public_name}}</h2>
        <div class="row">
            <div class="small-12 large-6 columns">
                <div class="panel">
                    <!-- main image -->
                    <div class="imageBox_{{$s->girl->id}}">
                        <a class="girlLink" href="{{ URL::to('albums/'.$s->girl->album->id.'/'.$s->girl->album->cover.'.jpg')}}"><img src="{{ URL::to('albums/'.$s->girl->album->id.'/'.$s->girl->album->cover.'.jpg')}}" /></a>
                    </div>
                    <ul class="small-block-grid-5">
                        <!-- thumbnails -->
                        @foreach($s->girl->photos as $photo)
                        <li data-girl_id="{{$s->girl->id}}"><a href="{{ URL::to('albums/'.$s->girl->album->id.'/'.$photo->id.'.jpg')}}" class="girlLink"><img src="{{URL::to('thumbs/'.$s->girl->album->id.'/tmb_'.$photo->id.'_thumb.jpg')}}" /></a></li>
                        @endforeach
                    </ul>
                </div>
            </div>
            <div class="small-12 large-6 columns">
                <div class="girlColumn">
                <h6>Meine Daten:</h6>
                <ul class="small-block-grid-2 girlData">
                    <li>Alter:</li>
                    <li>{{$s->girl->girldetail->age}}</li>
                    <li>Konfektion:</li>
                    <li>{{$s->girl->girldetail->clothingsize}}</li>
                    <li>Oberweite:</li>
                    <li>{{$s->girl->girldetail->brasize}}</li>
                    <li>Intim:</li>
                    <li>{{$s->girl->girldetail->pussy}}</li>
                    <li>Gr&ouml;&szlig;e:</li>
                    <li>{{$s->girl->girldetail->height}}cm</li>
                    <li>Gewicht:</li>
                    <li>{{$s->girl->girldetail->weight}}Kg</li>
                    <li>Schuhgr&ouml;&szlig;e:</li>
                    <li>{{$s->girl->girldetail->shoesize}}</li>
                </ul>
                <h6>Diesen Service biete ich</h6>
                <ul class="small-block-grid-2 girlService">
                    <!-- services -->
                    @foreach($s->girl->services as $service)
                    <li>{{$service->service_name}}</li>
                    @endforeach
                </ul>
                @if(!$s->girl->languages->isEmpty())
                <h6>Sprachen</h6>
                <ul class="small-block-grid-2 girlService">
                    <!-- languages -->
                    @foreach($s->girl->languages as $lang)
                    <li>{{$lang->lang_name}}</li>
                    @endforeach
                </ul>
                </div>
                @endif
            </div>
        </div>
    </article>
    @endforeach
</div>
</div>
</div>
<!-- hidden picture modal -->
    <div id="showPicture">
        <div class="row">
            <div class="small-12 columns"><a class="right closeModal">X</a></div>
            <a class="prevPic"><span></span></a>
            <a class="nextPic"><span></span></a>
            <div class="small-12 columns" id="pictureContent">
            </div>
        </div>
    </div>
@stop

@section('js')
@parent
{{ HTML::script('js/slideshow.js') }}
{{ HTML::script('//ajax.googleapis.com/ajax/libs/angularjs/1.4.0/angular.min.js') }}
{{ HTML::script('//ajax.googleapis.com/ajax/libs/angularjs/1.4.0/angular-animate.js') }}

<script type="text/javascript">
    angular.module('app',['ngAnimate'])
        .controller('girlCtrl', girlCtrl);
        function girlCtrl($scope){
            $scope.visible = 0;
            $scope.setVisible = function(id){
                //console.log(id);
                $scope.visible = id;
            }
            $scope.isVisible = function(id){
                return $scope.visible === id;
            }
        }
</script>
@stop