For the past few days I had no problem with Vimeo's cuepoint event, everything is working fine, I just started to notice it today.
This is a simple cuepoint trigger.
When the video's current time reaches the cuepoint it does something, on the example code below we will just output something using alert.
Using firebug on google chrome Console, it says that cuePoint was successfully added, but when video reaches the cuepoint, it throws an error.
console screenshot: https://user-images.githubusercontent.com/42766598/45663523-898c3f80-bb39-11e8-8d87-4a4be84a3483.png
cue point added successfully, id: 10333313-0233-4312-8013-111233103010
Uncaught TypeError: Time must be a number.
test page URL: http://rjlwebph.com/vimeo-cuepoint/test.html
Here is my code below:
<html>
<head>
<script src="https://player.vimeo.com/api/player.js"></script>
</head>
<body>
<iframe src="https://player.vimeo.com/video/67449472?autoplay=1&title=0&byline=0&portrait=0" width="853" height="480" frameborder="0" webkitallowfullscreen="" mozallowfullscreen="" allowfullscreen=""></iframe>
<script>
var iframe = document.querySelector('iframe');
var player = new Vimeo.Player(iframe);
var cueTime = 60;
player.addCuePoint( cueTime, {
customKey: 'customkey'
}).then(function(id) {
console.log('cue point added successfully, id: '+id);
}).catch(function(error) {
switch (error.name) {
case 'UnsupportedError':
console.log('cue points are not supported with the current player or browser: '+cueTime);
// cue points are not supported with the current player or browser
break;
case 'RangeError':
console.log('the time was less than 0 or greater than the video’s duration: '+cueTime);
// the time was less than 0 or greater than the video’s duration
break;
default:
console.log('some other error occurred: '+cueTime);
// some other error occurred
break;
}
});
player.on('cuepoint', function() {
alert('cuePoint reached... '+cueTime);
});
</script>
</body>
</html>