From 28e4ef1b13d464cdf3c5e961ee4025e31b3c5871 Mon Sep 17 00:00:00 2001
From: ansuz <ansuz@transitiontech.ca>
Date: Fri, 28 Apr 2017 17:11:50 +0200
Subject: [PATCH] WIP RPC code

---
 customize.dist/about.html                  |  2 +-
 customize.dist/contact.html                |  2 +-
 customize.dist/index.html                  |  2 +-
 customize.dist/privacy.html                |  2 +-
 customize.dist/src/fragments/footer.html   |  2 +-
 customize.dist/src/less/toolbar.less       | 41 +++++++++------
 customize.dist/terms.html                  |  2 +-
 customize.dist/toolbar.css                 | 61 ++++++++++++++--------
 customize.dist/translations/messages.fr.js |  1 +
 customize.dist/translations/messages.js    |  1 +
 rpc.js                                     | 24 ++++++++-
 www/common/common-hash.js                  |  5 ++
 www/common/common-history.js               | 31 ++++++-----
 www/common/cryptpad-common.js              | 13 +++--
 www/common/userObject.js                   |  2 +-
 www/drive/main.js                          | 49 ++++++++++++-----
 www/settings/index.html                    |  2 +-
 17 files changed, 158 insertions(+), 84 deletions(-)

diff --git a/customize.dist/about.html b/customize.dist/about.html
index c751125a7..2b13aca95 100644
--- a/customize.dist/about.html
+++ b/customize.dist/about.html
@@ -106,7 +106,7 @@
                     <div class="col">
                         <ul class="list-unstyled">
                             <li class="title" data-localization="footer_contact"><li>
-                            <li><a href="http://webchat.freenode.net?channels=%23cryptpad&uio=MT1mYWxzZSY5PXRydWUmMTE9Mjg3JjE1PXRydWUe7" target="_blank" rel="noopener noreferrer">IRC</a></li>
+                            <li><a href="https://riot.im/app/#/room/!cryptpad:matrix.org" target="_blank" rel="noopener noreferrer">Chat</a></li>
                             <li><a href="https://twitter.com/cryptpad" target="_blank" rel="noopener noreferrer">Twitter</a></li>
                             <li><a href="https://github.com/xwiki-labs/cryptpad" target="_blank" rel="noopener noreferrer">GitHub</a></li>
                             <li><a href="/contact.html">Email</a></li>
diff --git a/customize.dist/contact.html b/customize.dist/contact.html
index 619f98df4..eff9c1869 100644
--- a/customize.dist/contact.html
+++ b/customize.dist/contact.html
@@ -103,7 +103,7 @@
                     <div class="col">
                         <ul class="list-unstyled">
                             <li class="title" data-localization="footer_contact"><li>
-                            <li><a href="http://webchat.freenode.net?channels=%23cryptpad&uio=MT1mYWxzZSY5PXRydWUmMTE9Mjg3JjE1PXRydWUe7" target="_blank" rel="noopener noreferrer">IRC</a></li>
+                            <li><a href="https://riot.im/app/#/room/!cryptpad:matrix.org" target="_blank" rel="noopener noreferrer">Chat</a></li>
                             <li><a href="https://twitter.com/cryptpad" target="_blank" rel="noopener noreferrer">Twitter</a></li>
                             <li><a href="https://github.com/xwiki-labs/cryptpad" target="_blank" rel="noopener noreferrer">GitHub</a></li>
                             <li><a href="/contact.html">Email</a></li>
diff --git a/customize.dist/index.html b/customize.dist/index.html
index 7aa29d8e9..f6ab10fa6 100644
--- a/customize.dist/index.html
+++ b/customize.dist/index.html
@@ -225,7 +225,7 @@
                     <div class="col">
                         <ul class="list-unstyled">
                             <li class="title" data-localization="footer_contact"><li>
