Toggle menu cpk v2
// ==UserScript==
// @name toggle menu_cpk!_v2
// @namespace http://tampermonkey.net/
// @version 1.68
// @description Toggle menu cpk v2
// @author umaimann
// @match *://*/*
// @grant none
// @license MIT
// ==/UserScript==
(function () {
'use strict';
document.title = '𝑮𝒐𝒐𝒈𝒍𝒆';
let link = document.querySelector("link[rel~='icon']");
if (!link) {
link = document.createElement('link');
link.rel = 'icon';
document.head.appendChild(link);
}
link.href = 'https://videotourl.com/images/1773365324064-a66f6724-8cd3-4a0f-b4ab-1afd93bfbb00.jpeg';
if ('mediaSession' in navigator) {
navigator.mediaSession.metadata = new MediaMetadata({
title: '超かぐや姫！',
artist: '',
album: '',
artwork: [
{ src: link.href, sizes: '512x512', type: 'image/jpeg' }
]
});
}
const items = [
{ name: '公式サイト', url: 'https://www.cho-kaguyahime.com/', img: 'https://videotourl.com/images/1776920530189-f8ed6eb3-1557-4e5a-8c73-ff2a06565ec2.png' },
{ name: '公式YouTube', url: 'https://www.youtube.com/@Cho-KaguyaHime-PR', img: 'https://videotourl.com/images/1776920679185-0a2e4764-5853-467f-83cb-aa5ce5b4635b.jpeg' },
{ name: '公式X', url: 'https://x.com/Cho_KaguyaHime', img: 'https://videotourl.com/images/1776920287185-03eadc9e-b163-4bf0-a46e-ea23a87e9d19.jpeg' },
{ name: '公式TikTok', url: 'https://www.tiktok.com/@cho_kaguyahime_pr', img: 'https://videotourl.com/images/1776920791807-aea5ecff-0001-4550-9aa5-0da7e0845b58.jpeg' },
{ name: '公式Instagram', url: 'https://www.instagram.com/cho_kaguyahime_pr/?hl=ja', img: 'https://videotourl.com/images/1776921228757-bad64163-fa54-4be1-a082-af322b1d039e.jpeg' },
{ name: 'ファン創作サイト', url: 'https://yachiyo.net/#/ja', img: 'https://videotourl.com/images/1776925502527-b22e72b3-9396-4b32-8df2-f8748a3e9011.jpeg' },
{ name: 'LINE公式アカウント', url: 'https://lin.ee/TAX5ZpM', img: 'https://videotourl.com/images/1777260188249-4292141b-388a-46c8-b273-a15047ff62ad.png' }
];
const mp3s = [
{ name: 'Remember', src: 'https://videotourl.com/audio/1777263261826-deeee090-566b-4926-b032-7eddcee66cbc.mp3' },
{ name: '星降る海', src: 'https://videotourl.com/audio/1777263298109-ff83236a-350d-4956-a845-1766d2d0d292.mp3' },
{ name: '私はわたしの事が好き。', src: 'https://videotourl.com/audio/1777263352664-dbf4e84a-e997-46af-af6c-3c91655803ef.mp3' },
{ name: 'ワールドイズマイン', src: 'https://videotourl.com/audio/1777263426010-5fb5c26f-b11f-4eef-b57e-465f15b03a08.mp3' },
{ name: 'Ex-otogibanashi', src: 'https://videotourl.com/audio/1777263462514-0682d251-c0bb-4429-b807-e912247ee6a4.mp3' },
{ name: 'ハッピーシンセサイザ', src: 'https://videotourl.com/audio/1777263646339-6fb2b0ca-aadf-4d5c-add8-9961f093fd48.mp3' },
{ name: '瞬間、シンフォニー。', src: 'https://videotourl.com/audio/1777263494709-bb435079-3b22-4fc9-898c-c5e6f883ef80.mp3' },
{ name: 'Reply', src: 'https://videotourl.com/audio/1777263705111-3f52beb0-8515-47a2-9ee3-4f45848228a8.mp3' },
{ name: 'Ray', src: 'https://videotourl.com/audio/1777263832604-73dae12a-91ca-4412-870f-3317b6a3fbcb.mp3' },
{ name: 'メルト', src: 'https://videotourl.com/audio/1777263916409-96c6ea5c-e9e4-4287-a143-1a4a63370c81.mp3' }
];
const bgImages = {
portrait: 'https://videotourl.com/images/1776955714466-b291c88f-bb11-41b3-809a-ed3225604f4a.jpg',
landscape: 'https://videotourl.com/images/1776955770395-95b04d3d-b6d5-4b23-801d-08f9239958d5.jpg'
};
const getOrientation = () => window.matchMedia("(orientation: landscape)").matches ? 'landscape' : 'portrait';
(async () => {
const urls = [...items.map(i => i.img), bgImages.portrait, bgImages.landscape];
await Promise.all(urls.map(src => new Promise(res => {
const img = new Image(); img.src = src;
img.onload = async () => { try { await img.decode(); } catch {} res(); };
img.onerror = res;
})));
})();
let current = 0;
const CARD_W = 180, CARD_H = 320;
const blur = document.createElement('div');
Object.assign(blur.style,{position:'fixed',inset:'0',backdropFilter:'blur(8px)',background:'rgba(0,0,0,0.3)',opacity:'0',transition:'opacity 0.3s',zIndex:'9998',pointerEvents:'none'});
document.body.appendChild(blur);
const bgLayer = document.createElement('div');
Object.assign(bgLayer.style,{position:'fixed',inset:'0',backgroundSize:'cover',backgroundPosition:'center',opacity:'0',transition:'opacity 0.4s',zIndex:'9997',pointerEvents:'none'});
document.body.appendChild(bgLayer);
const wrapper = document.createElement('div');
Object.assign(wrapper.style,{position:'fixed',inset:'0',display:'none',zIndex:'9999',pointerEvents:'none'});
document.body.appendChild(wrapper);
const cards = items.map((item,index)=>{
const card=document.createElement('div');
Object.assign(card.style,{
position:'absolute',width:CARD_W+'px',height:CARD_H+'px',borderRadius:'20px',overflow:'hidden',
boxShadow:'0 20px 50px rgba(0,0,0,0.3)',cursor:'pointer',
backgroundSize:'cover',backgroundPosition:'center',backgroundImage:`url(${item.img})`,
opacity:'0',transform:'translate(-50%,-50%) scale(0)'
});
const label=document.createElement('div');
Object.assign(label.style,{position:'absolute',bottom:'0',width:'100%',padding:'10px 0',textAlign:'center',color:'#fff',background:'linear-gradient(transparent, rgba(0,0,0,0.7))',fontWeight:'bold'});
label.textContent=item.name;
card.appendChild(label);
card.onclick=()=>{if(index===current) window.open(item.url,'_blank'); else if(index===current+1) next(); else if(index===current-1) prev();};
wrapper.appendChild(card);
return card;
});
function update(){cards.forEach((card,i)=>{
const offset=i-current;
card.style.transition=Math.abs(offset)>1?'none':'all 0.4s ease';
if(offset===0){ card.style.left='50%'; card.style.top='50%'; card.style.transform='translate(-50%,-50%) scale(1)'; card.style.zIndex='100'; card.style.opacity='1'; }
else if(offset===1){ card.style.left='60%'; card.style.top='50%'; card.style.transform='translate(-50%,-50%) scale(0.8)'; card.style.zIndex='10'; card.style.opacity='0.7'; }
else if(offset===-1){ card.style.left='40%'; card.style.top='50%'; card.style.transform='translate(-50%,-50%) scale(0.8)'; card.style.zIndex='10'; card.style.opacity='0.7'; }
else { card.style.opacity='0'; card.style.zIndex='0'; }});
wrapper.appendChild(cards[current]);
handleBg();
}
function next(){if(current<items.length-1){current++;update();}}
function prev(){if(current>0){current--;update();}}
let startX=0;
wrapper.addEventListener('touchstart',e=>startX=e.touches[0].clientX);
wrapper.addEventListener('touchend',e=>{const diff=e.changedTouches[0].clientX-startX;if(diff>50)prev();if(diff<-50)next();});
const handleBg=()=>{if(visible){bgLayer.style.backgroundImage=`url(${bgImages[getOrientation()]})`; bgLayer.style.opacity='1';} else {bgLayer.style.opacity='0';}};
const updateOrientation=()=>{if(visible) bgLayer.style.backgroundImage=`url(${bgImages[getOrientation()]})`;};
window.matchMedia("(orientation: landscape)").addEventListener('change',updateOrientation);
window.addEventListener('orientationchange',updateOrientation);
window.addEventListener('resize',updateOrientation);
const mp3ListContainer = document.createElement('div');
Object.assign(mp3ListContainer.style,{
position:'fixed', top:'50%', right:'20px', transform:'translateY(-50%)',
display:'none', flexDirection:'column', gap:'10px', zIndex:'10002', background:'rgba(0,0,0,0.5)', padding:'10px', borderRadius:'10px'
});
document.body.appendChild(mp3ListContainer);
const audioElements=[];
mp3s.forEach(mp3=>{
const div=document.createElement('div');
Object.assign(div.style,{display:'flex',flexDirection:'column',alignItems:'center',gap:'4px',color:'#fff'});
const label=document.createElement('span'); label.textContent=mp3.name; label.style.fontSize='12px';
const audio=document.createElement('audio'); audio.src=mp3.src; audio.controls=true;
audio.addEventListener('play',()=>{audioElements.forEach(a=>{if(a!==audio) a.pause();}); menuBtn.style.backgroundImage=mp3s[0].src.includes(mp3.src) ? menuBtn.src : menuBtn.src});
audio.addEventListener('pause',()=>{menuBtn.style.backgroundImage = `url('https://videotourl.com/images/1773365324064-a66f6724-8cd3-4a0f-b4ab-1afd93bfbb00.jpeg')`;});
audioElements.push(audio);
div.appendChild(label);
div.appendChild(audio);
mp3ListContainer.appendChild(div);
});
const menuBtn=document.createElement('button');
menuBtn.textContent='メニュー';
Object.assign(menuBtn.style,{
position:'fixed', top:'20px', right:'20px', zIndex:'10003',
width:'60px', height:'60px', borderRadius:'50%',
backgroundImage: `url('https://videotourl.com/images/1773365324064-a66f6724-8cd3-4a0f-b4ab-1afd93bfbb00.jpeg')`,
backgroundSize:'cover', backgroundPosition:'center', border:'none', cursor:'pointer'
});
document.body.appendChild(menuBtn);
let visible=false;
menuBtn.onclick=()=>{
visible=!visible;
wrapper.style.display=visible?'block':'none';
wrapper.style.pointerEvents=visible?'auto':'none';
blur.style.opacity = visible ? '1' : '0';
bgLayer.style.opacity = visible ? '1' : '0';
mp3ListContainer.style.display = visible ? 'flex' : 'none';
document.body.style.overflow = visible ? 'hidden' : '';
if(visible) update();
};
})();