aboutsummaryrefslogblamecommitdiffstats
path: root/data/Template.html
blob: 708e85bdb75e527b2358b5539aa0a7898175e29d (plain) (tree)






























































































































































                                                                                                                            
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <base href="%@">
    <script type="text/ecmascript" defer="defer">
    
        //Appending new content to the message view
        function appendMessage(html) {
            shouldScroll = nearBottom();
        
            //Remove any existing insertion point
            insert = document.getElementById("insert");
            if(insert) insert.parentNode.removeChild(insert);

            //Append the new message to the bottom of our chat block
            chat = document.getElementById("Chat");
            range = document.createRange();
            range.selectNode(chat);
            documentFragment = range.createContextualFragment(html);
            chat.appendChild(documentFragment);
            
            alignChat(shouldScroll);
        }
        function appendMessageNoScroll(html) {
            //Remove any existing insertion point
            insert = document.getElementById("insert");
            if(insert) insert.parentNode.removeChild(insert);

            //Append the new message to the bottom of our chat block
            chat = document.getElementById("Chat");
            range = document.createRange();
            range.selectNode(chat);
            documentFragment = range.createContextualFragment(html);
            chat.appendChild(documentFragment);
        }
        function appendNextMessage(html){
            shouldScroll = nearBottom();

            //Locate the insertion point
            insert = document.getElementById("insert");
        
            //make new node
            range = document.createRange();
            range.selectNode(insert.parentNode);
            newNode = range.createContextualFragment(html);

            //swap
            insert.parentNode.replaceChild(newNode,insert);
            
            alignChat(shouldScroll);
        }
        function appendNextMessageNoScroll(html){
            //Locate the insertion point
            insert = document.getElementById("insert");
        
            //make new node
            range = document.createRange();
            range.selectNode(insert.parentNode);
            newNode = range.createContextualFragment(html);

            //swap
            insert.parentNode.replaceChild(newNode,insert);
        }
        
        //Auto-scroll to bottom.  Use nearBottom to determine if a scrollToBottom is desired.
        function nearBottom() {
            return ( document.body.scrollTop >= ( document.body.offsetHeight - ( window.innerHeight * 1.2 ) ) );
        }
        function scrollToBottom() {
            document.body.scrollTop = document.body.offsetHeight;
        }

        //Dynamically exchange the active stylesheet
        function setStylesheet( id, url ) {
            code = "<style id=\"" + id + "\" type=\"text/css\" media=\"screen,print\">";
            if( url.length ) code += "@import url( \"" + url + "\" );";
            code += "</style>";
            range = document.createRange();
            head = document.getElementsByTagName( "head" ).item(0);
            range.selectNode( head );
            documentFragment = range.createContextualFragment( code );
            head.removeChild( document.getElementById( id ) );
            head.appendChild( documentFragment );
        }
        
        //Swap an image with its alt-tag text on click, or expand/unexpand an attached image
        document.onclick = imageCheck;
        function imageCheck() {     
            node = event.target;
            if(node.tagName == 'IMG' && !client.zoomImage(node) && node.alt) {
                a = document.createElement('a');
                a.setAttribute('onclick', 'imageSwap(this)');
                a.setAttribute('src', node.getAttribute('src'));
                a.className = node.className;
                text = document.createTextNode(node.alt);
                a.appendChild(text);
                node.parentNode.replaceChild(a, node);
            }
        }

        function imageSwap(node) {
            shouldScroll = nearBottom();

            //Swap the image/text
            img = document.createElement('img');
            img.setAttribute('src', node.getAttribute('src'));
            img.setAttribute('alt', node.firstChild.nodeValue);
            img.className = node.className;
            node.parentNode.replaceChild(img, node);
            
            alignChat(shouldScroll);
        }
        
        //Align our chat to the bottom of the window.  If true is passed, view will also be scrolled down
        function alignChat(shouldScroll) {
            var windowHeight = window.innerHeight;
            
            if (windowHeight > 0) {
                var contentElement = document.getElementById('Chat');
                var contentHeight = contentElement.offsetHeight;
                if (windowHeight - contentHeight > 0) {
                    contentElement.style.position = 'relative';
                    contentElement.style.top = (windowHeight - contentHeight) + 'px';
                } else {
                    contentElement.style.position = 'static';
                }
            }
            
            if (shouldScroll) scrollToBottom();
        }
        
        function windowDidResize(){
            alignChat(true/*nearBottom()*/); //nearBottom buggy with inactive tabs
        }
        
        window.onresize = windowDidResize;
    </script>
    
    <!-- This style is shared by all variants. !-->
    <style id="baseStyle" type="text/css" media="screen,print"> 
        %@  
        *{ word-wrap:break-word; }
        img.scaledToFitImage { height:auto; width:100%; }
    </style>
    
    <!-- Although we call this mainStyle for legacy reasons, it's actually the variant style !-->
    <style id="mainStyle" type="text/css" media="screen,print"> 
        @import url( "%@" );
    </style>

</head>
<body onload="alignChat(true);" style="==bodyBackground==">
%@
<div id="Chat">
</div>
%@
</body>
</html>