galads/icehrm
1
0
Fork 0
Code Issues Pull Requests Releases Activity

Changes for v22.0.0.OS

Browse Source
This commit is contained in:
Thilina Hasantha
2018-04-28 03:04:36 +02:00
parent d105ee3512
commit 8ebf28fbcb
471 changed files with 160244 additions and 293 deletions
Download Patch File Download Diff File Expand all files Collapse all files

89
web/bower_components/vis/examples/timeline/other/customTimeBars.html vendored Normal file
View File

@@ -0,0 +1,89 @@
<!DOCTYPE HTML>
<html>
<head>
<title>Timeline | Show current and custom time bars</title>
<style type="text/css">
body, html {
font-family: sans-serif;
font-size: 11pt;
}
</style>
<script src="../../../dist/vis.js"></script>
<link href="../../../dist/vis-timeline-graph2d.min.css" rel="stylesheet" type="text/css" />
</head>
<body>
<p>
The Timeline has functions to add multiple custom time bars which can be dragged by the user.
</p>
<p>
<input type="button" id="add" value="Add custom vertical bar">
<input type="text" id="barId" placeholder="custom bar ID">
</p>
<p>
<input type="button" id="remove" value="Remove custom vertical bar">
<input type="text" id="barIndex" value="t1" placeholder="custom bar ID">
</p>
<p>
<code><strong>timechange</strong></code> event, index: <span id="timechangeBar"></span>, time: <span id="timechangeEvent"></span>
</p>
<p>
<code><strong>timechanged</strong></code> event, index: <span id="timechangedBar"></span>, time: <span id="timechangedEvent"></span>
</p><br>
<div id="visualization"></div>
<script type="text/javascript">
var container = document.getElementById('visualization');
var items = new vis.DataSet();
var customDate = new Date();
var options = {
showCurrentTime: true,
start: new Date(Date.now() - 1000 * 60 * 60 * 24),
end: new Date(Date.now() + 1000 * 60 * 60 * 24 * 6)
};
var timeline = new vis.Timeline(container, items, options);
// Set first time bar
customDate = new Date(customDate.getFullYear(), customDate.getMonth(), customDate.getDate() + 1);
timeline.addCustomTime(customDate, 't1');
document.getElementById('add').onclick = function () {
try {
customDate = new Date(customDate.getFullYear(), customDate.getMonth(), customDate.getDate() + 1);
var barId = document.getElementById('barId').value || undefined;
timeline.addCustomTime(customDate, barId);
document.getElementById('barId').value = '';
}
catch (err) {
console.log(err);
alert(err);
}
};
document.getElementById('remove').onclick = function () {
try {
timeline.removeCustomTime(document.getElementById('barIndex').value);
document.getElementById('barIndex').value = '';
}
catch (err) {
console.log(err);
alert(err);
}
};
timeline.on('timechange', function (properties) {
document.getElementById('timechangeBar').innerHTML = properties.id;
document.getElementById('timechangeEvent').innerHTML = properties.time;
});
timeline.on('timechanged', function (properties) {
document.getElementById('timechangedBar').innerHTML = properties.id;
document.getElementById('timechangedEvent').innerHTML = properties.time;
});
</script>
</body>
</html>

95
web/bower_components/vis/examples/timeline/other/customTimeBarsTooltip.html vendored Normal file
View File

@@ -0,0 +1,95 @@
<!DOCTYPE HTML>
<html>
<head>
<title>Timeline | Show current and custom time bars</title>
<style type="text/css">
body, html {
font-family: sans-serif;
font-size: 11pt;
}
</style>
<script src="../../../dist/vis.js"></script>
<link href="../../../dist/vis-timeline-graph2d.min.css" rel="stylesheet" type="text/css" />
<script src="../../googleAnalytics.js"></script>
</head>
<body>
<p>
The Timeline has functions to add multiple custom time bars which can be dragged by the user.
</p>
<p>
<input type="button" id="add" value="Add custom vertical bar">
<input type="text" id="barId" placeholder="custom bar ID">
</p>
<p>
<input type="button" id="remove" value="Remove custom vertical bar">
<input type="text" id="barIndex" value="t1" placeholder="custom bar ID">
</p>
<p>
<code><strong>timechange</strong></code> event, index: <span id="timechangeBar"></span>, time: <span id="timechangeEvent"></span>
</p>
<p>
<code><strong>timechanged</strong></code> event, index: <span id="timechangedBar"></span>, time: <span id="timechangedEvent"></span>
</p><br>
<div id="visualization"></div>
<script type="text/javascript">
var container = document.getElementById('visualization');
var items = new vis.DataSet();
var customDate = new Date();
var options = {
showCurrentTime: true,
start: new Date(Date.now() - 1000 * 60 * 60 * 24),
end: new Date(Date.now() + 1000 * 60 * 60 * 24 * 6)
};
var timeline = new vis.Timeline(container, items, options);
// Set first time bar
customDate = new Date(customDate.getFullYear(), customDate.getMonth(), customDate.getDate() + 1);
timeline.addCustomTime(customDate, 't1');
timeline.setCustomTimeTitle(function(time){
return "I'm t1!";
}, "t1");
document.getElementById('add').onclick = function () {
try {
customDate = new Date(customDate.getFullYear(), customDate.getMonth(), customDate.getDate() + 1);
var barId = document.getElementById('barId').value || undefined;
timeline.addCustomTime(customDate, barId);
timeline.setCustomTimeTitle(function(time){
return "I'm "+barId+"!";
}, barId);
document.getElementById('barId').value = '';
}
catch (err) {
console.log(err);
alert(err);
}
};
document.getElementById('remove').onclick = function () {
try {
timeline.removeCustomTime(document.getElementById('barIndex').value);
document.getElementById('barIndex').value = '';
}
catch (err) {
console.log(err);
alert(err);
}
};
timeline.on('timechange', function (properties) {
document.getElementById('timechangeBar').innerHTML = properties.id;
document.getElementById('timechangeEvent').innerHTML = properties.time;
});
timeline.on('timechanged', function (properties) {
document.getElementById('timechangedBar').innerHTML = properties.id;
document.getElementById('timechangedEvent').innerHTML = properties.time;
});
</script>
</body>
</html>

44
web/bower_components/vis/examples/timeline/other/dataAttributes.html vendored Normal file
View File

@@ -0,0 +1,44 @@
<!DOCTYPE HTML>
<html>
<head>
<title>Timeline | Basic demo</title>
<style type="text/css">
body, html {
font-family: sans-serif;
}
</style>
<script src="../../../dist/vis.js"></script>
<link href="../../../dist/vis-timeline-graph2d.min.css" rel="stylesheet" type="text/css" />
</head>
<body>
<p>
In this example all items get an HTML attribute attached: each item gets an attribute <code>data-id</code>, and items 1 and 6 have an additional attribute <code>data-tooltip</code>.
</p>
<div id="visualization"></div>
<script type="text/javascript">
// DOM element where the Timeline will be attached
var container = document.getElementById('visualization');
// Create a DataSet (allows two way data-binding)
var items = new vis.DataSet([
{id: 1, content: 'item 1', start: '2014-04-20', tooltip: 'This is item 1'},
{id: 2, content: 'item 2', start: '2014-04-14'},
{id: 3, content: 'item 3', start: '2014-04-18'},
{id: 4, content: 'item 4', start: '2014-04-16', end: '2014-04-19'},
{id: 5, content: 'item 5', start: '2014-04-25'},
{id: 6, content: 'item 6', start: '2014-04-27', type: 'point', tooltip: 'This is item 6'}
]);
// Configuration for the Timeline
var options = {dataAttributes: ['tooltip', 'id']};
// Create a Timeline
var timeline = new vis.Timeline(container, items, options);
</script>
</body>
</html>

