mizzao / meteor-sharejs

Meteor smart package for transparently adding ShareJS editors to an app
MIT License
225 stars 53 forks source link

How to use Ace extensions? #64

Closed edemaine closed 8 years ago

edemaine commented 8 years ago

I'd like to use the ace/ext/spellcheck extension. It seems to be included in the package (it's in .meteor/local/build/programs/web.browser/packages/mizzao_sharejs-ace/ace-builds/src/ext-spellcheck.js). But I'm not sure how to trigger its use. The following CoffeeScript does not seem to work:

Meteor.startup ->
  ace.require 'ace/ext/spellcheck'

The way it's supposed to work is, in the config helper, write

editor.setOption 'spellcheck', true

But this results in the error misspelled option "spellcheck" from Ace.

DavidSichau commented 8 years ago

Hi could you provide me with a small example app, such that I can try it out.

edemaine commented 8 years ago

Sure, here you go. Look for the misspelled option "spellcheck" in the JavaScript console.

test.coffee

if Meteor.isClient
  Meteor.startup ->
    ace.require 'ace/ext/spellcheck'

  Template.registerHelper 'config', -> (editor) ->
    editor.setOption 'spellcheck', true

test.html

<body>
{{> sharejsAce docid='test' onRender=config}}
</body>

test.css

.ace_editor { width: 100%; height: 20em; }

Packages: meteor add coffeescript mizzao:sharejs mizzao:sharejs-ace

DavidSichau commented 8 years ago

I also did it not get to work. I also find very little documentation about this extensions. I wonder if this is actually what you want:

https://github.com/ajaxorg/ace/issues/2107

This only provides spell checking via the browser context menu. There is another example that seems to be more reasonable:

https://github.com/mcasperson/ace-editor-expirments/blob/master/ace-spellcheck/ace.html

edemaine commented 8 years ago

Yes, exactly, I was trying to get spellchecking via the browser context menu, as described in https://github.com/ajaxorg/ace/issues/2107 The code is here: https://github.com/ajaxorg/ace-builds/blob/master/src/ext-spellcheck.js The first line suggests that "ace/ext/spellcheck" is indeed the module's name... I'm trying to avoid included an entire dictionary in my project, which is what your latter link does.

DavidSichau commented 8 years ago

@edemaine I found a way to include the script.

Add somewhere in your template the following code:

<script src="/packages/mizzao_sharejs-ace/ace-builds/src/ext-spellcheck.js"></script>

This loads the extension and I do not see the error of the misspelling. However I do not find any changes in the context menu.

jeremywrnr commented 8 years ago

I encountered a similar problem (wanted to use Ace's mode extenstions). At first, sourcing the script as @DavidSichau suggests worked for me, but then I ran meteor update, and I had to move sourcing it from the <head> to the <body>, and then his solution worked perfectly for me. Hope this helps!