-                            <li><a href="http://webchat.freenode.net?channels=%23cryptpad&uio=MT1mYWxzZSY5PXRydWUmMTE9Mjg3JjE1PXRydWUe7" target="_blank" rel="noopener noreferrer">IRC</a></li>
+                            <li><a href="https://riot.im/app/#/room/!cryptpad:matrix.org" target="_blank" rel="noopener noreferrer">Chat</a></li>
                             <li><a href="https://twitter.com/cryptpad" target="_blank" rel="noopener noreferrer">Twitter</a></li>
                             <li><a href="https://github.com/xwiki-labs/cryptpad" target="_blank" rel="noopener noreferrer">GitHub</a></li>
                             <li><a href="/contact.html">Email</a></li>
diff --git a/customize.dist/privacy.html b/customize.dist/privacy.html
index 8d2e09f5f..a7751db84 100644
--- a/customize.dist/privacy.html
+++ b/customize.dist/privacy.html
@@ -124,7 +124,7 @@
                     <div class="col">
                         <ul class="list-unstyled">
                             <li class="title" data-localization="footer_contact"><li>
-                            <li><a href="http://webchat.freenode.net?channels=%23cryptpad&uio=MT1mYWxzZSY5PXRydWUmMTE9Mjg3JjE1PXRydWUe7" target="_blank" rel="noopener noreferrer">IRC</a></li>
+                            <li><a href="https://riot.im/app/#/room/!cryptpad:matrix.org" target="_blank" rel="noopener noreferrer">Chat</a></li>
                             <li><a href="https://twitter.com/cryptpad" target="_blank" rel="noopener noreferrer">Twitter</a></li>
                             <li><a href="https://github.com/xwiki-labs/cryptpad" target="_blank" rel="noopener noreferrer">GitHub</a></li>
                             <li><a href="/contact.html">Email</a></li>
diff --git a/customize.dist/src/fragments/footer.html b/customize.dist/src/fragments/footer.html
index ec80ed27d..b15a2b5da 100644
--- a/customize.dist/src/fragments/footer.html
+++ b/customize.dist/src/fragments/footer.html
@@ -31,7 +31,7 @@
                     <div class="col">
                         <ul class="list-unstyled">
                             <li class="title" data-localization="footer_contact"><li>
-                            <li><a href="http://webchat.freenode.net?channels=%23cryptpad&uio=MT1mYWxzZSY5PXRydWUmMTE9Mjg3JjE1PXRydWUe7" target="_blank" rel="noopener noreferrer">IRC</a></li>
+                            <li><a href="https://riot.im/app/#/room/!cryptpad:matrix.org" target="_blank" rel="noopener noreferrer">Chat</a></li>
                             <li><a href="https://twitter.com/cryptpad" target="_blank" rel="noopener noreferrer">Twitter</a></li>
                             <li><a href="https://github.com/xwiki-labs/cryptpad" target="_blank" rel="noopener noreferrer">GitHub</a></li>
                             <li><a href="/contact.html">Email</a></li>
diff --git a/customize.dist/src/less/toolbar.less b/customize.dist/src/less/toolbar.less
index f67e2ee96..40f895c24 100644
--- a/customize.dist/src/less/toolbar.less
+++ b/customize.dist/src/less/toolbar.less
@@ -42,7 +42,7 @@
     }
 
     button {
-        &#shareButton {
+        &#shareButton, &.btn.btn-success {
             // Bootstrap 4 colors
             color: #fff;
             background: @toolbar-green;
@@ -58,7 +58,7 @@
                 margin-left: 5px;
             }
         }
-        &#newdoc {
+        &#newdoc, &.btn.btn-primary {
             // Bootstrap 4 colors
             color: #fff;
             background: #0275d8;
@@ -77,10 +77,21 @@
         &.hidden {
             display: none;
         }
+
+        // Bootstrap 4 colors (btn-secondary)
+        border: 1px solid transparent;
+        border-radius: .25rem;
+        color: #292b2c;
+        background-color: #fff;
+        border-color: #ccc;
+        &:hover {
+            color: #292b2c;
+            background-color: #e6e6e6;
+            border-color: #adadad;
+        }
     }
 
     .cryptpad-limit {
-        color: red;
         box-sizing: content-box;
         height: 16px;
         width: 16px;
@@ -88,10 +99,11 @@
         padding: 3px;
         margin: 3px;
         margin-right: 6px;
-        font-size: 20px;
         span {
+            color: red;
             cursor: pointer;
             margin: auto;
+            font-size: 20px;
         }
     }
 
