Toggle Stack Overflow Chat Sidebar.user.js

Toggle-Stack-Overflow-Chat-Sidebar.user.js

// ==UserScript==
// @name       ToggleStackOverflowChatSidebar
// @version    1.0
// @description Toggle Stack Overflow Chat Sidebar (Hide & Show).
// @match      https://chat.stackoverflow.com/*
// @match      https://chat.stackexchange.com/*
// @author     Kevin M. Mansour : https://stackoverflow.com/users/14945696/
// ==/UserScript==

var $document = $(document),
    $window = $(window),
    log = console.log.bind(console);
windowWidth = $window.width();
$window.resize(function() {
    windowWidth = $window.width();
});

$document.ready(function() {
    var chatsidebar = $('#sidebar'),
        chatwindow = $('#main'),
        hidden = true;

    chatsidebar.css('marginRight', '-30%');
    chatwindow.css('width', '100%');

    $document.on('mousemove', function(event) {
        var fromLeft = windowWidth - event.pageX,
            percent = windowWidth * 0.3;
        if (fromLeft < 30 && hidden) {
            hidden = false;
            chatsidebar.stop().animate({
                marginRight: '0'
            });
            chatwindow.stop().animate({
                width: '70%'
            });
        } else if (fromLeft > percent && !hidden) {
            hidden = true;
            chatsidebar.stop().animate({
                marginRight: '-30%'
            });
            chatwindow.stop().animate({
                width: '100%'
            });
        }
    });
});