...

View Full Version : Time Problem?



Mr.Joker
01-06-2012, 08:23 PM
I wanted to make script that will work fine with pictures. For example if its 21:21 there are pictures of those numbers instead of normal mechanic numbers.
I tested this code:

<script type="text/javascript">
function Time() {
var Date1=new Date()
var Hours1=Datum.getHours()
var Minutes1=Datum.getMinutes()
if (Hours1==21 & Minutes1==12)
document.write("<img src='http://img839.imageshack.us/img839/2383/47819853.png'" + "<img src='http://img714.imageshack.us/img714/9003/asdadajy.png'" + "<img src='http://img210.imageshack.us/img210/2020/34813695.png'")
}
</script>
And have this:

<button type="button" onClick="vreme()">Click</button>

That work fine for time 21:12 but if i want to work for all pictures i will ahve to write different code like:
if ...
elseif...
elseif...
And plenty of those codes which is totaly wrong. What should I do?

xelawho
01-06-2012, 10:23 PM
here you go. I couldn't figure out the order of those images, so I grabbed some others - the nums array should be easy enough to edit.



<html>
<head>
</head>
<body onload="getTheDate()">
<div id="time"></div>
<script type="text/javascript">
var nums=["http://www.cityu.edu.hk/webimage/number/arial_0.gif",
"http://www.cityu.edu.hk/webimage/number/arial_1.gif",
"http://www.cityu.edu.hk/webimage/number/arial_2.gif",
"http://www.cityu.edu.hk/webimage/number/arial_3.gif",
"http://www.cityu.edu.hk/webimage/number/arial_4.gif",
"http://www.cityu.edu.hk/webimage/number/arial_5.gif",
"http://www.cityu.edu.hk/webimage/number/arial_6.gif",
"http://www.cityu.edu.hk/webimage/number/arial_7.gif",
"http://www.cityu.edu.hk/webimage/number/arial_8.gif",
"http://www.cityu.edu.hk/webimage/number/arial_9.gif"];

function rePlace(str){
for (var i=0; i<10; i++) { //sets up a loop from 0 to 9
re=new RegExp(i, 'g') //first part of replace - replace all instances of the number from the loop
str=str.replace(re, "<img src='" +nums[i]+ "' />"); //second part of replace - replaces numbers with image from nums array
}
return str; //sends converted string back to first function
}

function getTheDate(){
var mydate = new Date();
time=rePlace(mydate.toTimeString().substr(0,5)) //sends the first 5 characters of the time string to the rePlace function
document.getElementById("time").innerHTML=time; // takes converted string and displays it in the "time" div
}
</script>

</body>
</html>

Mr.Joker
01-06-2012, 10:45 PM
Ok this is perfect. Can you now explain me please very detailed how it works, if its not problem for you. I really want to understand this. :)

xelawho
01-06-2012, 10:54 PM
I edited my post to add comments in the code :thumbsup:

jmrker
01-07-2012, 04:35 PM
An alternative solution...



<html>
<head>
</head>
<body onload="getTheDate()">
<div id="time"></div>

<script type="text/javascript">
// Modified from: http://www.codingforums.com/showthread.php?t=248111

var baseURL = "http://www.cityu.edu.hk/webimage/number/";
var nums=[
"arial_0.gif","arial_1.gif","arial_2.gif","arial_3.gif","arial_4.gif",
"arial_5.gif","arial_6.gif","arial_7.gif","arial_8.gif","arial_9.gif"
];

function rePlace(tstr){
var str = ''; var tmp = '';
for (var i=0; i<tstr.length; i++) {
tmp = tstr.charAt(i);
if ('0123456789'.indexOf(tmp) != -1) {
str += '<img src="'+baseURL+nums[tmp]+'" />';
} else { str += '<span style="font-size:2em">'+tmp+'</span>'; }
}
return str; //sends converted string back to first function
}

function getTheDate(){
var mydate = new Date();
var time = ''+mydate.getHours()+':'+mydate.getMinutes();
// could add seconds if needed (mydate.getSeconds())
time = rePlace(time);
document.getElementById("time").innerHTML=time;
// takes converted string and displays it in the "time" div
}
</script>

</body>
</html>

Philip M
01-07-2012, 05:11 PM
Small improvement to put a zero in front of single minutes:-


