Hi Robert,
The suggestion you made was bit beyond me, so I asked a friend of mine
to take a look and he implemented your binary suggested excellently
using jquery
He added a menu.js file that looks like this for my 6 menus
menu.js
---------------
var MENUS = 6;
var menu_state
// stops modification of the menu_state during collapse/expand
functions
// whilst the menu is being reconstructed
var init_state = true;
// Restores the menu's state upon loading the document
$j(document).ready(restoreMenuState);
function restoreMenuState() {
menu_state = $j.cookie('menu_state');
// Sets a default value of 1 if nothing is in the cookie
if(menu_state == null || menu_state == 0)
menu_state = 1;
for(var i = 1, b = 1; i <= MENUS; i++, b = b << 1) {
if((menu_state & b) > 0) {
expand(i);
} else {
collapse(i);
}
}
init_state = false;
}
/**
* Saves the current state of the menu to the cookie
* using a bitmask in which the first bit maps to
* the first menu
*
* number - menu number
*/
function saveMenuState(number) {
menu_state = menu_state ^ (1 << (number-1));
$j.cookie('menu_state', menu_state, { path: '/'});
}
/**
* Collapses the menu identified by the given number
* i.e. collapse(2) will collapse the menu surrounded
* by div#menu2
*
* The image/link used to initiate this should have id
* 'toggle' followed by the number
*/
function collapse(number) {
$j('#toggle' + number).html("show");
$j('#toggle' + number).attr("onClick", "expand(" + number + ")");
if(init_state) {
$j('#menu' + number).hide();
} else {
$j('#menu' + number).slideUp(400, null);
saveMenuState(number);
}
}
/**
* Expands the menu identified by the given number
* i.e. expand(2) will expand the menu surrounded
* by div#menu2
*
* The image/link used to intiiate this should have
* id 'toggle' followed by the number
*/
function expand(number) {
$j('#toggle' + number).html("hide");
$j('#toggle' + number).attr("onClick", "collapse(" + number +
")");
if(init_state) {
$j('#menu' + number).show();
} else {
$j('#menu' + number).slideDown(400, null);
saveMenuState(number);
}
}
---------------------
Also added a jquery-prototype-fix.js
/*
* Both jQuery and Prototype javascript libraries use the $ variable,
so
* to keep them running smoothly together we must disable the jQuery
* $ and assign it to another variable, $j, so it may still be
accessible
*/
jQuery.noConflict();
var $j = jQuery;
----------------
Then in my view files it was as simple as
<h3>Words</h3><div id="toggle1"></div>
<div id="menu1">
content
</div>
<h3>Words</h3><div id="toggle2"></div>
<div id="menu2">
content
</div>
etc..
--------
Thank you Robert and thank you James for writing this code for me.
Dan
--
You received this message because you are subscribed to the Google Groups "Ruby
on Rails: Talk" group.
To post to this group, send email to [email protected].
To unsubscribe from this group, send email to
[email protected].
For more options, visit this group at
http://groups.google.com/group/rubyonrails-talk?hl=en.