44
web/bower_components/vis/examples/timeline/other/dataAttributesAll.html vendored Normal file
View File

@@ -0,0 +1,44 @@
<!DOCTYPE HTML>
<html>
<head>
<title>Timeline | Basic demo</title>
<style type="text/css">
body, html {
font-family: sans-serif;
}
</style>
<script src="../../../dist/vis.js"></script>
<link href="../../../dist/vis-timeline-graph2d.min.css" rel="stylesheet" type="text/css" />
</head>
<body>
<p>
In this example all items get HTML attributes attached: each item gets <code>data-?</code> attributes for each field defined on the JS object.
</p>
<div id="visualization"></div>
<script type="text/javascript">
// DOM element where the Timeline will be attached
var container = document.getElementById('visualization');
// Create a DataSet (allows two way data-binding)
var items = new vis.DataSet([
{id: 1, content: 'item 1', start: '2014-04-20', tooltip: 'This is item 1'},
{id: 2, content: 'item 2', start: '2014-04-14'},
{id: 3, content: 'item 3', start: '2014-04-18'},
{id: 4, content: 'item 4', start: '2014-04-16', end: '2014-04-19'},
{id: 5, content: 'item 5', start: '2014-04-25'},
{id: 6, content: 'item 6', start: '2014-04-27', type: 'point', tooltip: 'This is item 6'}
]);
// Configuration for the Timeline
var options = {dataAttributes: 'all'};
// Create a Timeline
var timeline = new vis.Timeline(container, items, options);
</script>
</body>
</html>

191
web/bower_components/vis/examples/timeline/other/drag&drop.html vendored Normal file
View File

@@ -0,0 +1,191 @@
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8"/>
<title>Timeline | Drag & Drop</title>
<script src="../../../dist/vis.js"></script>
<link href="../../../dist/vis.css" rel="stylesheet" type="text/css" />
<style type="text/css">
li.item {
list-style: none;
width: 150px;
color: #1A1A1A;
background-color: #D5DDF6;
border: 1px solid #97B0F8;
border-radius: 2px;
margin-bottom: 5px;
padding: 5px 12px;
}
li.item:before {
content: "≣";
font-family: Arial, sans-serif;
display: inline-block;
font-size: inherit;
cursor: move;
}
li.object-item {
list-style: none;
width: 150px;
color: #1A1A1A;
background-color: #D5DDF6;
border: 1px solid #97B0F8;
border-radius: 2px;
margin-bottom: 5px;
padding: 5px 12px;
}
li.object-item:before {
content: "≣";
font-family: Arial, sans-serif;
display: inline-block;
font-size: inherit;
cursor: move;
}
.items-panel {
display: flex;
justify-content: space-around;
}
</style>
</head>
<body>
<h1>Timeline Drag & Drop Example</h1>
<p>For this to work, you will have to define your own <code>'dragstart'</code> eventListener on each item in your list of items (make sure that any new item added to the list is attached to this eventListener 'dragstart' handler). This 'dragstart' handler must set <code>dataTransfer</code> - notice you can set the item's information as you want this way.</p>
<div id="mytimeline" ></div>
<div class='items-panel'>
<div class='side'>
<h3>Items:</h3>
<ul class="items">
<li draggable="true" class="item">
item 1 - box
</li>
<li draggable="true" class="item">
item 2 - point
</li>
<li draggable="true" class="item">
item 3 - range
</li>
<li draggable="true" class="item">
item 3 - range - fixed times - <br>
(start: now, end: now + 10 min)
</li>
</ul>
</div>
<div class='side'>
<h3>Object with "target:'item'":</h3>
<li draggable="true" class="object-item">
object with target:'item'
</li>
</div>
</div>
<script>
// create groups
var numberOfGroups = 3;
var groups = new vis.DataSet()
for (var i = 0; i < numberOfGroups; i++) {
groups.add({
id: i,
content: 'Truck&nbsp;' + i
})
}
// create items
var numberOfItems = 10;
var items = new vis.DataSet();
var itemsPerGroup = Math.round(numberOfItems/numberOfGroups);
for (var truck = 0; truck < numberOfGroups; truck++) {
var date = new Date();
for (var order = 0; order < itemsPerGroup; order++) {
date.setHours(date.getHours() + 4 * (Math.random() < 0.2));
var start = new Date(date);
date.setHours(date.getHours() + 2 + Math.floor(Math.random()*4));
var end = new Date(date);
items.add({
id: order + itemsPerGroup * truck,
group: truck,
start: start,
end: end,
content: 'Order ' + order
});
}
}
// specify options
var options = {
stack: true,
start: new Date(),
end: new Date(1000*60*60*24 + (new Date()).valueOf()),
editable: true,
orientation: 'top',
onDropObjectOnItem: function(objectData, item, callback) {
if (!item) { return; }
alert('dropped object with content: "' + objectData.content + '" to item: "' + item.content + '"');
}
};
// create a Timeline
var container = document.getElementById('mytimeline');
timeline1 = new vis.Timeline(container, items, groups, options);
function handleDragStart(event) {
var dragSrcEl = event.target;
event.dataTransfer.effectAllowed = 'move';
var itemType = event.target.innerHTML.split('-')[1].trim();
var item = {
id: new Date(),
type: itemType,
content: event.target.innerHTML.split('-')[0].trim()
};
var isFixedTimes = (event.target.innerHTML.split('-')[2] && event.target.innerHTML.split('-')[2].trim() == 'fixed times')
if (isFixedTimes) {
item.start = new Date();
item.end = new Date(1000*60*10 + (new Date()).valueOf());
}
event.dataTransfer.setData("text", JSON.stringify(item));
}
function handleObjectItemDragStart(event) {
var dragSrcEl = event.target;
event.dataTransfer.effectAllowed = 'move';
var objectItem = {
content: 'objectItemData',
target: 'item'
};
event.dataTransfer.setData("text", JSON.stringify(objectItem));
}
var items = document.querySelectorAll('.items .item');
var objectItems = document.querySelectorAll('.object-item');
for (var i = items.length - 1; i >= 0; i--) {
var item = items[i];
item.addEventListener('dragstart', handleDragStart.bind(this), false);
}
for (var i = objectItems.length - 1; i >= 0; i--) {
var objectItem = objectItems[i];
objectItem.addEventListener('dragstart', handleObjectItemDragStart.bind(this), false);
}
</script>
</body>
</html>

141
web/bower_components/vis/examples/timeline/other/functionLabelFormats.html vendored Normal file
View File

