infra
/
cryptpad
2
1
Fork 0
Code Issues Pull Requests Projects Releases 1 Activity

Update rich text app structure to add a comments container

Browse Source
pull/1/head
yflory 5 years ago
parent fa1e15e7d8
commit 9d03d0effb
4 changed files with 58 additions and 57 deletions
Show Stats Download Patch File Download Diff File

37
www/pad/app-pad.less
Unescape Escape View File

@ -7,10 +7,21 @@ body.cp-app-pad {
@color: @colortheme_pad-color @color: @colortheme_pad-color
); );
#cke_1_top { @bg-color: #e3e3e3;
overflow: visible;
padding: 0px; display: flex;
flex-flow: column;
max-height: 100%;
min-height: auto;
#cp-app-pad-editor {
flex: 1;
display: flex;
flex-flow: row;
height: 100%;
overflow: hidden;
} }
.cke_toolbox_main { .cke_toolbox_main {
background-color: @colortheme_pad-toolbar-bg; background-color: @colortheme_pad-toolbar-bg;
.cke_toolbar { .cke_toolbar {
@ -36,20 +47,38 @@ body.cp-app-pad {
flex-flow: column; flex-flow: column;
height: 100%; height: 100%;
border: 0; border: 0;
flex: 1;
> .cke_inner { > .cke_inner {
overflow: hidden; overflow: hidden;
flex: 1; flex: 1;
position: unset; position: unset;
display: flex; display: flex;
flex-flow: column;
margin-top: -1px; margin-top: -1px;
}
#cke_1_top {
display: none;
}
}
#cke_1_contents { #cke_1_contents {
flex: 1; flex: 1;
display: flex; display: flex;
flex-flow: column;
height: auto !important; height: auto !important;
background-color: @bg-color;
justify-content: center;
iframe { iframe {
flex: 1; flex: 1;
min-width: 0;
} }
#cp-app-pad-comments {
width: 400px;
background-color: white;
margin: 30px;
}
&.cke_body_width {
iframe {
margin: 0 30px;
max-width: 800px;
} }
} }
} }

4
www/pad/comments.js
Unescape Escape View File

