From 67f8031bebc370a88dabfb366840fd9d2ac60574 Mon Sep 17 00:00:00 2001 From: Caleb James DeLisle Date: Thu, 7 Dec 2017 14:57:24 +0100 Subject: [PATCH 01/13] Wrong usage of colortheme.less, fixed --- customize.dist/src/less2/include/alertify.less | 2 +- customize.dist/src/less2/include/dropdown.less | 2 +- customize.dist/src/less2/include/fileupload.less | 2 +- customize.dist/src/less2/include/icon-colors.less | 2 +- customize.dist/src/less2/include/infopages.less | 2 +- customize.dist/src/less2/include/leftside-menu.less | 2 +- customize.dist/src/less2/include/limit-bar.less | 2 +- customize.dist/src/less2/include/modal.less | 2 +- customize.dist/src/less2/include/toolbar-history.less | 2 +- customize.dist/src/less2/include/toolbar.less | 2 +- customize.dist/src/less2/pages/page-404.less | 2 +- 11 files changed, 11 insertions(+), 11 deletions(-) diff --git a/customize.dist/src/less2/include/alertify.less b/customize.dist/src/less2/include/alertify.less index e66f92243..63751fed2 100644 --- a/customize.dist/src/less2/include/alertify.less +++ b/customize.dist/src/less2/include/alertify.less @@ -1,4 +1,4 @@ -@import (once) "./colortheme.less"; +@import (once) "./colortheme-all.less"; @import (once) "./browser.less"; @import (once) "./modal-theme.less"; diff --git a/customize.dist/src/less2/include/dropdown.less b/customize.dist/src/less2/include/dropdown.less index 1aea222bd..49d6ef74f 100644 --- a/customize.dist/src/less2/include/dropdown.less +++ b/customize.dist/src/less2/include/dropdown.less @@ -1,4 +1,4 @@ -@import (once) "./colortheme.less"; +@import (once) "./colortheme-all.less"; @import (once) "./tools.less"; /* The container
- needed to position the dropdown content */ diff --git a/customize.dist/src/less2/include/fileupload.less b/customize.dist/src/less2/include/fileupload.less index a07d365bd..3ed3e793e 100644 --- a/customize.dist/src/less2/include/fileupload.less +++ b/customize.dist/src/less2/include/fileupload.less @@ -1,4 +1,4 @@ -@import (once) './colortheme.less'; +@import (once) './colortheme-all.less'; @import (once) './modal.less'; .fileupload_main () { diff --git a/customize.dist/src/less2/include/icon-colors.less b/customize.dist/src/less2/include/icon-colors.less index db9de2a14..a71059950 100644 --- a/customize.dist/src/less2/include/icon-colors.less +++ b/customize.dist/src/less2/include/icon-colors.less @@ -1,4 +1,4 @@ -@import (once) "./colortheme.less"; +@import (once) "./colortheme-all.less"; .iconColors_main () { // Classes used in common-interface.js .cp-icon-color-pad { color: @colortheme_pad-bg; } diff --git a/customize.dist/src/less2/include/infopages.less b/customize.dist/src/less2/include/infopages.less index 41bafa6f0..f6e752633 100644 --- a/customize.dist/src/less2/include/infopages.less +++ b/customize.dist/src/less2/include/infopages.less @@ -1,4 +1,4 @@ -@import (once) "./colortheme.less"; +@import (once) "./colortheme-all.less"; @infopages_infobar-height: 64px; @infopages_padding: 32px; diff --git a/customize.dist/src/less2/include/leftside-menu.less b/customize.dist/src/less2/include/leftside-menu.less index 3211fb3a9..28ae57af4 100644 --- a/customize.dist/src/less2/include/leftside-menu.less +++ b/customize.dist/src/less2/include/leftside-menu.less @@ -1,6 +1,6 @@ @import (once) "./unselectable.less"; @import (once) "./variables.less"; -@import (once) "./colortheme.less"; +@import (once) "./colortheme-all.less"; .leftside-menu_main() { } diff --git a/customize.dist/src/less2/include/limit-bar.less b/customize.dist/src/less2/include/limit-bar.less index efca7811d..373d59e66 100644 --- a/customize.dist/src/less2/include/limit-bar.less +++ b/customize.dist/src/less2/include/limit-bar.less @@ -1,4 +1,4 @@ -@import (once) "./colortheme.less"; +@import (once) "./colortheme-all.less"; .limit-bar_main () { .cp-limit-container { diff --git a/customize.dist/src/less2/include/modal.less b/customize.dist/src/less2/include/modal.less index 865abff73..070660291 100644 --- a/customize.dist/src/less2/include/modal.less +++ b/customize.dist/src/less2/include/modal.less @@ -1,4 +1,4 @@ -@import (once) "./colortheme.less"; +@import (once) "./colortheme-all.less"; @import (once) "./modal-theme.less"; .modal_base() { diff --git a/customize.dist/src/less2/include/toolbar-history.less b/customize.dist/src/less2/include/toolbar-history.less index d553caa3f..abf14f3ac 100644 --- a/customize.dist/src/less2/include/toolbar-history.less +++ b/customize.dist/src/less2/include/toolbar-history.less @@ -1,4 +1,4 @@ -@import (once) "./colortheme.less"; +@import (once) "./colortheme-all.less"; .history_main () { .cp-toolbar-history { diff --git a/customize.dist/src/less2/include/toolbar.less b/customize.dist/src/less2/include/toolbar.less index 4e955af6c..37d294c3b 100644 --- a/customize.dist/src/less2/include/toolbar.less +++ b/customize.dist/src/less2/include/toolbar.less @@ -1,5 +1,5 @@ @import (once) "./dropdown.less"; -@import (once) "./colortheme.less"; +@import (once) "./colortheme-all.less"; @import (once) "./browser.less"; @import (once) "./ckeditor-fix.less"; @import (once) "./avatar.less"; diff --git a/customize.dist/src/less2/pages/page-404.less b/customize.dist/src/less2/pages/page-404.less index 6c67732fd..c6afae5b0 100644 --- a/customize.dist/src/less2/pages/page-404.less +++ b/customize.dist/src/less2/pages/page-404.less @@ -1,4 +1,4 @@ -@import (once) "../include/colortheme.less"; +@import (once) "../include/colortheme-all.less"; @import (once) "../include/font.less"; .font_neuropolitical(); .font_open-sans(); From 617c4b60440313610cfdfff06781d7f34ac5449a Mon Sep 17 00:00:00 2001 From: Caleb James DeLisle Date: Thu, 7 Dec 2017 19:00:13 +0100 Subject: [PATCH 02/13] CSS refactorings and pad-is-not-pinned work --- customize.dist/messages.js | 2 +- .../src/less2/include/alertify.less | 6 +- .../src/less2/include/colortheme.less | 2 +- .../src/less2/include/modal-theme.less | 4 - customize.dist/src/less2/include/modal.less | 10 +- customize.dist/src/less2/include/toolbar.less | 293 ++++++++---------- .../src/less2/include/variables.less | 6 + customize.dist/translations/messages.js | 2 +- www/code/app-code.less | 8 +- www/common/toolbar3.js | 15 +- www/contacts/app-contacts.less | 8 +- www/drive/app-drive.less | 8 +- www/file/app-file.less | 8 +- www/pad/app-pad.less | 12 +- www/poll/app-poll.less | 14 +- www/profile/app-profile.less | 7 +- www/settings/app-settings.less | 8 +- www/slide/app-slide.less | 8 +- www/todo/app-todo.less | 7 +- www/whiteboard/app-whiteboard.less | 8 +- 20 files changed, 208 insertions(+), 228 deletions(-) delete mode 100644 customize.dist/src/less2/include/modal-theme.less diff --git a/customize.dist/messages.js b/customize.dist/messages.js index 7e84dd01d..588b259b0 100644 --- a/customize.dist/messages.js +++ b/customize.dist/messages.js @@ -93,7 +93,7 @@ define(req, function(Util, Default, Language) { var text = messages[key]; if (typeof(text) === 'string') { return text.replace(/\{(\d+)\}/g, function (str, p1) { - return argArray[p1] || null; + return typeof(argArray[p1]) === 'string' ? argArray[p1] : ''; }); } else { return text; diff --git a/customize.dist/src/less2/include/alertify.less b/customize.dist/src/less2/include/alertify.less index 63751fed2..ed0f1baf9 100644 --- a/customize.dist/src/less2/include/alertify.less +++ b/customize.dist/src/less2/include/alertify.less @@ -1,6 +1,6 @@ @import (once) "./colortheme-all.less"; @import (once) "./browser.less"; -@import (once) "./modal-theme.less"; +@import (once) "./variables.less"; .alertify_main () { @max-z-index: 2147483647; @@ -21,8 +21,8 @@ @alertify-input-bg: @colortheme_modal-input; @alertify-input-fg: @colortheme_modal-fg; - @alertify_padding-base: @modal_padding; - @alertify_box-shadow: @modal_shadow; + @alertify_padding-base: @variables_padding; + @alertify_box-shadow: @variables_shadow; // Logs to show that something has happened // These show only once diff --git a/customize.dist/src/less2/include/colortheme.less b/customize.dist/src/less2/include/colortheme.less index 8cebdaf20..42cbb26b0 100644 --- a/customize.dist/src/less2/include/colortheme.less +++ b/customize.dist/src/less2/include/colortheme.less @@ -37,7 +37,7 @@ @colortheme_dropdown-bg-hover: #f1f1f1; @colortheme_dropdown-bg-active: #e8e8e8; -// Apps +// Apps, these colors are used for customizing the toolbar for the apps. @colortheme_pad-bg: #1c4fa0; @colortheme_pad-color: #fff; diff --git a/customize.dist/src/less2/include/modal-theme.less b/customize.dist/src/less2/include/modal-theme.less deleted file mode 100644 index 1ed183d2d..000000000 --- a/customize.dist/src/less2/include/modal-theme.less +++ /dev/null @@ -1,4 +0,0 @@ -// Used in modal.less and alertify.less -@modal_padding: 12px; -@modal_shadow: 0 8px 32px 0 rgba(0,0,0,.4); - diff --git a/customize.dist/src/less2/include/modal.less b/customize.dist/src/less2/include/modal.less index 070660291..3bd674527 100644 --- a/customize.dist/src/less2/include/modal.less +++ b/customize.dist/src/less2/include/modal.less @@ -1,12 +1,12 @@ @import (once) "./colortheme-all.less"; -@import (once) "./modal-theme.less"; +@import (once) "./variables.less"; .modal_base() { font-family: @colortheme_font; background-color: @colortheme_modal-bg; color: @colortheme_modal-fg; - box-shadow: @modal_shadow; + box-shadow: @variables_shadow; a { color: @colortheme_modal-link; @@ -31,9 +31,9 @@ .cp-modal { background-color: @colortheme_modal-bg; color: @colortheme_modal-fg; - box-shadow: @modal_shadow; + box-shadow: @variables_shadow; - padding: @modal_padding; + padding: @variables_padding; position: absolute; top: 15vh; bottom: 15vh; @@ -71,7 +71,7 @@ position: absolute; top: 0; right: 0; - margin: @modal_padding; + margin: @variables_padding; cursor: pointer; } } diff --git a/customize.dist/src/less2/include/toolbar.less b/customize.dist/src/less2/include/toolbar.less index 37d294c3b..e97e5c7a7 100644 --- a/customize.dist/src/less2/include/toolbar.less +++ b/customize.dist/src/less2/include/toolbar.less @@ -7,9 +7,12 @@ @import (once) "./icon-colors.less"; @import (once) "./tools.less"; -@_cp-toolbar-color-warn: black; - -.toolbar_main () { +.toolbar_main ( + @color: @colortheme_default-color, // Color of the text for the toolbar + @bg-color: @colortheme_default-bg, // color of the toolbar background + @warn-color: @colortheme_default-warn, // color of the warning text in the toolbar + @barWidth: 600px // width of the toolbar +) { @toolbar_line-height: 32px; @toolbar_top-height: 64px; @@ -52,7 +55,7 @@ } .cp-toolbar-userlist-drawer { - background-color: @colortheme_default-bg; + background-color: @bg-color; font: @colortheme_app-font-size @colortheme_font; min-width: 175px; width: 175px; @@ -170,176 +173,53 @@ } } - .addToolbarColors (@color, @bg-color, @barWidth: 600px) { - .cp-markdown-toolbar { - height: @toolbar_line-height; - background-color: lighten(@bg-color, 20%); - display: none; - button { - height: @toolbar_line-height !important; - outline: 0; - color: @color; - .toolbar_button; - font: normal normal normal 14px/1 FontAwesome; - &:hover { - background-color: lighten(@bgcolor, 8%); - } - &.cp-markdown-help { float: right; } + // TODO(cjd) This ought to be in a less file for markdown-based editors + .cp-markdown-toolbar { + height: @toolbar_line-height; + background-color: lighten(@bg-color, 20%); + display: none; + button { + height: @toolbar_line-height !important; + outline: 0; + color: @color; + .toolbar_button; + font: normal normal normal 14px/1 FontAwesome; + &:hover { + background-color: lighten(@bg-color, 8%); } + &.cp-markdown-help { float: right; } } - .cp-toolbar-userlist-drawer { - background-color: @bgcolor; + } + .cp-toolbar-userlist-drawer { + background-color: @bg-color; + color: @color; + .cp-toolbar-userlist-drawer-close { + color: @color; + } + h2 { + background-color: darken(@bg-color, 10%); color: @color; - .cp-toolbar-userlist-drawer-close { - color: @color; - } - h2 { - background-color: darken(@bgcolor, 10%); - color: @color; - } - .cp-toolbar-userlist-name-input { - background-color: darken(@bg-color, 10%); - color: @color; - } - .cp-toolbar-userlist-name-edit { - color: contrast(@color, - lighten(@color, 20%), - darken(@color, 20%)); - background: transparent; - &:hover { - color: @color; - } - } - .cp-toolbar-userlist-friend { - &:hover { - color: darken(@color, 15%); - } - } } - .cp-toolbar { - background-color: @bgcolor; + .cp-toolbar-userlist-name-input { + background-color: darken(@bg-color, 10%); color: @color; - .cp-toolbar-spinner { - font-size: @colortheme_app-font-size; - color: @color; - } - .cp-toolbar-limit { - text-shadow: -1px 0 @color, 0 1px @color, 1px 0 @color, 0 -1px @color; - color: @_cp-toolbar-color-warn; - } - .cp-toolbar-leftside, .cp-toolbar-rightside { - background-color: lighten(@bgcolor, 8%); - button:hover, button.cp-toolbar-button-active { - background-color: @bgcolor; - } - } - .cp-toolbar-rightside { - @media screen and (max-width: @barWidth) { // 450px - flex-wrap: wrap; - height: auto; - width: 100%; - } - } - .cp-pad-not-pinned { - padding-left: 20px; - font-size: @colortheme_app-font-size; - color: @_cp-toolbar-color-warn; - a { - font-size: @colortheme_app-font-size; - font-weight: bold; - color: @_cp-toolbar-color-warn; - &:hover { - text-decoration: underline; - } - } - } - .cp-toolbar-title-hoverable:hover { - .cp-toolbar-title-editable, .cp-toolbar-title-edit { - cursor: text; - border: 1px solid darken(@bgcolor, 15%); - background: darken(@bgcolor, 10%); - transition: all 0.15s; - color: @color; - } - .cp-toolbar-title-editable { - cursor: text; - } - } - .cp-toolbar-title-save { - border: 1px solid darken(@bgcolor, 15%); - background: darken(@bgcolor, 10%); - color: @color; - &:hover { - background: darken(@bgcolor, 5%); - } - } - input { - border: 1px solid darken(@bgcolor, 15%); - background: darken(@bgcolor, 10%); + } + .cp-toolbar-userlist-name-edit { + color: contrast(@color, + lighten(@color, 20%), + darken(@color, 20%)); + background: transparent; + &:hover { color: @color; } - .cp-dropdown-content.cp-dropdown-left a { - color: black; + } + .cp-toolbar-userlist-friend { + &:hover { + color: darken(@color, 15%); } } } - &.cp-app-pad { - @bgcolor: @colortheme_pad-bg; - @color: @colortheme_pad-color; - .addToolbarColors(@color, @bgcolor); - } - &.cp-app-code { - @bgcolor: @colortheme_code-bg; - @color: @colortheme_code-color; - .addToolbarColors(@color, @bgcolor); - } - &.cp-app-slide { - @bgcolor: @colortheme_slide-bg; - @color: @colortheme_slide-color; - .addToolbarColors(@color, @bgcolor, 700px); - } - &.cp-app-poll { - @bgcolor: @colortheme_poll-bg; - @color: @colortheme_poll-color; - .addToolbarColors(@color, @bgcolor); - } - &.cp-app-whiteboard { - @bgcolor: @colortheme_whiteboard-bg; - @color: @colortheme_whiteboard-color; - .addToolbarColors(@color, @bgcolor); - } - &.cp-app-drive { - @bgcolor: @colortheme_drive-bg; - @color: @colortheme_drive-color; - .addToolbarColors(@color, @bgcolor); - } - &.cp-app-file { - @bgcolor: @colortheme_file-bg; - @color: @colortheme_file-color; - .addToolbarColors(@color, @bgcolor); - } - &.cp-app-contacts { - @bgcolor: @colortheme_friends-bg; - @color: @colortheme_friends-color; - .addToolbarColors(@color, @bgcolor); - } - &.cp-app-settings { - @bgcolor: @colortheme_settings-bg; - @color: @colortheme_settings-color; - .addToolbarColors(@color, @bgcolor); - } - &.cp-app-profile { - @bgcolor: @colortheme_profile-bg; - @color: @colortheme_profile-color; - .addToolbarColors(@color, @bgcolor); - } - &.cp-app-todo { - @bgcolor: @colortheme_todo-bg; - @color: @colortheme_todo-color; - .addToolbarColors(@color, @bgcolor); - } - .cp-toolbar { * { outline-width: 0; @@ -355,12 +235,8 @@ display: flex; flex-wrap: wrap; justify-content: space-between; - - //background-color: #BBBBFF; - background-color: @colortheme_default-bg; - color: @colortheme_default-color; - - + background-color: @bg-color; + color: @color; .fa { font: normal normal normal 14px/1 FontAwesome; @@ -487,6 +363,56 @@ } } } + + .cp-toolbar-spinner { + font-size: @colortheme_app-font-size; + color: @color; + } + .cp-toolbar-limit { + text-shadow: -1px 0 @color, 0 1px @color, 1px 0 @color, 0 -1px @color; + color: @warn-color; + } + .cp-toolbar-leftside, .cp-toolbar-rightside { + background-color: lighten(@bg-color, 8%); + button:hover, button.cp-toolbar-button-active { + background-color: @bg-color; + } + } + .cp-toolbar-rightside { + @media screen and (max-width: @barWidth) { // 450px + flex-wrap: wrap; + height: auto; + width: 100%; + } + } + .cp-toolbar-title-hoverable:hover { + .cp-toolbar-title-editable, .cp-toolbar-title-edit { + cursor: text; + border: 1px solid darken(@bg-color, 15%); + background: darken(@bg-color, 10%); + transition: all 0.15s; + color: @color; + } + .cp-toolbar-title-editable { + cursor: text; + } + } + .cp-toolbar-title-save { + border: 1px solid darken(@bg-color, 15%); + background: darken(@bg-color, 10%); + color: @color; + &:hover { + background: darken(@bg-color, 5%); + } + } + input { + border: 1px solid darken(@bg-color, 15%); + background: darken(@bg-color, 10%); + color: @color; + } + .cp-dropdown-content.cp-dropdown-left a { + color: black; + } } .cp-toolbar-top { @@ -578,6 +504,35 @@ padding: 5px 5px; height: 40px; } + .cp-pad-not-pinned { + text-overflow: ellipsis; + overflow: hidden; + white-space: nowrap; + + align-self: right; + padding-left: 20px; + padding-left: 5px; + font-size: @colortheme_app-font-size; + color: @warn-color; + .cp-pnp-msg { + padding-left: 5px; + a { + font-size: @colortheme_app-font-size; + font-weight: bold; + color: @warn-color; + &:hover { + text-decoration: underline; + } + } + @media screen and (max-width: (@browser_media-not-big)) { + display: none; + } + } + @media screen and (max-width: (@browser_media-not-big)) { + overflow: visible; + } + + } } .cp-toolbar-link, .cp-toolbar-new { font-size: 48px; diff --git a/customize.dist/src/less2/include/variables.less b/customize.dist/src/less2/include/variables.less index 3aee02492..ba6c642e2 100644 --- a/customize.dist/src/less2/include/variables.less +++ b/customize.dist/src/less2/include/variables.less @@ -1,3 +1,9 @@ +// This is a file for generic constants which we didn't want to hardcode everywhere. +// However, unlike colortheme, customizing these variables will cause breakage. + // Elements size @variables_bar-height: 32px; +// Used in modal.less and alertify.less +@variables_padding: 12px; +@variables_shadow: 0 8px 32px 0 rgba(0,0,0,.4); diff --git a/customize.dist/translations/messages.js b/customize.dist/translations/messages.js index 90ce1871e..5e6034d8b 100644 --- a/customize.dist/translations/messages.js +++ b/customize.dist/translations/messages.js @@ -31,7 +31,7 @@ define(function () { out.typeError = "This pad is not compatible with the selected application"; out.onLogout = 'You are logged out, click here to log in
or press Escape to access your pad in read-only mode.'; out.wrongApp = "Unable to display the content of that realtime session in your browser. Please try to reload that page."; - out.padNotPinned = 'This pad will expire in 3 months, login or register to preserve it.'; + out.padNotPinned = 'This pad will expire in 3 months, {0}login{1} or {2}register{3} to preserve it.'; out.loading = "Loading..."; out.error = "Error"; diff --git a/www/code/app-code.less b/www/code/app-code.less index 5025d4b3c..22402a999 100644 --- a/www/code/app-code.less +++ b/www/code/app-code.less @@ -5,9 +5,11 @@ @import (once) '../../customize/src/less2/include/alertify.less'; @import (once) '../../customize/src/less2/include/tokenfield.less'; -@_cp-toolbar-color-warn: @colortheme_code-warn; - -.toolbar_main(); +.toolbar_main( + @bg-color: @colortheme_code-bg, + @warn-color: @colortheme_code-warn, + @color: @colortheme_code-color +); .fileupload_main(); .alertify_main(); .tokenfield_main(); diff --git a/www/common/toolbar3.js b/www/common/toolbar3.js index 5bdd8486d..fc06f40f6 100644 --- a/www/common/toolbar3.js +++ b/www/common/toolbar3.js @@ -729,11 +729,20 @@ define([ Common.sendAnonRpcMsg('IS_CHANNEL_PINNED', cid, function (x) { if (x.error || !Array.isArray(x.response)) { return void console.log(x); } if (x.response[0] === true) { return; } + var pnpTitle = Messages._getKey('padNotPinned', ['','','','']); + var pnpMsg = Messages._getKey('padNotPinned', [ + '', + '', + '', + '' + ]); var msg = $('', { 'class': 'cp-pad-not-pinned', - }).append( - Messages._getKey('padNotPinned', [o + '/login', o + '/register']) - ); + 'title': pnpTitle + }).append([ + $('', {'class': 'fa fa-exclamation-triangle'}), + $('', {'class': 'cp-pnp-msg'}).append(pnpMsg) + ]); $('.cp-toolbar-title').append(msg); console.log("This pad is not pinned"); }); diff --git a/www/contacts/app-contacts.less b/www/contacts/app-contacts.less index 26fba2c90..925fd9f81 100644 --- a/www/contacts/app-contacts.less +++ b/www/contacts/app-contacts.less @@ -8,9 +8,11 @@ @import (once) '../../customize/src/less2/include/avatar.less'; -@_cp-toolbar-color-warn: @colortheme_friends-warn;; - -.toolbar_main(); +.toolbar_main( + @bg-color: @colortheme_friends-bg, + @warn-color: @colortheme_friends-warn, + @color: @colortheme_friends-color +); .fileupload_main(); .alertify_main(); diff --git a/www/drive/app-drive.less b/www/drive/app-drive.less index 17ae35fcb..259e63f56 100644 --- a/www/drive/app-drive.less +++ b/www/drive/app-drive.less @@ -8,9 +8,11 @@ @import (once) "../../customize/src/less2/include/limit-bar.less"; @import (once) "../../customize/src/less2/include/tokenfield.less"; -@_cp-toolbar-color-warn: @colortheme_drive-warn; - -.toolbar_main(); +.toolbar_main( + @bg-color: @colortheme_drive-bg, + @warn-color: @colortheme_drive-warn, + @color: @colortheme_drive-color +); .fileupload_main(); .alertify_main(); .limit-bar_main(); diff --git a/www/file/app-file.less b/www/file/app-file.less index 7a990cb03..a777b6014 100644 --- a/www/file/app-file.less +++ b/www/file/app-file.less @@ -5,9 +5,11 @@ @import (once) '../../customize/src/less2/include/alertify.less'; @import (once) '../../customize/src/less2/include/tokenfield.less'; -@_cp-toolbar-color-warn: @colortheme_file-warn; - -.toolbar_main(); +.toolbar_main( + @bg-color: @colortheme_file-bg, + @warn-color: @colortheme_file-warn, + @color: @colortheme_file-color +); .fileupload_main(); .alertify_main(); .tokenfield_main(); diff --git a/www/pad/app-pad.less b/www/pad/app-pad.less index 6e34f473d..1aa1a4f62 100644 --- a/www/pad/app-pad.less +++ b/www/pad/app-pad.less @@ -1,14 +1,12 @@ -// Defaults to avoid breaking existing themes - -@colortheme_pad-toolbar-bg: #c1e7ff; - @import (once) "../../customize/src/less2/include/toolbar.less"; @import (once) '../../customize/src/less2/include/alertify.less'; @import (once) '../../customize/src/less2/include/tokenfield.less'; -@_cp-toolbar-color-warn: @colortheme_pad-warn; - -.toolbar_main(); +.toolbar_main( + @bg-color: @colortheme_pad-bg, + @warn-color: @colortheme_pad-warn, + @color: @colortheme_pad-color +); .alertify_main(); // body diff --git a/www/poll/app-poll.less b/www/poll/app-poll.less index f717a6f56..2a29f1fdf 100644 --- a/www/poll/app-poll.less +++ b/www/poll/app-poll.less @@ -1,9 +1,3 @@ -// Defaults to avoid breaking existing themes - -@colortheme_poll-th-bg: #005bef; -@colortheme_poll-th-fg: #fff; -@colortheme_poll-help-bg: #bbffbb; - @import (once) "../../customize/src/less2/include/browser.less"; @import (once) "../../customize/src/less2/include/toolbar.less"; @import (once) "../../customize/src/less2/include/markdown.less"; @@ -13,9 +7,11 @@ @import (once) '../../customize/src/less2/include/tools.less'; @import (once) '../../customize/src/less2/include/avatar.less'; -@_cp-toolbar-color-warn: @colortheme_poll-warn; - -.toolbar_main(); +.toolbar_main( + @bg-color: @colortheme_poll-bg, + @warn-color: @colortheme_poll-warn, + @color: @colortheme_poll-color +); .fileupload_main(); .alertify_main(); .tokenfield_main(); diff --git a/www/profile/app-profile.less b/www/profile/app-profile.less index 21e659a03..d36233782 100644 --- a/www/profile/app-profile.less +++ b/www/profile/app-profile.less @@ -7,8 +7,11 @@ @import (once) '../../customize/src/less2/include/avatar.less'; @import (once) '../../customize/src/less2/include/sidebar-layout.less'; - -.toolbar_main(); +.toolbar_main( + @bg-color: @colortheme_profile-bg, + @warn-color: @colortheme_profile-warn, + @color: @colortheme_profile-color +); .fileupload_main(); .alertify_main(); .sidebar-layout_main(); diff --git a/www/settings/app-settings.less b/www/settings/app-settings.less index b96384bc0..8b3d3b7fb 100644 --- a/www/settings/app-settings.less +++ b/www/settings/app-settings.less @@ -6,9 +6,11 @@ @import (once) '../../customize/src/less2/include/sidebar-layout.less'; @import (once) "../../customize/src/less2/include/limit-bar.less"; -@_cp-toolbar-color-warn: @colortheme_settings-warn; - -.toolbar_main(); +.toolbar_main( + @bg-color: @colortheme_settings-bg, + @warn-color: @colortheme_settings-warn, + @color: @colortheme_settings-color +); .alertify_main(); .sidebar-layout_main(); .limit-bar_main(); diff --git a/www/slide/app-slide.less b/www/slide/app-slide.less index 32088eb64..6a9c2ee63 100644 --- a/www/slide/app-slide.less +++ b/www/slide/app-slide.less @@ -6,10 +6,12 @@ @import (once) "../../customize/src/less2/include/mediatag.less"; @import (once) '../../customize/src/less2/include/tokenfield.less'; -@_cp-toolbar-color-warn: @colortheme_slide-warn; - .mediatag_base(); -.toolbar_main(); +.toolbar_main( + @bg-color: @colortheme_slide-bg, + @warn-color: @colortheme_slide-warn, + @color: @colortheme_slide-color +); .fileupload_main(); .alertify_main(); .tokenfield_main(); diff --git a/www/todo/app-todo.less b/www/todo/app-todo.less index de420b8b1..fd274a0ee 100644 --- a/www/todo/app-todo.less +++ b/www/todo/app-todo.less @@ -8,8 +8,11 @@ @import (once) '../../customize/src/less2/include/avatar.less'; - -.toolbar_main(); +.toolbar_main( + @bg-color: @colortheme_todo-bg, + @warn-color: @colortheme_todo-warn, + @color: @colortheme_todo-color +); .fileupload_main(); .alertify_main(); diff --git a/www/whiteboard/app-whiteboard.less b/www/whiteboard/app-whiteboard.less index 95fe016e9..28e6a6e0c 100644 --- a/www/whiteboard/app-whiteboard.less +++ b/www/whiteboard/app-whiteboard.less @@ -6,9 +6,11 @@ @import (once) '../../customize/src/less2/include/tools.less'; @import (once) '../../customize/src/less2/include/tokenfield.less'; -@_cp-toolbar-color-warn: @colortheme_whiteboard-warn; - -.toolbar_main(); +.toolbar_main( + @bg-color: @colortheme_whiteboard-bg, + @warn-color: @colortheme_whiteboard-warn, + @color: @colortheme_whiteboard-color +); .fileupload_main(); .alertify_main(); .tokenfield_main(); From 38bd27303bade3191c45abf06744e0c833573770 Mon Sep 17 00:00:00 2001 From: ansuz Date: Fri, 8 Dec 2017 11:47:07 +0100 Subject: [PATCH 03/13] WIP rpc framework --- www/assert/frame/frame.html | 7 ++ www/assert/frame/frame.js | 147 +++++++++++++++++++++++++++++++ www/assert/frame/respond.js | 32 +++++++ www/assert/main.js | 75 ++++++++++------ www/common/wire.js | 167 +++++++++++++++++++++++++++--------- 5 files changed, 361 insertions(+), 67 deletions(-) create mode 100644 www/assert/frame/frame.html create mode 100644 www/assert/frame/frame.js create mode 100644 www/assert/frame/respond.js diff --git a/www/assert/frame/frame.html b/www/assert/frame/frame.html new file mode 100644 index 000000000..8d2d63c0d --- /dev/null +++ b/www/assert/frame/frame.html @@ -0,0 +1,7 @@ + + + + + + + diff --git a/www/assert/frame/frame.js b/www/assert/frame/frame.js new file mode 100644 index 000000000..42808f6f9 --- /dev/null +++ b/www/assert/frame/frame.js @@ -0,0 +1,147 @@ +(function () { + + var Frame = {}; + + var uid = function () { + return Number(Math.floor(Math.random() * Number.MAX_SAFE_INTEGER)) + .toString(32).replace(/\./g, ''); + }; + + // create an invisible iframe with a given source + // append it to a parent element + // execute a callback when it has loaded + Frame.create = function (parent, src, onload, timeout) { + var iframe = document.createElement('iframe'); + + timeout = timeout || 10000; + var to = window.setTimeout(function () { + onload('[timeoutError] could not load iframe at ' + src); + }, timeout); + + iframe.setAttribute('id', 'cors-store'); + + iframe.onload = function (e) { + onload(void 0, iframe, e); + window.clearTimeout(to); + }; + // We must pass a unique parameter here to avoid cache problems in Firefox with + // the NoScript plugin: if the iframe's content is taken from the cache, the JS + // is not executed with NoScript.... + iframe.setAttribute('src', src + '?t=' + new Date().getTime()); + + iframe.style.display = 'none'; + parent.appendChild(iframe); + }; + + /* given an iframe with an rpc script loaded, create a frame object + with an asynchronous 'send' method */ + Frame.open = function (e, A, timeout) { + var win = e.contentWindow; + + var frame = {}; + frame.id = uid(); + + var listeners = {}; + var timeouts = {}; + + timeout = timeout || 5000; + + frame.accepts = function (o) { + return A.some(function (e) { + switch (typeof(e)) { + case 'string': return e === o; + case 'object': return e.test(o); + } + }); + }; + + var changeHandlers = frame.changeHandlers = []; + + frame.change = function (f) { + if (typeof(f) !== 'function') { + throw new Error('[Frame.change] expected callback'); + } + changeHandlers.push(f); + }; + + var _listener = function (e) { + if (!frame.accepts(e.origin)) { + console.log("message from %s rejected!", e.origin); + return; + } + var message = JSON.parse(e.data); + var uid = message._uid; + var error = message.error; + var data = message.data; + + if (!uid) { + console.log("No uid!"); + return; + } + + if (uid === 'change' && changeHandlers.length) { + changeHandlers.forEach(function (f) { + f(data); + }); + return; + } + + if (timeouts[uid]) { + window.clearTimeout(timeouts[uid]); + } + if (listeners[uid]) { + listeners[uid](error, data, e); + delete listeners[uid]; + } + }; + window.addEventListener('message', _listener); + + frame.close = function () { + window.removeEventListener('message', _listener); + }; + + /* method (string): (set|get|remove) + key (string) + data (string) + cb (function) */ + frame.send = function (method, content, cb) { + var req = { + method: method, + //key: key, + data: content, //data, + }; + + var id = req._uid = uid(); + // uid must not equal 'change' + while(id === 'change') { + id = req._uid = uid(); + } + + if (typeof(cb) === 'function') { + //console.log("setting callback!"); + listeners[id] = cb; + //console.log("setting timeout of %sms", timeout); + timeouts[id] = window.setTimeout(function () { + // when the callback is executed it will clear this timeout + cb('[TimeoutError] request timed out after ' + timeout + 'ms'); + }, timeout); + } else { + console.log(typeof(cb)); + } + + win.postMessage(JSON.stringify(req), '*'); + }; + + return frame; + }; + + if (typeof(module) !== 'undefined' && module.exports) { + module.exports = Frame; + } else if (typeof(define) === 'function' && define.amd) { + define(['jquery'], function () { + return Frame; + }); + } else { + window.Frame = Frame; + } +}()); diff --git a/www/assert/frame/respond.js b/www/assert/frame/respond.js new file mode 100644 index 000000000..07f8e2994 --- /dev/null +++ b/www/assert/frame/respond.js @@ -0,0 +1,32 @@ +var validDomains = [ /.*/i, ]; +var isValidDomain = function (o) { + return validDomains.some(function (e) { + switch (typeof(e)) { + case 'string': return e === o; + case 'object': return e.test(o); + } + }); +}; + +window.addEventListener('message', function(e) { + if (!isValidDomain(e.origin)) { return; } + var payload = JSON.parse(e.data); + var parent = window.parent; + var respond = function (error, data) { + var res = { + _uid: payload._uid, + error: error, + data: data, + }; + parent.postMessage(JSON.stringify(res), '*'); + }; + + //console.error(payload); + switch(payload.method) { + case undefined: + return respond('No method supplied'); + default: + return respond(void 0, "EHLO"); + } +}); + diff --git a/www/assert/main.js b/www/assert/main.js index e88e13fd1..629d7cafd 100644 --- a/www/assert/main.js +++ b/www/assert/main.js @@ -249,7 +249,6 @@ define([ } }; - var evt = Util.mkEvent(); var respond = function (e, out) { evt.fire(e, out); @@ -259,9 +258,8 @@ define([ try { var parsed = JSON.parse(raw); var txid = parsed.txid; - var message = parsed.message; setTimeout(function () { - service(message.command, message.content, function (e, result) { + service(parsed.q, parsed.content, function (e, result) { respond(JSON.stringify({ txid: txid, error: e, @@ -285,33 +283,56 @@ define([ }); }, "Test rpc factory"); -/* assert(function (cb) { - var getBlob = function (url, cb) { - var xhr = new XMLHttpRequest(); - xhr.open("GET", url, true); - xhr.responseType = "blob"; - xhr.onload = function () { - cb(void 0, this.response); - }; - xhr.send(); - }; - - var $img = $('img#thumb-orig'); - getBlob($img.attr('src'), function (e, blob) { - console.log(e, blob); - Thumb.fromImageBlob(blob, function (e, thumb) { - console.log(thumb); - var th = new Image(); - th.src = URL.createObjectURL(thumb); - th.onload = function () { - $(document.body).append($(th).addClass('thumb')); - cb(th.width === Thumb.dimension && th.height === Thumb.dimension); - }; + require([ + '/assert/frame/frame.js', + ], function (Frame) { + Frame.create(document.body, '/assert/frame/frame.html', function (e, frame) { + if (e) { return cb(false); } + + var channel = Frame.open(frame, [ + /.*/i, + ], 5000); + + channel.send('HELO', null, function (e, res) { + if (res === 'EHLO') { return cb(true); } + cb(false); + }); }); }); - }); -*/ + }, "PEWPEW"); + + (function () { + var guid = Wire.uid(); + + var t = Wire.tracker({ + timeout: 1000, + hook: function (txid, q, content) { + console.info(JSON.stringify({ + guid: guid, + txid: txid, + q: q, + content: content, + })); + }, + }); + + assert(function (cb) { + t.call('SHOULD_TIMEOUT', null, function (e) { + if (e === 'TIMEOUT') { return cb(true); } + cb(false); + }); + }, 'tracker should timeout'); + + assert(function (cb) { + var id = t.call('SHOULD_NOT_TIMEOUT', null, function (e, out) { + if (e) { return cb(false); } + if (out === 'YES') { return cb(true); } + cb(false); + }); + t.respond(id, void 0, 'YES'); + }, "tracker should not timeout"); + }()); Drive.test(assert); diff --git a/www/common/wire.js b/www/common/wire.js index c4b59cfae..c30e5defb 100644 --- a/www/common/wire.js +++ b/www/common/wire.js @@ -7,25 +7,118 @@ define([ Requirements -* some transmission methods can be interrupted - * handle disconnects and reconnects -* handle callbacks -* configurable timeout -* Service should expose 'addClient' method - * and handle broadcast +* [x] some transmission methods can be interrupted + * [x] handle disconnects and reconnects +* [x] handle callbacks +* [x] configurable timeout +* [x] be able to answer only queries with a particular id +* be able to implement arbitrary listeners on the service-side + * and not call 'ready' until those listeners are ready +* identical API for: + * iframe postMessage + * server calls over netflux + * postMessage to webworker + * postMessage to sharedWorker +* on-wire protocol should actually be the same for rewriting purposes + * q + * guid (globally unique id) + * txid (message id) + * content +* be able to compose different RPCs as streams + * intercept and rewrite capacity + * multiplex multiple streams over one stream + * blind redirect + * intelligent router + * broadcast (with ACK?) + * message -* - */ - var uid = function () { + var uid = Wire.uid = function () { return Number(Math.floor(Math.random () * Number.MAX_SAFE_INTEGER)).toString(32); }; + +/* tracker(options) + maintains a registry of asynchronous function calls + +allows you to: + hook each call to actually send to a remote service... + abort any call + trigger the pending callback with arguments + set the state of the tracker (active/inactive) + + +*/ + Wire.tracker = function (opt) { + opt = opt || {}; + var hook = opt.hook || function () {}; + var timeout = opt.timeout || 5000; + var pending = {}; + var timeouts = {}; + + var call = function (method, data, cb) { + var id = uid(); + + // if the callback is not invoked in time, time out + timeouts[id] = setTimeout(function () { + if (typeof(pending[id]) === 'function') { + cb("TIMEOUT"); + delete pending[id]; + return; + } + throw new Error('timed out without function to call'); + }, timeout); + + pending[id] = function () { + // invoke the function with arguments... + cb.apply(null, Array.prototype.slice.call(arguments)); + // clear its timeout + clearTimeout(timeouts[id]); + // remove the function from pending + delete pending[id]; + }; + + hook(id, method, data); + + return id; + }; + + var respond = function (id, err, response) { + if (typeof(pending[id]) !== 'function') { + throw new Error('invoked non-existent callback'); + } + pending[id](err, response); + }; + + var abort = function (id) { + if (pending[id]) { + clearTimeout(timeouts[id]); + delete pending[id]; + return true; + } + return false; + }; + + var t = { + call: call, + respond: respond, + abort: abort, + state: true, + }; + + t.setState = function (active) { + t.state = Boolean(active); + }; + + return t; + }; + /* opt = { + timeout: 30000, send: function () { }, @@ -45,50 +138,44 @@ opt = { }; */ - Wire.create = function (opt, cb) { - var ctx = {}; - var pending = ctx.pending = {}; - ctx.connected = false; - - var rpc = {}; + var parseMessage = function (raw) { + try { return JSON.parse(raw); } catch (e) { return; } + }; + Wire.create = function (opt, cb) { opt.constructor(function (e, service) { if (e) { return setTimeout(function () { cb(e); }); } + var rpc = {}; + + var guid = Wire.uid(); + var t = Wire.tracker({ + timeout: opt.timeout, + hook: function (txid, q, content) { + service.send(JSON.stringify({ + guid: guid, + q: q, + txid: txid, + content: content, + })); + }, + }); rpc.send = function (type, data, cb) { - var txid = uid(); - if (typeof(cb) !== 'function') { - throw new Error('expected callback'); - } - - ctx.pending[txid] = function (err, response) { - cb(err, response); - }; - - service.send(JSON.stringify({ - txid: txid, - message: { - command: type, - content: data, - }, - })); + t.call(type, data, cb); }; service.receive(function (raw) { - try { - var data = JSON.parse(raw); - var txid = data.txid; - if (!txid) { throw new Error('NO_TXID'); } - var cb = pending[txid]; - if (data.error) { return void cb(data.error); } - cb(void 0, data.content); - } catch (e) { console.error("UNHANDLED_MESSAGE", raw); } + var data = parseMessage(raw); + if (typeof(data) === 'undefined') { + return console.error("UNHANDLED_MESSAGE", raw); + } + if (!data.txid) { throw new Error('NO_TXID'); } + t.respond(data.txid, data.error, data.content); }); cb(void 0, rpc); }); }; - return Wire; }); From 12b0f3e20113fee3b4ec28c37067783aae41349e Mon Sep 17 00:00:00 2001 From: Caleb James DeLisle Date: Fri, 8 Dec 2017 14:00:53 +0100 Subject: [PATCH 04/13] Pad Not Pinned: Better CSS, moved element outside of the title element, added it in poll, better colors, tippy, and login/register in same window --- .../src/less2/include/colortheme.less | 6 +- customize.dist/src/less2/include/toolbar.less | 68 ++++++++++--------- www/common/toolbar3.js | 27 +++++--- www/poll/inner.js | 11 ++- 4 files changed, 69 insertions(+), 43 deletions(-) diff --git a/customize.dist/src/less2/include/colortheme.less b/customize.dist/src/less2/include/colortheme.less index 42cbb26b0..4f3d42584 100644 --- a/customize.dist/src/less2/include/colortheme.less +++ b/customize.dist/src/less2/include/colortheme.less @@ -46,18 +46,18 @@ @colortheme_slide-bg: #e57614; @colortheme_slide-color: #fff; -@colortheme_slide-warn: #7bccd1; +@colortheme_slide-warn: #58D697; @colortheme_code-bg: #ffae00; @colortheme_code-color: #000; -@colortheme_code-warn: #005bef; +@colortheme_code-warn: #9A37F7; @colortheme_poll-bg: #006304; @colortheme_poll-color: #fff; @colortheme_poll-help-bg: #bbffbb; @colortheme_poll-th-bg: #005bef; @colortheme_poll-th-fg: #fff; -@colortheme_poll-warn: #cd2532; +@colortheme_poll-warn: #ffae00; @colortheme_whiteboard-bg: #800080; @colortheme_whiteboard-color: #fff; diff --git a/customize.dist/src/less2/include/toolbar.less b/customize.dist/src/less2/include/toolbar.less index e97e5c7a7..14ab57e3a 100644 --- a/customize.dist/src/less2/include/toolbar.less +++ b/customize.dist/src/less2/include/toolbar.less @@ -421,10 +421,45 @@ height: @toolbar_top-height; position: relative; width: 100%; + + .cp-pad-not-pinned { + order: 4; + flex: 1; + + text-overflow: ellipsis; + overflow: hidden; + white-space: nowrap; + + align-self: center; + padding-left: 20px; + padding-right: 5px; + font-size: @colortheme_app-font-size; + color: @warn-color; + .cp-pnp-msg { + padding-left: 5px; + font-family: @colortheme_font; + font-size: @colortheme_app-font-size; + a { + font-size: @colortheme_app-font-size; + font-weight: bold; + color: @warn-color; + &:hover { + text-decoration: underline; + } + } + @media screen and (max-width: (@browser_media-not-big)) { + display: none; + } + } + @media screen and (max-width: (@browser_media-not-big)) { + overflow: visible; + max-width: 20px; + } + } .cp-toolbar-top-filler { height: @toolbar_top-height; display: inline-block; - order: 4; + order: 5; //flex: 1; } .cp-toolbar-title { @@ -504,35 +539,6 @@ padding: 5px 5px; height: 40px; } - .cp-pad-not-pinned { - text-overflow: ellipsis; - overflow: hidden; - white-space: nowrap; - - align-self: right; - padding-left: 20px; - padding-left: 5px; - font-size: @colortheme_app-font-size; - color: @warn-color; - .cp-pnp-msg { - padding-left: 5px; - a { - font-size: @colortheme_app-font-size; - font-weight: bold; - color: @warn-color; - &:hover { - text-decoration: underline; - } - } - @media screen and (max-width: (@browser_media-not-big)) { - display: none; - } - } - @media screen and (max-width: (@browser_media-not-big)) { - overflow: visible; - } - - } } .cp-toolbar-link, .cp-toolbar-new { font-size: 48px; @@ -615,7 +621,7 @@ .cp-toolbar-user { height: @toolbar_top-height; display: inline-flex; - order: 5; + order: 6; line-height: @toolbar_top-height; color: white; .cp-toolbar-new { order: 2; } diff --git a/www/common/toolbar3.js b/www/common/toolbar3.js index fc06f40f6..bb06770c4 100644 --- a/www/common/toolbar3.js +++ b/www/common/toolbar3.js @@ -731,20 +731,31 @@ define([ if (x.response[0] === true) { return; } var pnpTitle = Messages._getKey('padNotPinned', ['','','','']); var pnpMsg = Messages._getKey('padNotPinned', [ - '', + '', - '', + '', '' ]); - var msg = $('', { - 'class': 'cp-pad-not-pinned', - 'title': pnpTitle + var $msg = $('', { + 'class': 'cp-pad-not-pinned' }).append([ - $('', {'class': 'fa fa-exclamation-triangle'}), + $('', {'class': 'fa fa-exclamation-triangle', 'title': pnpTitle}), $('', {'class': 'cp-pnp-msg'}).append(pnpMsg) ]); - $('.cp-toolbar-title').append(msg); - console.log("This pad is not pinned"); + $msg.find('a.cp-pnp-login').click(function (ev) { + ev.preventDefault(); + Common.setLoginRedirect(function () { + window.parent.location = o + '/login/'; + }); + }); + $msg.find('a.cp-pnp-register').click(function (ev) { + ev.preventDefault(); + Common.setLoginRedirect(function () { + window.parent.location = o + '/register/'; + }); + }); + $('.cp-toolbar-top').append($msg); + UI.addTooltips(); }); }; diff --git a/www/poll/inner.js b/www/poll/inner.js index 5c19162d6..df193985e 100644 --- a/www/poll/inner.js +++ b/www/poll/inner.js @@ -1079,7 +1079,16 @@ define([ Title = common.createTitle(titleCfg); var configTb = { - displayed: ['title', 'useradmin', 'spinner', 'share', 'userlist', 'newpad', 'limit'], + displayed: [ + 'userlist', + 'title', + 'useradmin', + 'spinner', + 'newpad', + 'share', + 'limit', + 'unpinnedWarning' + ], title: Title.getTitleConfig(), metadataMgr: metadataMgr, readOnly: APP.readOnly, From 7a09bf43ebc32b355f19346f1a10176c4b2f7659 Mon Sep 17 00:00:00 2001 From: Caleb James DeLisle Date: Fri, 8 Dec 2017 14:46:32 +0100 Subject: [PATCH 05/13] Fix a truly silly mistake in rpc.js and make the pad-not-pinned message get removed if a registered user joins --- rpc.js | 5 ++--- www/common/toolbar3.js | 15 +++++++++++++-- 2 files changed, 15 insertions(+), 5 deletions(-) diff --git a/rpc.js b/rpc.js index 60bc00ac3..a4821524b 100644 --- a/rpc.js +++ b/rpc.js @@ -540,9 +540,8 @@ var addPinned = function ( { Env.evPinnedPadsReady.reg(() => { channelList.forEach((c) => { - const x = Env.pinnedPads[c]; - if (!x) { return; } - delete x[publicKey]; + const x = Env.pinnedPads[c] = Env.pinnedPads[c] || {}; + x[publicKey] = 1; }); cb(); }); diff --git a/www/common/toolbar3.js b/www/common/toolbar3.js index bb06770c4..ca3d1dbfd 100644 --- a/www/common/toolbar3.js +++ b/www/common/toolbar3.js @@ -719,7 +719,7 @@ define([ return $titleContainer; }; - var createUnpinnedWarning = function (toolbar, config) { + var createUnpinnedWarning0 = function (toolbar, config) { if (Common.isLoggedIn()) { return; } var pd = config.metadataMgr.getPrivateData(); var o = pd.origin; @@ -728,7 +728,11 @@ define([ var cid = Hash.hrefToHexChannelId(url); Common.sendAnonRpcMsg('IS_CHANNEL_PINNED', cid, function (x) { if (x.error || !Array.isArray(x.response)) { return void console.log(x); } - if (x.response[0] === true) { return; } + if (x.response[0] === true) { + $('.cp-pad-not-pinned').remove(); + return; + } + if ($('.cp-pad-not-pinned').length) { return; } var pnpTitle = Messages._getKey('padNotPinned', ['','','','']); var pnpMsg = Messages._getKey('padNotPinned', [ '