Mercurial > pidgin.yaz

comparison pidgin/themes/Template.html @ 32765:8fb1124b2794

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
Put conversation theme in its own directory.
author Elliott Sales de Andrade <qulogic@pidgin.im>
date Tue, 18 Oct 2011 04:17:47 +0000
parents
children
comparison
equal deleted inserted replaced
32764:ef01f180114b 32765:8fb1124b2794
1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
2 <html>
3 <head>
4 <meta http-equiv="content-type" content="text/html; charset=utf-8" />
5 <base href="%@">
6 <script type="text/ecmascript" defer="defer">
7
8 //Appending new content to the message view
9 function appendMessage(html) {
10 shouldScroll = nearBottom();
11
12 //Remove any existing insertion point
13 insert = document.getElementById("insert");
14 if(insert) insert.parentNode.removeChild(insert);
15
16 //Append the new message to the bottom of our chat block
17 chat = document.getElementById("Chat");
18 range = document.createRange();
19 range.selectNode(chat);
20 documentFragment = range.createContextualFragment(html);
21 chat.appendChild(documentFragment);
22
23 alignChat(shouldScroll);
24 }
25 function appendMessageNoScroll(html) {
26 //Remove any existing insertion point
27 insert = document.getElementById("insert");
28 if(insert) insert.parentNode.removeChild(insert);
29
30 //Append the new message to the bottom of our chat block
31 chat = document.getElementById("Chat");
32 range = document.createRange();
33 range.selectNode(chat);
34 documentFragment = range.createContextualFragment(html);
35 chat.appendChild(documentFragment);
36 }
37 function appendNextMessage(html){
38 shouldScroll = nearBottom();
39
40 //Locate the insertion point
41 insert = document.getElementById("insert");
42
43 //make new node
44 range = document.createRange();
45 range.selectNode(insert.parentNode);
46 newNode = range.createContextualFragment(html);
47
48 //swap
49 insert.parentNode.replaceChild(newNode,insert);
50
51 alignChat(shouldScroll);
52 }
53 function appendNextMessageNoScroll(html){
54 //Locate the insertion point
55 insert = document.getElementById("insert");
56
57 //make new node
58 range = document.createRange();
59 range.selectNode(insert.parentNode);
60 newNode = range.createContextualFragment(html);
61
62 //swap
63 insert.parentNode.replaceChild(newNode,insert);
64 }
65
66 //Auto-scroll to bottom. Use nearBottom to determine if a scrollToBottom is desired.
67 function nearBottom() {
68 return ( document.body.scrollTop >= ( document.body.offsetHeight - ( window.innerHeight * 1.2 ) ) );
69 }
70 function scrollToBottom() {
71 document.body.scrollTop = document.body.offsetHeight;
72 }
73
74 //Dynamically exchange the active stylesheet
75 function setStylesheet( id, url ) {
76 code = "<style id=\"" + id + "\" type=\"text/css\" media=\"screen,print\">";
77 if( url.length ) code += "@import url( \"" + url + "\" );";
78 code += "</style>";
79 range = document.createRange();
80 head = document.getElementsByTagName( "head" ).item(0);
81 range.selectNode( head );
82 documentFragment = range.createContextualFragment( code );
83 head.removeChild( document.getElementById( id ) );
84 head.appendChild( documentFragment );
85 }
86
87 //Swap an image with its alt-tag text on click, or expand/unexpand an attached image
88 document.onclick = imageCheck;
89 function imageCheck() {
90 node = event.target;
91 if(node.tagName == 'IMG' && !client.zoomImage(node) && node.alt) {
92 a = document.createElement('a');
93 a.setAttribute('onclick', 'imageSwap(this)');
94 a.setAttribute('src', node.getAttribute('src'));
95 a.className = node.className;
96 text = document.createTextNode(node.alt);
97 a.appendChild(text);
98 node.parentNode.replaceChild(a, node);
99 }
100 }
101
102 function imageSwap(node) {
103 shouldScroll = nearBottom();
104
105 //Swap the image/text
106 img = document.createElement('img');
107 img.setAttribute('src', node.getAttribute('src'));
108 img.setAttribute('alt', node.firstChild.nodeValue);
109 img.className = node.className;
110 node.parentNode.replaceChild(img, node);
111
112 alignChat(shouldScroll);
113 }
114
115 //Align our chat to the bottom of the window. If true is passed, view will also be scrolled down
116 function alignChat(shouldScroll) {
117 var windowHeight = window.innerHeight;
118
119 if (windowHeight > 0) {
120 var contentElement = document.getElementById('Chat');
121 var contentHeight = contentElement.offsetHeight;
122 if (windowHeight - contentHeight > 0) {
123 contentElement.style.position = 'relative';
124 contentElement.style.top = (windowHeight - contentHeight) + 'px';
125 } else {
126 contentElement.style.position = 'static';
127 }
128 }
129
130 if (shouldScroll) scrollToBottom();
131 }
132
133 function windowDidResize(){
134 alignChat(true/*nearBottom()*/); //nearBottom buggy with inactive tabs
135 }
136
137 window.onresize = windowDidResize;
138 </script>
139
140 <style type="text/css">
141 .actionMessageUserName:before { content:"*"; }
142 .actionMessageBody:after { content:"*"; }
143 *{ word-wrap:break-word; }
144 img.scaledToFitImage { height:auto; width:100%; }
145 </style>
146
147 <!-- This style is shared by all variants. !-->
148 <style id="baseStyle" type="text/css" media="screen,print">
149 %@
150 </style>
151
152 <!-- Although we call this mainStyle for legacy reasons, it's actually the variant style !-->
153 <style id="mainStyle" type="text/css" media="screen,print">
154 @import url( "%@" );
155 </style>
156
157 </head>
158 <body onload="alignChat(true);" style="==bodyBackground==">
159 %@
160 <div id="Chat">
161 </div>
162 %@
163 </body>
164 </html>