mirror of
https://github.com/ether/etherpad-lite.git
synced 2025-05-15 03:26:53 -04:00
Merge 292a3bd7b7
into 0717ac7b88
This commit is contained in:
commit
304e43f2a1
4 changed files with 207 additions and 106 deletions
|
@ -79,6 +79,23 @@ exports.dbSettings = { "filename" : path.join(exports.root, "dirty.db") };
|
|||
*/
|
||||
exports.defaultPadText = "Welcome to Etherpad Lite!\n\nThis pad text is synchronized as you type, so that everyone viewing this page sees the same text. This allows you to collaborate seamlessly on documents!\n\nEtherpad Lite on Github: http:\/\/j.mp/ep-lite\n";
|
||||
|
||||
/**
|
||||
* The toolbar buttons and order.
|
||||
*/
|
||||
exports.toolbar = {
|
||||
left: [
|
||||
["bold", "italic", "underline", "strikethrough"],
|
||||
["orderedlist", "unorderedlist", "indent", "outdent"],
|
||||
["undo", "redo"],
|
||||
["clearauthorship"]
|
||||
],
|
||||
right: [
|
||||
["importexport", "timeslider", "savedrevision"],
|
||||
["settings", "embed"],
|
||||
["showusers"]
|
||||
]
|
||||
}
|
||||
|
||||
/**
|
||||
* A flag that requires any user to have a valid session (via the api) before accessing a pad
|
||||
*/
|
||||
|
|
171
src/node/utils/toolbar.js
Normal file
171
src/node/utils/toolbar.js
Normal file
|
@ -0,0 +1,171 @@
|
|||
/**
|
||||
* The Toolbar Module creates and renders the toolbars and buttons
|
||||
*/
|
||||
|
||||
var _ = require("underscore")
|
||||
, tagAttributes
|
||||
, tag
|
||||
, defaultButtons
|
||||
, Button
|
||||
, ButtonsGroup
|
||||
, Separator
|
||||
, defaultButtonAttributes;
|
||||
|
||||
defaultButtonAttributes = function (name, overrides) {
|
||||
return {
|
||||
key: name,
|
||||
localizationId: "pad.toolbar." + name + ".title",
|
||||
icon: "buttonicon-" + name
|
||||
};
|
||||
};
|
||||
|
||||
tag = function (name, attributes, contents) {
|
||||
var aStr = tagAttributes(attributes);
|
||||
|
||||
if (contents) {
|
||||
return '<' + name + aStr + '>' + contents + '</' + name + '>';
|
||||
}
|
||||
else {
|
||||
return '<' + name + aStr + '/>';
|
||||
}
|
||||
};
|
||||
|
||||
tagAttributes = function (attributes) {
|
||||
attributes = attributes || {};
|
||||
attributes = _.reduce(attributes, function (o, val, name) {
|
||||
if (!_.isUndefined(val)) {
|
||||
o[name] = val;
|
||||
}
|
||||
return o;
|
||||
}, {});
|
||||
|
||||
return " " + _.map(attributes, function (val, name) {
|
||||
return "" + name + '="' + _.escape(val) + '"';
|
||||
}, " ");
|
||||
};
|
||||
|
||||
defaultButtons = {
|
||||
bold: defaultButtonAttributes("bold"),
|
||||
italic: defaultButtonAttributes("italic"),
|
||||
underline: defaultButtonAttributes("underline"),
|
||||
strikethrough: defaultButtonAttributes("strikethrough"),
|
||||
|
||||
orderedlist: {
|
||||
key: "insertorderedlist",
|
||||
localizationId: "pad.toolbar.ol.title",
|
||||
icon: "buttonicon-insertorderedlist"
|
||||
},
|
||||
|
||||
unorderedlist: {
|
||||
key: "insertunorderedlist",
|
||||
localizationId: "pad.toolbar.ul.title",
|
||||
icon: "buttonicon-insertunorderedlist"
|
||||
},
|
||||
|
||||
indent: defaultButtonAttributes("indent"),
|
||||
outdent: {
|
||||
key: "outdent",
|
||||
localizationId: "pad.toolbar.unindent.title",
|
||||
icon: "buttonicon-outdent"
|
||||
},
|
||||
|
||||
undo: defaultButtonAttributes("undo"),
|
||||
redo: defaultButtonAttributes("redo"),
|
||||
|
||||
clearauthorship: {
|
||||
key: "clearauthorship",
|
||||
localizationId: "pad.toolbar.clearAuthorship.title",
|
||||
icon: "buttonicon-clearauthorship"
|
||||
},
|
||||
|
||||
importexport: {
|
||||
key: "import_export",
|
||||
localizationId: "pad.toolbar.import_export.title",
|
||||
icon: "buttonicon-import_export"
|
||||
},
|
||||
|
||||
timeslider: {
|
||||
onclick: "document.location = document.location.pathname + '/timeslider'",
|
||||
localizationId: "pad.toolbar.timeslider.title",
|
||||
icon: "buttonicon-history"
|
||||
},
|
||||
|
||||
savedrevision: defaultButtonAttributes("savedRevision"),
|
||||
settings: defaultButtonAttributes("settings"),
|
||||
embed: defaultButtonAttributes("embed"),
|
||||
showusers: defaultButtonAttributes("showusers")
|
||||
};
|
||||
|
||||
ButtonsGroup = function () {
|
||||
this.buttons = [];
|
||||
};
|
||||
|
||||
ButtonsGroup.fromArray = function (array) {
|
||||
var btnGroup = new ButtonsGroup();
|
||||
_.each(array, function (btnName) {
|
||||
var b = new Button(defaultButtons[btnName]);
|
||||
btnGroup.addButton(b);
|
||||
});
|
||||
return btnGroup;
|
||||
};
|
||||
|
||||
ButtonsGroup.prototype.addButton = function (button) {
|
||||
this.buttons.push(button);
|
||||
return this;
|
||||
};
|
||||
|
||||
ButtonsGroup.prototype.render = function () {
|
||||
if (this.buttons.length == 1) {
|
||||
this.buttons[0].grouping = "";
|
||||
}
|
||||
else {
|
||||
_.first(this.buttons).grouping = "grouped-left";
|
||||
_.last(this.buttons).grouping = "grouped-right";
|
||||
_.each(this.buttons.slice(1, -1), function (btn) {
|
||||
btn.grouping = "grouped-middle"
|
||||
});
|
||||
}
|
||||
|
||||
return _.map(this.buttons, function (btn) {
|
||||
return btn.render();
|
||||
}).join("\n");
|
||||
};
|
||||
|
||||
Button = function (attributes) {
|
||||
this.attributes = attributes;
|
||||
|
||||
|
||||
};
|
||||
|
||||
_.extend(Button.prototype, {
|
||||
grouping: "",
|
||||
|
||||
render: function () {
|
||||
var liAttributes = {
|
||||
"data-key": this.attributes.key,
|
||||
"onclick": this.attributes.onclick
|
||||
};
|
||||
return tag("li", liAttributes,
|
||||
tag("a", { "class": this.grouping, "data-l10n-id": this.attributes.localizationId },
|
||||
tag("span", { "class": "buttonicon " + this.attributes.icon })
|
||||
)
|
||||
);
|
||||
}
|
||||
});
|
||||
|
||||
Separator = function () {};
|
||||
Separator.prototype.render = function () {
|
||||
return tag("li", { "class": "separator"});
|
||||
};
|
||||
|
||||
module.exports = {
|
||||
separator: function () {
|
||||
return (new Separator).render();
|
||||
},
|
||||
menu: function (buttons) {
|
||||
var groups = _.map(buttons, function (group) {
|
||||
return ButtonsGroup.fromArray(group).render();
|
||||
});
|
||||
return groups.join(this.separator());
|
||||
}
|
||||
};
|
|
@ -1,6 +1,7 @@
|
|||
<%
|
||||
var settings = require("ep_etherpad-lite/node/utils/Settings")
|
||||
, langs = require("ep_etherpad-lite/node/hooks/i18n").availableLangs
|
||||
, toolbar = require("ep_etherpad-lite/node/utils/toolbar");
|
||||
%>
|
||||
<!doctype html>
|
||||
<% e.begin_block("htmlHead"); %>
|
||||
|
@ -54,103 +55,15 @@
|
|||
<div id="overlay">
|
||||
<div id="overlay-inner"></div>
|
||||
</div>
|
||||
|
||||
<ul class="menu_left">
|
||||
<% e.begin_block("editbarMenuLeft"); %>
|
||||
<li class="acl-write" id="bold" data-key="bold">
|
||||
<a class="grouped-left" data-l10n-id="pad.toolbar.bold.title">
|
||||
<span class="buttonicon buttonicon-bold"></span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="acl-write" id="italic" data-key="italic">
|
||||
<a class="grouped-middle" data-l10n-id="pad.toolbar.italic.title">
|
||||
<span class="buttonicon buttonicon-italic"></span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="acl-write" id="underline" data-key="underline">
|
||||
<a class="grouped-middle" data-l10n-id="pad.toolbar.underline.title">
|
||||
<span class="buttonicon buttonicon-underline"></span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="acl-write" id="strikethrough" data-key="strikethrough">
|
||||
<a class="grouped-right" data-l10n-id="pad.toolbar.strikethrough.title">
|
||||
<span class="buttonicon buttonicon-strikethrough"></span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="acl-write separator"></li>
|
||||
<li class="acl-write" id="oderedlist" data-key="insertorderedlist">
|
||||
<a class="grouped-left" data-l10n-id="pad.toolbar.ol.title">
|
||||
<span class="buttonicon buttonicon-insertorderedlist"></span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="acl-write" id="unoderedlist" data-key="insertunorderedlist">
|
||||
<a class="grouped-middle" data-l10n-id="pad.toolbar.ul.title">
|
||||
<span class="buttonicon buttonicon-insertunorderedlist"></span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="acl-write" id="indent" data-key="indent">
|
||||
<a class="grouped-middle" data-l10n-id="pad.toolbar.indent.title">
|
||||
<span class="buttonicon buttonicon-indent"></span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="acl-write" id="outdent" data-key="outdent">
|
||||
<a class="grouped-right" data-l10n-id="pad.toolbar.unindent.title">
|
||||
<span class="buttonicon buttonicon-outdent"></span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="acl-write separator"></li>
|
||||
<li class="acl-write" id="undo" data-key="undo">
|
||||
<a class="grouped-left" data-l10n-id="pad.toolbar.undo.title">
|
||||
<span class="buttonicon buttonicon-undo"></span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="acl-write" id="redo" data-key="redo">
|
||||
<a class="grouped-right" data-l10n-id="pad.toolbar.redo.title">
|
||||
<span class="buttonicon buttonicon-redo"></span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="acl-write separator"></li>
|
||||
<li class="acl-write" id="clearAuthorship" data-key="clearauthorship">
|
||||
<a data-l10n-id="pad.toolbar.clearAuthorship.title">
|
||||
<span class="buttonicon buttonicon-clearauthorship"></span>
|
||||
</a>
|
||||
</li>
|
||||
<%- toolbar.menu(settings.toolbar.left) %>
|
||||
<% e.end_block(); %>
|
||||
</ul>
|
||||
<ul class="menu_right">
|
||||
<% e.begin_block("editbarMenuRight"); %>
|
||||
<li data-key="import_export">
|
||||
<a class="grouped-left" id="importexportlink" data-l10n-id="pad.toolbar.import_export.title">
|
||||
<span class="buttonicon buttonicon-import_export"></span>
|
||||
</a>
|
||||
</li>
|
||||
<li onClick="document.location = document.location.pathname+ '/timeslider'">
|
||||
<a id="timesliderlink" class="grouped-middle" data-l10n-id="pad.toolbar.timeslider.title">
|
||||
<span class="buttonicon buttonicon-history"></span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="acl-write" data-key="savedRevision">
|
||||
<a class="grouped-right" id="revisionlink" data-l10n-id="pad.toolbar.savedRevision.title">
|
||||
<span class="buttonicon buttonicon-savedRevision"></span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="acl-write separator"></li>
|
||||
<li class="acl-write" data-key="settings">
|
||||
<a class="grouped-left" id="settingslink" data-l10n-id="pad.toolbar.settings.title">
|
||||
<span class="buttonicon buttonicon-settings"></span>
|
||||
</a>
|
||||
</li>
|
||||
<li data-key="embed">
|
||||
<a class="grouped-right" id="embedlink" data-l10n-id="pad.toolbar.embed.title">
|
||||
<span class="grouped-right buttonicon buttonicon-embed"></span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="separator"></li>
|
||||
<li id="usericon" data-key="showusers">
|
||||
<a data-l10n-id="pad.toolbar.showusers.title">
|
||||
<span class="buttonicon buttonicon-showusers"></span>
|
||||
<span id="online_count">1</span>
|
||||
</a>
|
||||
</li>
|
||||
<%- toolbar.menu(settings.toolbar.right) %>
|
||||
<% e.end_block(); %>
|
||||
</ul>
|
||||
</div>
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue