diff -r 9b98700d12b7 -r 04b8157f077b timeline/js/timeline.js
--- a/timeline/js/timeline.js	Wed Jul 11 18:02:39 2012 +0200
+++ b/timeline/js/timeline.js	Wed Jul 11 18:02:57 2012 +0200
@@ -190,7 +190,7 @@
     level: 0,
     central_time: 0,
     sync_now: true,
-    url_occurrences: '',
+    urls_occurrences: [],
     occurrences: [],
     cluster_spacing: 12,
     tooltip_date_format: '{{dayOfMonth}} {{shortMonthName}} {{year}} {{0hours}}:{{0minutes}}',
@@ -207,7 +207,7 @@
 
 /* Templates */
 
-Tlns.Templates.Timeline = '<ul class="Onglets"><li>Frise chronologique</li><li>Liste des occurrences</li></ul><div class="Tl-Main"><div class="Tl-TopBar"><div class="Tl-TopBar-Button Tl-Border-Right"><div class="Tl-TopBar-AddButton"></div></div><div class="Tl-TopBar-Spacer Tl-Border-Right"></div>'
+Tlns.Templates.Timeline = '<ul class="Onglets"><li class="Onglet-Tl active">Frise chronologique</li><li class="Onglet-Ls">Liste des occurrences</li></ul><div class="Tl-Main"><div class="Tl-TopBar"><div class="Tl-TopBar-Button Tl-Border-Right"><div class="Tl-TopBar-AddButton"></div></div><div class="Tl-TopBar-Spacer Tl-Border-Right"></div>'
     + '<div class="Tl-TopBar-Button Tl-Border-Right"><div class="Tl-TopBar-PreviousButton"></div></div><div class="Tl-TopBar-TimeSpan Tl-TopBar-TextBtn Tl-Border-Right">--/--</div>'
     + '<div class="Tl-TopBar-Button Tl-Border-Right"><div class="Tl-TopBar-SyncButton"></div></div><div class="Tl-TopBar-Button Tl-Border-Right"><div class="Tl-TopBar-NextButton"></div></div><div class="Tl-TopBar-Spacer Tl-Border-Right"></div>'
     + '<div class="Tl-TopBar-Timescales">{{#timescales}}<div class="Tl-TopBar-Button Tl-TopBar-TextBtn Tl-Border-Right" data-level="{{level}}">{{label}}</div>{{/timescales}}</div></div>'
@@ -239,7 +239,8 @@
 Tlns.Templates.Occurrence_List = '{{#occurrences}}<li class="Ls-Occurrence"><div class="Ls-OccIcon Tl-Occ{{type}} Tl-Occ{{status}}"></div><div class="Ls-Occurrence-Title">{{title}}</div><div class="Tl-Tooltip-Date">{{formatted_date}}</div><div style="clear:both;"></div></li>{{/occurrences}}';
 
 Tlns.Templates.OccurrenceTooltip = '<h3 class="Tl-Tooltip-Title">{{title}}</h3><p class="Tl-Tooltip-Date">{{formatted_date}} - {{translated_status}}</p>'
-    + '<p class="Tl-Tooltip-Description">{{description}}</p><p class="Tl-Tooltip-Characters">{{univers.mainCharacter}}{{#characters}}, {{.}}{{/characters}}</p>'
+    + '<p class="Tl-Tooltip-Description">{{description}}</p>'
+//    + '<p class="Tl-Tooltip-Characters">{{univers.mainCharacter}}{{#characters}}, {{.}}{{/characters}}</p>'
 
 /* Classes */
 
