.
The Open Protein Structure Annotation Network
PDB Keyword
.

Template:CollapseItem

    Table of contents
    No headers
    // CollapseItem template, by neilw, 2009
    // Versions
    //    1.01    09/08/09    neilw    Fixed occasion when inadvertent error alert is generated
    //    1.00    07/20/09    neilw    First release
    
    //NOTE: This template requires the file "collapse_icons.gif" to be installed in the location
    // specified below
    var icons_uri = "http://developer.mindtouch.com/@api/deki/files/4538/=collapse_icons.gif";
    // USAGE: template.collapsibleItem(item, show, hide, effect)
    //    "item": if specified, then insert this list xml.  Doesn't matter if the list is wrapped
    //        inside other elements.  Otherwise, find the next <UL> on the page just after the template
    //        call.
    //    "show": number of tree levels to collapse (default: 99).  This is to avoid very lengthy
    //        processing on very large trees.  However, the processing is on the client side, so it
    //        won't bog down the wiki server either way.
    //    "hide": if true, use "slide" effect to show/hide subtrees (default: false)
    //    "effect": Effect used to show/hide items.  Possible values:
    //        "default": appear/disappear.  Also used if "effect" is not specified.
    //        "slide": slide up/slide down.
    //        "fade": fade in/fade out
    
    // Args
    var item = $0 ?? $item;
    var show = $1 ?? $show;
    var hide = $2 ?? $hide ?? show;
    var effect = string.tolower($3 ?? $effect ?? 'default');
    
    // post-process args
    var error_msg = "";
    if (!list.contains(['default', 'slide', 'fade'], effect)) {
        let error_msg = "ERROR: collapseItem: invalid effect '" .. effect .. "'" ..
            " (allowable values are 'slide', 'fade', and 'default')";
        let effect = 'default';
    }
    
    var id = @id;
    var icon = (show == nil);
    var item_type = typeof(item);
    var item_xml = (item_type == "xml" ? item : nil);
    var item_id  = (item_type == "str" ? item : nil);
    
    // Output HTML
    <html>
    <head>
    <script type="text/javascript">"
      DekiWiki.$(document).ready(function($) {
        collapseItem_showhide($,"..json.emit(id)..","..json.emit(item_type)..","..json.emit(item_id)..","
          ..json.emit(show)..","..json.emit(hide)..","..json.emit(effect)..");
      });
    "</script>
    <script type="text/javascript">"
      function collapseItem_showhide($, id, item_type, divid, show, hide, effect) {
        var collapseIcon_hide = '0px -64px';
        var collapseIcon_show = '0px -80px';
        var icon = (show == null);
      // Find and initialize show/hide link
        var $a = $('a#'+id);
        if ($a.length == 0) return;    // Don't ask :-o
        $a.html(icon ?
            '<img src=\"/skins/common/icons/icon-trans.gif\" ' +
            'style=\"background-image:url(\\\'".. icons_uri .. "\\\'); ' +
            'background-position:' + collapseIcon_show + '\" /> ' :
            show);
      // Find the div
        var $div = (divid ? $('#'+divid) : ($a.next().length ? $a.next() : $a.parent().next()));
        if (! $div.length) {
            alert('ERROR: collapseItem(): can\\\'t find the element'); 
            return;
        }
        $div.hide();
     // Bind to click of the link
        $a.click(function() {
            if ($div.css('display') == 'none') { // Show!
                if      (effect == 'slide') $div.slideDown('fast');
                else if (effect == 'fade')  $div.fadeIn('fast');
                else $div.show();
    
                if (icon) $a.find('img').css('background-position', collapseIcon_hide);
                else      $(this).html(hide);
            }
            else { // Hide!
                if      (effect == 'slide') $div.slideUp('fast');
                else if (effect == 'fade')  $div.fadeOut('fast');
                else $div.hide();
    
                if (icon)	$a.find('img').css('background-position', collapseIcon_show);
                else 		$(this).html(show);
            }
            return(false);
        });
      }
    "</script>
    </head>
    <body>
      if (error_msg != "") <p style="color:red; font-weight:bold;">error_msg</p>;  // error message
      <a href="#" id="{{id}}">" "</a>;
      if (item_xml)
        <div style="display:none">item</div>;
    </body>
    </html>
    

    Reviews

    References

     

    No references found.

    Tag page
    • No tags

    Files (0)

     
    You must login to post a comment.
    All content on this site is licensed under a Creative Commons Attribution 3.0 License
    Powered by MindTouch