function getTheDate(){
var mydate = new Date();
var time = mydate.getHours()+':';
var mins = mydate.getMinutes();
if (mins <10) {mins = "0" + mins}
time += mins;

Mr.Joker
01-07-2012, 08:25 PM
I have a problem. When i want to upload my images It doesent work...

xelawho
01-07-2012, 08:28 PM
do you have the image pathnames right? is there a message in the error console, or (better) can you give us a link to the page in question?

Mr.Joker
01-07-2012, 08:41 PM
<html>
<head>
</head>
<body onload="getTheDate()">
<div id="time"></div>
<script type="text/javascript">
var nums=["http://www.dodaj.rs/f/16/J2/36xwg7Sz/0.png",
"http://www.dodaj.rs/f/1d/FG/2zB0N8u5/1.png",
"http://www.dodaj.rs/f/c/3h/nTnRZFO/3.png",
"http://www.dodaj.rs/f/c/3h/nTnRZFO/3.png",
"http://www.dodaj.rs/f/e/Kc/4ldu51MV/4.png",
"http://www.dodaj.rs/f/3r/jr/3yvu4gNO/5.png",
"http://www.dodaj.rs/f/y/gA/4D7Wt9xr/6.png",
"http://www.dodaj.rs/f/3T/aG/2NTfeTGS/7.png",
"http://www.dodaj.rs/f/2L/yy/4FEyW7Q7/8.png",
"http://www.dodaj.rs/f/W/wR/2AdjK2G0/9.png"];

function rePlace(str){
for (var i=0; i<10; i++) { //sets up a loop from 0 to 9
re=new RegExp(i, 'g') //first part of replace - replace all instances of the number from the loop
str=str.replace(re,"<img src='" +nums[i]+ "' />"); //second part of replace - replaces numbers with image from nums array
}
return str; //sends converted string back to first function
}

function getTheDate(){
var mydate = new Date();
time=rePlace(mydate.toTimeString().substr(0,5)) //sends the first 5 characters of the time string to the rePlace function
document.getElementById("time").innerHTML=time; // takes converted string and displays it in the "time" div
}
</script>

</body>
</html>

Problem?

xelawho
01-07-2012, 08:57 PM
looks like the replace is replacing some of the numbers in your image files, too, which breaks the image :(

If you use jmarker's code in post #5 you shouldn't have that problem.

Mr.Joker
01-07-2012, 10:17 PM
Ok now it lloks like:

<html>
<head>
</head>
<body onload="getTheDate()">
<div id="time"></div>

<script type="text/javascript">
var baseURL = "http://www.dodaj.rs/";
var nums=[
"f/16/J2/36xwg7Sz/0.png","f/1d/FG/2zB0N8u5/1.png","f/1C/7g/1SGo1CuC/2.png","f/c/3h/nTnRZFO/3.png","f/e/Kc/4ldu51MV/4.png",
"f/3r/jr/3yvu4gNO/5.png","f/y/gA/4D7Wt9xr/6.png","f/3T/aG/2NTfeTGS/7.png","f/2L/yy/4FEyW7Q7/8.png","f/W/wR/2AdjK2G0/9.png"
];

function rePlace(tstr){
var str = ''; var tmp = '';
for (var i=0; i<tstr.length; i++) {
tmp = tstr.charAt(i);
if ('0123456789'.indexOf(tmp) != -1) {
str += '<img src="'+baseURL+nums[tmp]+'" />';
} else { str += '<span style="font-size:2em">'+tmp+'</span>'; }
}
return str;
}

function getTheDate(){
var mydate = new Date();
var time = ''+mydate.getHours()+':'+mydate.getMinutes();
time = rePlace(time);
document.getElementById("time").innerHTML=time;
}
</script>

</body>
</html>
Last thing. Where to change this ":" and turn in into picture?

jmrker
01-08-2012, 01:03 AM
See changes in RED below:

Ok now it lloks like:

...
<script type="text/javascript">
var baseURL = "http://www.dodaj.rs/";
var nums=[
"f/16/J2/36xwg7Sz/0.png","f/1d/FG/2zB0N8u5/1.png","f/1C/7g/1SGo1CuC/2.png","f/c/3h/nTnRZFO/3.png","f/e/Kc/4ldu51MV/4.png",
"f/3r/jr/3yvu4gNO/5.png","f/y/gA/4D7Wt9xr/6.png","f/3T/aG/2NTfeTGS/7.png","f/2L/yy/4FEyW7Q7/8.png","f/W/wR/2AdjK2G0/9.png",
"path/colonImage.png"
];

function rePlace(tstr){
var str = ''; var tmp = '';
for (var i=0; i<tstr.length; i++) {
tmp = tstr.charAt(i);
if ('0123456789:'.indexOf(tmp) != -1) {
str += '<img src="'+baseURL+nums[tmp]+'" />';
} // else { str += '<span style="font-size:2em">'+tmp+'</span>'; }
}
return str;
}
...
Last thing. Where to change this ":" and turn in into picture?

One question: Why are your number images scattered in so many different directories?

Philip M
01-08-2012, 09:19 AM
See changes in RED below:


One question: Why are your number images scattered in so many different directories?

And with such obfuscated names? Are you trying to stop people stealing your incredibly valuable images? If so, forget it. :)

Mr.Joker
01-08-2012, 10:25 AM
Um I uploaded pictures on dodaj.rs (image hosting). Its not my hosting so everything be in one folder :)

And i Still dont get it how to change two dotts with this:

http://www.dodaj.rs/f/2E/d0/2mJrqwjw/1/dvotacka.png

jmrker
01-08-2012, 03:24 PM
Um I uploaded pictures on dodaj.rs (image hosting). Its not my hosting so everything be in one folder :)

And i Still dont get it how to change two dotts with this:

http://www.dodaj.rs/f/2E/d0/2mJrqwjw/1/dvotacka.png

Did you make ALL the changes of post #12?
Are you getting any errors in the error console?
Show (post) what you did rather than complain that it doesn't work!



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum