mirror of
https://github.com/asphyxia-core/plugins.git
synced 2026-03-23 10:24:38 -05:00
606 lines
24 KiB
JavaScript
606 lines
24 KiB
JavaScript
function zeroPad(num, places) {
|
|
let zero = places - num.toString().length + 1;
|
|
return Array(+(zero > 0 && zero)).join("0") + num;
|
|
}
|
|
|
|
const preloadImage = src =>
|
|
new Promise((resolve, reject) => {
|
|
const image = new Image()
|
|
image.onload = resolve
|
|
image.onerror = reject
|
|
image.src = src
|
|
})
|
|
|
|
function generateElements(html) {
|
|
const template = document.createElement('template');
|
|
template.innerHTML = html.trim();
|
|
return template.content.children[0];
|
|
}
|
|
|
|
function isSlideShow(num){
|
|
return database["subbg"].filter(x => x.value == num)[0]["multi"] ?? false;
|
|
}
|
|
|
|
function isScroll(num){ //238-255 200-213
|
|
if((num >= 238 && num <= 255 )|| (num>=200 && num <=213)){
|
|
return true;
|
|
}else{
|
|
return false;
|
|
}
|
|
}
|
|
|
|
function isVideo(num){
|
|
return database["subbg"].filter(x => x.value == num)[0]["video"] ?? false;
|
|
}
|
|
|
|
|
|
let nemsys_selector = document.querySelector('#nemsys_select');
|
|
nemsys_selector.addEventListener('change', ()=>{
|
|
let preview = document.querySelector('#nemsys_pre');
|
|
let preview_fade = document.querySelector('#nemsys_pre_fade');
|
|
let value = nemsys_selector.value;
|
|
preview.classList.toggle('fade');
|
|
preview_fade.setAttribute("src", "static/asset/nemsys/nemsys_" + zeroPad(value, 4) + ".png");
|
|
preview_fade.classList.toggle('fade');
|
|
setTimeout(()=>{
|
|
preview.setAttribute("src", "static/asset/nemsys/nemsys_" + zeroPad(value, 4) + ".png");
|
|
preview.classList.toggle('fade');
|
|
preview_fade.classList.toggle('fade');
|
|
|
|
},500);
|
|
});
|
|
|
|
document.querySelector('#nemsys_pre').addEventListener('mousemove', (e)=>{
|
|
let x = e.layerX;
|
|
let y = e.layerY;
|
|
let preview = document.querySelector('#nemsys_pre');
|
|
let width = preview.clientWidth;
|
|
let height = preview.clientHeight;
|
|
|
|
let yRot = 10 * ((x - width / 2) / width);
|
|
let xRot = -10 * ((y - height / 2) / height);
|
|
|
|
let string = 'perspective(500px) scale(1) rotateX(' + xRot + 'deg) rotateY(' + yRot + 'deg)'
|
|
preview.style.transform = string;
|
|
preview.style.transition = 'transform 0s';
|
|
});
|
|
|
|
document.querySelector('#nemsys_pre').addEventListener('mouseout', (e)=>{
|
|
let preview = document.querySelector('#nemsys_pre');
|
|
let string = 'perspective(500px) scale(1) rotateX(0) rotateY(0)'
|
|
preview.style.transform = string;
|
|
preview.style.transition = 'transform 0.5s';
|
|
});
|
|
|
|
let subbg_select = document.querySelector('[name="subbg"]');
|
|
let interval;
|
|
let cnt = 1;
|
|
subbg_select.addEventListener('change', ()=>{
|
|
let preview = document.querySelector('#sub_pre');
|
|
let preview_fade = document.querySelector('#sub_pre_fade');
|
|
let value = subbg_select.value;
|
|
preview.classList.toggle('fade');
|
|
if(isSlideShow(value)){
|
|
preview_fade.setAttribute("src", "static/asset/submonitor_bg/subbg_" + zeroPad(value, 4) + "_01.png");
|
|
}else{
|
|
preview_fade.setAttribute("src", "static/asset/submonitor_bg/subbg_" + zeroPad(value, 4) + ".png");
|
|
}
|
|
preview_fade.classList.toggle('fade');
|
|
clearInterval(interval);
|
|
cnt = 1;
|
|
|
|
setTimeout(()=>{
|
|
preview.classList.toggle('fade');
|
|
preview_fade.classList.toggle('fade');
|
|
if(isSlideShow(value)){
|
|
preview.setAttribute("src", "static/asset/submonitor_bg/subbg_" + zeroPad(value, 4) + "_01.png");
|
|
}else{
|
|
preview.setAttribute("src", "static/asset/submonitor_bg/subbg_" + zeroPad(value, 4) + ".png");
|
|
}
|
|
},500);
|
|
|
|
if(isSlideShow(value)){
|
|
interval = setInterval(()=>{
|
|
if(cnt == 1){
|
|
preview.classList.toggle('fade');
|
|
preview_fade.setAttribute("src", "static/asset/submonitor_bg/subbg_" + zeroPad(value, 4) + "_02.png");
|
|
preview_fade.classList.toggle('fade');
|
|
setTimeout(()=>{
|
|
preview.classList.toggle('fade');
|
|
preview_fade.classList.toggle('fade');
|
|
preview.setAttribute("src", "static/asset/submonitor_bg/subbg_" + zeroPad(value, 4) + "_02.png");
|
|
},500);
|
|
cnt = 2;
|
|
}else if(cnt == 2){
|
|
preview.classList.toggle('fade');
|
|
preview_fade.setAttribute("src", "static/asset/submonitor_bg/subbg_" + zeroPad(value, 4) + "_03.png");
|
|
preview_fade.classList.toggle('fade');
|
|
setTimeout(()=>{
|
|
preview.setAttribute("src", "static/asset/submonitor_bg/subbg_" + zeroPad(value, 4) + "_03.png");
|
|
preview.classList.toggle('fade');
|
|
preview_fade.classList.toggle('fade');
|
|
|
|
},500);
|
|
cnt = 3;
|
|
}else{
|
|
preview.classList.toggle('fade');
|
|
preview_fade.setAttribute("src", "static/asset/submonitor_bg/subbg_" + zeroPad(value, 4) + "_01.png");
|
|
preview_fade.classList.toggle('fade');
|
|
setTimeout(()=>{
|
|
preview.setAttribute("src", "static/asset/submonitor_bg/subbg_" + zeroPad(value, 4) + "_01.png");
|
|
preview.classList.toggle('fade');
|
|
preview_fade.classList.toggle('fade');
|
|
},500);
|
|
cnt = 1;
|
|
}
|
|
}, 1000);
|
|
}else if(isVideo(value)){
|
|
preview.setAttribute("style", "display: none;")
|
|
preview_fade.setAttribute("style", "display: none;")
|
|
let video = document.querySelector('#sub_video_pre');
|
|
video.setAttribute("style", "display: block;")
|
|
video.setAttribute("src", "static/asset/submonitor_bg/subbg_" + zeroPad(value, 4) + ".mp4");
|
|
video.setAttribute("autoplay", "");
|
|
video.setAttribute("loop", "");
|
|
}else{
|
|
clearInterval(interval);
|
|
let video = document.querySelector('#sub_video_pre');
|
|
video.setAttribute("style", "display: none;")
|
|
video.pause();
|
|
preview.setAttribute("style", "")
|
|
preview_fade.setAttribute("style", "")
|
|
}
|
|
});
|
|
|
|
let audioContext = new AudioContext();
|
|
let play = audioContext.createBufferSource();
|
|
let gain = audioContext.createGain();
|
|
|
|
play.connect(gain);
|
|
gain.connect(audioContext.destination);
|
|
gain.gain.value = 0.5;
|
|
|
|
|
|
$('[name="bgm"]').change(function() {
|
|
// $('#custom_0').attr("src", "static/asset/audio/custom_" + zeroPad($('[name="bgm"]').val(), 2) + "/0.mp3");
|
|
$('#custom_1').attr("src", "static/asset/audio/custom_" + zeroPad($('[name="bgm"]').val(), 2) + "/1.mp3");
|
|
if ($('[name="bgm"]').val() == 99) {
|
|
// $('#custom_0').attr("src", "static/asset/audio/special_00/0.m4a");
|
|
$('#custom_1').attr("src", "static/asset/audio/custom_00/1.m4a");
|
|
}
|
|
// $('#custom_0').prop("volume", 0.5);
|
|
$('#custom_1').prop("volume", 0.2);
|
|
|
|
$('#play_sel').animate({ 'opacity': 0 }, 200, function() {
|
|
$(this).text('Play').animate({ 'opacity': 1 }, 200);
|
|
});
|
|
play_sel = false;
|
|
if(play.state == "running"){
|
|
play.stop();
|
|
}
|
|
fetch("static/asset/audio/custom_" + zeroPad($('[name="bgm"]').val(), 2) + (typeof database["bgm"][$('[name="bgm"]').val()].file === 'undefined' ? "/0.mp3":database["bgm"][$('[name="bgm"]').val()].file))
|
|
.then(res => res.arrayBuffer())
|
|
.then(arrayBuffer => audioContext.decodeAudioData(arrayBuffer))
|
|
.then(audioBuffer => {
|
|
play.buffer = null;
|
|
play = audioContext.createBufferSource();
|
|
gain = audioContext.createGain();
|
|
play.connect(gain);
|
|
gain.connect(audioContext.destination);
|
|
gain.gain.value = 0.2;
|
|
play.buffer = audioBuffer;
|
|
play.loop = true;
|
|
// play.loopStart = 1.2;
|
|
// play.loopEnd = 22.7;
|
|
play.loopStart = database["bgm"][$('[name="bgm"]').val()].loopStart ?? 0;
|
|
play.loopEnd = database["bgm"][$('[name="bgm"]').val()].loopEnd ?? 30;
|
|
$('#play_bgm').prop("disabled", false);
|
|
});
|
|
//disable play button
|
|
$('#play_bgm').prop("disabled", true);
|
|
$('#play_bgm').animate({ 'opacity': 0 }, 200, function() {
|
|
$(this).text('Play').animate({ 'opacity': 1 }, 200);
|
|
});
|
|
audioContext.suspend()
|
|
|
|
play_bgm = false;
|
|
first = true;
|
|
});
|
|
|
|
let testcurrent = 2.8;
|
|
|
|
async function test(){
|
|
let audioContext = new AudioContext();
|
|
let play = audioContext.createBufferSource();
|
|
let gain = audioContext.createGain();
|
|
|
|
play.connect(gain);
|
|
gain.connect(audioContext.destination);
|
|
gain.gain.value = 0.5;
|
|
|
|
let res = await fetch("static/asset/audio/custom_23/0.mp3");
|
|
let arrayBuffer = await res.arrayBuffer();
|
|
let audioBuffer = await audioContext.decodeAudioData(arrayBuffer);
|
|
play.buffer = audioBuffer;
|
|
play.loop = true;
|
|
play.loopStart = 4.6;
|
|
play.loopEnd = 20;
|
|
play.start(audioContext.currentTime, 0);
|
|
}
|
|
|
|
|
|
$('[name="stampA"]').change(function() {
|
|
$('#a_pre').fadeOut(200, () => {
|
|
let stamp = $('[name="stampA"]').val();
|
|
if (stamp == 0) {
|
|
$('#a_pre').attr("src", "static/asset/nostamp.png");
|
|
} else {
|
|
let group = Math.trunc((stamp - 1) / 4 + 1);
|
|
let item = stamp % 4;
|
|
if (item == 0) item = 4;
|
|
$('#a_pre').attr("src", "static/asset/chat_stamp/stamp_" + zeroPad(group, 4) + "/stamp_" + zeroPad(group, 4) + "_" + zeroPad(item, 2) + ".png");
|
|
}
|
|
});
|
|
$('#a_pre').fadeIn(200);
|
|
});
|
|
|
|
|
|
|
|
$('[name="stampB"]').change(function() {
|
|
$('#b_pre').fadeOut(200, () => {
|
|
let stamp = $('[name="stampB"]').val();
|
|
if (stamp == 0) {
|
|
$('#b_pre').attr("src", "static/asset/nostamp.png");
|
|
} else {
|
|
let group = Math.trunc((stamp - 1) / 4 + 1);
|
|
let item = stamp % 4;
|
|
if (item == 0) item = 4;
|
|
$('#b_pre').attr("src", "static/asset/chat_stamp/stamp_" + zeroPad(group, 4) + "/stamp_" + zeroPad(group, 4) + "_" + zeroPad(item, 2) + ".png");
|
|
}
|
|
});
|
|
$('#b_pre').fadeIn(200);
|
|
});
|
|
|
|
$('[name="stampC"]').change(function() {
|
|
$('#c_pre').fadeOut(200, () => {
|
|
let stamp = $('[name="stampC"]').val();
|
|
if (stamp == 0) {
|
|
$('#c_pre').attr("src", "static/asset/nostamp.png");
|
|
} else {
|
|
let group = Math.trunc((stamp - 1) / 4 + 1);
|
|
let item = stamp % 4;
|
|
if (item == 0) item = 4;
|
|
$('#c_pre').attr("src", "static/asset/chat_stamp/stamp_" + zeroPad(group, 4) + "/stamp_" + zeroPad(group, 4) + "_" + zeroPad(item, 2) + ".png");
|
|
}
|
|
});
|
|
$('#c_pre').fadeIn(200);
|
|
});
|
|
|
|
$('[name="stampD"]').change(function() {
|
|
$('#d_pre').fadeOut(200, () => {
|
|
let stamp = $('[name="stampD"]').val();
|
|
if (stamp == 0) {
|
|
$('#d_pre').attr("src", "static/asset/nostamp.png");
|
|
} else {
|
|
let group = Math.trunc((stamp - 1) / 4 + 1);
|
|
let item = stamp % 4;
|
|
if (item == 0) item = 4;
|
|
$('#d_pre').attr("src", "static/asset/chat_stamp/stamp_" + zeroPad(group, 4) + "/stamp_" + zeroPad(group, 4) + "_" + zeroPad(item, 2) + ".png");
|
|
}
|
|
});
|
|
$('#d_pre').fadeIn(200);
|
|
});
|
|
|
|
$('[name="stampA_R"]').change(function() {
|
|
$('#ar_pre').fadeOut(200, () => {
|
|
let stamp = $('[name="stampA_R"]').val();
|
|
if (stamp == 0) {
|
|
$('#ar_pre').attr("src", "static/asset/nostamp.png");
|
|
} else {
|
|
let group = Math.trunc((stamp - 1) / 4 + 1);
|
|
let item = stamp % 4;
|
|
if (item == 0) item = 4;
|
|
$('#ar_pre').attr("src", "static/asset/chat_stamp/stamp_" + zeroPad(group, 4) + "/stamp_" + zeroPad(group, 4) + "_" + zeroPad(item, 2) + ".png");
|
|
}
|
|
});
|
|
$('#ar_pre').fadeIn(200);
|
|
});
|
|
|
|
$('[name="stampB_R"]').change(function() {
|
|
$('#br_pre').fadeOut(200, () => {
|
|
let stamp = $('[name="stampB_R"]').val();
|
|
if (stamp == 0) {
|
|
$('#br_pre').attr("src", "static/asset/nostamp.png");
|
|
} else {
|
|
let group = Math.trunc((stamp - 1) / 4 + 1);
|
|
let item = stamp % 4;
|
|
if (item == 0) item = 4;
|
|
$('#br_pre').attr("src", "static/asset/chat_stamp/stamp_" + zeroPad(group, 4) + "/stamp_" + zeroPad(group, 4) + "_" + zeroPad(item, 2) + ".png");
|
|
}
|
|
});
|
|
$('#br_pre').fadeIn(200);
|
|
});
|
|
|
|
$('[name="stampC_R"]').change(function() {
|
|
$('#cr_pre').fadeOut(200, () => {
|
|
let stamp = $('[name="stampC_R"]').val();
|
|
if (stamp == 0) {
|
|
$('#cr_pre').attr("src", "static/asset/nostamp.png");
|
|
} else {
|
|
let group = Math.trunc((stamp - 1) / 4 + 1);
|
|
let item = stamp % 4;
|
|
if (item == 0) item = 4;
|
|
$('#cr_pre').attr("src", "static/asset/chat_stamp/stamp_" + zeroPad(group, 4) + "/stamp_" + zeroPad(group, 4) + "_" + zeroPad(item, 2) + ".png");
|
|
}
|
|
});
|
|
$('#cr_pre').fadeIn(200);
|
|
});
|
|
|
|
$('[name="stampD_R"]').change(function() {
|
|
$('#dr_pre').fadeOut(200, () => {
|
|
let stamp = $('[name="stampD_R"]').val();
|
|
if (stamp == 0) {
|
|
$('#dr_pre').attr("src", "static/asset/nostamp.png");
|
|
} else {
|
|
let group = Math.trunc((stamp - 1) / 4 + 1);
|
|
let item = stamp % 4;
|
|
if (item == 0) item = 4;
|
|
$('#dr_pre').attr("src", "static/asset/chat_stamp/stamp_" + zeroPad(group, 4) + "/stamp_" + zeroPad(group, 4) + "_" + zeroPad(item, 2) + ".png");
|
|
}
|
|
});
|
|
$('#dr_pre').fadeIn(200);
|
|
});
|
|
|
|
let disable_bg = false;
|
|
|
|
$('[name="mainbg"]').change(function() {
|
|
let filestr = ""
|
|
disable_bg = false;
|
|
let bg_color = document.querySelector('.card').style["background-color"]
|
|
document.querySelector('.card').style["background-color"] = bg_color.length == 9 ? bg_color.substring(0, bg_color.length - 2) + "99" : bg_color;
|
|
switch($('[name="mainbg"]').val()){
|
|
case "0":
|
|
filestr = ""
|
|
disable_bg = true;
|
|
document.querySelector('.card').style["background-color"] = bg_color.length == 9 ? bg_color.substring(0, bg_color.length - 2) : bg_color;
|
|
break;
|
|
case "1":
|
|
filestr = "booth"
|
|
break;
|
|
case "2":
|
|
filestr = "ii"
|
|
break;
|
|
case "3":
|
|
filestr = "iii"
|
|
break;
|
|
}
|
|
|
|
let video = document.querySelector('#mainbg_video_pre');
|
|
// video.setAttribute("style", "")
|
|
video.setAttribute("src", 'static/asset/video/'+filestr+'.mp4');
|
|
video.setAttribute("autoplay", "");
|
|
video.setAttribute("loop", "");
|
|
});
|
|
|
|
|
|
// $('#custom_0').on('ended', function() {
|
|
// $('#custom_0').currentTime = 0;
|
|
// $('#play_bgm').animate({ 'opacity': 0 }, 200, function() {
|
|
// $(this).text('Play').animate({ 'opacity': 1 }, 200);
|
|
// });
|
|
|
|
// play_bgm = false;
|
|
// });
|
|
|
|
$('#custom_1').on('ended', function() {
|
|
$('#custom_1').currentTime = 0;
|
|
$('#play_sel').animate({ 'opacity': 0 }, 200, function() {
|
|
$(this).text('Play').animate({ 'opacity': 1 }, 200);
|
|
});
|
|
play_sel = false;
|
|
});
|
|
|
|
let profile_data, database;
|
|
let play_bgm = false;
|
|
let play_sel = false;
|
|
let first = true;
|
|
|
|
let bg_opacity = false;
|
|
|
|
const getPreferredScheme = () => window?.matchMedia?.('(prefers-color-scheme:dark)')?.matches ? 'dark' : 'light';
|
|
|
|
window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', event => {
|
|
const newColorScheme = event.matches ? "true" : "false";
|
|
document.querySelector('.card').style["background-color"] = newColorScheme ? "#0a0a0a99" : "#ffffff99";
|
|
});
|
|
|
|
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
profile_data = JSON.parse(document.getElementById("data-pass").innerText);
|
|
let colorScheme = getPreferredScheme() === 'dark';
|
|
document.querySelector('.card').style["background-color"] = colorScheme ? "#0a0a0a99" : "#ffffff99";
|
|
fetch("static/asset/json/data.json")
|
|
.then(res => {return res.json()})
|
|
.then(json => {
|
|
database = json;
|
|
|
|
let nemsys = document.querySelector('#nemsys_select');
|
|
let nemsys_option = ""
|
|
json["nemsys"].forEach(x => {
|
|
nemsys_option += `<option value="${x.value}">${x.name}</option>`;
|
|
});
|
|
nemsys.innerHTML = nemsys_option;
|
|
nemsys.value = profile_data["nemsys"];
|
|
nemsys.dispatchEvent(new Event('change'));
|
|
|
|
let subbg = document.querySelector('[name="subbg"]');
|
|
let subbg_option = ""
|
|
json["subbg"].forEach(x => {
|
|
subbg_option += `<option value="${x.value}">${x.name}</option>`;
|
|
});
|
|
subbg.innerHTML = subbg_option;
|
|
subbg.value = profile_data["subbg"];
|
|
subbg.dispatchEvent(new Event('change'));
|
|
|
|
let bgm = document.querySelector('[name="bgm"]');
|
|
let bgm_option = ""
|
|
json["bgm"].forEach(x => {
|
|
bgm_option += `<option value="${x.value}">${x.name}</option>`;
|
|
});
|
|
bgm.innerHTML = bgm_option;
|
|
bgm.value = profile_data["bgm"];
|
|
bgm.dispatchEvent(new Event('change'));
|
|
|
|
let akaname = document.querySelector('[name="akaname"]');
|
|
let akaname_option = ""
|
|
json["akaname"].forEach(x => {
|
|
akaname_option += `<option value="${x.value}">${x.name}</option>`;
|
|
});
|
|
akaname.innerHTML = akaname_option;
|
|
akaname.value = profile_data["akaname"];
|
|
akaname.dispatchEvent(new Event('change'));
|
|
|
|
let appeal_frame = document.querySelector('[name="appeal_frame"]');
|
|
appeal_frame.value = profile_data["appeal_frame"];
|
|
|
|
let support_team = document.querySelector('[name="support_team"]');
|
|
support_team.value = profile_data["support_team"];
|
|
|
|
let stampA = document.querySelector('[name="stampA"]');
|
|
let stampB = document.querySelector('[name="stampB"]');
|
|
let stampC = document.querySelector('[name="stampC"]');
|
|
let stampD = document.querySelector('[name="stampD"]');
|
|
let stampA_R = document.querySelector('[name="stampA_R"]');
|
|
let stampB_R = document.querySelector('[name="stampB_R"]');
|
|
let stampC_R = document.querySelector('[name="stampC_R"]');
|
|
let stampD_R = document.querySelector('[name="stampD_R"]');
|
|
|
|
let stampOptions = "";
|
|
json["stamp"].forEach(x => {
|
|
stampOptions += `<option value="${x.value}">${x.name}</option>`;
|
|
});
|
|
stampA.innerHTML = stampOptions;
|
|
stampB.innerHTML = stampOptions;
|
|
stampC.innerHTML = stampOptions;
|
|
stampD.innerHTML = stampOptions;
|
|
stampA_R.innerHTML = stampOptions;
|
|
stampB_R.innerHTML = stampOptions;
|
|
stampC_R.innerHTML = stampOptions;
|
|
stampD_R.innerHTML = stampOptions;
|
|
stampA.value = profile_data["stampA"];
|
|
stampB.value = profile_data["stampB"];
|
|
stampC.value = profile_data["stampC"];
|
|
stampD.value = profile_data["stampD"];
|
|
stampA_R.value = profile_data["stampA_R"];
|
|
stampB_R.value = profile_data["stampB_R"];
|
|
stampC_R.value = profile_data["stampC_R"];
|
|
stampD_R.value = profile_data["stampD_R"];
|
|
stampA.dispatchEvent(new Event('change'));
|
|
stampB.dispatchEvent(new Event('change'));
|
|
stampC.dispatchEvent(new Event('change'));
|
|
stampD.dispatchEvent(new Event('change'));
|
|
stampA_R.dispatchEvent(new Event('change'));
|
|
stampB_R.dispatchEvent(new Event('change'));
|
|
stampC_R.dispatchEvent(new Event('change'));
|
|
stampD_R.dispatchEvent(new Event('change'));
|
|
|
|
let mainbg = document.querySelector('[name="mainbg"]');
|
|
let mainbg_option = ""
|
|
|
|
json["mainbg"].forEach(x => {
|
|
mainbg_option += `<option value="${x.value}">${x.name}</option>`;
|
|
});
|
|
mainbg.innerHTML = mainbg_option;
|
|
mainbg.value = profile_data["mainbg"];
|
|
mainbg.dispatchEvent(new Event('change'));
|
|
|
|
setTimeout(()=>{
|
|
document.querySelector('#mainbg_video_pre').play();
|
|
}, 500)
|
|
|
|
document.querySelector('html.has-aside-left.has-aside-mobile-transition.has-navbar-fixed-top.has-aside-expanded body div#app div#main-content.content div.simplebar-wrapper div.simplebar-mask div.simplebar-offset div.simplebar-content-wrapper div.simplebar-content')
|
|
.style["overflow-y"] = "auto";
|
|
// document.querySelector('.uiblocker').style.display = 'none';
|
|
document.querySelector('.uiblocker').classList.toggle('fade');
|
|
});
|
|
|
|
// let custom_0 = document.querySelector('#custom_0');
|
|
let custom_1 = document.querySelector('#custom_1');
|
|
|
|
// custom_0.volume = 0.5;
|
|
custom_1.volume = 0.2;
|
|
|
|
let play_bgm_button = generateElements('<button class="button is-primary" type="button" id="play_bgm"><button>');
|
|
play_bgm_button.append("Play");
|
|
play_bgm_button.addEventListener('click', function() {
|
|
if (play_bgm) {
|
|
// custom_0.pause();
|
|
audioContext.suspend();
|
|
play_bgm_button.innerHTML = "Play";
|
|
} else {
|
|
// custom_0.play();
|
|
if(first){
|
|
play.start()
|
|
first = false
|
|
}
|
|
audioContext.resume()
|
|
play_bgm_button.innerHTML = "Stop";
|
|
}
|
|
play_bgm = !play_bgm;
|
|
});
|
|
|
|
let play_bgm_outer_div = generateElements('<div class="buttons" style="border-top:2px solid #333333;padding-top: 10px; margin-right: 20px;"></div>');
|
|
play_bgm_outer_div.append(play_bgm_button);
|
|
document.querySelector('#bgm_pre').append(play_bgm_outer_div);
|
|
|
|
let play_sel_button = generateElements('<button class="button is-primary" type="button" id="play_sel"><button>');
|
|
play_sel_button.append("Play");
|
|
play_sel_button.addEventListener('click', function() {
|
|
if (play_sel) {
|
|
custom_1.pause();
|
|
play_sel_button.innerHTML = "Play";
|
|
} else {
|
|
custom_1.play();
|
|
play_sel_button.innerHTML = "Stop";
|
|
}
|
|
play_sel = !play_sel;
|
|
});
|
|
|
|
let play_sel_outer_div = generateElements('<div class="buttons" style="border-top:2px solid #333333;padding-top: 10px; margin-right: 20px;"></div>');
|
|
play_sel_outer_div.append(play_sel_button);
|
|
document.querySelector('#sel_pre').append(play_sel_outer_div);
|
|
|
|
|
|
let play_bg_button = generateElements('<button class="button is-primary" type="button" id="play_bg"><button>');
|
|
play_bg_button.append("BG SHOW");
|
|
play_bg_button.addEventListener('click', function() {
|
|
if(!disable_bg){
|
|
let video = document.querySelector('#mainbg_video_pre');
|
|
video.play();
|
|
|
|
let card = document.querySelector('.card');
|
|
card.style["opacity"] = "0";
|
|
card.style["transition"] = "opacity 0.5s";
|
|
|
|
let bg_ui_blocker = generateElements('<div id="bguiblocker" style="position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: #000000; opacity: 0; z-index: 9999;"></div>');
|
|
document.querySelector('body').append(bg_ui_blocker);
|
|
document.querySelector('#bguiblocker').addEventListener('click', ()=>{
|
|
let card = document.querySelector('.card');
|
|
card.style["opacity"] = "1";
|
|
document.querySelector('#bguiblocker').remove();
|
|
});
|
|
}
|
|
});
|
|
|
|
let play_bg_outer_div = generateElements('<div class="buttons" style="border-top:2px solid #333333;padding-top: 10px; margin-right: 20px;"></div>');
|
|
play_bg_outer_div.append(play_bg_button);
|
|
document.querySelector('#mainbg_pre').append(play_bg_outer_div);
|
|
|
|
})
|
|
|
|
document.querySelector('#mainbg_video_pre').addEventListener('click', ()=>{
|
|
let card = document.querySelector('.card');
|
|
card.style["opacity"] = "1";
|
|
});
|
|
|