[PLUG-IN] Overlay outside of AWC

This is a very simple plug-in which will add an overlay to your forum when AWC is opened. The overlay is a stylish tranparant white (for dark boards, I'd recommend changing it to black).
This pulls focus on the chatbox, and overall just looks pretty cool to your users. Additionally, clicking on the overlay, will close the chatbox and go back into your forum.

Here's the plug in, just a small code adding 2 event handlers to AWC, utilizing the onopen and onclose events.
[bspoiler=Versions 1.6-1.8]

Code:

[panda=js]avacweb_chat_config.add_event('onopen', function() {
   var o = document.getElementById('awc-overlay');
   if(!o) {
      o = document.createElement('div');
      o.id = 'awc-overlay';
      document.body.appendChild(o);
      $(o).click(function() { avacweb_chat.toggle(); });
   }
   o.style.display = '';
});
avacweb_chat_config.add_event('onclose', function() {
   var o = document.getElementById('awc-overlay');
   if(o) o.style.display = 'none';
});

[/bspoiler]

[bspoiler=Version 1.9+]

Code:

[panda=js]avacweb_chat_config.add_event('onopen', function() {
   var o = document.getElementById('awc-overlay');
   if(!o) {
      o = document.createElement('div');
      o.id = 'awc-overlay';
      document.body.appendChild(o);
      $(o).click(function() { avacweb_chat.settings.toggle('open'); });
   }
   o.style.display = '';
});
avacweb_chat_config.add_event('onclose', function() {
   var o = document.getElementById('awc-overlay');
   if(o) o.style.display = 'none';
});

[/bspoiler]

Then to style the overlay, use this CSS:

Code:

[panda=css]#awc-overlay {
    -moz-opacity: 0.5;
    -webkit-opacity: 0.5;
    background: #FFF; /* CHange this to #000 for darker themed boards */
    filter: alpha(opacity=50);
    min-height: 100%;
    left: 0;
    opacity: 0.5;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 999;
}

Nice! Thank You, LG!

Thank you LG!

Hi Lg before the new Chat update when clicking on the dark faded overlay the chat window would close but now you have updated the chat Box to 1.9 this no longer works
you have to click the chat box button can you please fix this so we can click the overlay to shut the chat aswell.

Much thanks

Ape.

I have edited the first post to include a 1.9+ code.

  Thank you Works like a charm

just like to add love the new chat system it rocks

this plugin works fine with AWC 2.0