@ -30,7 +30,7 @@ define([
var uid; var uid;
existing.some(function (id) { existing.some(function (id) {
var author = Env.comments.authors[id] || {}; var author = Env.comments.authors[id] || {};
if (author.curvePublic !== curvePublic) { return; } if (author.curvePublic !== curve) { return; }
uid = Number(id); uid = Number(id);
return true; return true;
}); });
@ -76,7 +76,7 @@ define([
}; };
var md = Util.clone(Env.metadataMgr.getMetadata()); var md = Util.clone(Env.metadataMgr.getMetadata());
md.comments = Util.clone(Env.comments); md.comments = Util.clone(Env.comments);
metadataMgr.updateMetadata(md); Env.metadataMgr.updateMetadata(md);
addMark(); addMark();

4
www/pad/inner.html
Unescape Escape View File

@ -42,7 +42,11 @@
</style> </style>
</head> </head>
<body class="cp-app-pad"> <body class="cp-app-pad">
<div id="cp-app-pad-toolbar" class="cp-toolbar-container"></div>
<div id="cp-app-pad-editor">
<textarea style="display:none" id="editor1" name="editor1"></textarea> <textarea style="display:none" id="editor1" name="editor1"></textarea>
<div id="cp-app-pad-comments"></div>
</div>
</body> </body>
</html> </html>

56
www/pad/inner.js
Unescape Escape View File

@ -440,9 +440,8 @@ define([
var andThen2 = function (editor, Ckeditor, framework) { var andThen2 = function (editor, Ckeditor, framework) {
var mediaTagMap = {}; var mediaTagMap = {};
var $bar = $('#cke_1_toolbox');
var $contentContainer = $('#cke_1_contents'); var $contentContainer = $('#cke_1_contents');
var $html = $bar.closest('html'); var $html = $('html');
var $faLink = $html.find('head link[href*="/bower_components/components-font-awesome/css/font-awesome.min.css"]'); var $faLink = $html.find('head link[href*="/bower_components/components-font-awesome/css/font-awesome.min.css"]');
if ($faLink.length) { if ($faLink.length) {
$html.find('iframe').contents().find('head').append($faLink.clone()); $html.find('iframe').contents().find('head').append($faLink.clone());
@ -494,30 +493,10 @@ define([
framework: framework, framework: framework,
metadataMgr: metadataMgr, metadataMgr: metadataMgr,
common: common, common: common,
editor: editor editor: editor,
container: $('#cp-app-pad-comments')[0]
}); });
editor.plugins.comments.addComment = function (uid, cb) {
if (!comments) {
comments = Util.clone(COMMENTS);
}
// XXX display input
UI.prompt("Message", "", function (val) {
if (!val) { return; }
if (!editor.getSelection().getSelectedText()) {
// text has been deleted by another user while we were typing our comment?
return void UI.warn(Messages.error);
}
var myId = updateAuthorData();
comments.messages[uid] = {
user: myId,
time: +new Date(),
message: val
};
cb();
});
};
var onLinkClicked = function (e) { var onLinkClicked = function (e) {
var $target = $(e.target); var $target = $(e.target);
if (!$target.is('a')) { return; } if (!$target.is('a')) { return; }
@ -717,7 +696,6 @@ define([
return hjson; return hjson;
}); });
$bar.find('#cke_1_toolbar_collapser').hide();
if (!framework.isReadOnly()) { if (!framework.isReadOnly()) {
addToolbarHideBtn(framework, $contentContainer); addToolbarHideBtn(framework, $contentContainer);
} else { } else {
@ -776,7 +754,7 @@ define([
framework._.sfCommon.getAttribute(['pad', 'width'], function (err, data) { framework._.sfCommon.getAttribute(['pad', 'width'], function (err, data) {
var active = data || typeof(data) === "undefined"; var active = data || typeof(data) === "undefined";
if (active) { if (active) {
$iframe.find('html').addClass('cke_body_width'); $contentContainer.addClass('cke_body_width');
} }
var $width = framework._.sfCommon.createButton('', true, { var $width = framework._.sfCommon.createButton('', true, {
icon: 'fa-arrows-h', icon: 'fa-arrows-h',
@ -784,9 +762,9 @@ define([
name: "pad-width", name: "pad-width",
},function () { },function () {
if (active) { if (active) {
$iframe.find('html').removeClass('cke_body_width'); $contentContainer.removeClass('cke_body_width');
} else { } else {
$iframe.find('html').addClass('cke_body_width'); $contentContainer.addClass('cke_body_width');
} }
active = !active; active = !active;
var key = active ? Messages.pad_useFullWidth : Messages.pad_usePageWidth; var key = active ? Messages.pad_useFullWidth : Messages.pad_usePageWidth;
@ -959,8 +937,8 @@ define([
nThen(function (waitFor) { nThen(function (waitFor) {
Framework.create({ Framework.create({
toolbarContainer: '#cke_1_toolbox', toolbarContainer: '#cp-app-pad-toolbar',
contentContainer: '#cke_editor1 > .cke_inner', contentContainer: '#cp-app-pad-editor',
patchTransformer: ChainPad.NaiveJSONTransformer, patchTransformer: ChainPad.NaiveJSONTransformer,
/*thumbnail: { /*thumbnail: {
getContainer: function () { return $('iframe').contents().find('html')[0]; }, getContainer: function () { return $('iframe').contents().find('html')[0]; },
@ -1004,14 +982,6 @@ define([
} }
// Used in ckeditor-config.js // Used in ckeditor-config.js
Ckeditor.CRYPTPAD_URLARGS = ApiConfig.requireConf.urlArgs; Ckeditor.CRYPTPAD_URLARGS = ApiConfig.requireConf.urlArgs;
var backColor = AppConfig.appBackgroundColor;
var newCss = '.cke_body_width { background: '+ backColor +'; height: 100%; overflow: auto;}' +
'.cke_body_width body {' +
'max-width: 50em; padding: 20px 30px; margin: 0 auto; min-height: 100%;'+
'box-sizing: border-box; overflow: auto;'+
'}' +
'.cke_body_width body > *:first-child { margin-top: 0; }';
Ckeditor.addCss(newCss);
Ckeditor._mediatagTranslations = { Ckeditor._mediatagTranslations = {
title: Messages.pad_mediatagTitle, title: Messages.pad_mediatagTitle,
width: Messages.pad_mediatagWidth, width: Messages.pad_mediatagWidth,
@ -1037,13 +1007,11 @@ define([
Links.addSupportForOpeningLinksInNewTab(Ckeditor)({editor: editor}); Links.addSupportForOpeningLinksInNewTab(Ckeditor)({editor: editor});
}).nThen(function () { }).nThen(function () {
// Move ckeditor parts to have a structure like the other apps // Move ckeditor parts to have a structure like the other apps
var $toolbarContainer = $('#cke_1_top');
var $contentContainer = $('#cke_1_contents'); var $contentContainer = $('#cke_1_contents');
var $mainContainer = $('#cke_editor1'); var $mainContainer = $('#cke_editor1 > .cke_inner');
$contentContainer.prepend($toolbarContainer.find('.cke_toolbox_main')); var $ckeToolbar = $('#cke_1_top').find('.cke_toolbox_main');
$mainContainer.prepend($toolbarContainer); $mainContainer.prepend($ckeToolbar.addClass('cke_reset_all'));
$contentContainer.find('.cke_toolbox_main').addClass('cke_reset_all'); $contentContainer.append(h('div#cp-app-pad-comments'));
$toolbarContainer.removeClass('cke_reset_all');
}).nThen(waitFor()); }).nThen(waitFor());
}).nThen(function (/*waitFor*/) { }).nThen(function (/*waitFor*/) {

Write Preview
Loading…
Cancel
Save