try to take over the world!
目前為
// ==UserScript==
// @name [Typing-Tube]試聴再生を追加
// @namespace http://tampermonkey.net/
// @version 0.9
// @description try to take over the world!
// @author You
// @match https://typing-tube.net/*
// @exclude https://typing-tube.net/movie/edit*
// @grant https://www.youtube.com/iframe_api
// ==/UserScript==
let videoidaa
let humenID
let last_hover_data
let humenName
let img_selector
let td_flag = false
let risize_dom
let demo_player_html = document.createElement('div');
demo_player_html.setAttribute("id", "player_demo");
let tag = document.createElement('script');
tag.src = "https://www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
let start_time = 0
let img_height_size = 0
let img_width_size = 0
function set_preview_video(){
if(event.shiftKey && humenID != hover_id){
humenID = hover_id
$.ajax({
type: 'POST',
url: '/movie/lyrics/' + humenID,
success:function(data){
const data_split = data.split("\n")
for(let i=0;0<data_split.length;i++){
if(i>0 && data_split[i].split("\t")[2]){
start_time = Math.round(+data_split[i].split("\t")[0])
break;
}
}
last_hover_data = data.match(/(v=).*\n/)[0].slice(2)
if(last_hover_data != videoidaa && humenID && (!location.href.match("https://typing-tube.net/movie/") || location.href.match("https://typing-tube.net/movie/") && (is_played && finished || !is_played))){
demo_video_delete()
const selector_ = last_hover_data.replace(/^\d+/,"").replace(/^-/,"")
if(td_flag){
img_height_size = 60
img_width_size = 90
}else{
img_height_size = img_selector.height
img_width_size = img_selector.width
}
if(document.getElementById("player_demo") == null){
if(td_flag){
td_flag.insertAdjacentHTML('beforebegin', `<div id="player_demo" style="position:absolute;"></div>`)
}else{
if(demo_player_html.getAttribute("style") == "margin: auto;"){
img_selector.style.position = "absolute"
img_selector.style.visibility = "hidden"
}
img_selector.parentNode.insertBefore(demo_player_html, img_selector);
demo_player_html = document.getElementById("player_demo").cloneNode(true)
// document.getElementById("player_demo").setAttribute("class",img_selector.className)
risize_dom = img_selector.parentNode.querySelector("img[src*='i.ytimg.com']")
}
if(location.href.match("https://typing-tube.net/movie/") && is_played && finished){
typing_restart_stop()
}
videoidaa = last_hover_data
onYouTubeIframeAPIReady_demo()
}
}
}
});
}
}
window.addEventListener( 'resize', function() {
if(risize_dom && document.getElementById("player_demo") != null && img_height_size != 60){
img_height_size = risize_dom.height+1
img_width_size = risize_dom.width+1
document.getElementById("player_demo").setAttribute("height",img_height_size)
document.getElementById("player_demo").setAttribute("width",img_width_size)
}
}, false );
window.addEventListener("keydown", set_preview_video,true);
function video_volume_change(){
if(document.getElementById("player_demo") != null){
player_demo.setVolume(+document.getElementById("demo_volume").value)
}
localStorage.setItem('demo_volume',document.getElementById("demo_volume").value)
}
function demo_video_delete(){
if(document.getElementById("player_demo") != null){
videoidaa = ""
if(risize_dom){
risize_dom.style.position = "static"
risize_dom.style.visibility = "visible"
document.getElementById("player_demo").remove()
risize_dom = 0
}else{
document.getElementById("player_demo").remove()
}
}
}
function keydown_et(event){
if(event.key == "Escape"){
demo_video_delete()
window.removeEventListener('keydown',keydown_et,true);
}
}
function onPlayerReady_demo(event) {
player_demo.setVolume(+document.getElementById("demo_volume").value)
window.addEventListener('keydown',keydown_et,true);
}
var player_demo
function onYouTubeIframeAPIReady_demo() {
player_demo = new YT.Player('player_demo', {
height: img_height_size+1 ,
width: img_width_size+1 ,
playerVars: {
autoplay: 1,
controls: 0,
disablekb: 1,
enablejsapi: 1,
modestbranding:1,
showinfo:0,
origin: location.protocol + '//' + location.hostname + "/",
start: start_time
},
videoId: videoidaa,
events: {
'onReady': onPlayerReady_demo
}
});
}
var stylesheet = document.styleSheets.item(0)
stylesheet.insertRule('.pointer:hover{ cursor: help;text-decoration : underline;}',47);
document.getElementById("main_content").insertAdjacentHTML('afterbegin', `<div style="margin-top:1rem;"><label>試聴音量<input value="70" type="range" id="demo_volume"></label> <span>[再生したい動画にカーソルを合わせてShiftキー:再生] [再生中にEscapeキー:停止]</span></div>`)
document.getElementById("demo_volume").addEventListener("input", video_volume_change);
document.getElementById("demo_volume").setAttribute("value",localStorage.getItem('demo_volume'))
var demo_stop
function typing_play_stop(){
if(location.href.match("https://typing-tube.net/movie/")){
demo_stop = setInterval(function(){
if(is_played){
demo_video_delete()
clearInterval(demo_stop)
clearInterval(restart_stop)
}
},50)
}
}
var restart_stop
function typing_restart_stop(){
if(location.href.match("https://typing-tube.net/movie/")){
restart_stop = setInterval(function(){
if(!finished){
demo_video_delete()
clearInterval(restart_stop)
clearInterval(demo_stop)
}
},50)
}
}
typing_play_stop()
function get_img(event){
const find_selector_word = ["timeline","mt-3","col"]
for(let i=0;i<find_selector_word.length;i++){
if(event.target.closest("[class*="+find_selector_word[i]+"]") && event.target.closest("[class*="+find_selector_word[i]+"]").querySelector("img[src*='i.ytimg.com']")){
if(find_selector_word[i] == "timeline"){
demo_player_html.setAttribute("style", "margin: auto;");
}else{
demo_player_html.setAttribute("style", "position:absolute;");
}
return event.target.closest("[class*="+find_selector_word[i]+"]").querySelector("img[src*='i.ytimg.com']")
}
}
return false
}
let hover_id = 0
function mouse_event(event) {
if(event.type == "mouseover" && event.currentTarget.href.match("https://typing-tube.net/movie/show/")){
img_selector = get_img(event)
td_flag = event.target.closest("[style*='i.ytimg.com']") ? event.target.closest("[style*='i.ytimg.com']"):false
hover_id = event.currentTarget.href.match(/[0-9]+\.?[0-9]*/g)
}
}
function eventlistener(){
let typing_link = document.querySelectorAll("[href*='movie/show/']")
for(let n = 0; n < typing_link.length ; n++){
typing_link[n].addEventListener("mouseover",mouse_event,true)
}
}
eventlistener();