Commit da072517 authored by mpomery's avatar mpomery

Moving JS out of the archive page

parent 37e4b0f4
......@@ -6,367 +6,14 @@
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>UCC Webcams @ Loading...</title>
<noscript>
<meta http-equiv="refresh" content="0;URL=http://www.ucc.asn.au/cgi-bin/webcam.py">
</noscript>
<link rel="stylesheet" href="http://planet.ucc.asn.au/planet.css" type="text/css" media="screen" />
<link rel="stylesheet" href="http://webcam.ucc.asn.au/webcam-overrides.css" type="text/css" media="screen" />
<link rel="icon" type="image/png" href="http://planet.ucc.asn.au/icon.png" />
<link rel="SHORTCUT ICON" type="image/png" href="http://planet.ucc.asn.au/icon.png" />
<script type="text/javascript">
var d;
var months = new Array ("Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec");
var days = new Array ("Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat");
function windowOnload()
{
// set the initial date from the server
// get an XML HTTP Request object
var req = false;
try
{
req = new XMLHttpRequest ();
}
catch (e)
{
try
{
req = new ActiveXObject ("Microsoft.XMLHTTP");
}
catch (e)
{
}
}
if (req)
{
req.onreadystatechange = function ()
{
if (req.readyState == 4)
{
d = new Date (Date.parse (req.getResponseHeader ("Date")));
if (location.hash.length > 0)
{
d.setTime (location.hash.substring(1, location.hash.length));
}
else
{
d.setMinutes(d.getMinutes() - 1);
}
setupPage();
setDate();
}
};
var timestamp = new Date ();
req.open ("HEAD", "index.html?" + timestamp.getTime (), true);
req.send ("");
}
}
function setDateNow()
{
// get a new date from the server
// get an XML HTTP Request object
var req = false;
try
{
req = new XMLHttpRequest ();
}
catch (e)
{
try
{
req = new ActiveXObject ("Microsoft.XMLHTTP");
}
catch (e)
{
}
}
if (req)
{
req.onreadystatechange = function ()
{
if (req.readyState == 4)
{
d = new Date (Date.parse (req.getResponseHeader ("Date")));
d.setMinutes(d.getMinutes() - 1);
setDate();
alignSelects();
}
};
var timestamp = new Date ();
req.open ("HEAD", "index.html?" + timestamp.getTime (), true);
req.send ("");
}
}
function setupPage()
{
var form;
var i;
document.getElementById("nav-dayname").firstChild.data = days[d.getDay()];
form = document.getElementById("nav-day");
for (i = 0; i < 31; i++)
{
form[i] = new Option(i+1,i+1,(d.getDate() == i+1));
}
form = document.getElementById("nav-month");
for (i = 0; i < 12; i++)
{
form[i] = new Option(months[i],i,(d.getMonth() == i));
}
form = document.getElementById("nav-year");
for (i = 2003; i < d.getFullYear() + 1; i++)
{
form[i-2003] = new Option(i,i,(d.getFullYear() == i));
}
form = document.getElementById("nav-hour");
for (i = 0; i < 24; i++)
{
form[i] = new Option(zPad(i.toString()),i,(d.getHours() == i));
}
form = document.getElementById("nav-minute");
for (i = 0; i < 60; i++)
{
form[i] = new Option(zPad(i.toString()),i,(d.getMinutes() == i));
}
}
function alignSelects()
{
var form;
var i;
form = document.getElementById("nav-day");
for (i = 0; i < 31; i++)
{
if (d.getDate() == i+1)
{
form[i].selected = true;
}
else
{
form[i].selected = false;
}
}
form = document.getElementById("nav-month");
for (i = 0; i < 12; i++)
{
if (d.getMonth() == i)
{
form[i].selected = true;
}
else
{
form[i].selected = false;
}
}
form = document.getElementById("nav-year");
for (i = 2003; i < d.getFullYear() + 1; i++)
{
if (d.getFullYear() == i)
{
form[i-2003].selected = true;
}
else
{
form[i-2003].selected = false;
}
}
form = document.getElementById("nav-hour");
for (i = 0; i < 24; i++)
{
if (d.getHours() == i)
{
form[i].selected = true;
}
else
{
form[i].selected = false;
}
}
form = document.getElementById("nav-minute");
for (i = 0; i < 60; i++)
{
if (d.getMinutes() == i)
{
form[i].selected = true;
}
else
{
form[i].selected = false;
}
}
}
function navDate()
{
d.setDate(document.getElementById("nav-day").value);
d.setMonth(document.getElementById("nav-month").value);
d.setFullYear(document.getElementById("nav-year").value);
d.setHours(document.getElementById("nav-hour").value);
d.setMinutes(document.getElementById("nav-minute").value);
setDate();
}
function zPad(str)
{
if (str.length == 1)
{
str = "0" + str;
}
return str;
}
function setAlt (img, text)
{
var lines = img.alt.split ("\n");
if (lines.length > 0)
{
img.alt = lines[0] + "\n" + text;
}
else
{
img.alt += "\n" + text;
}
}
function updateWebcam (webcamid, webcamurl)
{
var img = document.getElementById (webcamid);
// get an XML HTTP Request object
var req = false;
try
{
req = new XMLHttpRequest ();
}
catch (e)
{
try
{
req = new ActiveXObject ("Microsoft.XMLHTTP");
}
catch (e)
{
}
}
if (req)
{
req.onreadystatechange = function ()
{
if (req.readyState == 4)
{
if (req.status == 200 || req.status == 304)
{
//img.parentNode.style.backgroundColor = "transparent";
img.style.display = 'inline';
//setAlt (img, "");
}
else
{
img.style.display = 'none';
//img.parentNode.style.backgroundColor = "darkred";
//setAlt (img, "(status " + req.status + ")");
}
}
};
req.open ("HEAD", webcamurl, true);
req.send ("");
}
// set the image
img.setAttribute ("src",webcamurl);
}
function setDate()
{
window.location.hash = d.getTime();
//document.getElementById("timeremaining").firstChild.data = "loading...";
var timeString = days[d.getDay()]+" "+d.getDate()+" "+months[d.getMonth()]+" "+d.getFullYear()+", "+zPad(d.getHours().toString())+":"+zPad(d.getMinutes().toString());
document.title = "UCC Webcams @ "+timeString;
document.getElementById("header").firstChild.data = "UCC Webcams @ "+timeString;
document.getElementById("timeindex").firstChild.data = d.getTime();
document.getElementById("timeindex").href = "#"+d.getTime();
document.getElementById("nav-dayname").firstChild.data = days[d.getDay()];
var image = d.getFullYear()+zPad((d.getMonth()+1).toString())+"/"+zPad(d.getDate().toString())+"/"+zPad(d.getHours().toString())+"/"+zPad(d.getMinutes().toString())+".jpg";
updateWebcam ("webcam1", "/archive/colour/" + image);
//updateWebcam ("webcam1-datetime", "/archive/colour/" + image);
updateWebcam ("webcam2", "/archive/colour1/" + image);
updateWebcam ("webcam3", "/archive/colour3/" + image);
updateWebcam ("webcam4", "/archive/bw/" + image);
updateWebcam ("uvc1", "/archive/uvc1/" + image);
updateWebcam ("ipcamera1", "/archive/ipcamera1/" + image);
updateWebcam ("ipcamera2", "/archive/ipcamera2/" + image);
updateWebcam ("ipcamera3", "/archive/ipcamera3/" + image);
updateWebcam ("ipcamera4", "/archive/ipcamera4/" + image);
updateWebcam ("ipcamera5", "/archive/ipcamera5/" + image);
updateWebcam ("ipcamera6", "/archive/ipcamera6/" + image);
//setTimeout("clearText()",1000);
}
function setMinutes(mins)
{
d.setMinutes(d.getMinutes() + mins);
setDate();
alignSelects();
}
function setHours(hours)
{
d.setHours(d.getHours() + hours);
setDate();
alignSelects();
}
function setDays(days)
{
d.setDate(d.getDate() + days);
setDate();
alignSelects();
}
function clearText()
{
document.getElementById("timeremaining").firstChild.data = "";
}
</script>
<style>
.camera {
margin: 4px;
/*padding: 20px;*/
margin-left: auto;
margin-right: auto;
display: inline-block;
font-size: 0;
}
.header {
background: none;
}
</style>
<link rel="stylesheet" href="webcam-overrides.css" type="text/css" media="screen" />
<script type="text/javascript" src="archive.js"></script>
</head>
<body onload="windowOnload()">
<div class="header">
<img alt="Planet UCC" id="pucc_logo"
src="//www.ucc.asn.au/images/ucc_logo.gif" />
<!--<img src="http://planet.ucc.asn.au/cam_collage.jpg" alt="UCC Webcam Collage" id="pucc_banner1" />
<img src="http://planet.ucc.asn.au/cam_collage.gif" alt="UCC Webcam Collage" id="pucc_banner2" />-->
<div id="globalnav-wrapper">
<ul id="portal-globalnav">
......@@ -402,20 +49,19 @@ function clearText()
<div class="navMenu">
<a href="index.html">Live</a>
<a href="http://webcam.ucc.asn.au/clubroom-schematic.png">Map</a>
<a href="index-nojs.php" title="Non-Javascript Webcam Page">Web0 Version</a>
</div>
<div class=camSection>
<div class="camera"><img id="webcam4" alt="BW Webcam" /></div>
<div class="camera"><img id="webcam3" alt="Webcam 3" /></div>
<div class="camera"><img id="webcam2" alt="Webcam 1" /></div>
<div class="camera"><img id="uvc1" alt="UVC 1" /></div>
<div class="camera"><img id="webcam1" alt="Webcam 2" /></div>
<div class="camera"><img id="ipcamera1" alt="IPCamera1" /></div>
<div class="camera"><img id="ipcamera2" alt="IPCamera2" /></div>
<div class="camera"><img id="ipcamera3" alt="IPCamera3" /></div>
<div class="camera"><img id="ipcamera4" alt="IPCamera4" /></div>
<div class="camera"><img id="ipcamera5" alt="IPCamera5" /></div>
<div class="camera"><img id="ipcamera6" alt="IPCamera6" /></div>
<div class="camera" id="webcam4"><img alt="BW Webcam" /></div>
<div class="camera" id="webcam3"><img alt="Webcam 3" /></div>
<div class="camera" id="webcam2"><img alt="Webcam 1" /></div>
<div class="camera" id="uvc1"><img alt="UVC 1" /></div>
<div class="camera" id="webcam1"><img alt="Webcam 2" /></div>
<div class="camera" id="ipcamera1"><img alt="IPCamera1" /></div>
<div class="camera" id="ipcamera2"><img alt="IPCamera2" /></div>
<div class="camera" id="ipcamera3"><img alt="IPCamera3" /></div>
<div class="camera" id="ipcamera4"><img alt="IPCamera4" /></div>
<div class="camera" id="ipcamera5"><img alt="IPCamera5" /></div>
<div class="camera" id="ipcamera6"><img alt="IPCamera6" /></div>
</div>
<div class="nav">
<table width="100%">
......@@ -485,7 +131,7 @@ days
</form></div>
</div>
<div class="footer">
<p>Copyright 1993-2011, The University Computer Club Inc.
<p>Copyright 1993-2014, The University Computer Club Inc.
&lt;<a href="mailto:[email protected]">[email protected]</a>&gt;<br />
Written to be <a href="http://www.w3c.org/">specifications compliant</a>.
</p>
......
var d;
var months = new Array ("Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec");
var days = new Array ("Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat");
function windowOnload()
{
// set the initial date from the server
// get an XML HTTP Request object
var req = false;
try
{
req = new XMLHttpRequest ();
}
catch (e)
{
try
{
req = new ActiveXObject ("Microsoft.XMLHTTP");
}
catch (e)
{
}
}
if (req)
{
req.onreadystatechange = function ()
{
if (req.readyState == 4)
{
d = new Date (Date.parse (req.getResponseHeader ("Date")));
if (location.hash.length > 0)
{
d.setTime (location.hash.substring(1, location.hash.length));
}
else
{
d.setMinutes(d.getMinutes() - 1);
}
setupPage();
setDate();
}
};
var timestamp = new Date ();
req.open ("HEAD", "index.html?" + timestamp.getTime (), true);
req.send ("");
}
}
function setDateNow()
{
// get a new date from the server
// get an XML HTTP Request object
var req = false;
try
{
req = new XMLHttpRequest ();
}
catch (e)
{
try
{
req = new ActiveXObject ("Microsoft.XMLHTTP");
}
catch (e)
{
}
}
if (req)
{
req.onreadystatechange = function ()
{
if (req.readyState == 4)
{
d = new Date (Date.parse (req.getResponseHeader ("Date")));
d.setMinutes(d.getMinutes() - 1);
setDate();
alignSelects();
}
};
var timestamp = new Date ();
req.open ("HEAD", "index.html?" + timestamp.getTime (), true);
req.send ("");
}
}
function setupPage()
{
var form;
var i;
document.getElementById("nav-dayname").firstChild.data = days[d.getDay()];
form = document.getElementById("nav-day");
for (i = 0; i < 31; i++)
{
form[i] = new Option(i+1,i+1,(d.getDate() == i+1));
}
form = document.getElementById("nav-month");
for (i = 0; i < 12; i++)
{
form[i] = new Option(months[i],i,(d.getMonth() == i));
}
form = document.getElementById("nav-year");
for (i = 2003; i < d.getFullYear() + 1; i++)
{
form[i-2003] = new Option(i,i,(d.getFullYear() == i));
}
form = document.getElementById("nav-hour");
for (i = 0; i < 24; i++)
{
form[i] = new Option(zPad(i.toString()),i,(d.getHours() == i));
}
form = document.getElementById("nav-minute");
for (i = 0; i < 60; i++)
{
form[i] = new Option(zPad(i.toString()),i,(d.getMinutes() == i));
}
}
function alignSelects()
{
var form;
var i;
form = document.getElementById("nav-day");
for (i = 0; i < 31; i++)
{
if (d.getDate() == i+1)
{
form[i].selected = true;
}
else
{
form[i].selected = false;
}
}
form = document.getElementById("nav-month");
for (i = 0; i < 12; i++)
{
if (d.getMonth() == i)
{
form[i].selected = true;
}
else
{
form[i].selected = false;
}
}
form = document.getElementById("nav-year");
for (i = 2003; i < d.getFullYear() + 1; i++)
{
if (d.getFullYear() == i)
{
form[i-2003].selected = true;
}
else
{
form[i-2003].selected = false;
}
}
form = document.getElementById("nav-hour");
for (i = 0; i < 24; i++)
{
if (d.getHours() == i)
{
form[i].selected = true;
}
else
{
form[i].selected = false;
}
}
form = document.getElementById("nav-minute");
for (i = 0; i < 60; i++)
{
if (d.getMinutes() == i)
{
form[i].selected = true;
}
else
{
form[i].selected = false;
}
}
}
function navDate()
{
d.setDate(document.getElementById("nav-day").value);
d.setMonth(document.getElementById("nav-month").value);
d.setFullYear(document.getElementById("nav-year").value);
d.setHours(document.getElementById("nav-hour").value);
d.setMinutes(document.getElementById("nav-minute").value);
setDate();
}
function zPad(str)
{
if (str.length == 1)
{
str = "