← 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
 
1
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 
2
<?python import sitetemplate ?>
 
3
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:py="http://purl.org/kid/ns#" py:extends="sitetemplate">
 
4
 
 
5
<head py:match="item.tag=='{http://www.w3.org/1999/xhtml}head'" py:attrs="item.items()">
 
6
    <meta content="text/html; charset=UTF-8" http-equiv="content-type" py:replace="''"/>
 
7
    <title py:replace="''">Your title goes here</title>
 
8
    <meta py:replace="item[:]"/>
 
9
    <style type="text/css" media="screen">
 
10
@import "${tg.url('/static/css/style.css')}";
 
11
    </style>
 
12
 
 
13
<!-- !define common navbar -->
 
14
<span py:def="navbar()">
 
15
    <!-- !requires: ${navigation: start_revid, revid, revid_list, pagesize, buttons, scan_url}, ${branch}, ${history} -->
 
16
    <div class="navbar" py:if="navigation is not None">
 
17
        <div class="bar">
 
18
            <!-- form must go OUTSIDE the table, or safari will add extra padding :( -->
 
19
            <form action="${branch.url('/changes', start_revid=getattr(navigation, 'start_revid', None), file_id=getattr(navigation, 'file_id', None))}">
 
20
            <table>
 
21
                <tr><td>
 
22
                    <span class="buttons">
 
23
                        <!-- ! navbar buttons never change, from now on.  i decree it! -->
 
24
                        <a href="${branch.url('/changes')}"> changes </a>
 
25
                        <a href="${branch.url('/files')}"> files </a>
 
26
                        <span class="search"> search: <input type="text" name="q" /> </span>
 
27
                    </span>
 
28
                </td><td align="right" py:if="hasattr(navigation, 'revid_list')">
 
29
                    <span py:if="hasattr(navigation, 'feed')" class="rbuttons feed">
 
30
                        <a href="${branch.url('/atom')}"><img src="${tg.url('/static/images/feed-icon-16x16.gif')}" /></a>
 
31
                    </span>
 
32
                    <span class="navbuttons">
 
33
                        <span py:if="navigation.prev_page_revid"> <a href="${navigation.prev_page_url}" title="Previous page"> &#171; </a>      </span>
 
34
                        <span py:if="not navigation.prev_page_revid"> &#171; </span>
 
35
                                revision ${history.get_revno(revid)} (<span py:if="navigation.pagesize > 1">page </span>${navigation.page_position} / ${navigation.page_count})
 
36
                        <span py:if="navigation.next_page_revid"> <a href="${navigation.next_page_url}" title="Next page"> &#187; </a>  </span>
 
37
                        <span py:if="not navigation.next_page_revid"> &#187; </span>
 
38
                    </span>
 
39
                </td></tr>
 
40
            </table>
 
41
            </form>
 
42
        </div>
 
43
    </div>
 
44
</span>
 
45
 
 
46
<span py:def="revlink(revid, start_revid, file_id, text)">
 
47
    <a title="Show revision ${history.get_revno(revid)}" href="${branch.url([ '/revision', revid ], start_revid=start_revid, file_id=file_id)}" class="revlink"> ${text} </a>
 
48
</span>
 
49
<span py:def="revlink_q(revid, start_revid, file_id, query, text)">
 
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
</span>
 
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
 
 
131
</head>
 
132
 
 
133
<body py:match="item.tag=='{http://www.w3.org/1999/xhtml}body'" py:attrs="item.items()">
 
134
 
 
135
    <div py:replace="[item.text]+item[:]"/>
 
136
 
 
137
        <!-- End of main_content -->
 
138
        
 
139
        <div class="footer">
 
140
            <span class="banner"><a href="http://www.bazaar-vcs.org/"><img src="${tg.url('/static/images/bazaar-banner.png')}" /></a></span>
 
141
            <span class="banner"><a href="http://www.lag.net/loggerhead/"><img src="${tg.url('/static/images/loggerhead-banner.png')}" /></a></span>
 
142
        </div>
 
143
</body>
 
144
 
 
145
</html>