40 lines
1.2 KiB
JavaScript
40 lines
1.2 KiB
JavaScript
// Grab ?id=XXX
|
|
const params=new URLSearchParams(window.location.search);
|
|
const id=params.get('id');
|
|
const container=document.getElementById('project');
|
|
|
|
if(!id){
|
|
container.textContent='No project id 🙃';
|
|
throw new Error('Missing id param');
|
|
}
|
|
|
|
fetch('projects/projects.json')
|
|
.then(r=>r.json())
|
|
.then(list=>{
|
|
const proj=list.find(p=>p.id===id);
|
|
if(!proj) throw new Error('Unknown project');
|
|
|
|
container.innerHTML=`
|
|
<h1 style="text-transform:uppercase;margin-bottom:1rem">${proj.title}</h1>
|
|
<iframe src="${proj.embed}" allowfullscreen style="width:100%;height:56vw;max-height:70vh;border:0;border-radius:4px"></iframe>
|
|
<section style="margin-top:2rem" id="info"></section>
|
|
<section style="margin-top:2rem" id="credits"></section>
|
|
`;
|
|
|
|
// Pull in optional text files
|
|
['info','credits'].forEach(key=>{
|
|
if(!proj[key]) return;
|
|
fetch(proj[key])
|
|
.then(r=>r.text())
|
|
.then(txt=>{
|
|
document.getElementById(key).innerHTML=
|
|
`<h2 style="text-transform:uppercase;margin-bottom:.5em">${key}</h2>
|
|
<p>${txt.replace(/\n/g,'<br>')}</p>`;
|
|
});
|
|
});
|
|
})
|
|
.catch(err=>{
|
|
console.error(err);
|
|
container.innerHTML='<p>Project not found.</p>';
|
|
});
|