<!DOCTYPE html>
<html lang="es">
  <head>
    <meta charset="utf-8">
    <title>{%block title %}{%endblock%} Serpa</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="">
    <meta name="author" content="">

    <!-- Le styles -->
    <link href="{{MEDIA_URL}}css/bootstrap.min.css" rel="stylesheet">
    {% block extra_css%}

    {% endblock %}
    
    <style>
      body {
        padding-top: 60px;
      }


    </style>
    <link href="{{MEDIA_URL}}css/bootstrap-responsive.css" rel="stylesheet">
    <link href="{{MEDIA_URL}}css/style.css" rel="stylesheet">
    <link href="{{MEDIA_URL}}css/custom_white.css" rel="stylesheet">

    <!-- Le HTML5 shim, for IE6-8 support of HTML5 elements -->
    <!--[if lt IE 9]>
      <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->

    <!-- Le fav and touch icons -->
    <link rel="shortcut icon" href="">
    <link rel="apple-touch-icon-precomposed" sizes="144x144" href="../assets/ico/apple-touch-icon-144-precomposed.png">
    <link rel="apple-touch-icon-precomposed" sizes="114x114" href="../assets/ico/apple-touch-icon-114-precomposed.png">
    <link rel="apple-touch-icon-precomposed" sizes="72x72" href="../assets/ico/apple-touch-icon-72-precomposed.png">
    <link rel="apple-touch-icon-precomposed" href="../assets/ico/apple-touch-icon-57-precomposed.png">
  </head>

  <body>

    <div class="navbar navbar-fixed-top">
      <div class="navbar-inner">
        <div class="container-fluid">
          <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </a>
          <a class="brand" href="{% url indice %}">Serpa</a>


              {% if user.is_authenticated %}
              <div class="btn-group pull-right">
                <a class="btn dropdown-toggle" data-toggle="dropdown" href="#">
                  <i class="icon-user"></i> {{user.username}}
                  <span class="caret"></span>
                </a>
                <ul class="dropdown-menu">
                  <li><a href={%block ver_perfil %}"{% url perfil  %}"{%endblock%}>Perfil</a></li>
                  <li class="divider"></li>

                  <li><a href="{% url auth_change_password %}">Cambiar Contraseña</a></li>
                  <li class="divider"></li>
                  <li><a href="{% url django.contrib.auth.views.logout %}">Salir</a></li>
                </ul>
              </div>

              <div class="btn-group pull-right">

                <a class="btn dropdown-toggle" data-toggle="dropdown" href="#">

                  {%block escoge-asignatura%}Asignaturas{%endblock%}

                  <span class="caret"></span>
                </a>
                
                <ul class="dropdown-menu">
                {% for asignatura in user.usuario.asignaturas.all %}
                  <li><a href="{%url ver_asignatura asignatura.slug %}">{{asignatura.slug}}</a></li>
                  <li class="divider"></li>
                {% endfor%}
                </ul>

              </div>
              
                  {% else %}
              <div class="btn-group pull-right">
                <a class="btn dropdown-toggle" data-toggle="dropdown" href="#">
                  <i class="icon-user"></i> Entrar
                  <span class="caret"></span>
                </a>
                <ul class="dropdown-menu">
                  <li><a href="{% url django.contrib.auth.views.login %}">Log In</a></li>
                </ul>
              </div>
                  {% endif %}
        </div>
      </div>
    </div>


    <div class="container-fluid">



      <div class="row-fluid">
            {% if user.is_authenticated %}

        <div class="span3">
          
            <nav class="vnav">
              <ul class="vnav-menu">
                <li>
                  <a class="vnav-header">
                    TABLON - {{ user.usuario.rol|capfirst }} 
                  </a>
                <li>
                <li>
                {% block navbar%}
                {% endblock %}
              </ul>
            </nav>
           

           


          <div id="calendar">
            <p>Por favor activa javascript en tu navegador.</p>
          </div>

            <br/>
            <div class="calendar-header">
              <span class"">Post-it</span>

            </div>
            <div class="todo">
            <ul class="todo-list">
              {%if informacion.tarea_sin_finalizar.count %}
              <li>Tienes {{informacion.tarea_sin_finalizar.count}} sin realizar </li>
              {%else%}
              <li>No hay tareas pendientes </li>
              {% endif %}
              {%if informacion.evaluacion_sin_finalizar.count %}
              <li>Tienes {{informacion.evaluacion_sin_finalizar.count}} sin revisar </li>
              {%else%}
              <li>No hay revisiones pendientes </li>
              {% endif %}
              </ul>

          </div>  
        </div><!--/span-->
        {% endif %}

        <div class="span9">
          
          {% block content%}
          {% endblock %}
         
        </div><!--/span-->

      </div><!--/row-->


      <hr>

      <footer>
        <p><img src="{{MEDIA_URL}}img/ugr_logo.png"/> <a href="#">Serpa 2012</a></p>
      </footer>

    </div><!--/.fluid-container-->

    <!-- javascript
    ================================================== -->

    <script src="{{MEDIA_URL}}js/bootstrap/jquery.js"></script>
    <script src="{{MEDIA_URL}}js/bootstrap/bootstrap-transition.js"></script>
    <script src="{{MEDIA_URL}}js/bootstrap/bootstrap-alert.js"></script>
    <script src="{{MEDIA_URL}}js/bootstrap/bootstrap-modal.js"></script>
    <script src="{{MEDIA_URL}}js/bootstrap/bootstrap-dropdown.js"></script>
    <script src="{{MEDIA_URL}}js/bootstrap/bootstrap-scrollspy.js"></script>
    <script src="{{MEDIA_URL}}js/bootstrap/bootstrap-tab.js"></script>
    <script src="{{MEDIA_URL}}js/bootstrap/bootstrap-tooltip.js"></script>
    <script src="{{MEDIA_URL}}js/bootstrap/bootstrap-popover.js"></script>
    <script src="{{MEDIA_URL}}js/bootstrap/bootstrap-button.js"></script>
    <script src="{{MEDIA_URL}}js/bootstrap/bootstrap-collapse.js"></script>
    <script src="{{MEDIA_URL}}js/bootstrap/bootstrap-carousel.js"></script>
    <script src="{{MEDIA_URL}}js/bootstrap/bootstrap-typeahead.js"></script>
    <script src="{{MEDIA_URL}}js/calendar/jquery.calendar-widget.js"></script>

<script>
$(document).ready(function($) {
  $('[rel=popover]').popover()
  $('[rel=tooltip]').tooltip()

  $(".vnav-item").mouseover(function(){
      $(this).css({'background-color':'red','color':'rgb(201,71,75)'});

    }).mouseout(function(){
      $(this).css({'background-color':'white','color':'#fff'});   
    });
    $("#calendar").calendarWidget({
    month:{% now "m-1" %},
    year: {% now "Y"%}              
   });
});

</script>
    {% block extra_js%}
    {% endblock %}
  </body>
</html>
