I have clock java scripts [.png]
http://msig.info/web2.php#clock
(I'm resize all image to 12x31)
in /include/user/ have
- 0.png
- 1.png
- 2.png
- 3.png
- 4.png
- 5.png
- 6.png
- 7.png
- 8.png
- 9.png
- colon.png
- clock.js
clock.js
var clock = 0;
function UpdateClock() {
if(clock) {
clearTimeout(clock);
clock = 0;
}
document.getElementById('clock').innerHTML = ReplaceNumbers(GetTime());
clock = setTimeout("UpdateClock()", 1000);
}
function StartClock() {
clock = setTimeout("UpdateClock()", 500);
}
function GetTime(){
var tDate = new Date();
hour = ''+tDate.getHours();
minutes = ''+tDate.getMinutes();
seconds = ''+tDate.getSeconds();
if(hour.length == 1){ hour = '0'+hour; }
if(minutes.length == 1){ minutes = '0'+minutes; }
if(seconds.length == 1){ seconds = '0'+seconds; }
return hour+':'+minutes+':'+seconds;
}
function ReplaceNumbers(string){
string = string.replace(/0/g,'<img src="0.png" alt="0"/>');
string = string.replace(/1/g,'<img src="1.png" alt="1"/>');
string = string.replace(/2/g,'<img src="2.png" alt="2"/>');
string = string.replace(/3/g,'<img src="3.png" alt="3"/>');
string = string.replace(/4/g,'<img src="4.png" alt="4"/>');
string = string.replace(/5/g,'<img src="5.png" alt="5"/>');
string = string.replace(/6/g,'<img src="6.png" alt="6"/>');
string = string.replace(/7/g,'<img src="7.png" alt="7"/>');
string = string.replace(/8/g,'<img src="8.png" alt="8"/>');
string = string.replace(/9/g,'<img src="9.png" alt="9"/>');
string = string.replace(/:/g,'<img src="colon.png" alt=":"/>');
return string;
}
function KillClock() {
if(clock) {
clearTimeout(clock);
clock = 0;
}
}
- clock.php
clock.php
<HTML>
<HEAD>
<TITLE> clock </TITLE>
<script type="text/javascript" src="clock.js"></script>
</HEAD>
<body onload="StartClock()" onunload="KillClock()">
<div class="block">
<h2><span>Clock</span></h2>
<div class="box">
<div id="groups" class="inbox">
<center><p><div id="clock" name="clock">Loading Clock...</p> </center>
</div>
</div>
</div>
</BODY>
</HTML>
in /include/template/
- portal.tpl
portal.tpl
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html dir="<pun_content_direction>">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=<pun_char_encoding>" />
<pun_head>
<style type="text/css">
#left {
width: 180px;
float: left;
}
#right {
width: 180px;
float: right;
}
#main {
margin-left: 190px;
margin-right: 190px;
}
</style>
<script type="text/javascript" src="clock.js"></script>
</head>
<body onload="StartClock()" onunload="KillClock()">
<div id="punwrap">
<div id="pun<pun_page>" class="pun">
<div id="brdheader" class="block">
<div class="box">
<div id="brdtitle" class="inbox">
<pun_title>
<pun_desc>
</div>
<pun_navlinks>
<pun_status>
</div>
</div>
<div id="left">
<div class="block">
<h2><span>Navigation</span></h2>
<div class="box">
<pun_sidelinks>
</div>
</div>
<pun_include "login.php">
<pun_include "statistics.php">
<pun_include "clock.php">
<pun_include "groups.php">
</div>
<div id="right">
<pun_include "recenttopics.php">
<pun_include "topforums.php">
<pun_include "topposters.php">
</div>
<div id="main">
<pun_main>
</div>
<div class="clearer"></div>
<pun_footer>
</div>
</div>
</body>
</html>
when I see in index portal page it not show png image clock but it show "Loading Clock..."
pls help me
sorry my bad english sorry sorry