Integrating grammar check in summernote with After the DeadlineHow do I check if an element is hidden in jQuery?How to manage a redirect request after a jQuery Ajax callSetting “checked” for a checkbox with jQuery?How to Check if element is visible after scrolling?How to check whether a checkbox is checked in jQuery?jQuery hasAttr checking to see if there is an attribute on an elementCheck if checkbox is checked with jQueryHow do I check if string contains substring?Check if element exists in jQueryHow to check a radio button with jQuery?

How to have a sharp product image?

Does tea made with boiling water cool faster than tea made with boiled (but still hot) water?

Why does nature favour the Laplacian?

Checks user level and limit the data before saving it to mongoDB

A Paper Record is What I Hamper

Is there really no use for MD5 anymore?

Relationship between strut and baselineskip

Get consecutive integer number ranges from list of int

Can we say “you can pay when the order gets ready”?

If a planet has 3 moons, is it possible to have triple Full/New Moons at once?

Which big number is bigger?

What is causing the white spot to appear in some of my pictures

How does Captain America channel this power?

Do I have an "anti-research" personality?

What is the most expensive material in the world that could be used to create Pun-Pun's lute?

Alignment of various blocks in tikz

Why must Chinese maps be obfuscated?

Critique of timeline aesthetic

Pre-plastic human skin alternative

Is it idiomatic to construct against `this`

Pulling the rope with one hand is as heavy as with two hands?

How to limit Drive Letters Windows assigns to new removable USB drives

On The Origin of Dissonant Chords

Why was the Spitfire's elliptical wing almost uncopied by other aircraft of World War 2?



Integrating grammar check in summernote with After the Deadline


How do I check if an element is hidden in jQuery?How to manage a redirect request after a jQuery Ajax callSetting “checked” for a checkbox with jQuery?How to Check if element is visible after scrolling?How to check whether a checkbox is checked in jQuery?jQuery hasAttr checking to see if there is an attribute on an elementCheck if checkbox is checked with jQueryHow do I check if string contains substring?Check if element exists in jQueryHow to check a radio button with jQuery?






.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty height:90px;width:728px;box-sizing:border-box;








6















What I want?




I am trying to integrate grammar check in Summernote Plugin using After the deadline.



What I have done so far?




As per this tutorial I downloaded the ATD Server and successfully run the server. Also successfully check grammar from a text area from my html page.



Now I started integrating it with the summernote. My reference was a plugin for CKEditor which is already integrated with ATD which is available Here. I also refer the page Add Grammar and Spell Check to Any WYSIWYG Editor



I downloaded the CKEditor plugin for ATD and modified it to work with summernote. Finally I manage to add a new plugin to summernote and there by add a custom toolbox button in summernote. Summernote plugin code below



$.extend($.summernote.plugins, 
/**
* @param Object context - context object has status of editor.
*/
'spellcheck': function (context)
var self = this;
// ui has renders to build ui elements.
// - you can create a button with `ui.button`
var ui = $.summernote.ui;
context.memo('button.spellcheck', function ()
// create button
var button = ui.button(
contents: '<img src="../../atd-ckeditor-master/images/atdbuttontr.gif" alt="">',
tooltip: 'Check spelling and grammar',
click: function ()
// invoke insertText method with 'hello' on editor module.
var $editor = context.layoutInfo.note;
var layoutInfo = context.layoutInfo;
var proofread_action = setupSummerNoteInstance($editor, this.path, layoutInfo);

);
// create jQuery object from button instance.
var $hello = button.render();
return $hello;
);

);


When user click the custom button, the data from editor, post to the grammar check server and result is returned.
I pass the summernote date to atd_core by converting data like this



var divSummer = document.createElement('div');
divSummer.innerHTML = editor.summernote('code').trim();
atd_core.markMyWords(divSummer.childNodes, results.errors);


Till this point everything is working.



Problem Area




Problem is with displaying the returned result from grammar check server with styles and suggestion context menu within summernote editor. I'm trying to map CKEditor plugin specific data bindings to summernote for the following functions(here is the whole plugin.js file of CKEditor which i refer).



