# HG changeset patch
# User obledc
# Date 1378812510 -7200
# Node ID 3648b6dea2cc4fc419d8b5a173093c7efb00ff4f
# Parent  d32f123bfb9eaf702ecacd8d1bd4421d84855405
new

diff -r d32f123bfb9e -r 3648b6dea2cc alcatel/static/js/annotation-article.js
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/alcatel/static/js/annotation-article.js	Tue Sep 10 13:28:30 2013 +0200
@@ -0,0 +1,389 @@
+$(function() {
+
+    $(".fancybox").fancybox();
+    $('.font-up a').click(function(){
+        var taille_police=parseFloat($('.content').css('font-size'),100)+2;
+        if(taille_police<30){
+            var taille_ligne=parseFloat($('.content').css('line-height'),100)+2;
+            $('.content').css({
+                'line-height':taille_ligne+'px',
+                'font-size':taille_police+'px'
+            });
+        }
+        return false;
+    });
+    $('.font-down a').click(function(){
+        var taille_police=parseFloat($('.content').css('font-size'),100)-2;
+        if(taille_police>11){
+            var taille_ligne=parseFloat($('.content').css('line-height'),100)-2;
+            $('.content').css({
+                'line-height':taille_ligne+'px',
+                'font-size':taille_police+'px'
+            });
+        }
+        return false;
+    });
+    
+    /* ANNOTATION HANDLING */
+    
+    var basenode = $(".content")[0],
+        cleanHtml = cleanTextNodes(basenode).innerHtml,
+        textinfo = parseContents(basenode);
+        
+    window.annotations = window.annotations || [];
+    
+    var colors = ["#ff8", "#f88", "#8f8", "#8ff", "#f8f", "#88f"],
+        currentVisibleFrame = null,
+        ncol = 0,
+        mousedown = false,
+        shownByClick = false,
+        dragging = false;
+    
+    function cleanText(txt, keepbefore, keepafter) {
+        var res = txt.replace(/[\n\r\t]+/gm,' ').replace(/ {2,}/g,' ');
+        if (!keepbefore) {
+            res = res.replace(/^ +/,'');
+        }
+        if (!keepafter) {
+            res = res.replace(/ +$/,'');
+        }
+        return res;
+    }
+    
+    function recursiveParse(node, info) {
+        var children = node.childNodes;
+        for (var i = 0, l = children.length; i < l; i++) {
+            var childnode = children[i];
+            switch(childnode.nodeType) {
+                case node.ELEMENT_NODE:
+                    recursiveParse(childnode, info);
+                break;
+                case node.TEXT_NODE:
+                    var startpos = info.text.length;
+                    info.text += childnode.textContent;
+                    var endpos = info.text.length,
+                        nodeinfo = {
+                            start: startpos,
+                            end: endpos,
+                            length: endpos - startpos,
+                            textNode: childnode
+                        };
+                    childnode._nodeInfo = nodeinfo;
+                    info.nodes.push(nodeinfo);
+                break;
+            }
+        }
+    }
+    
+    
+    function parseContents(node) {
+        var res = {
+            text: '',
+            nodes: []
+        };
+        recursiveParse(node, res);
+        return res;
+    }
+    
+    function cleanTextNodes(node) {
+        var children = node.childNodes;
+        for (var i = 0, l = children.length; i < l; i++) {
+            var childnode = children[i];
+            switch(childnode.nodeType) {
+                case node.ELEMENT_NODE:
+                    cleanTextNodes(childnode);
+                break;
+                case node.TEXT_NODE:
+                    var keepbefore = (i && children[i-1].nodeType == node.ELEMENT_NODE),
+                        keepafter = (i < l-1 && children[i+1].nodeType == node.ELEMENT_NODE);
+                    childnode.textContent = cleanText(childnode.textContent, keepbefore, keepafter);
+                break;
+            }
+        }
+        return node;
+    }
+    
+    function highlightText(start, end, color) {
+		alert('start'+start);
+		alert('end'+end);
+		alert('color'+color);
+
+		alert('textinfo.text.substring(start, end)'+textinfo.text.substring(start, end));
+		alert('currentDocumentaryFile'+currentDocumentaryFile);
+		
+		
+        var annotation = {
+            startOffset: start,
+            length: end - start,
+            color: color,
+            comment: "",
+            creator: "cobled",
+            tags: [],
+            annotatedText: textinfo.text.substring(start, end),
+            beforeText: textinfo.text.substring(start - 40, start).replace(/^[\S]*\s+/,''),
+            afterText: textinfo.text.substring(end, end + 40).replace(/\s+[\S]*$/,''),
+            documentaryFile: currentDocumentaryFile
+        }
+			alert('highlightText');
+        annotations.push(annotation);
+			alert('highlightText');
+        showAnnotation(annotation, true);
+			alert('highlightText');
+        updateAnnotationCounts();
+			alert('highlightText');
+    }
+    
+    var frameTpl = _.template(
+        '<div class="annotation-frame" style="border-color: <%- annotation.color %>; top: <%-top %>px; left: <%- left %>px;">'
+        + '<div class="annotation-area" style="background-color: <%- annotation.color %>; height: <%- height %>px;"></div>'
+        + '<form class="annotation-form"><h3>Annoté par&nbsp;: <em><%- annotation.creator.name %></em></h3>'
+        + '<h3>Dossier documentaire&nbsp;: <em><%- annotation.documentaryFile.name %></em></h3><h3>Commentaire&nbsp;:</h3>'
+        + '<% if (editable) { %><textarea class="annotation-textarea" placeholder="Mon commentaire&hellip;"><%- annotation.comment || "" %></textarea>'
+        + '<% } else { %><p><%- annotation.comment || "(sans commentaire)" %></p><% } %>'
+        + '<h3>Mots-clés&nbsp;:</h3>'
+        + '<ul class="<%- editable ? "annotation-tags-form" : "" %>"><% _(annotation.tags).forEach(function(tag) { %><li><%- tag %></li><% }) %></ul>'
+        + '<% if (editable) { %><h3><input class="annotation-public" type="checkbox" <% if (annotation.isPublic) {%>checked <% } %>/>Annotation publique</h3><div><a class="annotation-remove" href="#">Supprimer</a><input class="annotation-submit" type="submit" value="Enregistrer" /></div><% } %>'
+        + '</form></div>'
+    );
+    
+    var liTpl = _.template(
+        '<li style="border-color: <%- annotation.color %>;"><div class="annotation-longview"><h3>Texte annoté&nbsp;:</h3></div>'
+        + '<p class="annotation-text"><%- annotation.beforeText %><b><%- annotation.annotatedText %></b><%- annotation.afterText %></p>'
+        + '<h3>Annoté par&nbsp;: <em><%- annotation.creator.name %></em></h3>'
+        + '<div class="annotation-longview"><h3>Commentaire&nbsp;:</h3><p class="annotation-comment"><%- annotation.comment || "(Sans commentaire)" %></p>'
+        + '<h3>Mots-clés&nbsp;:</h3><p class="annotation-tags"><%- (annotation.tags || []).join(", ") || "(aucun mot-clé)" %></p></div>'
+        + '</li>'
+    );
+    
+    function showFrameBox() {
+        if (currentVisibleFrame) {
+            $(".annotation-frame-box").show();
+            var offset = currentVisibleFrame.offset(),
+                width = currentVisibleFrame.outerWidth(),
+                height = currentVisibleFrame.outerHeight();
+            $(".annotation-fb-top").css({
+                height: offset.top - 77
+            });
+            $(".annotation-fb-left").css({
+                top: offset.top,
+                height: height,
+                width: offset.left
+            });
+            $(".annotation-fb-right").css({
+                top: offset.top,
+                height: height,
+                left: offset.left + width
+            });
+            var fbbtop = offset.top + height;
+            $(".annotation-fb-bottom").css({
+                top: fbbtop,
+                height: ($("body").height() - fbbtop)
+            });
+            currentVisibleFrame.find(".annotation-textarea").focus();
+        } else {
+            $(".annotation-frame-box").hide();
+        }
+    }
+    
+    function hideAllFrames() {
+        if (currentVisibleFrame) {
+            currentVisibleFrame.hide();
+        }
+        
+        currentVisibleFrame = null;
+        showFrameBox();
+        $(".annotation-blocks li").removeClass("selected");
+    }
+    
+    function showAnnotation(annotation, editAfterShow) {
+        var start = annotation.startOffset,
+            end = annotation.length + start,
+            color = annotation.color;
+        var spans = [];
+        
+        for (var i = 0, l = textinfo.nodes.length; i < l; i++) {
+            var nodeinfo = textinfo.nodes[i];
+            if (nodeinfo.end > start && nodeinfo.start <= end) {
+                var r = document.createRange(),
+                    s = document.createElement('span'),
+                    rangestart = Math.max(0, start - nodeinfo.start),
+                    rangeend = Math.min(nodeinfo.length, end - nodeinfo.start);
+                s.style.backgroundColor = color;
+                r.setStart(nodeinfo.textNode, rangestart);
+                r.setEnd(nodeinfo.textNode, rangeend);
+                r.surroundContents(s);
+                spans.push(s);
+            }
+        }
+        
+        textinfo = parseContents(basenode);
+        var top = Math.min.apply(Math, spans.map(function(s) { return s.offsetTop })),
+            height = Math.max.apply(Math, spans.map(function(s) { return s.offsetHeight + s.offsetTop })) - top,
+            frame = $(frameTpl({
+                annotation: annotation,
+                editable: (currentUser.id === annotation.creator.id),
+                top: top,
+                height: height,
+                left: basenode.offsetLeft
+            })),
+            li = $(liTpl({
+                annotation: annotation
+            }));
+        
+        $(".annotation-frames").append(frame);
+        $(annotation.documentaryFile.id === currentDocumentaryFile.id ? ".annotation-file-list" : ".annotation-other-list").append(li);
+        
+        frame.find(".annotation-textarea").on("keyup paste input change", function() {
+            annotation.comment = $(this).val();
+            li.find(".annotation-comment").text(annotation.comment || "(Sans commentaire)");
+        });
+        
+        frame.find(".annotation-public").change(function() {
+            annotation.isPublic = $(this).is(":checked");
+        });
+        
+        frame.find("")
+        
+        var ontagchange = function(evt, ui) {
+            annotation.tags = $(this).tagit("assignedTags");
+            li.find(".annotation-tags").text((annotation.tags || []).join(", ") || "(aucun mot-clé)");
+        };
+        
+        frame.find(".annotation-tags-form").tagit({
+            afterTagAdded: ontagchange,
+            afterTagRemoved: ontagchange
+        });
+        
+        var show = function() {
+            if (mousedown) {
+                return;
+            }
+            shownByClick = false;
+            currentVisibleFrame = frame;
+            frame.show();
+            showFrameBox();
+            li.addClass("selected");
+        }
+                
+        $(spans).mouseenter(show);
+        
+        frame
+            .mouseleave(function() {
+                if (!shownByClick) {
+                    hideAllFrames();
+                }
+            })
+            .click(function() {
+                shownByClick = true;
+            });
+        
+        frame.find(".annotation-form").submit(function() {
+            hideAllFrames();
+            return false;
+        });
+        
+        frame.find(".annotation-remove").click(function() {
+            annotations = _(annotations).reject(function(a) {
+                return a === annotation
+            });
+            $(spans).css("background-color","").off("mouseenter",show);
+            li.remove();
+            frame.remove();
+            hideAllFrames();
+            updateAnnotationCounts();
+            return false;
+        });
+        
+        li
+            .mouseenter(function() {
+                $(spans).addClass("annotation-selected");
+                li.addClass("selected");
+                li.find(".annotation-longview").stop().slideDown();
+            })
+            .mouseleave(function() {
+                $(spans).removeClass("annotation-selected");
+                li.removeClass("selected");
+                li.find(".annotation-longview").stop().slideUp();
+            })
+            .click(function() {
+                show();
+                shownByClick = true;
+                $(window).scrollTop(currentVisibleFrame.offset().top - 100);
+            });
+        
+        if (editAfterShow) {
+            show();
+            shownByClick = true;
+        }
+        
+    }
+    
+    function updateAnnotationCounts() {
+        $(".annotation-blocks .block").each(function() {
+            var $this = $(this), n = $this.find("li").length;
+            $this.find(".annotations-count").text(n || "aucune");
+            if (n > 1) {
+                $this.find(".annotation-plural").show();
+            } else {
+                $this.find(".annotation-plural").hide();
+            }
+        })
+    }
+    
+    annotations.forEach(function(annotation) {
+        showAnnotation(annotation);
+    });
+    updateAnnotationCounts();
+    
+    var range = null;
+        
+    $(".content").mouseup(function(e) {
+        range = document.getSelection().getRangeAt(0);
+        var addann = $(".add-annotation");
+        if (!range.collapsed && range.startContainer._nodeInfo && range.endContainer._nodeInfo && range.toString() !== " ") {
+            addann.show();
+            var doc = $(document), rect = range.getBoundingClientRect();
+            addann.css({
+                left: doc.scrollLeft() + rect.right + 5,
+                top: doc.scrollTop() + (rect.top + rect.bottom - addann.outerHeight()) / 2,
+            });
+        } else {
+            range = null;
+            $(".add-annotation").hide();
+        }
+    }).mousedown(function() {
+        $(".add-annotation").hide();
+    });
+    
+    $(".add-annotation").click(function() {
+		
+        $(".add-annotation").hide();
+        if (range) {
+			
+            var start = range.startOffset + range.startContainer._nodeInfo.start,
+                end = range.endOffset + range.endContainer._nodeInfo.start;
+				
+            highlightText(start, end, colors[ncol++ % colors.length]);
+            document.getSelection().removeAllRanges();
+        }
+    });
+            
+    $(window).mouseup(function() {
+        mousedown = false;
+        dragging = false;
+    });
+    
+    $(".annotation-frame-box").click(hideAllFrames);
+    
+    $(window).resize(function() {
+        showFrameBox();
+        $(".annotation-frame").css({
+            left: basenode.offsetLeft
+        })
+    });
+    
+    $(".add-annotation").css({
+        left: (basenode.offsetLeft + 500)
+    });
+
+});
diff -r d32f123bfb9e -r 3648b6dea2cc alcatel/static/js/cluster.js
--- a/alcatel/static/js/cluster.js	Tue Sep 10 13:28:15 2013 +0200
+++ b/alcatel/static/js/cluster.js	Tue Sep 10 13:28:30 2013 +0200
@@ -33,9 +33,13 @@
 		for (i = 0; i < json.documents.length; i++)
 		{
 			
-			content += "<div class=\"article\"><div class=\"inner-article clearfix\"><h2><a id=\""+json.documents[i].id+"\" title=\"Lire l\'article\" href=\"http://localhost:8000/article/"+json.cluster_title+"/"+json.documents[i].id+"\">";
+			//content += "<div class=\"article\"><div class=\"inner-article clearfix\"><h2><a id=\""+json.documents[i].id+"\" title=\"Lire l\'article\" href=\"http://localhost:8000/article/"+json.documents[i].id+"\">";
+			
+			
+			content += "<div class=\"article\"><div class=\"inner-article clearfix\"><h2><form id=\"myarticle"+json.documents[i].id+"\" method=\"post\" action=\"/article/"+json.documents[i].id+"/\" ><input type=\"hidden\" id=\"urlCluster\" name=\"urlCluster\"  value=\""+document.URL+"\"><input type=\"hidden\" id=\"clustertitle\" name=\"clustertitle\"  value=\""+json.cluster_title+"\"><a  onclick=\"articleSubmit("+json.documents[i].id+"); return false;\" style=\"cursor:pointer;\">";
+			
 			content += json.documents[i].title;
-			content += " »</a></h2><p class=\"author\"><a href=\"#\">";
+			content += " »</a></form></h2><p class=\"author\"><a href=\"#\">";
 			content += json.documents[i].date;
 			content += " </a><br/> by <a href=\"#\">";
 			content += json.documents[i].author[0].name;
@@ -48,7 +52,10 @@
 		$(content).appendTo("#right");
 }
 
