The following is an example of how to use Cincopa's player API, this API will work on all players and templates, more info support@cincopa.com
<script src='https://rtcdn.cincopa.com/libasync.js' type='text/javascript'></script>
<div class="button-block">
<button onclick="playVideo()">Play</button>
<button onclick="pauseVideo()">Pause</button>
<button onclick="jumpToSec('forward')">Jump +10sec</button>
<button onclick="jumpToSec('backward')">Jump -10sec</button>
<button onclick="jumpToSpecificSec()">Jump to 00:42</button>
<button onclick="toggleMute('mute')">Mute</button>
<button onclick="toggleMute('unmute')">Unmute</button>
<button onclick="subtitleToggle('on')">Subtitle On</button>
<button onclick="subtitleToggle('off')">Subtitle Off</button>
<button onclick="selectSubtitle('en')">Subtitle to English</button>
<button onclick="selectSubtitle('es')">Subtitle to Spanish</button>
<button onclick="enterFullScreen()">Fullscreen in</button>
<button onclick="exitFullScreen()">Fullscreen out</button>
<button onclick="goToChapter(1)">Go To Chapter 1</button>
<button onclick="goToChapter(3)">Go To Chapter 3</button>
<button onclick="goTo(2)">Go To 2 Video </button>
<button onclick="prev()">Prev Video</button>
<button onclick="next()">next Video</button>
<button onclick="playbackSpeed(2)">Speed x2</button>
<button onclick="playbackSpeed(0.5)">Speed x0.5</button>
<button onclick="playbackSpeed(1)">Speed x1(normal)</button>
</div>
<div id="playerID">...</div>
<script type="text/javascript">
cincopa.set_debug(true);
var cpo = []; cpo["_object"] ="playerID"; cpo["_fid"] = "AIEAPxOcrJt4"; // A4LA1pulIDe1
var _cpmp = _cpmp || []; _cpmp.push(cpo);
(function() { var cp = document.createElement("script"); cp.type = "text/javascript";
cp.async = true; cp.src = "https://rtcdn.cincopa.com/libasync.js";
var c = document.getElementsByTagName("script")[0];
c.parentNode.insertBefore(cp, c); })(); </script>
<script>
cincopa.registeredFunctions.push({
func: function (name, data, gallery) {
gallery.args["iframe"] = "true";
}, filter: "runtime.on-args"
});
function playerAPI(){
var galleryWrapID = 'playerID';
if (cincopa && cincopa.getGalleryById(galleryWrapID) && cincopa.getGalleryById(galleryWrapID).playerAPI) {
console.log(cincopa.getGalleryById(galleryWrapID).getSkin().go == cincopa.getGalleryById(galleryWrapID));
console.log(cincopa.getGalleryById(galleryWrapID));
console.log(zeGalleryArray);
return cincopa.getGalleryById(galleryWrapID).playerAPI;
} else{
return false;
}
}
function playVideo() {
playerAPI() && playerAPI().play();
}
function pauseVideo() {
playerAPI() && playerAPI().pause();
}
function goTo(index) {
playerAPI() && playerAPI().goTo(index);
}
function prev() {
playerAPI() && playerAPI().playPrev();
}
function next() {
playerAPI() && playerAPI().playNext();
}
function jumpToSec(jumpDirection) {
if (playerAPI()) {
var currentTime = playerAPI().currentTime();
if (jumpDirection === "forward") {
playerAPI().setCurrentTime(currentTime + 10);
} else {
playerAPI().setCurrentTime(currentTime - 10);
}
}
}
function enterFullScreen() {
playerAPI() && playerAPI().enterFullScreen();
}
function exitFullScreen() {
playerAPI() && playerAPI().exitFullScreen();
}
function jumpToSpecificSec() {
if (playerAPI()) {
playerAPI().setCurrentTime(42); // 42 seconds from start
}
}
function toggleMute(command) {
playerAPI() && playerAPI().toggleMute(command);
}
function subtitleToggle(command) {
playerAPI() && playerAPI().subtitleToggle(command);
}
function selectSubtitle(language) {
playerAPI() && playerAPI().selectSubtitle(language);
}
function goToChapter(index){
playerAPI() && playerAPI().goToChapter(index);
}
function playbackSpeed(speed) {
playerAPI() && playerAPI().playbackSpeed(speed);
}
</script>
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.