var load_AtD_core = function (success) 
atd_core = new AtDCore();
/* initialize all functions that AtD/Core will require */
atd_core.map = function (array, callback)
for (var x = 0; x < array.length; x++)
callback(array[x]);

;
atd_core.hasClass = function (node, className)
return node != null && node.nodeType != 3 && CKEDITOR.dom.element.get(node).hasClass(className);
;
atd_core.contents = function (node)
if (node.$)
return node.$.childNodes;
return node.childNodes;
;
atd_core.replaceWith = function (old_node, new_node)
return new_node.replace(CKEDITOR.dom.element.get(old_node));
;
atd_core.create = function (node_html)
return CKEDITOR.dom.element.createFromHtml('<span class="mceItemHidden">' + node_html + '</span>');
;
atd_core.removeParent = function (node)
return CKEDITOR.dom.element.get(node).remove(true);
;
atd_core.remove = function (node)
return CKEDITOR.dom.element.get(node).remove(false);
;
atd_core.getAttrib = function (node, key)
return CKEDITOR.dom.element.get(node).getAttribute(key);
;
atd_core.findSpans = function (parent)
var results = [];
var elements = editor.document.getElementsByTag('span');
for (var x = 0; x < elements.count(); x++)
results.push(elements.getItem(x).$);
return results;
;
/* set options */
atd_core.showTypes('Bias Language,Cliches,Complex Expression,Diacritical Marks,Double Negatives,Hidden Verbs,Jargon Language,Passive voice,Phrases to Avoid,Redundant Expression');



here they are manipulating the CKEDITOR.dom but i'm not successful in getting the dom elements of summernote.



  1. How can i map the CKEditor dom passed to the above functions corresponds to summernote?

  2. How can i create a sugession context menu in summernote?(Is there a custom context menu in summernote?)

Have anyone already integrate ATD with summernote. All and every suggestions/alternative solutions are welcome.










share|improve this question






















  • Question: I'm not familiar with any of the plugins but, is a wysiwyg editor, right?..so...why the context menu has to be integrated? what if you develop the context menu outside all plugins?..then you can target whatever container you have and you are done...

    – Merak Marey
    Mar 15 at 20:58











  • Do a jsfiddle so we can work on it...

    – Merak Marey
    Mar 15 at 20:59











  • I tried to a jsfiddle with summernote and its plugin but cant make summernote it work on jsfiddle. may be i dont know how to do it in jsfiddle.

    – Sharon
    Mar 20 at 4:57











  • Shame, I don't think that anyone can help you then...either you do a jsfiddle or you publish the site somewhere accessible to others, this is quite complex to start from scratch. Good luck.

    – Merak Marey
    Mar 21 at 7:45

















6















What I want?




I am trying to integrate grammar check in Summernote Plugin using After the deadline.



What I have done so far?




As per this tutorial I downloaded the ATD Server and successfully run the server. Also successfully check grammar from a text area from my html page.



Now I started integrating it with the summernote. My reference was a plugin for CKEditor which is already integrated with ATD which is available Here. I also refer the page Add Grammar and Spell Check to Any WYSIWYG Editor



I downloaded the CKEditor plugin for ATD and modified it to work with summernote. Finally I manage to add a new plugin to summernote and there by add a custom toolbox button in summernote. Summernote plugin code below



$.extend($.summernote.plugins, 
/**
* @param Object context - context object has status of editor.
*/
'spellcheck': function (context)
var self = this;
// ui has renders to build ui elements.
// - you can create a button with `ui.button`
var ui = $.summernote.ui;
context.memo('button.spellcheck', function ()
// create button
var button = ui.button(
contents: '<img src="../../atd-ckeditor-master/images/atdbuttontr.gif" alt="">',
tooltip: 'Check spelling and grammar',
click: function ()
// invoke insertText method with 'hello' on editor module.
var $editor = context.layoutInfo.note;
var layoutInfo = context.layoutInfo;
var proofread_action = setupSummerNoteInstance($editor, this.path, layoutInfo);

);
// create jQuery object from button instance.
var $hello = button.render();
return $hello;
);

);