@@ -0,0 +1,141 @@
<!DOCTYPE HTML>
<html>
<head>
<title>Timeline | Custom function label format example</title>
<style>
body, html {
font-family: arial, sans-serif;
font-size: 11pt;
}
#visualization {
box-sizing: border-box;
width: 100%;
height: 300px;
}
</style>
<!-- note: moment.js must be loaded before vis.js, else vis.js uses its embedded version of moment.js -->
<script src="http://cdnjs.cloudflare.com/ajax/libs/moment.js/2.8.4/moment.min.js"></script>
<script src="../../../dist/vis.js"></script>
<link href="../../../dist/vis-timeline-graph2d.min.css" rel="stylesheet" type="text/css" />
</head>
<body>
<p>
This example demonstrate using custom function label formats.
</p>
<div id="visualization"></div>
<script>
var now = moment().minutes(0).seconds(0).milliseconds(0);
var groupCount = 3;
var itemCount = 20;
// create a data set with groups
var names = ['John', 'Alston', 'Lee', 'Grant'];
var groups = new vis.DataSet();
for (var g = 0; g < groupCount; g++) {
groups.add({id: g, content: names[g]});
}
// create a dataset with items
var items = new vis.DataSet();
for (var i = 0; i < itemCount; i++) {
var start = now.clone().add(Math.random() * 200, 'hours');
var group = Math.floor(Math.random() * groupCount);
items.add({
id: i,
group: group,
content: 'item ' + i +
' <span style="color:#97B0F8;">(' + names[group] + ')</span>',
start: start,
type: 'box'
});
}
// create visualization
var container = document.getElementById('visualization');
var options = {
format: {
minorLabels: function(date, scale, step) {
var now = new Date();
var ago = now - date;
var divider;
switch (scale) {
case 'millisecond':
divider = 1;
break;
case 'second':
divider = 1000;
break;
case 'minute':
divider = 1000 * 60;
break;
case 'hour':
divider = 1000 * 60 * 60;
break;
case 'day':
divider = 1000 * 60 * 60 * 24;
break;
case 'weekday':
divider = 1000 * 60 * 60 * 24 * 7;
break;
case 'month':
divider = 1000 * 60 * 60 * 24 * 30;
break;
case 'year':
divider = 1000 * 60 * 60 * 24 * 365;
break;
default:
return new Date(date);
}
return (Math.round(ago * step / divider)) + " " + scale + "s ago"
},
majorLabels: function(date, scale, step) {
var now = new Date();
var ago = now - date;
var divider;
switch (scale) {
case 'millisecond':
divider = 1;
break;
case 'second':
divider = 1000;
break;
case 'minute':
divider = 1000 * 60;
break;
case 'hour':
divider = 1000 * 60 * 60;
break;
case 'day':
divider = 1000 * 60 * 60 * 24;
break;
case 'weekday':
divider = 1000 * 60 * 60 * 24 * 7;
break;
case 'month':
divider = 1000 * 60 * 60 * 24 * 30;
break;
case 'year':
divider = 1000 * 60 * 60 * 24 * 365;
break;
default:
return new Date(date);
}
return (Math.round(ago * step / divider)) + " " + scale + "s ago"
}
}
};
var timeline = new vis.Timeline(container);
timeline.setOptions(options);
timeline.setGroups(groups);
timeline.setItems(items);
</script>
</body>
</html>

110
web/bower_components/vis/examples/timeline/other/groupsPerformance.html vendored Normal file
View File

@@ -0,0 +1,110 @@
<html>
<head>
<title>Timeline | A lot of grouped data</title>
<script src="../../../dist/vis.js"></script>
<link href="../../../dist/vis-timeline-graph2d.min.css" rel="stylesheet" type="text/css" />
<style type="text/css">
body {
color: #4D4D4D;
font: 10pt arial;
}
</style>
</head>
<body onresize="/*timeline.checkResize();*/">
<h1>Timeline grouping performance</h1>
<p>
Choose a number of items:
<a href="?count=100">100</a>,
<a href="?count=1000">1000</a>,
<a href="?count=10000">10000</a>,
<a href="?count=100000">100000</a>
<p>
<p>
Current number of items: <span id='count'>100</span>
</p>
<div id="mytimeline"></div>
<script>
/**
* Get URL parameter
* http://www.netlobo.com/url_query_string_javascript.html
*/
function gup( name ) {
name = name.replace(/[\[]/,"\\[").replace(/[\]]/,"\\]");
var regexS = "[\\?&]"+name+"=([^&#]*)";
var regex = new RegExp( regexS );
var results = regex.exec( window.location.href );
if( results == null )
return "";
else
return results[1];
}
// get selected item count from url parameter
var count = (Number(gup('count')) || 1000);
// create groups
var groups = new vis.DataSet([
{id: 1, content: 'Truck&nbsp;1'},
{id: 2, content: 'Truck&nbsp;2'},
{id: 3, content: 'Truck&nbsp;3'},
{id: 4, content: 'Truck&nbsp;4'}
]);
// create items
var items = new vis.DataSet();
var order = 1;
var truck = 1;
for (var j = 0; j < 4; j++) {
var date = new Date();
for (var i = 0; i < count/4; i++) {
date.setHours(date.getHours() + 4 * (Math.random() < 0.2));
var start = new Date(date);
date.setHours(date.getHours() + 2 + Math.floor(Math.random()*4));
var end = new Date(date);
items.add({
id: order,
group: truck,
start: start,
end: end,
content: 'Order ' + order
});
order++;
}
truck++;
}
// specify options
var options = {
stack: false,
start: new Date(),
end: new Date(1000*60*60*24 + (new Date()).valueOf()),
editable: true,
margin: {
item: 10, // minimal margin between items
axis: 5 // minimal margin between items and the axis
},
orientation: 'top'
};
// create a Timeline
var container = document.getElementById('mytimeline');
timeline = new vis.Timeline(container, null, options);
timeline.setGroups(groups);
timeline.setItems(items);
document.getElementById('count').innerHTML = count;
</script>
</body>
</html>

53
web/bower_components/vis/examples/timeline/other/hidingPeriods.html vendored Normal file
View File

@@ -0,0 +1,53 @@
<!DOCTYPE HTML>
<html>
<head>
<title>Timeline | Hiding periods</title>
<style type="text/css">
body, html {
font-family: sans-serif;
}
</style>
<script src="../../../dist/vis.js"></script>
<link href="../../../dist/vis-timeline-graph2d.min.css" rel="stylesheet" type="text/css"/>
</head>
<body>
<p>
It's possible to hide (recurring) periods from the Timeline. The following example hides weekends and nights.
</p>
<div id="visualization"></div>
<script type="text/javascript">
// DOM element where the Timeline will be attached
var container = document.getElementById('visualization');
// Create a DataSet (allows two way data-binding)
var items = new vis.DataSet([
{id: 1, content: 'item 1', start: '2014-04-19'},
{id: 2, content: 'item 2', start: '2014-04-21'},
{id: 3, content: 'item 3', start: '2014-04-18'},
{id: 4, content: 'item 4', start: '2014-04-16', end: '2014-04-24'},
{id: 5, content: 'item 5', start: '2014-04-26 12:00:00'},
{id: 6, content: 'item 6', start: '2014-04-27', type: 'point'}
]);
// Configuration for the Timeline
var options = {
hiddenDates: [
{start: '2014-03-21 00:00:00', end: '2014-03-28 00:00:00'},
{start: '2013-10-26 00:00:00', end: '2013-10-28 00:00:00', repeat: 'weekly'}, // daily weekly monthly yearly
{start: '2013-03-29 20:00:00', end: '2013-03-30 09:00:00', repeat: 'daily'} // daily weekly monthly yearly
],
start: '2014-04-17',
end: '2014-05-01',
height: '200px',
editable: true
};
// Create a Timeline
var timeline = new vis.Timeline(container, items, options);
timeline.addCustomTime("2014-04-18 13:00:00");
</script>
</body>
</html>

77
web/bower_components/vis/examples/timeline/other/horizontalScroll.html vendored Normal file
View File

