@extends('layouts/main')
@section('breadcrumbs')
	{!! Breadcrumbs::render('routines', 'create', $training, null) !!}
@endsection
@section('content')
	<h1>Nueva rutina <small>Entrenamiento: {{$training->name}}</small></h1>
	<div class="col-md-12">
		<div id="form-routine" class="panel panel-default">
			<div class="panel-body">
				{!! Form::open(['route' => ['trainings.routines.store', $training->id], 'id' => 'form-routines']) !!}
					<div class="form-group">
						{!! Form::label('name', 'Nombre de la rutina:') !!}	
						{!! Form::text('name', null, ['class' => 'form-control', 'placeholder' => 'Escribe el nombre de la rutina', 'required' => 'required']) !!}
					</div>
					<div class="form-group">
						{!! Form::label('description', 'Descripción de la rutina:') !!}	
						{!! Form::text('description', null, ['class' => 'form-control', 'placeholder' => 'Escribe una breve descripción de la rutina', 'required' => 'required']) !!}
					</div>
					<div class="form-group">
						{!! Form::label('long_description', 'Descripción detallada de la rutina:') !!}	
						{!! Form::textarea('long_description', null, ['class' => 'form-control', 'placeholder' => 'Escribe una descripción detallada de la rutina', 'required' => 'required','rows' => 3]) !!}
					</div>
					<div class="form-group">
						{!! Form::label('recomendaciones', 'Recomendaciones de la rutina:') !!}	
						{!! Form::textarea('recomendaciones', null, ['class' => 'form-control', 'placeholder' => 'Escribe recomendaciones para la rutina', 'required' => 'required','rows' => 3]) !!}
					</div>
					<div class="form-group">
						{!! Form::label('tagline', 'Frase corta:') !!}	
						{!! Form::text('tagline', null, ['class' => 'form-control', 'placeholder' => 'Escribe el tagline', 'required' => 'required']) !!}
					</div>
					<div class="form-group">
						{!! Form::label('training_condition_id', 'Condiciones de entrenamiento:') !!}	
						{!!  Form::select('training_condition_id', $training_conditions, null, ['placeholder' => 'Selecciona las condiciones del entrenamiento...', 'class' => 'form-control', 'required'=>'required']); !!}
					</div>
					{!! Form::hidden('exercises', null, ['required' => 'required']) !!}	
					<div class="panel panel-success">
						<div class="panel-heading">
							<h3 class="panel-title">Ejercicios</h3>
						</div>
					  <div class="panel-body">
							<div class="col-md-6">
								<div class="form-group">
									{!! Form::label('ejercicio', 'Ejercicio:') !!}	
									{!!  Form::select('ejercicio', $exercises, null, ['placeholder' => 'Selecciona el ejercicio...', 'class' => 'form-control', ]); !!}
								</div>
								<div class="form-group">
									{!! Form::label('indicaciones', 'Indicaciones:') !!}	
									{!! Form::text('indicaciones', null, ['class' => 'form-control','placeholder' => 'Escribe las indicaciones para este ejercicio', ]) !!}
								</div>
								<div class="form-group">
									{!! Form::label('repeticiones', 'Repeticiones:') !!}
									{!! Form::number('repeticiones', 0, ["class" => "form-control"]) !!}	
								</div>	
								<div class="form-group">
									{!! Form::label('rest_time', 'Tiempo de descanso:') !!}	
									{!! Form::select('rest_time', ['0-0.5'=>'De 0 a 30 seg', "0.5-1.5" =>"De 30 seg a 1:30 min", "1.5-2" => "De 1:30 min a  2 min", "2-4" => "De 2 min a 4 min"], null, ['placeholder' => 'Selecciona el tiempo de descanso...', 'class' => 'form-control']); !!}
								</div>
								<a id="add_exercise" class="btn btn-block btn-info">Agregar ejercicio</a>
							</div>
							<div class="col-md-6">
								<table class="table">
									<thead>
										<tr class="text-center">
											<th>#</th>
											<th>Ejercicio</th>
											<th>Indicaciones</th>
											<th>Reps</th>
											<th>Tiempo de descanso</th>	
										</tr>	
									</thead>
									<tbody id="table_add_exercise">
										<tr class="text-center">
											<td colspan="5">No hay ejercicios registrados en esta rutina</td>
										</tr>	
									</tbody>	
								</table>	
							</div>
						</div>
					</div>
					<div class="pull-right">
						<a class="btn btn-danger" href="{{route('trainings.show',[$training->id])}}">Cancelar</a>
						<a id="add_routine_submit" class="btn btn-primary">Guardar</a>
					</div>	
				{!! Form::close() !!}
			</div>
		</div>
	</div>
@endsection
@section('scripts')
<script type="text/javascript">
	$(document).ready(function(){
		var gral_exercises = []
		$('#add_exercise').click(function(){
			var str = "";
			var ejercicio_id = $('#ejercicio').val();
			var ejercicio = $("#ejercicio option:selected").text();
			var indicaciones = $('#indicaciones').val();
			var repeticiones = $('#repeticiones').val();
			var resttime = $('#rest_time').val();
			var position = gral_exercises.length + 1;

			gral_exercises.push({ejercicio_id: ejercicio_id, ejercicio_name: ejercicio, indicaciones:indicaciones, repeticiones: repeticiones ,resttime: resttime, position: position});

			$.each(gral_exercises, function(key, value) {
			  str += "<tr> <td>" + (key+1) + "</td> <td>"+value['ejercicio_name']+"</td> <td>"+value['indicaciones']+"</td> <td>"+ value['repeticiones'] +"</td> <td>"+value['resttime']+"</td> </tr>";
			  console.log(value['position']);
			});
			//Fill table
			$('#table_add_exercise').html('');
			$('#table_add_exercise').append(str);
			//Clear inputs
			$('#ejercicio').val("");
			$('#indicaciones').val("");
			$('#repeticiones').val("");
			$('#rest_time').val("");
		});
		$('#add_routine_submit').click(function(){
			$('input[name="exercises"]').val(JSON.stringify(gral_exercises));
			$('#form-routines').submit();
		});
	});
</script>
@endsection