<!DOCTYPE html>
< html >
< head >
< link rel = "stylesheet" type = "text/css" href = "/reset.css" >
< link rel = "stylesheet" type = "text/css" href = "/sig.css" >
< meta charset = "UTF-8" >
< script type = "text/javascript" >
function loadCodeBackground() {
fetch("/codeBackground").then((data)=>data.text())
.then((data)=>{
document.getElementById("codeForeground").innerText=data
document.getElementById("codeBackground").innerText=data
})
}
loadCodeBackground();
< / script >
< / head >
< body >
< div class = "contentBody" >
This is a different webpage.< hr >
$ARTICLE_PREVIEW sigplace1
$ARTICLE_PREVIEW test articles/test1
$ARTICLE_PREVIEW test articles/test2
$ARTICLE_PREVIEW test articles/test3
$ARTICLE_PREVIEW curabitur vel tempus ex
< / div > <!-- End Content Body -->
< div class = "codeForeground" id = "codeForeground" > < / div >
< div class = "codeBackground" id = "codeBackground" > < / div >
< / body >
< footer >
< / footer >
< / html >
< hr / >
< script type = "text/javascript" >
function changeColor() {
document.getElementById("submit").style.borderColor=document.getElementById("msg").style.borderColor=document.getElementById("name").style.borderColor=document.getElementById("col").style.borderColor=document.getElementById("col").options[document.getElementById("col").selectedIndex].text
}
function submit() {
document.getElementById("submit").disabled=
document.getElementById("name").disabled=
document.getElementById("col").disabled=
document.getElementById("msg").disabled=true;
fetch("/COMMENTS?submit=true& article=otherpage.html.comment& message="+encodeURIComponent(document.getElementById("msg").value)+"& name="
+encodeURIComponent(document.getElementById("name").value)+"& color="+
+encodeURIComponent(document.getElementById("col").options[document.getElementById("col").selectedIndex].text)
).then((data)=>data.text())
.then((data)=>{
fetchComments()
})
}
< / script >
< div id = "commentForm" >
< b > Leave a comment!< / b > < br / > < br / >
< label for = "name" > Display Name: < / label > < input id = "name" > < br / > < br / >
< label for = "col" > Display Color: < / label > < select id = "col" onchange = "changeColor()" >
< option value = "RED" > RED< / option >
< option value = "GREEN" selected > GREEN< / option >
< option value = "YELLOW" > YELLOW< / option >
< option value = "BLUE" > BLUE< / option >
< option value = "MAGENTA" > MAGENTA< / option >
< option value = "CYAN" > CYAN< / option >
< option value = "WHITE" > WHITE< / option >
< / select > < br / > < br / >
< label for = "msg" style = "vertical-align:top;display:inline;" > Message: < / label > < textarea id = "msg" > < / textarea > < br / > < br / >
< button id = "submit" onload = "changeColor()" onclick = "submit()" > POST< / button >
< / div > < br / > < br / >
< div id = "commentContainer" style = "visibility:hidden;" >
< h2 > Comments < sub > (< span class = "commentCounter" id = "commentCounter" > 0< / span > )< / sub > < / h2 >
< div class = "comments" id = "comments" > < / div >
< / div >
< script type = "text/javascript" >
function fetchComments() {
fetch("/COMMENTS?article=otherpage.html.comment").then((data)=>data.text())
.then((data)=>{
data=data.split("\n");
document.getElementById("comments").innerHTML="";
for (var i=0;i< data.length ; i + + ) {
if (i==0) {
document.getElementById("commentCounter").innerText=data[i]
} else {
if (data[i].trim().length>0) {
if (i%2==1) {
document.getElementById("comments").innerHTML+="< div class = \"commentDisplayer\" > < div class = \"commentData\" > "+data[i]+"< / div > < br > "
} else {
document.getElementById("comments").innerHTML+="< div class = \"commentInfo\" > < sup > - "+data[i]+"< / sup > < / div > < / div > < br > "
}
}
}
}
document.getElementById("commentContainer").style.visibility="visible"
})
}
fetchComments()
< / script >