@@ -0,0 +1,77 @@
<html>
<head>
<title>Timeline | Horizontal Scroll Option</title>
<script src="../../../dist/vis.js"></script>
<link href="../../../dist/vis.css" rel="stylesheet" type="text/css" />
</head>
<body>
<h1>Timeline horizontal scroll option</h1>
<div id="mytimeline"></div>
<script>
// create groups
var numberOfGroups = 25;
var groups = new vis.DataSet()
for (var i = 0; i < numberOfGroups; i++) {
groups.add({
id: i,
content: 'Truck&nbsp;' + i
})
}
// create items
var numberOfItems = 1000;
var items = new vis.DataSet();
var itemsPerGroup = Math.round(numberOfItems/numberOfGroups);
for (var truck = 0; truck < numberOfGroups; truck++) {
var date = new Date();
for (var order = 0; order < itemsPerGroup; order++) {
date.setHours(date.getHours() + 4 * (Math.random() < 0.2));
var start = new Date(date);
date.setHours(date.getHours() + 2 + Math.floor(Math.random()*4));
var end = new Date(date);
items.add({
id: order + itemsPerGroup * truck,
group: truck,
start: start,
end: end,
content: 'Order ' + order
});
}
}
// specify options
var options = {
stack: true,
horizontalScroll: true,
zoomKey: 'ctrlKey',
maxHeight: 400,
start: new Date(),
end: new Date(1000*60*60*24 + (new Date()).valueOf()),
editable: true,
margin: {
item: 10, // minimal margin between items
axis: 5 // minimal margin between items and the axis
},
orientation: 'top'
};
// create a Timeline
var container = document.getElementById('mytimeline');
timeline = new vis.Timeline(container, items, groups, options);
</script>
</body>
</html>

68
web/bower_components/vis/examples/timeline/other/localization.html vendored Normal file
View File

@@ -0,0 +1,68 @@
<!DOCTYPE HTML>
<html>
<head>
<title>Timeline | Localization</title>
<style type="text/css">
body, html, select {
font-family: sans-serif;
font-size: 11pt;
}
</style>
<script src="http://cdnjs.cloudflare.com/ajax/libs/moment.js/2.8.1/moment-with-locales.min.js"></script>
<script src="../../../dist/vis.js"></script>
<link href="../../../dist/vis-timeline-graph2d.min.css" rel="stylesheet" type="text/css" />
</head>
<body>
<p>
To localize the Timeline, one has to load a version of moment.js including locales. To set a locale, specify option <code>{locale: STRING}</code>.
</p>
<p>
<label for="locale">Select a locale:</label>
<select id="locale">
<option value="en" selected>en</option>
<option value="it">it</option>
<option value="nl">nl</option>
<option value="de">de</option>
</select>
</p>
<div id="visualization"></div>
<script type="text/javascript">
var DAY = 24 * 60 * 60 * 1000;
// DOM element where the Timeline will be attached
var container = document.getElementById('visualization');
// Create a DataSet (allows two way data-binding)
var items = new vis.DataSet([
{id: 1, content: 'item 1', start: new Date(new Date().valueOf() - DAY)},
{id: 2, content: 'item 2', start: new Date(new Date().valueOf() + 2 * DAY)}
]);
// Configuration for the Timeline
var options = {
showCurrentTime: true
};
// Create a Timeline
var timeline = new vis.Timeline(container, items, options);
timeline.addCustomTime(new Date());
timeline.setCustomTime(new Date(new Date().valueOf() + DAY));
// update the locale when changing the select box value
var select = document.getElementById('locale');
select.onchange = function () {
timeline.setOptions({
locale: this.value
});
};
select.onchange();
</script>
</body>
</html>

65
web/bower_components/vis/examples/timeline/other/performance.html vendored Normal file
View File

@@ -0,0 +1,65 @@
<!DOCTYPE HTML>
<html>
<head>
<title>Timeline | performance</title>
<style>
body, html {
font-family: arial, sans-serif;
font-size: 11pt;
}
</style>
<!-- note: moment.js must be loaded before vis.js, else vis.js uses its embedded version of moment.js -->
<script src="http://cdnjs.cloudflare.com/ajax/libs/moment.js/2.8.4/moment.min.js"></script>
<script src="../../../dist/vis.js"></script>
<link href="../../../dist/vis-timeline-graph2d.min.css" rel="stylesheet" type="text/css" />
</head>
<body>
<p>
Test the performance with a lot of items. The Timeline can load hundreds of thousands of items, but the performance of rendering them in the browser is limited. Rendering typically runs smooth for up to a few hundreds of items at once (you can set a <code>zoomMax</code> to prevent the user from zooming out too far).
</p>
<p>
<label for="count">Number of items</label>
<input id="count" value="10000">
<input id="draw" type="button" value="draw">
</p>
<div id="visualization"></div>
<script>
// create a dataset with items
var now = moment().minutes(0).seconds(0).milliseconds(0);
var items = new vis.DataSet({
type: {start: 'ISODate', end: 'ISODate' }
});
// create data
function createData() {
var count = parseInt(document.getElementById('count').value) || 100;
var newData = [];
var start = now;
for (var i = 0; i < count; i++) {
newData.push({id: i, content: 'item ' + i, start: start + 24*3600*1000 * i}); // much much faster than now.clone add days
}
items.clear();
items.add(newData);
}
createData();
document.getElementById('draw').onclick = createData;
var container = document.getElementById('visualization');
var options = {
editable: true,
start: now.clone().add(-3, 'days'),
end: now.clone().add(11, 'days'),
zoomMin: 1000 * 60 * 60 * 24, // a day
zoomMax: 1000 * 60 * 60 * 24 * 30 * 3 // three months
};
var timeline = new vis.Timeline(container, items, options);
</script>
</body>
</html>

17
web/bower_components/vis/examples/timeline/other/requirejs/requirejs_example.html vendored Normal file
View File

@@ -0,0 +1,17 @@
<!DOCTYPE HTML>
<html>
<head>
<title>Timeline require.js demo</title>
<script data-main="scripts/main" src="scripts/require.js"></script>
<link href="../../../../dist/vis-timeline-graph2d.min.css" rel="stylesheet" type="text/css" />
</head>
<body>
<p>
This example shows how to load the vis.js library using require.js.
</p>
<div id="visualization"></div>
</body>
</html>

19
web/bower_components/vis/examples/timeline/other/requirejs/scripts/main.js vendored Normal file
View File

@@ -0,0 +1,19 @@
require.config({
paths: {
vis: '../../../../../dist/vis'
}
});
require(['vis'], function (vis) {
var container = document.getElementById('visualization');
var data = new vis.DataSet([
{id: 1, content: 'item 1', start: '2013-04-20'},
{id: 2, content: 'item 2', start: '2013-04-14'},
{id: 3, content: 'item 3', start: '2013-04-18'},
{id: 4, content: 'item 4', start: '2013-04-16', end: '2013-04-19'},
{id: 5, content: 'item 5', start: '2013-04-25'},
{id: 6, content: 'item 6', start: '2013-04-27'}
]);
var options = {};
var timeline = new vis.Timeline(container, data, options);
});

35
web/bower_components/vis/examples/timeline/other/requirejs/scripts/require.js vendored Normal file
View File

