aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
authorDavid Heinemeier Hansson <david@loudthinking.com>2018-10-02 17:10:09 -0700
committerDavid Heinemeier Hansson <david@loudthinking.com>2018-10-02 17:10:09 -0700
commit283023f826165153d23d2373e1e023f873a46b41 (patch)
tree409322524e7f6018292a2913ea81a89481bb2173
parent4034515ac66499f30196b2e4f938ee2ab5ed6a2e (diff)
downloadrails-283023f826165153d23d2373e1e023f873a46b41.tar.gz
rails-283023f826165153d23d2373e1e023f873a46b41.tar.bz2
rails-283023f826165153d23d2373e1e023f873a46b41.zip
Flush out the README
-rw-r--r--README.md88
1 files changed, 65 insertions, 23 deletions
diff --git a/README.md b/README.md
index 304fe644c1..e781e1cde2 100644
--- a/README.md
+++ b/README.md
@@ -1,16 +1,25 @@
# Action Text
-🤸‍♂️💰📝
+Action Text brings rich text content and editing to Rails. It includes the [Trix editor](https://trix-editor.org/) that handles everything from formatting to links to quotes to lists to embedded images and galleries. The rich text content generated by the Trix editor is saved in its own RichText model that's associated with any existing Active Record model in the application. Any embedded images (or other attachments) are automatically stored using Active Storage and associated with the included RichText model.
+
+
+## Trix compared to other rich text editors
+
+Most WYSIWYG editors are wrappers around HTML’s `contenteditable` and `execCommand` APIs, designed by Microsoft to support live editing of web pages in Internet Explorer 5.5, and [eventually reverse-engineered](https://blog.whatwg.org/the-road-to-html-5-contenteditable#history) and copied by other browsers.
+
+Because these APIs were never fully specified or documented, and because WYSIWYG HTML editors are enormous in scope, each browser’s implementation has its own set of bugs and quirks, and JavaScript developers are left to resolve the inconsistencies.
+
+Trix sidesteps these inconsistencies by treating contenteditable as an I/O device: when input makes its way to the editor, Trix converts that input into an editing operation on its internal document model, then re-renders that document back into the editor. This gives Trix complete control over what happens after every keystroke, and avoids the need to use execCommand at all.
## Installing
-Assumes a Rails 5.2+ application with Active Storage and Webpacker installed.
+Assumes a Rails 6+ application with Active Storage and Webpacker installed.
1. Install the gem:
```ruby
# Gemfile
- gem "actiontext", github: "basecamp/actiontext", require: "action_text"
+ gem "actiontext", github: "rails/actiontext", require: "action_text"
gem "image_processing", "~> 1.2" # for Active Storage variants
```
@@ -21,25 +30,58 @@ Assumes a Rails 5.2+ application with Active Storage and Webpacker installed.
./bin/rails db:migrate
```
-1. Declare text columns as Action Text attributes:
+## Examples
- ```ruby
- # app/models/message.rb
- class Message < ActiveRecord::Base
- has_rich_text :content
- end
- ```
+Adding a rich text field to an existing model:
-1. Replace form `text_area`s with `rich_text_area`s:
-
- ```erb
- <%# app/views/messages/_form.html.erb %>
- <%= form_with(model: message) do |form| %>
- …
- <div class="field">
- <%= form.label :content %>
- <%= form.rich_text_area :content %>
- </div>
- …
- <% end %>
- ```
+```ruby
+# app/models/message.rb
+class Message < ActiveRecord::Base
+ has_rich_text :content
+end
+```
+
+Then refer to this field in the form for the model:
+
+```erb
+<%# app/views/messages/_form.html.erb %>
+<%= form_with(model: message) do |form| %>
+ …
+ <div class="field">
+ <%= form.label :content %>
+ <%= form.rich_text_area :content %>
+ </div>
+ …
+<% end %>
+```
+
+And finally display the rich text on a page:
+
+```erb
+<%= @message.content %>
+```
+
+To accept the rich text content, all you have to do is permit the referenced attribute:
+
+```ruby
+class MessagesController < ApplicationController
+ def create
+ message = Message.create! params.require(:message).permit(:title, :content)
+ redirect_to message
+ end
+end
+```
+
+## Custom styling
+
+By default, the Action Text editor and content is styled by the Trix defaults. If you want to change these defaults, you'll want to remove the `app/assets/stylesheets/actiontext.css` linker and base your stylings on the [contents of that file](https://raw.githubusercontent.com/basecamp/trix/master/dist/trix.css).
+
+You can also style the HTML used for embedded images and other attachments (known as blobs). On installation, Action Text will copy over a partial to `app/views/active_storage/blobs/_blob.html.erb`, which you can specialize.
+
+## Development road map
+
+Action Text is destined for inclusion in Rails 6, which is due to be released some time in 2019. We will refine the framework in this separate rails/actiontext repository until we're ready to promote it via a pull request to rails/rails.
+
+## License
+
+Action Text is released under the [MIT License](https://opensource.org/licenses/MIT). \ No newline at end of file