Beefy Boxes and Bandwidth Generously Provided by pair Networks
Keep It Simple, Stupid
 
PerlMonks  

Re^2: Request: Collapsible Side Bar (working solution)

by holli (Monsignor)
on Jul 11, 2005 at 13:26 UTC ( #473921=note: print w/ replies, xml ) Need Help??


in reply to Re: Request: Collapsible Side Bar (working solution)
in thread Request: Collapsible Side Bar

That's a fine start. Personally I would like it more if I had a +/- button next to each nodelet heading so I could collapse/expand them separately.

However, all that is still useless when the page does not maintain it's state after clicking on a link. I don't think that can be done without "collaboration" from the webserver? It would have to send back the "nodelet state" information.

Update:
Thanks Corion for that idea (sometimes one can't see the obvious). Here is a modified version of the above that preserves state using a cookie.

<script type="text/javascript"> var state = true; var cookie = get_cookie("_anodelet_cookie"); if (cookie==null ) { cookie=true }; if (cookie=="" ) { cookie=true }; if (cookie=="true" ) { cookie=true }; if (cookie=="false" ) { cookie=false }; var lb = "\x5B"; var rb = "\x5D" function add_toggle_link() { var spn = document.createElement('span'); var rpn = document.createTextNode(' ( '); var txt = document.createTextNode( 'Toggle Page View' ); var lpn = document.createTextNode(' )'); var lnk = document.createElement('a'); lnk.href = "javascript:toggle_nodelets()"; lnk.appendChild(txt); var tbl = document.getElementById('titlebar-bottom'); var spns = tbl.getElementsByTagName('span'); var oldspn; var i = 0; while ( spns.item(i) ) { if (spns.item(i).getAttribute('class') == "addlinks") { oldspn = spns.item(i); break; } i++; } spn.appendChild(rpn); spn.appendChild(lnk); spn.appendChild(lpn); oldspn.appendChild(spn); } function toggle_nodelets(state) { if ( state == null ) { state = cookie; state = !state } set_cookie ('_anodelet_cookie', state); var elements = document.getElementsByTagName('table'); var elnum; var content_width = state ? '100%' : '80%'; var mystyle; mystyle = state ? "block" : "none"; document.getElementById('monkbar').style.display = mystyle; var tds = document.getElementsByTagName('td'); for (tnum = 0; tnum < tds.length; tnum++) { var td = eval("tds" + lb + "tnum" + rb); if (td.className == 'main_content') { td.style.width = content_width; break; } } for (elnum = 0; elnum < elements.length; elnum++) { var el = eval("elements" + lb + "elnum" + rb); if (el.className == 'nodelet_container') { el.style.display = mystyle; break; } } } function set_cookie (name,value,expires,path,domain,secure) { document.cookie = name + "=" + escape (value) + ((expires) ? "; expires=" + expires.toGMTString() : "") + ((path) ? "; path=" + path : "") + ((domain) ? "; domain=" + domain : "") + ((secure) ? "; secure" : ""); cookie=value; //alert ("set cookie " + value); } function get_cookie (name) { var arg = name + "="; var alen = arg.length; var clen = document.cookie.length; var i = 0; while (i < clen) { var j = i + alen; if (document.cookie.substring(i, j) == arg) return getCookieVal (j); i = document.cookie.indexOf(" ", i) + 1; if (i == 0) break; } return null; } function getCookieVal (offset) { var endstr = document.cookie.indexOf (";", offset); if (endstr == -1) endstr = document.cookie.length; //alert ("get cookie " + document.cookie.substring(offset, endstr) +); return unescape(document.cookie.substring(offset, endstr)); } add_toggle_link(); toggle_nodelets(cookie); </script>


holli, /regexed monk/


Comment on Re^2: Request: Collapsible Side Bar (working solution)
Download Code
Re^3: Request: Collapsible Side Bar (working solution)
by Corion (Pope) on Jul 11, 2005 at 13:27 UTC

    Just save the state either in a local cookie or via a request to a state-maintining server of your programming.

Log In?
Username:
Password:

What's my password?
Create A New User
Node Status?
node history
Node Type: note [id://473921]
help
Chatterbox?
and the web crawler heard nothing...

How do I use this? | Other CB clients
Other Users?
Others chanting in the Monastery: (7)
As of 2014-09-16 20:13 GMT
Sections?
Information?
Find Nodes?
Leftovers?
    Voting Booth?

    How do you remember the number of days in each month?











    Results (46 votes), past polls