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.
Results 1 to 14 of 14
  1. #1
    Regular Coder
    Join Date
    Jul 2008
    Location
    UK
    Posts
    116
    Thanks
    4
    Thanked 0 Times in 0 Posts

    Javascript session image switching

    I have a site where i switch between two images using some JavaScript. What I need is to be able to set a session variable or something so that if someone selects shading on or off it sticks to that for the rest of the session.

    Any idea or even a point in the right direction. Do i need cookies or is there a simple way to do this


    http://www.tech4t.co.uk/territorymapping/pentagon/

  • #2
    Regular Coder
    Join Date
    Sep 2011
    Location
    Sweden
    Posts
    154
    Thanks
    1
    Thanked 22 Times in 22 Posts
    I wrote this a while ago (an alternative to session cookies):
    http://www.thomasfrank.se/sessionvars.html

    Basically you can just use the name property of the window object (the link above is just to a fancy wrapper for this):

    Code:
    // somewhere in your code when the user chooses a shade on img1
    window.name += "#shadeOn1#";
    
    // somewhere nearby when the user wants to switch off the shading on img1
    window.name = window.name.split('#shadeOn1#').join('');
    
    // somewhere else in your code even after page switching / page reload
    if(window.name.indexOf('#shadeOn1#')>=0){
      // apply shade
    };
    Last edited by ironboy; 09-27-2011 at 01:36 PM.

  • Users who have thanked ironboy for this post:

    AmmO (09-28-2011)

  • #3
    Regular Coder
    Join Date
    Aug 2010
    Posts
    974
    Thanks
    19
    Thanked 212 Times in 210 Posts
    Quote Originally Posted by ironboy View Post
    I wrote this a while ago (an alternative to session cookies):
    http://www.thomasfrank.se/sessionvars.html

    Basically you can just use the name property of the window object (the link above is just to a fancy wrapper for this):

    Code:
    // somewhere in your code when the user chooses a shade on img1
    window.name += "#shadeOn1#";
    
    // somewhere nearby when the user wants to switch off the shading on img1
    window.name = window.name.split('#shadeOn1#').join('');
    
    // somewhere else in your code even after page switching / page reload
    if(window.name.indexOf('#shadeOn1#')>=0){
      // apply shade
    };
    This doecn't work if user selects
    "open in new window"
    better to use cookies or query string

  • #4
    Regular Coder
    Join Date
    Sep 2011
    Location
    Sweden
    Posts
    154
    Thanks
    1
    Thanked 22 Times in 22 Posts
    @DaveyErwin:
    Depends on how much info you want to save, yes in this case a cookie would probably be better - but cookies can not store that much info and some corporate firewalls will cut off requests when the request header reaches a certain length (and cookies are part of the request header...)

  • #5
    Regular Coder
    Join Date
    Apr 2005
    Location
    Texas
    Posts
    448
    Thanks
    24
    Thanked 63 Times in 63 Posts
    @ironboy that may be so, but your hijacking a property that wasn't designed for this purpose... What happens when everyone starts using this? Would performance, or cross scripting issues arise?

  • #6
    Regular Coder
    Join Date
    Sep 2011
    Location
    Sweden
    Posts
    154
    Thanks
    1
    Thanked 22 Times in 22 Posts
    Been hijacking it for years. Seems stable Can only hold 2MB of data in Opera, much more in other browsers...
    Is totally cross-domain though and should not be used for sensitive data.

    But I agree with you: There are several more well defined possibilites for offlline storage (but as oftimes not very cross-browserish if you want to support IE). The best choice is a good library to mitigate browser differences like:
    http://www.jstorage.info/

    Also (off-topic) ran across this rather scary library that exposes just how many ways we can store persistant user data:
    http://samy.pl/evercookie/
    Last edited by ironboy; 09-28-2011 at 12:39 AM.

  • #7
    Regular Coder
    Join Date
    Apr 2005
    Location
    Texas
    Posts
    448
    Thanks
    24
    Thanked 63 Times in 63 Posts

  • #8
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    18,313
    Thanks
    203
    Thanked 2,563 Times in 2,541 Posts
    To revert to the question, yes, you should best use a cookie. You can also use the window.name trick as offered by ironboy. Window.name persists until the window is closed, but as Da\veyErwin points out this doesn't work if the user selects "open in new window". So prefer to use a cookie. And be sure not to store sensitive data in window.name because it will also be accessible by other sites that will be loaded in the same window.


    All advice is supplied packaged by intellectual weight, and not by volume. Contents may settle slightly in transit.

    All the code given in this post has been tested and is intended to address the question asked.
    Unless stated otherwise it is not just a demonstration.

  • #9
    Regular Coder
    Join Date
    Jul 2008
    Location
    UK
    Posts
    116
    Thanks
    4
    Thanked 0 Times in 0 Posts
    Ok so I need cookies to do it properly then. Ironboy I might take your suggestion on. It seems to be fit for purpose the client wants it to persist in their session but thats it.

    Any good cookie tutorials outthere mate

  • #10
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    18,313
    Thanks
    203
    Thanked 2,563 Times in 2,541 Posts
    Quote Originally Posted by AmmO View Post
    Any good cookie tutorials outthere mate
    Cookies have been covered in this forum a zillion times. Try using the Search feature. Or Google.
    Last edited by Philip M; 09-28-2011 at 11:54 AM.

    All the code given in this post has been tested and is intended to address the question asked.
    Unless stated otherwise it is not just a demonstration.

  • #11
    Regular Coder
    Join Date
    Sep 2011
    Location
    Sweden
    Posts
    154
    Thanks
    1
    Thanked 22 Times in 22 Posts
    PPK:s tutorial is concise:
    http://www.quirksmode.org/js/cookies.html

  • #12
    Regular Coder
    Join Date
    Jul 2008
    Location
    UK
    Posts
    116
    Thanks
    4
    Thanked 0 Times in 0 Posts
    Ok thanks for the help people.

    Question Ironboy is #shadeone1# supposed to be the JavaScript function i used to switch the images around?

  • #13
    Regular Coder
    Join Date
    Sep 2011
    Location
    Sweden
    Posts
    154
    Thanks
    1
    Thanked 22 Times in 22 Posts
    @AmmO: No it's just a flag (arbitrary name) that you can set and get.
    Depending on if it is set you could call different functions or the same function with different inparameters...

  • #14
    Regular Coder
    Join Date
    Jul 2008
    Location
    UK
    Posts
    116
    Thanks
    4
    Thanked 0 Times in 0 Posts
    OK In understand its just a way to store a variable across a browser session that can be used for selecting which function fire.

    OK I think I get it. I will have a crack at doing this.

    Thanks for the help guys


  •  

    Posting Permissions

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