diff --git a/customize.dist/pages.js b/customize.dist/pages.js index e3fc17659..22e33b01b 100644 --- a/customize.dist/pages.js +++ b/customize.dist/pages.js @@ -9,7 +9,7 @@ define([ var Pages = {}; var urlArgs = Config.requireConf.urlArgs; - var setHTML = function (e, html) { + var setHTML = Pages.setHTML = function (e, html) { e.innerHTML = html; return e; }; @@ -712,11 +712,15 @@ define([ $(input).change(function () { $(mark).focus(); }); - return h('label.cp-radio', labelOpts, [ + var radio = h('label', labelOpts, [ input, mark, label ]); + + $(radio).addClass('cp-radio'); + + return radio; }; Pages['/user/'] = Pages['/user/index.html'] = function () { diff --git a/customize.dist/src/less2/include/checkmark.less b/customize.dist/src/less2/include/checkmark.less index 21d59cc19..da5a07a26 100644 --- a/customize.dist/src/less2/include/checkmark.less +++ b/customize.dist/src/less2/include/checkmark.less @@ -49,6 +49,12 @@ background-color: @colortheme_checkmark-back2; border-color: @colortheme_checkmark-back2; } + &:disabled ~ .cp-checkmark-mark { + background-color: @colortheme_checkmark-disabled; + } + &:disabled ~ .cp-checkmark-label { + color: @colortheme_checkmark-disabled; + } } } &:hover .cp-checkmark-mark { @@ -64,6 +70,12 @@ display: block; } } + &:disabled ~ .cp-checkmark-mark { + background-color: @colortheme_checkmark-disabled; + } + &:disabled ~ .cp-checkmark-label { + color: @colortheme_checkmark-disabled; + } } .cp-checkmark-label { @@ -128,6 +140,12 @@ &:checked ~ .cp-radio-mark { background-color: @colortheme_checkmark-back2; } + &:disabled ~ .cp-checkmark-mark { + background-color: @colortheme_checkmark-disabled; + } + &:disabled ~ .cp-checkmark-label { + color: @colortheme_checkmark-disabled; + } } } &:hover .cp-radio-mark { @@ -143,6 +161,12 @@ display: block; } } + &:disabled ~ .cp-checkmark-mark { + background-color: @colortheme_checkmark-disabled; + } + &:disabled ~ .cp-checkmark-label { + color: @colortheme_checkmark-disabled; + } } .cp-checkmark-label { diff --git a/customize.dist/src/less2/include/colortheme.less b/customize.dist/src/less2/include/colortheme.less index 905327685..94f91105c 100644 --- a/customize.dist/src/less2/include/colortheme.less +++ b/customize.dist/src/less2/include/colortheme.less @@ -143,3 +143,4 @@ @colortheme_checkmark-col1: @colortheme_form-color; @colortheme_checkmark-back2: @colortheme_form-bg-alt; @colortheme_checkmark-col2: @colortheme_form-color-alt; +@colortheme_checkmark-disabled: #AAA; diff --git a/customize.dist/src/less2/include/corner.less b/customize.dist/src/less2/include/corner.less new file mode 100644 index 000000000..fb8113907 --- /dev/null +++ b/customize.dist/src/less2/include/corner.less @@ -0,0 +1,123 @@ +@import (reference) "./colortheme-all.less"; + +.corner_main() { + --LessLoader_require: LessLoader_currentFile(); +}; +& { + @corner-button-ok: #2c9b00; + @corner-button-cancel: #990000; + @corner-link: #ffff7a; + + @keyframes appear { + 0% { + transform: scale(0.1); + } + 100% { + transform: scale(1.0); + } + } + @keyframes minimize { + 0% { + transform: scale(1.0); + } + 100% { + transform: scale(0.1); + } + } + + .cp-corner-container { + position: absolute; + right: 0; + bottom: 0; + width: 300px; + height: 200px; + border-top-left-radius: 200px; + padding: 15px; + text-align: right; + background-color: @colortheme_logo-1; + color: @colortheme_base; + z-index: 999; + transform-origin: bottom right; + animation: appear 0.8s ease-in-out; + box-shadow: 0 0 10px 0 @colortheme_logo-1; + //transform: scale(0.1); + //transform: scale(1); + + .cp-corner-filler { + float: left; + clear: left; + height: 21px; + } + .cp-corner-minimize, .cp-corner-maximize { + position: absolute; + height: 15px; + width: 20px; + top: 0; + right: 0; + font-size: 12px; + text-align: left; + cursor: pointer; + line-height: 15px; + display: none; + &:hover { + color: darken(@colortheme_base, 15%); + } + } + .cp-corner-minimize { + display: inline; + } + &.cp-minimized { + transition: transform 0.8s ease-in-out; + transform: scale(0.1); + animation: none; + .cp-corner-text, .cp-corner-actions, .cp-corner-footer { + display: none; + } + .cp-corner-maximize { + display: inline; + font-size: 130px; + width: 180px; + height: 200px; + line-height: 200px; + } + } + + .cp-corner-actions { + min-height: 30px; + margin: 15px auto; + display: inline-block; + } + .cp-corner-footer { + font-style: italic; + font-size: 0.8em; + a { + color: @corner-link; + &:hover { + color: darken(@corner-link, 20%); + } + } + } + + button { + color: white; + border: 0px; + padding: 5px; + color: @colortheme_base; + &.cp-corner-primary { + background-color: @corner-button-ok; + font-weight: bold; + &:hover { + background-color: lighten(@corner-button-ok, 10%); + } + } + &.cp-corner-cancel { + background-color: @corner-button-cancel; + margin-left: 10px; + &:hover { + background-color: lighten(@corner-button-cancel, 10%); + } + } + } + } +} + diff --git a/customize.dist/src/less2/include/framework.less b/customize.dist/src/less2/include/framework.less index 5caa847f4..f46018b8c 100644 --- a/customize.dist/src/less2/include/framework.less +++ b/customize.dist/src/less2/include/framework.less @@ -2,6 +2,7 @@ @import (reference) "./toolbar.less"; @import (reference) './fileupload.less'; @import (reference) './alertify.less'; +@import (reference) './corner.less'; @import (reference) './tokenfield.less'; @import (reference) './creation.less'; @import (reference) './tippy.less'; @@ -27,6 +28,7 @@ @color: @color ); .alertify_main(); + .corner_main(); .fileupload_main(); .tokenfield_main(); .tippy_main(); @@ -60,6 +62,7 @@ ); .fileupload_main(); .alertify_main(); + .corner_main(); .tippy_main(); .checkmark_main(20px); .password_main(); diff --git a/customize.dist/translations/messages.js b/customize.dist/translations/messages.js index 49351e012..1fd16f894 100644 --- a/customize.dist/translations/messages.js +++ b/customize.dist/translations/messages.js @@ -568,6 +568,14 @@ define(function () { out.settings_importConfirm = "Are you sure you want to import recent pads from this browser to your user account's CryptDrive?"; out.settings_importDone = "Import completed"; + out.settings_autostoreTitle = "Pad storage in CryptDrive"; + out.settings_autostoreHint = "Automatic pad storage results in all the pads you visit being stored in your CryptDrive.
" + + "Manual (always ask) results in the pads not being stored but a reminder will appear to ask you if you want to store them in CryptDrive.
" + + "Manual (never ask) results in the pads not being stored and option to store them will be available but in a hidden way."; + out.settings_autostoreYes = "Automatic"; + out.settings_autostoreNo = "Manual (never ask)"; + out.settings_autostoreMaybe = "Manual (always ask)"; + out.settings_userFeedbackTitle = "Feedback"; out.settings_userFeedbackHint1 = "CryptPad provides some very basic feedback to the server, to let us know how to improve your experience. "; out.settings_userFeedbackHint2 = "Your pad's content will never be shared with the server."; @@ -1231,5 +1239,16 @@ define(function () { out.sharedFolders_share = "Share this URL with other registered users to give them access to the shared folder. Once they open this URL, the shared folder will be added to the root directory of their CryptDrive."; out.chrome68 = "It seems that you're using the browser Chrome or Chromium version 68. It contains a bug resulting in the page turning completely white after a few seconds or the page being unresponsive to clicks. To fix this issue, you can switch to another tab and come back, or try to scroll in the page. This bug should be fixed in the next version of your browser."; + + // Manual pad storage popup + out.autostore_notstored = "This pad is not in your CryptDrive. Do you want to store it now?"; // XXX + out.autostore_settings = "You can enable automatic pad storage in your Settings page!"; // XXX + out.autostore_store = "Store"; + out.autostore_hide = "Don't store"; + out.autostore_error = "Unexpected error: we were unable to store this pad, please try again."; + out.autostore_saved = "The pad was successfully stored in your CryptDrive!"; + out.autostore_forceSave = "Store the file in CryptDrive"; // File upload modal + out.autostore_notAvailable = "You must store this pad in your CryptDrive before being able to use this feature."; // Properties/tags/move to trash + return out; }); diff --git a/www/common/common-interface.js b/www/common/common-interface.js index a6bc0aec3..4ec28b5f6 100644 --- a/www/common/common-interface.js +++ b/www/common/common-interface.js @@ -879,5 +879,52 @@ define([ UI.createRadio = Pages.createRadio; + UI.cornerPopup = function (text, actions, footer, startHidden) { + var minimize = h('div.cp-corner-minimize.fa.fa-window-minimize'); + var maximize = h('div.cp-corner-maximize.fa.fa-window-maximize'); + var popup = h('div.cp-corner-container', [ + minimize, + maximize, + h('div.cp-corner-filler', { style: "width:130px;" }), + h('div.cp-corner-filler', { style: "width:90px;" }), + h('div.cp-corner-filler', { style: "width:60px;" }), + h('div.cp-corner-filler', { style: "width:40px;" }), + h('div.cp-corner-filler', { style: "width:20px;" }), + h('div.cp-corner-text', text), + h('div.cp-corner-actions', actions), + Pages.setHTML(h('div.cp-corner-footer'), footer) + ]); + + $(minimize).click(function () { + $(popup).addClass('cp-minimized'); + }); + $(maximize).click(function () { + $(popup).removeClass('cp-minimized'); + }); + + if (startHidden) { + $(popup).addClass('cp-minimized'); + } + + var hide = function () { + $(popup).hide(); + }; + var show = function () { + $(popup).show(); + }; + var deletePopup = function () { + $(popup).remove(); + }; + + $('body').append(popup); + + return { + popup: popup, + hide: hide, + show: show, + delete: deletePopup + }; + }; + return UI; }); diff --git a/www/common/common-ui-elements.js b/www/common/common-ui-elements.js index fc54da947..0f8d31333 100644 --- a/www/common/common-ui-elements.js +++ b/www/common/common-ui-elements.js @@ -722,27 +722,32 @@ define([ button .click(common.prepareFeedback(type)) .click(function() { - sframeChan.query('Q_IS_ONLY_IN_SHARED_FOLDER', null, function (err, res) { - if (err || res.error) { return void console.log(err || res.error); } - var msg = Messages.forgetPrompt; - if (res) { - UI.alert(Messages.sharedFolders_forget); - return; - } else if (!common.isLoggedIn()) { - msg = Messages.fm_removePermanentlyDialog; + common.isPadStored(function (err, data) { + if (!data) { + return void UI.alert(Messages.autostore_notAvailable); } - UI.confirm(msg, function (yes) { - if (!yes) { return; } - sframeChan.query('Q_MOVE_TO_TRASH', null, function (err) { - if (err) { return void callback(err); } - var cMsg = common.isLoggedIn() ? Messages.movedToTrash : Messages.deleted; - var msg = common.fixLinks($('
').html(cMsg)); - UI.alert(msg); - callback(); + sframeChan.query('Q_IS_ONLY_IN_SHARED_FOLDER', null, function (err, res) { + if (err || res.error) { return void console.log(err || res.error); } + var msg = Messages.forgetPrompt; + if (res) { + UI.alert(Messages.sharedFolders_forget); return; + } else if (!common.isLoggedIn()) { + msg = Messages.fm_removePermanentlyDialog; + } + UI.confirm(msg, function (yes) { + if (!yes) { return; } + sframeChan.query('Q_MOVE_TO_TRASH', null, function (err) { + if (err) { return void callback(err); } + var cMsg = common.isLoggedIn() ? Messages.movedToTrash : Messages.deleted; + var msg = common.fixLinks($('
').html(cMsg)); + UI.alert(msg); + callback(); + return; + }); }); - }); + }); }); }); break; @@ -807,7 +812,14 @@ define([ title: Messages.tags_title, }) .click(common.prepareFeedback(type)) - .click(function () { UIElements.updateTags(common, null); }); + .click(function () { + common.isPadStored(function (err, data) { + if (!data) { + return void UI.alert(Messages.autostore_notAvailable); + } + UIElements.updateTags(common, null); + }); + }); break; case 'toggle': button = $('