# HG changeset patch
# User cavaliet
# Date 1392999934 -3600
# Node ID 4e53b9ba3453aabee4057b8cc1cfd697b47be9f7
# Parent  2581135217f2abd12864eb8f879cec2090d9c1ab
added spectacle page in views

diff -r 2581135217f2 -r 4e53b9ba3453 src/spel/templates/spel_base.html
--- a/src/spel/templates/spel_base.html	Fri Feb 21 16:56:37 2014 +0100
+++ b/src/spel/templates/spel_base.html	Fri Feb 21 17:25:34 2014 +0100
@@ -39,5 +39,7 @@
     </footer>
   </div>
   {% endblock %}
+  {% block common_js %}{% endblock %}
+  {% block page_js %}{% endblock %}
 </body>
 </html>
\ No newline at end of file
diff -r 2581135217f2 -r 4e53b9ba3453 src/spel/templates/spel_home.html
--- a/src/spel/templates/spel_home.html	Fri Feb 21 16:56:37 2014 +0100
+++ b/src/spel/templates/spel_home.html	Fri Feb 21 17:25:34 2014 +0100
@@ -4,6 +4,6 @@
 {% block page_title %}Accueil{% endblock %}</title>
 
 {% block spel_content %}
-      <p><a href="spectacle.html">Spectacle</a></p>
-      <p><a href="opera.html">Opéra</a></p>
+      <p><a href="{% url 'spel_spectacle' %}">Spectacle</a></p>
+      <p><a href="#">Opéra</a></p>
 {% endblock %}
