<html>
							 | 
						|
								<head>
							 | 
						|
								  <title>Timeline | Bridge</title>
							 | 
						|
								
							 | 
						|
								  <script src="js/vis/vis.js"></script>
							 | 
						|
								
							 | 
						|
								  <script src="js/eve.js"></script>
							 | 
						|
								    <script src="js/timelineAgent.js"></script>
							 | 
						|
								  <link href="js/vis/vis.css" rel="stylesheet" type="text/css" />
							 | 
						|
								
							 | 
						|
								  <link href="./css/timelineStyle.css" rel="stylesheet" type="text/css" />
							 | 
						|
								
							 | 
						|
								</head>
							 | 
						|
								<body>
							 | 
						|
								<p>This page demonstrates the Timeline with custom css classes for individual items.</p>
							 | 
						|
								
							 | 
						|
								<div id="mytimeline"></div>
							 | 
						|
								
							 | 
						|
								<script type="text/javascript">
							 | 
						|
								  var connected = false;
							 | 
						|
								  // create data
							 | 
						|
								  // note that months are zero-based in the JavaScript Date object
							 | 
						|
								  var data = new vis.DataSet();
							 | 
						|
								
							 | 
						|
								  // called from agent
							 | 
						|
								  function addToDataset(item) {
							 | 
						|
								      data.add(item);
							 | 
						|
								  }
							 | 
						|
								  // called from agent
							 | 
						|
								  function clearDataset() {
							 | 
						|
								      data.clear();
							 | 
						|
								  }
							 | 
						|
								
							 | 
						|
								  function sessionClosed() {
							 | 
						|
								      if (connected === true) {
							 | 
						|
								          document.getElementById("overlayNC").style.display = 'block';
							 | 
						|
								      }
							 | 
						|
								  }
							 | 
						|
								
							 | 
						|
								  // specify options
							 | 
						|
								  var options = {
							 | 
						|
								    editable: true
							 | 
						|
								  };
							 | 
						|
								
							 | 
						|
								  // to run this, also have webHttp.js running in node.
							 | 
						|
								  eve.system.init({
							 | 
						|
								      transports: [
							 | 
						|
								          {
							 | 
						|
								              type: 'ws',
							 | 
						|
								              url: 'ws://agents/:id'
							 | 
						|
								          },
							 | 
						|
								          {
							 | 
						|
								              type: 'http'
							 | 
						|
								          }
							 | 
						|
								      ]
							 | 
						|
								  });
							 | 
						|
								
							 | 
						|
								  var proxyAddress = 'ws://afternoon-beyond-2302.herokuapp.com/agents/proxy';
							 | 
						|
								  var proxyAddressHTTP = 'https://afternoon-beyond-2302.herokuapp.com/agents/proxy';
							 | 
						|
								
							 | 
						|
								//  proxyAddress = 'ws://127.0.0.1:5000/agents/proxy';
							 | 
						|
								//  proxyAddressHTTP = 'http://127.0.0.1:5000/agents/proxy';
							 | 
						|
								
							 | 
						|
								  timelineProxy = new timelineAgent('timelineAgent', proxyAddress);
							 | 
						|
								
							 | 
						|
								  timelineProxy.wakeProxy(proxyAddressHTTP);
							 | 
						|
								
							 | 
						|
								  timelineProxy.connectToProxy();
							 | 
						|
								
							 | 
						|
								  timelineProxy.getTimelineEvents().then(function (reply) {
							 | 
						|
								      addToDataset(reply);
							 | 
						|
								  }).catch(function (err) {
							 | 
						|
								      console.error(err);
							 | 
						|
								  });
							 | 
						|
								
							 | 
						|
								
							 | 
						|
								  // create the timeline
							 | 
						|
								  var container = document.getElementById('mytimeline');
							 | 
						|
								  timeline = new vis.Timeline(container, data, options);
							 | 
						|
								
							 | 
						|
								</script>
							 | 
						|
								</body>
							 | 
						|
								</html>
							 |