Serverside Klokke (php+js)

jtsorensen · 4. mai 2006

Hei

Jeg trenger en klokke på web-løsningen min som vises i formatet ( hh:mm:ss).

Jeg har funnet masse analoge klokker, javascript klokker(ikke serverside) osv... alt dette vet jeg om.

Men jeg trenger en klokke som tikker oppover ved hjelp av javascript, men med klokkeslettet hentet fra serveren.

Noen som vet om et enkelt script?

BigJackW · 4. mai 2006

Ta en titt på www.hotscripts.com

jtsorensen · 4. mai 2006

Jeg går ikke inn på forumet her før jeg har kjekket hotscripts (er vant med at det er det første svaret jeg får)

På hotscripts er det bare analoge eller digitale klokker, noen refresher seg ikke selv... bare masse rot som jeg ikke trenger...

Det må jo være ett enklere script der ute?

NH · 4. mai 2006

dette eksemplet burde sende deg på rett vei.

<html>
<head>
<?php
$js_script = <<<EOF
<script type="text/javascript">
function startTime()
{
var today=new Date()
var h={h}
var m={m}
var s={s}
// add a zero in front of numbers<10
m=checkTime(m)
s=checkTime(s)
document.getElementById('{element}').innerHTML=h+":"+m+":"+s
t=setTimeout('startTime()',500)
}

function checkTime(i)
{
if (i<10) 
 {i="0" + i}
 return i
}
</script>
EOF;

$js['h']	= date("h"); //Start time
$js['m']	= date("i"); //Start minutt
$js['s']	= date("s"); //start sekund
$js['element']	= 'myclock'; //ID navn på tag til klokka

foreach($js as $key => $val){
$js_script = str_replace('{'.$key.'}', $val, $js_script);
}

print($js_script);
?>
</head>
<body onload="startTime()">

<div id="myclock">
<!-- Her vises klokka -->
</div>
</body>
</html>

Dettte er en klokka basert på en teller. hvor php skriver JS'en til kildekoden og endrer innholdet i variablene med date

Endret 4. mai 2006 av NH

kvase · 4. mai 2006

her har du 4 forskjelige og velge melomm

http://klokka.no/webmaster.cgi

jtsorensen · 5. mai 2006

NH: takker for innlegget, jeg har klart å lage noe lignende selv. Uansett, det er nå utfordringen kommer, vi må klare å få klokken til å tikke ?

Jeg har prøvd nå i 2 dager med dette, og fått få resultater. Noen som er litt mer javascript gunstige, og kunne tatt utfordringen ved å få klokken til å gå?

Dahl · 5. mai 2006

En enkel metode vil være å vise klokken i en tekstboks, og style denne med CSS så man ikke ser at det er en boks. Da vil det være lett å få klokka til å gå uten å måtte laste siden på nytt hvert sekund.

Dette er imidlertid ingen god løsning, da tekstbokser egentlig kun skal bli brukt til å være nettopp tekstbokser.

-A-nders · 5. mai 2006

.

Endret 25. januar 2018 av -A-nders

jtsorensen · 5. mai 2006

Oki, jeg trenger litt tenkehjelp.

Om vi lager ett script som henter inn php-server-tiden og legger den til i ett javascript.

Dette javascriptet består av noen få funksjoner:

initKlokke -> for å legge til time, min, sek fra php

tikk -> for å telle klokken opp ett sekund og endre minutter og timer.

Det som er så frustrerende er at jeg tror det er ganske enkelt å få til, men jeg kan for lite javascript, så jeg bare knoter alt til.

Noen her som vet hvordan man kan lage en rekursiv tikk funksjon ?

Endret 5. mai 2006 av jtsorensen

NH · 5. mai 2006

har laget en for deg her:

Var jo dette som var meningen i forrige post, men brukte feil JS. HAHA.

<html>
<head>
<?php jsClock('myClock'); ?>
</head>
<body onload="startTime()">

<div id="myClock">
<!-- Her vises klokka -->
</div>
</body>
</html>

<?php
function jsClock($element){
$js_script = <<<EOF
<script type="text/javascript">
var h = "null";
var m = "null";
var s = "null";

function startTime()
{

var hf="{h}"
var mf={m}
var sf={s}

if(h == "null" || m == "null" || s == "null"){
h = hf;
m = mf;
s = sf;	
} else {
if(s != 59){
 s = checkTime(++s);
} else {
 s = 00;
 m = checkTime(++m);
 
 if(m == 59){
 	m = 00;
 	h = checkTime(++h);
 	
 	if(h == 23){
   h = "00";
 	}
 }
}
}

// add a zero in front of numbers<10
document.getElementById('{element}').innerHTML=h+":"+m+":"+s
t=setTimeout('startTime()',1000)
}

function checkTime(i)
{
if (i<10)
{i="0" + i}
return i
}
</script>
EOF;

$js['h'] = date("H"); //Start time
$js['m'] = date("i"); //Start minutt
$js['s'] = date("s"); //start sekund
$js['element'] = $element; //ID navn på tag til klokka

foreach($js as $key => $val){
$js_script = str_replace('{'.$key.'}', $val, $js_script);
}

print($js_script);
}

?>

eventuelt kan du bruke GD til dette. Som da ikke er en teller men som henter ny date() fra php hvert sekund.

for dette trenger du to scripts.

clockimage.php

<?php
header("Content-type: image/png");
$width = 50;
$height = 20;

$img = imagecreate($width, $height);
$string = date("H:i:s");

$tekstColor = imagecolorallocate($img, 0, 0, 0);
$backgroundColor = imagecolorallocatealpha($img, 0,0,0, 127);

imagefill($img, 0,0, $backgroundColor);
imagestring($img, 2, 0,0, $string, $tekstColor);


imagepng($img);
imagedestroy($img);

?>

javascriptet

<script language="javascript" type="text/javascript">
teller = 1
function clock(){
clockElement = document.getElementById('clockimage');
clockElement.src = "clockimage.php?" +teller;
clockElement.alt = ++teller;
t = setTimeout('clock()', 1000);
}

</script>

så er det bare å lage en <img> tag med riktig id( i forrhold til getElementById() ) der du ønsker telleren

Endret 6. mai 2006 av NH

jtsorensen · 6. mai 2006

Dette har vært et utrolig hodebry de siste dagene.

Tusen hjertlig takk for hjelpen!

Logg inn

Serverside Klokke (php+js)

Anbefalte innlegg

jtsorensen

Lenke til kommentar

Videoannonse

BigJackW

Lenke til kommentar

jtsorensen

Lenke til kommentar

NH

Lenke til kommentar

kvase

Lenke til kommentar

jtsorensen

Lenke til kommentar

Dahl

Lenke til kommentar

-A-nders

Lenke til kommentar

jtsorensen

Lenke til kommentar

NH

Lenke til kommentar

jtsorensen

Lenke til kommentar

Opprett en konto eller logg inn for å kommentere

Opprett konto

Logg inn

Hvem er aktive 0 medlemmer