@@ -289,7 +290,7 @@
     
     this.$.find('.Tl-TopBar-SyncButton').click(function() {
         _this.sync_now = !_this.sync_now;
-        _this.drawGrid();
+        _this.changeSpan();
     })
     
     this.$.find('.Tl-TopBar-PreviousButton').click(function() {
@@ -348,10 +349,9 @@
             _occ = _this.createOrUpdateOccurrence(
                 _type,
                 {
-                    date: _d,
+                    datePublication: Math.floor(_d / 1000),
                     titre: '<Nouvelle occurrence>',
-                    univers: _this.univers[_u].id,
-                    publie: true,
+                    idUnivers: _this.univers[_u].id,
                     statut: 'a_realiser'
                 }
             );
@@ -376,14 +376,14 @@
     
     /* LIST */
     
-    $("li.Ls-Critere").click(function() {
+    this.$.find("li.Ls-Critere").click(function() {
         $(this).toggleClass("Ls-Active");
         _this.throttledDrawList();
     });
-    $(".Ls-Search").bind("keyup change click", function() {
+    this.$.find(".Ls-Search").bind("keyup change click", function() {
         _this.throttledDrawList();
     });
-    $(".Ls-From-Date, .Ls-To-Date").datepicker(
+    this.$.find(".Ls-From-Date, .Ls-To-Date").datepicker(
         {
             dateFormat: "dd/mm/yy",
             dayNames: [ "Dimanche", "Lundi", "Mardi", "Mercredi", "Jeudi", "Vendredi", "Samedi" ],
@@ -403,7 +403,7 @@
     }).bind("keyup", function() {
         _this.throttledDrawList();
     });
-    $(".Ls-From-Time, .Ls-To-Time").change(function() {
+    this.$.find(".Ls-From-Time, .Ls-To-Time").change(function() {
         var _val = $(this).val();
         if (_val) {
             $(this).val(Tlns.Utils.timeFieldProcess( _val ).text);
@@ -413,6 +413,19 @@
         _this.throttledDrawList();
     });
     
+    this.$.find(".Onglet-Tl").click(function() {
+        _this.$.find(".Tl-Main").show();
+        _this.$.find(".Ls-Main").hide();
+        _this.$.find(".Onglet-Ls").removeClass("active");
+        _this.$.find(".Onglet-Tl").addClass("active");
+    });
+    
+    this.$.find(".Onglet-Ls").click(function() {
+        _this.$.find(".Ls-Main").show();
+        _this.$.find(".Tl-Main").hide();
+        _this.$.find(".Onglet-Tl").removeClass("active");
+        _this.$.find(".Onglet-Ls").addClass("active");
+    });
 }
 
 Tlns.Classes.Timeline.prototype.onMouseDown = function(_event) {
@@ -512,9 +525,9 @@
         this.univers.push(new Tlns.Classes.Univers(_data[_i], this, _i));
     }
     
-    $(".Ls-Univers").html(Mustache.to_html(Tlns.Templates.Univers_List, this));
+    this.$.find(".Ls-Univers").html(Mustache.to_html(Tlns.Templates.Univers_List, this));
     var _this = this;
-    $(".Ls-Univers li.Ls-Critere").click( function() {
+    this.$.find(".Ls-Univers li.Ls-Critere").click( function() {
         $(this).toggleClass("Ls-Active");
         _this.throttledDrawList();
     });
@@ -550,23 +563,25 @@
     var _now = new Date().valueOf();
     if (this.sync_now) {
         this.central_time = _now;
-        this.$.find('.Tl-TopBar-SyncButton').addClass("active");
-    } else {
-        this.$.find('.Tl-TopBar-SyncButton').removeClass("active");
     }
     var _timescale = this.timescales[this.level];
     this.current_scale = this.main_width / (_timescale.span);
     this.start_time = this.central_time - (_timescale.span / 2);
     this.end_time = this.central_time + (_timescale.span / 2);
-    $(".Ls-From-Time").val(Tlns.Utils.dateFormat(this.start_time, '{{0hours}}:{{0minutes}}'));
-    $(".Ls-From-Date").val(Tlns.Utils.dateFormat(this.start_time, '{{0dayOfMonth}}/{{0monthNumber}}/{{year}}'));
-    $(".Ls-To-Time").val(Tlns.Utils.dateFormat(this.end_time, '{{0hours}}:{{0minutes}}'));
-    $(".Ls-To-Date").val(Tlns.Utils.dateFormat(this.end_time, '{{0dayOfMonth}}/{{0monthNumber}}/{{year}}'));
+    this.$.find(".Ls-From-Time").val(Tlns.Utils.dateFormat(this.start_time, '{{0hours}}:{{0minutes}}'));
+    this.$.find(".Ls-From-Date").val(Tlns.Utils.dateFormat(this.start_time, '{{0dayOfMonth}}/{{0monthNumber}}/{{year}}'));
+    this.$.find(".Ls-To-Time").val(Tlns.Utils.dateFormat(this.end_time, '{{0hours}}:{{0minutes}}'));
+    this.$.find(".Ls-To-Date").val(Tlns.Utils.dateFormat(this.end_time, '{{0dayOfMonth}}/{{0monthNumber}}/{{year}}'));
     this.throttledDrawGrid();
     this.throttledDrawList();
 }
 
 Tlns.Classes.Timeline.prototype.drawGrid = function() {
+    if (this.sync_now) {
+        this.$.find('.Tl-TopBar-SyncButton').addClass("active");
+    } else {
+        this.$.find('.Tl-TopBar-SyncButton').removeClass("active");
+    }
     var _now = new Date().valueOf(),
         _timescale = this.timescales[this.level],
         _offset = new Date().getTimezoneOffset() * 60000,
@@ -589,24 +604,18 @@
 }
 
 Tlns.Classes.Timeline.prototype.loadOccurrences = function() {
-    var _url = Mustache.to_html(this.url_occurrences, {
-            from_time: this.start_time,
-            to_time: this.end_time
-        }),
-        _this = this;
-    $.getJSON(_url, function(_data) {
-        _this.onOccurrencesLoaded(_data);
+    var _this = this;
+    _(this.urls_occurrences).each(function(_url_occ) {
+        $.getJSON(_url_occ.url, function(_data) {
+            _this.onOccurrencesLoaded(_data, _url_occ.type);
+        });
     });
+    
 }
 
-Tlns.Classes.Timeline.prototype.onOccurrencesLoaded = function(_data) {
-    if (typeof _data.occurrencesNarratives === "object" && _data.occurrencesNarratives !== null) {
-        for (var _i = 0; _i < _data.occurrencesNarratives.length; _i++) {
-            this.createOrUpdateOccurrence("narrative", _data.occurrencesNarratives[_i]);
-        }
-        for (var _i = 0; _i < _data.occurrencesPublication.length; _i++) {
-            this.createOrUpdateOccurrence("publication", _data.occurrencesPublication[_i]);
-        }
+Tlns.Classes.Timeline.prototype.onOccurrencesLoaded = function(_data, _type) {
+    for (var _i = 0; _i < _data.length; _i++) {
+        this.createOrUpdateOccurrence(_type, _data[_i]);
     }
     if (!this.mouse_down) {
         this.drawOccurrences();
@@ -656,7 +665,7 @@
 Tlns.Classes.Timeline.prototype.drawOccurrences = function() {
     var _this = this,
         _visible = _(this.occurrences).filter(function(_occ) {
-        return (_occ.date >= _this.start_time && _occ.date <= _this.end_time && _occ.published);
+        return (_occ.date >= _this.start_time && _occ.date <= _this.end_time && _occ.status);
     });
     _(_visible).each(function(_occ) {
         _occ.x = _this.current_scale * (_occ.date - _this.start_time);
@@ -828,26 +837,26 @@
 }
 
 Tlns.Classes.Timeline.prototype.drawList = function() {
-    var _universfilter = $(".Ls-Univers li.Ls-Active").map(function(){return $(this).attr("data")}),
-        _occtypefilter = $(".Ls-Occtypes li.Ls-Active").map(function(){return $(this).attr("data")}),
-        _statusfilter = $(".Ls-Occstatuses li.Ls-Active").map(function(){return $(this).attr("data")}),
-        _title = $(".Ls-Search").val() || "",
+    var _universfilter = this.$.find(".Ls-Univers li.Ls-Active").map(function(){return $(this).attr("data")}),
+        _occtypefilter = this.$.find(".Ls-Occtypes li.Ls-Active").map(function(){return $(this).attr("data")}),
+        _statusfilter = this.$.find(".Ls-Occstatuses li.Ls-Active").map(function(){return $(this).attr("data")}),
+        _title = this.$.find(".Ls-Search").val() || "",
         _titleregexp = new RegExp( "(" + _title.replace(/(\W)/gm, "\\$1") + ")", "gim" ),
         _startdate = false,
         _enddate = false,
-        _fromDate = $(".Ls-From-Date").val(),
-        _toDate = $(".Ls-To-Date").val();
+        _fromDate = this.$.find(".Ls-From-Date").val(),
+        _toDate = this.$.find(".Ls-To-Date").val();
     if (_fromDate) {
         var _date = Tlns.Utils.dateFieldProcess(_fromDate),
-            _time = Tlns.Utils.timeFieldProcess($(".Ls-From-Time").val());
+            _time = Tlns.Utils.timeFieldProcess(this.$.find(".Ls-From-Time").val());
         _startdate = new Date(_date.year, _date.month - 1, _date.date, _time.hours, _time.minutes);
     }
     if (_toDate) {
         var _date = Tlns.Utils.dateFieldProcess(_toDate),
-            _time = Tlns.Utils.timeFieldProcess($(".Ls-To-Time").val());
+            _time = Tlns.Utils.timeFieldProcess(this.$.find(".Ls-To-Time").val());
         _enddate = new Date(_date.year, _date.month - 1, _date.date, _time.hours, _time.minutes);
     }
-    $(".Ls-Occurrences").html(
+    this.$.find(".Ls-Occurrences").html(
         Mustache.to_html(
             Tlns.Templates.Occurrence_List,
             {
@@ -867,7 +876,7 @@
         )
     );
     if (_title) {
-        $(".Ls-Occurrence-Title").each(function() {
+        this.$.find(".Ls-Occurrence-Title").each(function() {
             $(this).html($(this).text().replace(_titleregexp, "<span style='background:yellow'>$1</span>"));
         });
     }
@@ -884,10 +893,10 @@
  */
 
 Tlns.Classes.Univers = function(_data, _timeline, _index) {
-    this.id = _data.id;
+    this.id = _data.idUnivers;
     this.index = _index;
-    this.title = _data.nom;
-    this.mainCharacter = _data.personnage;
+    this.title = _data.nomUnivers;
+//    this.mainCharacter = _data.personnage;
     this.y = (_timeline.univers_height * _index);
 
     this.$label = $('<li>').css({
@@ -896,9 +905,8 @@
       .addClass((_index % 2) ? 'Tl-Line-Odd' : 'Tl-Line-Even');
     
     _timeline.$.find('.Tl-UniversLabels').append(this.$label);
-    var _txt = _data.nom,
+    var _txt = this.title,
         _span = this.$label.find('span');
-
     while (_span.outerWidth() > (_timeline.width - _timeline.main_width) && _txt) {
         _txt = _txt.substr(0, _txt.length - 1);
         _span.html(_txt + '&hellip;');
@@ -915,22 +923,46 @@
 
 Tlns.Classes.Occurrence.prototype.update = function(_type, _data) {
     this.type = _type;
-    this.original_id = _data.id || Tlns.Utils.guid();
+    this.original_id = _data.idOccurrencePublication || _data.id || Tlns.Utils.guid();
     this.id = _type + "_" + this.original_id;
-    this.date = _data.date || _data.datePublication;
+    this.date = 1000 * (_data.datePublication || _data.date);
     this.formatted_date = Tlns.Utils.dateFormat(this.date,Tlns.Defaults.Timeline.tooltip_date_format);
     this.title = _data.titre || "<untitled>";
-    this.univers_id = _data.univers;
+    this.univers_id = _data.idUnivers;
     this.univers = this.timeline.getUnivers(this.univers_id);
-    this.status = _data.statut;
+    switch(_data.statut) {
+        case "Validée":
+        case "valide":
+            this.status = "valide"
+        break;
+        case "A valider":
+        case "a_valider":
+            this.status = "a_valider";
+        break;
+        case "A réaliser":
+        case "a_realiser":
+            this.status = "a_realiser";
+        break;
+        default:
+            this.status = false;
+    }
     this.translated_status = Tlns.Defaults.Timeline.statuses[this.status];
-    this.published = _data.publie || false;
+//    this.published = (_data.publication && _data.publication == "En ligne");
 //    this.locked = _data.verrouille || false;
-    this.characters = _data.personnagesSecondaires || [];
-    this.dependsOn = _(_data.dependDe || []).map(function(_id) {
-        return "narrative_" + _id;
-    });
-    this.description = _data.description || "";
+//    this.characters = _data.personnagesSecondaires || [];
+    this.dependsOn = [];
+    if (_data.dependanceNarrative) {
+        for (var _i = 0; _i < _data.dependanceNarrative.length; _i++) {
+            this.dependsOn.push("narrative_" + _data.dependanceNarrative[_i])
+        }
+    }
+    if (_data.dependancePublication) {
+        for (var _i = 0; _i < _data.dependancePublication.length; _i++) {
+            this.dependsOn.push("publication_" + _data.dependancePublication[_i])
+        }
+    }
+    var _tmp = $('<p>').html(_data.accroche || "");
+    this.description = _tmp.text().trim().replace(/(^.{60,80})[\s].+$/m,'$1&hellip;');
 }
 
 Tlns.Classes.Occurrence.prototype.addDependency = function(_id) {