README.md in edit_mode-1.0.0 vs README.md in edit_mode-1.0.1
- old
+ new
@@ -1,16 +1,16 @@
# EditMode [![Build Status](https://secure.travis-ci.org/fiedl/edit_mode.png?branch=master)](http://travis-ci.org/fiedl/edit_mode)
<img src="https://github.com/fiedl/edit_mode/raw/master/test_app/app/assets/images/screenshot.png" height="300" align="right" vspace="20" hspace="20" />
-*edit_mode* is a *ruby on rails gem* that allows you to toggle an edit mode on a normal show view.
-Think of it as a grouped in-place editing.
+*edit_mode* is a *ruby on rails gem* that allows you to toggle an edit mode on a normal show view.
+Think of it as a grouped in-place editing.
This also toggles [best_in_place](https://github.com/bernat/best_in_place) fields.
-The edit mode is activated by pressing an 'edit' button on a show view. This shows additional editing tools
-and switches on the best_in_place form fields. When editing is finished, use 'save' or 'cancel' buttons to
-quit the edit mode and return to a normal show view.
+The edit mode is activated by pressing an 'edit' button on a show view. This shows additional editing tools
+and switches on the best_in_place form fields. When editing is finished, use 'save' or 'cancel' buttons to
+quit the edit mode and return to a normal show view.
Several editing groups per page are supported. Thus, you can have several 'boxes' to edit on a page.
## Demo
You might want to have a look at [this demo app at heroku](http://edit-mode-test-app.herokuapp.com/).
@@ -34,13 +34,16 @@
### Include Assets
In `app/assets/javascripts/application.js`, add:
```javascript
+//= require jquery.turbolinks
//= require edit_mode
```
-
+
+If you experience trouble with javascript, check the correct loading order from [the jquery.turbolinks README](https://github.com/kossnocorp/jquery.turbolinks#usage).
+
In `app/assets/stylesheets/application.css`, add:
```css
/*
*...
@@ -60,11 +63,11 @@
You can also have several edit_mode_group spans on a page, as shown in the demo app.
### Tool Buttons
-To enter and exit the edit mode, use buttons 'edit', 'save' and 'cancel'. These can be anchors, images, et cetera. They only have to have the correct css classes:
+To enter and exit the edit mode, use buttons 'edit', 'save' and 'cancel'. These can be anchors, images, et cetera. They only have to have the correct css classes:
```html
<span class="edit_mode_group">
<a class="edit_button" href="#">edit</a>
<a class="save_button" href="#">save</a>
@@ -127,30 +130,41 @@
ajax, you have to call `apply_edit_mode()` on the newly added elements in order to have them provide the proper methods
and triggers.
For example, if you have added a `<span id="my_new_edit_mode_span">...</span>` containing
the edit_mode elements using ajax, just call via javascript (jQuery):
-
+
```javascript
$( "#my_new_edit_mode_span" ).apply_edit_mode()
-```
+```
And if you want to enter edit_mode for this span, call instead:
-
+
```javascript
$( "#my_new_edit_mode_span" ).apply_edit_mode().trigger( "edit" )
```
+### Deactivating the Modal
+
+If you do not want the edit mode span to get modal when entering the edit mode, have a look at [the solution to issue #2](https://github.com/fiedl/edit_mode/issues/2).
+
## Documentation
http://rubydoc.info/github/fiedl/edit_mode/frames
+## Demo App
+
+* http://edit-mode-test-app.herokuapp.com/
+* https://github.com/fiedl/edit_mode/tree/master/test_app
+* Add heroku remote to git: http://stackoverflow.com/questions/5129598
+ * `brew install heroku-toolbelt`
+ * `heroku keys:add`
+ * `heroku git:remote -a edit-mode-test-app`
+* Push test app to heroku: `git subtree push --prefix test_app heroku master` or `git push heroku \`git subtree split --prefix test_app master\`:master --force` ([SO](http://stackoverflow.com/a/10648623/2066546))
+
## Contributing
1. Fork it
2. Create your feature branch (`git checkout -b my-new-feature`)
3. Commit your changes (`git commit -am 'Added some feature'`)
4. Push to the branch (`git push origin my-new-feature`)
5. Create new Pull Request
-
-
-