# HG changeset patch
# User durandn
# Date 1443108255 -7200
# Node ID d7e38162478a338aa9dad42ce5d900bc2c057824
# Parent  b3fe63cdb3fd952203f24437261773994e2e4ea3
Added 2 preview scenarii for remie + made remie iframes load jquery.js instead of jquery.min.js in an attemps to fix

diff -r b3fe63cdb3fd -r d7e38162478a server/src/remie/static/remie/css/markers.css
--- a/server/src/remie/static/remie/css/markers.css	Thu Sep 24 12:25:05 2015 +0200
+++ b/server/src/remie/static/remie/css/markers.css	Thu Sep 24 17:24:15 2015 +0200
@@ -179,6 +179,13 @@
     background-color: #CD000B;
     border-color: #4d0004;
 }
+.Ldt-Markers-Screen.Ldt-Markers-ScreenMain .Ldt-Markers-RoundButton.Ldt-Markers-PreviewDelete{
+    font-size: 35px;
+    line-height: 20px;
+    text-indent: 2px;
+    background-color: #999999;
+    border-color: #4d0004;
+}
 
 .Ldt-Markers-Screen.Ldt-Markers-ScreenMain .Ldt-Markers-RoundButton.Ldt-Markers-Delete:hover{
     background-color: #CD000B;
diff -r b3fe63cdb3fd -r d7e38162478a server/src/remie/static/remie/css/style.css
--- a/server/src/remie/static/remie/css/style.css	Thu Sep 24 12:25:05 2015 +0200
+++ b/server/src/remie/static/remie/css/style.css	Thu Sep 24 17:24:15 2015 +0200
@@ -249,6 +249,11 @@
     background-color: #a2cf18;
     left: 0;
 }
+
+.Ldt-CreateAnnotation-Screen.Ldt-CreateAnnotation-Main .Ldt-CreateAnnotation-PreviewSubmit{
+	left: 0;
+}
+
 .Ldt-CreateAnnotation-Screen.Ldt-CreateAnnotation-Main .Ldt-CreateAnnotation-Cancel{
     background-color: #CD000B;
     left: 95px;
diff -r b3fe63cdb3fd -r d7e38162478a server/src/remie/static/remie/metadataplayer/CreateAnnotation.css
--- a/server/src/remie/static/remie/metadataplayer/CreateAnnotation.css	Thu Sep 24 12:25:05 2015 +0200
+++ b/server/src/remie/static/remie/metadataplayer/CreateAnnotation.css	Thu Sep 24 17:24:15 2015 +0200
@@ -44,7 +44,8 @@
 }
 
 .Ldt-CreateAnnotation-Submit,
