add follow checkbox to timeline

This commit is contained in:
Your Name 2019-05-11 18:17:06 +02:00
parent 99f819ad02
commit 0b69b87e9b
2 changed files with 24 additions and 6 deletions

View File

@ -38,14 +38,31 @@ class Timeline{
startDate.setMinutes(startDate.getMinutes()-1);
let endDate = new Date();
endDate.setMinutes(endDate.getMinutes()+20);
setTimeout(function(){
tl.setWindow(startDate, endDate);
}, 500);
//follow the timeline or not if checkbox is checked
setTimeout(function(){
tl.setWindow(startDate, endDate);
}, 500);
this.moveInterval = setInterval(function(){
// skip movement if not visible
tl.moveTo(new Date());
}, 1000);
var checkbox = document.getElementById('follow_checkbox')
checkbox.addEventListener('change', (event) => {
if (event.target.checked) {
this.moveInterval = setInterval(function(){
// skip movement if not visible
tl.moveTo(new Date());
}, 1000);
} else {
clearInterval(this.moveInterval)
}
})
ws.addEventListener( 'message', this);

View File

@ -31,7 +31,7 @@
background-color: greenyellow;
border-color: green;
}
.vis-text,.vis-labelset .vis-label {
color: #999;
}
@ -71,8 +71,9 @@ font-size: 4.5pt;
</style>
</head>
<body id='timeline'>
<input id="follow_checkbox" type="checkbox" name="follow" value="follow" checked> Follow timeline<br>
<div id='line'></div>
<script type='application/javascript' src="/js/hugvey_timeline.js"></script>
</body>
</html>
</html>