From 63c65f784ba2b9bb3bd1f088e97f4112128d1075 Mon Sep 17 00:00:00 2001
From: John McLear <john@mclear.co.uk>
Date: Mon, 19 Jan 2015 01:45:49 +0000
Subject: [PATCH 1/2] semi working example

---
 src/locales/en.json    |  1 +
 src/static/css/pad.css | 11 +++++++++++
 src/static/js/chat.js  | 14 ++++++++++++++
 src/static/js/pad.js   | 15 +++++++++++++++
 src/templates/pad.html |  4 ++++
 5 files changed, 45 insertions(+)

diff --git a/src/locales/en.json b/src/locales/en.json
index 7f5846fd..de309ba1 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -32,6 +32,7 @@
   "pad.settings.padSettings": "Pad Settings",
   "pad.settings.myView": "My View",
   "pad.settings.stickychat": "Chat always on screen",
+  "pad.settings.chatAndUsers": "Show Chat and Users",
   "pad.settings.colorcheck": "Authorship colors",
   "pad.settings.linenocheck": "Line numbers",
   "pad.settings.rtlcheck": "Read content from right to left?",
diff --git a/src/static/css/pad.css b/src/static/css/pad.css
index 4ba9f575..1b648206 100644
--- a/src/static/css/pad.css
+++ b/src/static/css/pad.css
@@ -914,6 +914,17 @@ input[type=checkbox] {
   border-left: 1px solid #ccc !important;
   width: 185px !important;
 }
+.chatAndUsers{
+  display:block !important;
+  right:0px !important;
+  border-radius:0px !important;
+  height:185px !important;
+  width:180px !important;
+}
+.chatAndUsersChat{
+  top:300px !important;
+}
+
 @media screen and (max-width: 600px) {
   .toolbar ul li.separator {
     display: none;
diff --git a/src/static/js/chat.js b/src/static/js/chat.js
index 4cbbbaa7..82ca15bd 100644
--- a/src/static/js/chat.js
+++ b/src/static/js/chat.js
@@ -54,6 +54,20 @@ var chat = (function()
         isStuck = false;
       }
     },
+    chatAndUsers: function(status){
+      if(status || $('#options-chatandusers').prop('checked')){
+        padcookie.setPref("chatAndUsers", true);
+        chat.stickToScreen(true);
+        $('#options-stickychat').prop("disabled", "disabled");
+        $('#users').addClass("chatAndUsers");
+        $("#chatbox").addClass("chatAndUsersChat");
+      }else{
+        chat.stickToScreen(false);
+        $('#options-stickychat').prop("disabled", false);
+        $('#users').removeClass("chatAndUsers");
+        $("#chatbox").removeClass("chatAndUsersChat");
+      }
+    },
     hide: function () 
     {
       // decide on hide logic based on chat window being maximized or not 
diff --git a/src/static/js/pad.js b/src/static/js/pad.js
index ff62f86c..5b173642 100644
--- a/src/static/js/pad.js
+++ b/src/static/js/pad.js
@@ -120,6 +120,7 @@ var getParameters = [
   { name: "userColor",        checkVal: null,    callback: function(val) { settings.globalUserColor = decodeURIComponent(val); } },
   { name: "rtl",              checkVal: "true",  callback: function(val) { settings.rtlIsTrue = true } },
   { name: "alwaysShowChat",   checkVal: "true",  callback: function(val) { chat.stickToScreen(); } },
+  { name: "chatAndUsers",     checkVal: "true",  callback: function(val) { chat.chatAndUsers(); } },
   { name: "lang",             checkVal: null,    callback: function(val) { window.html10n.localize([val, 'en']); } }
 ];
 
@@ -562,6 +563,10 @@ var pad = {
         chat.stickToScreen(true); // stick it to the screen
         $('#options-stickychat').prop("checked", true); // set the checkbox to on
       }
+      if(padcookie.getPref("chatAndUsers")){ // if we have a cookie for always showing chat then show it
+        chat.chatAndUsers(true); // stick it to the screen
+        $('#options-chatandusers').prop("checked", true); // set the checkbox to on
+      }
       if(padcookie.getPref("showAuthorshipColors") == false){
         pad.changeViewOption('showAuthorColors', false);
       }
@@ -791,6 +796,16 @@ var pad = {
       $('#options-stickychat').prop("checked", false); // set the checkbox for off
     }
   },
+  determineChatAndUsersVisibility: function(){
+    var chatAUVisCookie = padcookie.getPref('chatAndUsersVisible');
+    if(chatAUVisCookie){ // if the cookie is set for chat always visible
+      chat.chatAndUsers(true); // stick it to the screen
+      $('#options-chatandusers').prop("checked", true); // set the checkbox to on
+    }
+    else{
+      $('#options-chatandusers').prop("checked", false); // set the checkbox for off
+    }
+  },
   determineAuthorshipColorsVisibility: function(){
     var authColCookie = padcookie.getPref('showAuthorshipColors');
     if (authColCookie){
diff --git a/src/templates/pad.html b/src/templates/pad.html
index ce1ea218..48b46c41 100644
--- a/src/templates/pad.html
+++ b/src/templates/pad.html
@@ -133,6 +133,10 @@
                     <input type="checkbox" id="options-stickychat" onClick="chat.stickToScreen();">
                     <label for="options-stickychat" data-l10n-id="pad.settings.stickychat"></label>
                 </p>
+                <p>
+                    <input type="checkbox" id="options-chatandusers" onClick="chat.chatAndUsers();">
+                    <label for="options-chatandusers" data-l10n-id="pad.settings.chatAndUsers"></label>
+                </p>
                 <p>
                     <input type="checkbox" id="options-colorscheck">
                     <label for="options-colorscheck" data-l10n-id="pad.settings.colorcheck"></label>

From 13eff60dfea7b5ddcca15f9c4c4adab18c3e7dfe Mon Sep 17 00:00:00 2001
From: John McLear <john@mclear.co.uk>
Date: Mon, 19 Jan 2015 02:13:34 +0000
Subject: [PATCH 2/2] mheh I suck at css 0ip would do a way better job of this

---
 src/static/css/pad.css | 19 ++++++++++++++++---
 1 file changed, 16 insertions(+), 3 deletions(-)

diff --git a/src/static/css/pad.css b/src/static/css/pad.css
index 1b648206..0ecf91f0 100644
--- a/src/static/css/pad.css
+++ b/src/static/css/pad.css
@@ -918,11 +918,24 @@ input[type=checkbox] {
   display:block !important;
   right:0px !important;
   border-radius:0px !important;
-  height:185px !important;
-  width:180px !important;
+  height:200px !important;
+  width:182px !important;
+  margin:2px 0 0 0 !important;
+  border: none !important;
+  border-bottom: 1px solid #ccc !important;
+}
+.chatAndUsersChat > div > #titlecross{
+  display:none;
 }
 .chatAndUsersChat{
-  top:300px !important;
+  bottom:0px !important;
+  padding:0 !important;
+  margin:0 !important;
+  right:0 !important;
+  top: 315px !important;
+  width:182px !important;
+  border: none !important;
+  padding:5px !important;
 }
 
 @media screen and (max-width: 600px) {