News:

Wondering if this will always be free?  See why free is better.

Main Menu

Live clock in header

Started by Joker™, September 02, 2010, 10:47:59 AM

Previous topic - Next topic

Manu.G

Works like a charme! :D

http://forum.arsenie.net

Thanks a lot for your help :D
Version SMF 2.0.8
SimplePortal 2.3.5

Joker™

Github Profile
Android apps
Medium

How to enable Post Moderation

"For the wise man looks into space and he knows there is no limited dimensions." - Laozi

All support seeking PM's get microwaved

LHW



KensonPlays

Joker, possible to use some code and make a small analog clock with hands? is that possible?

Owner of Mesozoic Haven

Joker™

Quote from: Kcmartz on September 09, 2010, 12:28:08 PM
Joker, possible to use some code and make a small analog clock with hands? is that possible?
no idea in my mind how to code that . Also think that it wouldn't be visible clearly at all due to size factor.
Github Profile
Android apps
Medium

How to enable Post Moderation

"For the wise man looks into space and he knows there is no limited dimensions." - Laozi

All support seeking PM's get microwaved

KensonPlays

There are JS or DHTML scripts that do something like that, with your mouse on a website, it follows your mouse or something. But if you could do that, I would probably apply it to every SMF forum I create!

Owner of Mesozoic Haven

Joker™

Github Profile
Android apps
Medium

How to enable Post Moderation

"For the wise man looks into space and he knows there is no limited dimensions." - Laozi

All support seeking PM's get microwaved

TheListener

Looks good Joker

Is there any strain on the server?

By the way ya may have to shout a bit louder before kcmartz starts to listen.

Also what about the option of a 24 hour clock?

Joker™

Quote from: Brack1 on September 09, 2010, 09:07:57 PM
Looks good Joker
Thanks

QuoteIs there any strain on the server?
My site is no shared server and it is running absolutely fine :).

QuoteBy the way ya may have to shout a bit louder before kcmartz starts to listen.
Naah , he won't ask again.

QuoteAlso what about the option of a 24 hour clock?
Just have to remove am pm code from JS code.
Github Profile
Android apps
Medium

How to enable Post Moderation

"For the wise man looks into space and he knows there is no limited dimensions." - Laozi

All support seeking PM's get microwaved

KensonPlays

What about a clock that has blinking colons and changes colors :P

Owner of Mesozoic Haven

Joker™

Quote from: Kcmartz on September 10, 2010, 01:46:18 AM
What about a clock that has blinking colons and changes colors :P
? ? ? ? ? Joker™ can't read minds
Github Profile
Android apps
Medium

How to enable Post Moderation

"For the wise man looks into space and he knows there is no limited dimensions." - Laozi

All support seeking PM's get microwaved

TheListener

#31
Quote from: Kcmartz on September 10, 2010, 01:46:18 AM
What about a clock that has blinking colons and changes colors :P

You were saying?




EDIT: The edit is now working on my test forum.



wcharlot

this is really a good job! 8)

i have applied it and it is the coolest!

I love that live clock on my header.  :) ;) :D ;D 8)

Hj Ahmad Rasyid Hj Ismail

A very nice mod. I will surely try this out soonest.

Joker™

Quote from: wcharlot on September 11, 2010, 03:10:58 AM
this is really a good job! 8)

i have applied it and it is the coolest!

I love that live clock on my header.  :) ;) :D ;D 8)
thanks for nice comments ;D

Quote from: ahrasis on September 11, 2010, 07:50:58 AM
A very nice mod. I will surely try this out soonest.
not a mod , but thanks for nice comments ;)
Github Profile
Android apps
Medium

How to enable Post Moderation

"For the wise man looks into space and he knows there is no limited dimensions." - Laozi

All support seeking PM's get microwaved

Zirc

How would I get it to display all on one line?  Date -> Time

Thanks

Hj Ahmad Rasyid Hj Ismail

Hmm... I cannot get the date and time display in line. The date is displayed above the time. How do i get it displayed inline instead. Here is my site link http://ahrasis.com

My index.template.php is being modified so that it can display smf date and time which is now replaced by your live clock mod in this line:

