Page 4 of 4 FirstFirst ... 234
Results 31 to 35 of 35

Thread: A clock but displayed as words

  1. #31
    Join Date
    Apr 2012
    Location
    Chester, Cheshire
    Posts
    329
    Thanks
    7
    Thanked 35 Times in 35 Posts

    Default

    Sorry. Stupid rookie mistake.

    js/scripts.js:
    PHP Code:
    function isPlural(ns) { if (1) { += 's'; } return s; }

    function 
    dateToString() {
        var 
    aDates = ["""first""second""third""fourth""fifth""sixth""seventh""eighth",
                      
    "ninth""tenth""eleventh""twelfth""thirteenth""fourteenth""fifteenth",
                      
    "sixteenth""seventeenth""eighteenth""nineteenth""twentieth""twenty-first",
                      
    "twenty-second""twenty-third""twenty-fourth""twenty-fifth""twenty-sixth",
                      
    "twenty-seventh""twenty-eighth""twenty-ninth""thirtieth""thirty-first"];
        var 
    aMonths = ["january""february""march""april""may""june""july""august""september""october""november""december"];
        var 
    dDate = new Date();

        var 
    iDate dDate.getDate();
        var 
    iMonth dDate.getMonth();
        var 
    iYear dDate.getFullYear();

        var 
    sDate '<span class="emphasis">' aDates[iDate] + '</span>' '<br />' '<span class="basic">' ' of ' '</span>' '<span class="emphasis">' aMonths[iMonth] + '</span>' '<span class="basic">' iYear '</span>'

        
    return sDate;
    }

    function 
    timeToString() {

        var 
    aNumbers = ['one''two''three''four''five''six''seven''eight''nine''ten''eleven''twelve''thirteen''fourteen''fifteen''sixteen''seventeen''eighteen''nineteen''twenty''twenty one''twenty two''twenty three''twenty four''twenty five''twenty six ''twenty seven''twenty eight''twenty nine''thirty'];
        var 
    dTime = new Date();

        var 
    iHours dTime.getHours();
        var 
    iMinutes dTime.getMinutes();

        var 
    sConj ' past ';
        var 
    sAmPm 'in the morning';
        var 
    sOClock '  ';   //default

        
    if (iMinutes >= 30) {
            
    iMinutes 60 - (minutes);
            
    sConj ' to ';
            
    iHours++;
        }
        if (
    iMinutes || iMinutes 59) {
            
    sOClock " o'clock ";
        }

        
    /**
        * Morning: Midnight to Midday 
        * Afternoon: Midday to 6PM      
        * Evening: 6PM to 9PM         
        * Night: 9PM to Midnight    
        */
        
    if (iHours 12) {
            
    iHours -= 12;
            
    sAmPm 'in the afternoon';
            if (
    iHours >= 6) {
                
    sAmPm 'in the evening';
                if (
    iHours >= 9) {
                    
    sAmPm 'at night';
                }
            }
        } else if (
    iHours == 12) {
            
    sAmPm 'in the morning';
        } else if (
    iHours == 0) {
            
    iHours 12;
        }

        var 
    sTime = function () {
            var 
    '';
            if (!
    iMinutes == 0) {
                
    += '<p><span class="emphasis">' aNumbers[iMinutes 1] + ' ' '</span>' '<span class="basic">' isPlural(iMinutes'minute') + ' </br> ' sConj '</span>' ' ';
            }
            
    += '<span class="emphasis">' aNumbers[iHours 1] + sOClock '</span>';
            return 
    s;
        }
        return 
    sTime;
    }

    $(
    document).ready(function () {

        $(
    "#timeDiv").html(timeToString());
        $(
    "#dateDiv").html(dateToString());

        
    setInterval(function () {
            $(
    "#timeDiv").html(timeToString());
            $(
    "#dateDiv").html(dateToString());
        }, 
    10000);
    }); 

  2. The Following User Says Thank You to ApacheTech For This Useful Post:

    ukstormer (07-05-2012)

  3. #32
    Join Date
    Jun 2012
    Location
    Lancashire
    Posts
    31
    Thanks
    2
    Thanked 0 Times in 0 Posts

    Default

    Found a bug, works from 0 to 29 minutes but then locks on 29, doing an F5 refresh loses the date and time, once the time gets to O'clock the clock and date re-appear again until 29.

    Don't know if this was a test for me 'ApacheTech' to make sure I am paying attention and learning but looked through the code and sorted it out, the error is as follows
    PHP Code:
    if (iMinutes >= 30) {
            
    iMinutes 60 - (minutes);
            
    sConj ' to ';
            
    iHours++; 
    Should read
    PHP Code:
    if (iMinutes >= 30) {
            
    iMinutes 60 - (iMinutes);
            
    sConj ' to ';
            
    iHours++; 
    Will keep an eye on it over the next few hours but pretty sure it should be OK now.
    Last edited by ukstormer; 07-05-2012 at 01:31 PM.

  4. #33
    Join Date
    Jan 2011
    Location
    Southeastern CT
    Posts
    612
    Thanks
    46
    Thanked 32 Times in 32 Posts

    Default

    Okay,so what is the whole code look like now.After all adjustments?

    I am just curious lol
    Thanks,

    Bud

  5. #34
    Join Date
    Jun 2012
    Location
    Lancashire
    Posts
    31
    Thanks
    2
    Thanked 0 Times in 0 Posts

    Default

    OK, been up and running now with no apparent bugs, below are the final scripts, the only changes I have made are I downloaded the jquery.min.js and re referenced it in the HTML file and you will have to add your own image at 1024x768.

    A big thank you to 'ApacheTech' for all your help and to others that have contributed along the way on this thread and the other thread 'date to words'.

    Index.HTML
    PHP Code:
    <!DOCTYPE html>
    <
    html>
    <
    head>
        <
    meta charset="utf-8" />
        <
    title></title>
        <
    script src="js/jquery.min.js" type="text/javascript"></script>
        <script src="js/scripts.js" type="text/javascript"></script>
        <link href="css/styles.css" type="text/css" rel="stylesheet" />
    </head>

    <body>
        <div id="timeDiv"></div>
        <div id="dateDiv"></div>
    </body>
    </html> 
    Scripts.js
    PHP Code:
    function isPlural(ns) { if (1) { += 's'; } return s; }

    function 
    dateToString() {
        var 
    aDates = ["""first""second""third""fourth""fifth""sixth""seventh""eighth",
                      
    "ninth""tenth""eleventh""twelfth""thirteenth""fourteenth""fifteenth",
                      
    "sixteenth""seventeenth""eighteenth""nineteenth""twentieth""twenty-first",
                      
    "twenty-second""twenty-third""twenty-fourth""twenty-fifth""twenty-sixth",
                      
    "twenty-seventh""twenty-eighth""twenty-ninth""thirtieth""thirty-first"];
        var 
    aMonths = ["january""february""march""april""may""june""july""august""september""october""november""december"];
        var 
    dDate = new Date();

        var 
    iDate dDate.getDate();
        var 
    iMonth dDate.getMonth();
        var 
    iYear dDate.getFullYear();

        var 
    sDate '<span class="emphasis">' aDates[iDate] + '</span>' '<br />' '<span class="basic">' ' of ' '</span>' '<span class="emphasis">' aMonths[iMonth] + '</span>' '<span class="basic">' iYear '</span>'

        
    return sDate;
    }

    function 
    timeToString() {

        var 
    aNumbers = ['one''two''three''four''five''six''seven''eight''nine''ten''eleven''twelve''thirteen''fourteen''fifteen''sixteen''seventeen''eighteen''nineteen''twenty''twenty one''twenty two''twenty three''twenty four''twenty five''twenty six ''twenty seven''twenty eight''twenty nine''thirty'];
        var 
    dTime = new Date();

        var 
    iHours dTime.getHours();
        var 
    iMinutes dTime.getMinutes();

        var 
    sConj ' past ';
        var 
    sAmPm 'in the morning';
        var 
    sOClock '  ';   //default

        
    if (iMinutes >= 30) {
            
    iMinutes 60 - (iMinutes);
            
    sConj ' to ';
            
    iHours++;
        }
        if (
    iMinutes || iMinutes 59) {
            
    sOClock " o'clock ";
        }

        
    /**
        * Morning: Midnight to Midday 
        * Afternoon: Midday to 6PM      
        * Evening: 6PM to 9PM         
        * Night: 9PM to Midnight    
        */
        
    if (iHours 12) {
            
    iHours -= 12;
            
    sAmPm 'in the afternoon';
            if (
    iHours >= 6) {
                
    sAmPm 'in the evening';
                if (
    iHours >= 9) {
                    
    sAmPm 'at night';
                }
            }
        } else if (
    iHours == 12) {
            
    sAmPm 'in the morning';
        } else if (
    iHours == 0) {
            
    iHours 12;
        }

        var 
    sTime = function () {
            var 
    '';
            if (!
    iMinutes == 0) {
                
    += '<p><span class="emphasis">' aNumbers[iMinutes 1] + ' ' '</span>' '<span class="basic">' isPlural(iMinutes'minute') + ' </br> ' sConj '</span>' ' ';
            }
            
    += '<span class="emphasis">' aNumbers[iHours 1] + sOClock '</span>';
            return 
    s;
        }
        return 
    sTime;
    }

    $(
    document).ready(function () {

        $(
    "#timeDiv").html(timeToString());
        $(
    "#dateDiv").html(dateToString());

        
    setInterval(function () {
            $(
    "#timeDiv").html(timeToString());
            $(
    "#dateDiv").html(dateToString());
        },
    1000);
    }); 
    Styles.css
    PHP Code:
    /** 
    * Page Styles 
    */ 

    *, html 
        
    padding0px
        
    margin0px


    body 

        
    background-imageurl(../img/image.jpg);  
        
    background-repeatno-repeat;      
        
    background-positionleft top;   
    }  

    /** 
    * Date and Time Syles 
    */ 

    #timeDiv 

        
    positionabsolute
        
    left5px
        
    top610px;   
    }  

    #dateDiv 

        
    positionabsolute
        
    left610px
        
    top610px
    }  

    span.basic  

        
    font-family"LubalGraph Bd BT";  
        
    color#EA3030; 
        
    font-weight :normal
        
    font-size30px

           
    span.emphasis  

        
    font-family"LubalGraph Bd BT";  
        
    color#EA3030; 
        
    font-size60px


    /** 
    * Other CSS Here 
    */ 
    As this project is aimed at creating an unusual wall clock and at present has a static single image I can see that the next step would be to make the background a photo gallery but I am now going to make the frame for the screen and components.

    Any other ideas would be welcomed.

    Enjoy

  6. #35
    Join Date
    May 2012
    Location
    Hitchhiking the Galaxy
    Posts
    1,013
    Thanks
    46
    Thanked 139 Times in 139 Posts
    Blog Entries
    1

    Default

    sounds like an upclass electronic picture frame
    "Most good programmers do programming not because they expect to get paid or get adulation by the public, but because it is fun to program." - Linus Torvalds
    Anime Views Forums
    Bernie

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •