Turn a simple_form textarea into an ACE editor
Ruby CoffeeScript JavaScript
Switch branches/tags
Nothing to show
Pull request Compare This branch is 7 commits ahead of glanotte:master.
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
app
lib
vendor/assets/javascripts/ace
.gitignore
.rvmrc
Gemfile
Gemfile.lock
MIT-LICENSE
README.rdoc
Rakefile
simple_ace_input.gemspec

README.rdoc

SimpleAceInput

A drop in solution for turning any textarea into an ACE editor via simple_form.

Install

Put this line in your Gemfile:

gem 'simple_ace_input'

Then bundle:

% bundle

Configuration

The primary configuration consideration relates to how you want to handle loading the javascript files, as it relates to the Asset Pipeline.

For the whole kit and kaboodle add the following to your application.js:

//= require simple_ace_input

For a minimally viable setup (no modes or themes) add the following to your application.js:

//= require ace/ace
//= require simple_ace_input/controller

Then add only the modes and themes you want:

//= require ace/mode-css
//= require ace/mode-solarized-dark

Another option and one worth considering (b/c ACE is quite large) is only loading the scripts on pages where ACE is actually needed.

If you take this route make sure the scripts you use get precompiled by adding something like the following to your production.rb file:

config.assets.precompile += ['ace/*.js', 'simple_ace_input']

If you only want to precompile the mode, theme and keybinding files you can use a proc like this:

config.assets.precompile += [Proc.new{ |path| File.basename(path, '.js' ) =~ /^(keybinding-|mode-|theme-)\w+$/ }]

Lastly, if you're implementing this in an engine, you can designate the assets to be precompiled via an initializer placed in the engine.rb file:

initializer :assets, group: :all do |app|
  app.config.assets.precompile += [...]
end

Usage

Just designate a textarea input as: :ace.

<%= simple_form_for @user do |f| %>
  <%= f.input :code, as::ace %>
<% end %>

Options

Set the mode, theme, and height by passing them as ace- attributes.

ace: { ace_mode: 'html', ace_theme: 'carto_light', ace_height: '600' }

If you would like to change the defaults, run the following to generate an initializer where you can set your own defaults.

% rails g simple_ace_input:config

Notes

I have not included any of the worker functionality in this gem because I have found it to be a bit finicky and more trouble than it's worth.

TODOs

  • This gem has zero testing coverage. SAD TROMBONE

  • Make more configuration options available via the data- convention.

Copyright

Copyright © 2012 Brian McNabb. See MIT_LICENSE for further details.