230 lines
6.3 KiB
HTML
230 lines
6.3 KiB
HTML
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
|
<html xmlns="http://www.w3.org/1999/xhtml">
|
|
<head>
|
|
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
|
<link type="text/css" rel="stylesheet" href="css/note-ui.css"/>
|
|
<script type="text/javascript" src="tinymce.min.js"></script>
|
|
<script type="text/javascript" src="locale.js"></script>
|
|
<script type="text/javascript">
|
|
tinymce.init({
|
|
body_id: "zotero-tinymce-note",
|
|
content_css: "css/note-content.css",
|
|
|
|
browser_spellcheck: true,
|
|
convert_urls: false,
|
|
entity_encoding: 'raw',
|
|
fix_list_elements: true,
|
|
paste_retain_style_properties: 'all',
|
|
paste_data_images: true,
|
|
|
|
plugins: "autolink,code,contextmenu,directionality,link,lists,nonbreaking,paste,searchreplace,textcolor",
|
|
|
|
toolbar1: "bold italic underline strikethrough | subscript superscript | forecolor backcolor | removeformat | blockquote link",
|
|
toolbar2: "formatselect | alignleft aligncenter alignright | bullist numlist outdent indent | %DIR% | searchreplace",
|
|
toolbar_items_size: 'small',
|
|
menubar: false,
|
|
resize: false,
|
|
statusbar: false,
|
|
|
|
contextmenu: "cut copy paste | link | alignmentmenu | dir | code",
|
|
link_context_toolbar: true,
|
|
link_assume_external_targets: true,
|
|
nonbreaking_force_tab: 4,
|
|
|
|
// More restrictive version of default set, with JS/etc. removed
|
|
valid_elements: "@[id|class|style|title|dir<ltr?rtl|lang|xml::lang],"
|
|
+ "a[rel|rev|charset|hreflang|tabindex|accesskey|type|name|href|target|title|class],"
|
|
+ "strong/b,"
|
|
+ "em/i,"
|
|
+ "strike,"
|
|
+ "u,"
|
|
+ "#p,"
|
|
+ "-ol[type|compact],"
|
|
+ "-ul[type|compact],"
|
|
+ "-li,"
|
|
+ "br,"
|
|
+ "img[longdesc|usemap|src|border|alt=|title|hspace|vspace|width|height|align],"
|
|
+ "-sub,-sup,"
|
|
+ "-blockquote[cite],"
|
|
+ "-table[border=0|cellspacing|cellpadding|width|frame|rules|height|align|summary|bgcolor|background|bordercolor],"
|
|
+ "-tr[rowspan|width|height|align|valign|bgcolor|background|bordercolor],"
|
|
+ "tbody,thead,tfoot,"
|
|
+ "#td[colspan|rowspan|width|height|align|valign|bgcolor|background|bordercolor|scope],"
|
|
+ "#th[colspan|rowspan|width|height|align|valign|scope],"
|
|
+ "caption,"
|
|
+ "-div,"
|
|
+ "-span,"
|
|
+ "-code,"
|
|
+ "-pre,"
|
|
+ "address,"
|
|
+ "-h1,-h2,-h3,-h4,-h5,-h6,"
|
|
+ "hr[size|noshade],"
|
|
+ "-font[face|size|color],"
|
|
+ "dd,dl,dt,"
|
|
+ "cite,"
|
|
+ "abbr,"
|
|
+ "acronym,"
|
|
+ "del[datetime|cite],ins[datetime|cite],"
|
|
+ "bdo,"
|
|
+ "col[align|char|charoff|span|valign|width],colgroup[align|char|charoff|span|valign|width],"
|
|
+ "dfn,"
|
|
+ "kbd,"
|
|
+ "label[for],"
|
|
+ "legend,"
|
|
+ "q[cite],"
|
|
+ "samp,"
|
|
+ "var,",
|
|
|
|
target_list: false,
|
|
|
|
setup: function (editor) {
|
|
setLocale(editor);
|
|
|
|
// Add alignment submenu to context menu
|
|
editor.addMenuItem(
|
|
'alignmentmenu',
|
|
{
|
|
icon: 'alignleft',
|
|
text: 'Alignment',
|
|
menu: [
|
|
{
|
|
icon: 'alignleft',
|
|
text: 'Align Left',
|
|
onclick: function () {
|
|
tinyMCE.execCommand('JustifyLeft');
|
|
},
|
|
context: 'insert'
|
|
},
|
|
{
|
|
icon: 'aligncenter',
|
|
text: 'Align Center',
|
|
onclick: function () {
|
|
tinyMCE.execCommand('JustifyCenter');
|
|
},
|
|
context: 'insert'
|
|
},
|
|
{
|
|
icon: 'alignright',
|
|
text: 'Align Right',
|
|
onclick: function () {
|
|
tinyMCE.execCommand('JustifyRight');
|
|
},
|
|
context: 'insert'
|
|
},
|
|
{
|
|
icon: 'alignjustify',
|
|
text: 'Justify',
|
|
onclick: function () {
|
|
tinyMCE.execCommand('JustifyFull');
|
|
},
|
|
context: 'insert'
|
|
}
|
|
]
|
|
}
|
|
);
|
|
|
|
// Add alignment split-button menu
|
|
//
|
|
// https://codepen.io/alangill/pen/oLJAOd
|
|
//
|
|
// Not currently used, but useful if we need more toolbar space
|
|
/*editor.addButton(
|
|
'alignmentsplit', {
|
|
type: 'splitbutton',
|
|
text: '',
|
|
icon: 'alignleft',
|
|
onclick: function(e) {
|
|
tinyMCE.execCommand(this.value);
|
|
},
|
|
menu: [
|
|
{
|
|
icon: 'alignleft',
|
|
text: 'Align Left',
|
|
onclick: function() {
|
|
tinyMCE.execCommand('JustifyLeft');
|
|
this.parent().parent().icon('alignleft');
|
|
this.parent().parent().value = 'JustifyLeft';
|
|
}
|
|
},
|
|
{
|
|
icon: 'aligncenter',
|
|
text: 'Align Center',
|
|
onclick: function() {
|
|
tinyMCE.execCommand('JustifyCenter');
|
|
this.parent().parent().icon('aligncenter');
|
|
this.parent().parent().value = 'JustifyCenter';
|
|
}
|
|
},
|
|
{
|
|
icon: 'alignright',
|
|
text: 'Align Right',
|
|
onclick: function() {
|
|
tinyMCE.execCommand('JustifyRight');
|
|
this.parent().parent().icon('alignright');
|
|
this.parent().parent().value = 'JustifyRight';
|
|
}
|
|
},
|
|
{
|
|
icon: 'alignjustify',
|
|
text: 'Justify',
|
|
onclick: function() {
|
|
tinyMCE.execCommand('JustifyFull');
|
|
this.parent().parent().icon('alignjustify');
|
|
this.parent().parent().value = 'JustifyFull';
|
|
}
|
|
}
|
|
],
|
|
onPostRender: function() {
|
|
// Select the first item by default
|
|
this.value ='JustifyLeft';
|
|
}
|
|
}
|
|
);*/
|
|
|
|
// Set text direction
|
|
var dir = window.location.href.match(/dir=(ltr|rtl)/)[1];
|
|
var opDir = dir.split("").reverse().join("");
|
|
editor.settings.directionality = dir;
|
|
editor.addMenuItem('dir', {
|
|
icon: opDir,
|
|
// TODO: Show correct label based on current line
|
|
text: opDir == 'rtl' ? "Right to left" : "Left to right",
|
|
onclick: function () {
|
|
editor.execCommand('mceDirection' + opDir.toUpperCase());
|
|
},
|
|
context: 'insert',
|
|
prependToContext: true
|
|
});
|
|
},
|
|
|
|
init_instance_callback: function (editor) {
|
|
zoteroInit(editor);
|
|
|
|
['Change', 'KeyDown', 'KeyPress', 'Undo', 'Redo'].forEach(eventName =>
|
|
editor.on(eventName, event => zoteroHandleEvent(event))
|
|
);
|
|
|
|
["Cut", "Copy", "Paste"].forEach(function (command) {
|
|
let cmd = command;
|
|
editor.addCommand(command, function (ui, value) {
|
|
zoteroExecCommand(editor.getDoc(), cmd, ui, value);
|
|
});
|
|
});
|
|
|
|
["ZoteroLinkClick"].forEach(function (command) {
|
|
editor.addCommand(command, function (ui, value) {
|
|
zoteroHandleEvent({
|
|
type: command,
|
|
value
|
|
});
|
|
});
|
|
});
|
|
}
|
|
});
|
|
tinymce.execCommand("mceAddEditor", true, "tinymce");
|
|
</script>
|
|
</head>
|
|
<body>
|
|
<div id="tinymce"></div>
|
|
</body>
|
|
</html>
|