');
var videoObj;
var myPlayer;
$(window).on('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);
});
//20260701 パラメータutm_medium=mediaの時に追加
$(function() {
// --- 設定領域 ---
const TARGET_PARAM = 'utm_medium=media';
// 【PC用】header(#videoPlayerの直前)
const HEADER_SOURCE_PC = '';
// 【SP用】header(#videoPlayerの直前)
const HEADER_SOURCE_SP = '';
// footer(#videoPlayerの直後)
const FOOTER_SOURCE = '';
// ----------------
// URL全体(パラメータやハッシュ含む)にutm_medium=mediaが含まれているかチェック
if (window.location.href.indexOf(TARGET_PARAM) !== -1) {
$('body').addClass('media');
$('body').css('overflow','visible');
// パラメータがある時だけ、固定高さを解除するCSSを動的に注入
$('head').append('');
// #videoPlayer が存在する場合のみ実行
if ($('#videoPlayer').length) {
const isWidthSP = window.matchMedia('(max-width: 767px)').matches || window.innerWidth <= 767;
const isUserAgentSP = /iPhone|iPad|iPod|Android/i.test(navigator.userAgent);
const isSP = isWidthSP || isUserAgentSP;
// 判定結果に基づいてソースを選択
const selectedHeader = isSP ? HEADER_SOURCE_SP : HEADER_SOURCE_PC;
// #videoPlayerの直前に挿入
$('#videoPlayer').before(selectedHeader);
// #videoPlayerの直後にfooterを挿入
$('#videoPlayer').after(FOOTER_SOURCE);
}
}
});
//-->