← Back to branch summary

~cmiller/adium-theme-ubuntu/lp959084-avoid-scroll-infinite-loop

« back to all changes in this revision

Viewing changes to ubuntu.AdiumMessageStyle/Contents/Resources/Template.html

  • Committer: Ken VanDine
  • Date: 2010-02-17 21:51:56 UTC
  • Revision ID: ken.vandine@canonical.com-20100217215156-eg1d44y0j0dhzww8
inital import into bzr

Show diffs side-by-side

added added

removed removed

Lines of Context:
ubuntu.AdiumMessageStyle/Contents/Resources/Template.html
 
1
<?xml version="1.0" encoding="utf-8"?>
 
2
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
 
3
<html xmlns="http://www.w3.org/1999/xhtml">
 
4
<head>
 
5
        <meta http-equiv="content-type" content="text/html; charset=utf-8" />
 
6
        <base href="%@">
 
7
        
 
8
        <script type="text/javascript">
 
9
        //<![CDATA[     
 
10
           isDebug = false;
 
11
 
 
12
           //Do this on load
 
13
                function initEvents() {
 
14
                        if(document.getElementById("heading") == null){
 
15
                                document.getElementById("bodyNode").style.marginTop = "5px";
 
16
                        }
 
17
                        
 
18
                        if(isDebug == false) {
 
19
                                 document.getElementById("debug").style.display = "none";
 
20
                        }
 
21
                       
 
22
                        alignChat(true);
 
23
                }
 
24
 
 
25
           //Debugging function
 
26
           function trace(msg) {
 
27
                        var node = document.createElement("div");
 
28
                        var debugCon = document.getElementById("debug");
 
29
                        node.innerHTML = msg;
 
30
                        debugCon.appendChild(node);
 
31
                }
 
32
                
 
33
        
 
34
                //Appending new content to the message view
 
35
                function appendMessage(html) {
 
36
                        var shouldScroll = nearBottom();
 
37
                        
 
38
                        //Remove any existing insertion point
 
39
                        var insert = document.getElementById("insert");
 
40
                        
 
41
                        if(insert) insert.parentNode.removeChild(insert);
 
42
                        
 
43
                        //Append the new message to the bottom of our chat block
 
44
                        var chat = document.getElementById("Chat");
 
45
                        var range = document.createRange();
 
46
                        range.selectNode(chat);
 
47
                        var documentFragment = range.createContextualFragment(html);
 
48
                        
 
49
                        var myFrag = chat.appendChild(documentFragment);
 
50
                        
 
51
                        var frag = document.querySelectorAll(".chatItem")[document.querySelectorAll(".chatItem").length-1];
 
52
                        fadeIn(frag);
 
53
                        
 
54
                        alignChat(true);
 
55
                }
 
56
                
 
57
                function fadeIn(myNode) {
 
58
                    myNode.style.visibility = "visible";
 
59
                    myNode.style.opacity = 0;
 
60
                    setTimeout(function() {
 
61
                        myNode.style.WebkitTransition = "opacity 0.35s ease-in";
 
62
                        myNode.style.opacity = 1;
 
63
                    }, 0);
 
64
                }
 
65
                
 
66
                
 
67
                function appendNextMessage(html){
 
68
                        var shouldScroll = nearBottom();
 
69
                        
 
70
                        //Locate the insertion point
 
71
                        var insert = document.getElementById("insert");
 
72
                
 
73
                        //make new node
 
74
                        range = document.createRange();
 
75
                        range.selectNode(insert.parentNode);
 
76
                        newNode = range.createContextualFragment(html);
 
77
                        
 
78
                        //swap
 
79
                        var pointer = insert.parentNode;
 
80
                        insert.parentNode.replaceChild(newNode,insert);                 
 
81
                        var els = pointer.getElementsByTagName("div");
 
82
 
 
83
                        alignChat(true);
 
84
                }
 
85
                
 
86
                
 
87
                //Auto-scroll to bottom.  Use nearBottom to determine if a scrollToBottom is desired.
 
88
                function nearBottom() {
 
89
                        return ( document.body.scrollTop >= ( document.body.offsetHeight - ( window.innerHeight * 1.2 ) ) );
 
90
                }
 
91
                
 
92
                var intervall_scroll;
 
93
                function scrollToBottom() {
 
94
                        //document.body.scrollTop = (document.body.scrollHeight-window.innerHeight);
 
95
                        //return;
 
96
                        if( intervall_scroll ) clearInterval( intervall_scroll );
 
97
                        intervall_scroll = setInterval( function() {
 
98
                                var target_scroll = (document.body.scrollHeight-window.innerHeight);
 
99
                                var scrolldiff = target_scroll - document.body.scrollTop;
 
100
                                if ( document.body.scrollTop != target_scroll ) {
 
101
                                        var saved_scroll = document.body.scrollTop;
 
102
                                        document.body.scrollTop += scrolldiff / 5 + ( scrolldiff >= 0 ? (scrolldiff != 0 ) : -1 );
 
103
                                 } else {
 
104
                                        saved_scroll = -1;
 
105
                                        clearInterval( intervall_scroll );
 
106
                                 }
 
107
                        } , 10 );
 
108
                        return;
 
109
                }
 
110
                
 
111
                //Dynamically exchange the active stylesheet
 
112
                function setStylesheet( id, url ) {
 
113
                        var code = "<style id=\"" + id + "\" type=\"text/css\" media=\"screen,print\">";
 
114
                        if( url.length ) code += "@import url( \"" + url + "\" );";
 
115
                        code += "</style>";
 
116
                        var range = document.createRange();
 
117
                        var head = document.getElementsByTagName( "head" ).item(0);
 
118
                        range.selectNode( head );
 
119
                        documentFragment = range.createContextualFragment( code );
 
120
                        head.removeChild( document.getElementById( id ) );
 
121
                        head.appendChild( documentFragment );
 
122
                }
 
123
                
 
124
                //Align our chat to the bottom of the window.  If true is passed, view will also be scrolled down
 
125
                function alignChat(shouldScroll) {
 
126
 
 
127
                        var windowHeight = window.innerHeight;
 
128
                        
 
129
                        if(windowHeight > 0) {
 
130
                                var contentElement = document.getElementById('Chat');
 
131
                                var contentHeight = contentElement.offsetHeight;
 
132
                                if (windowHeight - contentHeight > 0) {
 
133
                                        contentElement.style.position = 'relative';
 
134
                                        contentElement.style.top = '0px';
 
135
                                } else {
 
136
                                        contentElement.style.position = 'static';
 
137
                                }
 
138
                        }
 
139
                        
 
140
                        if(shouldScroll) scrollToBottom();
 
141
                }
 
142
                
 
143
                function windowDidResize() {
 
144
                        alignChat(true); //nearBottom buggy with inavtive tabs
 
145
                }
 
146
                
 
147
                window.onresize = windowDidResize;
 
148
                //]]>
 
149
        </script>
 
150
 
 
151
        <style id="mainStyle" type="text/css" media="screen,print">     @import url( "%@" ); @import url("Variants/Green on Yellow Alternating.css"); </style>
 
152
 
 
153
</head>
 
154
<body style="==bodyBackground==" id="bodyNode" onload="initEvents()">
 
155
%@
 
156
<div id="Chat">
 
157
</div>
 
158
%@
 
159
<div id="debug"></div>
 
160
 
 
161
</body>
 
162
</html>
 
 
b'\\ No newline at end of file'