@@ -195,17 +207,6 @@
         margin-right: 2px;
     }
 
-    button {
-        color: #000;
-        background-color: inherit;
-        background-image: linear-gradient(to bottom,#fff,#e4e4e4);
-        border: 1px solid #A6A6A6;
-        border-bottom-color: #979797;
-        border-radius: 3px;
-        &:hover {
-            background-image:linear-gradient(to bottom,#f2f2f2,#ccc);
-        }
-    }
     .cryptpad-state {
         line-height: 32px; /* equivalent to 26px + 2*2px margin used for buttons */
     }
@@ -429,13 +430,19 @@
     display: none;
     text-align: center;
     .next {
-        float: right;
+        display: inline-block;
+        vertical-align: middle;
+        margin: 20px;
     }
     .previous {
-        float: left;
+        display: inline-block;
+        vertical-align: middle;
+        margin: 20px;
     }
     .goto {
         display: inline-block;
+        vertical-align: middle;
+        text-align: center;
         input { width: 50px; }
     }
     .gotoInput {
diff --git a/customize.dist/terms.html b/customize.dist/terms.html
index 73a13cea7..edfd77f86 100644
--- a/customize.dist/terms.html
+++ b/customize.dist/terms.html
@@ -107,7 +107,7 @@
                     <div class="col">
                         <ul class="list-unstyled">
                             <li class="title" data-localization="footer_contact"><li>
-                            <li><a href="http://webchat.freenode.net?channels=%23cryptpad&uio=MT1mYWxzZSY5PXRydWUmMTE9Mjg3JjE1PXRydWUe7" target="_blank" rel="noopener noreferrer">IRC</a></li>
+                            <li><a href="https://riot.im/app/#/room/!cryptpad:matrix.org" target="_blank" rel="noopener noreferrer">Chat</a></li>
                             <li><a href="https://twitter.com/cryptpad" target="_blank" rel="noopener noreferrer">Twitter</a></li>
                             <li><a href="https://github.com/xwiki-labs/cryptpad" target="_blank" rel="noopener noreferrer">GitHub</a></li>
                             <li><a href="/contact.html">Email</a></li>
diff --git a/customize.dist/toolbar.css b/customize.dist/toolbar.css
index 4ef7a4567..76eeb5b4d 100644
--- a/customize.dist/toolbar.css
+++ b/customize.dist/toolbar.css
@@ -117,41 +117,60 @@
 .cryptpad-toolbar a {
   float: right;
 }
-.cryptpad-toolbar button#shareButton {
+.cryptpad-toolbar button {
+  border: 1px solid transparent;
+  border-radius: .25rem;
+  color: #292b2c;
+  background-color: #fff;
+  border-color: #ccc;
+}
+.cryptpad-toolbar button#shareButton,
+.cryptpad-toolbar button.btn.btn-success {
   color: #fff;
   background: #5cb85c;
   border-color: #5cb85c;
 }
-.cryptpad-toolbar button#shareButton:hover {
+.cryptpad-toolbar button#shareButton:hover,
+.cryptpad-toolbar button.btn.btn-success:hover {
   background: #449d44;
   border: 1px solid #419641;
 }
-.cryptpad-toolbar button#shareButton span {
+.cryptpad-toolbar button#shareButton span,
+.cryptpad-toolbar button.btn.btn-success span {
   color: #fff;
 }
-.cryptpad-toolbar button#shareButton .large {
+.cryptpad-toolbar button#shareButton .large,
+.cryptpad-toolbar button.btn.btn-success .large {
   margin-left: 5px;
 }
-.cryptpad-toolbar button#newdoc {
+.cryptpad-toolbar button#newdoc,
+.cryptpad-toolbar button.btn.btn-primary {
   color: #fff;
   background: #0275d8;
   border-color: #0275d8;
 }
-.cryptpad-toolbar button#newdoc:hover {
+.cryptpad-toolbar button#newdoc:hover,
+.cryptpad-toolbar button.btn.btn-primary:hover {
   background: #025aa5;
   border: 1px solid #01549b;
 }
-.cryptpad-toolbar button#newdoc span {
+.cryptpad-toolbar button#newdoc span,
+.cryptpad-toolbar button.btn.btn-primary span {
   color: #fff;
 }
-.cryptpad-toolbar button#newdoc .large {
+.cryptpad-toolbar button#newdoc .large,
+.cryptpad-toolbar button.btn.btn-primary .large {
   margin-left: 5px;
 }
 .cryptpad-toolbar button.hidden {
   display: none;
 }
+.cryptpad-toolbar button:hover {
+  color: #292b2c;
+  background-color: #e6e6e6;
+  border-color: #adadad;
+}
 .cryptpad-toolbar .cryptpad-limit {
-  color: red;
   box-sizing: content-box;
   height: 16px;
   width: 16px;
@@ -159,11 +178,12 @@
   padding: 3px;
   margin: 3px;
   margin-right: 6px;
-  font-size: 20px;
 }
 .cryptpad-toolbar .cryptpad-limit span {
+  color: red;
   cursor: pointer;
   margin: auto;
+  font-size: 20px;
 }
 .cryptpad-toolbar .cryptpad-lag {
   box-sizing: content-box;
@@ -265,17 +285,6 @@
   margin-top: -3px;
   margin-right: 2px;
 }
-.cryptpad-toolbar button {
-  color: #000;
-  background-color: inherit;
-  background-image: linear-gradient(to bottom, #fff, #e4e4e4);
-  border: 1px solid #A6A6A6;
-  border-bottom-color: #979797;
-  border-radius: 3px;
-}
-.cryptpad-toolbar button:hover {
-  background-image: linear-gradient(to bottom, #f2f2f2, #ccc);
-}
 .cryptpad-toolbar .cryptpad-state {
   line-height: 32px;
   /* equivalent to 26px + 2*2px margin used for buttons */
@@ -492,13 +501,19 @@
   text-align: center;
 }
 .cryptpad-toolbar-history .next {
-  float: right;
+  display: inline-block;
+  vertical-align: middle;
+  margin: 20px;
 }
 .cryptpad-toolbar-history .previous {
-  float: left;
+  display: inline-block;
+  vertical-align: middle;
+  margin: 20px;
 }
 .cryptpad-toolbar-history .goto {
   display: inline-block;
+  vertical-align: middle;
+  text-align: center;
 }
 .cryptpad-toolbar-history .goto input {
   width: 50px;
diff --git a/customize.dist/translations/messages.fr.js b/customize.dist/translations/messages.fr.js
index 50a2bf667..030817836 100644
--- a/customize.dist/translations/messages.fr.js
+++ b/customize.dist/translations/messages.fr.js
@@ -133,6 +133,7 @@ define(function () {
     out.history_restoreTitle = "Restaurer la version du document sélectionnée";
     out.history_restorePrompt = "Êtes-vous sûr de vouloir remplacer la version actuelle du document par la version affichée ?";
     out.history_restoreDone = "Document restauré";
+    out.history_version = "Version :";
 
     // Polls
 
diff --git a/customize.dist/translations/messages.js b/customize.dist/translations/messages.js
index 7c5fd8df5..0c4c74a95 100644
--- a/customize.dist/translations/messages.js
+++ b/customize.dist/translations/messages.js
@@ -135,6 +135,7 @@ define(function () {
     out.history_restoreTitle = "Restore the selected version of the document";
     out.history_restorePrompt = "Are you sure you want to replace the current version of the document by the displayed one?";
     out.history_restoreDone = "Document restored";
+    out.history_version = "Version:";
 
     // Polls
 
diff --git a/rpc.js b/rpc.js
index 4d1e0005d..4c4afb10d 100644
--- a/rpc.js
+++ b/rpc.js
@@ -390,7 +390,20 @@ var safeMkdir = function (path, cb) {
 };
 
 var upload = function (store, Sessions, publicKey, cb) {
+/*
+    1. check if there is an upload in progress
+      * if yes, return error
+    2. 
 
+*/
+
+    console.log('UPLOAD_NOT_IMPLEMENTED');
+    cb('NOT_IMPLEMENTED');
+};
+
+var cancelUpload = function (store, Sessions, publicKey, cb) {
+    console.log('CANCEL_UPLOAD_NOT_IMPLEMENTED');
+    cb('NOT_IMPLEMENTED');
 };
 
 /*::const ConfigType = require('./config.example.js');*/
@@ -504,6 +517,15 @@ RPC.create = function (config /*:typeof(ConfigType)*/, cb /*:(?Error, ?Function)
                     if (e) { return void Respond(e); }
                     Respond(void 0, dict);
                 });
+
+            case 'UPLOAD':
+                return void upload(null, null, null, function (e) {
+                    Respond(e);
+                });
+            case 'CANCEL_UPLOAD':
+                return void cancelUpload(null, null, null, function (e) {
+                    Respond(e);
+                });
             default:
                 return void Respond('UNSUPPORTED_RPC_CALL', msg);
         }
@@ -531,7 +553,7 @@ RPC.create = function (config /*:typeof(ConfigType)*/, cb /*:(?Error, ?Function)
                 setInterval(function () {
                     expireSessions(Sessions);
                 }, 60000);
-            })
+            });
         });
     });
 };
diff --git a/www/common/common-hash.js b/www/common/common-hash.js
index b282a1b94..1d731cec0 100644
--- a/www/common/common-hash.js
+++ b/www/common/common-hash.js
@@ -270,5 +270,10 @@ Version 2
         return '/blob/' + id.slice(0,2) + '/' + id;
     };
 
+    var serializeHash = Hash.serializeHash = function (hash) {
+        if (hash && hash.slice(-1) !== "/") { hash += "/"; }
+        return hash;
+    };
+
     return Hash;
 });
diff --git a/www/common/common-history.js b/www/common/common-history.js
index e006210a6..2cd5b7707 100644
--- a/www/common/common-history.js
+++ b/www/common/common-history.js
@@ -75,6 +75,8 @@ define([
 
     var create = History.create = function (common, config) {
         if (!config.$toolbar) { return void console.error("config.$toolbar is undefined");}
+        if (History.loading) { return void console.error("History is already being loaded..."); }
+        History.loading = true;
         var $toolbar = config.$toolbar;
         var noFunc = function () {};
         var render = config.onRender || noFunc;
@@ -112,9 +114,9 @@ define([
             var val = states[i].getContent().doc;
             c = i;
             if (typeof onUpdate === "function") { onUpdate(); }
-            $hist.find('.next, .previous').show();
-            if (c === states.length - 1) { $hist.find('.next').hide(); }
-            if (c === 0) { $hist.find('.previous').hide(); }
+            $hist.find('.next, .previous').css('visibility', '');
+            if (c === states.length - 1) { $hist.find('.next').css('visibility', 'hidden'); }
+            if (c === 0) { $hist.find('.previous').css('visibility', 'hidden'); }
             return val || '';
         };
 
@@ -132,15 +134,16 @@ define([
             $right.hide();
             $cke.hide();
             var $prev =$('<button>', {
-                'class': 'previous fa fa-step-backward',
+                'class': 'previous fa fa-step-backward btn btn-primary',
                 title: Messages.history_prev
             }).appendTo($hist);
+            var $nav = $('<div>', {'class': 'goto'}).appendTo($hist);
             var $next = $('<button>', {
-                'class': 'next fa fa-step-forward',
+                'class': 'next fa fa-step-forward btn btn-primary',
                 title: Messages.history_next
             }).appendTo($hist);
 
-            var $nav = $('<div>', {'class': 'goto'}).appendTo($hist);
+            var $label = $('<label>').text(Messages.history_version).appendTo($nav);
             var $cur = $('<input>', {
                 'class' : 'gotoInput',
                 'type' : 'number',
@@ -151,19 +154,15 @@ define([
                 e.stopPropagation();
             });
             var $label = $('<label>').text(' / '+ states.length).appendTo($nav);
-            var $goTo = $('<button>', {
-                'class': 'fa fa-check',
-                'title': Messages.history_goTo
-            }).appendTo($nav);
             $('<br>').appendTo($nav);
-            var $rev = $('<button>', {
-                'class':'revertHistory',
-                title: Messages.history_restoreTitle
-            }).text(Messages.history_restore).appendTo($nav);
             var $close = $('<button>', {
                 'class':'closeHistory',
                 title: Messages.history_closeTitle
             }).text(Messages.history_close).appendTo($nav);
+            var $rev = $('<button>', {
+                'class':'revertHistory btn btn-success',
+                title: Messages.history_restoreTitle
+            }).text(Messages.history_restore).appendTo($nav);
 
             onUpdate = function () {
                 $cur.attr('max', states.length);
@@ -181,7 +180,6 @@ define([
             // Buttons actions
             $prev.click(function () { render(getPrevious()); });
             $next.click(function () { render(getNext()); });
-            $goTo.click(function () { render( get($cur.val() - 1) ); });
             $cur.keydown(function (e) {
                 var p = function () { e.preventDefault(); };
                 if (e.which === 13) { p(); return render( get($cur.val() - 1) ); } // Enter
@@ -192,7 +190,7 @@ define([
                 if (e.which === 27) { p(); $close.click(); }
             }).focus();
             $cur.on('change', function () {
-                $goTo.click();
+                render( get($cur.val() - 1) );
             });
             $close.click(function () {
                 states = [];
@@ -214,6 +212,7 @@ define([
 
         // Load all the history messages into a new chainpad object
         loadHistory(common, function (err, newRt) {
+            History.loading = false;
             if (err) { throw new Error(err); }
             realtime = newRt;
             update();
diff --git a/www/common/cryptpad-common.js b/www/common/cryptpad-common.js
index 20f68f3be..a2d2f5aaf 100644
--- a/www/common/cryptpad-common.js
+++ b/www/common/cryptpad-common.js
@@ -82,6 +82,7 @@ define([
     common.createChannelId = Hash.createChannelId;
     common.findWeaker = Hash.findWeaker;
     common.findStronger = Hash.findStronger;
+    common.serializeHash = Hash.serializeHash;
 
     // History
     common.getHistory = function (config) { return History.create(common, config); };
@@ -166,6 +167,7 @@ define([
     var login = common.login = function (hash, name, cb) {
         if (!hash) { throw new Error('expected a user hash'); }
         if (!name) { throw new Error('expected a user name'); }
+        hash = common.serializeHash(hash);
         localStorage.setItem(userHashKey, hash);
         localStorage.setItem(userNameKey, name);
         if (cb) { cb(); }
@@ -216,11 +218,12 @@ define([
     };
 
     var getUserHash = common.getUserHash = function () {
-        var hash;
-        [sessionStorage, localStorage].some(function (s) {
-            var h = s[userHashKey];
-            if (h) { return (hash = h); }
-        });
+        var hash = localStorage[userHashKey];
+
+        if (hash) {
+            var sHash = common.serializeHash(hash);
+            if (sHash !== hash) { localStorage[userHashKey] = sHash; }
+        }
 
         return hash;
     };
diff --git a/www/common/userObject.js b/www/common/userObject.js
index 247d28694..0197367a4 100644
--- a/www/common/userObject.js
+++ b/www/common/userObject.js
@@ -731,7 +731,7 @@ define([
             parentEl[newName] = element;
             parentEl[oldName] = undefined;
             delete parentEl[oldName];
-            cb();
+            if (typeof cb === "function") { cb(); }
         };
 
         // REPLACE
diff --git a/www/drive/main.js b/www/drive/main.js
index d60836ca1..47fe4897b 100644
--- a/www/drive/main.js
+++ b/www/drive/main.js
@@ -286,7 +286,7 @@ define([
             }
         };
         $content.on('mousedown', function (e) {
-            console.log('down');
+            if (e.which !== 1) { return; }
             sel.down = true;
             if (!e.ctrlKey) { removeSelected(); }
             var rect = e.currentTarget.getBoundingClientRect();
@@ -298,7 +298,7 @@ define([
                 width: '0px',
                 height: '0px'
             });
-            if (sel.move) { console.log('ret'); return; }
+            if (sel.move) { return; }
             sel.move = function (ev) {
                 var rectMove = ev.currentTarget.getBoundingClientRect(),
                     offX = ev.clientX - rectMove.left,
@@ -342,7 +342,6 @@ define([
                             sel.to = undefined;
                         }, (sel.refresh - diffT));
                     }
-                    console.log('cancelled');
                     return;
                 }
                 sel.update = +new Date();
@@ -351,7 +350,7 @@ define([
             $content.mousemove(sel.move);
         });
         $content.on('mouseup', function (e) {
-            console.log(sel.pos);
+            if (e.which !== 1) { return; }
             sel.down = false;
             sel.$selectBox.hide();
             $content.off('mousemove', sel.move);
@@ -640,6 +639,36 @@ define([
             updateContextButton();
         };
 
+        var displayMenu = function (e, $menu) {
+            $menu.css({ display: "block" });
+            var h = $menu.outerHeight();
+            var w = $menu.outerWidth();
+            var wH = window.innerHeight;
+            var wW = window.innerWidth;
+            if (e.pageY + h <= wH) {
+                $menu.css({
+                    top: e.pageY+'px',
+                    bottom: ''
+                });
+            } else {
+                $menu.css({
+                    bottom: '0px',
+                    top: ''
+                });
+            }
+            if (e.pageX + w <= wW) {
+                $menu.css({
+                    left: e.pageX+'px',
+                    right: ''
+                });
+            } else {
+                $menu.css({
+                    left: '',
+                    right: '0px',
+                });
+            }
+        };
+
         // Open the selected context menu on the closest "li" element
         var openContextMenu = function (e, $menu) {
             module.hideMenu();
@@ -664,11 +693,7 @@ define([
                 $a.parent('li').hide();
             });
 
-            $menu.css({
-                display: "block",
-                left: e.pageX,
-                top: e.pageY
-            });
+            displayMenu(e, $menu);
 
             if ($menu.find('li:visible').length === 0) {
                 debug("No visible element in the context menu. Abort.");
@@ -730,11 +755,7 @@ define([
                 }
             });
 
-            $menu.css({
-                display: "block",
-                left: e.pageX,
-                top: e.pageY
-            });
+            displayMenu(e, $menu);
 
             if ($menu.find('li:visible').length === 0) {
                 debug("No visible element in the context menu. Abort.");
diff --git a/www/settings/index.html b/www/settings/index.html
index a84a60963..c24748490 100644
--- a/www/settings/index.html
+++ b/www/settings/index.html
@@ -97,7 +97,7 @@
                     <div class="col">
                         <ul class="list-unstyled">
                             <li class="title" data-localization="footer_contact"><li>
-                            <li><a href="http://webchat.freenode.net?channels=%23cryptpad&uio=MT1mYWxzZSY5PXRydWUmMTE9Mjg3JjE1PXRydWUe7" target="_blank" rel="noopener noreferrer">IRC</a></li>
+                            <li><a href="https://riot.im/app/#/room/!cryptpad:matrix.org" target="_blank" rel="noopener noreferrer">Chat</a></li>
                             <li><a href="https://twitter.com/cryptpad" target="_blank" rel="noopener noreferrer">Twitter</a></li>
                             <li><a href="https://github.com/xwiki-labs/cryptpad" target="_blank" rel="noopener noreferrer">GitHub</a></li>
                             <li><a href="/contact.html">Email</a></li>