1
0
Fork 0
mirror of https://github.com/documize/community.git synced 2025-08-05 05:25:27 +02:00

implemented inlined editing and new WYSIWYG editor skin

This commit is contained in:
Harvey Kandola 2017-02-28 17:50:03 +00:00
parent b8a0444f18
commit 5cdc2a0b3c
32 changed files with 5277 additions and 18 deletions

View file

@ -31,6 +31,10 @@ export default Ember.Component.extend(TooltipMixin, {
{ label: 'Attachment', selected: false },
{ label: 'Search', selected: false }
],
buttonId: Ember.computed('page', function () {
let page = this.get('page');
return `content-linker-button-${page.id}`;
}),
showSections: Ember.computed('tabs.@each.selected', function () {
return this.get('tabs').findBy('label', 'Section').selected;

View file

@ -56,6 +56,9 @@ export default Ember.Component.extend({
if (is.not.null(drop)) {
drop.destroy();
}
Mousetrap.unbind('esc');
Mousetrap.unbind(['ctrl+s', 'command+s']);
},
actions: {
@ -70,7 +73,7 @@ export default Ember.Component.extend({
position: "bottom right",
openOn: "always",
constrainToWindow: true,
constrainToScrollParent: false,
constrainToScrollParent: false,
tetherOptions: {
offset: "5px 0",
targetOffset: "10px 0"
@ -91,6 +94,10 @@ export default Ember.Component.extend({
return;
}
if (this.get('isDestroyed') || this.get('isDestroying')) {
return;
}
this.attrs.onAction(this.get('page.title'));
},

View file

@ -83,6 +83,10 @@ export default Ember.Component.extend(TooltipMixin, {
dragDrop: false
});
CodeMirror.commands.save = function(/*instance*/){
Mousetrap.trigger('ctrl+s');
};
this.set('codeEditor', editor);
let syntax = this.get("codeSyntax");

View file

@ -111,6 +111,10 @@ export default Ember.Component.extend(TooltipMixin, {
dragDrop: false,
extraKeys: {"Enter": "newlineAndIndentContinueMarkdownList"}
});
CodeMirror.commands.save = function(/*instance*/){
Mousetrap.trigger('ctrl+s');
};
this.set('codeEditor', editor);

View file

@ -19,6 +19,10 @@ export default Ember.Component.extend({
appMeta: service(),
link: service(),
pageBody: "",
editorId: Ember.computed('page', function () {
let page = this.get('page');
return `wysiwyg-editor-${page.id}`;
}),
didReceiveAttrs() {
this.set('pageBody', this.get('meta.rawBody'));
@ -26,13 +30,13 @@ export default Ember.Component.extend({
didInsertElement() {
let options = {
selector: "#rich-text-editor-" + this.get('page.id'),
selector: "#" + this.get('editorId'),
relative_urls: false,
cache_suffix: "?v=443",
browser_spellcheck: false,
gecko_spellcheck: false,
theme: "modern",
skin: 'charcoal',
skin: 'documize',
statusbar: false,
inline: true,
entity_encoding: "raw",
@ -49,6 +53,17 @@ export default Ember.Component.extend({
inline: 'i'
}
},
codesample_languages: [
{text: 'HTML/XML', value: 'markup'},
{text: 'JavaScript', value: 'javascript'},
{text: 'CSS', value: 'css'},
{text: 'PHP', value: 'php'},
{text: 'Ruby', value: 'ruby'},
{text: 'Python', value: 'python'},
{text: 'Java', value: 'java'},
{text: 'C', value: 'c'},
{text: 'C#', value: 'csharp'},
{text: 'C++', value: 'cpp'}],
extended_valid_elements: "b,i,b/strong,i/em",
plugins: [
'advlist autolink lists link image charmap print preview hr anchor pagebreak',
@ -78,25 +93,27 @@ export default Ember.Component.extend({
},
willDestroyElement() {
tinymce.remove();
tinymce.EditorManager.execCommand('mceRemoveEditor', true, this.get('editorId'));
},
actions: {
onInsertLink(link) {
let userSelection = tinymce.activeEditor.selection.getContent();
let editor = tinymce.EditorManager.get(this.get('editorId'));
let userSelection = editor.selection.getContent();
if (is.not.empty(userSelection)) {
Ember.set(link, 'title', userSelection);
}
let linkHTML = this.get('link').buildLink(link);
tinymce.activeEditor.insertContent(linkHTML);
editor.insertContent(linkHTML);
return true;
},
isDirty() {
return is.not.undefined(tinymce) && is.not.undefined(tinymce.activeEditor) && tinymce.activeEditor.isDirty();
let editor = tinymce.EditorManager.get(this.get('editorId'));
return is.not.undefined(tinymce) && is.not.undefined(editor) && editor.isDirty();
},
onCancel() {
@ -106,9 +123,10 @@ export default Ember.Component.extend({
onAction(title) {
let page = this.get('page');
let meta = this.get('meta');
let editor = tinymce.EditorManager.get(this.get('editorId'));
page.set('title', title);
meta.set('rawBody', tinymce.activeEditor.getContent());
meta.set('rawBody', editor.getContent());
this.attrs.onAction(page, meta);
}