@extends('layouts.frontend')

@section('title')
	@lang('frontend.titles.welcome_to')
@endsection

@section('content')
<section id="inicio">
	<!-- FONDOS -->
	<ul id="bg">
		<li><img src="{{asset('assets/img/bgs/bg1.jpg')}}" /></li>
	</ul>
	<!-- BARRA usuario -->
	<div id="barra_usuario">
		<div class="pad">
			<a href="#" class="logo"><img src="{{asset('assets/img/logo.png')}}" /></a>
			<p>
				<span class="bienvenido hidden">@lang('frontend.titles.hello'):</span>

				<a class="hidden_" href="#"><span class="nombre profile" data-page-name="perfil" data-route="{{route('profiles.profile')}}">{{Auth::guard('web_user')->user()->name}} {{Auth::guard('web_user')->user()->last_name}} |</span></a>
				{{--<a href="#"><span class="nombre message" data-page-name="messages" data-route="{{route('threads.index')}}">
                        @lang('frontend.buttons.messages')(<span id="count">{{Auth::guard('web_user')->user()->threadsWithNewMessages()}}</span>) |</span></a>
                        --}}
				<a href="{{url('logout')}}"><span class="nombre">@lang('frontend.buttons.logout')</span></a>
				{{--@if(App::getLocale() == 'en')
					<a href="{{route('app.lang', 'es')}}"><span class="nombre">Es</span></a>
				@elseif(App::getLocale() == 'es')
					<a href="{{route('app.lang', 'en')}}"><span class="nombre">En</span></a>
				@endif--}}
			</p>
		</div>
	</div>

	@include('frontend.controls')
	<!-- Contenido que se abrirán en div #modulos -->
	@include('frontend.content.courses')
	@include('frontend.content.profile')
	@include('frontend.content.history')
	@include('frontend.content.calendar')
	@include('frontend.content.awards')
	@include('frontend.content.news')
	@include('frontend.content.modals.evaluation')
	@include('frontend.content.modals.message')
	@include('frontend.partials.front_routes')
    @include('frontend.content.messages')
	@include('frontend.content.coursesView')

	@include('frontend.partials.robot')
		
	<!-- CONTENIDO PRINCIPAL -->
	<div id="principal">
		<!-- DIV donde se agregan los modulos nuevos (con JS) -->
		<div id="modulos">&nbsp;</div><!-- #modulos -->

		<!-- Ejemplo de modulo generico (lo uso para tomarlo de plantilla en JS) -->
		<div id="ejemplo_modulo" style="display:none;"	>
			<div class="modulo">
				<a href="#" class="cerrar">@lang('frontend.buttons.close')</a>
				<div class="pad">
					<section>
						<div class="heading">
							<div class="pad">
								<div class="der">

								</div>
								<h1>Módulo genérico</h1>
							</div>
						</div>

						<div class="mod-contenido">
							<div class="norm">
								<div class="pad">

								</div>
							</div><!-- .norm -->
						</div><!-- .mod-contenido -->
					</section>
				</div>
			</div><!-- .modulo -->
		</div><!-- .modulo -->

		<!-- DIV donde se agregan los cursos nuevos (con JS) -->
		<div id="cursos">&nbsp;</div><!-- #modulos -->

		<!-- Ejemplo generico de visor de curso -->
		<div id="ejemplo_curso" style="display: block;">
			<div class="visor">

				<nav class="navbar navbar-inverse navbar-fixed-top" id="sidebar-wrapper" role="navigation" onClick="menu_sidebar();">
					<ul class="nav sidebar-nav">
						<li class="sidebar-brand">
							<a href="#">
								@lang('frontend.navbar.title')
							</a>
						</li>
						<li>
							<a href="#" onclick="return false;">@lang('frontend.messages.loading')</a>
						</li>
						{{--
						<li>
							<a href="#" data-Chapter="27" onClick="goToSlide(27)" >Introducci&oacute;n</a>
						</li>
						<li>
							<a href="#" data-chapter="28" onClick="goToSlide(28)">Peat&oacute;n</a>
						</li>
						<li>
							<a href="#" data-chapter="31" onClick="goToSlide(31)">Evaluaci&oacute;n</a>
						</li>
						<li>
							<a href="#" data-chapter="30" onClick="goToSlide(30)">Ciclista</a>
						</li>
						<li>
							<a href="#" data-chapter="32" onClick="goToSlide(32)">Evaluaci&oacute;n</a>
						</li>
						<li>
							<a href="#" data-chapter="29" onClick="goToSlide(29)">Conductor</a>
						</li>
						<li>
							<a href="#" data-chapter="33" onClick="goToSlide(33)">Evaluaci&oacute;n</a>
						</li>
						--}}
					</ul>
				</nav>
				<div class="top">
					<div class="izq">
						<div class="izq">
						<button type="button" class="hamburger is-closed" data-toggle="offcanvas" onClick="menu_sidebar()">
							<span class="hamb-top"></span>
							<span class="hamb-middle"></span>
							<span class="hamb-bottom"></span>
						</button>
						</div>
						<div class="der nomb">
						</div>
					</div>
					<div class="der scc">
						<span class="icon-remove icon-op cerrar"> </span>
					</div>
				</div>

				<div class="bottom">
					<div class="izq">
						<span class="">Cambiar idioma: <a href="{!! url('language/es') !!}">Español</a> | <a href="{!! url('language/en') !!}">Ingles</a> </span>
					</div>
					<div class="der">
						<span class="icon-caret-left icon-op prev"> </span>
						<span class="icon-caret-right icon-op next"> </span>
					</div>
				</div>
			</div>
		</div>
		<img src="{{asset('assets/img/gears_small.svg')}}" class="hidden">
		<img src="{{asset('assets/img/gears.svg')}}" class="hidden">
		<audio id="successA" preload="auto">
			<source src="{{asset('assets/audio/succes1.ogg')}}" type="audio/ogg">
			<source src="{{asset('assets/audio/succes1.mp3')}}" type="audio/mpeg">
		</audio>
		<audio id="successB" preload="auto">
			<source src="{{asset('assets/audio/succes2.ogg')}}" type="audio/ogg">
			<source src="{{asset('assets/audio/succes2.mp3')}}" type="audio/mpeg">
		</audio>
		<audio id="failA" preload="auto">
			<source src="{{asset('assets/audio/fail.ogg')}}" type="audio/ogg">
			<source src="{{asset('assets/audio/fail.mp3')}}" type="audio/mpeg">
		</audio>
		<!-- div para cargar las evaluaciones
		<div id="evaluation">&nbsp;</div>
		include('frontend.content.evaluation')-->
    <div class="clearfix"></div>
	</div><!-- #principal -->

    <div class="clearfix"></div>
</section><!-- #inicio -->
	<script>
        var name = '{{Auth::guard('web_user')->user()->name}}';
        var last_name = '{{Auth::guard('web_user')->user()->last_name}}';
        var succes1 = document.getElementById('successA');
        var succes2 = document.getElementById('successB');
        var fail_ = document.getElementById('failA');
	</script>
@endsection