The Web Design Group

... Making the Web accessible to all.

Welcome Guest ( Log In | Register )

3 Pages V  1 2 3 >  
Reply to this topicStart new topic
> Using Time to display a message, I have a script that displays random, I want to predict it.
Martha
post Jun 17 2016, 08:27 PM
Post #1


Novice
**

Group: Members
Posts: 28
Joined: 17-June 16
Member No.: 24,336



Currently I have a spot on a profile that I'm writing for myself that has the first item below as a way to generate a random picture each time the page is reloaded.

#NOTE: I have not placed the name of the website I am intending to use this on as it contains adult information that may not be safe for work. If absolutely required to aide in the completion of my question I can send a link privately, but I am fairly sure it is not needed.

CODE
<script type="text/javascript">
var total_images = 6;
var random_a = Math.floor((Math.random()*total_images));
var random_img = new Array();
random_img[0] = '(link here)';
random_img[1] = '(link here)';
random_img[2] = '(link here)';
random_img[3] = '(link here)';
random_img[4] = '(link here)';
random_img[5] = '(link here)';
document.write(random_img[random_a]);
</script>


I also have a script for a rather basic clock function.

CODE
<!DOCTYPE html>
<html>
<head>
<script>
function startTime() {
    var today = new Date();
    var h = today.getHours();
    var m = today.getMinutes();
    var s = today.getSeconds();
    m = checkTime(m);
    s = checkTime(s);
    document.getElementById('txt').innerHTML =
    h + ":" + m + ":" + s;
    var t = setTimeout(startTime, 500);
}
function checkTime(i) {
    if (i < 10) {i = "0" + i};  // add zero in front of numbers < 10
    return i;
}
</script>
</head>

<body onload="startTime()">

<div id="txt"></div>

