WME Chat Resizer and Auto Scroll

Adds resize buttons to the chat window

目前為 2016-01-02 提交的版本,檢視 最新版本

您需要先安裝使用者腳本管理器擴展,如 TampermonkeyGreasemonkeyViolentmonkey 之後才能安裝該腳本。

You will need to install an extension such as Tampermonkey to install this script.

您需要先安裝使用者腳本管理器擴充功能,如 TampermonkeyViolentmonkey 後才能安裝該腳本。

您需要先安裝使用者腳本管理器擴充功能,如 TampermonkeyUserscripts 後才能安裝該腳本。

你需要先安裝一款使用者腳本管理器擴展,比如 Tampermonkey,才能安裝此腳本

您需要先安裝使用者腳本管理器擴充功能後才能安裝該腳本。

(我已經安裝了使用者腳本管理器,讓我安裝!)

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

(我已經安裝了使用者樣式管理器,讓我安裝!)

// ==UserScript==
// @name 			WME Chat Resizer and Auto Scroll
// @description 	Adds resize buttons to the chat window
// @namespace		[email protected]
// @grant			none
// @grant			GM_info
// @version			0.2.6
// @match			https://editor-beta.waze.com/*editor/*
// @match			https://www.waze.com/*editor/*
// @author			Rick Zabel '2014
// @license			MIT/BSD/X11
// ==/UserScript==

var WMEChatResizeVersion = "0.2.6";



var WMEChatResizeVersionUpdateNotes = "WME Chat Resize has been updated to " + WMEChatResizeVersion;
WMEChatResizeVersionUpdateNotes = WMEChatResizeVersionUpdateNotes + "\r\n" + "This script adds buttons to the chat title bar and removes the space on the right of the chat.";
WMEChatResizeVersionUpdateNotes = WMEChatResizeVersionUpdateNotes + "\r\n" + "The buttons will let you hide or show the users list";
WMEChatResizeVersionUpdateNotes = WMEChatResizeVersionUpdateNotes + " " + "and will let you make the chat tall or normal heights. also has an option for scrolling the chat.";
WMEChatResizeVersionUpdateNotes = WMEChatResizeVersionUpdateNotes + "\r\n" + "Change log: I removed the bootstrap code.";
WMEChatResizeVersionUpdateNotes = WMEChatResizeVersionUpdateNotes + "\r\n" + "I removed the bootstrap code.";
WMEChatResizeVersionUpdateNotes = WMEChatResizeVersionUpdateNotes + "\n" + "As usual let me know if there are any issues -RickZabel";

//alert the user in  WMEChatResize version updates
if (localStorage.getItem('WMEChatResizeVersion') == WMEChatResizeVersion) {
    //console.log("UR Chat Resize Version " + WMEChatResizeVersion);
} else {
    alert(WMEChatResizeVersionUpdateNotes);
    localStorage.setItem('WMEChatResizeVersion', WMEChatResizeVersion);
}

//Setup some global vars to be used in the functions 
//currently i plan on lettings the chat default to normal on page load
//window.WMEChatResizeHeight = "short"; //short or tall
//window.WMEChatResizeUsers  = "shown";  //shown  or hidden