-
+function articleSubmit(id)
+{
+	$('#myarticle'+id).submit();	
+}
 		
 $(function(){
 				
diff -r d32f123bfb9e -r 3648b6dea2cc alcatel/static/js/dossierdoc.js
--- a/alcatel/static/js/dossierdoc.js	Tue Sep 10 13:28:15 2013 +0200
+++ b/alcatel/static/js/dossierdoc.js	Tue Sep 10 13:28:30 2013 +0200
@@ -1,5 +1,12 @@
 var currentid=0;
 
+function addslashes(ch) {
+ch = ch.replace(/\\/g,"\\\\")
+ch = ch.replace(/\'/g,"\\'")
+ch = ch.replace(/\"/g,"\\\"")
+return ch
+}
+
 function dossiers(json)
 		{
 
@@ -12,7 +19,7 @@
 				content += json.documentary_files[i].url_image;
 				content += "\" alt=\"\" height=\"50px\" width=\"50px\" ><p>";
 				content += json.documentary_files[i].description;
-				content += " </p></div></div><div class=\"dossier-col-right\"><ul class=\"annotations\"><li><a class=\"share\" href=\"#\"></a></li><li><a class=\"favorite\" href=\"#\"></a></li><li><form id=\"ajaxdeletedossierdoc";
+				content += " </p></div></div><div class=\"dossier-col-right\"><ul class=\"annotations\"><li><a class=\"share\" href=\"#\"></a></li><li><a class=\"favorite\" href=\"#\"></a></li><li title=\"Supprimer le dossier\"><form id=\"ajaxdeletedossierdoc";
 				content += json.documentary_files[i].id;	
 				content += "\" action=\"/documentary_file_delete/";
 				content += json.documentary_files[i].id;	
@@ -22,7 +29,22 @@
 				content += json.documentary_files[i].id;	
 				content += "); return false;\"></a></form>";
 							
-				content += "</li><li><a class=\"edit\" href=\"#\"></a></li></ul><h3>";
+				content += "</li>";
+				
+				content += "<li><a class=\"favorite\" href=\"#\"></a></li><li title=\"Modifier le dossier\"><a class=\"edit\" onclick=\"modifyDossierDocHome('";
+				content += addslashes(json.documentary_files[i].title);	
+				content += "','";
+				content += json.user;	
+				content += "','";
+				content += addslashes(json.documentary_files[i].description);	
+				content +="',";
+				content += json.documentary_files[i].id
+				content += "); return false;\"></a>";							
+				content += "</li>";
+
+				//content += "<li title=\"Modifier le dossier\"><a class=\"edit\" href=\"#\"></a></li>";
+				
+				content += "</ul><h3>";
 				content += json.documentary_files[i].nb_articles;
 				content += " articles </h3><ul class=\"links\">";
 				
@@ -51,6 +73,13 @@
 			$(content).appendTo("#right");
 		}
 
+/*<div id=\"modify-form\" title=\"Modifier le dossier documentaire\"><form id=\"ajaxdocumentaryfilemodify\" method=\"post\" action=\"/documentary_file_modify/\">{% csrf_token %}<fieldset><label for=\"title\">Titre du dossier</label><input type=\"text\" name=\"title\" id=\"title\" class=\"text ui-widget-content ui-corner-all\" value=\"";
+			content += json.documentary_files[i].title;
+			content += "\" /><label for=\"description\">Description</label><input type=\"text\" name=\"description\" id=\"description\" value=\"";
+			content += json.documentary_files[i].description;
+			content += "\" class=\"text ui-widget-content ui-corner-all\" /></fieldset></form></div>*/
+			
+			
 /*function dossiers(json)
 		{
 			content = "<div class=\"dossiers\"><ul>";
@@ -98,7 +127,8 @@
 function dossierDocHome(id)
 {
 	//alert('dossierDocHome');
-	alert('dossierDocHome');
+	//alert('dossierDocHome');
+	currentid = id;
 	$('#ajaxdossierdochome'+id).submit();	
 }
 
@@ -110,6 +140,24 @@
 }
 
 
+
+function modifyDossierDocHome(title,user,description,id)
+{
+	currentid = id;
+	var elem = document.getElementById("descriptionmodif");
+	elem.value = description;
+	var elem = document.getElementById("titlemodif");
+	elem.value = title;
+	var elem = document.getElementById("documentary_file_id");
+	elem.value = id;
+	var elem = document.getElementById("user");
+	elem.value = user;
+	
+	$( "#dialog-form2" ).dialog("open");
+	
+	//$('#ajaxmodifydossierdoc'+id).submit();	
+}
+
 $(function()
 {
 	$('#recherche_button_doc').click(function() 
@@ -157,7 +205,7 @@
 		$('#create-dossierDoc').show();
 	});
 			
-	$('#ajaxdossierdochome').submit(function() 
+	$('#ajaxdossierdochome'+currentid).submit(function() 
 	{
 		alert('ajaxdossierdochome10');
 		//var urlSubmit = $(this).attr('action');		
@@ -165,7 +213,7 @@
 	
 	$('.trash').click(function (event)
 	{ 
-	alert('enter');
+	//alert('enter');
 	var urlSubmit = $(this).attr('href');
      
      $.ajax({
@@ -179,6 +227,27 @@
 });
 
 
+$('#ajaxmodifydossierdoc'+currentid).submit(function() 
+	{
+		    alert('ajaxmodifydossierdoc');
+			var urlSubmit = $(this).attr('action');
+			$.ajax(
+			{  
+				type: "POST",
+				url: urlSubmit,
+				data      : $(this).serializeArray(),
+				success: function(data) 
+				{
+					alert('SUCCESS');
+					
+					//var json = jQuery.parseJSON(data);
+					//alert('SUCCESS'+json);
+					//updatedossierdoc(json);
+				}
+			});
+			return false;
+		});
+		
 $('#ajaxdeletedossierdoc'+currentid).submit(function() 
 	{
 		alert('ajaxdeletedossierdoc'+currentid);
@@ -198,6 +267,27 @@
 			});
 			return false;
 		});
-	
+
+$( "#dialog-form2" ).dialog({
+		autoOpen: false,
+		height: 280,
+		width: 350,
+		modal: false,
+		buttons: {
+		"Modifier dossier": function() {
+			$('#ajaxdocumentaryfilemodify').submit();
+			$( this ).dialog( "close" );
+		},
+		"Annuler": function() {
+		
+		$( this ).dialog( "close" );
+		}
+		},
+		close: function() {
+			allFields.val( "" ).removeClass( "ui-state-error" );
+		}
+		});
+		
+
 	
 });//jQuery
\ No newline at end of file
diff -r d32f123bfb9e -r 3648b6dea2cc alcatel/static/js/streamgraphdoc.js
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/alcatel/static/js/streamgraphdoc.js	Tue Sep 10 13:28:30 2013 +0200
@@ -0,0 +1,290 @@
+function Streamgraph($selector, data,docId,user/*, data2*/) 
+{
+    
+    /* Constants */
+ 
+    var VMARGIN = 3,
+        YEARSHEIGHT = 20,
+        STARTTIME = new Date(data.from_date),
+        ENDTIME = new Date(data.to_date),
+        DATASTART = new Date(data.from_date),
+        DATAEND = new Date(data.to_date),
+        CURVE = .25,
+        DATEPADDING = 10,
+        COLORS = [ "#51585E", "#12161C", "#457DAD", "#899DAA", "#0781BD" ],
+		QUERYID = data.query_id,
+        SELECTEDCOLOR = "#c51810"; 
+    	
+    /* Calculating scales and positions */
+  
+    var width = $selector.width(),
+        height = $selector.height(),
+        transp = _.zip.apply( _, _(data.clusters).pluck("volumes") ),
+        cumulative = _(transp).map(function(column) {
+            var total = 0;
+            return _(column).map(function(point) {
+                return total += point;
+            });
+        }),
+        sums = _(cumulative).map(function(column) {
+            return _(column).last();
+        })
+        maxcol = _(sums).max(),
+        streamheight = height - YEARSHEIGHT,
+        streamwidth = width * (DATAEND - DATASTART) / (ENDTIME - STARTTIME),
+        yscale = (streamheight - 2 * VMARGIN) / maxcol,
+        centery = streamheight / 2,
+        xscale = streamwidth / (transp.length - 1),
+        txscale = width / (ENDTIME - STARTTIME),
+        startx = txscale * (DATASTART - STARTTIME),
+        endx = txscale * (DATAEND - STARTTIME),
+        coords = _(data.clusters).map(function(line, lineindex) {
+            return {
+                points : _(line.volumes).map(function(point, colindex) {
+                    var lowercumul = lineindex ? cumulative[colindex][lineindex - 1] : 0,
+                        uppercumul = cumulative[colindex][lineindex];
+                    return {
+                        data: point,
+                        x: startx + xscale * colindex,
+                        lowery: centery + yscale * ( ( sums[colindex] / 2 ) - lowercumul ),
+                        uppery: centery + yscale * ( ( sums[colindex] / 2 ) - uppercumul ),
+                    }
+                }),
+                id : line.id,
+                title: line.title
+            }
+        }),
+        _(coords).each(function(line) {
+            var lowerline = _(line.points).reduce(function(path, point, colindex) {
+                var res = path;
+                if (colindex) {
+                    res += "," + (point.x - CURVE * xscale) + "," + point.lowery + "," + point.x + "," + point.lowery;
+                } else {
+                    res += "M" + point.x + "," + point.lowery;
+                }
+                if (colindex < line.points.length - 1) {
+                    res += "C" + (point.x + CURVE * xscale) + "," + point.lowery;
+                }
+                return res;
+            }, "");
+            var upperline = _(line.points).reduceRight(function(path, point, colindex) {
+                var res = path;
+                if (colindex < line.points.length - 1) {
+                    res += "," + (point.x + CURVE * xscale) + "," + point.uppery + "," + point.x + "," + point.uppery;
+                } else {
+                    res += "L" + point.x + "," + point.uppery;
+                }
+                if (colindex) {
+                    res += "C" + (point.x - CURVE * xscale) + "," + point.uppery;
+                }
+                return res;
+            }, "");
+            line.path = lowerline + upperline;
+        });
+    
+    /* Drawing streamgraph*/
+   
+    $selector.empty();
+   
+    var paper = new Raphael($selector[0]);
+    
+    paper.path("M0 " + (1+centery) + "L" + width + " " + (1+centery)).attr({
+        stroke: "#000"
+    })
+    
+    _(coords).each(function(line, index) {
+        line.color = COLORS[index % COLORS.length];
+        //var hue = (parseInt(line.id)%6)/6;
+        //line.color = Raphael.hsl( hue, 1, .8 );
+        //line.highlightColor = Raphael.hsl( hue, 1, .4 );
+        line.surface = paper.path(line.path);
+        line.surface.attr({
+            stroke: "#ffffff",
+            "stroke-width": .25,
+            fill: line.color
+        });
+    });
+    
+    /* Drawing years */
+   
+    paper.path("M0," + (height - YEARSHEIGHT) + "," + width + "," + (height - YEARSHEIGHT))
+    var lastyear = ENDTIME.getFullYear();
+    for (var i = STARTTIME.getFullYear(); i <= lastyear; i++) {
+        var x = txscale * (new Date(i,0,1) - STARTTIME);
+        paper.path("M" + x + ",0," + x + "," + height);
+        var x = txscale * (new Date(i,6,1) - STARTTIME);
+        paper.text(x, height - .5 * YEARSHEIGHT, i)
+            .attr({
+                "text-anchor": "middle",
+                "font-family": "Times New Roman, serif",
+                "font-size": "14px"
+            });
+    }
+    
+    /* Drawing range window */
+    
+    var carregauche = paper.rect(width,-1,width,(2+height)),
+        carredroite = paper.rect(-width,-1,width,(2+height)),
+        attrcarres = {
+            fill: "#333333",
+            "fill-opacity": .5,
+            stroke: "#c51810"
+        };
+    carregauche.attr(attrcarres);
+    carredroite.attr(attrcarres);
+    
+    var rangerect = paper.rect(0, (height - YEARSHEIGHT), width, YEARSHEIGHT);
+    rangerect.attr({
+        fill: "#c51810",
+        stroke: "none"
+    });
+    
+    function datetext(date) {
+        var d = new Date(date),
+            m = 1+d.getMonth(),
+            y = d.getFullYear();
+        return ((m < 10 ? "0" : "") + m + "/" + y);
+    }
+    
+    var startdate = paper.text(DATEPADDING, height - .5 * YEARSHEIGHT, datetext(STARTTIME));
+    startdate.attr({
+        fill: "#ffffff",
+        "text-anchor": "start"
+    });
+    var enddate = paper.text(width - DATEPADDING, height - .5 * YEARSHEIGHT, datetext(ENDTIME));
+    enddate.attr({
+        fill: "#ffffff",
+        "text-anchor": "end"
+    });
+    
+    /* Redrawing time slices for rollover effect */
+   var mem = '';
+    _(coords).each(function(line, index) {
+		line.mousesurface = paper.path(line.path);
+		mem += '<li><a href="http://localhost:8000/documentary_files/'+user+'/'+line.id+'/0/12/'+docId+'" title="Afficher le cluster" data-cluster-id="' + line.id + '">' + line.title + '</a></li>';
+        line.mousesurface.attr({
+			stroke: "none",
+            fill: line.color,
+            opacity: .01,
+            title: line.title,
+			href: "http://localhost:8000/documentary_files/"+user+"/"+line.id+"/0/12/"+docId
+        }).mouseover(function() {
+			//alert('mousse select');
+            $("body").trigger("select-cluster", line.id);
+        }).mouseout(function() {
+			 //alert('mousse unselect');
+            $("body").trigger("unselect-cluster", line.id);
+
+        });
+       // $(line.mousesurface.node).attr("data-cluster-id", line.id).parent().attr("data-cluster-id", line.id);
+    });
+
+	  $(".cluster").html(mem) ;
+     /*  if (typeof (data2) != 'undefined')
+		  {
+			//  alert('dat2not null');
+			  
+			  
+			  
+			  var line = _(coords).find(function(line) 
+			  {
+           		 return line.id == 1;
+        		});
+				//alert(line.id);
+        	if (line) 
+			{
+				alert(line.id);
+            	line.surface.attr({  fill: SELECTEDCOLOR  });
+			}
+			
+			  
+		  }
+		  else
+		  {
+			  alert('dat2 null');
+		  }*/
+	  $(".actu, .cluster a, .article").hover
+	  (
+			function() {			
+				$("body").trigger("select-cluster", $(this).attr("data-cluster-id"));
+			},
+			function() {		   
+			   $("body").trigger("unselect-cluster", $(this).attr("data-cluster-id"));
+			}
+       )
+		
+    $("body").on("unselect-cluster", function(e, clusterid) {
+		$(".actu[data-cluster-id='" + clusterid + "'], .cluster a[data-cluster-id='" + clusterid + "'], .article[data-cluster-id='" + clusterid + "']").removeClass("selected");
+        var line = _(coords).find(function(line) {
+            return line.id == clusterid;
+        });
+        if (line) {
+            line.surface.attr({
+                fill: line.color
+            });
+        }
+    });
+	
+	
+		
+    $("body").on("select-cluster", function(e, clusterid) {
+   	    $(".actu[data-cluster-id='" + clusterid + "'], .cluster a[data-cluster-id='" + clusterid + "'], .article[data-cluster-id='" + clusterid + "']").addClass("selected");
+        var line = _(coords).find(function(line) {
+            return line.id == clusterid;
+        });
+        if (line) {
+            line.surface.attr({
+                fill: SELECTEDCOLOR //line.highlightColor
+            });
+        }
+    });
+	
+	/*$("body").on("select-cluster", function(e, clusterid)
+		 {
+            $(".actu[data-cluster-id='" + clusterid + "'], .cluster a[data-cluster-id='" + clusterid + "'], .article[data-cluster-id='" + clusterid + "']").addClass("selected");
+        });
+        $("body").on("unselect-cluster", function(e, clusterid) {
+            $(".actu[data-cluster-id='" + clusterid + "'], .cluster a[data-cluster-id='" + clusterid + "'], .article[data-cluster-id='" + clusterid + "']").removeClass("selected");
+        });*/
+    
+    /* Returning a handler for slide value change */
+    
+    this.slidevalues = function(left, right) {
+        left = left || 0;
+        right = right || width;
+        carregauche.attr({x: left - width});
+        carredroite.attr({x: right});
+        startdate.attr({
+            x: DATEPADDING + left,
+            text: datetext(STARTTIME.valueOf() + left / txscale)
+        });
+        enddate.attr({
+            x: right - DATEPADDING,
+            text: datetext(STARTTIME.valueOf() + right / txscale)
+        });
+        rangerect.attr({
+            x: left,
+            width: right - left
+        });
+    }
+    
+    $("#slider-range").dragslider("values", [startx, endx]);
+    this.slidevalues(startx, endx);
+
+}
+
+function loadStreamgraphDoc(data,docId,user/*,data2*/) 
+{
+	$(".streamgraph").empty();
+    delete window.streamgraph;
+	;
+    //$.getJSON(url, function(data) {
+        window.streamgraph = new Streamgraph($(".streamgraph"), data,docId,user/*,data2*/);
+		 streamgraph.slidevalues.apply(streamgraph,$("#slider-range").dragslider("values"));
+
+    //});
+}
+
+/*$(function() {
+    loadStreamgraph("data/json_streamgraph.json");
+})*/