</body>
</html>
(Script copied from http://www.w3schools.com)

What I would like to do is somehow take the
CODE
var h = today.getHours()
element and place it into the
CODE
document.write(random_img[random_number]);
line so that I can display a predictable array of information ranging from 00 to 23 based on the hour that the time stamp returns. An example is below.

The current time is
CODE
<div id="txt"></div>
I am currently
CODE
<script type="text/javascript">
var total_images = 6;
var random_a = Math.floor((Math.random()*total_images));
var random_img = new Array();
random_img[10] = 'Hanging out before work/college';
random_img[11] = 'Getting ready to eat lunch';
random_img[12] = 'Eating Lunch';
random_img[13] = 'On my way to work/college';
random_img[14] = 'At work/college';
random_img[15] = 'At work/college';
document.write(random_img[random_a]);
</script>
. Thank you have a nice day.

An outcome to that might be, hopefully
The current time is 14:25 I am currently At work/college. Thank you have a nice day.

It is likely something fairly simple that I just don't have the skills for yet. If anyone would be kind enough to point out what I am missing to make this work it would be greatly appreciated. I hope this is the right place on the forum, and yes I just joined today so that I could ask this. Thank you for any and all help that you can give.

Restrictions - limited to HTML formatting, no outside CSS script room at this time. If what I want to do would take CSS then I can try a different hosting point, but would prefer without.
Variables currently used in whole profile.
total_images, total_locations, personalities
random_a, random_b ... random_f
random_img, random_loc, random_mood

This post has been edited by Martha: Jun 17 2016, 08:39 PM
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
CharlesEF
post Jun 18 2016, 03:41 AM
Post #2


Programming Fanatic
********

Group: Members
Posts: 1,981
Joined: 27-April 13
From: Edinburg, Texas
Member No.: 19,088



Attached is a sample document I put together. It doesn't do everything you wanted, I had to leave some for you. The W3 clock code was very basic so I used another version. It is similar but better looking. I cleaned up the code a little but the original can be found here. The clock doesn't have to be displayed on the screen but I did it anyway. The clock does use CSS but it is included in a <style> tag in the file. If you don't want to display the clock then it can be removed.

Study the code and ask any questions you might have. Enjoy smile.gif
Attached File  sample.zip ( 120.79k ) Number of downloads: 414
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Martha
post Jun 18 2016, 07:03 AM
Post #3


Novice
**

Group: Members
Posts: 28
Joined: 17-June 16
Member No.: 24,336



Thank you, family is going to take time from me this morning but I'll take a look and see what I can do. *downloads now to get started* Taking a look at the code there wows my head. It's absolutely beautiful what it does and how it works. The default message display is something I never thought of adding, something that covers variables that I haven't written yet. I like the AM and PM function. Before I was using military time. I found the last part of what I need to set everything up at http://stackoverflow.com/questions/7947975...cific-time-zone so I can set a static time zone for the clock. Oh thank you so much for helping me on this path. I would so entirely and completely hug you if my arms were long enough <3 <3 !

This post has been edited by Martha: Jun 18 2016, 07:19 AM
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Martha
post Jun 18 2016, 08:31 AM
Post #4


Novice
**

Group: Members
Posts: 28
Joined: 17-June 16
Member No.: 24,336



I think I was able to do it. It works when I test it but if I could get someone else to look at it... I think I got all the variables in the right place and when I set
CODE
window.onload=function()
  {
   random_image();
   windTheClock();
  }
windTheClock to (-7) it displays my time zone, when I change it to (10) it displays Australian time zone. *giggles and claps* I've honestly never worked with anything more complicated than basic HTML formatting (using tables and such) this is a big step for me and it's nice to have the help getting there. I hope I did things right... I attached the modified script that CharlesEF gave me to start with.


Attached File(s)
Attached File  TimeZoneMod.txt ( 6.42k ) Number of downloads: 200
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
CharlesEF
post Jun 18 2016, 02:51 PM
Post #5


Programming Fanatic
********

Group: Members
Posts: 1,981
Joined: 27-April 13
From: Edinburg, Texas
Member No.: 19,088



Are you having a specific problem with the code? I've looked it over and nothing jumps out at me. I 'assume' the timezone code is so that the messages are displayed based on your timezone, regardless of where the user is located?
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Martha
post Jun 18 2016, 03:19 PM
Post #6


Novice
**

Group: Members
Posts: 28
Joined: 17-June 16
Member No.: 24,336



Yes that's what it is meant to do, based on my time zone and I was not having any problems but it helps to have an extra set of eyes. I honestly couldn't have done this without your help. Thank you for helping my vision reach fruition.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
CharlesEF
post Jun 18 2016, 03:53 PM
Post #7


Programming Fanatic
********

Group: Members
Posts: 1,981
Joined: 27-April 13
From: Edinburg, Texas
Member No.: 19,088



You're welcome. Feel free to post if you have any other questions/problems.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
CharlesEF
post Jun 18 2016, 04:48 PM
Post #8


Programming Fanatic
********

Group: Members
Posts: 1,981
Joined: 27-April 13
From: Edinburg, Texas
Member No.: 19,088



Oh, I left out the current time from your custom messages as a task for you. You haven't mentioned it but it can be done. You would need to make a few small changes to the code. If you need help just post back.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Martha
post Jun 18 2016, 05:47 PM
Post #9


Novice
**

Group: Members
Posts: 28
Joined: 17-June 16
Member No.: 24,336



Current time might be nice for people in other time zones to compare but right now the problem that has shown up has been with the
CODE
case #:
new_text = "";
break;

aspect of the code. I have entered case 1-12 for both AM and PM clauses and no matter what time the clock reads (adjusted by changing the windTheClock variable) I only get the default message. I have cycled through all 24 hours. I did a test to see if anything other than the default would show.

Earlier you have a "showMessage(diem, h);" in the time/clock area before the minute and second attribute is set, but after the "function checkTime(i)" you have "function showMessage(diem, hour)" though I don't know if anything in the script is assigning a numerical value to hour as a variable that would trigger the case points. In the text below I removed the random image part of the script because that's working perfectly.

I'm going to keep working on this and try to crack it myself because I think it's something that will help me learn and explore and grow, especially when looking at other code and seeing how it works ... but I'm also not going to refuse help, or the answer, so I can compare it to what's going on there now.

UPDATE:: The variable involved in the aspect of
CODE
case #:
new_text = "";
break;

only seems broken when dealing with 1-9. Variables 10, 11, and 12 register correctly. Tried to adjust 1-9 by adding a 0 in front but that did not fix the error.

This post has been edited by Martha: Jun 18 2016, 05:57 PM


Attached File(s)
Attached File  TimeZoneMod2.txt ( 7.13k ) Number of downloads: 197
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
CharlesEF
post Jun 18 2016, 06:52 PM
Post #10


Programming Fanatic
********

Group: Members
Posts: 1,981
Joined: 27-April 13
From: Edinburg, Texas
Member No.: 19,088



The # character is not an integer so it must be enclosed with quotes. But, since the hour variable should never be the # character I don't see why you would need it.

As for the 1-9 problem that was my fault (too early in the morning). When the leading 0 is added it is now a string not an integer, so you must use 01-09 enclosed with quotes. Like "01", "02", etc...

When the "showMessage(diem, h);" function is called 'diem' and 'h' are the variable names in the current function. The receiving "function showMessage(diem, hour)" accepts the calling parameters and uses them as 'diem' and 'hour'. So, 'diem = diem' and 'h = hour'. 'diem' and 'hour' variables are only valid in the 'showMessage' function. I could have used any names I wanted. Don't confuse 'diem' in the 'windTheClock' function. Variable defined inside a function are local to that function only. That is why 'diem' needs to be passed to the 2nd function 'showMessage'.

I have not looked at your new code but if you make these changes then everything should work. If you have any other problems just post back.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Martha
post Jun 18 2016, 06:57 PM
Post #11


Novice
**

Group: Members
Posts: 28
Joined: 17-June 16
Member No.: 24,336



set case "0#" and it all works now. okay mental note "01" is an integer 01 is a string. No need to look at the script then.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
CharlesEF
post Jun 18 2016, 07:28 PM
Post #12


Programming Fanatic
********

Group: Members
Posts: 1,981
Joined: 27-April 13
From: Edinburg, Texas
Member No.: 19,088



QUOTE(Martha @ Jun 18 2016, 06:57 PM) *

set case "0#" and it all works now. okay mental note "01" is an integer 01 is a string. No need to look at the script then.

I think you meant "01" is NOT an integer. If the leading 0 was not added to the 'h', 'm' or 's' variables then you would have an integer. Once the leading 0 is added it now becomes a string.

This post has been edited by CharlesEF: Jun 18 2016, 07:29 PM
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Martha
post Jun 18 2016, 09:08 PM
Post #13


Novice
**

Group: Members
Posts: 28
Joined: 17-June 16
Member No.: 24,336



ah okay. I did find one error that I changed.
CODE
if(h == 0)
  {
         h = 12;
     }
  else if(h > 11)
  {
        h = h - 12;
         diem = "PM";
                if(h == 0)
  {
         h = 12;
     }
    }

I had to change else if (h>12) to else if (h>11) to get it to correctly return noon as PM instead of AM. Then I had to add a second if(h ==0) h = 12 line to get it to show as 12 pm and register later in the program to show the right message.

Ah okay. I think I understand about the string now. Learning is fun
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
CharlesEF
post Jun 18 2016, 09:34 PM
Post #14


Programming Fanatic
********

Group: Members
Posts: 1,981
Joined: 27-April 13
From: Edinburg, Texas
Member No.: 19,088



Good catch. That code was from the link I posted before and I didn't notice it. I didn't run the code long enough to get to noon.

If you need help adding the date and time to your custom messages just post back.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Martha
post Jun 18 2016, 10:16 PM
Post #15


Novice
**

Group: Members
Posts: 28
Joined: 17-June 16
Member No.: 24,336



I currently have
CODE

The local time is<span id="clockDisplay" class="clockStyle"></span> and I am currently <span id="message"></span>

That seems to work fairly well for what I need it to do. If I need to show the time of the person looking at the page I think I can use the other clock, I just need to make sure I relabel the variables to avoid conflicts between script. I need to remember when writing in script " and ' are not okay. I have to use ʽʽ & ʼʼ from unicode. ʹ also works. I'm so used to typing using contractions and quotation marks when I say things that I forget in script they add special rules.

This post has been edited by Martha: Jun 18 2016, 10:42 PM
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
CharlesEF
post Jun 19 2016, 12:13 AM
Post #16


Programming Fanatic
********

Group: Members
Posts: 1,981
Joined: 27-April 13
From: Edinburg, Texas
Member No.: 19,088



That's OK. I was thinking of a different way but if you're happy. You might want to add the date also. Depending on the users timezone they could have a different date.

I use UTF-8 and " or ' work fine. I see you use UTF-16 so I'll make a note of the different quotes.

This post has been edited by CharlesEF: Jun 19 2016, 12:16 AM
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Martha
post Jun 19 2016, 07:47 AM
Post #17


Novice
**

Group: Members
Posts: 28
Joined: 17-June 16
Member No.: 24,336



If I started adding specific events for different days of the week like Saturday and Sunday I might need a way for the setup to get the day of the week, if not the actual date. Using the code you sent me, and order of operation I think the script might look something like this...
CODE

function showMessage(day, diem, hour)
{
  switch(day)
  {
   case "Saturday":
    switch(diem)
    {
     case "AM":
      switch(hour)
      {
       case "01":
        new_text = "Test 1am Saturday";
        break;
       case 10:
        new_text = "Test 10am Saturday";
        break;
      }
      break;
         }
     case "PM":
      switch(hour)
      {
       case "01":
        new_text = "Test 1pm Saturday";
        break;
       case 10:
        new_text = "Test 10pm Saturday";
        break;
      }
      break;
     }
    break;
   }
   case "Sunday":
    switch(diem)
    {
     case "AM":
      switch(hour)
      {
       case "01":
        new_text = "Test 1am Sunday";
        break;
       case 10:
        new_text = "Test 10am Sunday";
        break;
      }
      break;
         }
     case "PM":
      switch(hour)
      {
       case "01":
        new_text = "Test 1pm Sunday";
        break;
       case 10:
        new_text = "Test 10pm Sunday";
        break;
      }
      break;
     }
    break;
   }
   case "deafult":
    switch(diem)
    {
     case "AM":
      switch(hour)
      {
       case "01":
        new_text = "Test 1am default";
        break;
       case 10:
        new_text = "Test 10am default";
        break;
      }
      break;
         }
     case "PM":
      switch(hour)
      {
       case "01":
        new_text = "Test 1pm default";
        break;
       case 10:
        new_text = "Test 10pm default";
        break;
      }
      break;
     }
    break;
   }
    document.getElementById('message').innerHTML = new_text + " ʺHave a nice day";
    old_day = day;
    old_hour = hour;