-.Ldt-CreateAnnotation-Cancel{
+.Ldt-CreateAnnotation-Cancel,
+.Ldt-CreateAnnotation-PreviewSubmit{
     position: absolute;
     bottom: 7px;
     right: 7px;
diff -r b3fe63cdb3fd -r d7e38162478a server/src/remie/static/remie/metadataplayer/CreateAnnotation.js
--- a/server/src/remie/static/remie/metadataplayer/CreateAnnotation.js	Thu Sep 24 12:25:05 2015 +0200
+++ b/server/src/remie/static/remie/metadataplayer/CreateAnnotation.js	Thu Sep 24 17:24:15 2015 +0200
@@ -55,6 +55,7 @@
     pause_when_displaying: false,
     custom_send_button: false,
     custom_cancel_button: false,
+    preview_mode: false,
 };
 
 IriSP.Widgets.CreateAnnotation.prototype.messages = {
@@ -63,6 +64,7 @@
         to_time: "to",
         at_time: "at",
         submit: "Submit",
+        preview_submit: "You cannot submit annotations in preview mode",
         cancel: "Cancel",
         add_keywords_: "Add keywords:",
         add_polemic_keywords_: "Add polemic attributes :",
@@ -85,6 +87,7 @@
         to_time: "à",
         at_time: "à",
         submit: "Envoyer",
+        preview_submit: "Vous ne pouvez pas envoyer d'annotation en mode aperçu",
         cancel: "Annuler",
         add_keywords_: "Ajouter des mots-clés\u00a0:",
         add_polemic_keywords_: "Ajouter des attributs polémiques\u00a0:",
@@ -116,7 +119,8 @@
     + '{{#show_creator_field}}{{l10n.your_name_}} <input class="Ldt-CreateAnnotation-Creator empty" value="{{creator_name}}" {{#creator_field_readonly}}readonly{{/creator_field_readonly}}/>{{/show_creator_field}}</h3>'
     + '<textarea class="Ldt-CreateAnnotation-Description empty" placeholder="{{l10n.type_description}}"></textarea>'
     + '<div class="Ldt-CreateAnnotation-Avatar"><img src="{{creator_avatar}}" title="{{creator_name}}"></img></div>'
-    + '<input type="submit" class="Ldt-CreateAnnotation-Submit" value="{{#custom_send_button}}{{custom_send_button}}{{/custom_send_button}}{{^custom_send_button}}{{l10n.submit}}{{/custom_send_button}}" />'
+    + '{{#preview_mode}}<input type="button" class="Ldt-CreateAnnotation-PreviewSubmit" title="{{l10n.preview_submit}}" value="{{#custom_send_button}}{{custom_send_button}}{{/custom_send_button}}{{^custom_send_button}}{{l10n.submit}}{{/custom_send_button}}" />{{/preview_mode}}'
+    + '{{^preview_mode}}<input type="submit" class="Ldt-CreateAnnotation-Submit" value="{{#custom_send_button}}{{custom_send_button}}{{/custom_send_button}}{{^custom_send_button}}{{l10n.submit}}{{/custom_send_button}}" />{{/preview_mode}}'
     + '<input type="button" class="Ldt-CreateAnnotation-Cancel" value="{{#custom_cancel_button}}{{custom_cancel_button}}{{/custom_cancel_button}}{{^custom_cancel_button}}{{l10n.cancel}}{{/custom_cancel_button}}" />'
     + '{{#show_mic_record}}<div class="Ldt-CreateAnnotation-RecBlock"><div class="Ldt-CreateAnnotation-RecLabel">Add voice annotation</div>'
     + '    <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="220" height="160">'
diff -r b3fe63cdb3fd -r d7e38162478a server/src/remie/static/remie/metadataplayer/LdtPlayer-core.js
--- a/server/src/remie/static/remie/metadataplayer/LdtPlayer-core.js	Thu Sep 24 12:25:05 2015 +0200
+++ b/server/src/remie/static/remie/metadataplayer/LdtPlayer-core.js	Thu Sep 24 17:24:15 2015 +0200
@@ -2329,20 +2329,7 @@
         $L.queueScript(ns.getLib("json"));
     }
     
-    $L.queueWait(function(){
-        if (typeof ns.jQuery === "undefined" && typeof window.jQuery !== "undefined") {
-            ns.jQuery = window.jQuery;
-            if (former$ || formerJQuery) {
-                window.jQuery.noConflict(formerJQuery);
-            }
-        }
-        if (typeof ns._ === "undefined" && typeof window._ !== "undefined") {
-            ns._ = window._;
-            if (formerUnderscore) {
-                _.noConflict();
-            }
-        }
-    }).queueScript(ns.getLib("jQueryUI")).queueWait();
+    $L.queueWait().queueScript(ns.getLib("jQueryUI")).queueWait();
 
     /* widget specific requirements */
     for(var _i = 0; _i < this.config.widgets.length; _i++) {
@@ -2366,6 +2353,19 @@
 Metadataplayer.prototype.onLibsLoaded = function() {
     ns.log("IriSP.Metadataplayer.prototype.onLibsLoaded");
     
+    if (typeof ns.jQuery === "undefined" && typeof window.jQuery !== "undefined") {
+        ns.jQuery = window.jQuery;
+        if (former$ || formerJQuery) {
+            window.jQuery.noConflict(formerJQuery);
+        }
+    }
+    if (typeof ns._ === "undefined" && typeof window._ !== "undefined") {
+        ns._ = window._;
+        if (formerUnderscore) {
+            _.noConflict();
+        }
+    }
+    
     ns.loadCss(ns.getLib("cssjQueryUI"));
     ns.loadCss(this.config.css);
     
diff -r b3fe63cdb3fd -r d7e38162478a server/src/remie/static/remie/metadataplayer/Markers.css
--- a/server/src/remie/static/remie/metadataplayer/Markers.css	Thu Sep 24 12:25:05 2015 +0200
+++ b/server/src/remie/static/remie/metadataplayer/Markers.css	Thu Sep 24 17:24:15 2015 +0200
@@ -66,6 +66,11 @@
 	text-indent: 2px;
 }
 
+.Ldt-Markers-RoundButton.Ldt-Markers-PreviewDelete{
+	line-height: 23px;
+	text-indent: 2px;
+}
+
 .Ldt-Markers-Info{
 	height: 125px;
 	width: 90%;
@@ -146,7 +151,7 @@
 	vertical-align: top;
 }
 
-.Ldt-Markers-MarkerSend, .Ldt-Markers-MarkerCancel{
+.Ldt-Markers-MarkerSend, .Ldt-Markers-MarkerPreviewSend, .Ldt-Markers-MarkerCancel{
 	display: inline-block;
     background-color: #d93c71;
     color: #ffffff;
@@ -169,7 +174,7 @@
 	vertical-align: top;
 }
 
-.Ldt-Markers-RoundButton:hover, .Ldt-Markers-MarkerSend:hover, .Ldt-Markers-MarkerCancel:hover{
+.Ldt-Markers-RoundButton:hover, .Ldt-Markers-MarkerSend:hover, .Ldt-Markers-MarkerPreviewSend:hover, .Ldt-Markers-MarkerCancel:hover{
 	background-color: #e15581;
 	border-color: #222222 #e87d9f #f0adc3 #68273c;
 }
diff -r b3fe63cdb3fd -r d7e38162478a server/src/remie/static/remie/metadataplayer/Markers.js
--- a/server/src/remie/static/remie/metadataplayer/Markers.js	Thu Sep 24 12:25:05 2015 +0200
+++ b/server/src/remie/static/remie/metadataplayer/Markers.js	Thu Sep 24 17:24:15 2015 +0200
@@ -31,6 +31,7 @@
     close_after_send: false,
     custom_send_button: false,
     custom_cancel_button: false,
+    preview_mode: false,
 };
 
 IriSP.Widgets.Markers.prototype.template = 
@@ -42,7 +43,8 @@
     +     '<div class="Ldt-Markers-Screen Ldt-Markers-ScreenMain">'
     +         '<div class="Ldt-Markers-RoundButton Ldt-Markers-CannotCreate" title="{{l10n.cannot_create}}">+</div>'
     +         '<div class="Ldt-Markers-RoundButton Ldt-Markers-Create">+</div>'
-    +         '<div class="Ldt-Markers-RoundButton Ldt-Markers-Delete">&#10006;</div>'
+    +         '{{^preview_mode}}<div class="Ldt-Markers-RoundButton Ldt-Markers-Delete">&#10006;</div>{{/preview_mode}}'
+    +         '{{#preview_mode}}<div class="Ldt-Markers-RoundButton Ldt-Markers-PreviewDelete" title="{{l10n.preview_mode_delete}}">&#10006;</div>{{/preview_mode}}'
     +         '<div class="Ldt-Markers-Info"></div>'
     +     '</div>'
     +     '<div class="Ldt-Markers-Screen Ldt-Markers-ScreenSending">'  
@@ -86,7 +88,8 @@
     '{{#edit}}<div class="Ldt-Markers-MarkerEdit">' + 
         '<textarea class="Ldt-Markers-MarkerTextArea" cols="60" rows="4">{{marker_info}}</textarea>' +
         '<div class="Ldt-Markers-Buttons">' +
-            '<div class="Ldt-Markers-MarkerSend">{{send}}</div>' +
+            '{{^preview_mode}}<div class="Ldt-Markers-MarkerSend">{{send}}</div>{{/preview_mode}}' +
+            '{{#preview_mode}}<div class="Ldt-Markers-MarkerPreviewSend" title="{{preview_mode_text}}">{{send}}</div>{{/preview_mode}}' +
             '<div class="Ldt-Markers-MarkerCancel">{{cancel}}</div>' +
         '</div>' +
     '</div>{{/edit}}'
@@ -96,6 +99,8 @@
         send : "Send",
         submit_delete: "Delete",
         cancel : "Cancel",
+        preview_mode_submit: "You cannot submit a marker in preview mode.",
+        preview_mode_delete: "You cannot delete a marker in preview mode",
         wait_while_processing: "Please wait while your annotation is being processed...",
         delete_text: "The selected marker will be deleted. Continue?",
         error_while_contacting: "An error happened while contacting the server. Your annotation has not been saved.",
@@ -108,6 +113,8 @@
         send : "Envoyer",
         submit_delete: "Supprimer",
         cancel : "Annuler",
+        preview_mode_submit: "Vous ne pouvez pas créer ou éditer de marqueur en mode aperçu",
+        preview_mode_delete: "Vous ne pouvez pas supprimer de marqueur en mode aperçu",
         wait_while_processing: "Veuillez patienter pendant le traitement de votre annotation...",
         delete_text: "Le marqueur sélectionné sera supprimé. Continuer?",
         error_while_contacting: "Une erreur s'est produite en contactant le serveur. Votre annotation n'a pas été enregistrée.",
@@ -169,13 +176,13 @@
         return ((_time < (_marker.begin-_this.markers_gap))||(_time > (_marker.begin+_this.markers_gap)))
     });
     if (can_create){
-        if ((this.$.find(".Ldt-Markers-Create").is(":hidden"))&&(this.$.find(".Ldt-Markers-Delete").is(":hidden"))){
+        if ((this.$.find(".Ldt-Markers-Create").is(":hidden"))&&(this.$.find(".Ldt-Markers-Delete").is(":hidden")||this.$.find(".Ldt-Markers-PreviewDelete").is(":hidden"))){
             this.$.find(".Ldt-Markers-RoundButton").hide();
             this.$.find(".Ldt-Markers-Create").show();
         }
     }
     else {
-        if ((this.$.find(".Ldt-Markers-CannotCreate").is(":hidden"))&&(this.$.find(".Ldt-Markers-Delete").is(":hidden"))){
+        if ((this.$.find(".Ldt-Markers-CannotCreate").is(":hidden"))&&(this.$.find(".Ldt-Markers-Delete").is(":hidden")||this.$.find(".Ldt-Markers-PreviewDelete").is(":hidden"))){
             this.$.find(".Ldt-Markers-RoundButton").hide();
             this.$.find(".Ldt-Markers-CannotCreate").show();
         }
@@ -207,6 +214,8 @@
     if (this.selectedMarker){
         _divHtml = Mustache.to_html(this.infoTemplate, {
             edit: true,
+            preview_mode: this.preview_mode,
+            preview_mode_text: this.l10n.preview_mode_submit,
             marker_info: this.selectedMarker.description,
             send: this.custom_send_button? this.custom_send_button : this.l10n.send,
             cancel: this.custom_cancel_button? this.custom_cancel_button :this.l10n.cancel
@@ -216,6 +225,8 @@
         _divHtml = Mustache.to_html(this.infoTemplate, {
             edit: true,
             marker_info: "",
+            preview_mode: this.preview_mode,
+            preview_mode_text: this.l10n.preview_mode_submit,
             send: this.custom_send_button? this.custom_send_button : this.l10n.send,
             cancel: this.custom_cancel_button? this.custom_cancel_button :this.l10n.cancel
         })
@@ -225,7 +236,12 @@
     this.$.find(".Ldt-Markers-MarkerCancel").click(this.functionWrapper("cancelEdit"));
     this.$.find(".Ldt-Markers-MarkerTextArea").bind("change keyup input paste", this.functionWrapper("onDescriptionChange"));
     this.$.find(".Ldt-Markers-RoundButton").hide();
-    this.$.find(".Ldt-Markers-Delete").show();
+    if (this.preview_mode){
+        this.$.find(".Ldt-Markers-PreviewDelete").show(); 
+    }
+    else {
+        this.$.find(".Ldt-Markers-Delete").show();
+    }
     this.editing = true;
 }
 
@@ -287,7 +303,12 @@
         this.cancelEdit();
         if (this.selectedMarker){
             this.$.find(".Ldt-Markers-RoundButton").hide();
-            this.$.find(".Ldt-Markers-Delete").show();
+            if (this.preview_mode){
+                this.$.find(".Ldt-Markers-PreviewDelete").show(); 
+            }
+            else {
+                this.$.find(".Ldt-Markers-Delete").show();
+            }
         }
         else {
             this.$.find(".Ldt-Markers-RoundButton").hide();
@@ -388,7 +409,12 @@
                   _this.$.find(".Ldt-Markers-Info").html(_divHtml);
                   _this.$.find(".Ldt-Markers-MarkerDescription").click(_this.functionWrapper("startEdit"));
                   _this.$.find(".Ldt-Markers-RoundButton").hide();
-                  _this.$.find(".Ldt-Markers-Delete").show();
+                  if (_this.preview_mode){
+                      _this.$.find(".Ldt-Markers-PreviewDelete").show(); 
+                  }
+                  else {
+                      _this.$.find(".Ldt-Markers-Delete").show();
+                  }
 
                }
                else {
diff -r b3fe63cdb3fd -r d7e38162478a server/src/remie/templates/remie/iframe_markers.html
--- a/server/src/remie/templates/remie/iframe_markers.html	Thu Sep 24 12:25:05 2015 +0200
+++ b/server/src/remie/templates/remie/iframe_markers.html	Thu Sep 24 17:24:15 2015 +0200
@@ -26,6 +26,7 @@
     var metadata_key = "metadata"; 
     
     IriSP.libFiles.defaultDir = '{% static "remie/js/" %}';
+    IriSP.libFiles.inDefaultDir.jQuery = 'jquery.js';
     IriSP.libFiles.locations.jwPlayerSWF = '{% static "remie/swf/player.swf" %}';
     IriSP.libFiles.locations.recordMicSwf = '{% static "remie/swf/record_mic.swf" %}';
     IriSP.libFiles.locations.zeroClipboardSwf = '{% static "remie/swf/ZeroClipboard10.swf" %}';
diff -r b3fe63cdb3fd -r d7e38162478a server/src/remie/templates/remie/iframe_markers_preview.html
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/server/src/remie/templates/remie/iframe_markers_preview.html	Thu Sep 24 17:24:15 2015 +0200
@@ -0,0 +1,94 @@
+{% load staticfiles %}
+<html>
+<head>
+<title>Test</title>
+<link rel="stylesheet" type="text/css" href="{% static 'remie/css/markers.css' %}" />
+</head>
+<body>
+<div id="remie_player_container">
+  <div id="media_panel">  
+    <div id="player_container"></div>
+  </div>
+  <div id="info_panel">
+    <div id="CurrentSegmentInfobox_container"></div>
+    <div id="LatestAnnotation_container"></div>
+    <div id="AnnotationsController_container"></div>
+    <div id="CreateAnnotation_container"></div>
+    <div id="AnnotationsList_container"></div>
+  </div>
+  <script type="text/javascript" src='{% static "remie/metadataplayer/LdtPlayer-core.js" %}'></script>
+  <script type="text/javascript">
+    
+    if (typeof jQuery == "undefined") {
+        jQuery = IriSP.jQuery;
+    }
+    var metadatas = {metadata: {url: "{% url 'projectjson_id' id=project_id %}?from_display=false"}};
+    var metadata_key = "metadata"; 
+    
+    IriSP.libFiles.defaultDir = '{% static "remie/js/" %}';
+    IriSP.libFiles.inDefaultDir.jQuery = 'jquery.js';
+    IriSP.libFiles.locations.jwPlayerSWF = '{% static "remie/swf/player.swf" %}';
+    IriSP.libFiles.locations.recordMicSwf = '{% static "remie/swf/record_mic.swf" %}';
+    IriSP.libFiles.locations.zeroClipboardSwf = '{% static "remie/swf/ZeroClipboard10.swf" %}';
+    IriSP.libFiles.locations.cssjQueryUI = '{% static "remie/css/jq-css/themes/base/jquery-ui.css" %}';
+    IriSP.language = 'fr-fr';
+   
+    IriSP.widgetsDir = '{% static "remie/metadataplayer" %}';
+    var _metadata = {
+        url: metadatas[metadata_key].url,
+        format: 'ldt'
+    };
+    var _config = {
+      container: 'player_container',
+      css: '{% static "remie/metadataplayer/LdtPlayer-core.css" %}',
+      default_options: {
+          metadata: _metadata
+      },
+      widgets: 
+      [
+        {
+            type: "AutoPlayer",
+            streamer: function(_url) {
+                var _matches = _url.match(/^[^\/]+\/\/[^\/]+\/[^\/]+\//);
+                if (_matches) {
+                  return _matches[0];
+                } else {
+                  return _url;
+                }
+            },
+            url_transform: function(url) {
+                // Adaptation to jwplayer 6
+                if(url.substr(url.length - 4).toLowerCase()=='.flv'){
+                    return url.replace('/ddc_player/video/','/ddc_player/flv:video/');
+                }
+                return url.replace('/ddc_player/video/','/ddc_player/mp4:video/');
+            },
+            default_type: "AdaptivePlayer",
+            autostart: false
+        },{
+           type: "Slider"
+        },{
+            type: "Controller",
+            disable_annotate_btn: true,
+            disable_search_btn: true,
+            disable_ctrl_f: true
+        },{
+            type: "Markers",
+            annotation_type: "markers_{{current_user}}",
+            line_height: 24,
+            creator_name : "{{current_user}}",
+            project_id: "{{project_id}}",
+            allow_empty_markers: true,
+            play_on_submit: true,
+            custom_send_button: "Sauver",
+            preview_mode: true,
+        }
+      ]
+    }
+    
+    _myPlayer = new IriSP.Metadataplayer(_config);
+  
+  </script>
+</div>
+</body>
+</html>
\ No newline at end of file
diff -r b3fe63cdb3fd -r d7e38162478a server/src/remie/templates/remie/iframe_segments_group.html
--- a/server/src/remie/templates/remie/iframe_segments_group.html	Thu Sep 24 12:25:05 2015 +0200
+++ b/server/src/remie/templates/remie/iframe_segments_group.html	Thu Sep 24 17:24:15 2015 +0200
@@ -26,6 +26,7 @@
     var metadata_key = "metadata"; 
     
     IriSP.libFiles.defaultDir = '{% static "remie/js/" %}';
+    IriSP.libFiles.inDefaultDir.jQuery = 'jquery.js';
     IriSP.libFiles.locations.jwPlayerSWF = '{% static "remie/swf/player.swf" %}';
     IriSP.libFiles.locations.recordMicSwf = '{% static "remie/swf/record_mic.swf" %}';
     IriSP.libFiles.locations.zeroClipboardSwf = '{% static "remie/swf/ZeroClipboard10.swf" %}';
diff -r b3fe63cdb3fd -r d7e38162478a server/src/remie/templates/remie/iframe_segments_preview.html
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/server/src/remie/templates/remie/iframe_segments_preview.html	Thu Sep 24 17:24:15 2015 +0200
@@ -0,0 +1,186 @@
+{% load staticfiles %}
+<html>
+<head>
+<title>Test</title>
+<link rel="stylesheet" type="text/css" href="{% static 'remie/css/style.css' %}" />
+</head>
+<body>
+<div id="remie_player_container">
+  <div id="media_panel">  
+    <div id="player_container"></div>
+  </div>
+  <div id="info_panel">
+    <div id="CurrentSegmentInfobox_container"></div>
+    <div id="LatestAnnotation_container"></div>
+    <div id="AnnotationsController_container"></div>
+    <div id="CreateAnnotation_container"></div>
+    <div id="AnnotationsList_container"></div>
+  </div>
+  <script type="text/javascript" src='{% static "remie/metadataplayer/LdtPlayer-core.js" %}'></script>
+  <script type="text/javascript">
+    
+    if (typeof jQuery == "undefined") {
+        jQuery = IriSP.jQuery;
+    }
+    var metadatas = {metadata: {url: "{% url 'projectjson_id' id=project_id %}?from_display=false"}};
+    var metadata_key = "metadata"; 
+    
+    IriSP.libFiles.defaultDir = '{% static "remie/js/" %}';
+    IriSP.libFiles.inDefaultDir.jQuery = 'jquery.js';
+    IriSP.libFiles.locations.jwPlayerSWF = '{% static "remie/swf/player.swf" %}';
+    IriSP.libFiles.locations.recordMicSwf = '{% static "remie/swf/record_mic.swf" %}';
+    IriSP.libFiles.locations.zeroClipboardSwf = '{% static "remie/swf/ZeroClipboard10.swf" %}';
+    IriSP.libFiles.locations.cssjQueryUI = '{% static "remie/css/jq-css/themes/base/jquery-ui.css" %}';
+    IriSP.language = 'fr-fr';
+   
+    IriSP.widgetsDir = '{% static "remie/metadataplayer" %}';
+    var _metadata = {
+        url: metadatas[metadata_key].url,
+        format: 'ldt'
+    };
+    var _config = {
+      container: 'player_container',
+      css: '{% static "remie/metadataplayer/LdtPlayer-core.css" %}',
+      default_options: {
+          metadata: _metadata
+      },
+      widgets: 
+      [
+        {
+            type: "AutoPlayer",
+            streamer: function(_url) {
+                var _matches = _url.match(/^[^\/]+\/\/[^\/]+\/[^\/]+\//);
+                if (_matches) {
+                  return _matches[0];
+                } else {
+                  return _url;
+                }
+            },
+            url_transform: function(url) {
+                // Adaptation to jwplayer 6
+                if(url.substr(url.length - 4).toLowerCase()=='.flv'){
+                    return url.replace('/ddc_player/video/','/ddc_player/flv:video/');
+                }
+                return url.replace('/ddc_player/video/','/ddc_player/mp4:video/');
+            },
+        	default_type: "AdaptivePlayer",
+            autostart: false,
+            adapt_to_device: true
+        },{
+         	 type: "Slider"
+        },{
+            type: "Controller",
+            disable_annotate_btn: true,
+            disable_search_btn: true,
+            disable_ctrl_f: true
+        },{
+            type: "Segments",
+            annotation_type: "découpage",
+            line_height: 24,
+            overlap: 1,
+            no_tooltip: true,
+            use_timerange: true,
+            
+        },{
+            type: "AnnotationsController",
+            container: "AnnotationsController_container",
+            display_or_write: true,
+            starts_hidden: true,
+            hide_without_segment: true,
+           	segments_annotation_type: "découpage",
+        },{
+            type: "CreateAnnotation",
+            container: "CreateAnnotation_container",
+            show_title_field : false,
+            show_creator_field : false,
+            show_time : false,
+            start_visible : false,
+            always_visible : false,
+            show_slice : false,
+            show_arrow : false,
+            show_mic_record: false,
+            show_mic_play: false,
+            minimize_annotation_widget : true,
+            creator_name : "{{current_user}}",
+            creator_field_readonly: true,
+            creator_avatar : "",
+            tags : true, // This may be counterintuitive but this actually hides tag tool for the widget
+            tag_titles : false,
+            pause_on_write : true,
+            max_tags : 8,
+            polemics : false,
+            annotation_type : "user_{{current_user}}",
+            api_serializer : "ldt_annotate",post_at_segment_time : true,
+            segments_annotation_type: "découpage",
+            after_send_timeout : 0,
+            close_after_send: true,
+            tag_prefix: "#",
+            // Change id to a given project id
+            project_id: "{{project_id}}",
+            pause_when_displaying: true,
+            custom_send_button: "Sauver",
+            preview_mode: true,
+        },{
+            type: "AnnotationsList",
+            container: "AnnotationsList_container",
+            api_users_endpoint: "{% url 'api_dispatch_list' resource_name='users' api_name='1.0' %}?username__in={% templatetag openvariable %}usernames_list_string{% templatetag closevariable %}&limit={% templatetag openvariable %}usernames_list_length{% templatetag closevariable %}",
+            annotation_type: "user_",
+            filter_by_segments: true,
+            segments_annotation_type: "découpage",
+            show_creation_date: true,
+            show_only_annotation_from_user: false,
+            show_timecode: false,
+            show_filters: true,
+            keyword_filter: false,
+            date_filter: false,
+            segment_filter: false,
+            latest_contributions_filter: true,
+            show_header: true,
+            custom_header: "Travail du groupe",
+            limit_count: false,
+            start_visible: false,
+            newest_first: true,
+            tags: false,
+            make_name_string_function: function(params){
+                display_string = params.username;
+                if (params.first_name && params.last_name){
+                    display_string = params.first_name.charAt(0)+". "+params.last_name
+                }
+                return display_string;
+            }
+        },{
+            type: "LatestAnnotation",
+            annotation_type: "user_",
+            api_users_endpoint: "{% url 'api_dispatch_list' resource_name='users' api_name='1.0' %}?username__in={% templatetag openvariable %}usernames_list_string{% templatetag closevariable %}&limit={% templatetag openvariable %}usernames_list_length{% templatetag closevariable %}",
+            container: "LatestAnnotation_container",
+           	filter_by_segment: true,
+           	starts_hidden: true,
+           	hide_without_segment: true,
+           	segments_annotation_type: "découpage",
+           	selectable_annotations: true,
+           	copy_and_edit_button: true,
+           	show_header: false,
+            make_name_string_function: function(params){
+                display_string = params.username;
+                if (params.first_name && params.last_name){
+                    display_string = params.first_name.charAt(0)+". "+params.last_name
+                }
+                return display_string;
+            }
+        },{
+         	type: "CurrentSegmentInfobox",
+         	annotation_type: "découpage",
+         	container: "CurrentSegmentInfobox_container",
+         	empty_message: "Clique sur un segment pour ouvrir le chapitre",
+         	pause_on_segment_end: true
+        }
+        
+      ]
+    }
+    
+    _myPlayer = new IriSP.Metadataplayer(_config);
+	
+  </script>
+</div>
+</body>
+</html>
\ No newline at end of file
diff -r b3fe63cdb3fd -r d7e38162478a server/src/remie/templates/remie/iframe_segments_single.html
--- a/server/src/remie/templates/remie/iframe_segments_single.html	Thu Sep 24 12:25:05 2015 +0200
+++ b/server/src/remie/templates/remie/iframe_segments_single.html	Thu Sep 24 17:24:15 2015 +0200
@@ -26,6 +26,7 @@
     var metadata_key = "metadata"; 
     
     IriSP.libFiles.defaultDir = '{% static "remie/js/" %}';
+    IriSP.libFiles.inDefaultDir.jQuery = 'jquery.js';
     IriSP.libFiles.locations.jwPlayerSWF = '{% static "remie/swf/player.swf" %}';
     IriSP.libFiles.locations.recordMicSwf = '{% static "remie/swf/record_mic.swf" %}';
     IriSP.libFiles.locations.zeroClipboardSwf = '{% static "remie/swf/ZeroClipboard10.swf" %}';
diff -r b3fe63cdb3fd -r d7e38162478a server/src/remie/templates/remie/iframe_teacher.html
--- a/server/src/remie/templates/remie/iframe_teacher.html	Thu Sep 24 12:25:05 2015 +0200
+++ b/server/src/remie/templates/remie/iframe_teacher.html	Thu Sep 24 17:24:15 2015 +0200
@@ -26,6 +26,7 @@
     var metadata_key = "metadata"; 
     
     IriSP.libFiles.defaultDir = '{% static "remie/js/" %}';
+    IriSP.libFiles.inDefaultDir.jQuery = 'jquery.js';
     IriSP.libFiles.locations.jwPlayerSWF = '{% static "remie/swf/player.swf" %}';
     IriSP.libFiles.locations.recordMicSwf = '{% static "remie/swf/record_mic.swf" %}';
     IriSP.libFiles.locations.zeroClipboardSwf = '{% static "remie/swf/ZeroClipboard10.swf" %}';
diff -r b3fe63cdb3fd -r d7e38162478a server/src/remie/templates/remie/iframe_tester.html
--- a/server/src/remie/templates/remie/iframe_tester.html	Thu Sep 24 12:25:05 2015 +0200
+++ b/server/src/remie/templates/remie/iframe_tester.html	Thu Sep 24 17:24:15 2015 +0200
@@ -2,7 +2,7 @@
 <html>
 <head>
 <title>Test</title>
-<script type="text/javascript" src="{% static 'remie/js/jquery.js' %}"></script>
+<script type="text/javascript" src="{% static 'remie/js/jquery.min.js' %}"></script>
 <script type="text/javascript">
 
 	$(document).ready(function(){
@@ -11,11 +11,13 @@
 	    }
 	    
 	    $("#iframe_update_button").click(function(){
-	        var segments_single_url = "{% url 'remie_segments_single' %}";
-	        var segments_group_url = "{% url 'remie_segments_group' %}";
-	        var markers_url = "{% url 'remie_markers' %}";
-	        var teacher_url = "{% url 'remie_teacher' %}";
-	        var scenario_url = ""
+	        var segments_single_url = "{% url 'remie_segments_single' %}",
+	            segments_group_url = "{% url 'remie_segments_group' %}",
+	            markers_url = "{% url 'remie_markers' %}",
+	            teacher_url = "{% url 'remie_teacher' %}",
+	            segments_preview_url = "{% url 'remie_segments_preview' %}",
+	            markers_preview_url = "{% url 'remie_markers_preview' %}",
+	            scenario_url = "";
 	        switch($('input[name=scenario]:checked').attr('id')){
 	            case 'segments_single':
 	                scenario_url = segments_single_url;
@@ -29,6 +31,12 @@
 	            case 'teacher':
 	                scenario_url = teacher_url;
 	            	break;
+	            case 'segments_preview':
+	                scenario_url = segments_preview_url;
+	                break;
+	            case 'markers_preview':
+	                scenario_url = markers_preview_url;
+	                break;
 	        }
 	        
 	        var project_id = $("#project_id_iframe").val();
@@ -115,7 +123,9 @@
   <input id="segments_single" name="scenario" type="radio" value="segments_single" >Elève - Segments, individuel</input><br>
   <input id="segments_group" name="scenario" type="radio" value="segments_group">Elève - Segments, groupe</input><br>
   <input id="markers" name="scenario" type="radio" value="markers">Elève - Marqueurs</input><br>
-  <input id="teacher" name="scenario" type="radio" value="teacher">Professeur - Segments</input>
+  <input id="teacher" name="scenario" type="radio" value="teacher">Professeur - Segments</input><br>
+  <input id="segments_preview" name="scenario" type="radio" value="segments_preview">Visualisation - Segments</input><br>
+  <input id="markers_preview" name="scenario" type="radio" value="markers_preview">Visualisation - Marqueurs</input><br>
   <br><input id="iframe_update_button" type="button" value="Générer"></input>
 </div>
 <div hidden="true">
diff -r b3fe63cdb3fd -r d7e38162478a server/src/remie/views.py
--- a/server/src/remie/views.py	Thu Sep 24 12:25:05 2015 +0200
+++ b/server/src/remie/views.py	Thu Sep 24 17:24:15 2015 +0200
@@ -45,6 +45,22 @@
         return render_to_response(self.template_name, render_data, context_instance=RequestContext(request))
 
 
+class RemieSegmentsPreviewView(View):
+    """
+        The view with the segment-scenario for previews
+    """
+    template_name = "remie/iframe_segments_preview.html"
+    
+    def get(self, request):
+        project_id = request.GET.get("project_id", "") # id of the project we're working on
+        current_user = request.user
+        render_data = {
+            "project_id": project_id,
+            "current_user": current_user.username,
+        }
+        return render_to_response(self.template_name, render_data, context_instance=RequestContext(request))
+    
+
 class RemieMarkersView(View):
     """
         The view with the markers-scenario 
@@ -61,6 +77,22 @@
         return render_to_response(self.template_name, render_data, context_instance=RequestContext(request))
 
 
+class RemieMarkersPreviewView(View):
+    """
+        The view with the markers-scenario 
+    """
+    template_name = "remie/iframe_markers_preview.html"
+    
+    def get(self, request):
+        project_id = request.GET.get("project_id", "") # id of the project we're working on
+        current_user = request.user
+        render_data = {
+            "project_id": project_id,
+            "current_user": current_user.username,
+        }
+        return render_to_response(self.template_name, render_data, context_instance=RequestContext(request))
+
+
 class RemieTeacherView(View):
     """
         The view with the teacher-scenario 
diff -r b3fe63cdb3fd -r d7e38162478a server/src/remieplt/urls.py
--- a/server/src/remieplt/urls.py	Thu Sep 24 12:25:05 2015 +0200
+++ b/server/src/remieplt/urls.py	Thu Sep 24 17:24:15 2015 +0200
@@ -26,7 +26,7 @@
 from django.contrib.auth.decorators import login_required
 
 
-from remie.views import RemieSegmentsSingleView, RemieSegmentsGroupView, RemieMarkersView, RemieTeacherView, RemieIframeTesterView
+from remie.views import RemieSegmentsSingleView, RemieSegmentsGroupView, RemieMarkersView, RemieTeacherView, RemieSegmentsPreviewView, RemieMarkersPreviewView, RemieIframeTesterView
 
 js_info_dict = {
     'packages': ('django.contrib.admin',),
@@ -53,8 +53,10 @@
 
     url(r'^remie/workunit/segments_group$', login_required(RemieSegmentsGroupView.as_view(), login_url=reverse_lazy('cas_login')), name="remie_segments_group"),
     url(r'^remie/workunit/segments_single$', login_required(RemieSegmentsSingleView.as_view(), login_url=reverse_lazy('cas_login')), name="remie_segments_single"),
-    url(r'^remie/workunit/markers', login_required(RemieMarkersView.as_view(), login_url=reverse_lazy('cas_login')), name="remie_markers"),
-    url(r'^remie/workunit/teacher', login_required(RemieTeacherView.as_view(), login_url=reverse_lazy('cas_login')), name="remie_teacher"),
+    url(r'^remie/workunit/segments_preview$', login_required(RemieSegmentsPreviewView.as_view(), login_url=reverse_lazy('cas_login')), name="remie_segments_preview"),
+    url(r'^remie/workunit/markers$', login_required(RemieMarkersView.as_view(), login_url=reverse_lazy('cas_login')), name="remie_markers"),
+    url(r'^remie/workunit/markers_preview$', login_required(RemieMarkersPreviewView.as_view(), login_url=reverse_lazy('cas_login')), name="remie_markers_preview"),
+    url(r'^remie/workunit/teacher$', login_required(RemieTeacherView.as_view(), login_url=reverse_lazy('cas_login')), name="remie_teacher"),
 
     url(r'^/?$', RedirectView.as_view(url='ldt'), name="remie_iframe_container"),