--- a/timeline/js/timeline.js Tue May 29 16:16:26 2012 +0200
+++ b/timeline/js/timeline.js Wed Jun 27 13:15:28 2012 +0200
@@ -57,6 +57,12 @@
return Mustache.to_html(_template, _params);
}
+Tlns.Utils.guid = function() {
+ return 'xxxx-xxxx-xxxx-xxxx'.replace(/x/g,function() {
+ return Math.floor(Math.random()*16).toString(16);
+ });
+}
+
/* Defaults */
Tlns.Defaults.Timeline = {
@@ -129,7 +135,10 @@
+ '<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>'
- + '<div class="Tl-BottomPart"><ul class="Tl-UniversLabels"></ul><div class="Tl-MainPart"><div class="Tl-Layer Tl-Grid"></div><canvas class="Tl-Layer Tl-Canvas"></canvas><canvas class="Tl-Layer Tl-Linking-Canvas"></canvas><div class="Tl-Layer Tl-Occurrences"></div></div>'
+ + '<div class="Tl-BottomPart"><ul class="Tl-UniversLabels"></ul>'
+ + '<div class="Tl-MainPart"><div class="Tl-Layer Tl-Grid"></div><canvas class="Tl-Layer Tl-Canvas"></canvas><canvas class="Tl-Layer Tl-Linking-Canvas"></canvas><div class="Tl-Layer Tl-Occurrences"></div>'
+ + '<ul class="Tl-Adding"><li class="Tl-AddingTitle">Ajout d\'une occurrence</li><li><span>Narrative</span><div class="Tl-AddOccurrence Tl-Occnarrative" occurrence-type="narrative" title="Glisser sur la frise chronologique pour ajouter"></div></li>'
+ + '<li><span>De Production</span><div class="Tl-AddOccurrence Tl-Occproduction" occurrence-type="production" title="Glisser sur la frise chronologique pour ajouter"></div></li></ul></div>'
+ '<div class="Tl-Overlay-Container"><div class="Tl-Overlay-Box"><div class="Tl-Overlay"><div class="Tl-Overlay-Tip-Top"></div><div class="Tl-Overlay-Main"></div><div class="Tl-Overlay-Tip-Bottom"></div></div></div></div></div>';
Tlns.Templates.Univers = '<span class="Tl-UniversText">{{title}}</span>';
@@ -236,6 +245,39 @@
$(this).hide();
});
+ this.$.find('.Tl-TopBar-AddButton').click(function() {
+ $(this).toggleClass('active');
+ _this.$.find('.Tl-Adding').toggle();
+ });
+
+ this.$.find('.Tl-AddOccurrence').mousedown(function(_event) {
+ var _el = $(this),
+ _type = _el.attr("occurrence-type"),
+ _d = _this.timeFromMouse(_event.pageX),
+ _u = _this.universFromMouse(_event.pageY),
+ _occ = _this.createOrUpdateOccurrence(
+ _type,
+ {
+ date: _d,
+ titre: '<Nouvelle occurrence>',
+ univers: _this.univers[_u].id,
+ publie: true
+ }
+ );
+ _occ.just_created = true;
+ _occ.editing = true;
+ _this.editing_occurrence = _occ;
+ _this.dragging_type = "occurrence";
+ window.setTimeout(function () {
+ _this.$.find('.Tl-TopBar-AddButton').removeClass('active');
+ _this.$.find('.Tl-Adding').hide();
+ }, 200);
+ _this.throttledDrawGrid();
+ }).mouseup(function(_event) {
+ _this.onMouseUp(_event);
+ return false;
+ });
+
/* Loading Univers */
$.getJSON(this.url_univers, function(_data) {
_this.onUniversLoaded(_data);
@@ -260,6 +302,7 @@
switch (this.dragging_type) {
case "occurrence":
this.editing_occurrence.editing = false;
+ this.editing_occurrence.just_created = false;
this.throttledDrawGrid();
break;
case "link":
@@ -269,6 +312,11 @@
_ctx.clearRect(0,0,this.main_width, this.main_height);
break;
}
+ } else {
+ if (this.dragging_type == "occurrence" && this.editing_occurrence.just_created) {
+ this.deleteOccurrence(this.editing_occurrence.type, this.editing_occurrence.id);
+ this.throttledDrawGrid();
+ }
}
this.mouse_down = false;
this.is_dragging = false;
@@ -283,6 +331,14 @@
return this.timeFromX(_pageX - this.dragging_bounds.left);
}
+Tlns.Classes.Timeline.prototype.universFromY = function(_y) {
+ return Math.max(0,Math.min(this.univers.length, Math.floor(_y / this.univers_height)))
+}
+
+Tlns.Classes.Timeline.prototype.universFromMouse = function(_pageY) {
+ return this.universFromY(_pageY - this.dragging_bounds.top);
+}
+
Tlns.Classes.Timeline.prototype.onMouseMove = function(_event) {
if (this.mouse_down) {
this.is_dragging = true;
@@ -291,7 +347,7 @@
case "occurrence":
var _d = this.timeFromMouse(_event.pageX);
this.editing_occurrence.date = _d;
- var _u = Math.max(0,Math.min(this.univers.length, Math.floor((_event.pageY - this.dragging_bounds.top) / this.univers_height)));
+ var _u = this.universFromMouse(_event.pageY);
this.editing_occurrence.univers = this.univers[_u];
this.editing_occurrence.univers_id = this.univers[_u].id;
this.throttledDrawGrid();
@@ -412,6 +468,12 @@
}
}
+Tlns.Classes.Timeline.prototype.deleteOccurrence = function(_type, _id) {
+ this.occurrences = _(this.occurrences).reject(function(_occ) {
+ return (_occ.type == _type && _occ.id == _id);
+ });
+}
+
Tlns.Classes.Timeline.prototype.getOccurrence = function(_type, _id) {
return _(this.occurrences).find(function(_occ) {
return (_occ.type == _type && _occ.id == _id);
@@ -425,6 +487,7 @@
this.occurrences.push(_occurrence);
}
_occurrence.update(_type, _data);
+ return _occurrence;
}
Tlns.Classes.Timeline.prototype.showTooltip = function(_x, _y, _html, _isUp) {
@@ -566,27 +629,39 @@
}
this.$.find('.Tl-Occurrence').mousedown(function() {
- var _el = $(this);
- _this.editing_occurrence = _this.getOccurrence(_el.attr("occurrence-type"),_el.attr("occurrence-id"));
- if (typeof _this.dragging_type === "undefined" && typeof _this.editing_occurrence !== "undefined" && !_this.editing_occurrence.locked) {
- _this.dragging_type = "occurrence";
- _this.editing_occurrence.editing = true;
+ var _el = $(this),
+ _type = _el.attr("occurrence-type"),
+ _id = _el.attr("occurrence-id");
+ if (typeof _type !== "undefined" && typeof _id !== "undefined") {
+ _this.editing_occurrence = _this.getOccurrence(_type,_id);
+ if (typeof _this.dragging_type === "undefined" && typeof _this.editing_occurrence !== "undefined" && !_this.editing_occurrence.locked) {
+ _this.dragging_type = "occurrence";
+ _this.editing_occurrence.editing = true;
+ }
}
}).mouseover(function(_event) {
var _el = $(this),
- _occurrence = _this.getOccurrence(_el.attr("occurrence-type"),_el.attr("occurrence-id"));
- if (!_occurrence.locked) {
- _el.find('.Tl-Link').show();
+ _type = _el.attr("occurrence-type"),
+ _id = _el.attr("occurrence-id");
+ if (typeof _type !== "undefined" && typeof _id !== "undefined") {
+ var _occurrence = _this.getOccurrence(_type, _id);
+ if (!_occurrence.locked) {
+ _el.find('.Tl-Link').show();
+ }
+ _occurrence.formatted_date = Tlns.Utils.dateFormat(_occurrence.date,_this.tooltip_date_format);
+ var _html = Mustache.to_html(Tlns.Templates.OccurrenceTooltip, _occurrence);
+ _this.showTooltip(_occurrence.x, _occurrence.y, _html, (_event.pageY - _this.dragging_bounds.top) >= (.4 * _this.main_height) );
}
- _occurrence.formatted_date = Tlns.Utils.dateFormat(_occurrence.date,_this.tooltip_date_format);
- var _html = Mustache.to_html(Tlns.Templates.OccurrenceTooltip, _occurrence);
- _this.showTooltip(_occurrence.x, _occurrence.y, _html, (_event.pageY - _this.dragging_bounds.top) >= (.4 * _this.main_height) );
}).mouseout(function() {
var _el = $(this),
- _occurrence = _this.getOccurrence(_el.attr("occurrence-type"),_el.attr("occurrence-id"));
- _this.hideTooltip();
- if (!_occurrence.editing) {
- $(this).find('.Tl-Link').hide();
+ _type = _el.attr("occurrence-type"),
+ _id = _el.attr("occurrence-id");
+ if (typeof _type !== "undefined" && typeof _id !== "undefined") {
+ var _occurrence = _this.getOccurrence(_type, _id);
+ _this.hideTooltip();
+ if (!_occurrence.editing) {
+ $(this).find('.Tl-Link').hide();
+ }
}
}).mouseup(function() {
var _el = $(this);
@@ -658,7 +733,7 @@
Tlns.Classes.Occurrence.prototype.update = function(_type, _data) {
this.type = _type;
- this.id = _data.id || _.uniqueId();
+ this.id = _data.id || Tlns.Utils.guid();
this.date = _data.date || _data.datePublication;
this.title = _data.titre || "<untitled>";
this.univers_id = _data.univers;