Merge branch 'usability5' of github.com:xwiki-labs/cryptpad into staging
commit
a8612ed1c7
|
@ -105,6 +105,34 @@
|
|||
}
|
||||
}
|
||||
|
||||
.cryptpad-toolbar-top {
|
||||
display: block;
|
||||
text-align: center;
|
||||
.cryptpad-title {
|
||||
text-align: center;
|
||||
input {
|
||||
border: 1px solid black;
|
||||
background: #fff;
|
||||
cursor: auto;
|
||||
width: 300px;
|
||||
padding: 5px;
|
||||
-webkit-touch-callout: text;
|
||||
-webkit-user-select: text;
|
||||
-khtml-user-select: text;
|
||||
-moz-user-select: text;
|
||||
-ms-user-select: text;
|
||||
user-select: text;
|
||||
&:focus {
|
||||
-webkit-touch-callout: text;
|
||||
-webkit-user-select: text;
|
||||
-khtml-user-select: text;
|
||||
-moz-user-select: text;
|
||||
-ms-user-select: text;
|
||||
user-select: text;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.cryptpad-toolbar-leftside {
|
||||
float: left;
|
||||
margin-bottom: -1px;
|
||||
|
|
|
@ -101,6 +101,34 @@
|
|||
border: 1px solid #A6A6A6;
|
||||
border-bottom-color: #979797;
|
||||
}
|
||||
.cryptpad-toolbar-top {
|
||||
display: block;
|
||||
text-align: center;
|
||||
}
|
||||
.cryptpad-toolbar-top .cryptpad-title {
|
||||
text-align: center;
|
||||
}
|
||||
.cryptpad-toolbar-top .cryptpad-title input {
|
||||
border: 1px solid black;
|
||||
background: #fff;
|
||||
cursor: auto;
|
||||
width: 300px;
|
||||
padding: 5px;
|
||||
-webkit-touch-callout: text;
|
||||
-webkit-user-select: text;
|
||||
-khtml-user-select: text;
|
||||
-moz-user-select: text;
|
||||
-ms-user-select: text;
|
||||
user-select: text;
|
||||
}
|
||||
.cryptpad-toolbar-top .cryptpad-title input:focus {
|
||||
-webkit-touch-callout: text;
|
||||
-webkit-user-select: text;
|
||||
-khtml-user-select: text;
|
||||
-moz-user-select: text;
|
||||
-ms-user-select: text;
|
||||
user-select: text;
|
||||
}
|
||||
.cryptpad-toolbar-leftside {
|
||||
float: left;
|
||||
margin-bottom: -1px;
|
||||
|
|
|
@ -619,6 +619,32 @@ define([
|
|||
/*
|
||||
* Buttons
|
||||
*/
|
||||
var renamePad = common.renamePad = function (title, callback) {
|
||||
if (title === null) { return; }
|
||||
|
||||
common.causesNamingConflict(title, function (err, conflicts) {
|
||||
if (err) {
|
||||
console.log("Unable to determine if name caused a conflict");
|
||||
console.error(err);
|
||||
callback(err, title);
|
||||
return;
|
||||
}
|
||||
|
||||
if (conflicts) {
|
||||
common.alert(Messages.renameConflict);
|
||||
return;
|
||||
}
|
||||
|
||||
common.setPadTitle(title, function (err, data) {
|
||||
if (err) {
|
||||
console.log("unable to set pad title");
|
||||
console.log(err);
|
||||
return;
|
||||
}
|
||||
callback(null, title);
|
||||
});
|
||||
});
|
||||
};
|
||||
var createButton = common.createButton = function (type, rightside, data, callback) {
|
||||
var button;
|
||||
var size = "17px";
|
||||
|
@ -657,33 +683,9 @@ define([
|
|||
button.click(function() {
|
||||
var suggestion = suggestName();
|
||||
|
||||
common.prompt(Messages.renamePrompt,
|
||||
suggestion, function (title, ev) {
|
||||
if (title === null) { return; }
|
||||
|
||||
common.causesNamingConflict(title, function (err, conflicts) {
|
||||
if (err) {
|
||||
console.log("Unable to determine if name caused a conflict");
|
||||
console.error(err);
|
||||
callback(err, title);
|
||||
return;
|
||||
}
|
||||
|
||||
if (conflicts) {
|
||||
common.alert(Messages.renameConflict);
|
||||
return;
|
||||
}
|
||||
|
||||
common.setPadTitle(title, function (err, data) {
|
||||
if (err) {
|
||||
console.log("unable to set pad title");
|
||||
console.log(err);
|
||||
return;
|
||||
}
|
||||
callback(null, title);
|
||||
});
|
||||
});
|
||||
});
|
||||
common.prompt(Messages.renamePrompt, suggestion, function (title, ev) {
|
||||
renamePad(title, callback);
|
||||
});
|
||||
});
|
||||
}
|
||||
break;
|
||||
|
|
|
@ -17,6 +17,7 @@ define([
|
|||
/** The toolbar class which contains the user list, debug link and lag. */
|
||||
var TOOLBAR_CLS = Bar.constants.toolbar = 'cryptpad-toolbar';
|
||||
|
||||
var TOP_CLS = Bar.constants.top = 'cryptpad-toolbar-top';
|
||||
var LEFTSIDE_CLS = Bar.constants.leftside = 'cryptpad-toolbar-leftside';
|
||||
var RIGHTSIDE_CLS = Bar.constants.rightside = 'cryptpad-toolbar-rightside';
|
||||
|
||||
|
@ -34,6 +35,7 @@ define([
|
|||
var VIEWSHARE_CLS = Bar.constants.viewShare = "cryptpad-dropdown-viewShare";
|
||||
var DROPDOWN_CONTAINER_CLS = Bar.constants.dropdownContainer = "cryptpad-dropdown-container";
|
||||
var DROPDOWN_CLS = Bar.constants.dropdown = "cryptpad-dropdown";
|
||||
var TITLE_CLS = Bar.constants.title = "cryptpad-title";
|
||||
|
||||
/** Key in the localStore which indicates realtime activity should be disallowed. */
|
||||
// TODO remove? will never be used in cryptpad
|
||||
|
@ -67,6 +69,7 @@ define([
|
|||
'class': TOOLBAR_CLS,
|
||||
id: uid(),
|
||||
})
|
||||
.append($('<div>', {'class': TOP_CLS}))
|
||||
.append($('<div>', {'class': LEFTSIDE_CLS}))
|
||||
.append($('<div>', {'class': RIGHTSIDE_CLS}));
|
||||
|
||||
|
@ -300,6 +303,36 @@ define([
|
|||
$(lagElement).append(lagLight);
|
||||
};
|
||||
|
||||
var createTitle = function ($container, readOnly, cb) {
|
||||
var $titleContainer = $('<span>', {
|
||||
id: 'toolbarTitle',
|
||||
'class': TITLE_CLS
|
||||
}).appendTo($container);
|
||||
var $text = $('<span>').appendTo($titleContainer);
|
||||
if (readOnly === 1) { return; }
|
||||
var $input = $('<input>', {
|
||||
type: 'text'
|
||||
}).appendTo($titleContainer).hide();
|
||||
$input.on('keyup', function (e) {
|
||||
if (e.which === 13) {
|
||||
Cryptpad.renamePad(title, function (err, newtitle) {
|
||||
if (err) { return; }
|
||||
$text.text(newtitle);
|
||||
cb(null, newtitle);
|
||||
$input.hide();
|
||||
$text.show();
|
||||
});
|
||||
}
|
||||
});
|
||||
$text.on('click', function () {
|
||||
console.log('click');
|
||||
$text.hide();
|
||||
$input.val($text.text());
|
||||
$input.show();
|
||||
$input.focus();
|
||||
});
|
||||
};
|
||||
|
||||
var create = Bar.create = function ($container, myUserName, realtime, getLag, userList, config) {
|
||||
var readOnly = (typeof config.readOnly !== "undefined") ? (config.readOnly ? 1 : 0) : -1;
|
||||
|
||||
|
@ -307,6 +340,7 @@ define([
|
|||
var userListElement = createUserList(toolbar.find('.' + LEFTSIDE_CLS), readOnly);
|
||||
var spinner = createSpinner(toolbar.find('.' + RIGHTSIDE_CLS));
|
||||
var lagElement = createLagElement(toolbar.find('.' + RIGHTSIDE_CLS));
|
||||
var $titleElement = createTitle(toolbar.find('.' + TOP_CLS), readOnly, config.onRename);
|
||||
var userData = config.userData;
|
||||
// readOnly = 1 (readOnly enabled), 0 (disabled), -1 (old pad without readOnly mode)
|
||||
var saveElement;
|
||||
|
|
|
@ -85,11 +85,12 @@ define([
|
|||
});
|
||||
|
||||
editor.on('instanceReady', function (Ckeditor) {
|
||||
var $bar = $('#pad-iframe')[0].contentWindow.$('#cke_1_toolbox');
|
||||
|
||||
if (readOnly) {
|
||||
$('#pad-iframe')[0].contentWindow.$('#cke_1_toolbox > .cke_toolbar').hide();
|
||||
}
|
||||
|
||||
|
||||
/* add a class to the magicline plugin so we can pick it out more easily */
|
||||
|
||||
var ml = $('iframe')[0].contentWindow.CKEDITOR.instances.editor1.plugins.magicline
|
||||
|
@ -403,6 +404,7 @@ define([
|
|||
document.title = oldTitle;
|
||||
return;
|
||||
}
|
||||
$bar.find('.' + Toolbar.constants.title).find('span').text(newTitle);
|
||||
});
|
||||
};
|
||||
|
||||
|
@ -513,13 +515,19 @@ define([
|
|||
realtimeOptions.onLocal();
|
||||
};
|
||||
|
||||
var renameCb = function (err, title) {
|
||||
if (err) { return; }
|
||||
document.title = title;
|
||||
editor.fire('change');
|
||||
};
|
||||
|
||||
var onInit = realtimeOptions.onInit = function (info) {
|
||||
var $bar = $('#pad-iframe')[0].contentWindow.$('#cke_1_toolbox');
|
||||
toolbarList = info.userList;
|
||||
var config = {
|
||||
userData: userList,
|
||||
readOnly: readOnly,
|
||||
ifrw: ifrw
|
||||
ifrw: ifrw,
|
||||
onRename: renameCb
|
||||
};
|
||||
if (readOnly) {delete config.changeNameID; }
|
||||
toolbar = info.realtime.toolbar = Toolbar.create($bar, info.myID, info.realtime, info.getLag, info.userList, config);
|
||||
|
@ -555,11 +563,6 @@ define([
|
|||
$rightside.append($import);
|
||||
|
||||
/* add a rename button */
|
||||
var renameCb = function (err, title) {
|
||||
if (err) { return; }
|
||||
document.title = title;
|
||||
editor.fire('change');
|
||||
};
|
||||
var $setTitle = Cryptpad.createButton('rename', true, {suggestName: suggestName}, renameCb);
|
||||
$rightside.append($setTitle);
|
||||
}
|
||||
|
@ -594,13 +597,8 @@ define([
|
|||
console.log("Couldn't get pad title");
|
||||
return;
|
||||
}
|
||||
updateTitle(title || info.channel.slice(0, 8));
|
||||
document.title = title || info.channel.slice(0, 8);
|
||||
Cryptpad.setPadTitle(title, function (err, data) {
|
||||
if (err) {
|
||||
console.log("Couldn't remember pad");
|
||||
console.error(err);
|
||||
}
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
|
|
Loading…
Reference in New Issue