Joomla Templates Club 406,261 posts

[gray Friend grayJoin date: October 2009Posts: 957Downloads:0Uploads:17 Thanks: 28 Thanked: 292 times in 230 posts]

#163492

Similar to the clock for Teline III v2 on Joomla 1.5 I created hack for Teline IV and Joomla 1.6.
The clock takes into account the server time offset set in Global configs.

So, in /templates/ja_teline_iv/blocks/topbar.php

AFTER first [php]?>[/php]

ADD [php]
<script type=”text/javascript” language=”JavaScript”>
severtime = new Date( <?php echo JHtml::date(‘now’, “Y,n,j,G,i,s”); ?> );
clocktime = 0;
$(window).addEvent(‘onDomReady’, setInterval(function(){
if (clocktime == 0) {
clocktime = severtime;
} else {
clocktime = new Date(clocktime.getTime() + 1000);
}
var hours = clocktime.getHours();
var minutes = clocktime.getMinutes();
var seconds = clocktime.getSeconds();
if (hours < 10) hours = “0” + hours;
if (minutes < 10) minutes = “0” + minutes;
if (seconds < 10) seconds = “0” + seconds;
var clock = document.getElementById(‘clock’);
clock.innerHTML = hours + “:” + minutes + “:” + seconds;
}, 1000));
</script>
[/php]

Then between (before </p>)

<p class=”ja-day clearfix”>
…..
</p>

ADD echo ‘<span class=”time” id=”clock”> </span>’;

PLEASE NOTE that this hack requires adjustment of the template.css as class “time” does not exist there!

That’s all 🙂
Provided AS IS. Still, feedback (and THANKS) are highly appreciated 🙂

2 users say Thank You to gray for this useful post

1. JA Developer
2. bingproductions

[gray Friend grayJoin date: October 2009Posts: 957Downloads:0Uploads:17 Thanks: 28 Thanked: 292 times in 230 posts]

#397254

Just a simple example, how to get date in current language with server time offset
[php]
<p class=”ja-day clearfix”>
<?php
echo ‘<span class=”day”>’ . JText::_( JHtml::date( ‘now’, ‘l’ ) ) . ‘</span>’;
echo ‘<span class=”date”>’ . JText::_( JHtml::date( ‘now’, ‘d’ ) ) .
‘ / ‘ . JText::_( JHtml::date( ‘now’, ‘m’ ) ) .
‘ / ‘ . JText::_( JHtml::date( ‘now’, ‘Y’ ) ) . ‘</span>’;
echo ‘<span class=”time” id=”clock”> </span>’;
?>
</p>
[/php]

Please note that it’s a custom format “dd/mm/yyyy”.

[bingproductions Friend bingproductionsJoin date: November 2011Posts: 2Downloads:0Uploads:0 Thanks: 3]

#429500

Could you offer advice on what needs to be put into the tamplate.css?

[gray Friend grayJoin date: October 2009Posts: 957Downloads:0Uploads:17 Thanks: 28 Thanked: 292 times in 230 posts]

#429811

<em>@bingproductions 288960 wrote:</em><blockquote>Could you offer advice on what needs to be put into the tamplate.css?</blockquote>
It really depends on the current style of your site. In my case (http://www.zerno.org.ua) I edited the block of code responsible for the date/time header styles.

/* Head Date */
.ja-day {
background: url(../images/stripe-bg-2.png);
color: #000;
float: left;
position: relative;
text-transform: lowercase;
}

.ja-day span { display: block; }

.ja-day span.date, .ja-day span.day {

float: left;
font: bold 11px/26px Arial, sans-serif;
text-align: center;
width: 70px;
}

.ja-day span.day { display: none; }

.ja-day span.time {
background: #eee;
color: #cc0000;
float: right;
font: normal 11px/26px Arial, sans-serif;
text-align: center;
width: 50px;
}

.ja-day:hover span.day { background: #cc0000; color: #fff; display: block; }

.ja-day:hover span.date { display: none; }


1 user says Thank You to gray for this useful post

1. bingproductions

[bingproductions Friend bingproductionsJoin date: November 2011Posts: 2Downloads:0Uploads:0 Thanks: 3]

#429818

thanks gray, it’s not working for me. I sent you a PM did you get it? my sent items say 0 sent..

[Author]

Posts