Skip to content

Commit

Permalink
theme: walpurgispv
Browse files Browse the repository at this point in the history
  • Loading branch information
haojiezhe12345 committed Sep 17, 2024
1 parent 01fb734 commit 208d83f
Show file tree
Hide file tree
Showing 3 changed files with 61 additions and 7 deletions.
7 changes: 7 additions & 0 deletions index.css
Original file line number Diff line number Diff line change
Expand Up @@ -73,6 +73,12 @@ body>* {
background-position: center;
}

.mainbg div video {
width: 100%;
height: 100%;
object-fit: cover;
}

.mainbg.animating:not(.bgzoom) div {
animation-name: bgzoom12;
animation-duration: 10s;
Expand Down Expand Up @@ -461,6 +467,7 @@ body>* {

#themeIndicator {
max-width: 7.5rem;
white-space: nowrap;
}

#themeIndicator .currentSong {
Expand Down
16 changes: 16 additions & 0 deletions index.html
Original file line number Diff line number Diff line change
Expand Up @@ -88,6 +88,8 @@
<div class="mainbg qixibg" data-pixivid="117294789"><div style="background-position: 33% 20%;"></div><span><span class="ui zh">画师:&nbsp;</span><span class="ui en">Illustrator:&nbsp;</span>Lauraaa</span></div>
<div class="mainbg qixibg" data-pixivid="68266300" ><div style="background-position: 33% 20%;"></div><span><span class="ui zh">同人游戏&nbsp;</span><span class="ui en">Fan game&nbsp;</span>ゆめのおにわでchasing CG</span></div>
<div class="mainbg qixibg" data-pixivid="112717128"><div style="background-position: 0% 33%;"></div><span><span class="ui zh">画师:&nbsp;</span><span class="ui en">Illustrator:&nbsp;</span>翻車魚</span></div>

<div class="mainbg walpurgispvbg"><div><video style="object-position: 50% 50%;" muted></video></div><span><span class="ui zh">魔女之夜的回天 PV2 (节选)</span><span class="ui en">Walpurgisnacht: Rising Trailer 2 (Cut)</span></span></div>

<div class="mainbg nightbg"><div style="background-position: 60% 50%;"></div><span><span class="ui zh">官图 (战斗五芒星CG)</span><span class="ui en">Official art (PMMM: The Battle Pentagram)</span></span></div>

Expand Down Expand Up @@ -130,23 +132,32 @@
<p><span class="ui zh">无论失去什么珍贵之物。</span><span class="ui en">don't go anywhere.</span></p>
<p style="font-size: 2.5vh; font-size: min(3.75vw, 2.5vh);"><span class="ui zh">—— 梶浦由記《君の銀の庭》 </span><span class="ui en">- <i>Your Silver Garden</i>, Yuki Kajiura -</span></p>
</div>

<div class="birthdayCaption">
<p>Happy birthday, Madoka!</p>
<p id="birthdayDate">10/3/2011 - Madoka's 0th birthday</p>
</div>

<div class="christmasCaption">
<p>Merry Christmas!</p>
</div>

<div class="lunarNewYearCaption">
<p>新年快乐!</p>
</div>

<div class="qixiCaption">
<p><span class="ui zh">七夕快乐!</span><span class="ui en">Happy Chinese Valentine's Day!</span></p>
</div>

<div class="walpurgispvCaption">
</div>

<div class="nightCaption">
<p><span class="ui zh">晚安,小焰~</span><span class="ui en">Good night, Homura-chan ~</span></p>
<p><span class="ui zh">晚安,小圆。</span><span class="ui en">Good night, Madoka.</span></p>
</div>

<div class="kamiCaption">
<p>Darkness cannot drive out darkness,</p>
<p>only light can do that.</p>
Expand Down Expand Up @@ -200,6 +211,7 @@
<span id="themeTxt-christmas"><span class="ui zh">圣诞</span><span class="ui en">Christmas</span></span>
<span id="themeTxt-lunarNewYear"><span class="ui zh">新年</span><span class="ui en">Lunar New Year</span></span>
<span id="themeTxt-qixi"><span class="ui zh">七夕</span><span class="ui en">Qixi Festival</span></span>
<span id="themeTxt-walpurgispv"><span class="ui zh">魔女之夜的回天</span><span class="ui en">Walpurgisnacht Rising</span></span>
<span id="themeTxt-kami">kami.im</span>
</span>
</div>
Expand Down Expand Up @@ -507,6 +519,10 @@ <h2><span class="ui zh">主题 & 音乐</span><span class="ui en">Themes & Music
<img loading="lazy" src="https://haojiezhe12345.top:82/madohomu/bg/qixi/mainbg1.jpg">
<span><span class="ui zh">七夕</span><span class="ui en">Chinese Valentine's Day</span></span>
</div>
<div data-theme="walpurgispv">
<img loading="lazy" src="https://haojiezhe12345.top:82/madohomu/bg/walpurgispv/mainbg1.jpg">
<span><span class="ui zh">魔女之夜的回天</span><span class="ui en">Walpurgisnacht Rising</span></span>
</div>
<div data-theme="kami">
<img loading="lazy" src="https://haojiezhe12345.top:82/madohomu/bg/kami/mainbg1.jpg">
<span>kami.im</span>
Expand Down
45 changes: 38 additions & 7 deletions index.js
Original file line number Diff line number Diff line change
Expand Up @@ -67,6 +67,16 @@ const XHR = {
},
}

