{% extends "base.html" %}
{% load mezzanine_tags keyword_tags %}

{# filtro personalizado para encuestas #}
{% load encuesta_extras %}
{# --- #}

{% block meta_title %} Dim 1: CONTEXTO INSTITUCIONAL {# {{ page.meta_title }} #} {% endblock %}

{% block meta_keywords %}{% metablock %}
{% keywords_for page as keywords %}
{% for keyword in keywords %}
    {% if not forloop.first %}, {% endif %}
    {{ keyword }}
{% endfor %}
{% endmetablock %}{% endblock %}

{% block meta_description %}{% metablock %}
{{ page.description }}
{% endmetablock %}{% endblock %}

{% block title %}
{% editable page.title %}{{ page.title }}{% endeditable %}
{% endblock %}

{% block main %}
    <div     style="background-image: url('/static/img/fondo-pag-encuesta.png'); background-position: center; background-repeat: repeat-y; background-attachment: fixed;" >

    {% if request.user.is_authenticated %}
	<h2>DIMENSIÓN 1: CONTEXTO INSTITUCIONAL</h2>

	<div class="panel panel-info" id="empezar">
	    <div class="panel-body">
		<p>
		    Mientras llena la encuesta haga click en <a href="#confirmar">confirmar</a> para que los resultados que marque <b>queden guardados</b>, usted puede
		    modificarlos en cualquier momento e ingresar la veces necesarias hasta culminar la encuesta.
		</p>

		{% with porcentaje=request.user.id|llenado_encuesta:"1" %}
		<div class=
		    {% if porcentaje < 30 %}
					"alert alert-danger">
		    {% elif porcentaje >= 30 and porcentaje < 87%}
					"alert alert-warning">
		    {% elif porcentaje >= 87 %}
					"alert alert-success">
		    {% endif %}
		    <p> Ha completado <b>{{ porcentaje }}%</b>
			de esta dimensión.
		    </p>
		</div>
		{% endwith %}
	    </div>
	</div>

	
	<form action="/evaluar_1/" method="POST">
		{% csrf_token %}
	{% for pagina in paginas %}
	    <hr id="{{ pagina.titulo|slice:"2:" }}"> 

	    {# pequeño enlace #}
	    <a href="#{{ pagina.titulo|slice:"2:" }}" >
		<span class="glyphicon glyphicon-link" style="color: #CDE"> </span>
	    </a>
	    {# edicion para admins #}
	    {% if request.user.is_superuser %}
		<a href="/admin/pages/richtextpage/{{ pagina.id_pagina }}/change/" target="_blank">
		    <span class="glyphicon glyphicon-pencil"> </span>
		</a>
	    {% endif %}
	    
	    {{ pagina.contenido|safe }}

		{# opciones de seleccion para puntuacion #}
		
		<div class="panel panel-info">
		    <b>Calificar:</b>
		     (malo)
		    <input type="radio" id="id_{{ pagina.titulo|slice:"2:" }}"
			   name="{{ pagina.titulo|slice:"2:" }}"
			   value="0" 
			   checked
		    > ?
		    
		    &nbsp;&nbsp;&nbsp

		    <input type="radio" id="id_{{ pagina.titulo|slice:"2:" }}"
			   name="{{ pagina.titulo|slice:"2:" }}"
			   value="1"
			   {% if pagina.puntaje == 1 %} checked {% endif %}
		    > 1
		    &nbsp;&nbsp;&nbsp

		    <input type="radio" id="id_{{ pagina.titulo|slice:"2:" }}"
			   name="{{ pagina.titulo|slice:"2:" }}"
			   value="2"
		       	   {% if pagina.puntaje == 2 %} checked {% endif %}
		    > 2
		    &nbsp;&nbsp;&nbsp

		    <input type="radio" id="id_{{ pagina.titulo|slice:"2:" }}"
			   name="{{ pagina.titulo|slice:"2:" }}"
			   value="3"
			   {% if pagina.puntaje == 3 %} checked {% endif %}
		    > 3
		    &nbsp;&nbsp;&nbsp

		    <input type="radio" id="id_{{ pagina.titulo|slice:"2:" }}"
			   name="{{ pagina.titulo|slice:"2:" }}"
			   value="4"
			   {% if pagina.puntaje == 4 %} checked {% endif %}
		    > 4
		    &nbsp;&nbsp;&nbsp

		    <input type="radio" id="id_{{ pagina.titulo|slice:"2:" }}"
			   name="{{ pagina.titulo|slice:"2:" }}"
			   value="5"
		       	   {% if pagina.puntaje == 5 %} checked {% endif %}
		    > 5 (muy bueno)

		    <!-- <input type="hidden" id="id_{{ pagina.titulo|slice:"2:" }}" -->
		    <!--  	name="{{ pagina.titulo|slice:"2:" }}"  -->
		    <!--  	value="-1" > -->

		</div>

	{% endfor %}
	<h6 id="confirmar">Fin Dimensión </h6>
	<hr>
	<div class="panel panel-info">
	    <div class="panel-heading">
		<p>
		    Los resultados que marque <b>quedarán guardados</b> pero usted puede
		    modificarlos en cualquier momento. <a href="#empezar"><b>&#x2191;</b></a>
		</p>

		<input type="submit" class="btn btn-lg btn-primary" 
		       value="CONFIRMAR" />
		</div>
	</div>

	</form>

	<hr>
	<a href="/encuesta_d2" class="btn btn-lg btn-warning">
		DIMENSIÓN 2: PROYECTO ACADEMICO
	</a>
    {% else %}
	<div class="panel panel-warning" id="empezar">
	    <div class="panel-heading">
			Para continuar, se requiere que <a class="btn btn-warning" href="/accounts/login">INGRESE CON SU CUENTA</a>
	    </div>
	</div>

    {% endif %}
    </div>
    
{% endblock %}
