• Someone over on the website of the creator (Rob) of this plug-in posted something about wanting to have the default position of the list be collapsed on each refresh of the page:

    https://forum.robfelty.com/topic/default-collapsed

    I desperately needed this function for a site I’m building as well. Unfortunately, on that thread, Rob was quite dismissive of it, even though he uses this feature on his own blog. Also unfortunately, one user (abraomas) said the problem could be solved by deleting a bit of code in the collapsFunctions.js file, yet that didn’t work at all for me. Fortunately, I just found where Rob’s collapsFunctions.js file is on his site, then I copied and pasted it into my collapsFunctions.js file (replacing everything that was there before), and it worked!

    Since Rob appears to be unwilling to do it, I’ll take the liberty of posting the code here:

    /* Collapse Functions, version 1.4
    *
    *————————————————————————–*/
    String.prototype.trim = function() {
    return this.replace(/^\s+|\s+$/g,””);
    }

    function createCookie(name,value,days) {
    if (days) {
    var date = new Date();
    date.setTime(date.getTime()+(days*24*60*60*1000));
    var expires = “; expires=”+date.toGMTString();
    } else {
    var expires = “”;
    }
    document.cookie = name+”=”+value+expires+”; path=/”;
    }

    function readCookie(name) {
    var nameEQ = name + “=”;
    var ca = document.cookie.split(‘;’);
    for(var i=0;i < ca.length;i++) {
    var c = ca[i];
    while (c.charAt(0)==’ ‘) {
    c = c.substring(1,c.length);
    }
    if (c.indexOf(nameEQ) == 0) {
    return c.substring(nameEQ.length,c.length);
    }
    }
    return null;
    }

    function eraseCookie(name) {
    createCookie(name,””,-1);
    }
    function collapsAddLoadEvent(func) {
    var oldonload = window.onload;
    if (typeof window.onload != ‘function’) {
    window.onload = func;
    } else {
    window.onload = function() {
    if (oldonload) {
    oldonload();
    }
    func();
    }
    }
    }
    function autoExpandCollapse(collapsClass) {
    var cookies = document.cookie.split(‘;’);
    var cookiePattern = new RegExp(collapsClass+'(-[0-9]+|List-[0-9]+-[0-9]+|List-[0-9]+)’);
    var classPattern = new RegExp(‘^’ + collapsClass);
    var hide = collapsClass + ‘ ‘ + ‘collapse’
    var show = collapsClass + ‘ ‘ + ‘expand’
    for (var cookieIndex=0; cookieIndex<cookies.length; cookieIndex++) {
    var cookieparts= cookies[cookieIndex].split(‘=’);
    var cookiename=cookieparts[0].trim();
    var cookievalue=cookieparts[1].trim();
    if (cookiename.match(cookiePattern)) {
    var expand= document.getElementById(cookiename);
    if (expand) {
    var thisli = expand.parentNode;
    for (var childI=0; childI< thisli.childNodes.length; childI++) {
    if (thisli.childNodes[childI].nodeName.toLowerCase() == ‘span’) {
    theSpan=thisli.childNodes[childI];
    if (theSpan.className.match(classPattern)) {
    if ((theSpan.className == show && cookievalue ==1) ||
    (theSpan.className == hide && cookievalue ==0)) {
    var theOnclick=theSpan.onclick+””;
    var matches=theOnclick.match(/.*\(event, ?”([^”]*)”, ?”([^”]*)”.*\)/);
    var expand=matches[1].replace(/\\u25BA/, ‘\u25BA’);
    var collapse=matches[2].replace(/\\u25BC/, ‘\u25BC’);
    collapse=collapse.replace(/\\u2014/, ‘\u2014’);
    expandCollapse(theSpan,expand,collapse,0,collapsClass);
    }
    }
    }
    }
    }
    }
    }
    }

    function expandCollapse( e, expand,collapse, animate, collapsClass ) {
    var classPattern= new RegExp(‘^’ + collapsClass);
    if (expand==’expandImg’) {
    expand=expandSym;
    }
    if (collapse==’collapseImg’) {
    collapse=collapseSym;
    }
    if( e.target ) {
    src = e.target;
    } else if (e.className && e.className.match(classPattern)) {
    src=e;
    } else {
    try {
    src = window.event.srcElement;
    } catch (err) {
    }
    }

    srcList = src.parentNode;
    if (src.nodeName.toLowerCase() == ‘img’ ||
    src.parentNode.nodeName.toLowerCase() == ‘h2’) {
    srcList = src.parentNode.parentNode;
    } else if (src.parentNode.parentNode.nodeName.toLowerCase() == ‘h2’) {
    src=src.parentNode;
    srcList = src.parentNode.parentNode;
    }
    if (srcList.nodeName.toLowerCase() == ‘span’) {
    srcList= srcList.parentNode;
    src= src.parentNode;
    }
    childList = null;

    for( i = 0; i < srcList.childNodes.length; i++ ) {
    if( srcList.childNodes[i].nodeName.toLowerCase() == ‘ul’ ) {
    childList = srcList.childNodes[i];
    }
    }
    var hide = collapsClass + ‘ ‘ + ‘collapse’
    var show = collapsClass + ‘ ‘ + ‘expand’
    var theSpan = src.childNodes[0];
    var theId= childList.getAttribute(‘id’);
    if (theSpan.className!=’sym’) {
    theSpan = theSpan.childNodes[0];
    theId = childList.childNodes[0].getAttribute(‘id’);
    }
    if( src.getAttribute( ‘class’ ) == hide ) {
    createCookie(theId,0,7);
    src.setAttribute(‘class’,show);
    src.setAttribute(‘title’,’click to expand’);
    theSpan.innerHTML=expand;
    if (animate==1) {
    Effect.BlindUp(childList, {duration: 0.5});
    } else {
    childList.style.display = ‘none’;
    }
    } else {
    createCookie(theId,1,7);
    src.setAttribute(‘class’,hide);
    src.setAttribute(‘title’,’click to collapse’);
    theSpan.innerHTML=collapse;
    if (animate==1) {
    Effect.BlindDown(childList, {duration: 0.5});
    } else {
    childList.style.display = ‘block’;
    }
    }

    if( e.preventDefault ) {
    e.preventDefault();
    }

    return false;
    }

Viewing 6 replies - 1 through 6 (of 6 total)
  • Thread Starter blisshaha

    (@blisshaha)

    Note: I just found that this doesn’t look like it’s working in the most recent version of IE8. It works in the most recent versions of Firefox and Safari, though.

    Anyone have any idea how to fix this? Please!

    Blisshaha,

    I run the development versions of all my plugins on my blog, which are hosted in the wordpress directory (look for the other versions link – the development version is art the bottom.)

    Also note that if you expand a category on my blog, then refresh the page, it is still expanded. If you don’t like this, the easiest way to disable it is to comment out this line in collapscatlist.php

    echo"
    collapsAddLoadEvent(function() {
      autoExpandCollapse('collapsCat');
    });
    ";

    I am considering adding this as an option.

    I have tested this in IE8, and it seems to work fine.

    Cheers.

    Rob

    Thread Starter blisshaha

    (@blisshaha)

    Thanks for the response, Rob. I’m glad you’re thinking about making it an option. That would be great!

    I tried what you suggested (after I updated to v. 1.01, which might not have been a good idea) and it still doesn’t seem to work in my IE8. (Although, I recently did a Windows Update and noticed that there were some other changes in how IE rendered my design. It has made me think there were some IE updates. But I’m not sure. Maybe that’s why it’s still not working for me.)

    BTW, it may be a bit misleading to say I’m looking for the plug-in to be collapsed by default since you’re right that you don’t have it like that on your blog. I wouldn’t mind it if they did collapse by default; that would work for me. But I also wouldn’t mind if the option was to have it like you have it on your blog: the status of the collapsing or expanding is displayed on refresh however the user left it. So when I expand a category on your blog (in any browser), it will stay expanded on refresh (or browsing to a new page) if I left it expanded. However, if I collapse it back and then refresh, it stays collapsed. Was the work around you just posted supposed to make it work like your blog does? Could you just let us know how you get it to do that?

    Thanks again for the support.

    Blisshaha,

    As far as I know, the way you describe it is how the plugin has worked since version 0.6.5. I also just added an advanced option in the development version to ignore cookies altogether.

    Rob
    p.s. I respond more frequently to topics on my own forum

    Hey Rob, i just downloaded and loaded the development version. But where is the option to ignore cookies? Please tell me because I too want to reset the plugin on each and every page refresh. It looks ugly if the categories are expanded. I mean seriously!!

    Thanks

    really don’t know how can work it out, anyone can help?

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘[Plugin: Collapsing Categories] Default Collapsed’ is closed to new replies.