main
side
curve
  1. Welcome to the new boards! Details here!

Using JavaScript to make the markup codes more versatile.

Discussion in 'Communications' started by Lobot_Omy, Aug 8, 2001.

Thread Status:
Not open for further replies.
  1. Lobot_Omy

    Lobot_Omy Moderator Emeritus star 6 VIP - Former Mod/RSA

    Registered:
    Jul 9, 2001
    OK, I've been meaning to do this for some time now. The reason why it took so long is because I've been trying to find more uses for JavaScript on these forums. There really isn't that much to do with JavaScript here, because there are a lot of limitations, but I perfected a couple of useful scripts that can be used. They are: alert messages, opening a URL in anew window, and "back to the top" button.

    Note: If you're planning on using JavaScript from this thread or writing your own scripts, pease read this thread first: [link=http://boards.theforce.net/message.asp?topic=5908119&replies=0]Jedi Council Guide To Proper JavaScript Use.[/link] Make sure that you follow the rules outlined in that thread to prevent any complications. Thanks.

    If you want to use any of my codes then what you do is simply type the markup code for a link ([link=some URL] blah [/link]), then instead of writing a URL in the link tag just insert one of the codes which I'll provide you with here.

    1. Alert messages.

    Coding:

    javascript:alert('Type_your_message_here.')

    [link=javascript:alert('Hey%20man.')] Example [/link]

    This is just a simple way to present messages. There are a couple of points that you should remember while using this code, though. Your messages cannot contain literal spaces, you have to substitute them with something else, like a:

    _ (underline character)

    or the actual code for a space character:

    \40 (Provided by Grimby the Hutt :) ).

    or,

    %20

    Next, if you want to insert a quote character into your message use this:

    \' or \"

    If you want to insert a carriage return use this:

    \r\n

    Also because the coding of this board does not work well with long strings of characters in the URL sections of the markup codes try to keep your messages short, otherwise the link will just show up as regular text on the page.

    2. Opening a URL in a new window.

    Coding:

    javascript:eek:pen('type the URL in here','');location.reload()

    [link=javascript:eek:pen('http://www.starwars.com','');location.reload()] Example (left-click only)[/link]

    This code makes it possible to open a URL in a new window by just left clicking the link, so the user wouldn't have to right click it and then go to "open in new window". An important note about this code is that it should be made clear that this link should be left-clicked, because some users might try to right click it and then go to "open in new window" and that could have terrible consequences.

    3. "back to the top" button.

    Coding:

    javascript:navigator.appName=='Netscape'?scrollTo(0,300):scroll(0,300)

    [link=javascript:navigator.appName=='Netscape'?scrollTo(0,300):scroll(0,300)] Example [/link]

    What this code does is it makes it possible to scroll to different parts of the page.

    Where you see the (0,300), those are the coordinates. The coordinates are in pixel units and the top left corner of the browser window is the starting point for counting off the coordinates (In other words its coordinates are (0,0)).

    I have found out through trial and error that the very top of the first post is about 300 pixels from the top of the page, so those are the coordinates that I have in the code right now. You can use this code as it is for "back to the top" buttons, or you can tinker around with the coordinates, through trial and error, to have it scroll to specific parts of the page. Only positive numbers can be entered as coordinates. Also because Netscape and Explorer have different coding to scroll a page I had to make it so the code would find out what browser you're using and then use the right code to scroll. That's why you see the coordinates listed there twice.

    This code would probably be best used in really long posts, like refere
     
  2. Riley Man

    Riley Man Jedi Master star 5

    Registered:
    Dec 19, 1999
    Just trying something regarding the 'open a new window'... If you use 'return false;' instead of 'location.reload();' I think it'll work a little cleaner. Testing it now... ;)

    [link=javascript:window.open('http://www.starwars.com/'); return false;]Star Wars[/link]

    Edit: I guess you can't have spaces inside the link tag.
    [link=javascript:window.open('http://www.starwars.com/');return(false);]Star Wars[/link]

    Edit again: Doesn't work anyway, since return false tells it not to perform the default action. I guess in real JavaScript you'd need to have the window.open part in the onClick event.

    [link=javascript:window.open('http://www.starwars.com/');window.location=window.location;]Star Wars[/link]
     
  3. Coolguy4522

    Coolguy4522 Jedi Youngling star 4

    Registered:
    Dec 21, 2000
    I have no idea what is going on here.
     
  4. The Jedi Apprentice

    The Jedi Apprentice Jedi Master star 4

    Registered:
    Nov 29, 1999
    I think you guys might have found a bug in the forum codes, actually. heh. I doubt ZeroSleep meant for folks to be able to use Javascipt via the link tags. That's something that should be fixed.
     
  5. howlrunner22

    howlrunner22 Moderator Emeritus star 5 VIP - Former Mod/RSA

    Registered:
    Oct 24, 1998
    Assume for a moment I have no knowledge whatsoever of computers and explain for the benefit of the unelucidated.
     
  6. Lobot_Omy

    Lobot_Omy Moderator Emeritus star 6 VIP - Former Mod/RSA

    Registered:
    Jul 9, 2001
    Just take your everyday link markup code as this one:

    [link= URL] Blah [/link]

    Then instead of URL you insert one of the JavaScript codings that I provided, changing some parts inside the codings that I tell you to change, like the text inside the alert message, or the URL in the open URL in new window.

    Simple as that.



    Riley Man, I tried to make my codes work as perfectly as possible. They should work fine, but if you do find a more optimal solution to a code, then feel free to post it here. By the way my location.reload() works the same way as window.location=window.location

    At first I just saved the page URL to a variable and then I used the variable to load the page again, but using the location.reload() works on same principles except it makes the code shorter.

     
  7. Valiowk

    Valiowk Jedi Grand Master star 6

    Registered:
    Apr 23, 2000
    Hmmm...sounds cool, but still doesn't seem like it will be used very often...
     
  8. Lobot_Omy

    Lobot_Omy Moderator Emeritus star 6 VIP - Former Mod/RSA

    Registered:
    Jul 9, 2001
    Yeah, I know, 'cause I understand that a lot of the people here aren't into coding HTML or JavaScript that much, but if a person wants to know how to do something that the markup codes can't then it's always here for the person to see.

    Besides I really hope that the people who are creating index threads and reference threads take some of these codings into consideration, so it would be easier for a user to navigate their post.
     
  9. Lobot_Omy

    Lobot_Omy Moderator Emeritus star 6 VIP - Former Mod/RSA

    Registered:
    Jul 9, 2001
    OK, I finally found a way to go around the no litteral spaces problem!!! :D For one I am upgrading one of the codes. Here it goes.

    Opening a URL in anew window.

    Code:

    [Edit] Updated the code again the last one didn't work on Netscape.

    javascript:eval(unescape('void%20open("URL goes here","")'))

    [link=javascript:eval(unescape('void%20open("http://www.starwars.com","")'))] Example [/link]

    This code is a bit longer, but at least it will work for people who are using Netscape.

    [/edit]

    That's it. You simply copy this code, insert it into a link tag right after the equals sign, and write in the URL where it says "URL goes here".

    In my original code I had to make it so the opening page reloaded after the link was clicked, because otherwise it would open a blank page, but now there's no need to reload the page anymore, because it won't try to open the blank page. :)

    Now that I found a way to go around using literal spaces in the code I have more freedom with JavaScript on these forums, therefore I'll have more codes coming! Stay tuned!
     
  10. Tellesto

    Tellesto Jedi Knight star 5

    Registered:
    Dec 7, 1999
    Versatility is not always the best course, especially for a message board with many users.

    For the code savy, it is a great idea, but otherwise it will fall on deaf ears.
     
  11. Lobot_Omy

    Lobot_Omy Moderator Emeritus star 6 VIP - Former Mod/RSA

    Registered:
    Jul 9, 2001
    Hmm, this new code for opening a new window is also safer than my previous one, because when you right-clicked the link with the previous code and went to open in new window it would open a whole bunch of new windows. This code doesn't do that. It opens only one extra window along with the new window with the URL in it, and that's it. So that's good.
     
  12. Valiowk

    Valiowk Jedi Grand Master star 6

    Registered:
    Apr 23, 2000
    UP! Can't let this thread be forgotten! :)
     
  13. Lobot_Omy

    Lobot_Omy Moderator Emeritus star 6 VIP - Former Mod/RSA

    Registered:
    Jul 9, 2001
    Thank you, Valiowk. :)
     
  14. Valiowk

    Valiowk Jedi Grand Master star 6

    Registered:
    Apr 23, 2000
    You're welcome! :)
     
  15. Night4554

    Night4554 Jedi Knight star 5

    Registered:
    Oct 9, 2000
    wow, i tried that first link on the open in new window after right clicking and selecting open in new window. All you guys try it!!! Right Click and Select Open in new window!!!
     
  16. Lobot_Omy

    Lobot_Omy Moderator Emeritus star 6 VIP - Former Mod/RSA

    Registered:
    Jul 9, 2001
    Umm, you probably shouldn't. It creates one hellova mess.
     
  17. Dark Lord of the Jedi

    Dark Lord of the Jedi Jedi Grand Master star 5

    Registered:
    Mar 5, 2000
    [link=javascript:alert('This%20is%20the%20cool!')]Reply[/link]

    ahhh, **** snowball. it will add a space into the reply if you don't have one within a certain amount of characters

    EDIT: Edited for language.
     
  18. Lobot_Omy

    Lobot_Omy Moderator Emeritus star 6 VIP - Former Mod/RSA

    Registered:
    Jul 9, 2001
    You can't put faces in there. Just use the text versions of the faces.

    Plus these boards have a limit on the length of the URL in the link tag, so you have to keep it short as well. I can't do anything about that, so that sorta sucks.

    Edit: Dark Lord of The Jedi, you just helped me find another loophole in the coding for these boards. I now have anotherupdate on my code. It's not really necessary for you do this, but if you want to type an anusually long message in the alert window then do this:

    Code for having very long messages in the alert window.

    This also requires you to create an image to preload some code.

    So create an image somewhere in your message using the image tag then place this in the URL portion of the tag.

    Code:
    javascript:eval(unescape('function%20a(t){alert(t)}'))

    Then create a link inside your post using the link tag an put this instead of the URL:

    Code:
    javascript:a('Type_anything_you_want_in_here.')

    This should work fine, except you'll have that ugly empty image box in your post, but that's the price you pay for having more freedom.

    [image=javascript:eval(unescape('function%20a(t){alert(t)}'))]

    [link=javascript:a('This%20way%20you%20can%20type%20longer%20messages,%20because%20the%20code%20takes%20less%20space.')] Example [/link]

    Note: The maximum amount of characters that can go into this code is 97. So if you really want to write something long then use these for spaces _, or some other 1 characters substitute for spaces.
     
  19. Dark Lord of the Jedi

    Dark Lord of the Jedi Jedi Grand Master star 5

    Registered:
    Mar 5, 2000
    [link=javascript:alert('yep.')]Reply[/link]
     
  20. GasCabbie

    GasCabbie Jedi Padawan star 4

    Registered:
    Jun 28, 2001
    [link=javascript:alert('You%20can%20use%20faces!')] :D [/link]







    ...aren't you going to click it? ;)

    Edit - I'm slow. I thought the issue was if you could use faces to link to your script. My bad.
     
  21. Lobot_Omy

    Lobot_Omy Moderator Emeritus star 6 VIP - Former Mod/RSA

    Registered:
    Jul 9, 2001
    Edit: Strange, that code up there for long alert messages doesn't work. Here's another one. You can type longer messages into this one.

    This goes into the image tag:
    javascript:a='Text and stuff goes here.'

    This goes in the link tag:
    javascript:alert(a)

    [link=javascript:alert(c)] Example [/link]

    [image=javascript:c='Put%20all%20your%20text%20here.%20This%20should%20work.%20Probably.%20Ahh,%20who%20knows?']

    Note: No it doesn't fit any more text in it. The limit is still 97 characters. Bummer. :(

    You can use these images as a clumsy way of holding lots of information. Here, I'll give you an example.

    [link=javascript:alert(a+b)] Long text [/link]

    [image=javascript:a='Text%20goes%20here.%20More%20text%20and%20more%20and.\n'] [image=javascript:a+='Text%20goes%20here.%20More%20text%20and%20more%20and.\n'] [image=javascript:a+='Text%20goes%20here.%20More%20text%20and%20more%20and.'] [image=javascript:b='\nText%20goes%20here.%20More%20text%20and%20more%20and.\n'] [image=javascript:b+='Text%20goes%20here.%20More%20text%20and%20more%20and.\n'] [image=javascript:b+='Text%20goes%20here.%20More%20text%20and%20more%20and.']


     
  22. snap-hiss

    snap-hiss Jedi Master star 5

    Registered:
    Aug 23, 2001
    [link=javascript:alert('nice')]nice[/link]



    !snap
     
  23. Darth Gleng

    Darth Gleng Jedi Youngling star 3

    Registered:
    Jun 17, 1999
    Coooool...I wondered if you could do this, but I didn't want to try it and get harrassed for messing with the boards! ;)

    [link=javascript:var%20stuff%20=%20prompt("Type%20something!");alert(stuff);]click![/link]
     
  24. Lobot_Omy

    Lobot_Omy Moderator Emeritus star 6 VIP - Former Mod/RSA

    Registered:
    Jul 9, 2001
    You still can't put it in sigs, though. They only check for the http:// thing and if that's not in there it doesn't make it into a link.
     
  25. Darth Gleng

    Darth Gleng Jedi Youngling star 3

    Registered:
    Jun 17, 1999
    Dammit!!! Astute members of the JC will notice I've been trying for the last 10 mins...
     
Thread Status:
Not open for further replies.