timeline/js/timeline.js
changeset 102 2f1ef2ded30c
parent 101 05c1161fa501
child 103 b9a417017e19
--- a/timeline/js/timeline.js	Fri Oct 04 11:26:40 2013 +0200
+++ b/timeline/js/timeline.js	Fri Oct 04 15:39:08 2013 +0200
@@ -134,19 +134,19 @@
         span : 7 * 86400 * 1000,
         grid_interval : 86400 * 1000,
         grid_date_format : '{{dayOfMonth}} {{monthName}}',
-        min_importance : 3
+        min_importance : 3 //0 //pour les tests, mettre à 0 pour tout afficher
     }, {
         label : "3 jours",
         span : 3 * 86400 * 1000,
         grid_interval : 6 * 3600 * 1000,
         grid_date_format : '{{^isDayStart}}{{0hours}}h{{0minutes}}{{/isDayStart}}{{#isDayStart}}{{dayOfMonth}} {{shortMonthName}}{{/isDayStart}}',
-        min_importance : 2
+        min_importance : 2 //0 //pour les tests, mettre à 0 pour tout afficher
     }, {
         label : "Journée",
         span : 86400 * 1000,
         grid_interval : 2 * 3600 * 1000,
         grid_date_format : '{{^isDayStart}}{{0hours}}h{{0minutes}}{{/isDayStart}}{{#isDayStart}}{{dayOfMonth}} {{shortMonthName}}{{/isDayStart}}',
-        min_importance : 1
+        min_importance : 1 //0 //pour les tests, mettre à 0 pour tout afficher
     }, {
         label : "Demi-Journée",
         span : 6 * 3600 * 1000,
@@ -236,12 +236,15 @@
 
 Tlns.Templates.Occurrence =
     '{{#occurrences}}<div class="Tl-Occurrence Tl-OccOnGrid Tl-Occ{{type}}{{#editing}} Tl-Editing{{/editing}}" occurrence-id="{{id}}" style="left: {{x}}px; top: {{y}}px;">'
-    + '{{#image}}<img src="{{image}}" />{{/image}}'
-    + '</div>{{/occurrences}}';
+    + '{{#image}}<img src="{{image}}" />{{/image}}{{#isFavorite}}<div class="Tl-Occurrence-Favorite"></div>{{/isFavorite}}'
+    + '{{#participationCount}}<div class="Tl-Occurrence-Participation">{{participationCount}}</div>{{/participationCount}}</div>{{/occurrences}}';
 
 Tlns.Templates.OccurrenceTooltip = '<h3 class="Tl-Tooltip-Title">{{title}}</h3>';
 
-Tlns.Templates.OccurrenceDetails = '<div class="Tl-Detail"><div class="Tl-Detail-X"></div><img class="Tl-Detail-Image" src="{{detail_image}}" />'
+Tlns.Templates.OccurrenceDetails = 
+    '<div class="Tl-Detail"><div class="Tl-Detail-X"></div><div class="Tl-Detail-Favorite{{#isFavorite}} Tl-Detail-isFavorite{{/isFavorite}}"></div>'
+    + '<div class="Tl-Detail-Image-Wrapper"><img class="Tl-Detail-Image" src="{{detail_image}}" />'
+    + '{{#participationCount}}<div class="Tl-Detail-Participation">{{participationCount}}<span class="Tl-Participation-Icon"></span></div>{{/participationCount}}</div>'
     + '<h2 class="Tl-Detail-Title">{{title}}</h2><p class="Tl-Detail-Description">{{detail_description}}</p>'
     + '<div class="Tl-Detail-Bottom"><span class="Tl-Detail-Date">Publié le {{formatted_date}}</span><a class="Tl-Detail-Read" href="{{url}}" target="_blank">Lire la suite</a></div></div>';
 
@@ -366,16 +369,12 @@
         x: _event.pageX,
         y: _event.pageY
     };
-    if (typeof this.dragging_type === "undefined") {
-        this.time_at_start = this.central_time;
-        this.dragging_type = "timeline";
-    }
+    this.time_at_start = this.central_time;
 };
 
 Tlns.Classes.Timeline.prototype.onMouseUp = function(_event) {
     this.mouse_down = false;
     this.is_dragging = false;
-    this.dragging_type = undefined;
 };
 
 Tlns.Classes.Timeline.prototype.timeFromX = function(_x) {
@@ -405,11 +404,7 @@
     }
     if (this.is_dragging) {
         this.hideTooltip();
-        switch (this.dragging_type) {
-            case "timeline":
-                this.setTime(this.time_at_start + Math.floor(( this.start_pos.x - _event.pageX ) / this.current_scale));
-            break;
-        }
+        this.setTime(this.time_at_start + Math.floor(( this.start_pos.x - _event.pageX ) / this.current_scale));
     }
 };
 
@@ -565,6 +560,7 @@
     });
     
     /* FILTRAGE SI TROP D'OCCURRENCES PAR UNITE DE TEMPS */
+    /* Commenter la partie ci-dessous pour les tests */
     
     var _timescale = this.timescales[this.level],
         _offset = new Date().getTimezoneOffset() * 60000,
@@ -614,14 +610,11 @@
     });
     this.$.find('.Tl-Occurrences').html(_html);
         
-    this.$.find('.Tl-Occurrence').mousedown(function() {
+    this.$.find('.Tl-Occurrence').mousedown(function() { // Clic sur un contenu
         var _el = $(this),
             _id = _el.attr("occurrence-id");
         if (typeof _id !== "undefined") {
             _this.editing_occurrence = _this.getOccurrence(_id);
-            if (typeof _this.dragging_type === "undefined" && typeof _this.editing_occurrence !== "undefined" /* && !_this.editing_occurrence.locked */ ) {
-                _this.dragging_type = "occurrence";
-            }
             if (!_this.editing_occurrence.editing) {
                 _(_this.occurrences).each(function(_occ) {
                     _occ.editing = false;
@@ -631,7 +624,7 @@
             }
             _this.throttledDrawGrid();
         }
-    }).mouseover(function(_event) {
+    }).mouseover(function(_event) { // Hover sur un contenu
         var _el = $(this),
             _id = _el.attr("occurrence-id");
         if (typeof _id !== "undefined") {
@@ -696,6 +689,9 @@
 };
 
 Tlns.Classes.Occurrence.prototype.update = function(_data) {
+    
+    /* Récupération des propriétés du JSON */
+    
     this.original_data = _data;
     this.id = _data.id;
     this.date = new Date(1000 * (_data.dateFirstPublication || _data.dateCreate) || Date.now);
@@ -717,9 +713,14 @@
     }
     this.univers = this.timeline.univers[this.univers_id];
     this.format = typeinfo.label;
-//    this.published = (_data.publication && _data.publication == "En ligne");
-//    this.locked = _data.verrouille || false;
-//    this.characters = _data.personnagesSecondaires || [];
+    
+    /* Données temporaires aléatoires */
+    this.isFavorite = (Math.random() > 1/2); // A random Boolean ;-)
+    if (this.univers_id >= 2) {
+        this.participationCount = Math.floor(12*Math.random());
+    }
+    /* End Temporary Data */
+    
     var _tmp = $('<p>').html(_data.resume || "");
     var trimmedDesc = _tmp.text().trim().replace(/(\n|\r|\r\n)/mg,' ');
     this.description = trimmedDesc.replace(/(^.{60,80})[\s].+$/m,'$1&hellip;');