//Setup some global vars to be used in the functions 
//currently i plan on lettings the chat default to normal on page load size
window.WMEChatResizeAutoScrollOnOff = "on";
window.WMEChatResizeAutoScrollChatCount = 0;

  
function WMEChatResize_init() {
    
    WMEChatResize =  { 
        last: new Array(),
        isLast: false,
        isLSsupported: false,
        zoom: false
    };
    
    WMEChatResize.init = function() {
        //add the buttons to the chat title bar to hide/show user list and max and min
  
        // 
        var g = $('<style type="text/css">.WMEChatResize { font-size: 15px; color:#FFFFFF; background: transparent; border: 0px none !important; padding: 5px 5px 3px 3px; opacity: 100; }</style>');
        $("head").append(g);  
		
		var g = $('<style type="text/css">.WMEChatResizeScrollChat { font-size: 15px; color:#FFFFFF; background: transparent; border: 0px none !important; padding: 3px 3px 3px 3px; opacity: 100; }</style>');
        $("head").append(g);  
		
		var b = "";
	
		b = b + '<div id="ChatResizeHeader" style="top: 0px; height: 25px; text-align: center; padding: 0px 0px 0px 0px;color:#5A5A5A; font-size: 10px; width: 100%;">';
		
		//auto scroll running
        b = b + '<button id="WMEChatResizeAutoScrollChatIsRunning" class="WMEChatResizeScrollChat" style="position:absolute;Left:15px" title="MEChatResize Auto Scroll Running" type="button">v</button>';

        //stopped auto scrolling
 		b = b + '<button id="WMEChatResizeAutoScrollChatIsStopped" class="WMEChatResizeScrollChat" style="position:absolute;Left:15px" title="MEChatResize Auto Scroll Stopped" type="button">-</button>';

		b = b + ' Chat Resizer &nbsp' + WMEChatResizeVersion;

        //Short Chat Hide Users
        b = b + '<button id="WMEChatResizeShortChatHideUsers" class="WMEChatResize" style="position:absolute;Right:15px;" title="Short Chat Hide Users" type="button">></button>';

        //Tall Chat Hide Users
        b = b + '<button id="WMEChatResizeTallHideUsers" class="WMEChatResize" style="position:absolute;Right:15px;" title="Tall Chat Hide Users" type="button">></button>';
        
        //Short Chat Show Users
        b = b + '<button id="WMEChatResizeShortChatShowUsers" class="WMEChatResize" style="position:absolute;Right:15px;" title="Short Chat Show Users" type="button"><</button>';
        
        //Tall Chat Show Users
        b = b + '<button id="WMEChatResizeTallShowUsers" class="WMEChatResize" style="position:absolute;Right:15px;" title="Tall Chat Show Users" type="button"><</button>';
       
        //Tall Chat Go Short with Hidden Users
        b = b + '<button id="WMEChatResizeShortChatHideUsers2" class="WMEChatResize" style="position:absolute;Right:35px;" title="Tall Chat Go Short with Hidden Users" 	type="button">v</button>';

        //Tall Chat Go Short and Show Users
        b = b + '<button id="WMEChatResizeShortChatShowUsers2" class="WMEChatResize" style="position:absolute;Right:35px;" title="Tall Chat Go Short With Shown Users" 	type="button">v</button>';
        
        //Short Chat Go Tall and Hide Users	   
        b = b + '<button id="WMEChatResizeTallHideUsers2" class="WMEChatResize" style="position:absolute;Right:35px;" title="Short Chat Go Tall and Hide Users" type="button">^</button>';
        
        //Short Chat Go Tall and Show Users	 
        b = b + '<button id="WMEChatResizeTallShowUsers2" class="WMEChatResize" style="position:absolute;Right:35px;" title="Short Chat Go Tall and Show Users" type="button">^</button>';
	
		/*
		//Extra Short Chat With user list 
        b = $('<button id="WMEChatResizeTallShowUsers2" class="WMEChatResize" style="float:right;color:#CC0000" title="Extra short chat" type="button">_</button>';
        b.click (WMEChatResize.TallShowUsers);
        $("#chat .header").append(b); 
		*/
		
		//Extra Short Chat without user list
        b = b + '<button id="WMEChatResizeExtraShortChatHideUsers" class="WMEChatResize" style="position:absolute;Right:55px;" title="Extra short chat" type="button">_</button>';
      
        b = b + '</div>';
		//alert(b);
		//style="position:absolute;Right:50px;color:#CC0000"
		
		//$("#chat .header").append($(b)); 
		//$("#chat").prepend($(b));
		$("#chat .header").prepend($(b));		
			
		//$("#ChatResizeHeader").mouseup(WMEChatResize.ChatResizeminchat);

		
		$("#ChatResizeHeader").mouseup(function(e) {
		//alert(e.which);
        if (e.which == 1)  {
		//check to make sure we are not over any of our buttons
			if ($('#WMEChatResizeAutoScrollChatIsRunning').is(':hover') || $('#WMEChatResizeAutoScrollChatIsStopped').is(':hover') || $('#WMEChatResizeTallHideUsers').is(':hover') || $('#WMEChatResizeShortChatShowUsers').is(':hover') || $('#WMEChatResizeTallShowUsers').is(':hover') || $('#WMEChatResizeShortChatHideUsers2').is(':hover') || $('#WMEChatResizeShortChatShowUsers2').is(':hover') || $('#WMEChatResizeTallHideUsers2').is(':hover') || $('#WMEChatResizeTallShowUsers2').is(':hover') || $('#WMEChatResizeExtraShortChatHideUsers').is(':hover') || $('#WMEChatResizeShortChatHideUsers').is(':hover')) {
					//alert('mouse over buttons');
					
			} else {
				//click the chat toggle button (chat balloon)_
				$('#chat-overlay.open .toggle').trigger('click');
			}
		}		
		//alert(e.which);
        
		});
		
		//setup button clicks
		$("#WMEChatResizeShortChatHideUsers").click(WMEChatResize.ShortChatHideUsers);
        $("#WMEChatResizeTallHideUsers").click(WMEChatResize.TallHideUsers);
        $("#WMEChatResizeShortChatShowUsers").click(WMEChatResize.ShortChatShowUsers);
        $("#WMEChatResizeTallShowUsers").click(WMEChatResize.TallShowUsers);
        $("#WMEChatResizeShortChatHideUsers2").click(WMEChatResize.ShortChatHideUsers);
        $("#WMEChatResizeShortChatShowUsers2").click(WMEChatResize.ShortChatShowUsers);
        $("#WMEChatResizeTallHideUsers2").click(WMEChatResize.TallHideUsers);
        $("#WMEChatResizeTallShowUsers2").click(WMEChatResize.TallShowUsers);
        $("#WMEChatResizeExtraShortChatHideUsers").click(WMEChatResize.ExtraShortChatHideUsers);
		$("#WMEChatResizeAutoScrollChatIsRunning").click(WMEChatResize.WMEChatResizeAutoScrollChatIsStopped);
		$("#WMEChatResizeAutoScrollChatIsStopped").click(WMEChatResize.WMEChatResizeAutoScrollChatGo);
		
		/*
         //auto scroll div
        b = $('<div id="autoscrolldiv" Style="position:absolute; left: 0px; bottom: 15px; width 10px;"></div>');
		//b = $('<div id="autoscrolldiv" Style="width: 50%; position: relative;"></div>');
        $(".new-message").after(b);
		//$("#chat").prepend(b);
		
		
        //auto scroll running
        //position:absolute;Left:4px;bottom: 20px; Right:5px;color:#CC0000; background: #ffffff; border: 0px none !important; padding: 0px 0px 0px 0px;
        //opacity: 100;color:#CC0000; background: #ffffff; border: 0px none !important; padding: 0px 0px 0px 0px;
        b = $('<button id="WMEChatResizeAutoScrollChatIsRunning" class="WMEChatResizeScrollChat" style="position:absolute;Left:6px;bottom: 0px; color: #CC0000; background: #ffffff; border: 0px none !important; padding: 0px 0px 0px 0px;" title="MEChatResize Auto Scroll Running" type="button">v</button>');
        b.click(WMEChatResize.WMEChatResizeAutoScrollChatIsStopped);
        $("#autoscrolldiv").prepend(b);

        //stopped auto scrolling
        //position:absolute;Left:6px;bottom: 20px; Right:5px;color:#CC0000; background: #ffffff; border: 0px none !important; padding: 0px 0px 0px 0px;
        b = $('<button id="WMEChatResizeAutoScrollChatIsStopped" class="WMEChatResizeScrollChat" style="position:absolute;Left:6px;bottom: 0px; opacity: 100; color: #CC0000; background: #ffffff; border: 0px none !important; padding: 0px 0px 0px 0px;" title="MEChatResize Auto Scroll Stopped" type="button">-</button>');
        b.click(WMEChatResize.WMEChatResizeAutoScrollChatGo);
        $("#autoscrolldiv").prepend(b);
		*/
		
        //get the WMEChatResizeAutoScroll option
        window.WMEChatResizeAutoScroll = localStorage.getItem('WMEChatResizeAutoScroll');
        //alert(WMEChatResizeAutoScroll);

        if (WMEChatResizeAutoScroll == "" || WMEChatResizeAutoScroll == null) {
            //alert(WMEChatResizeAutoScroll);
            //} else {
            //alert("UR-Comments now has multiple User's comment lists that you may choose from. To select from the lists look under the settings section");
            WMEChatResizeAutoScroll ="Scroll";
            localStorage.setItem('WMEChatResizeAutoScroll', WMEChatResizeAutoScroll);
        }     

        //if the user wants the chat scroll on enable auto scroll
        if(WMEChatResizeAutoScroll ==="Scroll"){
            // auto scroll buttons
            document.getElementById('WMEChatResizeAutoScrollChatIsRunning').style.visibility = "visible"; // 
            document.getElementById('WMEChatResizeAutoScrollChatIsStopped').style.visibility = "hidden"; // 
            //delay start auto scroll
            setTimeout( WMEChatResize.WMEChatScrollChatTimeout, 2000);     
        } else {
            document.getElementById('WMEChatResizeAutoScrollChatIsRunning').style.visibility = "hidden"; // 
            document.getElementById('WMEChatResizeAutoScrollChatIsStopped').style.visibility = "visible"; //
        }
        
        //hide my short chat button since the chat loads short
        //document.getElementById('WMEChatResizeShortChatHideUsers').style.visibility="hidden";		// > short hide users
        document.getElementById('WMEChatResizeTallHideUsers').style.visibility="hidden";			// > tall hide users 
        document.getElementById('WMEChatResizeShortChatShowUsers').style.visibility="hidden";		// < short show users
        document.getElementById('WMEChatResizeTallShowUsers').style.visibility="hidden";			// < tall show users 
        document.getElementById('WMEChatResizeShortChatHideUsers2').style.visibility="hidden";		// V short hide users 
        document.getElementById('WMEChatResizeShortChatShowUsers2').style.visibility="hidden";		// V short show users 
        document.getElementById('WMEChatResizeTallHideUsers2').style.visibility="hidden";			// ^ tall hide users
        //document.getElementById('WMEChatResizeTallShowUsers2').style.visibility="hidden";			// ^ tall show users
		document.getElementById('WMEChatResizeExtraShortChatHideUsers').style.visibility="visible";			// ^ tall show users
		
		//extra short chat
		//$("#chat WMEChatResizeExtraShortChatHideUsers").show();
		//extra short chat
		//$("#chat WMEChatResizeExtraShortChatHideUsers").hide();
		
		//hide / show the default minimize button 
        //$("#chat .minimize").hide();
        
        //chat size buttons			
        /*
        short hide users btn 	
        >	V
        WMEChatResize.ShortChatHideUsers	

        short show users btn	
        <	V
        WMEChatResize.ShortChatShowUsers	


        tall hide users btn	
        >	^
        WMEChatResize.TallHideUsers	

        tall shown users btn	
        <	^
        WMEChatResize.TallShowUsers	

        //button IDs
        WMEChatResizeShortChatHideUsers	
        WMEChatResizeTallHideUsers	
        WMEChatResizeShortChatShowUsers	
        WMEChatResizeTallShowUsers	
        WMEChatResizeShortChatHideUsers2	
        WMEChatResizeShortChatShowUsers2	
        WMEChatResizeTallHideUsers2	
        WMEChatResizeTallShowUsers2	
        */	
        
        // since the chat jumper link isn't always present I had to apply the style to the head  
        var g = $('<style type="text/css">#ChatJumper-JUMP.ChatJumper, #ChatJumper-JUMP-clear { font-size: 11px !important; padding-left: 1px !important; padding-right: 1px !important; }</style>');
        $("head").append(g);  
        
		//this is the container I use to apply css to the site
        //since sometime waze takes back over i am going to make a custom ccs that I edit the innerhtml
        var h = $('<style type="text/css" id="WMEChatResizeCSS">this is the container I use to apply css to the site</style>');
        $("head").append(h);
        
        //move the chat all the way to the right 
        document.getElementById('chat-overlay').style.right="0px";
        
        //shrink down the chat title bar stuff to work with chat jumper
        
        //single-room-label
        var divsToModify = document.getElementsByClassName("single-room-label");
        for(var i = 0; i < divsToModify.length; i++) {        
            divsToModify[i].style.fontSize="10px";
            divsToModify[i].style.paddingLeft="8px";
        }
        
        //dropdown-toggle
        var divsToModify = document.getElementsByClassName("dropdown-toggle");
        for(var i = 0; i < divsToModify.length; i++) {  
			divsToModify[i].style.fontSize="10px";		
            divsToModify[i].style.paddingLeft="5px";
            divsToModify[i].style.paddingRight="0px";
        }
        
        //status
        var divsToModify = document.getElementsByClassName("status");
        for(var i = 0; i < divsToModify.length; i++) {        
            divsToModify[i].style.fontSize="11px";
        }  
		
      
    };
    

	WMEChatResize.ChatResizeminchat = function(a) {
			//minimize the chat if chatresize's header is clicked
			
			//check to make sure we are not over any of our buttons
			if ($('#WMEChatResizeAutoScrollChatIsRunning').is(':hover') || $('#WMEChatResizeAutoScrollChatIsStopped').is(':hover') || $('#WMEChatResizeTallHideUsers').is(':hover') || $('#WMEChatResizeShortChatShowUsers').is(':hover') || $('#WMEChatResizeTallShowUsers').is(':hover') || $('#WMEChatResizeShortChatHideUsers2').is(':hover') || $('#WMEChatResizeShortChatShowUsers2').is(':hover') || $('#WMEChatResizeTallHideUsers2').is(':hover') || $('#WMEChatResizeTallShowUsers2').is(':hover') || $('#WMEChatResizeExtraShortChatHideUsers').is(':hover') || $('#WMEChatResizeShortChatHideUsers').is(':hover')) {
					//alert('mouse over buttons');
					
			} else {
				//click the chat toggle button (chat balloon)_
				//$('#chat-overlay.open .toggle').trigger('click');
			}
	};
    
    WMEChatResize.WMEChatResizeAutoScrollChatIsStopped = function() {
        //console.log("WME Chat Resizer - Clicked Stop Auto Scrolling Chat");
        //The button that showed auto scroll is running "V" was clicked turn off autoscroll and hide/ show buttons

        //window.WMEChatResizeAutoScrollOnOff = "Off";
        //WMEChatResizeAutoScrollOnOff == "Off"
    		document.getElementById('WMEChatResizeAutoScrollChatIsRunning').style.visibility = "hidden";
		    document.getElementById('WMEChatResizeAutoScrollChatIsStopped').style.visibility = "visible";

        //save the autoscroll setting
            WMEChatResizeAutoScroll ="NoScroll";
            localStorage.setItem('WMEChatResizeAutoScroll', WMEChatResizeAutoScroll);
    };


    WMEChatResize.WMEChatResizeAutoScrollChatGo = function() {
        
        //The button that showed auto scroll is off "-" was clicked turn on autoscroll and hide/ show buttons
        //console.log("WME Chat Resizer - Clicked Scroll to bottom of chat");

        //auto scroll btns
        //WMEChatResizeAutoScrollOnOff == "On"		
        document.getElementById('WMEChatResizeAutoScrollChatIsRunning').style.visibility = "visible";
        document.getElementById('WMEChatResizeAutoScrollChatIsStopped').style.visibility = "hidden";
        
        //save the autoscroll setting
        WMEChatResizeAutoScroll ="Scroll";
        localStorage.setItem('WMEChatResizeAutoScroll', WMEChatResizeAutoScroll);
		
        //set the timeout to launch the function that does the scrolling of the chat
		    setTimeout( WMEChatResize.WMEChatScrollChatTimeout, 5000);
    };

    
    WMEChatResize.WMEChatScrollChatTimeout = function() {

            if (document.getElementById('WMEChatResizeAutoScrollChatIsRunning').style.visibility == "visible") {
                //scroll the chat to the divs length
                //console.log($("#chat .chat-body .messages .message-list").scrollHeight);
                //console.log($("#chat .chat-body .messages .message-list").scrollTop());

                var elem = $("#chat .chat-body .messages .message-list");
                if (elem[0].scrollHeight - elem.scrollTop() == elem.outerHeight()) {
                    //bottom of chat
                    //console.log("WMEChatResize - Chat is All Ready At The Bottom");
                } else {
                    
                    $("#chat .chat-body .messages .message-list").scrollTop($("#chat .chat-body .messages .message-list")[0].scrollHeight+10000);
                  
				  
					//the count was possible killing browser, disabled to be on the safe side
                    //WMEChatResizeAutoScrollChatCount++;;
                    //$("#WMEChatResizeAutoScrollChatIsRunning").html(WMEChatResizeAutoScrollChatCount);
                    //console.log("WMEChatResize - Scrolling Down To The Bottom Of Chat; " + WMEChatResizeAutoScrollChatCount + " Times.");
					//console.log("WMEChatResize - Scrolling Down To The Bottom Of Chat");
                }

            }
           setTimeout(WMEChatResize.WMEChatScrollChatTimeout, 5000);
                    /*
                    //send text to the chat message area
                    b = $('<div id="rickzabel" class="message normal-message"><div class="from">RickZabel</div><div class="body"><div style="direction: ltr; text-align: left;">testing</div>');
                    // b.click (WMEChatResize.TallShowUsers);
                    $("#chat .chat-body .messages .message-list").append(b);
                    */
    };

    
    WMEChatResize.ShortChatHideUsers = function() {
        //alert("ShortChatHideUsers");
        //console.log("WME Chat Resizer - ShortChatHideUsers");
        // adjust my buttons
        document.getElementById('WMEChatResizeShortChatHideUsers').style.visibility="hidden";		// > short hide users
        document.getElementById('WMEChatResizeTallHideUsers').style.visibility="hidden";			// > tall hide users 
        document.getElementById('WMEChatResizeShortChatShowUsers').style.visibility="visible";		// < short show users
        document.getElementById('WMEChatResizeTallShowUsers').style.visibility="hidden";			// < tall show users 
        document.getElementById('WMEChatResizeShortChatHideUsers2').style.visibility="hidden";		// V short hide users
        document.getElementById('WMEChatResizeShortChatShowUsers2').style.visibility="hidden";		// V short show users 
        document.getElementById('WMEChatResizeTallHideUsers2').style.visibility="visible";			// ^ tall hide users
        document.getElementById('WMEChatResizeTallShowUsers2').style.visibility="hidden";			// ^ tall show users
        
		document.getElementById('WMEChatResizeExtraShortChatHideUsers').style.visibility="visible";			// ^ tall show users
		
        var WMEChatResizeStringer = "";
        
        //hide users list
        WMEChatResizeStringer = WMEChatResizeStringer + ".users {visibility: hidden !important;}";
        
        //document.getElementById('chat').style.width="310px ";  //497
        WMEChatResizeStringer = WMEChatResizeStringer + "#chat {width: 310px  !important; }";
        
        //chat-body
        WMEChatResizeStringer = WMEChatResizeStringer + ".chat-body {width: 310px  !important;}";
        
        //messages
        WMEChatResizeStringer = WMEChatResizeStringer + ".messages {width: 348px !important;}";
        
        //message-list
        //WMEChatResizeStringer = WMEChatResizeStringer + ".message-list {width: 310px ; max-height: 246px;}"
        WMEChatResizeStringer = WMEChatResizeStringer + "#chat-overlay #chat .messages .message-list {width: 310px  !important; top: 70px !important; bottom: 0px !important; position: absolute !important; max-height: 90% !important;}";
             
        //new-message
        WMEChatResizeStringer = WMEChatResizeStringer + "#chat .messages .new-message {width: 100% !important;}";
        
        //message-input
        WMEChatResizeStringer = WMEChatResizeStringer + ".message-input {width: 100% !important;}";
        
        //unread-messages-notification width
        WMEChatResizeStringer = WMEChatResizeStringer + ".unread-messages-notification {width: 251px !important;}";
        
        document.getElementById("WMEChatResizeCSS").innerHTML = WMEChatResizeStringer;
    };
    
    
    WMEChatResize.ShortChatShowUsers = function() {
        //alert("ShortChatShowUsers");
		//console.log("WME Chat Resizer - ShortChatShowUsers");
        // adjust my buttons
        document.getElementById('WMEChatResizeShortChatHideUsers').style.visibility="visible";		// > short hide users
        document.getElementById('WMEChatResizeTallHideUsers').style.visibility="hidden";			// > tall hide users 
        document.getElementById('WMEChatResizeShortChatShowUsers').style.visibility="hidden";		// < short show users
        document.getElementById('WMEChatResizeTallShowUsers').style.visibility="hidden";			// < tall show users 
        document.getElementById('WMEChatResizeShortChatHideUsers2').style.visibility="hidden";		// V short hide users 
        document.getElementById('WMEChatResizeShortChatShowUsers2').style.visibility="hidden";		// V short show users
        document.getElementById('WMEChatResizeTallHideUsers2').style.visibility="hidden";			// ^ tall hide users
        document.getElementById('WMEChatResizeTallShowUsers2').style.visibility="visible";			// ^ tall show users
        
		//extra short chat
		document.getElementById('WMEChatResizeExtraShortChatHideUsers').style.visibility="visible";			// ^ tall show users
        
		
        var WMEChatResizeStringer = "";
        
        //WMEChatResizeStringer = WMEChatResizeStringer + "#chat {height: 357px;}"
        
        //show users
        WMEChatResizeStringer = WMEChatResizeStringer + ".users {visibility: visible !important;}";
        
        //document.getElementById('chat').style.width="497px";  //497
        WMEChatResizeStringer = WMEChatResizeStringer + "#chat {width: 497px !important;}";
        
        //chat-body
        WMEChatResizeStringer = WMEChatResizeStringer + ".chat-body {width: 497px !important;}";
        
        //messages
        WMEChatResizeStringer = WMEChatResizeStringer + ".messages {width: 350px !important;}";
        
        //message-list
        WMEChatResizeStringer = WMEChatResizeStringer + ".message-list {width: 348px !important; max-height: 246px !important;}";
        
        //new-message
        WMEChatResizeStringer = WMEChatResizeStringer + ".new-message {width: 350px !important;}";
        
        //message-input
        WMEChatResizeStringer = WMEChatResizeStringer + ".message-input {width: 100% !important;}";
        
        //unread-messages-notification
        WMEChatResizeStringer = WMEChatResizeStringer + ".unread-messages-notification {width: 322px !important;}";
        
        document.getElementById("WMEChatResizeCSS").innerHTML = WMEChatResizeStringer;
        
        
    };
    
    
    WMEChatResize.TallHideUsers = function() {
        //alert("TallHideUsers");
        //WMEChatResizeHeight = "tall";
        //console.log("WME Chat Resizer - TallHideUsers");
        // adjust my buttons
        document.getElementById('WMEChatResizeShortChatHideUsers').style.visibility="hidden";		// > short hide users
        document.getElementById('WMEChatResizeTallHideUsers').style.visibility="hidden";			// > tall hide users 
        document.getElementById('WMEChatResizeShortChatShowUsers').style.visibility="hidden";		// < short show users
        document.getElementById('WMEChatResizeTallShowUsers').style.visibility="visible";			// < tall show users 
        document.getElementById('WMEChatResizeShortChatHideUsers2').style.visibility="visible";		// V short hide users
        document.getElementById('WMEChatResizeShortChatShowUsers2').style.visibility="hidden";		// V short show users 
        document.getElementById('WMEChatResizeTallHideUsers2').style.visibility="hidden";			// ^ tall hide users
        document.getElementById('WMEChatResizeTallShowUsers2').style.visibility="hidden";			// ^ tall show users

		document.getElementById('WMEChatResizeExtraShortChatHideUsers').style.visibility="visible";			// ^ tall show users
                
        var WMEChatResizeStringer = "";
        
        //chat 
        WMEChatResizeStringer = WMEChatResizeStringer + "#chat {height: 100% !important; width: 310px  !important;}";
        
        //chat-body
        WMEChatResizeStringer = WMEChatResizeStringer + ".chat-body {height: 96% !important; width: 310px  !important;}";
        
        //messages 
        WMEChatResizeStringer = WMEChatResizeStringer + "#chat .messages {height: 95% !important; width: 348px !important;}";
        
        WMEChatResizeStringer = WMEChatResizeStringer + "#chat-overlay #chat .messages .message-list {width: 310px  !important; top: 70px !important; bottom: 0px !important; position: absolute !important; max-height: 90% !important;}";
        
        //hide users list
        WMEChatResizeStringer = WMEChatResizeStringer + ".users {visibility: hidden !important;}";
        
        //unread-messages-notification
        WMEChatResizeStringer = WMEChatResizeStringer + ".unread-messages-notification {width: 251px !important;}";
        
        //new-message
        WMEChatResizeStringer = WMEChatResizeStringer + "#chat .messages .new-message {width: 100% !important;}";
        
        //chat-overlay
        WMEChatResizeStringer = WMEChatResizeStringer + "#chat-overlay {bottom: 24px !important; height: 85% !important;}";
        
        // lets build up a string and set that as the innerhtml
        document.getElementById("WMEChatResizeCSS").innerHTML = WMEChatResizeStringer;
        
    };
    
    
    WMEChatResize.TallShowUsers = function() {
        //alert("TallShowUsers");
        //WMEChatResizeHeight = "tall";
        //console.log("WME Chat Resizer - TallShowUsers");
        // adjust my buttons
        document.getElementById('WMEChatResizeShortChatHideUsers').style.visibility="hidden";		// > short hide users
        document.getElementById('WMEChatResizeTallHideUsers').style.visibility="visible";			// > tall hide users
        document.getElementById('WMEChatResizeShortChatShowUsers').style.visibility="hidden";		// < short show users
        document.getElementById('WMEChatResizeTallShowUsers').style.visibility="hidden";			// < tall show users 
        document.getElementById('WMEChatResizeShortChatHideUsers2').style.visibility="hidden";		// V short hide users
        document.getElementById('WMEChatResizeShortChatShowUsers2').style.visibility="visible";		// V short show users
        document.getElementById('WMEChatResizeTallHideUsers2').style.visibility="hidden";			// ^ tall hide users
        document.getElementById('WMEChatResizeTallShowUsers2').style.visibility="hidden";			// ^ tall show users
 
		document.getElementById('WMEChatResizeExtraShortChatHideUsers').style.visibility="visible";			// ^ tall show users
        		
        var WMEChatResizeStringer = "";
        
        //chat 
        WMEChatResizeStringer = WMEChatResizeStringer + "#chat {width: 497px !important; height: 100% !important;}";
        
        //chat-body
        WMEChatResizeStringer = WMEChatResizeStringer + ".chat-body {width: 497px !important; height: 96% !important;}";
        
        //messages 
        WMEChatResizeStringer = WMEChatResizeStringer + "#chat .messages {width: 350px !important; height: 95% !important;}";
        
        //message-list
        WMEChatResizeStringer = WMEChatResizeStringer + "#chat-overlay #chat .messages .message-list {width: 350px !important; top: 70px !important; bottom: 0px !important; position: absolute !important; max-height: 90% !important;}";
        
        //users
        WMEChatResizeStringer = WMEChatResizeStringer + ".users {height: 99% !important; max-height: 95% !important;}";
        
        //chat-overlay
        WMEChatResizeStringer = WMEChatResizeStringer + "#chat-overlay {bottom: 24px !important; height: 85% !important;}";
        
        //new-message
        WMEChatResizeStringer = WMEChatResizeStringer + ".new-message {width: 350px !important;}";
        
        //message-input
        WMEChatResizeStringer = WMEChatResizeStringer + ".message-input {width: 100% !important;}";
        
        //unread-messages-notification
        WMEChatResizeStringer = WMEChatResizeStringer + ".unread-messages-notification {width: 322px !important;}";
        
        // lets build up a string and set that as the innerhtml
        document.getElementById("WMEChatResizeCSS").innerHTML = WMEChatResizeStringer;
        
    };
	
    WMEChatResize.ExtraShortChatHideUsers = function() {
        //alert("ExtraShortChatHideUsers");
		//console.log("WME Chat Resizer - ExtraShortChatHideUsers");
        // adjust my buttons
        document.getElementById('WMEChatResizeShortChatHideUsers').style.visibility="hidden";		// > short hide users
        document.getElementById('WMEChatResizeTallHideUsers').style.visibility="hidden";			// > tall hide users 
        document.getElementById('WMEChatResizeShortChatShowUsers').style.visibility="visible";		// < short show users
        document.getElementById('WMEChatResizeTallShowUsers').style.visibility="hidden";			// < tall show users 
        document.getElementById('WMEChatResizeShortChatHideUsers2').style.visibility="hidden";		// V short hide users
        document.getElementById('WMEChatResizeShortChatShowUsers2').style.visibility="hidden";		// V short show users 
        document.getElementById('WMEChatResizeTallHideUsers2').style.visibility="visible";			// ^ tall hide users
        document.getElementById('WMEChatResizeTallShowUsers2').style.visibility="hidden";			// ^ tall show users
		
		document.getElementById('WMEChatResizeExtraShortChatHideUsers').style.visibility="hidden";			// ^ tall show users
		
        
        var WMEChatResizeStringer = "";
        
        //hide users list
        WMEChatResizeStringer = WMEChatResizeStringer + ".users {visibility: hidden !important;}";
        
        //document.getElementById('chat').style.width="310px ";  //497
        WMEChatResizeStringer = WMEChatResizeStringer + "#chat {height: 200px; width: 400px !important; }"; //width: 310px 
        
        //chat-body
        WMEChatResizeStringer = WMEChatResizeStringer + ".chat-body {width: 400px !important;}"; //width: 310px 
        
        //messages
        WMEChatResizeStringer = WMEChatResizeStringer + ".messages {width: 400px !important;}"; //width: 348px
        
        //message-list
        WMEChatResizeStringer = WMEChatResizeStringer + "#chat-overlay #chat .messages .message-list {width: 400px !important; top: 70px !important; bottom: 0px !important; position: absolute !important; max-height: 90% !important; min-height: 0px !important;}"; //width: 310px 
             
        //new-message
        WMEChatResizeStringer = WMEChatResizeStringer + "#chat .messages .new-message {width: 100% !important;}";
        
        //message-input
        WMEChatResizeStringer = WMEChatResizeStringer + ".message-input {width: 100% !important;}";
        
        //unread-messages-notification width
        WMEChatResizeStringer = WMEChatResizeStringer + ".unread-messages-notification {width: 251px !important;}";
        
        document.getElementById("WMEChatResizeCSS").innerHTML = WMEChatResizeStringer;
    };
    
    WMEChatResize.startcode = function () {
        // Check if WME is loaded, if not, waiting a moment and checks again. if yes init WMEChatResize
        try {
            //if ("undefined" != typeof unsafeWindow.W.model.chat.rooms._events.listeners.add[0].obj.userPresenters[unsafeWindow.Waze.model.loginManager.user.id] ) {
            if ( $( "#chat" ).length ) {
				//console.log("WMEChatResize ready to resize");
                WMEChatResize.init();
            } else {
                setTimeout(WMEChatResize.startcode, 200);
            }
        } catch(err) {
            setTimeout(WMEChatResize.startcode, 200);
        }
    };
    //setTimeout(WMEChatResize.startcode, 5000);
    WMEChatResize.startcode();
}

WMEChatResize_init();