Migrate Aloha Editor integration from the Edit module and make it work on the back-end

I noticed :) And thanks! (There are so many subtleties about the project module… :))

I'll be working on this for the majority of the remainder of the week. I hope to have it functional by the weekend.

Status update: I've made a lot of progress. I should have an initial version ready (and pushed) tomorrow.

I have migrated all of the following code/functionality, *and* cleaned it up:

• Aloha Editor defined through hook_library(), now with each individual AE plug-in also defined as a library, so that Drupal can reason about dependencies! I've also included an ASCII diagram in the README.
• The proposed modifications to the Filter module now live in a stand-alone "filter_true_wysiwyg" module. This makes it easier to review this. I've also cleaned up this code (in the Edit module, I had both my original, "simplest possible thing that can work" approach and the proposed approach — #807996-19: [meta] Input filters and text formats) and have added explanatory comments throughout to more clearly communicate the reasoning.
• The image caption functionality (which was based upon the caption_filter module) now lives in a separate module, as it should, and serves as an example on how to load additional AE plug-ins. It will load AE's extra/captioned-image plug-in, which depends on AE's common/block plug-in, and the loading of this plug-in is now handled through Drupal's dependency handling. This is also explained in aloha.module's README.
  This module can also be used *without* the Aloha module (the Aloha-specific code is marked by /* @aloha */ in the code), in this case, it essentially is a cleaned up version of the caption_filter module. However, I think it makes sense to ship this functionality with core as well, so we may want to put this up for core inclusion after we get Aloha in. At under 12,000 bytes, it's definitely a very manageable piece of code :)

Still to do, from highest to lowest priority:

1. Get Aloha Editor to show with our custom UI. (Aloha Editor itself already loads successfully, but the custom UI relies on "DOM infrastructure" provided by the Edit module, which now obviously is absent.)
2. Toggling between formats should impact the WYSIWYG editor.
3. Improve our build of Aloha Editor, so that we can leverage Drupal's hook_library() even better.

Only the highest priority item I still want to get done before I push my code.

Pushed!

The details outlined above still apply.

Please be aware that the UI needs serious refactoring, it's just in a "this is functional" state. I'll be working on that next (next week).

TODO (also in the README):

* Toggling between formats should impact the WYSIWYG editor.
* Refactor + improve the UI to make it work well on the back-end instead of just
  in the Edit module. Yet still keep the ability to easily integrate it with
  Edit's in-place editing UI.
* BUG INTRODUCED: unable to align captioned images.
* Improve our build of Aloha Editor, so that we can leverage Drupal's
  hook_library() even better.

Commits:
- http://drupalcode.org/project/aloha.git/commit/7516db6
- http://drupalcode.org/project/aloha.git/commit/4f901f3
- http://drupalcode.org/project/aloha.git/commit/8eba190
- http://drupalcode.org/project/aloha.git/commit/66880b7
- http://drupalcode.org/project/aloha.git/commit/d18ac63

Reviews of everything, except for the UI and the remaining @todo's are already welcome :)

FYI, this is what it currently looks like. Not quite perfect, as I'm sure you can see:

I didn't test this on a clean Drupal 7 installation, and I should have. I've now added installation instructions that make it work on a clean Drupal 7 ("Standard" profile) installation.

I fixed two bugs:
- http://drupalcode.org/project/aloha.git/commit/9eaf641 -> the icons font was not explicitly being required
- http://drupalcode.org/project/aloha.git/commit/62133af -> there was an implicit dependency on the Edit module for some of its CSS; I've moved the relevant CSS into the Aloha module but this still needs to be cleaned up anyway (as said in #5)

Finally, I've updated the README with installation instructions: http://drupalcode.org/project/aloha.git/commit/02ff98b. Most notably, a core patch is required for Aloha Editor to load: http://drupalcode.org/project/aloha.git/commit/02ff98b.

Toggling between formats is now possible: http://drupalcode.org/project/aloha.git/commit/8573625. This code was heavily inspired by sun's wysiwyg module.

Related clean-up: http://drupalcode.org/project/aloha.git/commit/a130be3.

Currently working on the refactored & improved UI.

#10: Thanks — will commit :)

#11: It should show up on every textarea where you have "text processing" enabled, i.e. where text formats are being used.

I just received the design from @tkoleary on what the WYSIWYG editor should look like on the back-end.

Refactored & improved UI almost ready!

Done! Commit: http://drupalcode.org/project/aloha.git/commit/d415f40.

Scales perfectly when zoomed in the browser, everything continues to look super sharp thanks to the use of an icon font. AE plug-ins' CSS files are now loaded only when needed thanks to hook_library(). Comes with RTL support already.

LoC impact: UI code clean-up, with RTL support, no more loading of Aloha's default CSS, and: 10 files changed, 278 insertions(+), 552 deletions(-) → win :)

Related AE issues:

• AE setting width & height on the <div>s created for <textarea>s (to make them editable through AE): https://github.com/alohaeditor/Aloha-Editor/issues/716
• Multiple simultaneously visible AE instances: https://github.com/alohaeditor/Aloha-Editor/issues/717

I now consider this ready for reviews. The AE code is still likely to change, as we add more features (e.g. proper image insertion integration, table editing). But the way the integration works will not change, unless reviews indicate it should change :)

I'll leave this issue open as a meta issue for now, but I'll start creating more issues now that the migration is "feature complete".

@kingfisher: "textarea" does not imply "body field on the front-end". It's as @webchick said: Aloha module is only intended to provide WYSIWYG editing on the back-end, not in-place editing on the front-end. See the issue summary, where this is also stated very clearly.

@Bojhan, yes, I'll update the issue summary today.

And yes, I'm going to clean up the Aloha + Edit integration.

#27: you're right. However, this project has been repurposed. This module's 2.x version is now only intended to do back-end editing, see #1704414-7: Aloha switched to jQuery UI; change module to match, #1704414-8: Aloha switched to jQuery UI; change module to match, #1704414-9: Aloha switched to jQuery UI; change module to match. Over the course of the next two weeks, the Edit module will leverage the Aloha module (*this* module), so then you *will* be able to edit on the front-end again, but better :)

Reviews still welcome at any point in time.

The Drupal 8 port is tracked over at #1782326: Port Aloha 7.x-2.x to Drupal 8 (i.e. a 8.x-2.x version).

Also see #1782332: Upgrade the Edit module so that it leverages the Aloha module.

It's a core patch. See http://drupal.org/patch/apply.