Allow Inline Editing with CKEditor #566

Closed
peakpg opened this Issue Feb 15, 2013 · 5 comments

Comments

Projects
None yet
2 participants
Collaborator

peakpg commented Feb 15, 2013

CKEditor 4.0 now supports inline editing. Investigate and implement a solution that allows:

  1. Editors to make changes to content directly in a page
  2. Allow developers to configure Stylesheets for site implementations
  3. Allow developers to configure custom toolbars for different editor implementation.

Primary reasons to implement CKEditor 4.0 over Mercury are:
a. Works in IE (Mercury does not)
b. Already need CKEditor for standard editing, so this is one less dependency.
c. Configuration is familiar since we have been using it as the core editor for several years.

For the curious minds, the demo is at http://ckeditor.com/demo#inline.

@peakpg, sounds great! Is this something you're planning for your own clients (that is, should we expect to see it landing on master soon?)

Collaborator

peakpg commented Feb 22, 2013

This will be moved into master for the 4.0 release as the primary editing paradigm whenever I get it completed, so not just for our clients. I'm about 95% sure we are going to go with CKEditor over Mercury based on my experience so far. It looks really solid from what I can see, and the plugin architecture is very well thought out (as would be expected for a v4.0 product).

I have basic editing of Html blocks working currently. Still need to rework how moving blocks around/removing them from pages work, etc.

Thank you for the feedback on this.

peakpg added a commit that referenced this issue Feb 22, 2013