When user click the custom button, the data from editor, post to the grammar check server and result is returned.
I pass the summernote date to atd_core by converting data like this



var divSummer = document.createElement('div');
divSummer.innerHTML = editor.summernote('code').trim();
atd_core.markMyWords(divSummer.childNodes, results.errors);


Till this point everything is working.



Problem Area




Problem is with displaying the returned result from grammar check server with styles and suggestion context menu within summernote editor. I'm trying to map CKEditor plugin specific data bindings to summernote for the following functions(here is the whole plugin.js file of CKEditor which i refer).



var load_AtD_core = function (success) 
atd_core = new AtDCore();
/* initialize all functions that AtD/Core will require */
atd_core.map = function (array, callback)
for (var x = 0; x < array.length; x++)
callback(array[x]);

;
atd_core.hasClass = function (node, className)
return node != null && node.nodeType != 3 && CKEDITOR.dom.element.get(node).hasClass(className);
;
atd_core.contents = function (node)
if (node.$)
return node.$.childNodes;
return node.childNodes;
;
atd_core.replaceWith = function (old_node, new_node)
return new_node.replace(CKEDITOR.dom.element.get(old_node));
;
atd_core.create = function (node_html)
return CKEDITOR.dom.element.createFromHtml('<span class="mceItemHidden">' + node_html + '</span>');
;
atd_core.removeParent = function (node)
return CKEDITOR.dom.element.get(node).remove(true);
;
atd_core.remove = function (node)
return CKEDITOR.dom.element.get(node).remove(false);
;
atd_core.getAttrib = function (node, key)
return CKEDITOR.dom.element.get(node).getAttribute(key);
;
atd_core.findSpans = function (parent)
var results = [];
var elements = editor.document.getElementsByTag('span');
for (var x = 0; x < elements.count(); x++)
results.push(elements.getItem(x).$);
return results;
;
/* set options */
atd_core.showTypes('Bias Language,Cliches,Complex Expression,Diacritical Marks,Double Negatives,Hidden Verbs,Jargon Language,Passive voice,Phrases to Avoid,Redundant Expression');



here they are manipulating the CKEDITOR.dom but i'm not successful in getting the dom elements of summernote.



  1. How can i map the CKEditor dom passed to the above functions corresponds to summernote?

  2. How can i create a sugession context menu in summernote?(Is there a custom context menu in summernote?)

Have anyone already integrate ATD with summernote. All and every suggestions/alternative solutions are welcome.










share|improve this question






















  • Question: I'm not familiar with any of the plugins but, is a wysiwyg editor, right?..so...why the context menu has to be integrated? what if you develop the context menu outside all plugins?..then you can target whatever container you have and you are done...

    – Merak Marey
    Mar 15 at 20:58











  • Do a jsfiddle so we can work on it...

    – Merak Marey
    Mar 15 at 20:59











  • I tried to a jsfiddle with summernote and its plugin but cant make summernote it work on jsfiddle. may be i dont know how to do it in jsfiddle.

    – Sharon
    Mar 20 at 4:57











  • Shame, I don't think that anyone can help you then...either you do a jsfiddle or you publish the site somewhere accessible to others, this is quite complex to start from scratch. Good luck.

    – Merak Marey
    Mar 21 at 7:45













6












6








6








What I want?




I am trying to integrate grammar check in Summernote Plugin using After the deadline.



What I have done so far?




As per this tutorial I downloaded the ATD Server and successfully run the server. Also successfully check grammar from a text area from my html page.



Now I started integrating it with the summernote. My reference was a plugin for CKEditor which is already integrated with ATD which is available Here. I also refer the page Add Grammar and Spell Check to Any WYSIWYG Editor



I downloaded the CKEditor plugin for ATD and modified it to work with summernote. Finally I manage to add a new plugin to summernote and there by add a custom toolbox button in summernote. Summernote plugin code below