I'll likely need to add an area like you did for the if old_hour != hour for the day aspect, I also need to find how to get a day of the week (not that it needs to be shown on the clock output) but still be checked. I think I have the right number of break; and } to close each aspect correctly. I don't know if a switch(default) would work for Monday-Friday or if I have to write out switch(Monday) switch(Tuesday) ... switch(Friday).

This post has been edited by Martha: Jun 19 2016, 07:49 AM
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Martha
post Jun 19 2016, 08:57 AM
Post #18


Novice
**

Group: Members
Posts: 28
Joined: 17-June 16
Member No.: 24,336



Googled "HTML Code Day of Week" and got a couple of scipts.

and this one, which only returns "undefined" as an output, meaning there is part missing to it.

again the one that works (first one) comes from w3.
I also found http://www.javascriptsource.com/time-date/day-of-week.html but that has a lot of variables and outputs that I don't need. I might start trying to take it apart to get what I do need, and learn on my own what makes it work.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
CharlesEF
post Jun 19 2016, 09:26 AM
Post #19


Programming Fanatic
********

Group: Members
Posts: 1,981
Joined: 27-April 13
From: Edinburg, Texas
Member No.: 19,088



Instead of adding more switch statements inside the showMessage() function (it can get hard to read) consider adding another function instead. The new function can handle the day. You can still pass the day to the showMessage() function then use the day to call the new function and return the day of the week. I assume you will be using the getDay() method which returns 0 thru 6. If you are planning on using the day of the week and the hour to display your custom messages then you would need to combine all the switch statements in the showMessage() function.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Martha
post Jun 19 2016, 10:39 AM
Post #20


