OCA
/
web
5
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity
Browse Source

[ADD] functions to vis.js

pull/908/head
Tom Blauwendraat 6 years ago
parent
5c4944fe66
commit
ae95aed58b
1 changed files with 757 additions and 242 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 591
      web_timeline/static/lib/vis/vis.js

591
web_timeline/static/lib/vis/vis.js
View File

@ -2556,6 +2556,7 @@ return /******/ (function(modules) { // webpackBootstrap
item[this._fieldId] = id;
}
var d = {};
for (var field in item) {
if (item.hasOwnProperty(field)) {
@ -6588,7 +6589,8 @@ return /******/ (function(modules) { // webpackBootstrap
this.components.push(this.customTime);
// item set
this.itemSet = new ItemSet(this.body);
// this.itemSet = new ItemSet(this.body);
this.itemSet = new ItemSet(this.body, this.options);
this.components.push(this.itemSet);
this.itemsData = null; // DataSet
@ -9252,9 +9254,25 @@ return /******/ (function(modules) { // webpackBootstrap
if (date == undefined) {
date = this.current;
}
if (date instanceof Date) {
date = moment(date);
}
if (typeof this.format.minorLabels === "function") {
return this.format.minorLabels(date, this.scale, this.step);
}
var format = this.format.minorLabels[this.scale];
return (format && format.length > 0) ? moment(date).format(format) : '';
// noinspection FallThroughInSwitchStatementJS
switch (this.scale) {
case 'week':
if (this.isMajor() && date.weekday() !== 0) {
return "";
}
default:
// eslint-disable-line no-fallthrough
return format && format.length > 0 ? moment(date).format(format) : '';
}
};
/**
@ -9267,9 +9285,16 @@ return /******/ (function(modules) { // webpackBootstrap
if (date == undefined) {
date = this.current;
}
if (date instanceof Date) {
date = moment(date);
}
if (typeof this.format.majorLabels === "function") {
return this.format.majorLabels(date, this.scale, this.step);
}
var format = this.format.majorLabels[this.scale];
return (format && format.length > 0) ? moment(date).format(format) : '';
return format && format.length > 0 ? moment(date).format(format) : '';
};
TimeStep.prototype.getClassName = function() {
@ -11858,17 +11883,47 @@ return /******/ (function(modules) { // webpackBootstrap
var RangeItem = __webpack_require__(24);
/**
* @constructor Group
* @param {Number | String} groupId
* @param {number | string} groupId
* @param {Object} data
* @param {ItemSet} itemSet
* @constructor Group
*/
function Group(groupId, data, itemSet) {
this.groupId = groupId;
this.subgroups = {};
this.subgroupStack = {};
this.subgroupStackAll = false;
this.doInnerStack = false;
this.subgroupIndex = 0;
this.subgroupOrderer = data && data.subgroupOrder;
this.itemSet = itemSet;
this.isVisible = null;
this.stackDirty = true; // if true, items will be restacked on next redraw
if (data && data.nestedGroups) {
this.nestedGroups = data.nestedGroups;
if (data.showNested == false) {
this.showNested = false;
} else {
this.showNested = true;
}
}
if (data && data.subgroupStack) {
if (typeof data.subgroupStack === "boolean") {
this.doInnerStack = data.subgroupStack;
this.subgroupStackAll = data.subgroupStack;
} else {
// We might be doing stacking on specific sub groups, but only
// if at least one is set to do stacking
for (var key in data.subgroupStack) {
this.subgroupStack[key] = data.subgroupStack[key];
this.doInnerStack = this.doInnerStack || data.subgroupStack[key];
}
}
}
this.nestedInGroup = null;
this.dom = {};
this.props = {
@ -11881,6 +11936,7 @@ return /******/ (function(modules) { // webpackBootstrap
this.items = {}; // items filtered by groupId of this group
this.visibleItems = []; // items currently visible in window
this.itemsInRange = []; // items currently in range
this.orderedItems = {
byStart: [],
byEnd: []
@ -11889,7 +11945,7 @@ return /******/ (function(modules) { // webpackBootstrap
var me = this;
this.itemSet.body.emitter.on("checkRangedItems", function () {
me.checkRangedItems = true;
})
});
this._create();
@ -11912,6 +11968,11 @@ return /******/ (function(modules) { // webpackBootstrap
var foreground = document.createElement('div');
foreground.className = 'group';
//changes
if (this.groupId){
foreground.id = this.groupId;
}
//END CHANGES
foreground['timeline-group'] = this;
this.dom.foreground = foreground;
@ -11936,25 +11997,75 @@ return /******/ (function(modules) { // webpackBootstrap
*/
Group.prototype.setData = function (data) {
// update contents
var content = data && data.content;
var content;
var templateFunction;
if (this.itemSet.options && this.itemSet.options.groupTemplate) {
templateFunction = this.itemSet.options.groupTemplate.bind(this);
content = templateFunction(data, this.dom.inner);
} else {
content = data && data.content;
}
if (content instanceof Element) {
this.dom.inner.appendChild(content);
while (this.dom.inner.firstChild) {
this.dom.inner.removeChild(this.dom.inner.firstChild);
}
else if (content !== undefined && content !== null) {
this.dom.inner.appendChild(content);
} else if (content instanceof Object) {
templateFunction(data, this.dom.inner);
} else if (content !== undefined && content !== null) {
this.dom.inner.innerHTML = content;
}
else {
} else {
this.dom.inner.innerHTML = this.groupId || ''; // groupId can be null
}
// update title
this.dom.label.title = data && data.title || '';
if (!this.dom.inner.firstChild) {
util.addClassName(this.dom.inner, 'hidden');
util.addClassName(this.dom.inner, 'vis-hidden');
} else {
util.removeClassName(this.dom.inner, 'vis-hidden');
}
if (data && data.nestedGroups) {
if (!this.nestedGroups || this.nestedGroups != data.nestedGroups) {
this.nestedGroups = data.nestedGroups;
}
if (data.showNested !== undefined || this.showNested === undefined) {
if (data.showNested == false) {
this.showNested = false;
} else {
this.showNested = true;
}
}
util.addClassName(this.dom.label, 'vis-nesting-group');
var collapsedDirClassName = this.itemSet.options.rtl ? 'collapsed-rtl' : 'collapsed';
if (this.showNested) {
util.removeClassName(this.dom.label, collapsedDirClassName);
util.addClassName(this.dom.label, 'expanded');
} else {
util.removeClassName(this.dom.label, 'expanded');
util.addClassName(this.dom.label, collapsedDirClassName);
}
} else if (this.nestedGroups) {
this.nestedGroups = null;
collapsedDirClassName = this.itemSet.options.rtl ? 'collapsed-rtl' : 'collapsed';
util.removeClassName(this.dom.label, collapsedDirClassName);
util.removeClassName(this.dom.label, 'expanded');
util.removeClassName(this.dom.label, 'vis-nesting-group');
}
if (data && data.nestedInGroup) {
util.addClassName(this.dom.label, 'vis-nested-group');
if (this.itemSet.options && this.itemSet.options.rtl) {
this.dom.inner.style.paddingRight = '30px';
} else {
this.dom.inner.style.paddingLeft = '30px';
}
else {
util.removeClassName(this.dom.inner, 'hidden');
}
// update className
@ -12548,37 +12659,71 @@ return /******/ (function(modules) { // webpackBootstrap
*/
function ItemSet(body, options) {
this.body = body;
this.defaultOptions = {
type: null, // 'box', 'point', 'range', 'background'
orientation: 'bottom', // item orientation: 'top' or 'bottom'
orientation: {
item: 'bottom' // item orientation: 'top' or 'bottom'
},
align: 'auto', // alignment of box items
stack: true,
groupOrder: null,
stackSubgroups: true,
groupOrderSwap: function groupOrderSwap(fromGroup, toGroup, groups) {
// eslint-disable-line no-unused-vars
var targetOrder = toGroup.order;
toGroup.order = fromGroup.order;
fromGroup.order = targetOrder;
},
groupOrder: 'order',
selectable: true,
multiselect: false,
itemsAlwaysDraggable: {
item: false,
range: false
},
editable: {
updateTime: false,
updateGroup: false,
add: false,
remove: false,
overrideItems: false
},
groupEditable: {
order: false,
add: false,
remove: false
},
snap: TimeStep.snap,
onAdd: function (item, callback) {
// Only called when `objectData.target === 'item'.
onDropObjectOnItem: function onDropObjectOnItem(objectData, item, callback) {
callback(item);
},
onAdd: function onAdd(item, callback) {
callback(item);
},
onUpdate: function onUpdate(item, callback) {
callback(item);
},
onUpdate: function (item, callback) {
onMove: function onMove(item, callback) {
callback(item);
},
onMove: function (item, callback) {
onRemove: function onRemove(item, callback) {
callback(item);
},
onRemove: function (item, callback) {
onMoving: function onMoving(item, callback) {
callback(item);
},
onMoving: function (item, callback) {
onAddGroup: function onAddGroup(item, callback) {
callback(item);
},
onMoveGroup: function onMoveGroup(item, callback) {
callback(item);
},
onRemoveGroup: function onRemoveGroup(item, callback) {
callback(item);
},
@ -12589,11 +12734,20 @@ return /******/ (function(modules) { // webpackBootstrap
},
axis: 20
},
padding: 5
showTooltips: true,
tooltip: {
followMouse: false,
overflowMethod: 'flip'
},
tooltipOnItemUpdateTime: false
};
// options is shared by this ItemSet and all its items
this.options = util.extend({}, this.defaultOptions);
this.options.rtl = options.rtl;
// options for getting items from the DataSet with the correct type
this.itemOptions = {
@ -12614,26 +12768,56 @@ return /******/ (function(modules) { // webpackBootstrap
// listeners for the DataSet of the items
this.itemListeners = {
'add': function (event, params, senderId) {
'add': function add(event, params, senderId) {
// eslint-disable-line no-unused-vars
me._onAdd(params.items);
},
'update': function (event, params, senderId) {
'update': function update(event, params, senderId) {
// eslint-disable-line no-unused-vars
me._onUpdate(params.items);
},
'remove': function (event, params, senderId) {
'remove': function remove(event, params, senderId) {
// eslint-disable-line no-unused-vars
me._onRemove(params.items);
}
};
// listeners for the DataSet of the groups
this.groupListeners = {
'add': function (event, params, senderId) {
'add': function add(event, params, senderId) {
// eslint-disable-line no-unused-vars
me._onAddGroups(params.items);
if (me.groupsData && me.groupsData.length > 0) {
var groupsData = me.groupsData.getDataSet();
groupsData.get().forEach(function (groupData) {
if (groupData.nestedGroups) {
if (groupData.showNested != false) {
groupData.showNested = true;
}
var updatedGroups = [];
groupData.nestedGroups.forEach(function (nestedGroupId) {
var updatedNestedGroup = groupsData.get(nestedGroupId);
if (!updatedNestedGroup) {
return;
}
updatedNestedGroup.nestedInGroup = groupData.id;
if (groupData.showNested == false) {
updatedNestedGroup.visible = false;
}
updatedGroups = updatedGroups.concat(updatedNestedGroup);
});
groupsData.update(updatedGroups, senderId);
}
});
}
},
'update': function (event, params, senderId) {
'update': function update(event, params, senderId) {
// eslint-disable-line no-unused-vars
me._onUpdateGroups(params.items);
},
'remove': function (event, params, senderId) {
'remove': function remove(event, params, senderId) {
// eslint-disable-line no-unused-vars
me._onRemoveGroups(params.items);
}
};
@ -12643,9 +12827,11 @@ return /******/ (function(modules) { // webpackBootstrap
this.groupIds = [];
this.selection = []; // list with the ids of all selected nodes
this.stackDirty = true; // if true, all items will be restacked on next redraw
this.popup = null;
this.touchParams = {}; // stores properties while dragging
this.groupTouchParams = {};
// create the HTML DOM
this._create();
@ -13225,7 +13411,7 @@ return /******/ (function(modules) { // webpackBootstrap
// unsubscribe from current dataset
if (this.groupsData) {
util.forEach(this.groupListeners, function (callback, event) {
me.groupsData.unsubscribe(event, callback);
me.groupsData.off(event, callback);
});
// remove all drawn groups
@ -13237,15 +13423,32 @@ return /******/ (function(modules) { // webpackBootstrap
// replace the dataset
if (!groups) {
this.groupsData = null;
}
else if (groups instanceof DataSet || groups instanceof DataView) {
} else if (groups instanceof DataSet || groups instanceof DataView) {
this.groupsData = groups;
}
else {
} else {
throw new TypeError('Data must be an instance of DataSet or DataView');
}
if (this.groupsData) {
// go over all groups nesting
var groupsData = this.groupsData;
if (this.groupsData instanceof DataView) {
groupsData = this.groupsData.getDataSet();
}
groupsData.get().forEach(function (group) {
if (group.nestedGroups) {
group.nestedGroups.forEach(function (nestedGroupId) {
var updatedNestedGroup = groupsData.get(nestedGroupId);
updatedNestedGroup.nestedInGroup = group.id;
if (group.showNested == false) {
updatedNestedGroup.visible = false;
}
groupsData.update(updatedNestedGroup);
});
}
});
// subscribe to new dataset
var id = this.id;
util.forEach(this.groupListeners, function (callback, event) {
@ -13263,7 +13466,7 @@ return /******/ (function(modules) { // webpackBootstrap
// update the order of all items in each group
this._order();
this.body.emitter.emit('change', {queue: true});
this.body.emitter.emit('_change', { queue: true });
};
/**
@ -13504,6 +13707,8 @@ return /******/ (function(modules) { // webpackBootstrap
order: this.options.groupOrder
});
groupIds = this._orderNestedGroups(groupIds);
var changed = !util.equalArray(groupIds, this.groupIds);
if (changed) {
// hide all groups, removes them from the DOM
@ -13521,12 +13726,42 @@ return /******/ (function(modules) { // webpackBootstrap
}
return changed;
}
else {
} else {
return false;
}
};
/**
* Reorder the nested groups
*
* @param {Array.<number>} groupIds
* @returns {Array.<number>}
* @private
*/
ItemSet.prototype._orderNestedGroups = function (groupIds) {
var newGroupIdsOrder = [];
groupIds.forEach(function (groupId) {
var groupData = this.groupsData.get(groupId);
if (!groupData.nestedInGroup) {
newGroupIdsOrder.push(groupId);
}
if (groupData.nestedGroups) {
var nestedGroups = this.groupsData.get({
filter: function filter(nestedGroup) {
return nestedGroup.nestedInGroup == groupId;
},
order: this.options.groupOrder
});
var nestedGroupIds = nestedGroups.map(function (nestedGroup) {
return nestedGroup.id;
});
newGroupIdsOrder = newGroupIdsOrder.concat(nestedGroupIds);
}
}, this);
return newGroupIdsOrder;
};
/**
* Add a new item
* @param {Item} item
@ -13887,6 +14122,206 @@ return /******/ (function(modules) { // webpackBootstrap
}
};
ItemSet.prototype._onGroupClick = function (event) {
var group = this.groupFromTarget(event);
if (!group || !group.nestedGroups) return;
var groupsData = this.groupsData.getDataSet();
var nestingGroup = groupsData.get(group.groupId);
if (nestingGroup.showNested == undefined) {
nestingGroup.showNested = true;
}
nestingGroup.showNested = !nestingGroup.showNested;
var nestedGroups = groupsData.get(group.nestedGroups).map(function (nestedGroup) {
nestedGroup.visible = nestingGroup.showNested;
return nestedGroup;
});
groupsData.update(nestedGroups.concat(nestingGroup));
if (nestingGroup.showNested) {
util.removeClassName(group.dom.label, 'collapsed');
util.addClassName(group.dom.label, 'expanded');
} else {
util.removeClassName(group.dom.label, 'expanded');
var collapsedDirClassName = this.options.rtl ? 'collapsed-rtl' : 'collapsed';
util.addClassName(group.dom.label, collapsedDirClassName);
}
};
ItemSet.prototype._onGroupDragStart = function (event) {
if (this.options.groupEditable.order) {
this.groupTouchParams.group = this.groupFromTarget(event);
if (this.groupTouchParams.group) {
event.stopPropagation();
this.groupTouchParams.originalOrder = this.groupsData.getIds({
order: this.options.groupOrder
});
}
}
};
ItemSet.prototype._onGroupDrag = function (event) {
if (this.options.groupEditable.order && this.groupTouchParams.group) {
event.stopPropagation();
var groupsData = this.groupsData;
if (this.groupsData instanceof DataView) {
groupsData = this.groupsData.getDataSet();
}
// drag from one group to another
var group = this.groupFromTarget(event);
// try to avoid toggling when groups differ in height
if (group && group.height != this.groupTouchParams.group.height) {
var movingUp = group.top < this.groupTouchParams.group.top;
var clientY = event.center ? event.center.y : event.clientY;
var targetGroupTop = util.getAbsoluteTop(group.dom.foreground);
var draggedGroupHeight = this.groupTouchParams.group.height;
if (movingUp) {
// skip swapping the groups when the dragged group is not below clientY afterwards
if (targetGroupTop + draggedGroupHeight < clientY) {
return;
}
} else {
var targetGroupHeight = group.height;
// skip swapping the groups when the dragged group is not below clientY afterwards
if (targetGroupTop + targetGroupHeight - draggedGroupHeight > clientY) {
return;
}
}
}
if (group && group != this.groupTouchParams.group) {
var targetGroup = groupsData.get(group.groupId);
var draggedGroup = groupsData.get(this.groupTouchParams.group.groupId);
// switch groups
if (draggedGroup && targetGroup) {
this.options.groupOrderSwap(draggedGroup, targetGroup, groupsData);
groupsData.update(draggedGroup);
groupsData.update(targetGroup);
}
// fetch current order of groups
var newOrder = groupsData.getIds({
order: this.options.groupOrder
});
// in case of changes since _onGroupDragStart
if (!util.equalArray(newOrder, this.groupTouchParams.originalOrder)) {
var origOrder = this.groupTouchParams.originalOrder;
var draggedId = this.groupTouchParams.group.groupId;
var numGroups = Math.min(origOrder.length, newOrder.length);
var curPos = 0;
var newOffset = 0;
var orgOffset = 0;
while (curPos < numGroups) {
// as long as the groups are where they should be step down along the groups order
while (curPos + newOffset < numGroups && curPos + orgOffset < numGroups && newOrder[curPos + newOffset] == origOrder[curPos + orgOffset]) {
curPos++;
}
// all ok
if (curPos + newOffset >= numGroups) {
break;
}
// not all ok
// if dragged group was move upwards everything below should have an offset
if (newOrder[curPos + newOffset] == draggedId) {
newOffset = 1;
}
// if dragged group was move downwards everything above should have an offset
else if (origOrder[curPos + orgOffset] == draggedId) {
orgOffset = 1;
}
// found a group (apart from dragged group) that has the wrong position -> switch with the
// group at the position where other one should be, fix index arrays and continue
else {
var slippedPosition = newOrder.indexOf(origOrder[curPos + orgOffset]);
var switchGroup = groupsData.get(newOrder[curPos + newOffset]);
var shouldBeGroup = groupsData.get(origOrder[curPos + orgOffset]);
this.options.groupOrderSwap(switchGroup, shouldBeGroup, groupsData);
groupsData.update(switchGroup);
groupsData.update(shouldBeGroup);
var switchGroupId = newOrder[curPos + newOffset];
newOrder[curPos + newOffset] = origOrder[curPos + orgOffset];
newOrder[slippedPosition] = switchGroupId;
curPos++;
}
}
}
}
}
};
ItemSet.prototype._onGroupDragEnd = function (event) {
if (this.options.groupEditable.order && this.groupTouchParams.group) {
event.stopPropagation();
// update existing group
var me = this;
var id = me.groupTouchParams.group.groupId;
var dataset = me.groupsData.getDataSet();
var groupData = util.extend({}, dataset.get(id)); // clone the data
me.options.onMoveGroup(groupData, function (groupData) {
if (groupData) {
// apply changes
groupData[dataset._fieldId] = id; // ensure the group contains its id (can be undefined)
dataset.update(groupData);
} else {
// fetch current order of groups
var newOrder = dataset.getIds({
order: me.options.groupOrder
});
// restore original order
if (!util.equalArray(newOrder, me.groupTouchParams.originalOrder)) {
var origOrder = me.groupTouchParams.originalOrder;
var numGroups = Math.min(origOrder.length, newOrder.length);
var curPos = 0;
while (curPos < numGroups) {
// as long as the groups are where they should be step down along the groups order
while (curPos < numGroups && newOrder[curPos] == origOrder[curPos]) {
curPos++;
}
// all ok
if (curPos >= numGroups) {
break;
}
// found a group that has the wrong position -> switch with the
// group at the position where other one should be, fix index arrays and continue
var slippedPosition = newOrder.indexOf(origOrder[curPos]);
var switchGroup = dataset.get(newOrder[curPos]);
var shouldBeGroup = dataset.get(origOrder[curPos]);
me.options.groupOrderSwap(switchGroup, shouldBeGroup, dataset);
dataset.update(switchGroup);
dataset.update(shouldBeGroup);
var switchGroupId = newOrder[curPos];
newOrder[curPos] = origOrder[curPos];
newOrder[slippedPosition] = switchGroupId;
curPos++;
}
}
}
});
me.body.emitter.emit('groupDragged', { groupId: id });
}
};
/**
* Handle selecting/deselecting an item when tapping it
* @param {Event} event
@ -22879,6 +23314,7 @@ return /******/ (function(modules) { // webpackBootstrap
this.redrawCount = 0;
// attach the root panel to the provided container
if (!container) throw new Error('No container provided');
container.appendChild(this.dom.root);
@ -23129,6 +23565,25 @@ return /******/ (function(modules) { // webpackBootstrap
return customBarId;
};
/**
* Set a custom title for the custom time bar.
* @param {string} [title] Custom title
* @param {number} [id=undefined] Id of the custom time bar.
* @returns {*}
*/
Core.prototype.setCustomTimeTitle = function (title, id) {
var customTimes = this.customTimes.filter(function (component) {
return component.options.id === id;
});
if (customTimes.length === 0) {
throw new Error('No custom time bar found with id ' + (0, _stringify2['default'])(id));
}
if (customTimes.length > 0) {
return customTimes[0].setCustomTitle(title);
}
};
/**
* Remove previously added custom bar
* @param {int} id ID of the custom bar to be removed
@ -23728,6 +24183,66 @@ return /******/ (function(modules) { // webpackBootstrap
return this.props.scrollTop;
};
/**
* Zoom in the window such that given time is centered on screen.
* @param {number} percentage - must be between [0..1]
* @param {Object} [options] Available options:
* `animation: boolean | {duration: number, easingFunction: string}`
* If true (default), the range is animated
* smoothly to the new window. An object can be
* provided to specify duration and easing function.
* Default duration is 500 ms, and default easing
* function is 'easeInOutQuad'.
* @param {function} [callback] a callback funtion to be executed at the end of this function
*/
Core.prototype.zoomIn = function (percentage, options, callback) {
if (!percentage || percentage < 0 || percentage > 1) return;
if (typeof arguments[1] == "function") {
callback = arguments[1];
options = {};
}
var range = this.getWindow();
var start = range.start.valueOf();
var end = range.end.valueOf();
var interval = end - start;
var newInterval = interval / (1 + percentage);
var distance = (interval - newInterval) / 2;
var newStart = start + distance;
var newEnd = end - distance;
this.setWindow(newStart, newEnd, options, callback);
};
/**
* Zoom out the window such that given time is centered on screen.
* @param {number} percentage - must be between [0..1]
* @param {Object} [options] Available options:
* `animation: boolean | {duration: number, easingFunction: string}`
* If true (default), the range is animated
* smoothly to the new window. An object can be
* provided to specify duration and easing function.
* Default duration is 500 ms, and default easing
* function is 'easeInOutQuad'.
* @param {function} [callback] a callback funtion to be executed at the end of this function
*/
Core.prototype.zoomOut = function (percentage, options, callback) {
if (!percentage || percentage < 0 || percentage > 1) return;
if (typeof arguments[1] == "function") {
callback = arguments[1];
options = {};
}
var range = this.getWindow();
var start = range.start.valueOf();
var end = range.end.valueOf();
var interval = end - start;
var newStart = start - interval * percentage / 2;
var newEnd = end + interval * percentage / 2;
this.setWindow(newStart, newEnd, options, callback);
};
module.exports = Core;

Write Preview
Loading…
Cancel
Save