diff -r 2581135217f2 -r 4e53b9ba3453 src/spel/templates/spel_spectacle.html
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/src/spel/templates/spel_spectacle.html	Fri Feb 21 17:25:34 2014 +0100
@@ -0,0 +1,159 @@
+{% extends "spel_base.html" %}
+{% load static %}
+
+{% block common_css %}
+  <link rel="stylesheet" href="{% static 'spel/lib/bootstrap/css/bootstrap.min.css' %}">
+  <link rel="stylesheet" href="{% static 'spel/lib/bootstrap-multiselect.css' %}">
+  <link rel="stylesheet" href="{% static 'spel/css/spel.css' %}">
+{% endblock %}
+
+{% block page_title %}Spectacles{% endblock %}
+
+{% block spel_content %}
+      <h3>Page Spectacle</h3>
+      <div class="row">
+        <div class="col-md-6 chapters">
+          <h4 class="text-center">CHAPITRES</h4>
+          <div class="row">
+            <div class="col-md-4">
+              <select id="mulsel1" class="multiselect" multiple="multiple" data-title="Types de contenus">
+              </select>
+            </div>
+            <div class="col-md-4">
+              <select id="mulsel2" class="multiselect" multiple="multiple" data-title="Conditions de travail">
+              </select>
+            </div>
+            <div class="col-md-4">
+              <select id="mulsel3" class="multiselect" multiple="multiple" data-title="Personnages">
+              </select>
+            </div>
+          </div>
+          <div class="row">
+            &nbsp;
+          </div>
+          <div class="row text-center">
+            <button id="btn-filter-chapters" class="btn btn-success" disabled="disabled">FILTRER</button>
+          </div>
+        </div>
+        <div class="col-md-6 annotations">
+          <h4 class="text-center">ANNOTATIONS</h4>
+          <form class="form-horizontal" role="form">
+            <div class="form-group">
+              <div class="col-md-8 col-md-offset-1">
+                <input type="text" class="form-control" id="search-input">
+              </div>
+              <div class="col-md-3">
+                <button id="btn-search-annotations" class="btn btn-success" disabled="disabled">
+                  <span class="glyphicon glyphicon-search form-control-feedback"></span>
+                </button>
+              </div>
+            </div>
+          </form>
+          <div class="col-md-8 col-md-offset-1">
+            <select id="mulsel4" class="multiselect" multiple="multiple" data-title="Catégories d'annotations">
+            </select>
+          </div>
+          <div class="col-md-3">
+            <button id="btn-filter-annotations" class="btn btn-success" disabled="disabled">FILTRER</button>
+          </div>
+        </div>
+      </div>
+{% endblock %}
+{% block page_js %}
+  <script type="text/javascript" src="{% static 'spel/lib/jquery-2.1.0.min.js' %}"></script>
+  <script type="text/javascript" src="{% static 'spel/lib/bootstrap/js/bootstrap.min.js' %}"></script>
+  <script type="text/javascript" src="{% static 'spel/lib/bootstrap-multiselect.js' %}"></script>
+  <script type="text/javascript">
+
+    $(document).ready(function () {
+
+      $('.chapters .multiselect').multiselect({
+        buttonText: function(options, select) {
+          return $(select).attr("data-title") + ' (' + options.length + ') <b class="caret"></b>';
+        },
+        onChange: function(element, checked) {
+          var filter_enabled = false;
+          var chbs = $(".chapters input:checkbox");
+          for (var i = chbs.length - 1; i >= 0; i--) {
+            filter_enabled = filter_enabled || $(chbs[i]).is(":checked");
+          };
+          if(filter_enabled){
+            $("#btn-filter-chapters").removeAttr('disabled');
+          }
+          else{
+            $("#btn-filter-chapters").attr('disabled','disabled');
+          }
+        }
+      });
+      $('.annotations .multiselect').multiselect({
+        buttonText: function(options, select) {
+          return $(select).attr("data-title") + ' (' + options.length + ') <b class="caret"></b>';
+        },
+        buttonContainer: '<div class="btn-group width100percent" />',
+        buttonClass: 'btn btn-default width100percent disabled',
+        onChange: function(element, checked) {
+          var filter_enabled = false;
+          var chbs = $(".annotations input:checkbox");
+          for (var i = chbs.length - 1; i >= 0; i--) {
+            filter_enabled = filter_enabled || $(chbs[i]).is(":checked");
+          };
+          if(filter_enabled){
+            $("#btn-filter-annotations").removeAttr('disabled');
+          }
+          else{
+            $("#btn-filter-annotations").attr('disabled','disabled');
+          }
+        }
+      });
+
+
+      var data1 = [
+        {label: "Performance", value: "Performance"},
+        {label: "Discussion", value: "Discussion"}
+      ];
+      $("#mulsel1").multiselect('dataprovider', data1);
+      var data2 = [
+        {label: "Lumière", value: "Lumière"},
+        {label: "Son", value: "Son"},
+        {label: "Musique", value: "Musique"},
+        {label: "Décor", value: "Décor"}
+      ];
+      $("#mulsel2").multiselect('dataprovider', data2);
+      var data3 = [
+        {label: "PA", value: "Lumière"},
+        {label: "PB", value: "Son"},
+        {label: "PC", value: "Musique"},
+        {label: "PD", value: "Décor"},
+        {label: "PE", value: "Décor"}
+      ];
+      $("#mulsel3").multiselect('dataprovider', data3);
+
+      // Annotations :
+      $("#mulsel4").multiselect('disable');
+      $(document).on('input', "#search-input", function(){
+        if($(this).val()!=""){
+          $("#btn-search-annotations").removeAttr('disabled');
+        }
+        else{
+          $("#btn-search-annotations").attr('disabled','disabled');
+        }
+      });
+
+      $("#btn-search-annotations").click(function(e){
+        e.preventDefault();
+        var data4 = [
+          {label: "Intervention MES", value: "Intervention MES"},
+          {label: "Filage de la scène", value: "Filage de la scène"},
+          {label: "Parole à l'acteur/actrice", value: "Parole à l'acteur/actrice"},
+          {label: "Interprétation du texte", value: "Interprétation du texte"},
+          {label: "Décision", value: "Décision"}
+        ];
+        $("#mulsel4").multiselect('dataprovider', data4);
+        $("#mulsel4").multiselect('enable');
+      });
+
+
+    });
+
+  </script>
+{% endblock %}
diff -r 2581135217f2 -r 4e53b9ba3453 src/spel/urls.py
--- a/src/spel/urls.py	Fri Feb 21 16:56:37 2014 +0100
+++ b/src/spel/urls.py	Fri Feb 21 17:25:34 2014 +0100
@@ -43,6 +43,7 @@
     
     (r'^jsi18n/$', 'django.views.i18n.javascript_catalog', js_info_dict),
     url(r'^$', TemplateView.as_view(template_name="spel_home.html"), name='spel_home'),
+    url(r'^spectacle$', TemplateView.as_view(template_name="spel_spectacle.html"), name='spel_spectacle'),
 )
 
 urlpatterns += staticfiles_urlpatterns()