[SOLVED] Two problems with section_expand menu

The place to talk about things that are related to CMS Made simple, but don't fit anywhere else.
Post Reply
postiffm
Forum Members
Forum Members
Posts: 124
Joined: Tue Nov 30, 2010 12:16 am

[SOLVED] Two problems with section_expand menu

Post by postiffm »

CMS 1.9.4.2
MenuManager 1.7.6
section_expand template from http://wiki.cmsmadesimple.org/index.php ... ion_expand
My site: http://www.fellowshipbibleannarbor.org/

Problem 1: Persistence when changing pages. When I click a second-level link and thus go to that page, the menu usually collapses to a fully "closed" state. Sometimes another top-level heading will open up. I'd like the menu to stay the way I left it. I saw a reference to this problem here, but could not find a solution.

SOLUTION: See my reply to this post below.

Problem 2: When I expand one section, I'd like all other sections to collapse. Instead, they all stay open, making the menu very long down the left side of my page.

SOLUTION: Edit lib/helparea.js and change "no" in
var collapseprevious="no" //Collapse previously open content when opening present? (yes/no)

to "yes"
Last edited by postiffm on Sat Jul 09, 2011 3:12 am, edited 3 times in total.
postiffm
Forum Members
Forum Members
Posts: 124
Joined: Tue Nov 30, 2010 12:16 am

Re: Two problems with section_expand menu

Post by postiffm »

I don't understand exactly why my original post was put into the lounge. It seemed like my question concerned a built-in module provided with the package. What I was attempting to do was use the section_expand template suggested in the CMS made simple FAQ to implement a simple expanding vertical menu. I was having a couple of key problems (see previous post). The second one was easy to fix by changing one line in cms/lib/helparea.js. The first problem was a bit more involved since I had to learn what the enablepersist "mode" was in helparea.js, and I had to learn some basic javascript/cookie stuff that I didn't know up to this point.

So...enablepersist is an interesting feature because it allows a web page on your site to remember its menu state so that the next time you visit that page, it will go back to the menu state you had when you last left that page. That "feature" was not helpful to me because all I wanted to do was to remember the state of the menu on the page immediately before I navigated to the present page, and reconstruct that state so the menu would essentially not change its appearance on the way from one page to another.

So I added a "persistOnlyAcrossPages" mode and wrote it so that it would save the menu state in a cookie that is at the root of the site and so always accessible from one page to the next. I also cleaned up the code a bit, i.e. made some variables local to functions instead of gumming up the global namespace. Here is the revised lib/helparea.js:

Code: Select all

/***********************************************
* Contractible Headers script- © Dynamic Drive (www.dynamicdrive.com)
* This notice must stay intact for legal use. Last updated Oct 21st, 2003.
* Visit http://www.dynamicdrive.com/ for full source code
***********************************************/

var enablepersist="on" //Enable saving state of content structure using session cookies? (on/off)
// enablepersist is sophisticated: it remembers the last
// state of the page when you visited that page last; MAP wants to
// persist a menu from one page view to the next, and never remember
// what the menu looked like the last time I was on that page (5 days
// ago, perhaps!) because that is irrelevant to how I am browsing now.
var persistOnlyAcrossPages="on"  // (on/off)
var collapseprevious="yes" //Collapse previously open content when opening present? (yes/no)

if (document.getElementById){
document.write('<style type="text/css">')
document.write('.expand{display:none;}')
document.write('</style>')
}

function getElementbyClass(classname){
ccollect=new Array()
var inc=0
var i=0
var alltags=document.all? document.all : document.getElementsByTagName("*")
for (i=0; i<alltags.length; i++){
if (alltags[i].className==classname)
ccollect[inc++]=alltags[i]
}
}

function contractcontent(omit){
var inc=0
while (ccollect[inc]){
if (ccollect[inc].id!=omit)
ccollect[inc].style.display="none"
inc++
}
}

function expandcontent(cid){
if (typeof ccollect!="undefined"){
if (collapseprevious=="yes")
contractcontent(cid)
document.getElementById(cid).style.display=(document.getElementById(cid).style.display!="block")? "block" : "none"
}
}

function revivecontent(){
contractcontent("omitnothing")
    /* MAP added var to line below */
var selectedItem=getselectedItem()
selectedComponents=selectedItem.split("|")
for (i=0; i<selectedComponents.length-1; i++)
document.getElementById(selectedComponents[i]).style.display="block"
}

function get_cookie(Name) { 
var search = Name + "="
var returnvalue = "";
/* MAP added next line */
var offset = 0, end = -1;
if (document.cookie.length > 0) {
offset = document.cookie.indexOf(search)
if (offset != -1) { 
offset += search.length
end = document.cookie.indexOf(";", offset);
if (end == -1) end = document.cookie.length;
returnvalue=unescape(document.cookie.substring(offset, end))
}
}
return returnvalue;
}

/* MAP: This function would often call get_cookie unnecessarily twice; simplified it */
function getselectedItem(){
    var selectedItem = "";
    /* MAP added the 'if' for the new persistence mode */
    if (persistOnlyAcrossPages=="on") {
        selectedItem = get_cookie("currSiteMenuCookie");
    }
    else {
        selectedItem = get_cookie(window.location.pathname);
    }
    return selectedItem
}

function saveswitchstate(){
var inc=0, selectedItem=""
while (ccollect[inc]){
if (ccollect[inc].style.display=="block")
selectedItem+=ccollect[inc].id+"|"
inc++
}
/* MAP added the 'if' for the new persistence mode */
if (persistOnlyAcrossPages=="on") {
    document.cookie="currSiteMenuCookie="+selectedItem+"; path=/";
}
else {
    /* Here is the key: the cookie is saved to the default path, which
       is for the page itself, so it is not accessible to all pages. */
    document.cookie=window.location.pathname+"="+selectedItem; } }

function do_onload(){
getElementbyClass("expand")
if (enablepersist=="on" && typeof ccollect!="undefined")
revivecontent()
}


if (window.addEventListener)
window.addEventListener("load", do_onload, false)
else if (window.attachEvent)
window.attachEvent("onload", do_onload)
else if (document.getElementById)
window.onload=do_onload

if (enablepersist=="on" && document.getElementById)
window.onunload=saveswitchstate
Hope this helps someone else who has run into this problem.
Post Reply

Return to “The Lounge”