# HG changeset patch
# User hamidouk
# Date 1325088465 -3600
# Node ID 5856fab9596c2e308f3e5f1b2438c03e59b58147
# Parent  b33516ab03e823394048f9d7336a94eba04fd7c2
WIP - adding widget to create annotations.

diff -r b33516ab03e8 -r 5856fab9596c src/css/LdtPlayer.css
--- a/src/css/LdtPlayer.css	Wed Dec 28 17:07:20 2011 +0100
+++ b/src/css/LdtPlayer.css	Wed Dec 28 17:07:45 2011 +0100
@@ -568,3 +568,40 @@
   background:url('imgs/right_handle.gif') no-repeat scroll transparent;
   z-index: 2;
 }
+
+.Ldt-createAnnotationWidget {
+  font-size: 12px;
+  font-family: "Arial",  "Verdana", "sans-serif";
+  background-color:#eeeeee;
+  background:url('imgs/wire_pattern.png') repeat scroll transparent ;
+  border: 1px solid #b6b8b8;
+}
+
+.Ldt-createAnnotation-DoubleBorder {
+  border: 1px solid white;
+  overflow: auto;
+  padding: 7px;
+}
+
+.Ldt-createAnnotation-Title {
+  font-size: 12pt;
+  color : #0068c4;  
+  float: left;
+  margin-right: 5px;
+}
+
+.Ldt-createAnnotation-TimeFrame {
+  font-size: 12pt;
+  color : #ff5589;  
+  float: left;
+}
+
+.Ldt-createAnnotation-userAvatar {
+  float: right;
+}
+
+.Ldt-createAnnotation-Description {
+  width: 470px;
+  height: 56px;
+  float: left;
+}
\ No newline at end of file
diff -r b33516ab03e8 -r 5856fab9596c src/js/widgets/createAnnotationWidget.js
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/src/js/widgets/createAnnotationWidget.js	Wed Dec 28 17:07:45 2011 +0100
@@ -0,0 +1,48 @@
+IriSP.createAnnotationWidget = function(Popcorn, config, Serializer) {
+  IriSP.Widget.call(this, Popcorn, config, Serializer);
+  this._hidden = true;
+};
+
+
+IriSP.createAnnotationWidget.prototype = new IriSP.Widget();
+
+IriSP.createAnnotationWidget.prototype.clear = function() {
+    this.selector.find(".Ldt-SaTitle").text("");
+    this.selector.find(".Ldt-SaDescription").text("");
+    this.selector.find(".Ldt-SaKeywordText").text("");
+};
+
+IriSP.createAnnotationWidget.prototype.showWidget = function() {
+  this.layoutManager.slice.after("ArrowWidget")
+                          .before("createAnnotationWidget")
+                          .jQuerySelector().hide();
+  this.selector.show();
+};
+
+IriSP.createAnnotationWidget.prototype.hideWidget = function() {
+  this.selector.hide();
+  this.layoutManager.slice.after("ArrowWidget")
+                          .before("createAnnotationWidget")
+                          .jQuerySelector().show();
+};
+
+IriSP.createAnnotationWidget.prototype.draw = function() {
+  var _this = this;
+
+  var annotationMarkup = IriSP.templToHTML(IriSP.createAnnotationWidget_template);
+	this.selector.append(annotationMarkup);
+  this.selector.hide();
+  
+  this._Popcorn.listen("IriSP.PlayerWidget.AnnotateButton.clicked", 
+                        IriSP.wrap(this, this.handleAnnotateSignal));
+};
+
+IriSP.createAnnotationWidget.prototype.handleAnnotateSignal = function() {
+  if (this._hidden == false) {
+    this.selector.hide();
+    this._hidden = true;
+  } else {
+    this.selector.show();
+    this._hidden = false;
+  }
+};
\ No newline at end of file
diff -r b33516ab03e8 -r 5856fab9596c src/templates/createAnnotationWidget.html
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/src/templates/createAnnotationWidget.html	Wed Dec 28 17:07:45 2011 +0100
@@ -0,0 +1,21 @@
+{{! template for the annotation creation widget }}
+<div class='Ldt-createAnnotationWidget'>
+  <!-- ugly div because we want to have a double border -->
+  <div class='Ldt-createAnnotation-DoubleBorder'>
+    <div style='margin-bottom: 7px; overflow: auto;'>
+      <div class='Ldt-createAnnotation-Title'>310</div>
+      <div class='Ldt-createAnnotation-TimeFrame'>(03:10-07:45)</div>
+    </div>
+    
+    <div style='overflow: auto;'>
+      <textarea class='Ldt-createAnnotation-Description'></textarea>
+      <img src='{{img_dir}}/profile_arrow.png' class='Ldt-createAnnotation-profileArrow'></img>
+      <div class='Ldt-createAnnotation-userAvatar'>
+        <img class='Ldt-createAnnotation-userAvatar'src='https://si0.twimg.com/sticky/default_profile_images/default_profile_1_normal.png'></img>
+      </div> 
+    </div>
+    
+    <div class='Ldt-createAnnotation-keywords'>Add keywords : </div>          
+    <div class='Ldt-createAnnotation-submitButton'>Submit</div>
+  </div>
+</div>
diff -r b33516ab03e8 -r 5856fab9596c test/integration/polemic.htm
--- a/test/integration/polemic.htm	Wed Dec 28 17:07:20 2011 +0100
+++ b/test/integration/polemic.htm	Wed Dec 28 17:07:45 2011 +0100
@@ -108,6 +108,12 @@
 						  format:'cinelab',
 						  src:'polemic_fr.json',
 						  type:'json'}
+						},
+            {type: "createAnnotationWidget",
+						 metadata:{
+						  format:'cinelab',
+						  src:'polemic_fr.json',
+						  type:'json'}
 						}      
             ]
         },