<!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"> SigPlace <form method="post" action="./SUBMITFILE" enctype="multipart/form-data"> <input type="file" name="file1"/> <input type="submit"/> </form> </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=uploadform.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)=>{ document.getElementById("msg").value="" document.getElementById("name").value="" document.getElementById("submit").disabled= document.getElementById("name").disabled= document.getElementById("col").disabled= document.getElementById("msg").disabled=false; fetchComments() }) } </script> <div id="commentForm"> <b>Leave a comment!</b><br/><br/> <label for="name">Display Name: </label><input id="name"></input><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" 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=uploadform.html.comment").then((data)=>data.text()) .then((data)=>{ data=data.split("\n"); document.getElementById("comments").innerHTML=""; document.getElementById("commentCounter").innerText=data[0] for (var i=data.length-3;i>=1;i-=2) { if (data[i].trim().length>0&&data[i+1].trim().length>0) { document.getElementById("comments").innerHTML+="<div id=\"msg"+((i+1)/2)+"\" class=\"commentDisplayer\"><div class=\"commentData\">"+decodeURIComponent(data[i])+"</div><br>" data2=data[i+1].split(";"); document.getElementById("msg"+((i+1)/2)).style.borderColor=data2[1] document.getElementById("comments").innerHTML+="<div class=\"commentInfo\"><sup>- "+decodeURIComponent(data2[0])+"</sup></div></div><br>" } } document.getElementById("commentContainer").style.visibility="visible" }) } fetchComments() changeColor() </script>