[#566] Inline Ckeditor
* Can update Htmlblocks using inline editing now
* Page status/publish button are updated after saving.

peakpg added a commit that referenced this issue Feb 22, 2013

[#566] Ckeditor inline
* Containers no longer display a box around them
* Published and Draft status float to the right of the toolbar.

peakpg added a commit that referenced this issue Feb 22, 2013

[#566] Inline CKeditor
* Remove Content - Add button to remove content from the page.

peakpg added a commit that referenced this issue Feb 22, 2013

[#566] Ckeditor inline
* Full Editor - Allow users to edit a given block with the 'Full' Ckeditor.
* Users will be taken to the Edit Html Block page then return the previous page after saving/publishing.

peakpg added a commit that referenced this issue Feb 22, 2013

[#566] Order blocks
* Allow blocks to be moved up or down on the page.
* Add Up/Down Content arrows in Ckeditor.
* Moving will refresh the page.

peakpg added a commit that referenced this issue Mar 19, 2013

[#566] Save changes for Full editor
* If a user makes changes in the inline editor, then clicks 'Edit Content' it will save the content.
* Prevents changes from being lost.

peakpg added a commit that referenced this issue Mar 19, 2013

[#566] Move Content
* While editing a block, if you move it it will save the changes.

peakpg added a commit that referenced this issue Mar 19, 2013

[#566] Remove Content
* Removing content from a page will now prompt the user to confirm before removing it.

peakpg added a commit that referenced this issue Mar 19, 2013

[#566] Edit Page Titles
* Allow editors to edit the title of the inline.

peakpg added a commit that referenced this issue Mar 19, 2013

[#566] Add use_page_title
* Add new method 'use_page_title' for setting a page_title override.
* Add deprecation for calling page_title for setting page names.
* Refactor all core files to use_page_title

peakpg added a commit that referenced this issue Mar 19, 2013

[#566] Add page_header to Template API
* New method 'page_header' can be used in place of page_title within the body of a CMS template.
* Deprecated usage of 'page_title' to set the page title.

When used, editor can change the page title in context, rather than having to edit the properties.

peakpg added a commit that referenced this issue Mar 19, 2013

-#566] Enable inline for other content types
* Strip HTML formatting for attributes not named :content
* Don't call html_safe on numbers.

peakpg added a commit that referenced this issue Mar 19, 2013

[#566] Inline Ckeditor
* [BUG FIX] InlineEditor doesn't load the latest 'draft' of a block. i.e. Product with two fields:
    - Change name (A -> A1)
    - Change price (B -> B1)
    - Name field will go back to A.

peakpg added a commit that referenced this issue Mar 19, 2013

[#566] Preview Page
Add a 'Preview' page button that will open the window in a new tab with no frame.

peakpg added a commit that referenced this issue Mar 19, 2013

[#566] Add button to edit blocks
* Some content types (i.e. portlets) don't really have a representation that would allow them to be inline edited.
* Added a floating 'edit' link to allow users to directly edit content.

peakpg added a commit that referenced this issue Mar 19, 2013

[#566] [BUG FIX] Page title shouldn't be editable
* In preview mode, the page title is editable, when it should not be.

peakpg added a commit that referenced this issue Mar 19, 2013

[#566] [BUG FIX] Html bodies shouldn't be sanitized
* When inline editing html blocks, the html formatting shouldn't be removed.

peakpg added a commit that referenced this issue Mar 19, 2013

[#566] Edit/Move block
* [BUG] Editing a block, then moving a block will throw an error. (Connector ids change between page versions)[Suggest: After editing block, replace container with new content)
* Step 1: Refactor the page status update to use JSON (remove ERB)

peakpg added a commit that referenced this issue Mar 19, 2013

[#566] Updated page title should be displayed
* After changing the page title in the inline editor, the page title also changes.

peakpg added a commit that referenced this issue Mar 19, 2013

[#566] Refactor current_content
* Push the complicated logic for getting the connectors associated with a page into the page itself.

peakpg added a commit that referenced this issue Mar 19, 2013

[#566] Editing then moving a block breaks
Fixed: You can now edit a block inline, then move it.

This was happening because the connector ids would change between page version updates, so the move up/down/remove paths would be wrong.

Solved by sending new paths to client during updates.

peakpg added a commit that referenced this issue Mar 19, 2013

[#566] [BUG FIX] Can't move or remove portlets
Since portlets don't support inline editing, we need to display buttons to remove/move them.

We made this conditional on content not supporting inline editing, so that it doesn't clutter up pages.

peakpg added a commit that referenced this issue Mar 19, 2013

[#566] Inline Ckeditor
* Can update Htmlblocks using inline editing now
* Page status/publish button are updated after saving.

peakpg added a commit that referenced this issue Mar 19, 2013

[#566] Ckeditor inline
* Containers no longer display a box around them
* Published and Draft status float to the right of the toolbar.

peakpg added a commit that referenced this issue Mar 19, 2013

[#566] Inline CKeditor
* Remove Content - Add button to remove content from the page.

peakpg added a commit that referenced this issue Mar 19, 2013

[#566] Ckeditor inline
* Full Editor - Allow users to edit a given block with the 'Full' Ckeditor.
* Users will be taken to the Edit Html Block page then return the previous page after saving/publishing.

peakpg added a commit that referenced this issue Mar 19, 2013

[#566] Order blocks
* Allow blocks to be moved up or down on the page.
* Add Up/Down Content arrows in Ckeditor.
* Moving will refresh the page.

peakpg added a commit that referenced this issue Mar 19, 2013

[#566] Save changes for Full editor
* If a user makes changes in the inline editor, then clicks 'Edit Content' it will save the content.
* Prevents changes from being lost.

peakpg added a commit that referenced this issue Mar 19, 2013

[#566] Move Content
* While editing a block, if you move it it will save the changes.

peakpg added a commit that referenced this issue Mar 19, 2013

[#566] Remove Content
* Removing content from a page will now prompt the user to confirm before removing it.

peakpg added a commit that referenced this issue Mar 19, 2013

[#566] Edit Page Titles
* Allow editors to edit the title of the inline.

peakpg added a commit that referenced this issue Mar 19, 2013

[#566] Add use_page_title
* Add new method 'use_page_title' for setting a page_title override.
* Add deprecation for calling page_title for setting page names.
* Refactor all core files to use_page_title

peakpg added a commit that referenced this issue Mar 19, 2013

[#566] Add page_header to Template API
* New method 'page_header' can be used in place of page_title within the body of a CMS template.
* Deprecated usage of 'page_title' to set the page title.

When used, editor can change the page title in context, rather than having to edit the properties.

peakpg added a commit that referenced this issue Mar 19, 2013

-#566] Enable inline for other content types
* Strip HTML formatting for attributes not named :content
* Don't call html_safe on numbers.

peakpg added a commit that referenced this issue Mar 19, 2013

[#566] Inline Ckeditor
* [BUG FIX] InlineEditor doesn't load the latest 'draft' of a block. i.e. Product with two fields:
    - Change name (A -> A1)
    - Change price (B -> B1)
    - Name field will go back to A.

peakpg added a commit that referenced this issue Mar 19, 2013

[#566] Preview Page
Add a 'Preview' page button that will open the window in a new tab with no frame.

peakpg added a commit that referenced this issue Mar 19, 2013

[#566] Add button to edit blocks
* Some content types (i.e. portlets) don't really have a representation that would allow them to be inline edited.
* Added a floating 'edit' link to allow users to directly edit content.

peakpg added a commit that referenced this issue Mar 19, 2013

[#566] [BUG FIX] Page title shouldn't be editable
* In preview mode, the page title is editable, when it should not be.

peakpg added a commit that referenced this issue Mar 19, 2013

[#566] [BUG FIX] Html bodies shouldn't be sanitized
* When inline editing html blocks, the html formatting shouldn't be removed.

peakpg added a commit that referenced this issue Mar 19, 2013

[#566] Edit/Move block
* [BUG] Editing a block, then moving a block will throw an error. (Connector ids change between page versions)[Suggest: After editing block, replace container with new content)
* Step 1: Refactor the page status update to use JSON (remove ERB)

peakpg added a commit that referenced this issue Mar 19, 2013

[#566] Updated page title should be displayed
* After changing the page title in the inline editor, the page title also changes.

peakpg added a commit that referenced this issue Mar 19, 2013

[#566] Refactor current_content
* Push the complicated logic for getting the connectors associated with a page into the page itself.

peakpg added a commit that referenced this issue Mar 19, 2013

[#566] Editing then moving a block breaks
Fixed: You can now edit a block inline, then move it.

This was happening because the connector ids would change between page version updates, so the move up/down/remove paths would be wrong.

Solved by sending new paths to client during updates.

peakpg added a commit that referenced this issue Mar 19, 2013

[#566] [BUG FIX] Can't move or remove portlets
Since portlets don't support inline editing, we need to display buttons to remove/move them.

We made this conditional on content not supporting inline editing, so that it doesn't clutter up pages.

peakpg added a commit that referenced this issue Mar 19, 2013

[#566] Clean up documentation
* Move remaining open tickets to github
* Write release notes
Collaborator

peakpg commented Mar 19, 2013

This is done and merged into master.

@peakpg peakpg closed this Mar 19, 2013

@peakpg so sweet 👍

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment