# HG changeset patch
# User veltr
# Date 1354205483 -3600
# Node ID e034099276f60e5a078654c6744b145ceec069e6
# Parent  97fef7a4b1891ae54350e3de89dd4306a7fee304
Added keyword passing between related videos

diff -r 97fef7a4b189 -r e034099276f6 src/js/init.js
--- a/src/js/init.js	Wed Nov 21 16:33:51 2012 +0100
+++ b/src/js/init.js	Thu Nov 29 17:11:23 2012 +0100
@@ -74,7 +74,7 @@
 IriSP.Metadataplayer.prototype.onLibsLoaded = function() {
     IriSP.log("IriSP.Metadataplayer.prototype.onLibsLoaded");
     if (typeof IriSP.jQuery === "undefined" && typeof window.jQuery !== "undefined") {
-        IriSP.jQuery = window.jQuery.noConflict();
+        IriSP.jQuery = window.jQuery;
     }
     if (typeof IriSP._ === "undefined" && typeof window._ !== "undefined") {
         IriSP._ = window._;
@@ -93,12 +93,28 @@
       
     this.widgets = [];
     var _this = this;
-    for(var i = 0; i < this.config.widgets.length; i++) {
-        this.loadWidget(this.config.widgets[i], function(_widget) {
-            _this.widgets.push(_widget)
+    IriSP._(this.config.widgets).each(function(widgetconf, key) {
+        _this.widgets.push(null);
+        _this.loadWidget(widgetconf, function(widget) {
+            _this.widgets[key] = widget;
         });
-    };
+    });
     this.$.find('.Ldt-Loader').detach();
+    
+    var endload = false;
+    
+    this.on("widget-loaded", function() {
+        if (endload) {
+            return;
+        }
+        var isloaded = !IriSP._(_this.widgets).any(function(w) {
+            return !(w && w.isLoaded())
+        });
+        if (isloaded) {
+            endload = true;
+            _this.trigger("widgets-loaded");
+        }
+    });   
 }
 
 IriSP.Metadataplayer.prototype.loadMetadata = function(_metadataInfo) {
diff -r 97fef7a4b189 -r e034099276f6 src/js/widgets.js
--- a/src/js/widgets.js	Wed Nov 21 16:33:51 2012 +0100
+++ b/src/js/widgets.js	Thu Nov 29 17:11:23 2012 +0100
@@ -17,13 +17,15 @@
 
 
 IriSP.Widgets.Widget = function(player, config) {
-
+    
     if( typeof player === "undefined") {
         /* Probably an abstract call of the class when
          * individual widgets set their prototype */
         return;
     }
     
+    this.__subwidgets = [];
+    
     /* Setting all the configuration options */
     var _type = config.type,
         _config = IriSP._.defaults({}, config, player.config.default_options, this.defaults),
@@ -57,6 +59,7 @@
         }
         
         _this.draw();
+        player.trigger("widget-loaded");
     });
    
     /* Adding classes and html attributes */
@@ -137,11 +140,20 @@
     });
 }
 
+IriSP.Widgets.Widget.prototype.isLoaded = function() {
+    var isloaded = !IriSP._(this.__subwidgets).any(function(w) {
+        return !(w && w.isLoaded());
+    });
+    return isloaded;
+}
+
 IriSP.Widgets.Widget.prototype.insertSubwidget = function(_selector, _widgetoptions, _propname) {
     var _id = _selector.attr("id"),
         _this = this,
         _type = _widgetoptions.type,
-        $L = $LAB;
+        $L = $LAB,
+        key = this.__subwidgets.length;
+    this.__subwidgets.push(null);
     if (typeof _id == "undefined") {
         _id = IriSP._.uniqueId(this.container + '_sub_widget_' + _widgetoptions.type);
         _selector.attr("id", _id);
@@ -157,6 +169,7 @@
             if (_propname) {
                 _this[_propname] = _widget;
             }
+            _this.__subwidgets[key] = _widget;
         });
     });
 }
diff -r 97fef7a4b189 -r e034099276f6 src/widgets/Annotation.css
--- a/src/widgets/Annotation.css	Wed Nov 21 16:33:51 2012 +0100
+++ b/src/widgets/Annotation.css	Thu Nov 29 17:11:23 2012 +0100
@@ -19,8 +19,6 @@
     background: url(img/pinstripe.png);
     padding: 5px;
     margin: 0;
-    max-height: 300px;
-    overflow: auto;
 }
 
 .Ldt-Annotation-Inner h3 {
@@ -29,6 +27,11 @@
     font-weight: bold;
 }
 
+.Ldt-Annotation-Description {
+    max-height: 150px;
+    overflow: auto;
+}
+
 .Ldt-Annotation-Cleared {
     clear: both;
 }
diff -r 97fef7a4b189 -r e034099276f6 src/widgets/KnowledgeConcierge.css
--- a/src/widgets/KnowledgeConcierge.css	Wed Nov 21 16:33:51 2012 +0100
+++ b/src/widgets/KnowledgeConcierge.css	Thu Nov 29 17:11:23 2012 +0100
@@ -10,6 +10,11 @@
     display: none;
 }
 
+.Ldt-Kc-Related-Empty {
+    text-align: center; font-weight: bold; font-style: italic;
+    font-size: 14px; color: #999999; margin: 5px 0;
+}
+
 .Ldt-Kc-Related h2 {
     border: none;
     color: #330099;
@@ -51,7 +56,7 @@
     max-width: 80px; max-height: 60px; float: left;
 }
 
-.Ldt-Kc-Related-Item h3, p {
+.Ldt-Kc-Related-Item h3, .Ldt-Kc-Related-Item p {
     margin: 0 0 5px 85px;
 }
 
diff -r 97fef7a4b189 -r e034099276f6 src/widgets/KnowledgeConcierge.js
--- a/src/widgets/KnowledgeConcierge.js	Wed Nov 21 16:33:51 2012 +0100
+++ b/src/widgets/KnowledgeConcierge.js	Thu Nov 29 17:11:23 2012 +0100
@@ -20,20 +20,22 @@
     "fr": {
         related_videos: "Vidéos liées",
         duration_: "Durée&nbsp;:",
-        for_keywords_: "pour le(s) mots-clé(s)&nbsp;:"
+        for_keywords_: "pour le(s) mots-clé(s)&nbsp;:",
+        no_matching_videos: "Pas de vidéos correspondantes"
     },
     "en": {
         related_videos: "Related Videos",
         duration_: "Duration:",
-        for_keywords_: "for keyword(s):"
+        for_keywords_: "for keyword(s):",
+        no_matching_videos: "No matching videos"
     }
 }
 
 IriSP.Widgets.KnowledgeConcierge.prototype.template =
     '<div class="Ldt-Kc-Slider"></div><canvas class="Ldt-Kc-Canvas" />'
-    + '<div class="Ldt-Kc-Waiting"></div>'
     + '<div class="Ldt-Kc-Related"><h2>{{ l10n.related_videos }}</h2>'
     + '<h3 class="Ldt-Kc-For-Keywords">{{l10n.for_keywords_}} <span class="Ldt-Kc-Keywords"></span></h3>'
+    + '<div class="Ldt-Kc-Waiting"></div>'
     + '<div class="Ldt-Kc-Related-List"></div></div>';
 
 IriSP.Widgets.KnowledgeConcierge.prototype.draw = function() {
@@ -58,8 +60,8 @@
         currentNodesList = "",
         relatedCache = {},
         relatedRequests = {},
-        relatedTemplate = '<div class="Ldt-Kc-Related-Item"><a href="{{ widget.video_url_base }}{{ media.iri_id }}"><img src="{{ media.image }}"></a>'
-            + '<h3><a href="{{ widget.video_url_base }}{{ media.iri_id }}">{{ media.title }}</a></h3><p>{{ description }}</p>'
+        relatedTemplate = '<div class="Ldt-Kc-Related-Item"><a href="{{ widget.video_url_base }}{{ media.iri_id }}#keyword={{ escaped_keyword }}"><img src="{{ media.image }}"></a>'
+            + '<h3><a href="{{ widget.video_url_base }}{{ media.iri_id }}#keyword={{ escaped_keyword }}">{{ media.title }}</a></h3><p>{{ description }}</p>'
             + '<p>{{ widget.l10n.duration_ }} <span class="Ldt-Kc-Item-Duration">{{ duration }}</span></p>'
             + '</a><div class="Ldt-Kc-Clearer"></div></div>';
             
@@ -67,19 +69,20 @@
     
     function renderRelated() {
         var keywords = currentNodesList;
+        _this.$.find(".Ldt-Kc-Related").show();
         if (typeof relatedCache[keywords] === "undefined") {
             return;
         }
         _this.$.find(".Ldt-Kc-Waiting").hide();
         if (relatedCache[keywords].length) {
-            _this.$.find(".Ldt-Kc-Keywords").html(keywords.replace(/\,/g,", "));
             var _html = '<div class="Ldt-Kc-Row">';
             IriSP._(relatedCache[keywords]).each(function(media, i) {
                 var _tmpldata = {
                     widget: _this,
                     media: media,
                     description: media.description.replace(/(\n|\r|\r\n)/mg,' ').replace(/(^.{120,140})[\s].+$/m,'$1&hellip;'),
-                    duration: new IriSP.Model.Time(media.duration).toString()
+                    duration: new IriSP.Model.Time(media.duration).toString(),
+                    escaped_keyword: encodeURIComponent(keywords.split(",")[0])
                 }
                 _html += Mustache.to_html(relatedTemplate, _tmpldata);
                 if (i % 2) {
@@ -88,9 +91,8 @@
             });
             _html += '</div>';
             _this.$.find(".Ldt-Kc-Related-List").html(_html);
-            _this.$.find(".Ldt-Kc-Related").show();
         } else {
-            _this.$.find(".Ldt-Kc-Related").hide();
+            _this.$.find(".Ldt-Kc-Related-List").html("<p class='Ldt-Kc-Related-Empty'>" + _this.l10n.no_matching_videos + "</p>");
         }
     }    
 
@@ -134,9 +136,10 @@
     
     function showRelated(nodetexts) {
         currentNodesList = nodetexts;
+        _this.$.find(".Ldt-Kc-Related-List").html("");
+        _this.$.find(".Ldt-Kc-Keywords").html(nodetexts.replace(/\,/g,", "));
         if (typeof relatedCache[nodetexts] === "undefined") {
             _this.$.find(".Ldt-Kc-Waiting").show();
-            _this.$.find(".Ldt-Kc-Related").hide();
             if (relatedRequests[nodetexts]) {
                 return;
             }
@@ -208,7 +211,7 @@
             setTimeout(bindJavascript, 1000); 
         }
     }
-    var currentSelection = null, lockMode = false;
+    var currentSelection = null;
     var _fns = {
         adjacentnodes: function(id, proj, adj, both) {
             jQuery.ajax({
@@ -274,7 +277,7 @@
         },
         mousemove: function(selection) {
             if (selection !== currentSelection) {
-                if (selection && !lockMode) {
+                if (selection) {
                     triggerSearch(selection.name);
                 }
                 currentSelection = selection;
@@ -282,12 +285,10 @@
         },
         click: function(selection) {
             if (selection) {
-                lockMode = true;
                 triggerSearch(selection.name);
                 showRelated(selection.name);
             } else {
-                lockMode = false;
-                triggerSearch()
+                triggerSearch();
             }
         }
     }
@@ -320,6 +321,13 @@
         });
     });
     
+    var keywmatch = document.location.hash.match(/keyword=([^#?&]+)/);
+    if (keywmatch) {
+        this.player.on("widgets-loaded", function() {
+            triggerSearch(keywmatch[1]);
+        })
+    }
+    
     bindJavascript();
     
 }