☰

WME Chat Resizer and Auto Scroll

Adds resize buttons to the chat window

  1. // ==UserScript==
  2. // @name 			WME Chat Resizer and Auto Scroll
  3. // @description 	Adds resize buttons to the chat window
  4. // @namespace		RickZabel@gmail.com
  5. // @grant			none
  6. // @grant			GM_info
  7. // @version			0.2.8
  8. // @match          https://editor-beta.waze.com/*editor*
  9. // @match          https://beta.waze.com/*editor*
  10. // @match          https://www.waze.com/*editor*
  11. // @author			Rick Zabel '2014
  12. // @license			MIT/BSD/X11
  13. // ==/UserScript==
  14.  
  15. var WMEChatResizeVersion = GM_info.script.version;
  16.  
  17.  
  18.  
  19. var WMEChatResizeVersionUpdateNotes = "WME Chat Resizer has been updated to " + WMEChatResizeVersion;
  20. WMEChatResizeVersionUpdateNotes = WMEChatResizeVersionUpdateNotes + "\n" + "Updates for WME, chat addon, and chat UI fix";
  21.  
  22. //alert the user in  WMEChatResize version updates
  23. if (localStorage.getItem('WMEChatResizeVersion') == WMEChatResizeVersion) {
  24.     //console.log("UR Chat Resize Version " + WMEChatResizeVersion);
  25. } else {
  26.     alert(WMEChatResizeVersionUpdateNotes);
  27.     localStorage.setItem('WMEChatResizeVersion', WMEChatResizeVersion);
  28. }
  29.  
  30. //Setup some global vars to be used in the functions
  31. //currently i plan on lettings the chat default to normal on page load
  32. //window.WMEChatResizeHeight = "short"; //short or tall
  33. //window.WMEChatResizeUsers  = "shown";  //shown  or hidden
  34.  
  35.  
  36. //Setup some global vars to be used in the functions
  37. //currently i plan on lettings the chat default to normal on page load size
  38. window.WMEChatResizeAutoScrollOnOff = "on";
  39. window.WMEChatResizeAutoScrollChatCount = 0;
  40.  
  41.  
  42. function WMEChatResize_init() {
  43.  
  44.     WMEChatResize =  {
  45.         last: new Array(),
  46.         isLast: false,
  47.         isLSsupported: false,
  48.         zoom: false
  49.     };
  50.  
  51.     WMEChatResize.init = function() {
  52.         //add the buttons to the chat title bar to hide/show user list and max and min
  53.  
  54.         //
  55.         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>');
  56.         $("head").append(g);
  57.  
  58. 		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>');
  59.         $("head").append(g);
  60.  
  61. 		var b = "";
  62.  
  63. 		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%;">';
  64.  
  65. 		//auto scroll running
  66.         b = b + '<button id="WMEChatResizeAutoScrollChatIsRunning" class="WMEChatResizeScrollChat" style="position:absolute;Left:15px" title="MEChatResize Auto Scroll Running" type="button">v</button>';
  67.  
  68.         //stopped auto scrolling
  69.  		b = b + '<button id="WMEChatResizeAutoScrollChatIsStopped" class="WMEChatResizeScrollChat" style="position:absolute;Left:15px" title="MEChatResize Auto Scroll Stopped" type="button">-</button>';
  70.  
  71. 		b = b + ' Chat Resizer &nbsp' + WMEChatResizeVersion;
  72.  
  73.         //Short Chat Hide Users
  74.         b = b + '<button id="WMEChatResizeShortChatHideUsers" class="WMEChatResize" style="position:absolute;Right:15px;" title="Short Chat Hide Users" type="button"><</button>';
  75.  
  76.         //Tall Chat Hide Users
  77.         b = b + '<button id="WMEChatResizeTallHideUsers" class="WMEChatResize" style="position:absolute;Right:15px;" title="Tall Chat Hide Users" type="button"><</button>';
  78.  
  79.         //Short Chat Show Users
  80.         b = b + '<button id="WMEChatResizeShortChatShowUsers" class="WMEChatResize" style="position:absolute;Right:15px;" title="Short Chat Show Users" type="button">></button>';
  81.  
  82.         //Tall Chat Show Users
  83.         b = b + '<button id="WMEChatResizeTallShowUsers" class="WMEChatResize" style="position:absolute;Right:15px;" title="Tall Chat Show Users" type="button">></button>';
  84.  
  85.         //Tall Chat Go Short with Hidden Users
  86.         b = b + '<button id="WMEChatResizeShortChatHideUsers2" class="WMEChatResize" style="position:absolute;Right:35px;" title="Tall Chat Go Short with Hidden Users" 	type="button">v</button>';
  87.  
  88.         //Tall Chat Go Short and Show Users
  89.         b = b + '<button id="WMEChatResizeShortChatShowUsers2" class="WMEChatResize" style="position:absolute;Right:35px;" title="Tall Chat Go Short With Shown Users" 	type="button">v</button>';
  90.  
  91.         //Short Chat Go Tall and Hide Users
  92.         b = b + '<button id="WMEChatResizeTallHideUsers2" class="WMEChatResize" style="position:absolute;Right:35px;" title="Short Chat Go Tall and Hide Users" type="button">^</button>';
  93.  
  94.         //Short Chat Go Tall and Show Users
  95.         b = b + '<button id="WMEChatResizeTallShowUsers2" class="WMEChatResize" style="position:absolute;Right:35px;" title="Short Chat Go Tall and Show Users" type="button">^</button>';
  96.  
  97. 		/*
  98. 		//Extra Short Chat With user list
  99.         b = $('<button id="WMEChatResizeTallShowUsers2" class="WMEChatResize" style="float:right;color:#CC0000" title="Extra short chat" type="button">_</button>';
  100.         b.click (WMEChatResize.TallShowUsers);
  101.         $("#chat .header").append(b);
  102. 		*/
  103.  
  104. 		//Extra Short Chat without user list
  105.         b = b + '<button id="WMEChatResizeExtraShortChatHideUsers" class="WMEChatResize" style="position:absolute;Right:55px;" title="Extra short chat" type="button">_</button>';
  106.  
  107.         b = b + '</div>';
  108. 		//alert(b);
  109. 		//style="position:absolute;Right:50px;color:#CC0000"
  110.  
  111. 		//$("#chat .header").append($(b));
  112. 		//$("#chat").prepend($(b));
  113. 		$("#chat .header").prepend($(b));
  114.  
  115. 		//$("#ChatResizeHeader").mouseup(WMEChatResize.ChatResizeminchat);
  116.  
  117.  
  118. 		$("#ChatResizeHeader").mouseup(function(e) {
  119. 		//alert(e.which);
  120.         if (e.which == 1)  {
  121. 		//check to make sure we are not over any of our buttons
  122. 			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')) {
  123. 					//alert('mouse over buttons');
  124.  
  125. 			} else {
  126. 				//click the chat toggle button (chat balloon)_
  127. 				$('#chat-overlay.open .toggle').trigger('click');
  128. 			}
  129. 		}
  130. 		//alert(e.which);
  131.  
  132. 		});
  133.  
  134. 		//setup button clicks
  135. 		$("#WMEChatResizeShortChatHideUsers").click(WMEChatResize.ShortChatHideUsers);
  136.         $("#WMEChatResizeTallHideUsers").click(WMEChatResize.TallHideUsers);
  137.         $("#WMEChatResizeShortChatShowUsers").click(WMEChatResize.ShortChatShowUsers);
  138.         $("#WMEChatResizeTallShowUsers").click(WMEChatResize.TallShowUsers);
  139.         $("#WMEChatResizeShortChatHideUsers2").click(WMEChatResize.ShortChatHideUsers);
  140.         $("#WMEChatResizeShortChatShowUsers2").click(WMEChatResize.ShortChatShowUsers);
  141.         $("#WMEChatResizeTallHideUsers2").click(WMEChatResize.TallHideUsers);
  142.         $("#WMEChatResizeTallShowUsers2").click(WMEChatResize.TallShowUsers);
  143.         $("#WMEChatResizeExtraShortChatHideUsers").click(WMEChatResize.ExtraShortChatHideUsers);
  144. 		$("#WMEChatResizeAutoScrollChatIsRunning").click(WMEChatResize.WMEChatResizeAutoScrollChatIsStopped);
  145. 		$("#WMEChatResizeAutoScrollChatIsStopped").click(WMEChatResize.WMEChatResizeAutoScrollChatGo);
  146.  
  147. 		/*
  148.          //auto scroll div
  149.         b = $('<div id="autoscrolldiv" Style="position:absolute; left: 0px; bottom: 15px; width 10px;"></div>');
  150. 		//b = $('<div id="autoscrolldiv" Style="width: 50%; position: relative;"></div>');
  151.         $(".new-message").after(b);
  152. 		//$("#chat").prepend(b);
  153.  
  154.  
  155.         //auto scroll running
  156.         //position:absolute;Left:4px;bottom: 20px; Right:5px;color:#CC0000; background: #ffffff; border: 0px none !important; padding: 0px 0px 0px 0px;
  157.         //opacity: 100;color:#CC0000; background: #ffffff; border: 0px none !important; padding: 0px 0px 0px 0px;
  158.         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>');
  159.         b.click(WMEChatResize.WMEChatResizeAutoScrollChatIsStopped);
  160.         $("#autoscrolldiv").prepend(b);
  161.  
  162.         //stopped auto scrolling
  163.         //position:absolute;Left:6px;bottom: 20px; Right:5px;color:#CC0000; background: #ffffff; border: 0px none !important; padding: 0px 0px 0px 0px;
  164.         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>');
  165.         b.click(WMEChatResize.WMEChatResizeAutoScrollChatGo);
  166.         $("#autoscrolldiv").prepend(b);
  167. 		*/
  168.  
  169.         //get the WMEChatResizeAutoScroll option
  170.         window.WMEChatResizeAutoScroll = localStorage.getItem('WMEChatResizeAutoScroll');
  171.         //alert(WMEChatResizeAutoScroll);
  172.  
  173.         if (WMEChatResizeAutoScroll == "" || WMEChatResizeAutoScroll == null) {
  174.             //alert(WMEChatResizeAutoScroll);
  175.             //} else {
  176.             //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");
  177.             WMEChatResizeAutoScroll ="Scroll";
  178.             localStorage.setItem('WMEChatResizeAutoScroll', WMEChatResizeAutoScroll);
  179.         }
  180.  
  181.         //if the user wants the chat scroll on enable auto scroll
  182.         if(WMEChatResizeAutoScroll ==="Scroll"){
  183.             // auto scroll buttons
  184.             document.getElementById('WMEChatResizeAutoScrollChatIsRunning').style.visibility = "visible"; //
  185.             document.getElementById('WMEChatResizeAutoScrollChatIsStopped').style.visibility = "hidden"; //
  186.             //delay start auto scroll
  187.             setTimeout( WMEChatResize.WMEChatScrollChatTimeout, 2000);
  188.         } else {
  189.             document.getElementById('WMEChatResizeAutoScrollChatIsRunning').style.visibility = "hidden"; //
  190.             document.getElementById('WMEChatResizeAutoScrollChatIsStopped').style.visibility = "visible"; //
  191.         }
  192.  
  193.         //hide my short chat button since the chat loads short
  194.         //document.getElementById('WMEChatResizeShortChatHideUsers').style.visibility="hidden";		// < short hide users
  195.         document.getElementById('WMEChatResizeTallHideUsers').style.visibility="hidden";			// > tall hide users
  196.         document.getElementById('WMEChatResizeShortChatShowUsers').style.visibility="hidden";		// < short show users
  197.         document.getElementById('WMEChatResizeTallShowUsers').style.visibility="hidden";			// > tall show users
  198.         document.getElementById('WMEChatResizeShortChatHideUsers2').style.visibility="hidden";		// V short hide users
  199.         document.getElementById('WMEChatResizeShortChatShowUsers2').style.visibility="hidden";		// V short show users
  200.         document.getElementById('WMEChatResizeTallHideUsers2').style.visibility="hidden";			// ^ tall hide users
  201.         //document.getElementById('WMEChatResizeTallShowUsers2').style.visibility="hidden";			// ^ tall show users
  202. 		document.getElementById('WMEChatResizeExtraShortChatHideUsers').style.visibility="visible";			// ^ tall show users
  203.  
  204. 		//extra short chat
  205. 		//$("#chat WMEChatResizeExtraShortChatHideUsers").show();
  206. 		//extra short chat
  207. 		//$("#chat WMEChatResizeExtraShortChatHideUsers").hide();
  208.  
  209. 		//hide / show the default minimize button
  210.         //$("#chat .minimize").hide();
  211.  
  212.         //chat size buttons
  213.         /*
  214.         short hide users btn
  215.         >	V
  216.         WMEChatResize.ShortChatHideUsers
  217.  
  218.         short show users btn
  219.         <	V
  220.         WMEChatResize.ShortChatShowUsers
  221.  
  222.  
  223.         tall hide users btn
  224.         >	^
  225.         WMEChatResize.TallHideUsers
  226.  
  227.         tall shown users btn
  228.         <	^
  229.         WMEChatResize.TallShowUsers
  230.  
  231.         //button IDs
  232.         WMEChatResizeShortChatHideUsers
  233.         WMEChatResizeTallHideUsers
  234.         WMEChatResizeShortChatShowUsers
  235.         WMEChatResizeTallShowUsers
  236.         WMEChatResizeShortChatHideUsers2
  237.         WMEChatResizeShortChatShowUsers2
  238.         WMEChatResizeTallHideUsers2
  239.         WMEChatResizeTallShowUsers2
  240.         */
  241.  
  242.         // since the chat jumper link isn't always present I had to apply the style to the head
  243.         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>');
  244.         $("head").append(g);
  245.  
  246. 		//this is the container I use to apply css to the site
  247.         //since sometime waze takes back over i am going to make a custom ccs that I edit the innerhtml
  248.         var h = $('<style type="text/css" id="WMEChatResizeCSS">.list-unstyled {padding-left: 5px !important;}</style>');
  249.         $("head").append(h);
  250.  
  251.         //move the chat all the way to the left
  252.         //document.getElementById('chat-overlay').style.left="0px";
  253.  
  254.         //shrink down the chat title bar stuff to work with chat jumper
  255.  
  256.         //single-room-label
  257.         var divsToModify = document.getElementsByClassName("single-room-label");
  258.         for(var i = 0; i < divsToModify.length; i++) {
  259.             divsToModify[i].style.fontSize="10px";
  260.             divsToModify[i].style.paddingLeft="8px";
  261.         }
  262.  
  263.         //dropdown-toggle
  264.         var divsToModify = document.getElementsByClassName("dropdown-toggle");
  265.         for(var i = 0; i < divsToModify.length; i++) {
  266. 			divsToModify[i].style.fontSize="10px";
  267.             divsToModify[i].style.paddingLeft="5px";
  268.             divsToModify[i].style.paddingRight="0px";
  269.         }
  270.  
  271.         //status
  272.         var divsToModify = document.getElementsByClassName("status");
  273.         for(var i = 0; i < divsToModify.length; i++) {
  274.             divsToModify[i].style.fontSize="11px";
  275.         }
  276.  
  277.  
  278.     };
  279.  
  280.  
  281. 	WMEChatResize.ChatResizeminchat = function(a) {
  282. 			//minimize the chat if chatresize's header is clicked
  283.  
  284. 			//check to make sure we are not over any of our buttons
  285. 			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')) {
  286. 					//alert('mouse over buttons');
  287.  
  288. 			} else {
  289. 				//click the chat toggle button (chat balloon)_
  290. 				//$('#chat-overlay.open .toggle').trigger('click');
  291. 			}
  292. 	};
  293.  
  294.     WMEChatResize.WMEChatResizeAutoScrollChatIsStopped = function() {
  295.         //console.log("WME Chat Resizer - Clicked Stop Auto Scrolling Chat");
  296.         //The button that showed auto scroll is running "V" was clicked turn off autoscroll and hide/ show buttons
  297.  
  298.         //window.WMEChatResizeAutoScrollOnOff = "Off";
  299.         //WMEChatResizeAutoScrollOnOff == "Off"
  300.     		document.getElementById('WMEChatResizeAutoScrollChatIsRunning').style.visibility = "hidden";
  301. 		    document.getElementById('WMEChatResizeAutoScrollChatIsStopped').style.visibility = "visible";
  302.  
  303.         //save the autoscroll setting
  304.             WMEChatResizeAutoScroll ="NoScroll";
  305.             localStorage.setItem('WMEChatResizeAutoScroll', WMEChatResizeAutoScroll);
  306.     };
  307.  
  308.  
  309.     WMEChatResize.WMEChatResizeAutoScrollChatGo = function() {
  310.  
  311.         //The button that showed auto scroll is off "-" was clicked turn on autoscroll and hide/ show buttons
  312.         //console.log("WME Chat Resizer - Clicked Scroll to bottom of chat");
  313.  
  314.         //auto scroll btns
  315.         //WMEChatResizeAutoScrollOnOff == "On"
  316.         document.getElementById('WMEChatResizeAutoScrollChatIsRunning').style.visibility = "visible";
  317.         document.getElementById('WMEChatResizeAutoScrollChatIsStopped').style.visibility = "hidden";
  318.  
  319.         //save the autoscroll setting
  320.         WMEChatResizeAutoScroll ="Scroll";
  321.         localStorage.setItem('WMEChatResizeAutoScroll', WMEChatResizeAutoScroll);
  322.  
  323.         //set the timeout to launch the function that does the scrolling of the chat
  324. 		    setTimeout( WMEChatResize.WMEChatScrollChatTimeout, 5000);
  325.     };
  326.  
  327.  
  328.     WMEChatResize.WMEChatScrollChatTimeout = function() {
  329.  
  330.             if (document.getElementById('WMEChatResizeAutoScrollChatIsRunning').style.visibility == "visible") {
  331.                 //scroll the chat to the divs length
  332.                 //console.log($("#chat .chat-body .messages .message-list").scrollHeight);
  333.                 //console.log($("#chat .chat-body .messages .message-list").scrollTop());
  334.  
  335.                 var elem = $("#chat .chat-body .messages .message-list");
  336.                 if (elem[0].scrollHeight - elem.scrollTop() == elem.outerHeight()) {
  337.                     //bottom of chat
  338.                     //console.log("WMEChatResize - Chat is All Ready At The Bottom");
  339.                 } else {
  340.  
  341.                     $("#chat .chat-body .messages .message-list").scrollTop($("#chat .chat-body .messages .message-list")[0].scrollHeight+10000);
  342.  
  343.  
  344. 					//the count was possible killing browser, disabled to be on the safe side
  345.                     //WMEChatResizeAutoScrollChatCount++;;
  346.                     //$("#WMEChatResizeAutoScrollChatIsRunning").html(WMEChatResizeAutoScrollChatCount);
  347.                     //console.log("WMEChatResize - Scrolling Down To The Bottom Of Chat; " + WMEChatResizeAutoScrollChatCount + " Times.");
  348. 					//console.log("WMEChatResize - Scrolling Down To The Bottom Of Chat");
  349.                 }
  350.  
  351.             }
  352.            setTimeout(WMEChatResize.WMEChatScrollChatTimeout, 5000);
  353.                     /*
  354.                     //send text to the chat message area
  355.                     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>');
  356.                     // b.click (WMEChatResize.TallShowUsers);
  357.                     $("#chat .chat-body .messages .message-list").append(b);
  358.                     */
  359.     };
  360.  
  361.  
  362.     WMEChatResize.ShortChatHideUsers = function() {
  363.         //alert("ShortChatHideUsers");
  364.         //console.log("WME Chat Resizer - ShortChatHideUsers");
  365.         // adjust my buttons
  366.         document.getElementById('WMEChatResizeShortChatHideUsers').style.visibility="hidden";		// < short hide users
  367.         document.getElementById('WMEChatResizeTallHideUsers').style.visibility="hidden";			// > tall hide users
  368.         document.getElementById('WMEChatResizeShortChatShowUsers').style.visibility="visible";		// < short show users
  369.         document.getElementById('WMEChatResizeTallShowUsers').style.visibility="hidden";			// > tall show users
  370.         document.getElementById('WMEChatResizeShortChatHideUsers2').style.visibility="hidden";		// V short hide users
  371.         document.getElementById('WMEChatResizeShortChatShowUsers2').style.visibility="hidden";		// V short show users
  372.         document.getElementById('WMEChatResizeTallHideUsers2').style.visibility="visible";			// ^ tall hide users
  373.         document.getElementById('WMEChatResizeTallShowUsers2').style.visibility="hidden";			// ^ tall show users
  374.  
  375. 		document.getElementById('WMEChatResizeExtraShortChatHideUsers').style.visibility="visible";			// ^ tall show users
  376.  
  377.         var WMEChatResizeStringer = "";
  378.  
  379.         //hide users list
  380.         WMEChatResizeStringer = WMEChatResizeStringer + ".users {visibility: hidden !important; width: 195px !important;}";
  381.  
  382.         //document.getElementById('chat').style.width="310px ";  //497
  383.         WMEChatResizeStringer = WMEChatResizeStringer + "#chat {width: 360px  !important; }";
  384.  
  385.         //chat-body
  386.         WMEChatResizeStringer = WMEChatResizeStringer + ".chat-body {width: 360px  !important;}";
  387.  
  388.         //messages
  389.         WMEChatResizeStringer = WMEChatResizeStringer + ".messages {width: 348px !important; border-right: 0px solid rgba(126, 126, 126, 0.26)!important;}";
  390.  
  391.         //message-list
  392.         //WMEChatResizeStringer = WMEChatResizeStringer + ".message-list {width: 310px ; max-height: 246px;}"
  393.         WMEChatResizeStringer = WMEChatResizeStringer + "#chat-overlay #chat .messages .message-list {width: 360px  !important; top: 76px !important; bottom: 0px !important; position: absolute !important; max-height: 90% !important;}";
  394.  
  395.         //new-message
  396.         WMEChatResizeStringer = WMEChatResizeStringer + "#chat .messages .new-message {width: 100% !important;}";
  397.  
  398.         //message-input
  399.         WMEChatResizeStringer = WMEChatResizeStringer + ".message-input {width: 100% !important;}";
  400.  
  401.         //unread-messages-notification width
  402.         WMEChatResizeStringer = WMEChatResizeStringer + ".unread-messages-notification {width: 251px !important;}";
  403.  
  404. 		//.list-unstyled Chataddon padding fix
  405. 		WMEChatResizeStringer = WMEChatResizeStringer + ".list-unstyled {padding-left: 5px !important;}"
  406.  
  407.         document.getElementById("WMEChatResizeCSS").innerHTML = WMEChatResizeStringer;
  408.     };
  409.  
  410.  
  411.     WMEChatResize.ShortChatShowUsers = function() {
  412.         //alert("ShortChatShowUsers");
  413. 		//console.log("WME Chat Resizer - ShortChatShowUsers");
  414.         // adjust my buttons
  415.         document.getElementById('WMEChatResizeShortChatHideUsers').style.visibility="visible";		// < short hide users
  416.         document.getElementById('WMEChatResizeTallHideUsers').style.visibility="hidden";			// > tall hide users
  417.         document.getElementById('WMEChatResizeShortChatShowUsers').style.visibility="hidden";		// < short show users
  418.         document.getElementById('WMEChatResizeTallShowUsers').style.visibility="hidden";			// > tall show users
  419.         document.getElementById('WMEChatResizeShortChatHideUsers2').style.visibility="hidden";		// V short hide users
  420.         document.getElementById('WMEChatResizeShortChatShowUsers2').style.visibility="hidden";		// V short show users
  421.         document.getElementById('WMEChatResizeTallHideUsers2').style.visibility="hidden";			// ^ tall hide users
  422.         document.getElementById('WMEChatResizeTallShowUsers2').style.visibility="visible";			// ^ tall show users
  423.  
  424. 		//extra short chat
  425. 		document.getElementById('WMEChatResizeExtraShortChatHideUsers').style.visibility="visible";			// ^ tall show users
  426.  
  427.  
  428.         var WMEChatResizeStringer = "";
  429.  
  430.         //WMEChatResizeStringer = WMEChatResizeStringer + "#chat {height: 357px;}"
  431.  
  432.         //show users
  433.         WMEChatResizeStringer = WMEChatResizeStringer + ".users {visibility: visible !important; width: 195px !important;}";
  434.  
  435.         //#chat
  436.         //WMEChatResizeStringer = WMEChatResizeStringer + "#chat {width: 497px !important;}"; //derived width 620 px
  437. 		WMEChatResizeStringer = WMEChatResizeStringer + "#chat {width: 620px !important;}"; //derived width 620 px
  438.  
  439.  
  440.         //chat-body
  441.         //WMEChatResizeStringer = WMEChatResizeStringer + ".chat-body {width: 497px !important;}"; //derived width 620 px
  442. 		WMEChatResizeStringer = WMEChatResizeStringer + ".chat-body {width: 620px !important;}"; //derived width 620 px
  443.  
  444.         //messages
  445.         //WMEChatResizeStringer = WMEChatResizeStringer + ".messages {width: 349px !important;}"; //427
  446. 		WMEChatResizeStringer = WMEChatResizeStringer + ".messages {width: 427px !important;}"; //427
  447.  
  448.  
  449.         //message-list
  450.         //WMEChatResizeStringer = WMEChatResizeStringer + ".message-list {width: 348px !important; max-height: 246px !important;}";
  451. 		//derived 396
  452. 		WMEChatResizeStringer = WMEChatResizeStringer + ".message-list {width: 396px !important; width: auto!important; max-height: 246px !important;}";
  453.  
  454.         //new-message
  455.         //WMEChatResizeStringer = WMEChatResizeStringer + ".new-message {width: 349px !important;}"; //427
  456. 		WMEChatResizeStringer = WMEChatResizeStringer + ".new-message {width: 427px !important;}"; //427
  457.  
  458.         //message-input
  459.         WMEChatResizeStringer = WMEChatResizeStringer + ".message-input {width: 100% !important;}";
  460.  
  461.         //unread-messages-notification
  462.         //WMEChatResizeStringer = WMEChatResizeStringer + ".unread-messages-notification {width: 322px !important;}"; //427
  463. 		WMEChatResizeStringer = WMEChatResizeStringer + ".unread-messages-notification {width: 427px !important;}"; //427
  464.  
  465. 		//.list-unstyled Chataddon padding fix
  466. 		WMEChatResizeStringer = WMEChatResizeStringer + ".list-unstyled {padding-left: 5px !important;}"
  467.  
  468.         document.getElementById("WMEChatResizeCSS").innerHTML = WMEChatResizeStringer;
  469.  
  470.  
  471.     };
  472.  
  473.  
  474.     WMEChatResize.TallHideUsers = function() {
  475.         //alert("TallHideUsers");
  476.         //WMEChatResizeHeight = "tall";
  477.         //console.log("WME Chat Resizer - TallHideUsers");
  478.         // adjust my buttons
  479.         document.getElementById('WMEChatResizeShortChatHideUsers').style.visibility="hidden";		// < short hide users
  480.         document.getElementById('WMEChatResizeTallHideUsers').style.visibility="hidden";			// > tall hide users
  481.         document.getElementById('WMEChatResizeShortChatShowUsers').style.visibility="hidden";		// < short show users
  482.         document.getElementById('WMEChatResizeTallShowUsers').style.visibility="visible";			// > tall show users
  483.         document.getElementById('WMEChatResizeShortChatHideUsers2').style.visibility="visible";		// V short hide users
  484.         document.getElementById('WMEChatResizeShortChatShowUsers2').style.visibility="hidden";		// V short show users
  485.         document.getElementById('WMEChatResizeTallHideUsers2').style.visibility="hidden";			// ^ tall hide users
  486.         document.getElementById('WMEChatResizeTallShowUsers2').style.visibility="hidden";			// ^ tall show users
  487.  
  488. 		document.getElementById('WMEChatResizeExtraShortChatHideUsers').style.visibility="visible";			// ^ tall show users
  489.  
  490.         var WMEChatResizeStringer = "";
  491.  
  492.         //chat
  493.         WMEChatResizeStringer = WMEChatResizeStringer + "#chat {height: 100% !important; width: 360px  !important;}";
  494.  
  495.         //chat-body
  496.         WMEChatResizeStringer = WMEChatResizeStringer + ".chat-body {height: 96% !important; width: 360px  !important;}";
  497.  
  498.         //messages
  499.         WMEChatResizeStringer = WMEChatResizeStringer + "#chat .messages {height: 95% !important; width: 348px !important; border-right: 0px solid rgba(126, 126, 126, 0.26)!important;}";
  500.  
  501.         WMEChatResizeStringer = WMEChatResizeStringer + "#chat-overlay #chat .messages .message-list {width: 360px  !important;height: auto!important;  top: 76px !important; bottom: 0px !important; position: absolute !important; max-height: 90% !important;}";
  502.  
  503.         //hide users list
  504.         WMEChatResizeStringer = WMEChatResizeStringer + ".users {visibility: hidden !important; width: 195px !important;}";
  505.  
  506.         //unread-messages-notification
  507.         WMEChatResizeStringer = WMEChatResizeStringer + ".unread-messages-notification {width: 251px !important;}";
  508.  
  509.         //new-message
  510.         WMEChatResizeStringer = WMEChatResizeStringer + "#chat .messages .new-message {width: 100% !important;}";
  511.  
  512.         //chat-overlay
  513.         WMEChatResizeStringer = WMEChatResizeStringer + "#chat-overlay {bottom: 26px !important; height: 85% !important;}";
  514.  
  515. 		//.list-unstyled Chataddon padding fix
  516. 		WMEChatResizeStringer = WMEChatResizeStringer + ".list-unstyled {padding-left: 5px !important;}"
  517.  
  518.         // lets build up a string and set that as the innerhtml
  519.         document.getElementById("WMEChatResizeCSS").innerHTML = WMEChatResizeStringer;
  520.  
  521.     };
  522.  
  523.  
  524.     WMEChatResize.TallShowUsers = function() {
  525.         //alert("TallShowUsers");
  526.         //WMEChatResizeHeight = "tall";
  527.         //console.log("WME Chat Resizer - TallShowUsers");
  528.         // adjust my buttons
  529.         document.getElementById('WMEChatResizeShortChatHideUsers').style.visibility="hidden";		// < short hide users
  530.         document.getElementById('WMEChatResizeTallHideUsers').style.visibility="visible";			// > tall hide users
  531.         document.getElementById('WMEChatResizeShortChatShowUsers').style.visibility="hidden";		// < short show users
  532.         document.getElementById('WMEChatResizeTallShowUsers').style.visibility="hidden";			// > tall show users
  533.         document.getElementById('WMEChatResizeShortChatHideUsers2').style.visibility="hidden";		// V short hide users
  534.         document.getElementById('WMEChatResizeShortChatShowUsers2').style.visibility="visible";		// V short show users
  535.         document.getElementById('WMEChatResizeTallHideUsers2').style.visibility="hidden";			// ^ tall hide users
  536.         document.getElementById('WMEChatResizeTallShowUsers2').style.visibility="hidden";			// ^ tall show users
  537.  
  538. 		document.getElementById('WMEChatResizeExtraShortChatHideUsers').style.visibility="visible";			// ^ tall show users
  539.  
  540.         var WMEChatResizeStringer = "";
  541.  
  542.         //chat
  543.         WMEChatResizeStringer = WMEChatResizeStringer + "#chat {width: 497px !important; height: 100% !important;}";
  544.  
  545.         //chat-body
  546.         WMEChatResizeStringer = WMEChatResizeStringer + ".chat-body {width: 497px !important; height: 96% !important;}";
  547.  
  548.         //messages
  549.         WMEChatResizeStringer = WMEChatResizeStringer + "#chat .messages {width: 482px !important; height: 95% !important;}";
  550.  
  551.         //message-list
  552.         WMEChatResizeStringer = WMEChatResizeStringer + "#chat-overlay #chat .messages .message-list {width: 349px !important; height: auto!important; top: 76px !important; bottom: 0px !important; position: absolute !important; max-height: 90% !important;}";
  553.  
  554.         //users
  555.         WMEChatResizeStringer = WMEChatResizeStringer + ".users {height: 99% !important; max-height: 91% !important; width: 195px !important;}";
  556.  
  557.         //chat-overlay
  558.         WMEChatResizeStringer = WMEChatResizeStringer + "#chat-overlay {bottom: 26px !important; height: 85% !important;}";
  559.  
  560.         //new-message
  561.         WMEChatResizeStringer = WMEChatResizeStringer + ".new-message {width: 349px !important;}";
  562.  
  563.         //message-input
  564.         WMEChatResizeStringer = WMEChatResizeStringer + ".message-input {width: 100% !important;}";
  565.  
  566.         //unread-messages-notification
  567.         WMEChatResizeStringer = WMEChatResizeStringer + ".unread-messages-notification {width: 322px !important;}";
  568.  
  569. 		//.list-unstyled Chataddon padding fix
  570. 		WMEChatResizeStringer = WMEChatResizeStringer + ".list-unstyled {padding-left: 5px !important;}"
  571.  
  572.         // lets build up a string and set that as the innerhtml
  573.         document.getElementById("WMEChatResizeCSS").innerHTML = WMEChatResizeStringer;
  574.  
  575.     };
  576.  
  577.     WMEChatResize.ExtraShortChatHideUsers = function() {
  578.         //alert("ExtraShortChatHideUsers");
  579. 		//console.log("WME Chat Resizer - ExtraShortChatHideUsers");
  580.         // adjust my buttons
  581.         document.getElementById('WMEChatResizeShortChatHideUsers').style.visibility="hidden";		// < short hide users
  582.         document.getElementById('WMEChatResizeTallHideUsers').style.visibility="hidden";			// > tall hide users
  583.         document.getElementById('WMEChatResizeShortChatShowUsers').style.visibility="visible";		// < short show users
  584.         document.getElementById('WMEChatResizeTallShowUsers').style.visibility="hidden";			// > tall show users
  585.         document.getElementById('WMEChatResizeShortChatHideUsers2').style.visibility="hidden";		// V short hide users
  586.         document.getElementById('WMEChatResizeShortChatShowUsers2').style.visibility="hidden";		// V short show users
  587.         document.getElementById('WMEChatResizeTallHideUsers2').style.visibility="visible";			// ^ tall hide users
  588.         document.getElementById('WMEChatResizeTallShowUsers2').style.visibility="hidden";			// ^ tall show users
  589.  
  590. 		document.getElementById('WMEChatResizeExtraShortChatHideUsers').style.visibility="hidden";			// ^ tall show users
  591.  
  592.  
  593.         var WMEChatResizeStringer = "";
  594.  
  595.         //hide users list
  596.         WMEChatResizeStringer = WMEChatResizeStringer + ".users {visibility: hidden !important; width: 195px !important;}";
  597.  
  598.         //document.getElementById('chat').style.width="310px ";  //497
  599.         WMEChatResizeStringer = WMEChatResizeStringer + "#chat {height: 200px !important; width: 400px !important; }"; //width: 310px
  600.  
  601.         //chat-body
  602.         WMEChatResizeStringer = WMEChatResizeStringer + ".chat-body {width: 400px !important;}"; //width: 310px
  603.  
  604.         //messages
  605.         WMEChatResizeStringer = WMEChatResizeStringer + ".messages {width: 400px !important; border-right: 0px solid rgba(126, 126, 126, 0.26)!important;}"; //width: 348px
  606.  
  607. 		//#chat-overlay
  608.         WMEChatResizeStringer = WMEChatResizeStringer + "#chat-overlay {height: 200px !important}";
  609.  
  610.  
  611.         //message-list
  612.         WMEChatResizeStringer = WMEChatResizeStringer + "#chat-overlay #chat .messages .message-list {width: 400px !important; top: 76px !important; bottom: 0px !important; position: absolute !important; max-height: 90% !important; min-height: 0px !important;}"; //width: 310px
  613.  
  614.         //new-message
  615.         WMEChatResizeStringer = WMEChatResizeStringer + "#chat .messages .new-message {width: 100% !important;}";
  616.  
  617.         //message-input
  618.         WMEChatResizeStringer = WMEChatResizeStringer + ".message-input {width: 100% !important;}";
  619.  
  620.         //unread-messages-notification width
  621.         WMEChatResizeStringer = WMEChatResizeStringer + ".unread-messages-notification {width: 251px !important;}";
  622.  
  623. 		//.list-unstyled Chataddon padding fix
  624. 		WMEChatResizeStringer = WMEChatResizeStringer + ".list-unstyled {padding-left: 5px !important;}"
  625.  
  626.         document.getElementById("WMEChatResizeCSS").innerHTML = WMEChatResizeStringer;
  627.     };
  628.  
  629.     WMEChatResize.startcode = function () {
  630.         // Check if WME is loaded, if not, waiting a moment and checks again. if yes init WMEChatResize
  631.         try {
  632.             //if ("undefined" != typeof unsafeWindow.W.model.chat.rooms._events.listeners.add[0].obj.userPresenters[unsafeWindow.W.model.loginManager.user.id] ) {
  633.             if ( $( "#chat" ).length ) {
  634. 				//console.log("WMEChatResize ready to resize");
  635.                 WMEChatResize.init();
  636.             } else {
  637.                 setTimeout(WMEChatResize.startcode, 200);
  638.             }
  639.         } catch(err) {
  640.             setTimeout(WMEChatResize.startcode, 200);
  641.         }
  642.     };
  643.     //setTimeout(WMEChatResize.startcode, 5000);
  644.     WMEChatResize.startcode();
  645. }
  646.  
  647. WMEChatResize_init();