$.extend($.summernote.plugins, 
/**
* @param Object context - context object has status of editor.
*/
'spellcheck': function (context)
var self = this;
// ui has renders to build ui elements.
// - you can create a button with `ui.button`
var ui = $.summernote.ui;
context.memo('button.spellcheck', function ()
// create button
var button = ui.button(
contents: '<img src="../../atd-ckeditor-master/images/atdbuttontr.gif" alt="">',
tooltip: 'Check spelling and grammar',
click: function ()
// invoke insertText method with 'hello' on editor module.
var $editor = context.layoutInfo.note;
var layoutInfo = context.layoutInfo;
var proofread_action = setupSummerNoteInstance($editor, this.path, layoutInfo);

);
// create jQuery object from button instance.
var $hello = button.render();
return $hello;
);

);


When user click the custom button, the data from editor, post to the grammar check server and result is returned.
I pass the summernote date to atd_core by converting data like this



var divSummer = document.createElement('div');
divSummer.innerHTML = editor.summernote('code').trim();
atd_core.markMyWords(divSummer.childNodes, results.errors);


Till this point everything is working.



Problem Area




Problem is with displaying the returned result from grammar check server with styles and suggestion context menu within summernote editor. I'm trying to map CKEditor plugin specific data bindings to summernote for the following functions(here is the whole plugin.js file of CKEditor which i refer).



var load_AtD_core = function (success) 
atd_core = new AtDCore();
/* initialize all functions that AtD/Core will require */
atd_core.map = function (array, callback)
for (var x = 0; x < array.length; x++)
callback(array[x]);

;
atd_core.hasClass = function (node, className)
return node != null && node.nodeType != 3 && CKEDITOR.dom.element.get(node).hasClass(className);
;
atd_core.contents = function (node)
if (node.$)
return node.$.childNodes;
return node.childNodes;
;
atd_core.replaceWith = function (old_node, new_node)
return new_node.replace(CKEDITOR.dom.element.get(old_node));
;
atd_core.create = function (node_html)
return CKEDITOR.dom.element.createFromHtml('<span class="mceItemHidden">' + node_html + '</span>');
;
atd_core.removeParent = function (node)
return CKEDITOR.dom.element.get(node).remove(true);
;
atd_core.remove = function (node)
return CKEDITOR.dom.element.get(node).remove(false);
;
atd_core.getAttrib = function (node, key)
return CKEDITOR.dom.element.get(node).getAttribute(key);
;
atd_core.findSpans = function (parent)
var results = [];
var elements = editor.document.getElementsByTag('span');
for (var x = 0; x < elements.count(); x++)
results.push(elements.getItem(x).$);
return results;
;
/* set options */
atd_core.showTypes('Bias Language,Cliches,Complex Expression,Diacritical Marks,Double Negatives,Hidden Verbs,Jargon Language,Passive voice,Phrases to Avoid,Redundant Expression');



here they are manipulating the CKEDITOR.dom but i'm not successful in getting the dom elements of summernote.



  1. How can i map the CKEditor dom passed to the above functions corresponds to summernote?

  2. How can i create a sugession context menu in summernote?(Is there a custom context menu in summernote?)

Have anyone already integrate ATD with summernote. All and every suggestions/alternative solutions are welcome.










share|improve this question














What I want?




I am trying to integrate grammar check in Summernote Plugin using After the deadline.



What I have done so far?




As per this tutorial I downloaded the ATD Server and successfully run the server. Also successfully check grammar from a text area from my html page.



Now I started integrating it with the summernote. My reference was a plugin for CKEditor which is already integrated with ATD which is available Here. I also refer the page Add Grammar and Spell Check to Any WYSIWYG Editor



I downloaded the CKEditor plugin for ATD and modified it to work with summernote. Finally I manage to add a new plugin to summernote and there by add a custom toolbox button in summernote. Summernote plugin code below



