r/hugvey
1
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

add follow checkbox to timeline

Browse source
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
Show stats Download patch file Download diff file Expand all files Collapse all files

17
www/js/hugvey_timeline.js
View file

@ -38,6 +38,10 @@ class Timeline{
startDate.setMinutes(startDate.getMinutes()-1); startDate.setMinutes(startDate.getMinutes()-1);
let endDate = new Date(); let endDate = new Date();
endDate.setMinutes(endDate.getMinutes()+20); endDate.setMinutes(endDate.getMinutes()+20);
//follow the timeline or not if checkbox is checked
setTimeout(function(){ setTimeout(function(){
tl.setWindow(startDate, endDate); tl.setWindow(startDate, endDate);
}, 500); }, 500);
@ -47,6 +51,19 @@ class Timeline{
tl.moveTo(new Date()); tl.moveTo(new Date());
}, 1000); }, 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); ws.addEventListener( 'message', this);
} }

1
www/timeline.html
View file

@ -71,6 +71,7 @@ font-size: 4.5pt;
</style> </style>
</head> </head>
<body id='timeline'> <body id='timeline'>
<input id="follow_checkbox" type="checkbox" name="follow" value="follow" checked> Follow timeline<br>
<div id='line'></div> <div id='line'></div>
<script type='application/javascript' src="/js/hugvey_timeline.js"></script> <script type='application/javascript' src="/js/hugvey_timeline.js"></script>