@@ -0,0 +1,35 @@
/*
RequireJS 2.1.2 Copyright (c) 2010-2012, The Dojo Foundation All Rights Reserved.
Available via the MIT or new BSD license.
see: http://github.com/jrburke/requirejs for details
*/
var requirejs,require,define;
(function(Y){function H(b){return"[object Function]"===L.call(b)}function I(b){return"[object Array]"===L.call(b)}function x(b,c){if(b){var d;for(d=0;d<b.length&&(!b[d]||!c(b[d],d,b));d+=1);}}function M(b,c){if(b){var d;for(d=b.length-1;-1<d&&(!b[d]||!c(b[d],d,b));d-=1);}}function r(b,c){return da.call(b,c)}function i(b,c){return r(b,c)&&b[c]}function E(b,c){for(var d in b)if(r(b,d)&&c(b[d],d))break}function Q(b,c,d,i){c&&E(c,function(c,h){if(d||!r(b,h))i&&"string"!==typeof c?(b[h]||(b[h]={}),Q(b[h],
c,d,i)):b[h]=c});return b}function t(b,c){return function(){return c.apply(b,arguments)}}function Z(b){if(!b)return b;var c=Y;x(b.split("."),function(b){c=c[b]});return c}function J(b,c,d,i){c=Error(c+"\nhttp://requirejs.org/docs/errors.html#"+b);c.requireType=b;c.requireModules=i;d&&(c.originalError=d);return c}function ea(b){function c(a,g,v){var e,n,b,c,d,j,f,h=g&&g.split("/");e=h;var l=m.map,k=l&&l["*"];if(a&&"."===a.charAt(0))if(g){e=i(m.pkgs,g)?h=[g]:h.slice(0,h.length-1);g=a=e.concat(a.split("/"));
for(e=0;g[e];e+=1)if(n=g[e],"."===n)g.splice(e,1),e-=1;else if(".."===n)if(1===e&&(".."===g[2]||".."===g[0]))break;else 0<e&&(g.splice(e-1,2),e-=2);e=i(m.pkgs,g=a[0]);a=a.join("/");e&&a===g+"/"+e.main&&(a=g)}else 0===a.indexOf("./")&&(a=a.substring(2));if(v&&(h||k)&&l){g=a.split("/");for(e=g.length;0<e;e-=1){b=g.slice(0,e).join("/");if(h)for(n=h.length;0<n;n-=1)if(v=i(l,h.slice(0,n).join("/")))if(v=i(v,b)){c=v;d=e;break}if(c)break;!j&&(k&&i(k,b))&&(j=i(k,b),f=e)}!c&&j&&(c=j,d=f);c&&(g.splice(0,d,
c),a=g.join("/"))}return a}function d(a){z&&x(document.getElementsByTagName("script"),function(g){if(g.getAttribute("data-requiremodule")===a&&g.getAttribute("data-requirecontext")===j.contextName)return g.parentNode.removeChild(g),!0})}function y(a){var g=i(m.paths,a);if(g&&I(g)&&1<g.length)return d(a),g.shift(),j.require.undef(a),j.require([a]),!0}function f(a){var g,b=a?a.indexOf("!"):-1;-1<b&&(g=a.substring(0,b),a=a.substring(b+1,a.length));return[g,a]}function h(a,g,b,e){var n,u,d=null,h=g?g.name:
null,l=a,m=!0,k="";a||(m=!1,a="_@r"+(L+=1));a=f(a);d=a[0];a=a[1];d&&(d=c(d,h,e),u=i(p,d));a&&(d?k=u&&u.normalize?u.normalize(a,function(a){return c(a,h,e)}):c(a,h,e):(k=c(a,h,e),a=f(k),d=a[0],k=a[1],b=!0,n=j.nameToUrl(k)));b=d&&!u&&!b?"_unnormalized"+(M+=1):"";return{prefix:d,name:k,parentMap:g,unnormalized:!!b,url:n,originalName:l,isDefine:m,id:(d?d+"!"+k:k)+b}}function q(a){var g=a.id,b=i(k,g);b||(b=k[g]=new j.Module(a));return b}function s(a,g,b){var e=a.id,n=i(k,e);if(r(p,e)&&(!n||n.defineEmitComplete))"defined"===
g&&b(p[e]);else q(a).on(g,b)}function C(a,g){var b=a.requireModules,e=!1;if(g)g(a);else if(x(b,function(g){if(g=i(k,g))g.error=a,g.events.error&&(e=!0,g.emit("error",a))}),!e)l.onError(a)}function w(){R.length&&(fa.apply(F,[F.length-1,0].concat(R)),R=[])}function A(a,g,b){var e=a.map.id;a.error?a.emit("error",a.error):(g[e]=!0,x(a.depMaps,function(e,c){var d=e.id,h=i(k,d);h&&(!a.depMatched[c]&&!b[d])&&(i(g,d)?(a.defineDep(c,p[d]),a.check()):A(h,g,b))}),b[e]=!0)}function B(){var a,g,b,e,n=(b=1E3*m.waitSeconds)&&
j.startTime+b<(new Date).getTime(),c=[],h=[],f=!1,l=!0;if(!T){T=!0;E(k,function(b){a=b.map;g=a.id;if(b.enabled&&(a.isDefine||h.push(b),!b.error))if(!b.inited&&n)y(g)?f=e=!0:(c.push(g),d(g));else if(!b.inited&&(b.fetched&&a.isDefine)&&(f=!0,!a.prefix))return l=!1});if(n&&c.length)return b=J("timeout","Load timeout for modules: "+c,null,c),b.contextName=j.contextName,C(b);l&&x(h,function(a){A(a,{},{})});if((!n||e)&&f)if((z||$)&&!U)U=setTimeout(function(){U=0;B()},50);T=!1}}function D(a){r(p,a[0])||
q(h(a[0],null,!0)).init(a[1],a[2])}function G(a){var a=a.currentTarget||a.srcElement,b=j.onScriptLoad;a.detachEvent&&!V?a.detachEvent("onreadystatechange",b):a.removeEventListener("load",b,!1);b=j.onScriptError;(!a.detachEvent||V)&&a.removeEventListener("error",b,!1);return{node:a,id:a&&a.getAttribute("data-requiremodule")}}function K(){var a;for(w();F.length;){a=F.shift();if(null===a[0])return C(J("mismatch","Mismatched anonymous define() module: "+a[a.length-1]));D(a)}}var T,W,j,N,U,m={waitSeconds:7,
baseUrl:"./",paths:{},pkgs:{},shim:{},map:{},config:{}},k={},X={},F=[],p={},S={},L=1,M=1;N={require:function(a){return a.require?a.require:a.require=j.makeRequire(a.map)},exports:function(a){a.usingExports=!0;if(a.map.isDefine)return a.exports?a.exports:a.exports=p[a.map.id]={}},module:function(a){return a.module?a.module:a.module={id:a.map.id,uri:a.map.url,config:function(){return m.config&&i(m.config,a.map.id)||{}},exports:p[a.map.id]}}};W=function(a){this.events=i(X,a.id)||{};this.map=a;this.shim=
i(m.shim,a.id);this.depExports=[];this.depMaps=[];this.depMatched=[];this.pluginMaps={};this.depCount=0};W.prototype={init:function(a,b,c,e){e=e||{};if(!this.inited){this.factory=b;if(c)this.on("error",c);else this.events.error&&(c=t(this,function(a){this.emit("error",a)}));this.depMaps=a&&a.slice(0);this.errback=c;this.inited=!0;this.ignore=e.ignore;e.enabled||this.enabled?this.enable():this.check()}},defineDep:function(a,b){this.depMatched[a]||(this.depMatched[a]=!0,this.depCount-=1,this.depExports[a]=
b)},fetch:function(){if(!this.fetched){this.fetched=!0;j.startTime=(new Date).getTime();var a=this.map;if(this.shim)j.makeRequire(this.map,{enableBuildCallback:!0})(this.shim.deps||[],t(this,function(){return a.prefix?this.callPlugin():this.load()}));else return a.prefix?this.callPlugin():this.load()}},load:function(){var a=this.map.url;S[a]||(S[a]=!0,j.load(this.map.id,a))},check:function(){if(this.enabled&&!this.enabling){var a,b,c=this.map.id;b=this.depExports;var e=this.exports,n=this.factory;
if(this.inited)if(this.error)this.emit("error",this.error);else{if(!this.defining){this.defining=!0;if(1>this.depCount&&!this.defined){if(H(n)){if(this.events.error)try{e=j.execCb(c,n,b,e)}catch(d){a=d}else e=j.execCb(c,n,b,e);this.map.isDefine&&((b=this.module)&&void 0!==b.exports&&b.exports!==this.exports?e=b.exports:void 0===e&&this.usingExports&&(e=this.exports));if(a)return a.requireMap=this.map,a.requireModules=[this.map.id],a.requireType="define",C(this.error=a)}else e=n;this.exports=e;if(this.map.isDefine&&
!this.ignore&&(p[c]=e,l.onResourceLoad))l.onResourceLoad(j,this.map,this.depMaps);delete k[c];this.defined=!0}this.defining=!1;this.defined&&!this.defineEmitted&&(this.defineEmitted=!0,this.emit("defined",this.exports),this.defineEmitComplete=!0)}}else this.fetch()}},callPlugin:function(){var a=this.map,b=a.id,d=h(a.prefix);this.depMaps.push(d);s(d,"defined",t(this,function(e){var n,d;d=this.map.name;var v=this.map.parentMap?this.map.parentMap.name:null,f=j.makeRequire(a.parentMap,{enableBuildCallback:!0,
skipMap:!0});if(this.map.unnormalized){if(e.normalize&&(d=e.normalize(d,function(a){return c(a,v,!0)})||""),e=h(a.prefix+"!"+d,this.map.parentMap),s(e,"defined",t(this,function(a){this.init([],function(){return a},null,{enabled:!0,ignore:!0})})),d=i(k,e.id)){this.depMaps.push(e);if(this.events.error)d.on("error",t(this,function(a){this.emit("error",a)}));d.enable()}}else n=t(this,function(a){this.init([],function(){return a},null,{enabled:!0})}),n.error=t(this,function(a){this.inited=!0;this.error=
a;a.requireModules=[b];E(k,function(a){0===a.map.id.indexOf(b+"_unnormalized")&&delete k[a.map.id]});C(a)}),n.fromText=t(this,function(e,c){var d=a.name,u=h(d),v=O;c&&(e=c);v&&(O=!1);q(u);r(m.config,b)&&(m.config[d]=m.config[b]);try{l.exec(e)}catch(k){throw Error("fromText eval for "+d+" failed: "+k);}v&&(O=!0);this.depMaps.push(u);j.completeLoad(d);f([d],n)}),e.load(a.name,f,n,m)}));j.enable(d,this);this.pluginMaps[d.id]=d},enable:function(){this.enabling=this.enabled=!0;x(this.depMaps,t(this,function(a,
b){var c,e;if("string"===typeof a){a=h(a,this.map.isDefine?this.map:this.map.parentMap,!1,!this.skipMap);this.depMaps[b]=a;if(c=i(N,a.id)){this.depExports[b]=c(this);return}this.depCount+=1;s(a,"defined",t(this,function(a){this.defineDep(b,a);this.check()}));this.errback&&s(a,"error",this.errback)}c=a.id;e=k[c];!r(N,c)&&(e&&!e.enabled)&&j.enable(a,this)}));E(this.pluginMaps,t(this,function(a){var b=i(k,a.id);b&&!b.enabled&&j.enable(a,this)}));this.enabling=!1;this.check()},on:function(a,b){var c=
this.events[a];c||(c=this.events[a]=[]);c.push(b)},emit:function(a,b){x(this.events[a],function(a){a(b)});"error"===a&&delete this.events[a]}};j={config:m,contextName:b,registry:k,defined:p,urlFetched:S,defQueue:F,Module:W,makeModuleMap:h,nextTick:l.nextTick,configure:function(a){a.baseUrl&&"/"!==a.baseUrl.charAt(a.baseUrl.length-1)&&(a.baseUrl+="/");var b=m.pkgs,c=m.shim,e={paths:!0,config:!0,map:!0};E(a,function(a,b){e[b]?"map"===b?Q(m[b],a,!0,!0):Q(m[b],a,!0):m[b]=a});a.shim&&(E(a.shim,function(a,
b){I(a)&&(a={deps:a});if((a.exports||a.init)&&!a.exportsFn)a.exportsFn=j.makeShimExports(a);c[b]=a}),m.shim=c);a.packages&&(x(a.packages,function(a){a="string"===typeof a?{name:a}:a;b[a.name]={name:a.name,location:a.location||a.name,main:(a.main||"main").replace(ga,"").replace(aa,"")}}),m.pkgs=b);E(k,function(a,b){!a.inited&&!a.map.unnormalized&&(a.map=h(b))});if(a.deps||a.callback)j.require(a.deps||[],a.callback)},makeShimExports:function(a){return function(){var b;a.init&&(b=a.init.apply(Y,arguments));
return b||a.exports&&Z(a.exports)}},makeRequire:function(a,d){function f(e,c,u){var i,m;d.enableBuildCallback&&(c&&H(c))&&(c.__requireJsBuild=!0);if("string"===typeof e){if(H(c))return C(J("requireargs","Invalid require call"),u);if(a&&r(N,e))return N[e](k[a.id]);if(l.get)return l.get(j,e,a);i=h(e,a,!1,!0);i=i.id;return!r(p,i)?C(J("notloaded",'Module name "'+i+'" has not been loaded yet for context: '+b+(a?"":". Use require([])"))):p[i]}K();j.nextTick(function(){K();m=q(h(null,a));m.skipMap=d.skipMap;
m.init(e,c,u,{enabled:!0});B()});return f}d=d||{};Q(f,{isBrowser:z,toUrl:function(b){var d=b.lastIndexOf("."),g=null;-1!==d&&(g=b.substring(d,b.length),b=b.substring(0,d));return j.nameToUrl(c(b,a&&a.id,!0),g)},defined:function(b){return r(p,h(b,a,!1,!0).id)},specified:function(b){b=h(b,a,!1,!0).id;return r(p,b)||r(k,b)}});a||(f.undef=function(b){w();var c=h(b,a,!0),d=i(k,b);delete p[b];delete S[c.url];delete X[b];d&&(d.events.defined&&(X[b]=d.events),delete k[b])});return f},enable:function(a){i(k,
a.id)&&q(a).enable()},completeLoad:function(a){var b,c,d=i(m.shim,a)||{},h=d.exports;for(w();F.length;){c=F.shift();if(null===c[0]){c[0]=a;if(b)break;b=!0}else c[0]===a&&(b=!0);D(c)}c=i(k,a);if(!b&&!r(p,a)&&c&&!c.inited){if(m.enforceDefine&&(!h||!Z(h)))return y(a)?void 0:C(J("nodefine","No define call for "+a,null,[a]));D([a,d.deps||[],d.exportsFn])}B()},nameToUrl:function(a,b){var c,d,h,f,j,k;if(l.jsExtRegExp.test(a))f=a+(b||"");else{c=m.paths;d=m.pkgs;f=a.split("/");for(j=f.length;0<j;j-=1)if(k=
f.slice(0,j).join("/"),h=i(d,k),k=i(c,k)){I(k)&&(k=k[0]);f.splice(0,j,k);break}else if(h){c=a===h.name?h.location+"/"+h.main:h.location;f.splice(0,j,c);break}f=f.join("/");f+=b||(/\?/.test(f)?"":".js");f=("/"===f.charAt(0)||f.match(/^[\w\+\.\-]+:/)?"":m.baseUrl)+f}return m.urlArgs?f+((-1===f.indexOf("?")?"?":"&")+m.urlArgs):f},load:function(a,b){l.load(j,a,b)},execCb:function(a,b,c,d){return b.apply(d,c)},onScriptLoad:function(a){if("load"===a.type||ha.test((a.currentTarget||a.srcElement).readyState))P=
null,a=G(a),j.completeLoad(a.id)},onScriptError:function(a){var b=G(a);if(!y(b.id))return C(J("scripterror","Script error",a,[b.id]))}};j.require=j.makeRequire();return j}var l,w,A,D,s,G,P,K,ba,ca,ia=/(\/\*([\s\S]*?)\*\/|([^:]|^)\/\/(.*)$)/mg,ja=/[^.]\s*require\s*\(\s*["']([^'"\s]+)["']\s*\)/g,aa=/\.js$/,ga=/^\.\//;w=Object.prototype;var L=w.toString,da=w.hasOwnProperty,fa=Array.prototype.splice,z=!!("undefined"!==typeof window&&navigator&&document),$=!z&&"undefined"!==typeof importScripts,ha=z&&
"PLAYSTATION 3"===navigator.platform?/^complete$/:/^(complete|loaded)$/,V="undefined"!==typeof opera&&"[object Opera]"===opera.toString(),B={},q={},R=[],O=!1;if("undefined"===typeof define){if("undefined"!==typeof requirejs){if(H(requirejs))return;q=requirejs;requirejs=void 0}"undefined"!==typeof require&&!H(require)&&(q=require,require=void 0);l=requirejs=function(b,c,d,y){var f,h="_";!I(b)&&"string"!==typeof b&&(f=b,I(c)?(b=c,c=d,d=y):b=[]);f&&f.context&&(h=f.context);(y=i(B,h))||(y=B[h]=l.s.newContext(h));
f&&y.configure(f);return y.require(b,c,d)};l.config=function(b){return l(b)};l.nextTick="undefined"!==typeof setTimeout?function(b){setTimeout(b,4)}:function(b){b()};require||(require=l);l.version="2.1.2";l.jsExtRegExp=/^\/|:|\?|\.js$/;l.isBrowser=z;w=l.s={contexts:B,newContext:ea};l({});x(["toUrl","undef","defined","specified"],function(b){l[b]=function(){var c=B._;return c.require[b].apply(c,arguments)}});if(z&&(A=w.head=document.getElementsByTagName("head")[0],D=document.getElementsByTagName("base")[0]))A=
w.head=D.parentNode;l.onError=function(b){throw b;};l.load=function(b,c,d){var i=b&&b.config||{},f;if(z)return f=i.xhtml?document.createElementNS("http://www.w3.org/1999/xhtml","html:script"):document.createElement("script"),f.type=i.scriptType||"text/javascript",f.charset="utf-8",f.async=!0,f.setAttribute("data-requirecontext",b.contextName),f.setAttribute("data-requiremodule",c),f.attachEvent&&!(f.attachEvent.toString&&0>f.attachEvent.toString().indexOf("[native code"))&&!V?(O=!0,f.attachEvent("onreadystatechange",
b.onScriptLoad)):(f.addEventListener("load",b.onScriptLoad,!1),f.addEventListener("error",b.onScriptError,!1)),f.src=d,K=f,D?A.insertBefore(f,D):A.appendChild(f),K=null,f;$&&(importScripts(d),b.completeLoad(c))};z&&M(document.getElementsByTagName("script"),function(b){A||(A=b.parentNode);if(s=b.getAttribute("data-main"))return q.baseUrl||(G=s.split("/"),ba=G.pop(),ca=G.length?G.join("/")+"/":"./",q.baseUrl=ca,s=ba),s=s.replace(aa,""),q.deps=q.deps?q.deps.concat(s):[s],!0});define=function(b,c,d){var i,
f;"string"!==typeof b&&(d=c,c=b,b=null);I(c)||(d=c,c=[]);!c.length&&H(d)&&d.length&&(d.toString().replace(ia,"").replace(ja,function(b,d){c.push(d)}),c=(1===d.length?["require"]:["require","exports","module"]).concat(c));if(O){if(!(i=K))P&&"interactive"===P.readyState||M(document.getElementsByTagName("script"),function(b){if("interactive"===b.readyState)return P=b}),i=P;i&&(b||(b=i.getAttribute("data-requiremodule")),f=B[i.getAttribute("data-requirecontext")])}(f?f.defQueue:R).push([b,c,d])};define.amd=
{jQuery:!0};l.exec=function(b){return eval(b)};l(q)}})(this);

51
web/bower_components/vis/examples/timeline/other/rtl.html vendored Normal file
View File

@@ -0,0 +1,51 @@
<!DOCTYPE HTML>
<html>
<head>
<title>Timeline | RTL example</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<script src="../../../dist/vis.js"></script>
<link href="../../../dist/vis-timeline-graph2d.min.css" rel="stylesheet" type="text/css" />
</head>
<body>
<h1>Timeline RTL support</h1>
<h2>Using <code>dir = "rtl"</code> in any parent node</h2>
<div id="timeline1" dir="rtl"></div>
<h2>Using <code>options.rtl = true</code></h2>
<div id="timeline2"></div>
<script>
var items = new vis.DataSet();
// add items to the DataSet
items.add([
{id: 1, content: '2014-01-23 <br>start', start: '2014-01-23'},
{id: 2, content: '2014-01-18', start: '2014-01-18'},
{id: 3, content: '2014-01-21', start: '2014-01-21'},
{id: 4, content: '2014-01-19 - 2014-01-24', start: '2014-01-19', end: '2014-01-24'},
{id: 5, content: '2014-01-28', start: '2014-01-28', type:'point'},
{id: 6, content: '2014-01-26', start: '2014-01-26'}
]);
var container1 = document.getElementById('timeline1');
var container2 = document.getElementById('timeline2');
var options = {
start: '2014-01-10',
end: '2014-02-10',
height: '300px',
};
var options1 = jQuery.extend(options, {})
var timeline1 = new vis.Timeline(container1, items, options1);
var options2 = jQuery.extend(options, {rtl: true})
var timeline2 = new vis.Timeline(container2, items, options2);
</script>
</body>
</html>

66
web/bower_components/vis/examples/timeline/other/stressPerformance.html vendored Normal file
View File

@@ -0,0 +1,66 @@
<!DOCTYPE HTML>
<!--
This example is used mainly for developers to test performance issues by controlling number of groups,
number of items and their types.
-->
<html>
<head>
<title>Timeline | Stress Performance example</title>
<script src="http://cdnjs.cloudflare.com/ajax/libs/moment.js/2.8.4/moment.min.js"></script>
<script src="../../../dist/vis.js"></script>
<link href="../../../dist/vis-timeline-graph2d.min.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="visualization"></div>
</body>
<script>
var now = moment();
var groupCount = 20;
var itemCount = 400;
// create a data set with groups
var groups = new vis.DataSet();
for (var g = 0; g < groupCount; g++) {
groups.add({
id: g,
content: "group " + g
});
}
var types = ['point', 'range', 'box', 'background']
// create a dataset with items
var items = new vis.DataSet();
for (var i = 0; i < itemCount; i++) {
var start = now.clone().add(Math.random() * 180, 'days');
var end = start.clone().add(Math.random() * 30, 'days');
var group = Math.floor(Math.random() * groupCount);
items.add({
id: i,
type: types[Math.floor(Math.random() * types.length)],
group: group,
content: '' + i,
start: start,
end: end
});
}
// create visualization
var container = document.getElementById('visualization');
var options = {
width: '100%',
showCurrentTime: false,
stack: true,
selectable: true,
editable: true,
};
var timeline = new vis.Timeline(container);
timeline.setOptions(options);
timeline.setGroups(groups);
timeline.setItems(items);
</script>
</html>

80
web/bower_components/vis/examples/timeline/other/timezone.html vendored Normal file
View File

@@ -0,0 +1,80 @@
<!DOCTYPE HTML>
<html>
<head>
<title>Timeline | Time zone</title>
<style type="text/css">
body, html {
font-family: sans-serif;
max-width: 800px;
}
</style>
<script src="../../../dist/vis.js"></script>
<link href="../../../dist/vis-timeline-graph2d.min.css" rel="stylesheet" type="text/css" />
</head>
<body>
<h1>Time zone</h1>
<p>
The following demo shows how to display items in local time (default), in UTC, or for a specific time zone offset. By configuring your own <code>moment</code> constructor, you can display items in the time zone that you want. All timelines have the same start and end date.
</p>
<h2>Local time</h2>
<div id="local"></div>
<h2>UTC</h2>
<div id="utc"></div>
<h2>UTC +08:00</h2>
<div id="plus8"></div>
<script type="text/javascript">
// Create a DataSet (allows two way data-binding)
var today = vis.moment(vis.moment.utc().format('YYYY-MM-DDT00:00:00.000Z'));
var start = today.clone();
var end = today.clone().add(2, 'day');
var customTime = today.clone().add(28, 'hour');
var items = new vis.DataSet([
{id: 1, content: 'item 1', start: today.clone().add(8, 'hour')},
{id: 2, content: 'item 2', start: today.clone().add(16, 'hour')},
{id: 3, content: 'item 3', start: today.clone().add(32, 'hour')}
]);
// Create a timeline displaying in local time (default)
var timelineLocal = new vis.Timeline(document.getElementById('local'), items, {
editable: true,
start: start,
end: end
});
timelineLocal.addCustomTime(customTime);
// Create a timeline displaying in UTC
var timelineUTC = new vis.Timeline(document.getElementById('utc'), items, {
editable: true,
start: start,
end: end,
moment: function (date) {
return vis.moment(date).utc();
}
});
timelineUTC.addCustomTime(customTime);
// Create a timeline displaying in UTC +08:00
var timelinePlus8 = new vis.Timeline(document.getElementById('plus8'), items, {
editable: true,
start: start,
end: end,
moment: function (date) {
return vis.moment(date).utcOffset('+08:00');
}
});
timelinePlus8.addCustomTime(customTime);
</script>
</body>
</html>

125
web/bower_components/vis/examples/timeline/other/usingReact.html vendored Normal file
View File

@@ -0,0 +1,125 @@
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>React Components in templates</title>
</head>
<body>
<div id='root'></div>
<!--
For ease of use, we are including the React, ReactDOM and Babel CDN
builds to make getting started as fast as possible.
In production, you'll want to instead look at using something
like Gulp, Grunt or WebPack (my personal recommendation)
to compile JSX into JavaScript. Also, check out:
http://facebook.github.io/react/docs/tooling-integration.html
-->
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.3.2/react.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.3.2/react-dom.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.23/browser.min.js"></script>
<script src="../../../dist/vis.js"></script>
<link href="../../../dist/vis.css" rel="stylesheet" type="text/css" />
<!--
This is where you link to your React code. Can be .js or .jsx
extension, doesn't really matter.
-->
<script type="text/babel">
var timeline;
// create groups
var numberOfGroups = 25;
var groups = new vis.DataSet()
for (var i = 0; i < numberOfGroups; i++) {
groups.add({
id: i,
content: 'Truck ' + i
})
}
// create items
var numberOfItems = 1000;
var items = new vis.DataSet();
var itemsPerGroup = Math.round(numberOfItems/numberOfGroups);
for (var truck = 0; truck < numberOfGroups; truck++) {
var date = new Date();
for (var order = 0; order < itemsPerGroup; order++) {
date.setHours(date.getHours() + 4 * (Math.random() < 0.2));
var start = new Date(date);
date.setHours(date.getHours() + 2 + Math.floor(Math.random()*4));
var end = new Date(date);
items.add({
id: order + itemsPerGroup * truck,
group: truck,
start: start,
end: end,
content: 'Order ' + order
});
}
}
var GroupTemplate = React.createClass({
render: function() {
var { group } = this.props;
return <div>
<label>{group.content}</label>
</div>
}
})
var ItemTemplate = React.createClass({
render: function() {
var { item } = this.props;
return <div>
<label>{item.content}</label>
</div>
}
})
// specify options
var options = {
orientation: 'top',
maxHeight: 400,
start: new Date(),
end: new Date(1000*60*60*24 + (new Date()).valueOf()),
editable: true,
template: function (item, element) {
if (!item) { return }
ReactDOM.unmountComponentAtNode(element);
return ReactDOM.render(<ItemTemplate item={item} />, element);
},
groupTemplate: function (group, element) {
if (!group) { return }
ReactDOM.unmountComponentAtNode(element);
return ReactDOM.render(<GroupTemplate group={group} />, element);
}
}
var VisTimeline = React.createClass({
componentDidMount: function() {
return initTimeline();
},
render: function() {
return <div>
<h1>Vis timline with React</h1>
<h2>Using react components for items and group templates</h2>
<div id="mytimeline"></div>
</div>
}
});
function initTimeline() {
var container = document.getElementById('mytimeline');
timeline = new vis.Timeline(container, items, groups, options);
}
ReactDOM.render(<VisTimeline />, document.getElementById('root'));
</script>
</body>
</html>

90
web/bower_components/vis/examples/timeline/other/verticalScroll.html vendored Normal file
View File

@@ -0,0 +1,90 @@
<html>
<head>
<title>Timeline | Vertical Scroll Option</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<script src="../../../dist/vis.js"></script>
<link href="../../../dist/vis.css" rel="stylesheet" type="text/css" />
</head>
<body>
<h1>Timeline vertical scroll option</h1>
<h2>With <code>
verticalScroll: true,
zoomKey: 'ctrlKey'</code>
</h2>
<div id="mytimeline1"></div>
<h2>With <code>
horizontalScroll: true,
verticalScroll: true,
zoomKey: 'ctrlKey'</code>
</h2>
<div id="mytimeline2"></div>
<script>
// create groups
var numberOfGroups = 25;
var groups = new vis.DataSet()
for (var i = 0; i < numberOfGroups; i++) {
groups.add({
id: i,
content: 'Truck&nbsp;' + i
})
}
// create items
var numberOfItems = 1000;
var items = new vis.DataSet();
var itemsPerGroup = Math.round(numberOfItems/numberOfGroups);
for (var truck = 0; truck < numberOfGroups; truck++) {
var date = new Date();
for (var order = 0; order < itemsPerGroup; order++) {
date.setHours(date.getHours() + 4 * (Math.random() < 0.2));
var start = new Date(date);
date.setHours(date.getHours() + 2 + Math.floor(Math.random()*4));
var end = new Date(date);
var orderIndex = order + itemsPerGroup * truck
items.add({
id: orderIndex,
group: truck,
start: start,
end: end,
content: 'Order ' + orderIndex
});
}
}
// specify options
var options = {
stack: true,
verticalScroll: true,
zoomKey: 'ctrlKey',
maxHeight: 200,
start: new Date(),
end: new Date(1000*60*60*24 + (new Date()).valueOf()),
};
// create a Timeline
options1 = jQuery.extend(options, {});
var container1 = document.getElementById('mytimeline1');
timeline1 = new vis.Timeline(container1, items, groups, options1);
options2 = jQuery.extend(options, {horizontalScroll: true});
var container2 = document.getElementById('mytimeline2');
timeline2 = new vis.Timeline(container2, items, groups, options2);
</script>
</body>
</html>