Novice
**

Group: Members
Posts: 28
Joined: 17-June 16
Member No.: 24,336



Okay so I could have a state where if a 0 or a 6 is returned then play message from Sunday or Saturday, and a 1-5 would be default state. If I made a new function with separate messages for Saturday and Sunday I wouldn't want them to show up at the same time as my normal hourly M-F messages. How would I get a signal output to handle that.

It is Sunday 10am. I am at church I am getting ready for college.

The "I am at church" triggers from sunday while "I am getting ready for college" triggers from 10 am. Also I need to worry about getDay() working with the time offset so that it shows the day I am on, not the day the system accessing is on... I can figure this out ...

I could copy and past outputs for 1-5, but that takes up a lot of space and wasted characters to say the same thing over and over again. Okay lets see here ...
if(d == 0)
{
(Go to message string A)
}
else if(d == 6)
{
(Go to message string B)
}
else if(d < 6 and d >0)
{
(Go to message string default)
}

I know my language doesn't amount to a hill of beans but without adding an extra layer of case to what is already there and creating two new functions that provide the same output without stepping on the toes of each other. I know what I want it to do, I just need the terminology. I'll come back and look at this more after church, also it is Father's Day today.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post

3 Pages V  1 2 3 >
Reply to this topicStart new topic
1 User(s) are reading this topic (1 Guests and 0 Anonymous Users)
0 Members:

 



- Lo-Fi Version Time is now: 23rd April 2024 - 06:51 PM