141 lines
3.6 KiB
JavaScript
141 lines
3.6 KiB
JavaScript
export async function loadEvents(){
|
|
let eventList = document.querySelectorAll('#eventSection > article');
|
|
//console.log("event list: ", eventList);
|
|
|
|
for (let event of eventList){
|
|
let title = event.querySelector('h4');
|
|
let date = event.querySelector('p.date');
|
|
let posterLink = event.querySelector('a.iconBtnStyle').href;
|
|
let posterHTML = await getPoster(posterLink);
|
|
|
|
let poster = posterHTML.querySelector('body > article');
|
|
|
|
let posterStyle = posterHTML.querySelectorAll('head > style:not([data-import="no-import"])')
|
|
|
|
console.log('entry data :', title, date, poster, posterStyle);
|
|
|
|
let selectedEntry = createEntry(title, date, poster, posterStyle)
|
|
|
|
console.log('created new details :', selectedEntry);
|
|
|
|
event.replaceChildren(selectedEntry);
|
|
}
|
|
|
|
/* let btnList = document.querySelectorAll('.eventEntry > .iconBtnStyle');
|
|
|
|
//console.log("source buttons : ", btnList)
|
|
|
|
let displayWindow = document.querySelector('#posterWindow');
|
|
|
|
let displayContainer = document.querySelector('#posterContainer');
|
|
|
|
let closeBtn = document.querySelector('#posterCloseBtn');
|
|
|
|
closeBtn.addEventListener('mousedown', () => {
|
|
displayWindow.style.visibility = 'collapse';
|
|
displayContainer.replaceChildren();
|
|
})
|
|
|
|
closeBtn.addEventListener('touchstart', () => {
|
|
displayWindow.style.visibility = 'collapse';
|
|
displayContainer.replaceChildren();
|
|
})
|
|
|
|
async function getPoster(src){
|
|
let res = await fetch(src);
|
|
if (res.ok){
|
|
let html_text = await res.text()
|
|
let html = new DOMParser().parseFromString(html_text, "text/html");
|
|
return html
|
|
} else{
|
|
console.log('error 333');
|
|
return
|
|
}
|
|
}
|
|
|
|
let eventList = [];
|
|
|
|
if( btnList.length > 0 ){
|
|
for (let btn of btnList ){
|
|
let link = btn.children[0];
|
|
link.style.pointerEvents = 'none';
|
|
|
|
//console.log(link.href);
|
|
|
|
let posterPage = await getPoster(link.href);
|
|
|
|
//console.log('selected poster: ', posterPage)
|
|
|
|
let titleData = posterPage.querySelector('title');
|
|
//console.log(titleData);
|
|
|
|
let styleList = Array.from(posterPage.querySelectorAll('head > style'));
|
|
//console.log(styleList)
|
|
|
|
styleList.splice(0,1);
|
|
//console.log(styleList)
|
|
|
|
eventList.push(
|
|
{
|
|
content: posterPage.querySelector('main'),
|
|
title: titleData.innerText,
|
|
stylesheet: styleList,
|
|
sourceBtn: btn
|
|
}
|
|
);
|
|
}
|
|
}
|
|
|
|
//console.log("event list : ", eventList);
|
|
|
|
if (eventList.length > 0){
|
|
|
|
eventList.forEach( (obj) =>{
|
|
let btn = obj.sourceBtn;
|
|
let content = obj.content;
|
|
let title = obj.title;
|
|
for (let style of obj.stylesheet){
|
|
document.head.append(style);
|
|
}
|
|
btn.addEventListener( 'click', () => {
|
|
//console.log("selection :", content)
|
|
displayWindow.style.visibility = 'visible';
|
|
let targetTitle = displayWindow.querySelector('h4');
|
|
targetTitle.innerText = title;
|
|
displayContainer.replaceChildren(content);
|
|
})
|
|
})
|
|
} */
|
|
}
|
|
|
|
async function getPoster(link){
|
|
let res = await fetch(link);
|
|
if (res.ok){
|
|
let html_text = await res.text()
|
|
let html = new DOMParser().parseFromString(html_text, "text/html");
|
|
return html
|
|
} else{
|
|
console.log('error 333');
|
|
return
|
|
}
|
|
|
|
}
|
|
|
|
function createEntry(title, date, html, style){
|
|
let newEntry = document.createElement('details');
|
|
let newSummary = document.createElement('summary');
|
|
newSummary.append(title, date);
|
|
|
|
newEntry.append(newSummary);
|
|
|
|
newEntry.append(html);
|
|
|
|
newEntry.name = "eventList"
|
|
|
|
for(let el of style){
|
|
document.head.append(el);
|
|
}
|
|
|
|
return newEntry
|
|
}
|