<%@page import="Modelo.CodConcepto"%>
<%@page import="Modelo.CodTipoEjercicio"%>
<%@page import="Modelo.CodCategoriaEjercicio"%>
<%@page import="java.util.ArrayList"%>
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<% if (request.getSession().getAttribute("usuario") == null) {%>
<%@ include file="/includes/login.jsp" %>
<% } else {%> 
<%@ include file="/includes/header.jsp" %>
<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1.0, user-scalable=no">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="msapplication-tap-highlight" content="no">
  <title>Bappsket</title>


  <!-- CORE CSS-->
  <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
  <link href="css/materialize.min.css" type="text/css" rel="stylesheet" media="screen,projection">
  <link href="css/style.css" type="text/css" rel="stylesheet" media="screen,projection">
    <!-- Custome CSS-->    
<!--  <link href="css/page-center.css" type="text/css" rel="stylesheet" media="screen,projection">-->
  
</head>

<body>
<div id="registro-page" class="row">
    <form action="crearEjercicio2" method="post">
        <div class="row margin">
            <br>
            <br>
        </div>
        <div class="row margin">
            <div class="input-field col s2">
                <input id="nombre_ejercicio" name="nombre_ejercicio" type="text">
                <label for="nombre_ejercicio" class="center-align">Nombre del ejercicio:</label>
            </div>
        </div>
        <div class="row margin">
            <div class="input-field col s6">
                <textarea id="descripcion_ejercicio" name="descripcion_ejercicio" class="materialize-textarea"></textarea>
                <label for="descripcion_ejercicio">Descripción del ejercicio:</label>
            </div>
        </div>
        <div class="row margin">
            <div class="input-field col s4">
                <select name="categoria_ejercicio" id="categoria_ejercicio">
                    <option value="" disabled selected>Seleccione una categoria</option>
                    <% for (CodCategoriaEjercicio cce : (ArrayList<CodCategoriaEjercicio>) request.getAttribute("categorias")) {
                                request.setAttribute("cce", cce);
                    %>
                        <option value="${cce.cod_categoria_ejer}">${cce.descripcion_categoria_ejer}</option>
                    <%}%>
                </select>
                <label>Selecciona una categoria :</label>
            </div>
        </div>
        <div class="row margin">
            <div class="input-field col s4">
                <select name="concepto1" id="concepto1">
                    <option value="" disabled selected>Seleccione un concepto</option>
                    <% for (CodConcepto ce1 : (ArrayList<CodConcepto>) request.getAttribute("conceptos")) {
                            request.setAttribute("ce1", ce1);
                        %>
                        <option value="${ce1.cod_concepto}">${ce1.descripcion_concepto}</option>
                        <%}%>
                </select>
                <label>Selecciona un concepto:</label>
            </div>
            <div class="input-field col s4">
                <select name="concepto2" id="concepto2">
                    <option value="" disabled selected>Seleccione un concepto</option>
                    <% for (CodConcepto ce2 : (ArrayList<CodConcepto>) request.getAttribute("conceptos")) {
                            request.setAttribute("ce2", ce2);
                        %>
                        <option value="${ce2.cod_concepto}">${ce2.descripcion_concepto}</option>
                        <%}%>
                </select>
                <label>Selecciona un cocnepto:</label>
            </div>
            <div class="input-field col s4">
                <select name="concepto3" id="concepto3">
                    <option value="" disabled selected>Seleccione un concepto</option>
                    <% for (CodConcepto ce3 : (ArrayList<CodConcepto>) request.getAttribute("conceptos")) {
                            request.setAttribute("ce3", ce3);
                        %>
                        <option value="${ce3.cod_concepto}">${ce3.descripcion_concepto}</option>
                        <%}%>
                </select>
                <label>Selecciona un cocnepto :</label>
            </div>
        </div>
        <div class="row margin">
            <div class="input-field col s4">
                <select name="tipo" id="tipo">
                    <option value="" disabled selected>Seleccione un tipo</option>
                    <% for (CodTipoEjercicio cte : (ArrayList<CodTipoEjercicio>) request.getAttribute("tipos")) {
                            request.setAttribute("cte", cte);
                        %>
                        <option value="${cte.cod_tipo_ejer}">${cte.descripcion_tipo_ejer}</option>
                        <%}%>
                </select>
                <label>Selecciona un tipo :</label>
            </div>
        </div>
        <div class="row margin">
            <button class="btn waves-effect waves-light col s1 orange darken-3" type="submit" id="añadir" name="añadir">Añadir ejercicio
            </button>
        </div>

    </form>
</div>

   <!-- ================================================
      Scripts
      ================================================ -->

    <!-- jQuery Library -->
    <script type="text/javascript" src="js/jquery.js"></script>
    <!--materialize js-->
    <script type="text/javascript" src="js/materialize.min.js"></script>
    <!---script comprobaciones --->
    <script type="text/javascrpit" src="js/validarFormulario.js"></script>
    <script type="text/javascrpit" src="js/ajax.js"></script>
    <script> 
        $(document).ready(function(){
            $('select').formSelect();
        });
        
        $( "#añadir" ).click(function() {
            if($("#nombre_ejercicio").val() === ""){
                alert("El campo nombre no puede estar vacio");
                return false;
            }else if($("#descripcion_ejercicio").val() === ""){
                alert("El campo descripcion no puede estar vacio");
                return false;
            }else if($("#categoria_ejercicio").val() === null){
                alert("El campo categoria no puede estar vacio");
                return false;
            }else if(($("#concepto1").val() === null) && ($("#concepto2").val() === null) && ($("#concepto3").val() === null)){
                alert("Tiene que haber al menos un concepto");
                return false;
            }else if (($("#concepto1").val() !== null && $("#concepto1").val() === $("#concepto2").val())
                      ($("#concepto1").val() !== null && $("#concepto1").val() === $("#concepto3").val())
                      ($("#concepto2").val() !== null && $("#concepto2").val() === $("#concepto3").val())){
                alert("No puede haber dos conceptos iguales");
                return false;
            }else if($("#tipo").val() === null){
                alert("El campo tipo no puede estar vacio");
                return false;
            }else{
                return true;
            }
        });
    </script>


</body>

</html>
<% }%>