← Back to branch summary

~loggerhead-team/loggerhead/trunk-rich

« back to all changes in this revision

Viewing changes to loggerhead/templates/master.kid

  • Committer: Robey Pointer
  • Date: 2007-01-06 05:02:02 UTC
  • Revision ID: robey@lag.net-20070106050202-i1hzwt613qigsin3
refactor and clean up the javascript code for the expand/collapse buttons,
and apply the same logic to files being diff'd on the revision view.  the
primary difference is that a revision starts out expanded, since otherwise
there's not much to see.  also, change the terminology from "show/hide" to
"expand/collapse" on nicholas allen's recommendation.

Show diffs side-by-side

added added

removed removed

Lines of Context:
loggerhead/templates/master.kid
50
50
    <a title="Show revision ${history.get_revno(revid)}" href="${branch.url([ '/revision', revid ], start_revid=start_revid, file_id=file_id, q=query)}" class="revlink"> ${text} </a>
51
51
</span>
52
52
 
 
53
<span py:def="use_expand_buttons()">
 
54
        <!-- this is totally matty's fault.  i don't like javacsript. ;) -->
 
55
        <script type="text/javascript"> // <!--
 
56
 
 
57
        function getElementsByClass(name) {
 
58
            var filter = function(node) {
 
59
                // cannot filter here.  treeWalker will skip the entire subtree if you reject. :(
 
60
                return NodeFilter.FILTER_ACCEPT;
 
61
            };
 
62
            var treeWalker = document.createTreeWalker(document.body, NodeFilter.SHOW_ELEMENT, { acceptNode: filter }, false);
 
63
            
 
64
            var ret = new Array();
 
65
            while (treeWalker.nextNode()) {
 
66
                var classes = treeWalker.currentNode.className.split(' ');
 
67
                for (var i = 0; i < classes.length; i++) {
 
68
                    // is the string either identical, or startsWith?
 
69
                    if (classes[i].indexOf(name) == 0) { ret.push(treeWalker.currentNode); }
 
70
                }
 
71
            }
 
72
            return ret;
 
73
        }
 
74
 
 
75
        function displayDetails(name, display) {
 
76
            var dthide = 'inline', dtshow = 'none';
 
77
            if (display == 'none') { dthide = 'none'; dtshow = 'inline'; }
 
78
            document.getElementById('hide-' + name).style.display = dthide;
 
79
            document.getElementById('show-' + name).style.display = dtshow;
 
80
            var elem = document.getElementById('details-' + name);
 
81
            if (elem) { elem.style.display = display; }
 
82
            var nodes = getElementsByClass('details-' + name);
 
83
            for (var i = 0; i < nodes.length; i++) {
 
84
                nodes[i].style.display = display;
 
85
            }
 
86
        }
 
87
        
 
88
        function contains(arr, item) { for (var i = 0; i < arr.length; i++) { if (arr[i] == item) { return true; } } return false; }
 
89
        
 
90
        function displayAll(display) {
 
91
            var dthide = 'inline', dtshow = 'none';
 
92
            if (display == 'none') { dthide = 'none'; dtshow = 'inline'; }
 
93
            
 
94
            var nodes = getElementsByClass('details-');
 
95
            var names = new Array();
 
96
            for (var i = 0; i < nodes.length; i++) {
 
97
                nodes[i].style.display = display;
 
98
                var classes = nodes[i].className.split(' ');
 
99
                for (var j = 0; j < classes.length; j++) {
 
100
                    if (classes[j].indexOf('details-') == 0) {
 
101
                        var name = classes[j].substring(8);
 
102
                        if (! contains(names, name)) { names.push(name); }
 
103
                    }
 
104
                }
 
105
            }
 
106
            for (var i = 0; i < names.length; i++) {
 
107
            document.getElementById('hide-' + names[i]).style.display = dthide;
 
108
            document.getElementById('show-' + names[i]).style.display = dtshow;
 
109
        }
 
110
            document.getElementById('hide-all').style.display = dthide;
 
111
            document.getElementById('show-all').style.display = dtshow;
 
112
        }
 
113
        // -->
 
114
        </script>
 
115
</span>
 
116
 
 
117
<span py:def="expand_all_button(normal='block')">
 
118
    <a class="hide-all" id="hide-all" href="javascript:displayAll('none')"> (collapse all) </a>
 
119
    <a class="hide-all" id="show-all" href="javascript:displayAll('${normal}')"> (expand all) </a>
 
120
</span>
 
121
 
 
122
<span py:def="expand_button(name, normal='block')">
 
123
    <a href="javascript:displayDetails('${name}', 'none')" id="hide-${name}" class="hide-button" title="collapse">
 
124
        <img src="${tg.url('/static/images/nav-small-down.gif')}" width="10" height="10" alt="collapse" />
 
125
    </a>
 
126
    <a href="javascript:displayDetails('${name}', '${normal}')" id="show-${name}" class="show-button" title="expand">
 
127
        <img src="${tg.url('/static/images/nav-small-right.gif')}" witdh="10" height="10" alt="expand" />
 
128
    </a>
 
129
</span>
 
130
 
53
131
</head>
54
132
 
55
133
<body py:match="item.tag=='{http://www.w3.org/1999/xhtml}body'" py:attrs="item.items()">