From 285257e6fc19d9b1c71118cde05d0f5b0e101b5f Mon Sep 17 00:00:00 2001 From: josdejong Date: Tue, 18 Feb 2014 13:06:25 +0100 Subject: [PATCH] neatly applying option editable everywhere --- src/timeline/Timeline.js | 7 ++++++- src/timeline/component/ItemSet.js | 9 +++++---- src/timeline/component/RootPanel.js | 3 ++- src/timeline/component/css/item.css | 3 +++ src/timeline/component/item/Item.js | 2 +- src/timeline/component/item/ItemRange.js | 4 ++-- 6 files changed, 19 insertions(+), 9 deletions(-) diff --git a/src/timeline/Timeline.js b/src/timeline/Timeline.js index d19b54b0..b8e2bd1a 100644 --- a/src/timeline/Timeline.js +++ b/src/timeline/Timeline.js @@ -33,7 +33,7 @@ function Timeline (container, items, options) { onUpdate: function (item, callback) { callback(item); }, - onMoved: function (item, callback) { + onMove: function (item, callback) { callback(item); }, onRemove: function (item, callback) { @@ -193,6 +193,10 @@ Timeline.prototype.setOptions = function (options) { // both start and end are optional this.range.setRange(options.start, options.end); + if ('editable' in options || 'selectable' in options) { + // TODO: update current selection according to changed options + } + this.controller.reflow(); this.controller.repaint(); }; @@ -445,6 +449,7 @@ Timeline.prototype._onSelectItem = function (event) { */ Timeline.prototype._onAddItem = function (event) { if (!this.options.selectable) return; + if (!this.options.editable) return; var me = this, item = ItemSet.itemFromTarget(event); diff --git a/src/timeline/component/ItemSet.js b/src/timeline/component/ItemSet.js index ec7c9d1f..0e3a1720 100644 --- a/src/timeline/component/ItemSet.js +++ b/src/timeline/component/ItemSet.js @@ -779,7 +779,9 @@ ItemSet.prototype._onDragEnd = function (event) { if (this.touchParams.itemProps) { // prepare a change set for the changed items var changes = [], - me = this; + me = this, + dataset = this._myDataSet(), + type; this.touchParams.itemProps.forEach(function (props) { var id = props.item.id, @@ -788,11 +790,11 @@ ItemSet.prototype._onDragEnd = function (event) { var changed = false; if ('start' in props.item.data) { changed = (props.start != props.item.data.start.valueOf()); - item.start = util.convert(props.item.data.start, me.itemsData.convert['start']); + item.start = util.convert(props.item.data.start, dataset.convert['start']); } if ('end' in props.item.data) { changed = changed || (props.end != props.item.data.end.valueOf()); - item.end = util.convert(props.item.data.end, me.itemsData.convert['end']); + item.end = util.convert(props.item.data.end, dataset.convert['end']); } // only apply changes when start or end is actually changed @@ -815,7 +817,6 @@ ItemSet.prototype._onDragEnd = function (event) { // apply the changes to the data (if there are changes) if (changes.length) { - var dataset = this._myDataSet(); dataset.update(changes); } diff --git a/src/timeline/component/RootPanel.js b/src/timeline/component/RootPanel.js index 708548f3..35f6710c 100644 --- a/src/timeline/component/RootPanel.js +++ b/src/timeline/component/RootPanel.js @@ -77,7 +77,8 @@ RootPanel.prototype.repaint = function () { changed += 1; } - frame.className = 'vis timeline rootpanel ' + options.orientation; + frame.className = 'vis timeline rootpanel ' + options.orientation + + (options.editable ? ' editable' : ''); var className = options.className; if (className) { util.addClassName(frame, util.option.asString(className)); diff --git a/src/timeline/component/css/item.css b/src/timeline/component/css/item.css index 8063bfd0..2b3f3b69 100644 --- a/src/timeline/component/css/item.css +++ b/src/timeline/component/css/item.css @@ -12,6 +12,9 @@ border-color: #FFC200; background-color: #FFF785; z-index: 999; +} + +.vis.timeline.editable .item.selected { cursor: move; } diff --git a/src/timeline/component/item/Item.js b/src/timeline/component/item/Item.js index 49922ba9..4b9faf45 100644 --- a/src/timeline/component/item/Item.js +++ b/src/timeline/component/item/Item.js @@ -87,7 +87,7 @@ Item.prototype.setOffset = function setOffset(offset) { * @private */ Item.prototype._repaintDeleteButton = function (anchor) { - if (this.selected && !this.dom.deleteButton) { + if (this.selected && this.options.editable && !this.dom.deleteButton) { // create and show button var parent = this.parent; var id = this.id; diff --git a/src/timeline/component/item/ItemRange.js b/src/timeline/component/item/ItemRange.js index 4c279515..379343a3 100644 --- a/src/timeline/component/item/ItemRange.js +++ b/src/timeline/component/item/ItemRange.js @@ -259,7 +259,7 @@ ItemRange.prototype.reposition = function reposition() { * @private */ ItemRange.prototype._repaintDragLeft = function () { - if (this.selected && !this.dom.dragLeft) { + if (this.selected && this.options.editable && !this.dom.dragLeft) { // create and show drag area var dragLeft = document.createElement('div'); dragLeft.className = 'drag-left'; @@ -289,7 +289,7 @@ ItemRange.prototype._repaintDragLeft = function () { * @private */ ItemRange.prototype._repaintDragRight = function () { - if (this.selected && !this.dom.dragRight) { + if (this.selected && this.options.editable && !this.dom.dragRight) { // create and show drag area var dragRight = document.createElement('div'); dragRight.className = 'drag-right';