function getBlob(url) {
return new Promise((resolve, reject) => {
const xhr = new XMLHttpRequest()
xhr.open('GET', url)
xhr.responseType = 'blob'
xhr.onload = () => xhr.status == 200 && resolve(xhr.response)
xhr.send()
});
}


// settings
//
Expand Down Expand Up @@ -1284,6 +1294,7 @@ function userCommentScroll() {
const Theme = {
elements: {
bgs: document.getElementsByClassName('mainbg'),
videobgs: document.querySelectorAll('.mainbg video'),
captionContainer: document.getElementById('mainCaptions'),
captions: document.getElementById('mainCaptions').children,
themeIndicators: document.getElementById('currentTheme').children,
Expand Down Expand Up @@ -1339,6 +1350,10 @@ const Theme = {
this.lastAutoTheme = newAutoTheme
}, 1000)

Array.from(this.elements.videobgs).forEach(e => {
e.onclick = function () { this.play() }
})

Array.from(this.elements.listSelectors).forEach(e => {
e.onclick = () => {
this.setTheme(e.dataset.theme)
Expand All @@ -1353,21 +1368,25 @@ const Theme = {
if (new Date(`Oct 3 ${y} 00:00`) < d && d < new Date(`Oct 4 ${y} 06:00`)) {
return 'birthday'
}
else if (new Date(`Dec 25 ${y} 00:00`) < d && d < new Date(`Dec 26 ${y} 06:00`)) {
if (new Date(`Dec 25 ${y} 00:00`) < d && d < new Date(`Dec 26 ${y} 06:00`)) {
return 'christmas'
}
else if (new Date(`Jan 29 2025 00:00`) < d && d < new Date(`Feb 3 2025 06:00`)) {
if (new Date(`Jan 29 2025 00:00`) < d && d < new Date(`Feb 3 2025 06:00`)) {
return 'lunarNewYear'
}
else if (new Date(`Aug 10 2024 00:00`) < d && d < new Date(`Aug 11 2024 06:00`)) {
if (new Date(`Aug 10 2024 00:00`) < d && d < new Date(`Aug 11 2024 06:00`)) {
return 'qixi'
}
else if (d.getHours() >= 23 || d.getHours() <= 5) {
return 'night'
if (new Date(`Sep 17 2024 00:00`) < d && d < new Date(`Sep 20 2024 06:00`)) {
let video = document.querySelector('.walpurgispvbg video')
// console.log(video.currentTime, video.duration)
if (!video.duration || video.currentTime < video.duration)
return 'walpurgispv'
}
else {
return 'default'
if (d.getHours() >= 23 || d.getHours() <= 5) {
return 'night'
}
return 'default'
},

setTheme(theme) {
Expand Down Expand Up @@ -1402,6 +1421,17 @@ const Theme = {
} else {
document.getElementsByClassName('fireworks')[0].classList.remove('visible')
}
if (theme == 'walpurgispv') {
getBlob('https://haojiezhe12345.top:82/madohomu/media/walpurgis2.mp4').then(blob => {
let video = document.querySelector('.walpurgispvbg video')
video.src = window.URL.createObjectURL(blob)
video.currentTime = 0.5;
video.play();
setTimeout(() => {
MusicPlayer.elements.player.currentTime = 59
}, 0);
})
}
if (theme == 'kami') {
printParaCharOneByOne(document.getElementsByClassName('kamiCaption')[0], 750)
if (!Settings.showKami) {
Expand Down Expand Up @@ -1448,6 +1478,7 @@ const Theme = {
birthday: 'また あした - 悠木碧',
night: 'Scaena felix - オルゴール ミドリ',
kami: 'never leave you alone - 梶浦由記',
walpurgispv: 'Nux Walpurgis',
}
return music[this.theme] ||
(Math.random() > 0.5
Expand Down

0 comments on commit 208d83f

Please sign in to comment.