$.extend($.summernote.plugins, 
/**
* @param Object context - context object has status of editor.
*/
'spellcheck': function (context)
var self = this;
// ui has renders to build ui elements.
// - you can create a button with `ui.button`
var ui = $.summernote.ui;
context.memo('button.spellcheck', function ()
// create button
var button = ui.button(
contents: '<img src="../../atd-ckeditor-master/images/atdbuttontr.gif" alt="">',
tooltip: 'Check spelling and grammar',
click: function ()
// invoke insertText method with 'hello' on editor module.
var $editor = context.layoutInfo.note;
var layoutInfo = context.layoutInfo;
var proofread_action = setupSummerNoteInstance($editor, this.path, layoutInfo);

);
// create jQuery object from button instance.
var $hello = button.render();
return $hello;
);

);


When user click the custom button, the data from editor, post to the grammar check server and result is returned.
I pass the summernote date to atd_core by converting data like this



var divSummer = document.createElement('div');
divSummer.innerHTML = editor.summernote('code').trim();
atd_core.markMyWords(divSummer.childNodes, results.errors);


Till this point everything is working.



Problem Area




Problem is with displaying the returned result from grammar check server with styles and suggestion context menu within summernote editor. I'm trying to map CKEditor plugin specific data bindings to summernote for the following functions(here is the whole plugin.js file of CKEditor which i refer).



var load_AtD_core = function (success) 
atd_core = new AtDCore();
/* initialize all functions that AtD/Core will require */
atd_core.map = function (array, callback)
for (var x = 0; x < array.length; x++)
callback(array[x]);

;
atd_core.hasClass = function (node, className)
return node != null && node.nodeType != 3 && CKEDITOR.dom.element.get(node).hasClass(className);
;
atd_core.contents = function (node)
if (node.$)
return node.$.childNodes;
return node.childNodes;
;
atd_core.replaceWith = function (old_node, new_node)
return new_node.replace(CKEDITOR.dom.element.get(old_node));
;
atd_core.create = function (node_html)
return CKEDITOR.dom.element.createFromHtml('<span class="mceItemHidden">' + node_html + '</span>');
;
atd_core.removeParent = function (node)
return CKEDITOR.dom.element.get(node).remove(true);
;
atd_core.remove = function (node)
return CKEDITOR.dom.element.get(node).remove(false);
;
atd_core.getAttrib = function (node, key)
return CKEDITOR.dom.element.get(node).getAttribute(key);
;
atd_core.findSpans = function (parent)
var results = [];
var elements = editor.document.getElementsByTag('span');
for (var x = 0; x < elements.count(); x++)
results.push(elements.getItem(x).$);
return results;
;
/* set options */
atd_core.showTypes('Bias Language,Cliches,Complex Expression,Diacritical Marks,Double Negatives,Hidden Verbs,Jargon Language,Passive voice,Phrases to Avoid,Redundant Expression');



here they are manipulating the CKEDITOR.dom but i'm not successful in getting the dom elements of summernote.



  1. How can i map the CKEditor dom passed to the above functions corresponds to summernote?

  2. How can i create a sugession context menu in summernote?(Is there a custom context menu in summernote?)

Have anyone already integrate ATD with summernote. All and every suggestions/alternative solutions are welcome.







jquery summernote






share|improve this question













share|improve this question











share|improve this question




share|improve this question










asked Mar 9 at 9:03









SharonSharon

40341334




40341334












  • Question: I'm not familiar with any of the plugins but, is a wysiwyg editor, right?..so...why the context menu has to be integrated? what if you develop the context menu outside all plugins?..then you can target whatever container you have and you are done...

    – Merak Marey
    Mar 15 at 20:58











  • Do a jsfiddle so we can work on it...

    – Merak Marey
    Mar 15 at 20:59











  • I tried to a jsfiddle with summernote and its plugin but cant make summernote it work on jsfiddle. may be i dont know how to do it in jsfiddle.

    – Sharon
    Mar 20 at 4:57











  • Shame, I don't think that anyone can help you then...either you do a jsfiddle or you publish the site somewhere accessible to others, this is quite complex to start from scratch. Good luck.

    – Merak Marey
    Mar 21 at 7:45

















  • Question: I'm not familiar with any of the plugins but, is a wysiwyg editor, right?..so...why the context menu has to be integrated? what if you develop the context menu outside all plugins?..then you can target whatever container you have and you are done...

    – Merak Marey
    Mar 15 at 20:58











  • Do a jsfiddle so we can work on it...

    – Merak Marey
    Mar 15 at 20:59











  • I tried to a jsfiddle with summernote and its plugin but cant make summernote it work on jsfiddle. may be i dont know how to do it in jsfiddle.

    – Sharon
    Mar 20 at 4:57











  • Shame, I don't think that anyone can help you then...either you do a jsfiddle or you publish the site somewhere accessible to others, this is quite complex to start from scratch. Good luck.

    – Merak Marey
    Mar 21 at 7:45
















Question: I'm not familiar with any of the plugins but, is a wysiwyg editor, right?..so...why the context menu has to be integrated? what if you develop the context menu outside all plugins?..then you can target whatever container you have and you are done...

– Merak Marey
Mar 15 at 20:58





Question: I'm not familiar with any of the plugins but, is a wysiwyg editor, right?..so...why the context menu has to be integrated? what if you develop the context menu outside all plugins?..then you can target whatever container you have and you are done...

– Merak Marey
Mar 15 at 20:58













Do a jsfiddle so we can work on it...

– Merak Marey
Mar 15 at 20:59





Do a jsfiddle so we can work on it...

– Merak Marey
Mar 15 at 20:59













I tried to a jsfiddle with summernote and its plugin but cant make summernote it work on jsfiddle. may be i dont know how to do it in jsfiddle.

– Sharon
Mar 20 at 4:57





I tried to a jsfiddle with summernote and its plugin but cant make summernote it work on jsfiddle. may be i dont know how to do it in jsfiddle.

– Sharon
Mar 20 at 4:57













Shame, I don't think that anyone can help you then...either you do a jsfiddle or you publish the site somewhere accessible to others, this is quite complex to start from scratch. Good luck.

– Merak Marey
Mar 21 at 7:45





Shame, I don't think that anyone can help you then...either you do a jsfiddle or you publish the site somewhere accessible to others, this is quite complex to start from scratch. Good luck.

– Merak Marey
Mar 21 at 7:45












0






active

oldest

votes












Your Answer






StackExchange.ifUsing("editor", function ()
StackExchange.using("externalEditor", function ()
StackExchange.using("snippets", function ()
StackExchange.snippets.init();
);
);
, "code-snippets");

StackExchange.ready(function()
var channelOptions =
tags: "".split(" "),
id: "1"
;
initTagRenderer("".split(" "), "".split(" "), channelOptions);

StackExchange.using("externalEditor", function()
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled)
StackExchange.using("snippets", function()
createEditor();
);

else
createEditor();

);

function createEditor()
StackExchange.prepareEditor(
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader:
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
,
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
);



);













draft saved

draft discarded


















StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f55075681%2fintegrating-grammar-check-in-summernote-with-after-the-deadline%23new-answer', 'question_page');

);

Post as a guest















Required, but never shown

























0






active

oldest

votes








0






active

oldest

votes









active

oldest

votes






active

oldest

votes















draft saved

draft discarded
















































Thanks for contributing an answer to Stack Overflow!


  • Please be sure to answer the question. Provide details and share your research!

But avoid


  • Asking for help, clarification, or responding to other answers.

  • Making statements based on opinion; back them up with references or personal experience.

To learn more, see our tips on writing great answers.




draft saved


draft discarded














StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f55075681%2fintegrating-grammar-check-in-summernote-with-after-the-deadline%23new-answer', 'question_page');

);

Post as a guest















Required, but never shown





















































Required, but never shown














Required, but never shown












Required, but never shown







Required, but never shown

































Required, but never shown














Required, but never shown












Required, but never shown







Required, but never shown







Popular posts from this blog

1928 у кіно

Захаров Федір Захарович

Ель Греко