');
var videoObj;
var myPlayer;
$(window).load(function(){
myPlayer = videojs('jntNewPlayer');
let lastClickTime = 0;
let clickArea = 0; // 0:none, 1:leftArea, 2:rightArea
const leftArea = 1;
const rightArea = 2;
myPlayer.catalog.getVideo(getVideoID(), function(error, video){
videoObj = video;
OBG_MOVIE_LIB.myPlayer = myPlayer;
OBG_MOVIE_LIB.movieCVSSet(videoObj);
});
if(getWidth()){
myPlayer.width(getWidth());
}
if(getHeight()){
myPlayer.height(getHeight());
}
myPlayer.width($(window).width());
myPlayer.height($(window).height());
if(getAuto() === '1'){
myPlayer.play(); //再生
} else {
// myPlayer.pause(); //再生停止
}
function changeSize(baseClass, changeClass) {
const baseElement = document.querySelector(baseClass);
const changeElement = document.querySelector(changeClass);
const baseSizeInfo = baseElement.getBoundingClientRect();
changeElement.style.width = baseSizeInfo.width + 'px';
changeElement.style.height = baseSizeInfo.height + 'px';
}
function manipulateTime() {
let newTime = 0;
const jumpAmount = 10;
const videoTime = myPlayer.currentTime();
// back
if (clickArea === leftArea) {
if (videoTime >= jumpAmount) {
newTime = videoTime - jumpAmount;
} else {
newTime = 0;
}
myPlayer.currentTime(newTime);
clickArea = 0;
}
// forward
if (clickArea === rightArea) {
const videoDuration = myPlayer.duration();
if (videoTime + jumpAmount <= videoDuration) {
newTime = videoTime + jumpAmount;
} else {
newTime = videoDuration;
}
myPlayer.currentTime(newTime);
clickArea = 0;
}
}
function controlMovie() {
const movieArea = $('.movieArea');
const playControl = $('.vjs-play-control');
const timeout = 3000;
const timeoutFirst = 1000;
const clickInterval = 300;
// ダブルクリック判定
const currentTime = new Date().getTime();
if (currentTime - lastClickTime < clickInterval) {
manipulateTime();
}
lastClickTime = currentTime;
if (playControl.hasClass('vjs-paused')) {
// 動画再生
myPlayer.play();
// 動画再生用のクラス設定
playControl.removeClass('vjs-paused');
playControl.addClass('vjs-playing');
// タイマー設定
var timerId = setTimeout(() => {
movieArea.removeClass('vjs-user-active not-hover');
movieArea.addClass('vjs-user-inactive');
}, timeout);
} else if (playControl.hasClass('vjs-playing')) {
// 動画停止
myPlayer.pause();
// 動画停止用のクラス設定
playControl.removeClass('vjs-playing');
playControl.addClass('vjs-paused');
} else {
// 動画再生(初回)
myPlayer.play();
var timerId = setTimeout(() => {
changeSize('.vjs-play-control', '.btnOverlay');
}, timeoutFirst);
// 動画再生用のクラス設定
playControl.addClass('vjs-playing');
}
}
function mouseEnter() {
const movieArea = $('.movieArea');
movieArea.removeClass('vjs-user-inactive not-hover');
movieArea.addClass('vjs-user-active');
}
function mouseLeave() {
const movieArea = $('.movieArea');
movieArea.addClass('not-hover');
}
// オーバーレイクリック時のイベント設定
$('.videoOverlay__left').on('click', function() {
clickArea = leftArea;
});
$('.videoOverlay__right').on('click', function() {
clickArea = rightArea;
});
$('.videoOverlay').on('click', controlMovie);
$('.btnOverlay').on('click', controlMovie);
// マウスカーソルのイベント設定
$('.videoOverlay').on('mouseenter', mouseEnter);
$('.videoOverlay').on('mouseleave', mouseLeave);
$('.btnOverlay').on('mouseenter', mouseEnter);
$('.btnOverlay').on('mouseleave', mouseLeave);
$('.vjs-control-bar').on('mouseenter', mouseEnter);
$('.vjs-control-bar').on('mouseleave', mouseLeave);
});
//-->