diff --git a/src/static/css/pad.css b/src/static/css/pad.css
index cf89ed35dfc..f5483d92440 100644
--- a/src/static/css/pad.css
+++ b/src/static/css/pad.css
@@ -53,6 +53,715 @@ a img {
/* Not sure why important is required here but it is */
border: 1px solid #666 !important;
}
+.toolbar ul li a.grouped-left {
+ border-radius: 3px 0 0 3px;
+}
+.toolbar ul li a.grouped-middle {
+ border-radius: 0;
+ margin-left: -2px;
+ border-left: 0;
+}
+.toolbar ul li a.grouped-right {
+ border-radius: 0 3px 3px 0;
+ margin-left: -2px;
+ border-left: 0;
+}
+.toolbar ul li a.selected {
+ background: #eee !important;
+ background: -webkit-linear-gradient(#EEE, #F0F0F0) !important;
+ background: -moz-linear-gradient(#EEE, #F0F0F0) !important;
+ background: -o-linear-gradient(#EEE, #F0F0F0) !important;
+ background: -ms-linear-gradient(#EEE, #F0F0F0) !important;
+ background: linear-gradient(#EEE, #F0F0F0) !important;
+}
+.toolbar ul li select {
+ background: #fff;
+ padding: 4px;
+ line-height: 22px; /* fix for safari (win/mac) */
+ height: 28px; /* fix for chrome (mac) */
+ border-radius: 3px;
+ border: 1px solid #ccc;
+ outline: none;
+}
+.toolbar ul.menu_left {
+ left:0px;
+ right:250px;
+}
+
+.toolbar ul.menu_right {
+ right:0px;
+}
+
+li[data-key=showusers] > a {
+ min-width: 30px;
+ text-align: left;
+}
+li[data-key=showusers] > a #online_count {
+ color: #777;
+ font-size: 11px;
+ position: relative;
+ top: 2px;
+ padding-left: 2px;
+}
+#editbar{
+ display:none;
+}
+
+#editorcontainer {
+ position: absolute;
+ top: 37px; /* + 1px border */
+ left: 0px;
+ right: 0px;
+ bottom: 0px;
+ z-index: 1;
+
+ /* Required to be able to scroll on iOS: */
+ -webkit-overflow-scrolling: touch;
+}
+#editorcontainer iframe {
+ height: 100%;
+ width: 100%;
+ padding: 0;
+ margin: 0;
+ left: 0; /* Required for safari fixes RTL */
+}
+#editorloadingbox {
+ padding-top: 100px;
+ padding-bottom: 100px;
+ font-size: 2.5em;
+ color: #aaa;
+ text-align: center;
+ position: absolute;
+ width: 100%;
+ height: 30px;
+ z-index: 100;
+}
+
+#editorloadingbox .passForm{
+ padding:10px;
+}
+
+#editorloadingbox input{
+ padding:10px;
+}
+
+#editorloadingbox button{
+ padding:10px;
+}
+
+.loadingAnimation{
+ -webkit-animation: loadingAnimation 2s infinite linear;
+ animation: loadingAnimation 2s infinite linear;
+ font-family: "fontawesome-etherpad";
+ font-size:24px;
+ z-index:150;
+ width:25px;
+ height:25px;
+}
+
+.loadingAnimation:before{
+ content: "\e80e";
+}
+
+@-webkit-keyframes loadingAnimation {
+ 0% {
+ -webkit-transform: rotate(0deg);
+ transform: rotate(0deg);
+ }
+ 100% {
+ -webkit-transform: rotate(359deg);
+ transform: rotate(359deg);
+ }
+}
+@keyframes loadingAnimation {
+ 0% {
+ -webkit-transform: rotate(0deg);
+ transform: rotate(0deg);
+ }
+ 100% {
+ -webkit-transform: rotate(359deg);
+ transform: rotate(359deg);
+ }
+}
+
+#editorcontainerbox {
+ position: absolute;
+ bottom: 0;
+ top: 0;
+ width: 100%;
+}
+#padpage {
+ position: absolute;
+ top: 0px;
+ bottom: 0px;
+ width: 100%;
+}
+#padmain {
+ margin-top: 0px;
+ position: absolute;
+ top: 63px !important;
+ left: 0px;
+ right: 0px;
+ bottom: 0px;
+ zoom: 1;
+}
+#padeditor {
+ bottom: 0px;
+ left: 0;
+ position: absolute;
+ right: 0px;
+ top: 0;
+ zoom: 1;
+}
+#myswatchbox {
+ position: absolute;
+ left: 5px;
+ top: 5px;
+ width: 24px;
+ height: 24px;
+ border: 1px solid #000;
+ background: transparent;
+ cursor: pointer;
+}
+#myswatch {
+ width: 100%;
+ height: 100%;
+ background: transparent; /*...initially*/
+}
+#mycolorpicker {
+ width: 232px;
+ height: 265px;
+ position: absolute;
+ left: -250px;
+ top: 0px;
+ z-index: 101;
+ display: none;
+ border-radius: 0 0 6px 6px;
+ background: #f7f7f7;
+ border: 1px solid #ccc;
+ border-top: 0;
+ padding-left: 10px;
+ padding-top: 10px;
+}
+#mycolorpickersave {
+ left: 10px;
+ font-weight: bold;
+}
+#mycolorpickercancel {
+ left: 85px
+}
+#mycolorpickersave,
+#mycolorpickercancel {
+ background: #fff;
+ background: -webkit-linear-gradient(#fff, #ccc);
+ background: -moz-linear-gradient(#fff, #ccc);
+ background: -o-linear-gradient(#fff, #ccc);
+ background: -ms-linear-gradient(#fff, #ccc);
+ background: linear-gradient(#fff, #ccc);
+ border: 1px solid #ccc;
+ -webkit-border-radius: 4px;
+ -moz-border-radius: 4px;
+ border-radius: 4px;
+ font-size: 12px;
+ cursor: pointer;
+ color: #000;
+ overflow: hidden;
+ padding: 4px;
+ top: 240px;
+ text-align: center;
+ position: absolute;
+ width: 60px;
+}
+#mycolorpickerpreview {
+ position: absolute;
+ left: 207px;
+ top: 240px;
+ width: 16px;
+ height: 16px;
+ padding: 4px;
+ overflow: hidden;
+ color: #fff;
+ -webkit-border-radius: 5px;
+ -moz-border-radius: 5px;
+ border-radius: 5px;
+}
+#myusernameform {
+ margin-left: 30px
+}
+#myusernameedit {
+ font-size: 1.3em;
+ color: #fff;
+ padding: 3px;
+ height: 18px;
+ margin: 0;
+ border: 0;
+ width: 122px;
+ background: transparent;
+}
+#myusernameform input.editable {
+ border: 1px solid #444
+}
+#myuser .myusernameedithoverable:hover {
+ background: white;
+ color: black;
+}
+#mystatusform {
+ margin-left: 35px;
+ margin-top: 5px;
+}
+#mystatusedit {
+ font-size: 1.2em;
+ color: #777;
+ font-style: italic;
+ display: none;
+ padding: 2px;
+ height: 14px;
+ margin: 0;
+ border: 1px solid #bbb;
+ width: 199px;
+ background: transparent;
+}
+#myusernameform .editactive,
+#myusernameform .editempty {
+ background: white;
+ border-left: 1px solid #c3c3c3;
+ border-top: 1px solid #c3c3c3;
+ border-right: 1px solid #e6e6e6;
+ border-bottom: 1px solid #e6e6e6;
+ color: #000;
+}
+#myusernameform .editempty {
+ color: #333
+}
+#myswatchbox, #myusernameedit, #otheruserstable .swatch {
+ border: 1px solid #ccc !important;
+ color: #333;
+}
+table#otheruserstable {
+ display: none
+}
+#nootherusers {
+ padding: 10px;
+ font-size: 1.2em;
+ color: #eee;
+ font-weight: bold;
+}
+#nootherusers a {
+ color: #3C88FF
+}
+#otheruserstable td {
+ height: 26px;
+ vertical-align: middle;
+ padding: 0 2px;
+ color: #333;
+}
+#otheruserstable .swatch {
+ border: 1px solid #000;
+ width: 13px;
+ height: 13px;
+ overflow: hidden;
+ margin: 0 4px;
+ -webkit-touch-callout: none;
+ -webkit-user-select: none;
+ -khtml-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+}
+.usertdswatch {
+ width: 1%
+}
+.usertdname {
+ font-size: 1.3em;
+ color: #444;
+}
+.usertdstatus {
+ font-size: 1.1em;
+ font-style: italic;
+ color: #999;
+}
+.usertdactivity {
+ font-size: 1.1em;
+ color: #777;
+}
+.usertdname input {
+ border: 1px solid #bbb;
+ width: 80px;
+ padding: 2px;
+}
+.usertdname input.editactive,
+.usertdname input.editempty {
+ background: white;
+ border-left: 1px solid #c3c3c3;
+ border-top: 1px solid #c3c3c3;
+ border-right: 1px solid #e6e6e6;
+ border-bottom: 1px solid #e6e6e6;
+}
+.usertdname input.editempty {
+ color: #888;
+ font-style: italic;
+}
+
+#connectivity {
+ z-index: 600 !important;
+}
+
+#connectivity * {
+ display: none;
+}
+
+#connectivity .visible,
+#connectivity .visible * {
+ display: block;
+}
+
+/* styles for the automatic reconnection timer: */
+#connectivity .visible.with_reconnect_timer button,
+#connectivity .visible.with_reconnect_timer .reconnecttimer * {
+ display: inline-block;
+}
+
+#connectivity .with_reconnect_timer .hidden,
+#connectivity .with_reconnect_timer #defaulttext.hidden,
+#connectivity .with_reconnect_timer button.hidden {
+ display: none;
+}
+
+#connectivity .with_reconnect_timer #cancelreconnect {
+ margin-left: 10px;
+}
+/* end of styles for the automatic reconnection timer */
+
+#reconnect_form button {
+ font-size: 12pt;
+ padding: 5px;
+}
+
+.toolbar #overlay {
+ z-index: 500;
+ display: none;
+ background-repeat: repeat-both;
+ width: 100%;
+ position: absolute;
+ height: inherit;
+ left: 0;
+ top: 0;
+}
+* html #overlay {
+ /* for IE 6+ */
+ -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
+ filter: alpha(opacity=100);
+ opacity: 1; /* in case this is looked at */
+ background-image: none;
+ background-repeat: no-repeat; /* scale the image */
+}
+
+#chatbox {
+ position: absolute;
+ bottom: 0px;
+ right: 20px;
+ width: 180px;
+ height: 200px;
+ z-index: 400;
+ background-color: #f7f7f7;
+ border-left: 1px solid #999;
+ border-right: 1px solid #999;
+ border-top: 1px solid #999;
+ padding: 3px;
+ padding-bottom: 10px;
+ border-top-left-radius: 5px;
+ border-top-right-radius: 5px;
+ display: none;
+}
+#chattext {
+ background-color: white;
+ border: 1px solid white;
+ -ms-overflow-y: scroll;
+ overflow-y: scroll;
+ font-size: 12px;
+ position: absolute;
+ right: 0px;
+ left: 0px;
+ top: 25px;
+ bottom: 25px;
+ z-index: 1002;
+}
+#chattext p {
+ padding: 3px;
+ -ms-overflow-x: hidden;
+ overflow-x: hidden;
+}
+.chatloadmessages
+{
+ margin-bottom: 5px;
+ margin-top: 5px;
+ margin-left: auto;
+ margin-right: auto;
+ display: block;
+}
+#chatloadmessagesbutton
+{
+ line-height: 1.8em;
+}
+#chatloadmessagesball
+{
+ display: none;
+}
+#chatinputbox {
+ padding: 3px 2px;
+ position: absolute;
+ bottom: 0px;
+ right: 0px;
+ left: 3px;
+}
+#chatlabel {
+ font-size: 13px;
+ font-weight: bold;
+ color: #555;
+ text-decoration: none;
+ margin-right: 3px;
+ vertical-align: middle;
+}
+#chatinput {
+ border: 1px solid #BBBBBB;
+ width: 100%;
+ float: right;
+}
+#chaticon {
+ z-index: 400;
+ position: fixed;
+ bottom: 0px;
+ right: 20px;
+ padding: 5px;
+ border-left: 1px solid #999;
+ border-right: 1px solid #999;
+ border-top: 1px solid #999;
+ border-top-left-radius: 5px;
+ border-top-right-radius: 5px;
+ background-color: #fff;
+ cursor: pointer;
+}
+#chaticon a {
+ text-decoration: none
+}
+#chatcounter {
+ color: #777;
+ font-size: 10px;
+ vertical-align: middle;
+}
+#titlebar {
+ line-height: 16px;
+ font-weight: bold;
+ color: #555;
+ position: relative;
+ bottom: 2px;
+}
+#titlelabel {
+ font-size: 13px;
+ margin: 4px 0 0 4px;
+ position: absolute;
+}
+#titlesticky{
+ font-size: 10px;
+ padding-top:2px;
+ float: right;
+ text-align: right;
+ text-decoration: none;
+ cursor: pointer;
+ color: #555;
+}
+#titlecross {
+ font-size: 25px;
+ float: right;
+ text-align: right;
+ text-decoration: none;
+ cursor: pointer;
+ color: #555;
+}
+.time {
+ float: right;
+ color: #333;
+ font-style: italic;
+ font-size: 10px;
+ margin-left: 3px;
+ margin-right: 3px;
+ margin-top: 2px;
+}
+#exportColumn{
+ margin-top:20px;
+}
+.exporttype {
+ margin-top: 4px;
+ background-repeat: no-repeat;
+ padding-left: 25px;
+ color: #333;
+ text-decoration: none;
+ padding-bottom:2px;
+ display:inline;
+ padding-left:5px;
+ font-family: "Arial";
+}
+.exportlink{
+ font-family: "fontawesome-etherpad";
+ display:block;
+ margin:5px;
+ color:#666;
+}
+#exporthtmla:before {
+ content: "\e826";
+}
+#exportplaina:before {
+ content: "\e802";
+}
+#exportworda:before {
+ content: "\e804";
+}
+#exportpdfa:before {
+ content: "\e803";
+}
+#exportetherpada:before {
+ content: "\e806";
+}
+#exportopena:before {
+ content: "\e805";
+}
+
+/* hidden element */
+#importstatusball,
+#importmessagesuccess,
+#importmessageabiword {
+ display: none;
+}
+
+.throbbold{
+ font-weight:bold;
+}
+
+#importmessageabiword {
+ color: #900;
+ font-size: small;
+}
+
+#importsubmitinput {
+ margin-top: 12px;
+ padding:2px 4px 2px 4px;
+}
+#chatthrob {
+ display: none;
+ position: absolute;
+ bottom: 40px;
+ font-size: 14px;
+ width: 150px;
+ height: 40px;
+ right: 20px;
+ z-index: 200;
+ background-color: #000;
+ color: white;
+ background-color: rgb(0,0,0);
+ background-color: rgba(0,0,0,0.7);
+ padding: 10px;
+ -webkit-border-radius: 6px;
+ -moz-border-radius: 6px;
+ border-radius: 6px;
+ -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
+ filter: alpha(opacity=80);
+ opacity: .8;
+}
+.buttonicon {
+ width: 16px;
+ height: 16px;
+ display: inline-block;
+ vertical-align: middle;
+ border: none;
+ padding: 0;
+ background: none;
+ font-family: "fontawesome-etherpad";
+ font-size: 15px;
+ font-style: normal;
+ font-weight: normal;
+ color: #666;
+ cursor: pointer;
+}
+
+.buttonicon::-moz-focus-inner {
+ padding: 0;
+ border: 0
+}
+
+.buttonicon:before {
+ font-family: "fontawesome-etherpad";
+}
+
+.buttonicon:focus{
+ border: 1px solid #666;
+}
+.buttonicon-bold:before {
+ content: "\e81c";
+}
+.buttonicon-italic:before {
+ content: "\e81d";
+}
+.buttonicon-underline:before {
+ content: "\e817";
+}
+.buttonicon-strikethrough:before {
+ content: "\e818";
+}
+.buttonicon-insertorderedlist:before {
+ content: "\e816";
+}
+.buttonicon-insertunorderedlist:before {
+ content: "\e815";
+}
+.buttonicon-indent:before {
+ content: "\e814";
+}
+.buttonicon-outdent:before {
+ content: "\e813";
+}
+.buttonicon-undo:before {
+ content: "\e823";
+}
+.buttonicon-redo:before {
+ content: "\e824";
+}
+.buttonicon-clearauthorship:before {
+ content: "\e80d";
+}
+.buttonicon-settings:before {
+ content: "\e833";
+}
+.buttonicon-import_export:before {
+ content: "\e834";
+}
+.buttonicon-embed:before {
+ content: "\e827";
+}
+.buttonicon-history:before {
+ content: "\e837";
+}
+.buttonicon-chat:before {
+ content: "\e829";
+}
+.buttonicon-showusers:before {
+ content: "\e808";
+}
+.buttonicon-savedRevision:before {
+ content: "\e835";
+}
+#focusprotector {
+ z-index: 100;
+ position: absolute;
+ bottom: 0px;
+ top: 0px;
+ left: 0px;
+ right: 0px;
+ background-color: white;
+ -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=1)";
+ filter: alpha(opacity=1);
+ opacity: 0.01;
+ display: none;
+}
.rtl {
direction: RTL
}
diff --git a/src/static/js/chat.js b/src/static/js/chat.js
index a00ac9d9264..ca488fe5fd2 100755
--- a/src/static/js/chat.js
+++ b/src/static/js/chat.js
@@ -47,6 +47,9 @@ var chat = (function()
},
stickToScreen: function(fromInitialCall) // Make chat stick to right hand side of screen
{
+ if(pad.settings.hideChat){
+ return;
+ }
chat.show();
isStuck = (!isStuck || fromInitialCall);
$('#chatbox').hide();
diff --git a/src/static/js/pad.js b/src/static/js/pad.js
index aeeca15c6b5..9c1b7bc1862 100644
--- a/src/static/js/pad.js
+++ b/src/static/js/pad.js
@@ -74,7 +74,7 @@ function randomString()
var getParameters = [
{ name: "noColors", checkVal: "true", callback: function(val) { settings.noColors = true; $('#clearAuthorship').hide(); } },
{ name: "showControls", checkVal: "true", callback: function(val) { $('#editbar').css('display', 'flex') } },
- { name: "showChat", checkVal: "true", callback: function(val) { $('#chaticon').show(); } },
+ { name: "showChat", checkVal: null, callback: function(val) { if(val==="false"){settings.hideChat = true;chat.hide();$('#chaticon').hide()} } },
{ name: "showLineNumbers", checkVal: "false", callback: function(val) { settings.LineNumbersDisabled = true; } },
{ name: "useMonospaceFont", checkVal: "true", callback: function(val) { settings.useMonospaceFontGlobal = true; } },
// If the username is set as a parameter we should set a global value that we can call once we have initiated the pad.
@@ -82,7 +82,7 @@ var getParameters = [
// If the userColor is set as a parameter, set a global value to use once we have initiated the pad.
{ name: "userColor", checkVal: null, callback: function(val) { settings.globalUserColor = decodeURIComponent(val); clientVars.userColor = decodeURIComponent(val); } },
{ name: "rtl", checkVal: "true", callback: function(val) { settings.rtlIsTrue = true } },
- { name: "alwaysShowChat", checkVal: "true", callback: function(val) { chat.stickToScreen(); } },
+ { name: "alwaysShowChat", checkVal: "true", callback: function(val) { if(!settings.hideChat) chat.stickToScreen(); } },
{ name: "chatAndUsers", checkVal: "true", callback: function(val) { chat.chatAndUsers(); } },
{ name: "lang", checkVal: null, callback: function(val) { window.html10n.localize([val, 'en']); createCookie('language', val); } }
];
@@ -92,7 +92,7 @@ function getParams()
// Tries server enforced options first..
for(var i = 0; i < getParameters.length; i++)
{
- var setting = getParameters[i];
+ var setting = getParameters[i];
var value = clientVars.padOptions[setting.name];
if(value.toString() === setting.checkVal)
{
@@ -102,12 +102,10 @@ function getParams()
// Then URL applied stuff
var params = getUrlVars()
-
for(var i = 0; i < getParameters.length; i++)
{
var setting = getParameters[i];
var value = params[setting.name];
-
if(value && (value == setting.checkVal || setting.checkVal == null))
{
setting.callback(value);
diff --git a/tests/frontend/helper.js b/tests/frontend/helper.js
index 449355e5d92..42712cf30a9 100644
--- a/tests/frontend/helper.js
+++ b/tests/frontend/helper.js
@@ -78,20 +78,25 @@ var helper = {};
helper.newPad = function(cb, padName){
//build opts object
var opts = {clearCookies: true}
+
if(typeof cb === 'function'){
opts.cb = cb
} else {
opts = _.defaults(cb, opts);
}
+ // if opts.params is set we manipulate the URL to include URL parameters IE ?foo=Bah.
+ if(opts.params){
+ var encodedParams = "?" + $.param(opts.params);
+ }
+
//clear cookies
if(opts.clearCookies){
helper.clearCookies();
}
-
if(!padName)
padName = "FRONTEND_TEST_" + helper.randomString(20);
- $iframe = $("");
+ $iframe = $("");
//clean up inner iframe references
helper.padChrome$ = helper.padOuter$ = helper.padInner$ = null;
diff --git a/tests/frontend/specs/chat.js b/tests/frontend/specs/chat.js
index 8eaf08a9514..84b9344efba 100644
--- a/tests/frontend/specs/chat.js
+++ b/tests/frontend/specs/chat.js
@@ -131,4 +131,41 @@ describe("Chat messages and UI", function(){
}, 10)
}, 10)
});
+
+ it("Checks showChat=false URL Parameter hides chat then when removed it shows chat", function(done) {
+ this.timeout(60000);
+ var inner$ = helper.padInner$;
+ var chrome$ = helper.padChrome$;
+
+ setTimeout(function(){ //give it a second to save the username on the server side
+ helper.newPad({ // get a new pad, but don't clear the cookies
+ clearCookies: false,
+ params:{
+ showChat: "false"
+ }, cb: function(){
+ var chrome$ = helper.padChrome$;
+ var chaticon = chrome$("#chaticon");
+ // chat should be hidden.
+ expect(chaticon.is(":visible")).to.be(false);
+
+
+ setTimeout(function(){ //give it a second to save the username on the server side
+ helper.newPad({ // get a new pad, but don't clear the cookies
+ clearCookies: false
+ , cb: function(){
+ var chrome$ = helper.padChrome$;
+ var chaticon = chrome$("#chaticon");
+ // chat should be visible.
+ expect(chaticon.is(":visible")).to.be(true);
+ done();
+ }
+ });
+ }, 1000);
+
+ }
+ });
+ }, 1000);
+
+ });
+
});