Merge branch 'staging' of github.com:xwiki-labs/cryptpad into staging

pull/1/head
ansuz 8 years ago
commit b4b851959f

@ -467,14 +467,6 @@
white-space: normal; white-space: normal;
text-align: left; text-align: left;
} }
.dropdown-bar .dropdown-bar-content p.cryptpad-dropdown-users {
text-align: baseline;
}
.dropdown-bar .dropdown-bar-content p.cryptpad-dropdown-users .yourself,
.dropdown-bar .dropdown-bar-content p.cryptpad-dropdown-users .anonymous,
.dropdown-bar .dropdown-bar-content p.cryptpad-dropdown-users .viewer {
font-style: italic;
}
.dropdown-bar .dropdown-bar-content p h2 { .dropdown-bar .dropdown-bar-content p h2 {
font-weight: bold; font-weight: bold;
text-align: center; text-align: center;

@ -77,12 +77,6 @@
margin: 0; margin: 0;
white-space: normal; white-space: normal;
text-align: left; text-align: left;
&.cryptpad-dropdown-users {
text-align:baseline;
.yourself, .anonymous, .viewer {
font-style: italic;
}
}
h2 { h2 {
font-weight: bold; font-weight: bold;
text-align: center; text-align: center;

@ -24,19 +24,73 @@
.cke_reset_all * { .cke_reset_all * {
color: inherit; color: inherit;
} }
.cryptpad-toolbar {
@toolbar-green: #5cb85c;
#cke_1_contents {
margin-top: -1px;
display: flex;
}
.userlist-drawer {
font: normal normal normal 14px Arial,Helvetica,Tahoma,Verdana,Sans-Serif;
width: 175px;
display: block;
overflow-y: auto;
overflow-x: hidden;
padding: 10px;
box-sizing: border-box; box-sizing: border-box;
padding: 0px; h2 {
color: inherit;
font-size: 1.2em;
font-weight: bold;
text-align: center;
padding: 5px 0px;
margin: 5px 0px;
font-size: 16px;
white-space: normal;
}
text-align:baseline;
.viewer {
font-style: italic;
padding: 5px;
background: rgba(0,0,0,0.1);
margin: 2px 0;
}
//background-color: #BBBBFF; .userlist-others {
background-color: @toolbar-default-bg; display: flex;
color: @toolbar-default-color; flex-flow: column;
margin: 10px 0;
margin-bottom: 20px;
&>span {
overflow: hidden;
text-overflow: ellipsis;
padding: 5px;
background: rgba(0,0,0,0.1);
margin: 2px 0;
}
}
}
body {
.addToolbarColors (@color, @bg-color) { .addToolbarColors (@color, @bg-color) {
.userlist-drawer {
background-color: @bgcolor; background-color: @bgcolor;
color: @color; color: @color;
h2 {
background-color: darken(@bgcolor, 10%);
}
}
.cryptpad-toolbar {
background-color: @bgcolor;
color: @color;
.userlist-drawer {
background-color: @bgcolor;
width: 150px;
position: absolute;
left: 0;
top: 96px;
bottom: 0;
}
.cryptpad-toolbar-leftside, .cryptpad-toolbar-rightside, .drawer-content { .cryptpad-toolbar-leftside, .cryptpad-toolbar-rightside, .drawer-content {
background-color: lighten(@bgcolor, 8%); background-color: lighten(@bgcolor, 8%);
button:hover { button:hover {
@ -100,43 +154,58 @@
} }
} }
} }
}
&.pad { &.app-pad {
@bgcolor: @toolbar-pad-bg; @bgcolor: @toolbar-pad-bg;
@color: @toolbar-pad-color; @color: @toolbar-pad-color;
.addToolbarColors(@color, @bgcolor); .addToolbarColors(@color, @bgcolor);
} }
&.code { &.app-code {
@bgcolor: @toolbar-code-bg; @bgcolor: @toolbar-code-bg;
@color: @toolbar-code-color; @color: @toolbar-code-color;
.addToolbarColors(@color, @bgcolor); .addToolbarColors(@color, @bgcolor);
} }
&.slide { &.app-slide {
@bgcolor: @toolbar-slide-bg; @bgcolor: @toolbar-slide-bg;
@color: @toolbar-slide-color; @color: @toolbar-slide-color;
.addToolbarColors(@color, @bgcolor); .addToolbarColors(@color, @bgcolor);
} }
&.poll { &.app-poll {
@bgcolor: @toolbar-poll-bg; @bgcolor: @toolbar-poll-bg;
@color: @toolbar-poll-color; @color: @toolbar-poll-color;
.addToolbarColors(@color, @bgcolor); .addToolbarColors(@color, @bgcolor);
} }
&.whiteboard { &.app-whiteboard {
@bgcolor: @toolbar-whiteboard-bg; @bgcolor: @toolbar-whiteboard-bg;
@color: @toolbar-whiteboard-color; @color: @toolbar-whiteboard-color;
.addToolbarColors(@color, @bgcolor); .addToolbarColors(@color, @bgcolor);
} }
&.drive { &.app-drive {
@bgcolor: @toolbar-drive-bg; @bgcolor: @toolbar-drive-bg;
@color: @toolbar-drive-color; @color: @toolbar-drive-color;
.addToolbarColors(@color, @bgcolor); .addToolbarColors(@color, @bgcolor);
} }
&.file { &.app-file {
@bgcolor: @toolbar-file-bg; @bgcolor: @toolbar-file-bg;
@color: @toolbar-file-color; @color: @toolbar-file-color;
.addToolbarColors(@color, @bgcolor); .addToolbarColors(@color, @bgcolor);
} }
}
.cryptpad-toolbar {
@toolbar-green: #5cb85c;
box-sizing: border-box;
padding: 0px;
//background-color: #BBBBFF;
background-color: @toolbar-default-bg;
color: @toolbar-default-color;
.fa { .fa {
font: normal normal normal 14px/1 FontAwesome; font: normal normal normal 14px/1 FontAwesome;
font-family: FontAwesome; font-family: FontAwesome;
@ -664,7 +733,9 @@
} }
} }
button { button {
margin: 2px 4px 2px 0px; margin: 0px;
border-radius: 0;
height: 100%;
} }
.dropdown-bar-content { .dropdown-bar-content {
margin-top: -1px; margin-top: -1px;

@ -59,14 +59,6 @@
white-space: normal; white-space: normal;
text-align: left; text-align: left;
} }
.dropdown-bar .dropdown-bar-content p.cryptpad-dropdown-users {
text-align: baseline;
}
.dropdown-bar .dropdown-bar-content p.cryptpad-dropdown-users .yourself,
.dropdown-bar .dropdown-bar-content p.cryptpad-dropdown-users .anonymous,
.dropdown-bar .dropdown-bar-content p.cryptpad-dropdown-users .viewer {
font-style: italic;
}
.dropdown-bar .dropdown-bar-content p h2 { .dropdown-bar .dropdown-bar-content p h2 {
font-weight: bold; font-weight: bold;
text-align: center; text-align: center;
@ -101,483 +93,631 @@
.cke_reset_all * { .cke_reset_all * {
color: inherit; color: inherit;
} }
.cryptpad-toolbar { #cke_1_contents {
margin-top: -1px;
display: flex;
}
.userlist-drawer {
font: normal normal normal 14px Arial, Helvetica, Tahoma, Verdana, Sans-Serif;
width: 175px;
display: block;
overflow-y: auto;
overflow-x: hidden;
padding: 10px;
box-sizing: border-box; box-sizing: border-box;
padding: 0px; text-align: baseline;
background-color: #ddd; }
color: #000; .userlist-drawer h2 {
-webkit-touch-callout: none; color: inherit;
-webkit-user-select: none; font-size: 1.2em;
-khtml-user-select: none; font-weight: bold;
-moz-user-select: none; text-align: center;
-ms-user-select: none; padding: 5px 0px;
user-select: none; margin: 5px 0px;
font: normal normal normal 12px Arial, Helvetica, Tahoma, Verdana, Sans-Serif; font-size: 16px;
width: 100%; white-space: normal;
z-index: 9001; }
.userlist-drawer .viewer {
font-style: italic;
padding: 5px;
background: rgba(0, 0, 0, 0.1);
margin: 2px 0;
}
.userlist-drawer .userlist-others {
display: flex;
flex-flow: column;
margin: 10px 0;
margin-bottom: 20px;
}
.userlist-drawer .userlist-others > span {
overflow: hidden;
text-overflow: ellipsis;
padding: 5px;
background: rgba(0, 0, 0, 0.1);
margin: 2px 0;
}
body.app-pad .userlist-drawer {
background-color: #1c4fa0;
color: #fff;
}
body.app-pad .userlist-drawer h2 {
background-color: #143a75;
} }
.cryptpad-toolbar.pad { body.app-pad .cryptpad-toolbar {
background-color: #1c4fa0; background-color: #1c4fa0;
color: #fff; color: #fff;
} }
.cryptpad-toolbar.pad .cryptpad-toolbar-leftside, body.app-pad .cryptpad-toolbar .userlist-drawer {
.cryptpad-toolbar.pad .cryptpad-toolbar-rightside, background-color: #1c4fa0;
.cryptpad-toolbar.pad .drawer-content { width: 150px;
position: absolute;
left: 0;
top: 96px;
bottom: 0;
}
body.app-pad .cryptpad-toolbar .cryptpad-toolbar-leftside,
body.app-pad .cryptpad-toolbar .cryptpad-toolbar-rightside,
body.app-pad .cryptpad-toolbar .drawer-content {
background-color: #2260c3; background-color: #2260c3;
} }
.cryptpad-toolbar.pad .cryptpad-toolbar-leftside button:hover, body.app-pad .cryptpad-toolbar .cryptpad-toolbar-leftside button:hover,
.cryptpad-toolbar.pad .cryptpad-toolbar-rightside button:hover, body.app-pad .cryptpad-toolbar .cryptpad-toolbar-rightside button:hover,
.cryptpad-toolbar.pad .drawer-content button:hover { body.app-pad .cryptpad-toolbar .drawer-content button:hover {
background-color: #1c4fa0; background-color: #1c4fa0;
} }
.cryptpad-toolbar.pad .hoverable:hover .editable { body.app-pad .cryptpad-toolbar .hoverable:hover .editable {
cursor: text; cursor: text;
border: 1px solid #2e71da; border: 1px solid #2e71da;
background: #143a75; background: #143a75;
color: #fff; color: #fff;
} }
.cryptpad-toolbar.pad .hoverable:hover .pencilIcon { body.app-pad .cryptpad-toolbar .hoverable:hover .pencilIcon {
border: 1px solid #2e71da; border: 1px solid #2e71da;
background: #143a75; background: #143a75;
color: #fff; color: #fff;
} }
.cryptpad-toolbar.pad .hoverable:hover .pencilIcon:hover { body.app-pad .cryptpad-toolbar .hoverable:hover .pencilIcon:hover {
background: #18448a; background: #18448a;
} }
.cryptpad-toolbar.pad .saveIcon { body.app-pad .cryptpad-toolbar .saveIcon {
border: 1px solid #2e71da; border: 1px solid #2e71da;
background: #143a75; background: #143a75;
color: #fff; color: #fff;
} }
.cryptpad-toolbar.pad .saveIcon:hover { body.app-pad .cryptpad-toolbar .saveIcon:hover {
background: #18448a; background: #18448a;
} }
.cryptpad-toolbar.pad input { body.app-pad .cryptpad-toolbar input {
border: 1px solid #2e71da; border: 1px solid #2e71da;
background: #143a75; background: #143a75;
color: #fff; color: #fff;
} }
.cryptpad-toolbar.pad .dropdown-bar-content { body.app-pad .cryptpad-toolbar .dropdown-bar-content {
background: #18448a; background: #18448a;
border: 1px solid #fff; border: 1px solid #fff;
color: #fff; color: #fff;
} }
.cryptpad-toolbar.pad .dropdown-bar-content a { body.app-pad .cryptpad-toolbar .dropdown-bar-content a {
color: #fff; color: #fff;
} }
.cryptpad-toolbar.pad .dropdown-bar-content a.active { body.app-pad .cryptpad-toolbar .dropdown-bar-content a.active {
background-color: #143a75; background-color: #143a75;
color: #fff; color: #fff;
} }
.cryptpad-toolbar.pad .dropdown-bar-content a:hover { body.app-pad .cryptpad-toolbar .dropdown-bar-content a:hover {
background-color: #1c4fa0; background-color: #1c4fa0;
color: #fff; color: #fff;
} }
.cryptpad-toolbar.pad .dropdown-bar-content hr { body.app-pad .cryptpad-toolbar .dropdown-bar-content hr {
background-color: #112f5f; background-color: #112f5f;
} }
.cryptpad-toolbar.pad .dropdown-bar-content p h2 { body.app-pad .cryptpad-toolbar .dropdown-bar-content p h2 {
background-color: #143a75; background-color: #143a75;
} }
.cryptpad-toolbar.pad .dropdown-bar-content p .accountData { body.app-pad .cryptpad-toolbar .dropdown-bar-content p .accountData {
background-color: #1c4fa0; background-color: #1c4fa0;
} }
.cryptpad-toolbar.code { body.app-code .userlist-drawer {
background-color: #ffae00;
color: #000;
}
body.app-code .userlist-drawer h2 {
background-color: #cc8b00;
}
body.app-code .cryptpad-toolbar {
background-color: #ffae00; background-color: #ffae00;
color: #000; color: #000;
} }
.cryptpad-toolbar.code .cryptpad-toolbar-leftside, body.app-code .cryptpad-toolbar .userlist-drawer {
.cryptpad-toolbar.code .cryptpad-toolbar-rightside, background-color: #ffae00;
.cryptpad-toolbar.code .drawer-content { width: 150px;
position: absolute;
left: 0;
top: 96px;
bottom: 0;
}
body.app-code .cryptpad-toolbar .cryptpad-toolbar-leftside,
body.app-code .cryptpad-toolbar .cryptpad-toolbar-rightside,
body.app-code .cryptpad-toolbar .drawer-content {
background-color: #ffbb29; background-color: #ffbb29;
} }
.cryptpad-toolbar.code .cryptpad-toolbar-leftside button:hover, body.app-code .cryptpad-toolbar .cryptpad-toolbar-leftside button:hover,
.cryptpad-toolbar.code .cryptpad-toolbar-rightside button:hover, body.app-code .cryptpad-toolbar .cryptpad-toolbar-rightside button:hover,
.cryptpad-toolbar.code .drawer-content button:hover { body.app-code .cryptpad-toolbar .drawer-content button:hover {
background-color: #ffae00; background-color: #ffae00;
} }
.cryptpad-toolbar.code .hoverable:hover .editable { body.app-code .cryptpad-toolbar .hoverable:hover .editable {
cursor: text; cursor: text;
border: 1px solid #ffc64d; border: 1px solid #ffc64d;
background: #cc8b00; background: #cc8b00;
color: #000; color: #000;
} }
.cryptpad-toolbar.code .hoverable:hover .pencilIcon { body.app-code .cryptpad-toolbar .hoverable:hover .pencilIcon {
border: 1px solid #ffc64d; border: 1px solid #ffc64d;
background: #cc8b00; background: #cc8b00;
color: #000; color: #000;
} }
.cryptpad-toolbar.code .hoverable:hover .pencilIcon:hover { body.app-code .cryptpad-toolbar .hoverable:hover .pencilIcon:hover {
background: #e69d00; background: #e69d00;
} }
.cryptpad-toolbar.code .saveIcon { body.app-code .cryptpad-toolbar .saveIcon {
border: 1px solid #ffc64d; border: 1px solid #ffc64d;
background: #cc8b00; background: #cc8b00;
color: #000; color: #000;
} }
.cryptpad-toolbar.code .saveIcon:hover { body.app-code .cryptpad-toolbar .saveIcon:hover {
background: #e69d00; background: #e69d00;
} }
.cryptpad-toolbar.code input { body.app-code .cryptpad-toolbar input {
border: 1px solid #ffc64d; border: 1px solid #ffc64d;
background: #cc8b00; background: #cc8b00;
color: #000; color: #000;
} }
.cryptpad-toolbar.code .dropdown-bar-content { body.app-code .cryptpad-toolbar .dropdown-bar-content {
background: #e69d00; background: #e69d00;
border: 1px solid #000; border: 1px solid #000;
color: #000; color: #000;
} }
.cryptpad-toolbar.code .dropdown-bar-content a { body.app-code .cryptpad-toolbar .dropdown-bar-content a {
color: #000; color: #000;
} }
.cryptpad-toolbar.code .dropdown-bar-content a.active { body.app-code .cryptpad-toolbar .dropdown-bar-content a.active {
background-color: #cc8b00; background-color: #cc8b00;
color: #000; color: #000;
} }
.cryptpad-toolbar.code .dropdown-bar-content a:hover { body.app-code .cryptpad-toolbar .dropdown-bar-content a:hover {
background-color: #ffae00; background-color: #ffae00;
color: #000; color: #000;
} }
.cryptpad-toolbar.code .dropdown-bar-content hr { body.app-code .cryptpad-toolbar .dropdown-bar-content hr {
background-color: #b37a00; background-color: #b37a00;
} }
.cryptpad-toolbar.code .dropdown-bar-content p h2 { body.app-code .cryptpad-toolbar .dropdown-bar-content p h2 {
background-color: #cc8b00; background-color: #cc8b00;
} }
.cryptpad-toolbar.code .dropdown-bar-content p .accountData { body.app-code .cryptpad-toolbar .dropdown-bar-content p .accountData {
background-color: #ffae00; background-color: #ffae00;
} }
.cryptpad-toolbar.slide { body.app-slide .userlist-drawer {
background-color: #e57614;
color: #fff;
}
body.app-slide .userlist-drawer h2 {
background-color: #b65e10;
}
body.app-slide .cryptpad-toolbar {
background-color: #e57614; background-color: #e57614;
color: #fff; color: #fff;
} }
.cryptpad-toolbar.slide .cryptpad-toolbar-leftside, body.app-slide .cryptpad-toolbar .userlist-drawer {
.cryptpad-toolbar.slide .cryptpad-toolbar-rightside, background-color: #e57614;
.cryptpad-toolbar.slide .drawer-content { width: 150px;
position: absolute;
left: 0;
top: 96px;
bottom: 0;
}
body.app-slide .cryptpad-toolbar .cryptpad-toolbar-leftside,
body.app-slide .cryptpad-toolbar .cryptpad-toolbar-rightside,
body.app-slide .cryptpad-toolbar .drawer-content {
background-color: #ed8b34; background-color: #ed8b34;
} }
.cryptpad-toolbar.slide .cryptpad-toolbar-leftside button:hover, body.app-slide .cryptpad-toolbar .cryptpad-toolbar-leftside button:hover,
.cryptpad-toolbar.slide .cryptpad-toolbar-rightside button:hover, body.app-slide .cryptpad-toolbar .cryptpad-toolbar-rightside button:hover,
.cryptpad-toolbar.slide .drawer-content button:hover { body.app-slide .cryptpad-toolbar .drawer-content button:hover {
background-color: #e57614; background-color: #e57614;
} }
.cryptpad-toolbar.slide .hoverable:hover .editable { body.app-slide .cryptpad-toolbar .hoverable:hover .editable {
cursor: text; cursor: text;
border: 1px solid #f09e55; border: 1px solid #f09e55;
background: #b65e10; background: #b65e10;
color: #fff; color: #fff;
} }
.cryptpad-toolbar.slide .hoverable:hover .pencilIcon { body.app-slide .cryptpad-toolbar .hoverable:hover .pencilIcon {
border: 1px solid #f09e55; border: 1px solid #f09e55;
background: #b65e10; background: #b65e10;
color: #fff; color: #fff;
} }
.cryptpad-toolbar.slide .hoverable:hover .pencilIcon:hover { body.app-slide .cryptpad-toolbar .hoverable:hover .pencilIcon:hover {
background: #ce6a12; background: #ce6a12;
} }
.cryptpad-toolbar.slide .saveIcon { body.app-slide .cryptpad-toolbar .saveIcon {
border: 1px solid #f09e55; border: 1px solid #f09e55;
background: #b65e10; background: #b65e10;
color: #fff; color: #fff;
} }
.cryptpad-toolbar.slide .saveIcon:hover { body.app-slide .cryptpad-toolbar .saveIcon:hover {
background: #ce6a12; background: #ce6a12;
} }
.cryptpad-toolbar.slide input { body.app-slide .cryptpad-toolbar input {
border: 1px solid #f09e55; border: 1px solid #f09e55;
background: #b65e10; background: #b65e10;
color: #fff; color: #fff;
} }
.cryptpad-toolbar.slide .dropdown-bar-content { body.app-slide .cryptpad-toolbar .dropdown-bar-content {
background: #ce6a12; background: #ce6a12;
border: 1px solid #fff; border: 1px solid #fff;
color: #fff; color: #fff;
} }
.cryptpad-toolbar.slide .dropdown-bar-content a { body.app-slide .cryptpad-toolbar .dropdown-bar-content a {
color: #fff; color: #fff;
} }
.cryptpad-toolbar.slide .dropdown-bar-content a.active { body.app-slide .cryptpad-toolbar .dropdown-bar-content a.active {
background-color: #b65e10; background-color: #b65e10;
color: #fff; color: #fff;
} }
.cryptpad-toolbar.slide .dropdown-bar-content a:hover { body.app-slide .cryptpad-toolbar .dropdown-bar-content a:hover {
background-color: #e57614; background-color: #e57614;
color: #fff; color: #fff;
} }
.cryptpad-toolbar.slide .dropdown-bar-content hr { body.app-slide .cryptpad-toolbar .dropdown-bar-content hr {
background-color: #9f520e; background-color: #9f520e;
} }
.cryptpad-toolbar.slide .dropdown-bar-content p h2 { body.app-slide .cryptpad-toolbar .dropdown-bar-content p h2 {
background-color: #b65e10; background-color: #b65e10;
} }
.cryptpad-toolbar.slide .dropdown-bar-content p .accountData { body.app-slide .cryptpad-toolbar .dropdown-bar-content p .accountData {
background-color: #e57614; background-color: #e57614;
} }
.cryptpad-toolbar.poll { body.app-poll .userlist-drawer {
background-color: #006304;
color: #fff;
}
body.app-poll .userlist-drawer h2 {
background-color: #003002;
}
body.app-poll .cryptpad-toolbar {
background-color: #006304; background-color: #006304;
color: #fff; color: #fff;
} }
.cryptpad-toolbar.poll .cryptpad-toolbar-leftside, body.app-poll .cryptpad-toolbar .userlist-drawer {
.cryptpad-toolbar.poll .cryptpad-toolbar-rightside, background-color: #006304;
.cryptpad-toolbar.poll .drawer-content { width: 150px;
position: absolute;
left: 0;
top: 96px;
bottom: 0;
}
body.app-poll .cryptpad-toolbar .cryptpad-toolbar-leftside,
body.app-poll .cryptpad-toolbar .cryptpad-toolbar-rightside,
body.app-poll .cryptpad-toolbar .drawer-content {
background-color: #008c06; background-color: #008c06;
} }
.cryptpad-toolbar.poll .cryptpad-toolbar-leftside button:hover, body.app-poll .cryptpad-toolbar .cryptpad-toolbar-leftside button:hover,
.cryptpad-toolbar.poll .cryptpad-toolbar-rightside button:hover, body.app-poll .cryptpad-toolbar .cryptpad-toolbar-rightside button:hover,
.cryptpad-toolbar.poll .drawer-content button:hover { body.app-poll .cryptpad-toolbar .drawer-content button:hover {
background-color: #006304; background-color: #006304;
} }
.cryptpad-toolbar.poll .hoverable:hover .editable { body.app-poll .cryptpad-toolbar .hoverable:hover .editable {
cursor: text; cursor: text;
border: 1px solid #00b007; border: 1px solid #00b007;
background: #003002; background: #003002;
color: #fff; color: #fff;
} }
.cryptpad-toolbar.poll .hoverable:hover .pencilIcon { body.app-poll .cryptpad-toolbar .hoverable:hover .pencilIcon {
border: 1px solid #00b007; border: 1px solid #00b007;
background: #003002; background: #003002;
color: #fff; color: #fff;
} }
.cryptpad-toolbar.poll .hoverable:hover .pencilIcon:hover { body.app-poll .cryptpad-toolbar .hoverable:hover .pencilIcon:hover {
background: #004a03; background: #004a03;
} }
.cryptpad-toolbar.poll .saveIcon { body.app-poll .cryptpad-toolbar .saveIcon {
border: 1px solid #00b007; border: 1px solid #00b007;
background: #003002; background: #003002;
color: #fff; color: #fff;
} }
.cryptpad-toolbar.poll .saveIcon:hover { body.app-poll .cryptpad-toolbar .saveIcon:hover {
background: #004a03; background: #004a03;
} }
.cryptpad-toolbar.poll input { body.app-poll .cryptpad-toolbar input {
border: 1px solid #00b007; border: 1px solid #00b007;
background: #003002; background: #003002;
color: #fff; color: #fff;
} }
.cryptpad-toolbar.poll .dropdown-bar-content { body.app-poll .cryptpad-toolbar .dropdown-bar-content {
background: #004a03; background: #004a03;
border: 1px solid #fff; border: 1px solid #fff;
color: #fff; color: #fff;
} }
.cryptpad-toolbar.poll .dropdown-bar-content a { body.app-poll .cryptpad-toolbar .dropdown-bar-content a {
color: #fff; color: #fff;
} }
.cryptpad-toolbar.poll .dropdown-bar-content a.active { body.app-poll .cryptpad-toolbar .dropdown-bar-content a.active {
background-color: #003002; background-color: #003002;
color: #fff; color: #fff;
} }
.cryptpad-toolbar.poll .dropdown-bar-content a:hover { body.app-poll .cryptpad-toolbar .dropdown-bar-content a:hover {
background-color: #006304; background-color: #006304;
color: #fff; color: #fff;
} }
.cryptpad-toolbar.poll .dropdown-bar-content hr { body.app-poll .cryptpad-toolbar .dropdown-bar-content hr {
background-color: #001701; background-color: #001701;
} }
.cryptpad-toolbar.poll .dropdown-bar-content p h2 { body.app-poll .cryptpad-toolbar .dropdown-bar-content p h2 {
background-color: #003002; background-color: #003002;
} }
.cryptpad-toolbar.poll .dropdown-bar-content p .accountData { body.app-poll .cryptpad-toolbar .dropdown-bar-content p .accountData {
background-color: #006304; background-color: #006304;
} }
.cryptpad-toolbar.whiteboard { body.app-whiteboard .userlist-drawer {
background-color: #800080;
color: #fff;
}
body.app-whiteboard .userlist-drawer h2 {
background-color: #4d004d;
}
body.app-whiteboard .cryptpad-toolbar {
background-color: #800080; background-color: #800080;
color: #fff; color: #fff;
} }
.cryptpad-toolbar.whiteboard .cryptpad-toolbar-leftside, body.app-whiteboard .cryptpad-toolbar .userlist-drawer {
.cryptpad-toolbar.whiteboard .cryptpad-toolbar-rightside, background-color: #800080;
.cryptpad-toolbar.whiteboard .drawer-content { width: 150px;
position: absolute;
left: 0;
top: 96px;
bottom: 0;
}
body.app-whiteboard .cryptpad-toolbar .cryptpad-toolbar-leftside,
body.app-whiteboard .cryptpad-toolbar .cryptpad-toolbar-rightside,
body.app-whiteboard .cryptpad-toolbar .drawer-content {
background-color: #a900a9; background-color: #a900a9;
} }
.cryptpad-toolbar.whiteboard .cryptpad-toolbar-leftside button:hover, body.app-whiteboard .cryptpad-toolbar .cryptpad-toolbar-leftside button:hover,
.cryptpad-toolbar.whiteboard .cryptpad-toolbar-rightside button:hover, body.app-whiteboard .cryptpad-toolbar .cryptpad-toolbar-rightside button:hover,
.cryptpad-toolbar.whiteboard .drawer-content button:hover { body.app-whiteboard .cryptpad-toolbar .drawer-content button:hover {
background-color: #800080; background-color: #800080;
} }
.cryptpad-toolbar.whiteboard .hoverable:hover .editable { body.app-whiteboard .cryptpad-toolbar .hoverable:hover .editable {
cursor: text; cursor: text;
border: 1px solid #cd00cc; border: 1px solid #cd00cc;
background: #4d004d; background: #4d004d;
color: #fff; color: #fff;
} }
.cryptpad-toolbar.whiteboard .hoverable:hover .pencilIcon { body.app-whiteboard .cryptpad-toolbar .hoverable:hover .pencilIcon {
border: 1px solid #cd00cc; border: 1px solid #cd00cc;
background: #4d004d; background: #4d004d;
color: #fff; color: #fff;
} }
.cryptpad-toolbar.whiteboard .hoverable:hover .pencilIcon:hover { body.app-whiteboard .cryptpad-toolbar .hoverable:hover .pencilIcon:hover {
background: #670066; background: #670066;
} }
.cryptpad-toolbar.whiteboard .saveIcon { body.app-whiteboard .cryptpad-toolbar .saveIcon {
border: 1px solid #cd00cc; border: 1px solid #cd00cc;
background: #4d004d; background: #4d004d;
color: #fff; color: #fff;
} }
.cryptpad-toolbar.whiteboard .saveIcon:hover { body.app-whiteboard .cryptpad-toolbar .saveIcon:hover {
background: #670066; background: #670066;
} }
.cryptpad-toolbar.whiteboard input { body.app-whiteboard .cryptpad-toolbar input {
border: 1px solid #cd00cc; border: 1px solid #cd00cc;
background: #4d004d; background: #4d004d;
color: #fff; color: #fff;
} }
.cryptpad-toolbar.whiteboard .dropdown-bar-content { body.app-whiteboard .cryptpad-toolbar .dropdown-bar-content {
background: #670066; background: #670066;
border: 1px solid #fff; border: 1px solid #fff;
color: #fff; color: #fff;
} }
.cryptpad-toolbar.whiteboard .dropdown-bar-content a { body.app-whiteboard .cryptpad-toolbar .dropdown-bar-content a {
color: #fff; color: #fff;
} }
.cryptpad-toolbar.whiteboard .dropdown-bar-content a.active { body.app-whiteboard .cryptpad-toolbar .dropdown-bar-content a.active {
background-color: #4d004d; background-color: #4d004d;
color: #fff; color: #fff;
} }
.cryptpad-toolbar.whiteboard .dropdown-bar-content a:hover { body.app-whiteboard .cryptpad-toolbar .dropdown-bar-content a:hover {
background-color: #800080; background-color: #800080;
color: #fff; color: #fff;
} }
.cryptpad-toolbar.whiteboard .dropdown-bar-content hr { body.app-whiteboard .cryptpad-toolbar .dropdown-bar-content hr {
background-color: #340033; background-color: #340033;
} }
.cryptpad-toolbar.whiteboard .dropdown-bar-content p h2 { body.app-whiteboard .cryptpad-toolbar .dropdown-bar-content p h2 {
background-color: #4d004d; background-color: #4d004d;
} }
.cryptpad-toolbar.whiteboard .dropdown-bar-content p .accountData { body.app-whiteboard .cryptpad-toolbar .dropdown-bar-content p .accountData {
background-color: #800080; background-color: #800080;
} }
.cryptpad-toolbar.drive { body.app-drive .userlist-drawer {
background-color: #0087ff;
color: #fff;
}
body.app-drive .userlist-drawer h2 {
background-color: #006ccc;
}
body.app-drive .cryptpad-toolbar {
background-color: #0087ff; background-color: #0087ff;
color: #fff; color: #fff;
} }
.cryptpad-toolbar.drive .cryptpad-toolbar-leftside, body.app-drive .cryptpad-toolbar .userlist-drawer {
.cryptpad-toolbar.drive .cryptpad-toolbar-rightside, background-color: #0087ff;
.cryptpad-toolbar.drive .drawer-content { width: 150px;
position: absolute;
left: 0;
top: 96px;
bottom: 0;
}
body.app-drive .cryptpad-toolbar .cryptpad-toolbar-leftside,
body.app-drive .cryptpad-toolbar .cryptpad-toolbar-rightside,
body.app-drive .cryptpad-toolbar .drawer-content {
background-color: #299aff; background-color: #299aff;
} }
.cryptpad-toolbar.drive .cryptpad-toolbar-leftside button:hover, body.app-drive .cryptpad-toolbar .cryptpad-toolbar-leftside button:hover,
.cryptpad-toolbar.drive .cryptpad-toolbar-rightside button:hover, body.app-drive .cryptpad-toolbar .cryptpad-toolbar-rightside button:hover,
.cryptpad-toolbar.drive .drawer-content button:hover { body.app-drive .cryptpad-toolbar .drawer-content button:hover {
background-color: #0087ff; background-color: #0087ff;
} }
.cryptpad-toolbar.drive .hoverable:hover .editable { body.app-drive .cryptpad-toolbar .hoverable:hover .editable {
cursor: text; cursor: text;
border: 1px solid #4dabff; border: 1px solid #4dabff;
background: #006ccc; background: #006ccc;
color: #fff; color: #fff;
} }
.cryptpad-toolbar.drive .hoverable:hover .pencilIcon { body.app-drive .cryptpad-toolbar .hoverable:hover .pencilIcon {
border: 1px solid #4dabff; border: 1px solid #4dabff;
background: #006ccc; background: #006ccc;
color: #fff; color: #fff;
} }
.cryptpad-toolbar.drive .hoverable:hover .pencilIcon:hover { body.app-drive .cryptpad-toolbar .hoverable:hover .pencilIcon:hover {
background: #0079e6; background: #0079e6;
} }
.cryptpad-toolbar.drive .saveIcon { body.app-drive .cryptpad-toolbar .saveIcon {
border: 1px solid #4dabff; border: 1px solid #4dabff;
background: #006ccc; background: #006ccc;
color: #fff; color: #fff;
} }
.cryptpad-toolbar.drive .saveIcon:hover { body.app-drive .cryptpad-toolbar .saveIcon:hover {
background: #0079e6; background: #0079e6;
} }
.cryptpad-toolbar.drive input { body.app-drive .cryptpad-toolbar input {
border: 1px solid #4dabff; border: 1px solid #4dabff;
background: #006ccc; background: #006ccc;
color: #fff; color: #fff;
} }
.cryptpad-toolbar.drive .dropdown-bar-content { body.app-drive .cryptpad-toolbar .dropdown-bar-content {
background: #0079e6; background: #0079e6;
border: 1px solid #fff; border: 1px solid #fff;
color: #fff; color: #fff;
} }
.cryptpad-toolbar.drive .dropdown-bar-content a { body.app-drive .cryptpad-toolbar .dropdown-bar-content a {
color: #fff; color: #fff;
} }
.cryptpad-toolbar.drive .dropdown-bar-content a.active { body.app-drive .cryptpad-toolbar .dropdown-bar-content a.active {
background-color: #006ccc; background-color: #006ccc;
color: #fff; color: #fff;
} }
.cryptpad-toolbar.drive .dropdown-bar-content a:hover { body.app-drive .cryptpad-toolbar .dropdown-bar-content a:hover {
background-color: #0087ff; background-color: #0087ff;
color: #fff; color: #fff;
} }
.cryptpad-toolbar.drive .dropdown-bar-content hr { body.app-drive .cryptpad-toolbar .dropdown-bar-content hr {
background-color: #005eb3; background-color: #005eb3;
} }
.cryptpad-toolbar.drive .dropdown-bar-content p h2 { body.app-drive .cryptpad-toolbar .dropdown-bar-content p h2 {
background-color: #006ccc; background-color: #006ccc;
} }
.cryptpad-toolbar.drive .dropdown-bar-content p .accountData { body.app-drive .cryptpad-toolbar .dropdown-bar-content p .accountData {
background-color: #0087ff; background-color: #0087ff;
} }
.cryptpad-toolbar.file { body.app-file .userlist-drawer {
background-color: #cd2532;
color: #fff;
}
body.app-file .userlist-drawer h2 {
background-color: #a21d27;
}
body.app-file .cryptpad-toolbar {
background-color: #cd2532; background-color: #cd2532;
color: #fff; color: #fff;
} }
.cryptpad-toolbar.file .cryptpad-toolbar-leftside, body.app-file .cryptpad-toolbar .userlist-drawer {
.cryptpad-toolbar.file .cryptpad-toolbar-rightside, background-color: #cd2532;
.cryptpad-toolbar.file .drawer-content { width: 150px;
position: absolute;
left: 0;
top: 96px;
bottom: 0;
}
body.app-file .cryptpad-toolbar .cryptpad-toolbar-leftside,
body.app-file .cryptpad-toolbar .cryptpad-toolbar-rightside,
body.app-file .cryptpad-toolbar .drawer-content {
background-color: #dc3f4b; background-color: #dc3f4b;
} }
.cryptpad-toolbar.file .cryptpad-toolbar-leftside button:hover, body.app-file .cryptpad-toolbar .cryptpad-toolbar-leftside button:hover,
.cryptpad-toolbar.file .cryptpad-toolbar-rightside button:hover, body.app-file .cryptpad-toolbar .cryptpad-toolbar-rightside button:hover,
.cryptpad-toolbar.file .drawer-content button:hover { body.app-file .cryptpad-toolbar .drawer-content button:hover {
background-color: #cd2532; background-color: #cd2532;
} }
.cryptpad-toolbar.file .hoverable:hover .editable { body.app-file .cryptpad-toolbar .hoverable:hover .editable {
cursor: text; cursor: text;
border: 1px solid #e25d67; border: 1px solid #e25d67;
background: #a21d27; background: #a21d27;
color: #fff; color: #fff;
} }
.cryptpad-toolbar.file .hoverable:hover .pencilIcon { body.app-file .cryptpad-toolbar .hoverable:hover .pencilIcon {
border: 1px solid #e25d67; border: 1px solid #e25d67;
background: #a21d27; background: #a21d27;
color: #fff; color: #fff;
} }
.cryptpad-toolbar.file .hoverable:hover .pencilIcon:hover { body.app-file .cryptpad-toolbar .hoverable:hover .pencilIcon:hover {
background: #b7212d; background: #b7212d;
} }
.cryptpad-toolbar.file .saveIcon { body.app-file .cryptpad-toolbar .saveIcon {
border: 1px solid #e25d67; border: 1px solid #e25d67;
background: #a21d27; background: #a21d27;
color: #fff; color: #fff;
} }
.cryptpad-toolbar.file .saveIcon:hover { body.app-file .cryptpad-toolbar .saveIcon:hover {
background: #b7212d; background: #b7212d;
} }
.cryptpad-toolbar.file input { body.app-file .cryptpad-toolbar input {
border: 1px solid #e25d67; border: 1px solid #e25d67;
background: #a21d27; background: #a21d27;
color: #fff; color: #fff;
} }
.cryptpad-toolbar.file .dropdown-bar-content { body.app-file .cryptpad-toolbar .dropdown-bar-content {
background: #b7212d; background: #b7212d;
border: 1px solid #fff; border: 1px solid #fff;
color: #fff; color: #fff;
} }
.cryptpad-toolbar.file .dropdown-bar-content a { body.app-file .cryptpad-toolbar .dropdown-bar-content a {
color: #fff; color: #fff;
} }
.cryptpad-toolbar.file .dropdown-bar-content a.active { body.app-file .cryptpad-toolbar .dropdown-bar-content a.active {
background-color: #a21d27; background-color: #a21d27;
color: #fff; color: #fff;
} }
.cryptpad-toolbar.file .dropdown-bar-content a:hover { body.app-file .cryptpad-toolbar .dropdown-bar-content a:hover {
background-color: #cd2532; background-color: #cd2532;
color: #fff; color: #fff;
} }
.cryptpad-toolbar.file .dropdown-bar-content hr { body.app-file .cryptpad-toolbar .dropdown-bar-content hr {
background-color: #8c1922; background-color: #8c1922;
} }
.cryptpad-toolbar.file .dropdown-bar-content p h2 { body.app-file .cryptpad-toolbar .dropdown-bar-content p h2 {
background-color: #a21d27; background-color: #a21d27;
} }
.cryptpad-toolbar.file .dropdown-bar-content p .accountData { body.app-file .cryptpad-toolbar .dropdown-bar-content p .accountData {
background-color: #cd2532; background-color: #cd2532;
} }
.cryptpad-toolbar {
box-sizing: border-box;
padding: 0px;
background-color: #ddd;
color: #000;
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
font: normal normal normal 12px Arial, Helvetica, Tahoma, Verdana, Sans-Serif;
width: 100%;
z-index: 9001;
}
.cryptpad-toolbar .fa { .cryptpad-toolbar .fa {
font: normal normal normal 14px/1 FontAwesome; font: normal normal normal 14px/1 FontAwesome;
font-family: FontAwesome; font-family: FontAwesome;
@ -1095,7 +1235,9 @@
margin: 5px 0px; margin: 5px 0px;
} }
.cryptpad-toolbar-leftside button { .cryptpad-toolbar-leftside button {
margin: 2px 4px 2px 0px; margin: 0px;
border-radius: 0;
height: 100%;
} }
.cryptpad-toolbar-leftside .dropdown-bar-content { .cryptpad-toolbar-leftside .dropdown-bar-content {
margin-top: -1px; margin-top: -1px;

@ -488,7 +488,8 @@ define(function () {
out.header_france = '<a href="http://www.xwiki.com/fr" target="_blank" rel="noopener noreferrer">Fait avec <img class="bottom-bar-heart" src="/customize/heart.png" alt="amour" /> en <img class="bottom-bar-fr" title="France" alt="France" src="/customize/fr.png" /> par <img src="/customize/logo-xwiki.png" alt="XWiki SAS" class="bottom-bar-xwiki"/></a>'; out.header_france = '<a href="http://www.xwiki.com/fr" target="_blank" rel="noopener noreferrer">Fait avec <img class="bottom-bar-heart" src="/customize/heart.png" alt="amour" /> en <img class="bottom-bar-fr" title="France" alt="France" src="/customize/fr.png" /> par <img src="/customize/logo-xwiki.png" alt="XWiki SAS" class="bottom-bar-xwiki"/></a>';
out.header_support = '<a href="http://ng.open-paas.org/" title="OpenPaaS::ng" target="_blank" rel="noopener noreferrer"> <img src="/customize/openpaasng.png" alt="OpenPaaS-ng" class="bottom-bar-openpaas" /></a>'; out.header_support = '<a href="http://ng.open-paas.org/" title="OpenPaaS::ng" target="_blank" rel="noopener noreferrer"> <img src="/customize/openpaasng.png" alt="OpenPaaS-ng" class="bottom-bar-openpaas" /></a>';
out.header_logoTitle = "Aller vers la page d'accueil"; out.updated_0_header_logoTitle = 'Retourner vers votre CryptDrive';
out.header_logoTitle = out.updated_0_header_logoTitle;
// Initial states // Initial states

@ -498,7 +498,8 @@ define(function () {
out.header_france = '<a href="http://www.xwiki.com/" target="_blank" rel="noopener noreferrer">With <img class="bottom-bar-heart" src="/customize/heart.png" alt="love" /> from <img class="bottom-bar-fr" src="/customize/fr.png" title="France" alt="France"/> by <img src="/customize/logo-xwiki.png" alt="XWiki SAS" class="bottom-bar-xwiki"/></a>'; out.header_france = '<a href="http://www.xwiki.com/" target="_blank" rel="noopener noreferrer">With <img class="bottom-bar-heart" src="/customize/heart.png" alt="love" /> from <img class="bottom-bar-fr" src="/customize/fr.png" title="France" alt="France"/> by <img src="/customize/logo-xwiki.png" alt="XWiki SAS" class="bottom-bar-xwiki"/></a>';
out.header_support = '<a href="http://ng.open-paas.org/" title="OpenPaaS::ng" target="_blank" rel="noopener noreferrer"> <img src="/customize/openpaasng.png" alt="OpenPaaS-ng" class="bottom-bar-openpaas" /></a>'; out.header_support = '<a href="http://ng.open-paas.org/" title="OpenPaaS::ng" target="_blank" rel="noopener noreferrer"> <img src="/customize/openpaasng.png" alt="OpenPaaS-ng" class="bottom-bar-openpaas" /></a>';
out.header_logoTitle = 'Go to the main page'; out.updated_0_header_logoTitle = 'Go to your CryptDrive';
out.header_logoTitle = out.updated_0_header_logoTitle;
// Initial states // Initial states

@ -26,9 +26,9 @@ body {
transition: width 500ms, min-width 500ms, max-width 500ms; transition: width 500ms, min-width 500ms, max-width 500ms;
} }
.CodeMirror.fullPage { .CodeMirror.fullPage {
min-width: 100%;
max-width: 100%; max-width: 100%;
resize: none; resize: none;
flex: 1;
} }
.CodeMirror-focused .cm-matchhighlight { .CodeMirror-focused .cm-matchhighlight {
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAYAAABytg0kAAAAFklEQVQI12NgYGBgkKzc8x9CMDAwAAAmhwSbidEoSQAAAABJRU5ErkJggg==); background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAYAAABytg0kAAAAFklEQVQI12NgYGBgkKzc8x9CMDAwAAAmhwSbidEoSQAAAABJRU5ErkJggg==);

@ -30,9 +30,10 @@ body {
resize: horizontal; resize: horizontal;
} }
.CodeMirror.fullPage { .CodeMirror.fullPage {
min-width: 100%; //min-width: 100%;
max-width: 100%; max-width: 100%;
resize: none; resize: none;
flex: 1;
} }
.CodeMirror-focused .cm-matchhighlight { .CodeMirror-focused .cm-matchhighlight {
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAYAAABytg0kAAAAFklEQVQI12NgYGBgkKzc8x9CMDAwAAAmhwSbidEoSQAAAABJRU5ErkJggg==); background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAYAAABytg0kAAAAFklEQVQI12NgYGBgkKzc8x9CMDAwAAAmhwSbidEoSQAAAABJRU5ErkJggg==);

@ -41,6 +41,7 @@ define([
var andThen = function (CMeditor) { var andThen = function (CMeditor) {
var $iframe = $('#pad-iframe').contents(); var $iframe = $('#pad-iframe').contents();
var $contentContainer = $iframe.find('#editorContainer');
var $previewContainer = $iframe.find('#previewContainer'); var $previewContainer = $iframe.find('#previewContainer');
var $preview = $iframe.find('#preview'); var $preview = $iframe.find('#preview');
$preview.click(function (e) { $preview.click(function (e) {
@ -188,7 +189,8 @@ define([
ifrw: ifrw, ifrw: ifrw,
realtime: info.realtime, realtime: info.realtime,
network: info.network, network: info.network,
$container: $bar $container: $bar,
$contentContainer: $contentContainer
}; };
toolbar = APP.toolbar = Toolbar.create(configTb); toolbar = APP.toolbar = Toolbar.create(configTb);

@ -100,8 +100,6 @@ Version 1
var ret = {}; var ret = {};
if (typeof href !== "string") { console.error(href); }
if (!href) { return ret; } if (!href) { return ret; }
if (href.slice(-1) !== '/') { href += '/'; } if (href.slice(-1) !== '/') { href += '/'; }

@ -44,7 +44,6 @@ define([
History.readOnly = 2; History.readOnly = 2;
} }
else if (!secret.keys.validateKey) { else if (!secret.keys.validateKey) {
secret.keys.validateKey = true;
History.readOnly = 0; History.readOnly = 0;
} }
@ -70,6 +69,10 @@ define([
return; return;
} }
if (parsed[0] !== 'FULL_HISTORY') { return; } if (parsed[0] !== 'FULL_HISTORY') { return; }
if (parsed[1] && parsed[1].validateKey) { // First message
secret.keys.validateKey = parsed[1].validateKey;
return;
}
msg = parsed[1][4]; msg = parsed[1][4];
if (msg) { if (msg) {
msg = msg.replace(/^cp\|/, ''); msg = msg.replace(/^cp\|/, '');

@ -419,7 +419,7 @@ define([
}; };
common.setAttribute = function (attr, value, cb) { common.setAttribute = function (attr, value, cb) {
getStore().set(["cryptpad", attr].join('.'), value, function (err, data) { getStore().set(["cryptpad", attr].join('.'), value, function (err, data) {
cb(err, data); if (cb) { cb(err, data); }
}); });
}; };
common.setLSAttribute = function (attr, value) { common.setLSAttribute = function (attr, value) {
@ -925,7 +925,6 @@ define([
common.createButton = function (type, rightside, data, callback) { common.createButton = function (type, rightside, data, callback) {
var button; var button;
var size = "17px"; var size = "17px";
console.log(type);
switch (type) { switch (type) {
case 'export': case 'export':
button = $('<button>', { button = $('<button>', {

@ -70,7 +70,7 @@ define([
var parsed = Cryptpad.parsePadUrl(window.location.href); var parsed = Cryptpad.parsePadUrl(window.location.href);
if (typeof parsed.type === "string") { if (typeof parsed.type === "string") {
$toolbar.addClass(parsed.type); config.$container.parents('body').addClass('app-' + parsed.type);
} }
var $topContainer = $('<div>', {'class': TOP_CLS}); var $topContainer = $('<div>', {'class': TOP_CLS});
@ -135,24 +135,22 @@ define([
var getOtherUsers = function(config) { var getOtherUsers = function(config) {
var userList = config.userList.list.users; var userList = config.userList.list.users;
var userData = config.userList.data; var userData = config.userList.data;
var userNetfluxId = config.userList.userNetfluxId;
var i = 0; // duplicates counter var i = 0; // duplicates counter
var list = []; var list = [];
// Display only one time each user (if he is connected in multiple tabs) // Display only one time each user (if he is connected in multiple tabs)
var myUid = userData[userNetfluxId] ? userData[userNetfluxId].uid : undefined;
var uids = []; var uids = [];
userList.forEach(function(user) { userList.forEach(function(user) {
if (user !== userNetfluxId) { //if (user !== userNetfluxId) {
var data = userData[user] || {}; var data = userData[user] || {};
var userName = data.name;
var userId = data.uid; var userId = data.uid;
if (userName && uids.indexOf(userId) === -1 && (!myUid || userId !== myUid)) { if (!data.uid) { return; }
if (uids.indexOf(userId) === -1) {// && (!myUid || userId !== myUid)) {
uids.push(userId); uids.push(userId);
list.push(userName); list.push(data);
} else if (userName) { i++; } } else { i++; }
} //}
}); });
return { return {
list: list, list: list,
@ -167,6 +165,7 @@ define([
var updateUserList = function (toolbar, config) { var updateUserList = function (toolbar, config) {
// Make sure the elements are displayed // Make sure the elements are displayed
var $userButtons = toolbar.userlist; var $userButtons = toolbar.userlist;
var $userlistContent = toolbar.userlistContent;
var userList = config.userList.list.users; var userList = config.userList.list.users;
var userData = config.userList.data; var userData = config.userList.data;
@ -185,38 +184,34 @@ define([
var editUsersNames = others.list; var editUsersNames = others.list;
var duplicates = others.duplicates; // Number of duplicates var duplicates = others.duplicates; // Number of duplicates
editUsersNames.sort(function (a, b) {
var na = a.name || Messages.anonymous;
var nb = b.name || Messages.anonymous;
return na.toLowerCase() > nb.toLowerCase();
});
var numberOfEditUsers = userList.length - duplicates; var numberOfEditUsers = userList.length - duplicates;
var numberOfViewUsers = numberOfUsers - userList.length; var numberOfViewUsers = numberOfUsers - userList.length;
// Number of anonymous editing users
var anonymous = numberOfEditUsers - editUsersNames.length;
// Update the userlist // Update the userlist
var $usersTitle = $('<h2>').text(Messages.users); var $usersTitle = $('<h2>').text(Messages.users);
var $editUsers = $userButtons.find('.' + USERLIST_CLS); var $editUsers = $userlistContent;
$editUsers.html('').append($usersTitle); $editUsers.html('').append($usersTitle);
var $editUsersList = $('<pre>'); var $editUsersList = $('<div>', {'class': 'userlist-others'});
// Yourself (edit only)
if (config.readOnly !== 1) {
$editUsers.append('<span class="yourself">' + Messages.yourself + '</span>');
anonymous--;
}
// Editors // Editors
$editUsersList.text(editUsersNames.join('\n')); // .text() to avoid XSS editUsersNames.forEach(function (data) {
var name = data.name || Messages.anonymous;
var $span = $('<span>', {'title': name}).text(name);
$span.data('uid', data.uid);
$editUsersList.append($span);
});
$editUsers.append($editUsersList); $editUsers.append($editUsersList);
// Anonymous editors
if (anonymous > 0) {
var text = anonymous === 1 ? Messages.anonymousUser : Messages.anonymousUsers;
$editUsers.append('<span class="anonymous">' + anonymous + ' ' + text + '</span>');
}
// Viewers // Viewers
if (numberOfViewUsers > 0) { if (numberOfViewUsers > 0) {
var viewText = '<span class="viewer">'; var viewText = '<span class="viewer">';
if (numberOfEditUsers > 0) {
$editUsers.append('<br>');
viewText += Messages.and + ' ';
}
var viewerText = numberOfViewUsers !== 1 ? Messages.viewers : Messages.viewer; var viewerText = numberOfViewUsers !== 1 ? Messages.viewers : Messages.viewer;
viewText += numberOfViewUsers + ' ' + viewerText + '</span>'; viewText += numberOfViewUsers + ' ' + viewerText + '</span>';
$editUsers.append(viewText); $editUsers.append(viewText);
@ -269,18 +264,32 @@ define([
!config.userList.data || !config.userList.userNetfluxId) { !config.userList.data || !config.userList.userNetfluxId) {
throw new Error("You must provide a `userList` object to display the userlist"); throw new Error("You must provide a `userList` object to display the userlist");
} }
var dropdownConfig = { var $content = $('<div>', {'class': 'userlist-drawer'});
options: [{ $('<p>', {'class': USERLIST_CLS}).appendTo($content);
tag: 'p', toolbar.userlistContent = $content;
attributes: {'class': USERLIST_CLS},
}] var $container = $('<span>', {id: 'userButtons'});
};
var $block = Cryptpad.createDropdown(dropdownConfig); var $button = $('<button>').appendTo($container);
$block.attr('id', 'userButtons'); $('<span>',{'class': 'buttonTitle'}).appendTo($button);
toolbar.$leftside.prepend($('<span>', {'class': 'separator'})); toolbar.$leftside.prepend($('<span>', {'class': 'separator'}));
toolbar.$leftside.prepend($block); toolbar.$leftside.prepend($container);
if (config.$contentContainer) {
config.$contentContainer.prepend($content);
}
$button.click(function () {
$content.toggle();
Cryptpad.setAttribute('userlist-drawer', $content.is(':visible'));
});
Cryptpad.getAttribute('userlist-drawer', function (err, val) {
if (val === false) { $content.hide(); }
});
return $block; return $container;
}; };
var createShare = function (toolbar, config) { var createShare = function (toolbar, config) {
@ -391,8 +400,8 @@ define([
throw new Error("Unable to display the share button: hash required in the URL"); throw new Error("Unable to display the share button: hash required in the URL");
} }
var $shareIcon = $('<span>', {'class': 'fa fa-share-alt'}); var $shareIcon = $('<span>', {'class': 'fa fa-share-alt'});
var $span = $('<span>', {'class': 'large'}).append(' ' +Messages.shareButton); //var $span = $('<span>', {'class': 'large'}).append(' ' +Messages.shareButton);
var $button = $('<button>', {'id': 'shareButton'}).append($shareIcon).append($span); var $button = $('<button>', {'title': Messages.shareButton}).append($shareIcon);//:.append($span);
$button.click(function () { $button.click(function () {
var url = window.location.href; var url = window.location.href;
var success = Cryptpad.Clipboard.copy(url); var success = Cryptpad.Clipboard.copy(url);

@ -40,7 +40,7 @@ body {
} }
media-tag img { media-tag img {
max-width: 100%; max-width: 100%;
max-height: calc(100vh - 64px); max-height: calc(100vh - 96px);
} }
#upload-form, #upload-form,
#download-form { #download-form {

@ -48,7 +48,7 @@ body {
media-tag { media-tag {
img { img {
max-width: 100%; max-width: 100%;
max-height: ~"calc(100vh - 64px)"; max-height: ~"calc(100vh - 96px)";
} }
} }

@ -29,7 +29,7 @@
} }
</style> </style>
</head> </head>
<body> <body class="app-pad">
<textarea style="display:none" id="editor1" name="editor1"></textarea> <textarea style="display:none" id="editor1" name="editor1"></textarea>
</body> </body>
</html> </html>

@ -89,6 +89,7 @@ define([
}; };
var andThen = function (Ckeditor) { var andThen = function (Ckeditor) {
var $iframe = $('#pad-iframe').contents();
var secret = Cryptpad.getSecrets(); var secret = Cryptpad.getSecrets();
var readOnly = secret.keys && !secret.keys.editKeyStr; var readOnly = secret.keys && !secret.keys.editKeyStr;
if (!secret.keys) { if (!secret.keys) {
@ -466,7 +467,8 @@ define([
ifrw: ifrw, ifrw: ifrw,
realtime: info.realtime, realtime: info.realtime,
network: info.network, network: info.network,
$container: $bar $container: $bar,
$contentContainer: $iframe.find('#cke_1_contents')
}; };
toolbar = info.realtime.toolbar = Toolbar.create(configTb); toolbar = info.realtime.toolbar = Toolbar.create(configTb);
@ -562,6 +564,8 @@ define([
editor.execCommand('maximize'); editor.execCommand('maximize');
} }
} }
// editor.execCommand('maximize') removes all the classes from the body tag
$iframe.find('body').addClass('app-pad');
if (module.realtime !== info.realtime) { if (module.realtime !== info.realtime) {
module.patchText = TextPatcher.create({ module.patchText = TextPatcher.create({

@ -17,7 +17,8 @@
<body> <body>
<div id="toolbar" class="toolbar-container"></div> <div id="toolbar" class="toolbar-container"></div>
<div id="content">
<div id="poll">
<div id="howItWorks"> <div id="howItWorks">
<h1 id="mainTitle">CryptPoll</h1> <h1 id="mainTitle">CryptPoll</h1>
<h2 data-localization="poll_subtitle"></h2> <h2 data-localization="poll_subtitle"></h2>
@ -44,6 +45,8 @@
<button data-localization-title="poll_commit" id="commit"><span class="fa fa-check"></span></button> <button data-localization-title="poll_commit" id="commit"><span class="fa fa-check"></span></button>
</div> </div>
</div> </div>
</div>
</div>
<div id="loading"> <div id="loading">
<div class="loadingContainer"> <div class="loadingContainer">

@ -692,7 +692,8 @@ var create = function (info) {
ifrw: window, ifrw: window,
realtime: info.realtime, realtime: info.realtime,
network: info.network, network: info.network,
$container: APP.$bar $container: APP.$bar,
$contentContainer: $('#content')
}; };
APP.toolbar = Toolbar.create(configTb); APP.toolbar = Toolbar.create(configTb);

@ -6,6 +6,17 @@ body {
padding: 0px; padding: 0px;
border: 0px; border: 0px;
} }
body {
display: flex;
flex-flow: column;
}
#content {
display: flex;
flex: 1;
}
#content #poll {
flex: 1;
}
.cryptpad-toolbar h2 { .cryptpad-toolbar h2 {
font: normal normal normal 12px Arial, Helvetica, Tahoma, Verdana, Sans-Serif; font: normal normal normal 12px Arial, Helvetica, Tahoma, Verdana, Sans-Serif;
color: #000; color: #000;

@ -19,6 +19,17 @@ html, body {
padding: 0px; padding: 0px;
border: 0px; border: 0px;
} }
body {
display: flex;
flex-flow: column;
}
#content {
display: flex;
flex: 1;
#poll {
flex: 1;
}
}
.cryptpad-toolbar h2 { .cryptpad-toolbar h2 {
font: normal normal normal 12px Arial, Helvetica, Tahoma, Verdana, Sans-Serif; font: normal normal normal 12px Arial, Helvetica, Tahoma, Verdana, Sans-Serif;

@ -49,6 +49,7 @@ define([
var andThen = function (CMeditor) { var andThen = function (CMeditor) {
var $iframe = $('#pad-iframe').contents(); var $iframe = $('#pad-iframe').contents();
var $contentContainer = $iframe.find('#editorContainer');
var CodeMirror = Cryptpad.createCodemirror(CMeditor, ifrw, Cryptpad); var CodeMirror = Cryptpad.createCodemirror(CMeditor, ifrw, Cryptpad);
editor = CodeMirror.editor; editor = CodeMirror.editor;
@ -358,7 +359,8 @@ define([
ifrw: ifrw, ifrw: ifrw,
realtime: info.realtime, realtime: info.realtime,
network: info.network, network: info.network,
$container: $bar $container: $bar,
$contentContainer: $contentContainer
}; };
toolbar = module.toolbar = Toolbar.create(configTb); toolbar = module.toolbar = Toolbar.create(configTb);

@ -312,7 +312,8 @@ window.canvas = canvas;
ifrw: window, ifrw: window,
realtime: info.realtime, realtime: info.realtime,
network: info.network, network: info.network,
$container: $bar $container: $bar,
$contentContainer: $('#canvas-area')
}; };
toolbar = module.toolbar = Toolbar.create(configTb); toolbar = module.toolbar = Toolbar.create(configTb);

Loading…
Cancel
Save