When you want to fix a typo, or restructure your paragraphs, or quickly add another tag to your blog post, you always have to go to the
node/%/edit page. Once you're there, you have to navigate through a potentially enormous form to find the particular thing you want to edit.
Even ifgets done (which will make the above less painful), it is still much slower to have to navigate to another page to be able to edit the thing that you're currently viewing (i.e. you see exactly where the mistake is, you know exactly where you want to edit content).
Imagine you were able to edit those things right there, in-place?
Sound like science fiction? This is becoming standard fare in most other CMS/CMF/… software. Drupal 8 needs to have this feature out of the box in order to remain competitive.
Add in-place editing to Drupal 8 core:
On the PHP side, we implement
hook_preprocess_field() to annotate fields with classes and data attributes so the JS side knows what to do.
_edit_wysiwyg_get_field_editor() figures whether each field should be editable and which Create.js editor widget it should use.
Edit.module is <400 LoC, the form logic is <100 LoC, AJAX page callbacks are <200 LoC.
On the JS side, we build on top of the http://createjs.org framework (for the editing portion) and http://viejs.org (for the parsing and syncing of content portion), and we use Backbone Views to ensure everything is nicely decoupled. For details on the JS architecture, see .
All remaining tasks done!
- working with Create.js and VIE.js maintainers on fixing the two only known bugs in Edit (can be fixed post-commit)
- getting as much of the accessibility plan done as possible (can be completed post-commit)
- a11y subissues — also see the
- (patch that does this is ready to go)
- Integrate with WYSIWYG -
- Clean up
EditEntityFieldAccessCheck::accessEditEntityField()once lands ( was just the framework, no entity type implements it yet).
User interface changes
No UI changes on the back-end. Whenever there is at least one field that the current user is allowed to edit, the "Edit" tab in the D8 toolbar shows up. When clicked, its tray shows up, which contains a "View/Quick edit" toggle; it is set to "View" by default. If the user toggles it, all content will fade away except for the fields that are editable. You can then click on any of them to edit them in-place.
- The "Edit" tab & tray in the D8 toolbar:
directproperty editor widget:
formproperty editor widget:
direct-with-wysiwygproperty editor widget:
- There is a new type of plugin (to let any WYSIWYG editor become "the"
- Formatters must now indicate the editability of textual fields explicitly (because only those can be edited with the
direct-with-wysiwygeditors): see the changes to text.module’s formatters, plus http://drupalcode.org/project/edit.git/blob/d3a6777e2953a72612fc2e98b93c... for docs. I’m not sure where and how this should be documented?
To ensure all those who've contributed significantly get credit, because they are not all visible in this issue!
Issue #1824500 by Wim Leers, tkoleary, frega, jessebeach, henribergius, effulgentsia, nod_, yched: In-place editing for Fields.
PASSED: [[SimpleTest]]: [MySQL] 49,363 pass(es). View
PASSED: [[SimpleTest]]: [MySQL] 49,383 pass(es). View
|#123||in_place_editing_for_fields-123.patch||171.83 KB||Wim Leers|
PASSED: [[SimpleTest]]: [MySQL] 49,472 pass(es). View
|#123||in_place_editing_for_fields-aloha-integration-123-do-not-test.patch||10.69 KB||Wim Leers|