MarkDown
// ==UserScript==
// @name 🔘通用播放器5.1整合自动获取链接
// @namespace http://your.domain.com
// @version 5.1
// @description 嵌入到信息栏下方
// @author Your Name
// @match https://www.baidu.com/*
// @match https://javdb.com/*
// @icon https://www.baidu.com/favicon.ico
// @grant none
// ==/UserScript==
(function() {
'use strict';
// @match https://www.javbus.com/*
const scriptName = "🔘通用播放器5.1整合自动获取链接";
console.log('🟢Script ',scriptName, 'Started🟢');
let videoSrc;
let videoUrl;
var playerContainer;
//const playerContainer = setupVideoPlayer();
//console.log("初始化playerContainer成功");
if (window.location.href === "https://www.baidu.com/") {
console.log("当前页面地址是 https://www.baidu.com");
const sureResult = confirm("Are you sure?");
if (sureResult === false) {
console.log('已选择退出脚本: 🛑Script ',scriptName, 'Exiting🛑');
return
}
playerContainer = setupVideoPlayer();
playerContainer .style.width = '50%';
console.log("初始化playerContainer成功");
//document.body.insertBefore(playerContainer, document.body.firstChild);
const placeContainer = document.createElement('div');
placeContainer.classList.add('place-container');
placeContainer.style.height = "40px";
document.body.appendChild(playerContainer);
document.body.appendChild(placeContainer);
//alert("当前页面地址包含关键字 'driver-verify'\n\n已绕过检查，点击确定进行跳转");
//const refer = new URLSearchParams(location.search).get('referer') ?? location.origin
//location.href = refer
} else {
console.log("当前页面地址不是 https://www.baidu.com");
const inspectResult = inspectDiv(); // 假设这是一个函数来检查是否存在特定的 div
console.log("检查结果：", inspectResult);
// 检查 videoMetaPanel 是否存在，避免后续的错误
if (inspectResult === true) {
console.log('执行 true 分支：Paste按钮可自动获取链接');
videoSrc = getVideoSrc();
videoUrl = getVideoUrl();
console.log('检查videoSrc:',videoSrc)
console.log('检查videoUrl:',videoUrl)
playerContainer = setupVideoPlayer();
playerContainer.style.marginTop = '-1.4rem';
console.log("初始化playerContainer成功");
insertContainer(playerContainer);
} else if (inspectResult === false) {
console.log('执行 false 分支：无法自动获取链接，请手动复制');
playerContainer = setupVideoPlayer();
console.log("初始化playerContainer成功");
insertContainer(playerContainer);
} else if (inspectResult === undefined) {
console.log('执行 undefined 分支,不处于详情页,未插入playerContainer');
console.log('🛑Script ',scriptName, 'Exiting🛑');
return;
console.log('🛑Script ',scriptName, 'Exiting🛑');
} else {
console.log('其他情况');
}
}
//let videoSrcPaste = videoUrl;
//console.log("Pastedd videoURL:", videoSrcPaste);
function getVideoUrl() {
// 获取保存在本地存储中的视频链接
console.log("函数getVideoUrl执行。");
let videoURL = getVideoSrc();
//先判断视频源是否存在
if (videoURL !== null && videoURL !== "") {
// 先检查后缀是否为 "mhb.mp4"
if (videoURL.endsWith("mhb.mp4")) {
console.log("videoURL already ends with 'mhb.mp4'");
} else {
console.log("Original videoURL:", videoURL);
// 进行字符串替换
videoURL = videoURL.replace("4k.mp4", "mhb.mp4");
videoURL = videoURL.replace("hhb.mp4", "mhb.mp4");
videoURL = videoURL.replace("hhbs.mp4", "mhb.mp4");
videoURL = videoURL.replace("_sm_w.mp4", "mhb.mp4");
console.log("正在进行字符串替换");
/*
videoURL = videoURL.replace("4k.mp4", "dm.mp4");
videoURL = videoURL.replace("hhb.mp4", "dm.mp4");
videoURL = videoURL.replace("_sm_w.mp4", "dm.mp4");
*/
// 输出修改后的 videoURL
console.log("Modified videoURL:", videoURL);
return videoURL;
}
} else {
console.log("页面中没有找到 <video> 元素。");
return videoURL;
}//if (videoURL !== null && videoURL !== "") {结束
console.log("函数getVideoUrl结束。");
}
function getVideoSrc() {
console.log("函数getVideoSrc执行。");
// 查找id为preview-video的video元素
//var videoElement1 = document.getElementById('preview-video');
//var videoElement1 = document.querySelector("#preview-video")
// 获取 video 元素
const videoElement0 = document.querySelector('#preview-video');
// 获取 source 元素
const sourceElement0 = videoElement0.querySelector('source');
// 提取 src 属性
const videoSrc0 = sourceElement0.getAttribute('src');
console.log('Video src0:', videoSrc0);
//if (videoElement1) {
if (videoSrc0 !== null && videoSrc0 !== "") {
// 获取src属性的值
// 获取 video 元素的 outerHTML
/*
var videoHTML = videoElement1.outerHTML;
// 使用正则表达式提取 src 的值
var srcRegex = /src="(.*?)"/;
var match = srcRegex.exec(videoHTML);
if (match && match.length > 1) {
var videoSrc = match[1]; // 获取匹配到的 src 的值
console.log("Video source:", videoSrc);
} else {
console.log("无法从 HTML 中提取视频的 src 值。");
}
*/
// 如果 src 是相对路径，可以转换为绝对路径
const absoluteSrc = new URL(videoSrc0, window.location.origin).href;
console.log('Video src:', absoluteSrc);
return absoluteSrc;
} else {
console.log("页面中没有找到 <video> 元素。");
return videoSrc0;
}
//return videoSrc;
// 创建一个新的 div 元素用于展示视频 URL
var urlDisplayDiv = document.createElement('div');
urlDisplayDiv.style.padding = '10px';
urlDisplayDiv.style.backgroundColor = '#f0f0f0';
urlDisplayDiv.style.border = '1px solid #ccc';
urlDisplayDiv.style.marginTop = '10px';
// 创建显示文本节点
//var urlDisplayText = document.createTextNode('Preview Video URL: ' + videoSrc);
// 将文本节点添加到新创建的 div 元素中
//urlDisplayDiv.appendChild(urlDisplayText);
// 将新创建的 div 元素插入到页面中，添加到视频元素后面
//videoElement1.parentNode.insertBefore(urlDisplayDiv, videoElement1.nextSibling);
// 打印到控制台
console.log('Preview Video URL:', videoSrc);
// 可以根据需要进行进一步处理，比如发送到后端或者展示在页面上
// 例如，将URL发送到后端进行记录或分析等
// fetch('http://example.com/log-video-url', {
// method: 'POST',
// body: JSON.stringify({ url: videoSrc }),
// headers: {
// 'Content-Type': 'application/json'
// }
// });
console.log("函数getVideoSrc结束。");
}
//创建视频播放器创建视频播放器创建视频播放器创建视频播放器创建视频播放器创建视频播放器创建视频播放器创建视频播放器创建视频播放器创建视频播放器创建视频播放器创建视频播放器————————创建视频播放器函数开始
function setupVideoPlayer() {
// Create a video element
var videoElement = document.createElement('video');
videoElement.controls = false;//true; // Show default controls
videoElement.style.width = '100%'; // Set width to 100% of parent element
//videoElement.style.maxWidth = '50vw';
//videoElement.style.width = '1088px';
// 设置最大高度
//videoElement.style.height = '756px';
videoElement.style.maxHeight = '98vh';
//videoElement.style.maxHeight = "98%";
videoElement.classList.add('video-element');
videoElement.style.display = 'block'; // Make it a block element
videoElement.style.margin = 'auto'; // Center horizontally
//videoElement.style.marginTop = '1px'; // 100px margin from the top
videoElement.style.backgroundColor = '#0a0a0a';//#202124';//#363636';//#f8f9fa';
// 监听视频加载成功事件（可选）
videoElement.onloadeddata = function() {
console.log('.onloadeddata: Video loaded successfully.');
};
// 监听视频加载失败事件（可选）
videoElement.onerror = function() {
console.error('.onerror: An error occurred while trying to play the video.');
alert('.onerror: \n An error occurred while trying to play the video !!!');
};
// 监听播放事件
videoElement.onplay = function() {
console.log('.onplay: Video started playing.');
};
// 监听暂停事件
videoElement.onpause = function() {
console.log('.onpause: Video paused.');
};
// Create input for video URL
var inputUrl = document.createElement('input');
inputUrl.type = 'text';
inputUrl.placeholder = 'Enter video URL...';
inputUrl.style.marginRight = '2px';
inputUrl.style.marginLeft = '2px';
inputUrl.style.padding = '8px';
inputUrl.style.border = '1px solid #ccc';
inputUrl.style.borderRadius = '4px';
//inputUrl.style.fontSize = '14px';
inputUrl.style.fontSize = '4px';
inputUrl.style.flex = '1';
inputUrl.style.maxWidth = '100px';
// Create button to change video source
const changeButton = createButton();
changeButton.textContent = 'InPut';//and Play';
changeButton.onclick = function() {
videoElement.pause();
console.log('先暂停视频:');
var newSrc = inputUrl.value.trim();
if (newSrc) {
videoElement.src = newSrc;
videoElement.play(); // Auto-play after changing source
}
};
// Create container for input and button
var controlsContainer = document.createElement('div');
controlsContainer.style.width = '100%';
//controlsContainer.style.width = '1088px';;
controlsContainer.style.margin = 'auto'; // Center horizontally
controlsContainer.style.display = 'flex';
controlsContainer.style.justifyContent = 'center'; // Center horizontally
controlsContainer.style.alignItems = 'center';
controlsContainer.style.flexWrap = 'nowrap';
controlsContainer.style.marginTop = '1px';
controlsContainer.style.padding = '2px';
controlsContainer.style.backgroundColor = '#363636';//#f8f9fa';
controlsContainer.style.border = '1px solid #363636';//#ccc';
controlsContainer.style.borderRadius = '8px';
controlsContainer.style.boxSizing = 'border-box'; // Ensure padding and border are included in width
controlsContainer.style.height = '20px';
controlsContainer.style.overflow = 'hidden';
//controlsContainer.style.lineHeight = '4px';
function createButton() {
// Create button to paste from clipboard and play video
var button = document.createElement('button');
button.textContent = 'Paste';//and Play';
button.style.padding = '2px 6px';
button.style.border = 'none';
button.style.backgroundColor = '#0056b3';//#007bff';
button.style.color = '#999999';//#fff';
button.style.fontWeight = 'bold';
button.style.cursor = 'pointer';
button.style.borderRadius = '4px';
button.style.marginRight = '2px';
button.style.marginLeft = '2px';
//pasteButton.style.fontSize = '14px';
button.style.fontSize = '4px';
return button;
}
const autoButton = createButton();
autoButton.textContent = 'Auto';//and Play';
controlsContainer.appendChild(autoButton);
autoButton.onclick = function() {
autoClick();
};
function autoClick() {
const inspectResult = inspectDiv(); // 假设这是一个函数来检查是否存在特定的 div
console.log('点击Paste按钮成功');
console.log('Paste按钮读取inspectResult:', inspectResult);
videoElement.pause();
console.log('先暂停视频:');
inputUrl.value = getVideoSrc();
// 检查 videoMetaPanel 是否存在，避免后续的错误
if (inspectResult === true) {
console.log('inspectResult值为:', inspectResult, ' 1自动获取视频链接');
if (inputUrl.value) {
videoElement.src = inputUrl.value;
if (videoElement.src.endsWith("hhb.mp4")) {
console.log("videoURL ends with 'hhb.mp4'");
autoButton.textContent = 'hhb'; //and Play';
} else if (videoElement.src.endsWith("mhb.mp4")) {
console.log("videoURL ends with 'mhb.mp4'");
autoButton.textContent = 'mhb'; //and Play';
} else if (videoElement.src.endsWith("4k.mp4")) {
console.log("videoURL ends with '4k.mp4'");
autoButton.textContent = '4k'; //and Play';
} else if (videoElement.src.endsWith("_dmb_w.mp4")) {
console.log("videoURL ends with 'dmb_w.mp4'");
autoButton.textContent = 'dmb_w'; //and Play';
} else if (videoElement.src.endsWith("_sm_w.mp4")) {
console.log("videoURL ends with '_sm_w.mp4'");
autoButton.textContent = 'low'; //and Play';
} else if (videoElement.src.endsWith("hhbs.mp4")) {
console.log("videoURL ends with 'hhbs.mp4'");
autoButton.textContent = 'hhbs'; //and Play';
} else {
autoButton.textContent = 'NaN'; //and Play';
}
// 按钮点击后的处理函数
videoElement.play()
.then(function() {
// 播放成功时的操作
console.log("使用video.play:", videoElement.src, ' 开始播放视频⏯');
})
.catch(function(error) {
console.error('An error occurred while trying to play the video:', error.message);
// 显示错误消息给用户
alert('Unable to play the video. Please try again later.');
});
// 按钮点击后的处理函数
console.log("Paste按钮Auto get Video source:", videoElement.src, ' 开始播放视频⏯');
} else {
console.log("inputUrl.value值为:", inputUrl.value, ' 请检查错误');
autoButton.textContent = 'N/A'; //and Play';
//alert('An error occurred while trying to get the videoSrc: \n' + inputUrl.value +' 请检查视频源是否存在');
} // if (inputUrl.value) 结束
} else {
console.log('inspectResult值为:', inspectResult, ' 请手动获取视频链接');
alert('请手动获取视频链接.');
/*
console.log("Paste按钮Auto get Video source失败:切换获取剪贴板内容,请手动复制后再次点击");
navigator.clipboard.readText().then(function (clipboardText) {
inputUrl.value = clipboardText.trim();
if (inputUrl.value) {
videoElement.src = inputUrl.value;
videoElement.play();
// 可以添加其他操作逻辑
console.log('剪贴板内容读取成功', inputUrl.value, '开始播放');
//console.log('剪贴板内容读取成功:', inspectResult);
} else {
console.error('剪贴板内容读取失败');
}
}).catch(function (err) {
console.error('Failed to read clipboard contents: ', err);
});
*/
} // if (inspectResult === true) 结束
console.log('点击Paste按钮事件结束');
}
const mhbButton = createButton();
mhbButton.textContent = 'mhb';//and Play';
controlsContainer.appendChild(mhbButton);
mhbButton.onclick = function() {
const inspectResult = inspectDiv(); // 假设这是一个函数来检查是否存在特定的 div
console.log('点击mhb按钮成功');
console.log('mhb按钮读取inspectResult:', inspectResult);
autoButton.textContent = 'Auto';//and Play';
//videoElement.pause();
//console.log('先暂停视频:');
// 检查 videoMetaPanel 是否存在，避免后续的错误
//if (inspectResult) {
console.log('inspectResult值为:', inspectResult,' 自动获取视频链接');
//inputUrl.value = videoSrcPaste;
//if (inputUrl.value) {
inputUrl.value = getVideoUrl();
console.log('正在运行getvideorul函数尝试获取视频源');
videoElement.src = inputUrl.value;
console.log('运行getvideorul函数返回的视频地址: ', videoElement.src);
if (videoElement.src.endsWith(".mp4")) {
//mhbButton.textContent = 'N/A'; //and Play';
console.log('正在加载 video 元素，准备播放');
// 调用 video.load() 方法，重新加载 video 元素，准备播放
//videoElement.load();
//videoElement.play();
videoElement.play()
.then(function() {
// 播放成功时的操作
console.log("使用mhbButton:",videoElement.src,' 开始播放视频⏯');
})
.catch(function(error) {
console.error('An error occurred while trying to play the video:', error.message);
// 显示错误消息给用户
alert('An error occurred while trying to play the video: \n' + error.message);
//alert('Unable to play the video. Please try again later.');
});
console.log("mhb按钮Auto get Video url:",videoElement.src,' 开始播放视频⏯');
} else {//if (videoElement.src.endsWith(".mp4")) {
mhbButton.textContent = 'N/A'; //and Play';
console.log('mhb按钮找不到视频源');
}//if (videoElement.src === undefined) 结束
/*} else {
console.log('inspectResult值为:', inspectResult,' 请手动获取视频链接');
alert('请手动获取视频链接.');
//
console.log("Paste按钮Auto get Video source失败:切换获取剪贴板内容,请手动复制后再次点击"); //
navigator.clipboard.readText().then(function (clipboardText) {
inputUrl.value = clipboardText.trim();
if (inputUrl.value) {
videoElement.src = inputUrl.value;
videoElement.play();
// 可以添加其他操作逻辑
console.log('剪贴板内容读取成功',inputUrl.value, '开始播放');
//console.log('剪贴板内容读取成功:', inspectResult);
} else {
console.error('剪贴板内容读取失败');
}
}).catch(function (err) {
console.error('Failed to read clipboard contents: ', err);
});
}*/
console.log('点击mhb按钮事件结束 ');
};
const pasteButton = createButton();
pasteButton.textContent = 'Paste';//and Play';
controlsContainer.appendChild(pasteButton);
pasteButton.onclick = function() {
console.log("Paste按钮Auto get Video source失败:切换获取剪贴板内容,请手动复制后再次点击"); //
navigator.clipboard.readText().then(function (clipboardText) {
inputUrl.value = clipboardText.trim();
if (inputUrl.value) {
videoElement.src = inputUrl.value;
videoElement.play();
// 可以添加其他操作逻辑
console.log('剪贴板内容读取成功',inputUrl.value, '开始播放');
//console.log('剪贴板内容读取成功:', inspectResult);
} else {
console.error('剪贴板内容读取失败');
}
}).catch(function (err) {
console.error('Failed to read clipboard contents: ', err);
});
};
const clearButton = createButton();
clearButton.textContent = 'Clear2';//and Play';
controlsContainer.appendChild(clearButton);
clearButton.addEventListener('click', function() {
inputUrl.value = '';// 点击按钮时清空输入框的值
});
controlsContainer.appendChild(inputUrl);
controlsContainer.appendChild(changeButton);
/*
const pipButton = createButton();
pipButton.textContent = 'enterPIP';//and Play';
controlsContainer.appendChild(pipButton);
pipButton.addEventListener('click', function() {
enterPiP(container);
});
// Function to enter PiP mode with the selected element
let originalPosition = null; // Variable to store original position of selected element
async function enterPiP(selectedElement) {
const pipOptions = {
width: 0.6*selectedElement.clientWidth,
height: 0.63*0.6*selectedElement.clientWidth,
};
let originalPosition = null; // Variable to store original position of selected element
// Save original position
originalPosition = {
parent: selectedElement.parentNode,
nextSibling: selectedElement.nextSibling,
};
// Request PiP window and add selected element
const pipWindow = await documentPictureInPicture.requestWindow(pipOptions);
pipWindow.document.body.append(selectedElement);
// Listen for PiP closing event
pipWindow.addEventListener('pagehide', function() {
// Remove element from PiP and restore to original position
insertContainer();
//restoreElement(selectedElement);
//alert('PiP window closed.');
}, { once: true });
}
// Function to restore element to its original position
function restoreElement(element) {
if (originalPosition && originalPosition.parent) {
originalPosition.parent.insertBefore(element, originalPosition.nextSibling);
}
}
// Append inputUrl and pasteButton to controlsContainer
//controlsContainer.appendChild(inputUrl);
*/
// Create play button
const playButton = createButton();
playButton.textContent = 'Play';//and Play';
playButton.style.backgroundColor = '#005200'; //#28a745';
controlsContainer.appendChild(playButton);;
playButton.onclick = function() {
if (videoElement.paused) {
videoElement.play();
playButton.textContent = 'Play';
playButton.style.backgroundColor = '#005200'; //#28a745';
} else {
videoElement.pause();
playButton.textContent = 'Play';
playButton.style.backgroundColor = '#dc3545'; // Change button color back to red when paused
}
};
// Create progress bar
var progressBar = document.createElement('input');
progressBar.type = 'range';
progressBar.style.flex = '1';
progressBar.style.marginRight = '2px';
progressBar.style.marginLeft = '2px';
//progressBar.style.margin = '0 10px';
progressBar.style.cursor = 'pointer';
progressBar.style.height = '4px';
progressBar.style.appearance = 'none';
progressBar.style.backgroundColor = '#dee2e6';
progressBar.style.borderRadius = '2px';
progressBar.style.outline = 'none';
progressBar.style.transition = 'background-color 0.3s ease';
progressBar.min = 0;
progressBar.value = 0; // Start with 0 progress
controlsContainer.appendChild(progressBar);
// Update progress bar on timeupdate
videoElement.addEventListener('timeupdate', function() {
var currentTime = videoElement.currentTime;
var duration = videoElement.duration;
if (duration > 0) {
progressBar.value = (currentTime / duration) * 100;
} else {
progressBar.value = 0;
}
});
// Handle seeking with progress bar
progressBar.addEventListener('input', function() {
var seekTime = videoElement.duration * (progressBar.value / 100);
videoElement.currentTime = seekTime;
});
// Create speed control
var speedControl = document.createElement('select');
//speedControl.style.margin = '0 10px';
speedControl.style.marginRight = '2px';
speedControl.style.marginLeft = '2px';
speedControl.style.padding = '6px 2px';
//speedControl.style.fontSize = '14px';
speedControl.style.fontSize = '4px';
speedControl.style.border = '1px solid #ccc';
speedControl.style.borderRadius = '4px';
speedControl.style.cursor = 'pointer';
var speeds = [1.0, 1.5, 0.5, 2.0, 4.0, 8.0, 16.0];
speeds.forEach(function(speed) {
var option = document.createElement('option');
option.textContent = speed + 'x';
option.value = speed;
speedControl.appendChild(option);
});
speedControl.onchange = function() {
videoElement.playbackRate = parseFloat(speedControl.value);
};
controlsContainer.appendChild(speedControl);
// Create remaining time display
var timeDisplay = document.createElement('span');
timeDisplay.style.marginRight = '1px';
timeDisplay.style.marginLeft = '1px';
//timeDisplay.style.margin = '0 10px';
//timeDisplay.style.fontSize = '14px';
timeDisplay.style.fontSize = '4px';
timeDisplay.style.color = '#999999';
controlsContainer.appendChild(timeDisplay);
// Update remaining time display
videoElement.addEventListener('timeupdate', function() {
var current = Math.floor(videoElement.currentTime);
var total = Math.floor(videoElement.duration);
var remaining = total - current;
timeDisplay.textContent = 'Remaining: ' + formatTime(remaining);
});
// Create mute button
const muteButton = createButton();
muteButton.textContent = 'Mute';//and Play';
controlsContainer.appendChild(muteButton);
muteButton.onclick = function() {
videoElement.muted = !videoElement.muted;
muteButton.textContent = videoElement.muted ? 'Unmute' : 'Mute';
};
// Create fullscreen button
const fullscreenButton = createButton();
fullscreenButton.textContent = 'Fullscrren';//and Play';
controlsContainer.appendChild(fullscreenButton);
fullscreenButton.onclick = function() {
if (videoElement.requestFullscreen) {
videoElement.requestFullscreen();
} else if (videoElement.mozRequestFullScreen) {
videoElement.mozRequestFullScreen();
} else if (videoElement.webkitRequestFullscreen) {
videoElement.webkitRequestFullscreen();
} else if (videoElement.msRequestFullscreen) {
videoElement.msRequestFullscreen();
}
};
//创建画中画按钮创建画中画按钮创建画中画按钮创建画中画按钮创建画中画按钮创建画中画按钮创建画中画按钮创建画中画按钮创建画中画按钮创建画中画按钮
const pipButton = createButton();
pipButton.textContent = 'enterPIP';//and Play';
controlsContainer.appendChild(pipButton);
pipButton.addEventListener('click', function() {
enterPiP(container);
});
// Function to enter PiP mode with the selected element
let originalPosition = null; // Variable to store original position of selected element
async function enterPiP(selectedElement) {
const pipOptions = {
width: 0.6*selectedElement.clientWidth,
height: 0.63*0.6*selectedElement.clientWidth,
};
let originalPosition = null; // Variable to store original position of selected element
// Save original position
originalPosition = {
parent: selectedElement.parentNode,
nextSibling: selectedElement.nextSibling,
};
// Request PiP window and add selected element
const pipWindow = await documentPictureInPicture.requestWindow(pipOptions);
pipWindow.document.body.append(selectedElement);
// Listen for PiP closing event
pipWindow.addEventListener('pagehide', function() {
// Remove element from PiP and restore to original position
insertContainer(playerContainer);
//restoreElement(selectedElement);
//alert('PiP window closed.');
}, { once: true });
}
// Function to restore element to its original position
function restoreElement(element) {
if (originalPosition && originalPosition.parent) {
originalPosition.parent.insertBefore(element, originalPosition.nextSibling);
}
}
// Append inputUrl and pasteButton to controlsContainer
//controlsContainer.appendChild(inputUrl);
//创建画中画按钮创建画中画按钮创建画中画按钮创建画中画按钮创建画中画按钮创建画中画按钮创建画中画按钮创建画中画按钮创建画中画按钮创建画中画按钮
const topButton = createButton();
topButton.textContent = 'ToP';//and Play';
controlsContainer.appendChild(topButton);
topButton.addEventListener('click', function() {
// 获取按钮元素
//var scrollToElementButton = document.getElementById('scrollToElementButton');
// 监听按钮的点击事件
// 获取目标元素
//var element = document.getElementById('targetElement');
var element = container;
// 获取目标元素顶部相对于文档顶部的偏移量
var offsetTop = element.getBoundingClientRect().top + window.pageYOffset;
// 计算滚动距离
var scrollDistance = offsetTop - 54; // 减去一些额外的空间，例如标题栏的高度等
// 执行滚动操作
window.scrollTo({
top: scrollDistance,
behavior: 'smooth' // 平滑滚动效果，可选
});
});
// Helper function to format time in mm:ss format
function formatTime(seconds) {
var minutes = Math.floor(seconds / 60);
var remainingSeconds = seconds % 60;
return minutes + ':' + (remainingSeconds < 10 ? '0' : '') + remainingSeconds;
}
//video和控件防止在同一个容器
const container = document.createElement('div');
container.classList.add('video-container');
container.style.width = '100%';
//container.style.height = '777px';
//container.style.maxHeight = '50vh';
container.style.margin = 'auto'; // Center horizontally
//container.style.marginTop = '-1.4rem';
//container.style.borderTop = '1px solid #3272dc';//#202124';//red';
//container.style.border = '1px solid #363636';
//container.style.marginBottom = '115px';
//container.style.backgroundColor = '#202124';//#35363a';//#4a4a4a';//#333333';//#363636';//000'; // 设置背景颜色，可选
// Insert controlsContainer right after videoElement
videoElement.insertAdjacentElement('afterend', controlsContainer);
// 将 videoElement 和 controlsContainer 添加到新容器中
container.appendChild(videoElement);
container.appendChild(controlsContainer);
//返回值
return container;
}
//创建视频播放器创建视频播放器创建视频播放器创建视频播放器创建视频播放器创建视频播放器创建视频播放器创建视频播放器创建视频播放器创建视频播放器创建视频播放器创建视频播放器————————创建视频播放器函数结束
function inspectDiv() {
var videoMetaPanel = document.querySelector('.video-meta-panel');
const movieDiv = document.querySelector('.row.movie');
// 检查 videoMetaPanel 是否存在，避免后续的错误
if (videoMetaPanel) {
// 使用 insertBefore 方法将 newElement 插入到 video-meta-panel 元素之前
return true
} else {
console.error('找不到具有类名为 video-meta-panel 的元素');
}
// 检查 movieDiv 是否存在，避免后续的错误
if (movieDiv) {
// 在 movieDiv 之后执行其他操作
console.log('找到具有类名为 row movie 的元素');
return false
// 可以在这里编写针对 movieDiv 的操作逻辑
} else {
console.error('找不到具有类名为 row movie 的元素');
}
}
function insertContainer(container) {
// 获取具有类名为 video-meta-panel 的第一个元素
var videoMetaPanel = document.querySelector('.video-meta-panel');
const movieDiv = document.querySelector('.row.movie')
const inspectResult = inspectDiv();
// 检查 videoMetaPanel 是否存在，避免后续的错误
if (inspectResult) {
// 使用 insertBefore 方法将 newElement 插入到 video-meta-panel 元素之前
videoMetaPanel.parentNode.insertBefore(container, videoMetaPanel.nextSibling);
console.log('找到具有类名为 row movie 的元素:',inspectResult,'插入成功');
} else {
// 在 movieDiv 之后执行其他操作
movieDiv.parentNode.insertBefore(container, movieDiv);
console.log('找到具有类名为 row movie 的元素:',!inspectResult,'插入成功');
// 可以在这里编写针对 movieDiv 的操作逻辑
}
}
// Insert the video element at the top of the body
//document.body.insertBefore(videoElement, document.body.firstChild);
// Insert controlsContainer right after videoElement
console.log('✅Script ',scriptName, 'Completed✅');
})();
