Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Page 1 of 2 12 LastLast
Results 1 to 15 of 16
  1. #1
    New Coder
    Join Date
    Feb 2012
    Posts
    56
    Thanks
    5
    Thanked 0 Times in 0 Posts

    Javascript Crystal Ball

    Hello,
    I am trying to find some help here. This script opens a new window after clicking the 'Ask Me' button. This is a two part question - first, I want to center the forms. See attachment to align with the rest of the lettering. Or just center.

    Second, I would like the "answer" to appear in the box with my current script, perhaps just below the "question" form - not in a new window. Sort of like this script http://www.mysticalball.com here is the link to my actual script and page http://www.sphynxlair.com/crystal%20ball.php

    Any help would be appreciated.

    -Tom


    Code:
    <table border="0" bgcolor="#000000" cellspacing="0" cellpadding="3">
      <tr>
        <td width="100%">
    <img src="http://www.sphynxlair.com/images/Crystal Ball.png" border="0" alt="" /></a>
    <center><img src="http://www.sphynxlair.com/images/crystalball.gif" border="0" alt="" /></a></center>
    <img src="http://www.sphynxlair.com/images/yes.png" border="0" alt="" /></a><br /><br /><br />
    <form name="input1">
    <input name="textfield" size=63>
    </form><br />
    <form>
    <input type="button" name="button1" value="Ask Me!"
    onClick="getAnswers()">
    </form>
    </td>
    </tr>
    </table>
    <script language="JavaScript">
    function getAnswers() {
    time = new Date()
    randominteger = time.getSeconds()
    if (document.input1.textfield.value == "") { 
    alert("You didn't enter anything into the Crystal Ball!!!")
    return
    }
    if (randominteger <= 3) answer="Did you really think so? Hahaha, I'm laughing now at your pitiful chances."
    if ((randominteger >= 4) && (randominteger <= 6)) answer ="Yeah, it it's got a 65% chance of happening."
    if ((randominteger >= 7) && (randominteger <= 9)) answer ="Oh come on! No way!"
    if ((randominteger >= 10) && (randominteger <= 12)) answer ="As sure as I'm made of glass, this is likely to happen."
    if ((randominteger >= 13) && (randominteger <= 15)) answer ="Why are you asking A CRYSTAL BALL? Do you really believe the answers?"
    if ((randominteger >= 16) && (randominteger <= 18)) answer ="Give me a break, give me a break, break me off a piece of that NO!"
    if ((randominteger >= 19) && (randominteger <= 21)) answer ="Good chances lie on the horizon."
    if ((randominteger >= 22) && (randominteger <= 24)) answer ="Ask me again, I am restless and overworked."
    if ((randominteger >= 25) && (randominteger <= 27)) answer ="Do you know how the Crystal Ball works? There's your answer."
    if ((randominteger >= 28) && (randominteger <= 30)) answer ="As the sun is hot, your answer is YES."
    if ((randominteger >= 31) && (randominteger <= 33)) answer ="Did you get drunk last weekend? There's your answer."
    if ((randominteger >= 34) && (randominteger <= 36)) answer ="Forget about it"
    if ((randominteger >= 37) && (randominteger <= 39)) answer ="Yeah, it could happen. 80% chance."
    if ((randominteger >= 40) && (randominteger <= 42)) answer ="Hitler has a better chance of raising from the dead."
    if ((randominteger >= 43) && (randominteger <= 45)) answer ="If you really think so, then it shall be."
    if ((randominteger >= 46) && (randominteger <= 48)) answer ="Who said ambiguous answers were bad? Not me, so YES!"
    if ((randominteger >= 49) && (randominteger <= 51)) answer ="You think I'm going to answer that after a day of hard work? Ask again later."
    if ((randominteger >= 52) && (randominteger <= 54)) answer ="If you own a pet, yes. Otherwise, no."
    if ((randominteger >= 55) && (randominteger <= 57)) answer ="The sun will rise in the east and set in the west. Thank you Captain Obvious. YES!"
    if ((randominteger >= 58) && (randominteger <= 60)) answer ="I'm laughing hard, very hard. You'd better ask again."
    
    var newWindow = window.open("","Results","width=300,height=300")
    newWindow.document.write("<html><body bgcolor='#000000' text='#FFFFCC' link='#00FFFF' alink='#000066' vlink='#6666FF'>")
    newWindow.document.write("<P align='center'>Your Question:</P><P></P>")
    newWindow.document.write("<P align='center'>" + document.input1.textfield.value + "</P>")
    newWindow.document.write("<P></P><P></P><P></P><P align='center'>The Great Crystal Ball Has Answered:</P><P></P>")
    newWindow.document.write("")
    newWindow.document.write("<P align='center'>" + answer + "</P>")
    newWindow.document.write("<P></P><P></P><P align='center'><A HREF='javascript:window.close()'>Close Me</A></P>")
    }
    
    </script>
    
    </tbody>
    </table>
    Attached Thumbnails Attached Thumbnails Javascript Crystal Ball-screen-shot-2013-05-19-5.38.39-pm.jpg  

  • #2
    Senior Coder jmrker's Avatar
    Join Date
    Aug 2006
    Location
    FL
    Posts
    3,026
    Thanks
    36
    Thanked 494 Times in 488 Posts
    That's a pretty old script your copying. language="javascript" is long deprecated.

    Here a modification for you to consider...
    Code:
    <!DOCTYPE HTML>
    <html>
    <head>
    <title> Crystal Ball </title>
    <meta charset="utf-8">
    
    <style type="text/css">
     #answer { background:black; color:yellow; }
     table { background:black; margin-left:auto; margin-right:auto; }
     body { background:black; }
    </style>
    
    </head>
    <body>
    <form id="myForm" action="" method="post" onsubmit="return false">
    <table border="0" cellspacing="0" cellpadding="3">
     <tbody>
      <tr>
       <th width="100%">
        <img src="http://www.sphynxlair.com/images/Crystal Ball.png" border="0" alt="ball heading" /><br />
        <img src="http://www.sphynxlair.com/images/crystalball.gif" border="0" alt="ball image" /><br />
        <img src="http://www.sphynxlair.com/images/yes.png" border="0" alt="yes.png" /><br /><br />
        <input id="textfield" size="63" value=""> 
        <input type="button" value="Ask Me!" onclick="getAnswer()"> <p /> <div id="answer"></div>
       </th>
      </tr>
     </tbody>
    </table>
    </form>
    
    <script type="text/javascript">
    // Modified for: http://www.codingforums.com/showthread.php?t=295608
    
    var msg = [
      "Did you really think so? Hahaha\, I'm laughing now at your pitiful chances.",
      "Yeah\, it it's got a 65% chance of happening.",
      "Oh come on! No way!",
      "As sure as I'm made of glass\, this is likely to happen.",
      "Why are you asking A CRYSTAL BALL? Do you really believe the answers?",
      "Give me a break\, give me a break\, break me off a piece of that NO!",
      "Good chances lie on the horizon.",
      "Ask me again\, I am restless and overworked.",
      "Do you know how the Crystal Ball works? There's your answer.",
      "As the sun is hot\, your answer is YES.",
      "Did you get drunk last weekend? There's your answer.",
      "Forget about it",
      "Yeah\, it could happen. 80% chance.",
      "Hitler has a better chance of raising from the dead.",
      "If you really think so\, then it shall be.",
      "Who said ambiguous answers were bad? Not me\, so YES!",
      "You think I'm going to answer that after a day of hard work? Ask again later.",
      "If you own a pet\, yes. Otherwise\, no.",
      "The sun will rise in the east and set in the west. Thank you Captain Obvious. YES!",
      "I'm laughing hard\, very hard. You'd better ask again."  // No comma needed at end
    ];
    
    function getAnswer() {
      var dt = new Date();
      var rndSec = dt.getSeconds();
      if (document.getElementById('textfield').value == "") { 
        alert("You didn't enter anything into the Crystal Ball!!!");
        return;
      }
      var rndMsg = rndSec % 20;
      var answer = msg[rndMsg];
      document.getElementById('answer').innerHTML = answer;
    }
    </script>
    
    </body>
    </html>
    If it's for homework, better be able to defend the modulo logic substitution.

  • Users who have thanked jmrker for this post:

    tommydamic68 (05-26-2013)

  • #3
    New Coder
    Join Date
    Feb 2012
    Posts
    56
    Thanks
    5
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by jmrker View Post
    That's a pretty old script your copying. language="javascript" is long deprecated.

    Here a modification for you to consider...
    Code:
    <!DOCTYPE HTML>
    <html>
    <head>
    <title> Crystal Ball </title>
    <meta charset="utf-8">
    
    <style type="text/css">
     #answer { background:black; color:yellow; }
     table { background:black; margin-left:auto; margin-right:auto; }
     body { background:black; }
    </style>
    
    </head>
    <body>
    <form id="myForm" action="" method="post" onsubmit="return false">
    <table border="0" cellspacing="0" cellpadding="3">
     <tbody>
      <tr>
       <th width="100%">
        <img src="http://www.sphynxlair.com/images/Crystal Ball.png" border="0" alt="ball heading" /><br />
        <img src="http://www.sphynxlair.com/images/crystalball.gif" border="0" alt="ball image" /><br />
        <img src="http://www.sphynxlair.com/images/yes.png" border="0" alt="yes.png" /><br /><br />
        <input id="textfield" size="63" value=""> 
        <input type="button" value="Ask Me!" onclick="getAnswer()"> <p /> <div id="answer"></div>
       </th>
      </tr>
     </tbody>
    </table>
    </form>
    
    <script type="text/javascript">
    // Modified for: http://www.codingforums.com/showthread.php?t=295608
    
    var msg = [
      "Did you really think so? Hahaha\, I'm laughing now at your pitiful chances.",
      "Yeah\, it it's got a 65% chance of happening.",
      "Oh come on! No way!",
      "As sure as I'm made of glass\, this is likely to happen.",
      "Why are you asking A CRYSTAL BALL? Do you really believe the answers?",
      "Give me a break\, give me a break\, break me off a piece of that NO!",
      "Good chances lie on the horizon.",
      "Ask me again\, I am restless and overworked.",
      "Do you know how the Crystal Ball works? There's your answer.",
      "As the sun is hot\, your answer is YES.",
      "Did you get drunk last weekend? There's your answer.",
      "Forget about it",
      "Yeah\, it could happen. 80% chance.",
      "Hitler has a better chance of raising from the dead.",
      "If you really think so\, then it shall be.",
      "Who said ambiguous answers were bad? Not me\, so YES!",
      "You think I'm going to answer that after a day of hard work? Ask again later.",
      "If you own a pet\, yes. Otherwise\, no.",
      "The sun will rise in the east and set in the west. Thank you Captain Obvious. YES!",
      "I'm laughing hard\, very hard. You'd better ask again."  // No comma needed at end
    ];
    
    function getAnswer() {
      var dt = new Date();
      var rndSec = dt.getSeconds();
      if (document.getElementById('textfield').value == "") { 
        alert("You didn't enter anything into the Crystal Ball!!!");
        return;
      }
      var rndMsg = rndSec % 20;
      var answer = msg[rndMsg];
      document.getElementById('answer').innerHTML = answer;
    }
    </script>
    
    </body>
    </html>
    If it's for homework, better be able to defend the modulo logic substitution.

    Thank you! Works great! So after my final layout, there is something I would like to add, hope you can help once again. I would like to add text in the input field but when clicked it disappears. I believe it's something with onFocus="this.value=''" blah, blah...blah. I can't get it to work in the code you supplied me.

    Is there also a way to "hide" this piece of the code so it's not "viewable" when viewing the page source?

    Code:
    "Did you really think so? Hahaha\, I'm laughing now at your pitiful chances.",
      "Yeah\, it it's got a 65% chance of happening.",
      "Oh come on! No way!",
      "As sure as I'm made of glass\, this is likely to happen.",
      "Why are you asking A CRYSTAL BALL? Do you really believe the answers?",
      "Give me a break\, give me a break\, break me off a piece of that NO!",
      "Good chances lie on the horizon.",
      "Ask me again\, I am restless and overworked.",
      "Do you know how the Crystal Ball works? There's your answer.",
      "As the sun is hot\, your answer is YES.",
      "Did you get drunk last weekend? There's your answer.",
      "Forget about it",
      "Yeah\, it could happen. 80% chance.",
      "Hitler has a better chance of raising from the dead.",
      "If you really think so\, then it shall be.",
      "Who said ambiguous answers were bad? Not me\, so YES!",
      "You think I'm going to answer that after a day of hard work? Ask again later.",
      "If you own a pet\, yes. Otherwise\, no.",
      "The sun will rise in the east and set in the west. Thank you Captain Obvious. YES!",
      "I'm laughing hard\, very hard. You'd better ask again."
    Any help would be appreciated.

    Also here is the final product in the attachment. Made some changes.Here is the new URL http://www.sphynxlair.com/mysticalseer.php
    Attached Thumbnails Attached Thumbnails Javascript Crystal Ball-screen-shot-2013-05-26-9.30.24-am.jpg  
    Last edited by tommydamic68; 05-26-2013 at 02:56 PM.

  • #4
    Senior Coder jmrker's Avatar
    Join Date
    Aug 2006
    Location
    FL
    Posts
    3,026
    Thanks
    36
    Thanked 494 Times in 488 Posts

    Lightbulb

    I'm not entirely sure what you mean by:
    "I would like to add text in the input field but when clicked it disappears."

    Do you mean the input field disappears? If so, how will you ask the next question?

    Do you mean the text that the user types into the input field.
    If yes, just clear the field after the answer is displayed, like this...
    Code:
    function getAnswer() {
      var dt = new Date();
      var rndSec = dt.getSeconds();
      if (document.getElementById('textfield').value == "") { 
        alert("You didn't enter anything into the Crystal Ball!!!");
        return;
      }
      var rndMsg = rndSec % 20;
      var answer = msg[rndMsg];
      document.getElementById('answer').innerHTML = answer;
      document.getElementById('textfield').value == "";
    }

    To answer your second question, No ... it is not possible to hide the code.
    You could put it into an external JS file, but that would be just as viewable.

    Lots of people wish to hide their "secret" code, but there are no secrets in JS.
    You can obfuscate it, but you cannot hide it.
    See: http://stackoverflow.com/questions/2...avascript-code

  • #5
    New Coder
    Join Date
    Feb 2012
    Posts
    56
    Thanks
    5
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by jmrker View Post
    I'm not entirely sure what you mean by:
    "I would like to add text in the input field but when clicked it disappears."

    Do you mean the input field disappears? If so, how will you ask the next question?

    Do you mean the text that the user types into the input field.
    If yes, just clear the field after the answer is displayed, like this...
    Code:
    function getAnswer() {
      var dt = new Date();
      var rndSec = dt.getSeconds();
      if (document.getElementById('textfield').value == "") { 
        alert("You didn't enter anything into the Crystal Ball!!!");
        return;
      }
      var rndMsg = rndSec % 20;
      var answer = msg[rndMsg];
      document.getElementById('answer').innerHTML = answer;
      document.getElementById('textfield').value == "";
    }

    To answer your second question, No ... it is not possible to hide the code.
    You could put it into an external JS file, but that would be just as viewable.

    Lots of people wish to hide their "secret" code, but there are no secrets in JS.
    You can obfuscate it, but you cannot hide it.
    See: http://stackoverflow.com/questions/2...avascript-code
    As far as what I am looking for with the disappearing text - check out this eight ball script - you will se the text "Enter your question here." then one you begin typing it disappears. then continues to say "ask me another question if you wish." in the text field. http://www.nifter.com/magic_8_ball/a...ine_games.htm?


    As for the secret code - I just wanted to hide it so if someone was crafty at viewing the source they wouldn't see the answers - sort of spoils it.
    Last edited by tommydamic68; 05-26-2013 at 04:43 PM.

  • #6
    Regular Coder
    Join Date
    Jan 2013
    Location
    Germany
    Posts
    578
    Thanks
    4
    Thanked 77 Times in 77 Posts
    You can replace the msg variable in his script with

    Code:
    function a(b) {
        return b.replace(/[a-zA-Z]/g,function(c){return String.fromCharCode((c<="Z"?90:122)>=(c=c.charCodeAt(0)+13)?c:c-26);})
    }
    
    var msg = ["Qvq lbh ernyyl guvax fb? Ununun, V'z ynhtuvat abj ng lbhe cvgvshy punaprf.","Lrnu, vg vg'f tbg n 65% punapr bs unccravat.","Bu pbzr ba! Ab jnl!","Nf fher nf V'z znqr bs tynff, guvf vf yvxryl gb unccra.","Jul ner lbh nfxvat N PELFGNY ONYY? Qb lbh ernyyl oryvrir gur nafjref?","Tvir zr n oernx, tvir zr n oernx, oernx zr bss n cvrpr bs gung AB!","Tbbq punaprf yvr ba gur ubevmba.","Nfx zr ntnva, V nz erfgyrff naq birejbexrq.","Qb lbh xabj ubj gur Pelfgny Onyy jbexf? Gurer'f lbhe nafjre.","Nf gur fha vf ubg, lbhe nafjre vf LRF.","Qvq lbh trg qehax ynfg jrrxraq? Gurer'f lbhe nafjre.","Sbetrg nobhg vg","Lrnu, vg pbhyq unccra. 80% punapr.","Uvgyre unf n orggre punapr bs envfvat sebz gur qrnq.","Vs lbh ernyyl guvax fb, gura vg funyy or.","Jub fnvq nzovthbhf nafjref jrer onq? Abg zr, fb LRF!","Lbh guvax V'z tbvat gb nafjre gung nsgre n qnl bs uneq jbex? Nfx ntnva yngre.","Vs lbh bja n crg, lrf. Bgurejvfr, ab.","Gur fha jvyy evfr va gur rnfg naq frg va gur jrfg. Gunax lbh Pncgnva Boivbhf. LRF!","V'z ynhtuvat uneq, irel uneq. Lbh'q orggre nfx ntnva."];
    and then change the output to

    Code:
    document.getElementById('answer').innerHTML = a(answer);
    Not that it's actually safe that way. Anyone with some knowledge will still get all messages within a matter of ten seconds. But at least it's not instantly visible.

  • #7
    New Coder
    Join Date
    Feb 2012
    Posts
    56
    Thanks
    5
    Thanked 0 Times in 0 Posts
    Is there a portion of the code I could keep on my server side?

  • #8
    New Coder
    Join Date
    Feb 2012
    Posts
    56
    Thanks
    5
    Thanked 0 Times in 0 Posts
    Also, how do I change the color of the form field from white to another color. Also - how to change the font color of the "answers."

    thanks,
    Last edited by tommydamic68; 05-27-2013 at 02:38 PM.

  • #9
    Senior Coder jmrker's Avatar
    Join Date
    Aug 2006
    Location
    FL
    Posts
    3,026
    Thanks
    36
    Thanked 494 Times in 488 Posts

    Arrow

    Quote Originally Posted by tommydamic68 View Post
    Is there a portion of the code I could keep on my server side?
    And still not be seen by the user? Nope.

  • #10
    Senior Coder jmrker's Avatar
    Join Date
    Aug 2006
    Location
    FL
    Posts
    3,026
    Thanks
    36
    Thanked 494 Times in 488 Posts

    Arrow

    Quote Originally Posted by tommydamic68 View Post
    Also, how do I change the color of the form field from white to another color. Also - how to change the font color of the "answers."

    thanks,
    CSS is your friend.

    See background-color and color for the elements in question.

  • #11
    New Coder
    Join Date
    Feb 2012
    Posts
    56
    Thanks
    5
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by jmrker View Post
    CSS is your friend.

    See background-color and color for the elements in question.
    The standard CSS for the input field will not change the color via CSS. Any suggestions?

    Code:
    input{
      background-color : #99ffff;
    }

  • #12
    Senior Coder jmrker's Avatar
    Join Date
    Aug 2006
    Location
    FL
    Posts
    3,026
    Thanks
    36
    Thanked 494 Times in 488 Posts

    Lightbulb

    Quote Originally Posted by tommydamic68 View Post
    The standard CSS for the input field will not change the color via CSS. Any suggestions?

    Code:
    input{
      background-color : #99ffff;
    }
    works for me.
    Code:
    <!DOC HTML>
    <html>
    <head>
    <title> Untitled </title>
    <style type="text/css">
    input {background-color:orange}
    </style>
    
    </head>
    <body>
    <input type="text">
    </body>
    </html>
    Try putting your assignment in quotes.

  • #13
    Regular Coder
    Join Date
    Jan 2013
    Location
    Germany
    Posts
    578
    Thanks
    4
    Thanked 77 Times in 77 Posts
    No response to my addition? Disappointing.

  • #14
    New Coder
    Join Date
    Feb 2012
    Posts
    56
    Thanks
    5
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by Airblader View Post
    No response to my addition? Disappointing.
    I'm sorry- I can't find the code your asking me to replace.

  • #15
    New Coder
    Join Date
    Feb 2012
    Posts
    56
    Thanks
    5
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by jmrker View Post
    works for me.
    Code:
    <!DOC HTML>
    <html>
    <head>
    <title> Untitled </title>
    <style type="text/css">
    input {background-color:orange}
    </style>
    
    </head>
    <body>
    <input type="text">
    </body>
    </html>
    Try putting your assignment in quotes.
    Are you adding that code into the HTML? Because I don't have that code in my HTML - it's " input Id"

    I amsowhatcof an amateur at this by the way so thanks for the patience from everyone.


  •  
    Page 1 of 2 12 LastLast

    Posting Permissions

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