// Show the menu up top. Something like [home] [help] [profile] [logout]...
function template_menu()
{
    global $context, $settings, $options, $scripturl, $txt;

    echo '
        <div id="main_menu"><div style="font-size:0.9em; float:right; color:white;">',timeformat(time(),'%B, %d, %Y'), '
<li id="clock">Loading...</li>   
<script type="text/javascript">
function refrClock()
{
var d=new Date();
var s=d.getSeconds();
var m=d.getMinutes();
var h=d.getHours();
var am_pm;
if (s<10) {s="0" + s}
if (m<10) {m="0" + m}
if (h>12) {h-=12;am_pm = "pm"}
else {am_pm="am"}
if (h<10) {h="0" + h}
document.getElementById("clock").innerHTML=h + ":" + m + ":" + s + am_pm;
setTimeout("refrClock()",1000);
}
refrClock();
</script></div>
        <h1 class="forumtitle"><a href="', $scripturl, '">', empty($context['header_logo_url_html_safe']) ? $context['forum_name'] : '<img src="' . $context['header_logo_url_html_safe'] . '" alt="' . $context['forum_name'] . '" />', '</a></h1>
            <ul class="whitemenu" id="menu_nav">';

    foreach ($context['menu_buttons'] as $act => $button)
    {
        echo '
                <li id="button_', $act, '">
                    <a class="', $button['active_button'] ? 'active ' : '', 'firstlevel" href="', $button['href'], '"', isset($button['target']) ? ' target="' . $button['target'] . '"' : '', '>
                        <span class="', isset($button['is_last']) ? 'last ' : '', 'firstlevel">', $button['title'], '</span>
                    </a>';
        if (!empty($button['sub_buttons']))
        {
            echo '
                    <ul>';

            foreach ($button['sub_buttons'] as $childbutton)
            {
                echo '
                        <li>
                            <a href="', $childbutton['href'], '"', isset($childbutton['target']) ? ' target="' . $childbutton['target'] . '"' : '', '>
                                <span', isset($childbutton['is_last']) ? ' class="last"' : '', '>', $childbutton['title'], !empty($childbutton['sub_buttons']) ? '...' : '', '</span>
                            </a>';
                // 3rd level menus :)
                if (!empty($childbutton['sub_buttons']))
                {
                    echo '
                            <ul>';

                    foreach ($childbutton['sub_buttons'] as $grandchildbutton)
                        echo '
                                <li>
                                    <a', $grandchildbutton['active_button'] ? ' class="active"' : '', ' href="', $grandchildbutton['href'], '"', isset($grandchildbutton['target']) ? ' target="' . $grandchildbutton['target'] . '"' : '', '>
                                        <span', isset($grandchildbutton['is_last']) ? ' class="last"' : '', '>', $grandchildbutton['title'], '</span>
                                    </a>
                                </li>';

                    echo '
                        </ul>';
                }

                echo '
                        </li>';
            }
            echo '
                    </ul>';
        }
        echo '
                </li>';
    }

    echo '
            </ul>
        </div>';
}

Joker™

For date and time to be in one line

themes\default\index.template.php
Find:
echo '
<li>', $context['current_time'], '</li>
</ul>';


Replace: echo '

<li>',timeformat(time(),'%B, %d, %Y'), '
<font id="clock">Loading...</font>
<script type="text/javascript">
function refrClock()
{
var d=new Date();
var s=d.getSeconds();
var m=d.getMinutes();
var h=d.getHours();
var am_pm;
if (s<10) {s="0" + s}
if (m<10) {m="0" + m}
if (h>12) {h-=12;am_pm = "pm"}
else {am_pm="am"}
if (h<10) {h="0" + h}
document.getElementById("clock").innerHTML=h + ":" + m + ":" + s + am_pm;
setTimeout("refrClock()",1000);
}
refrClock();
</script>
</li></ul>';


I've just replace <li> to <font> tag.
Github Profile
Android apps
Medium

How to enable Post Moderation

"For the wise man looks into space and he knows there is no limited dimensions." - Laozi

All support seeking PM's get microwaved

Hj Ahmad Rasyid Hj Ismail

#38
Cool. It works like a charm. I now have a live clock on my site. Thanks a million.

I dont like the comma and the format so I changed from ' ,timeformat(time(),'%B, %d, %Y'), ' to ' ,timeformat(time(),'%d %B %Y'), '.

Joker™

Quote from: ahrasis on September 12, 2010, 06:47:26 AM
Cool. It works like a charm. I now have a live clock on my site. Thanks a million.
your welcome ;)
Github Profile
Android apps
Medium

How to enable Post Moderation

"For the wise man looks into space and he knows there is no limited dimensions." - Laozi

All support seeking PM's get microwaved

Advertisement: