Skip to content
This repository was archived by the owner on Mar 26, 2025. It is now read-only.

Commit 31cb918

Browse files
authored
feat: inline editor (#606)
* Fix: Tests dj4 compatible * Feature: Inline editing * Make flake (8 happy) * Fix: Inline editing js only loaded in edit mode. * Fix: Only create InlineEditor for visible elements * Fix: Keep child plugins in tact while inline editing * Fix: Tests * Fix: Flake8 and isort * Fix: Add editor condig to dom using toolbar * Refactor: unify ckeditor management * Add: Plugin editing in the inline editor * Fix: Avoid prepare single load of text * Fix: Strongly increased responsiveness. Common csrf token * Fix: isort, flake8 * Fix: isort * Add: dark mode for frontend editing * Fix: only group plugins into modules if there are any * Fix: non-placholder fields * Fix: Add cms_path to post requests * Add: show toolbar loader when saving * Fix: remove console.logs, better style * Fix: Bind CKEDITOR only after load * Fix: Reload toolbar after save to allow edits to be published * Fix: Refactor toolbar reload for better reusability * Fix: Memorize styles before first edit Fix: Admin forms w/o plugin * Fix: updated js file in widgets.py * Fix: admin htmlfields * Fix: Remove debug console.log statements * Fix: Child Plugin editor confusion. * Fix: Float ckedor diaog above cms structure board * Fix: block toolbar click manager forb ckeditor * Fix: Highligh of text plugin * Add: CKEDITOR_INLINE_EDITING setting to activate inline editing * Fix: Change setting to TEXT_INLINE_EDITING * Fix: missing comma * Fix: flake adjustments * Fix flake 2nd * Update Readme * Fix: link correct static js file * Add: Improved responsiveness by only initializing visible text areas (using Observer class) Fix: Double rendering of text child plugins * Fix: Editor initialization Add: temporary console.log statements for debugging * Fix: wrong editor init order * isort * flake8 w503 * Fix: unwanted scrolling when entering inline editor * Fix: removed unused variable * Fix: Avoid double rendering of plugins when in inline edit mode * Fix: isort * Add: Warning before navigating away from unsaved changes * Fix: Allow for custom overwrite of `cms/plugins/text.html` template Fix: Do not wrap already wrapped html * Fix: show inline-flex cms-plugins also inline and not as block * Add: Switch in admin menu bar for inline editing * fix: isort * fix: lint error * Add: Toolbar button * Fix: Remove unused imports * Fix: User HTML instead of admin HTML when inline editing is turned off * Add: title attribute for inline editing toolbar button * Some flakes * Fix: Obfuscation to avoid W503 and W504 * Fix: Keep code readable by accepting the new best practice W504 * OK, it's W503 - the new best practice W504 becomes the anti-pattern * Fix: ckeditor opening select dialog box if cmsplugin contains a select tag * Fix: Toolbar.request.get_absolute_url() does not work: use toolbar.request_path instead * Add: Simple test * Fix: test syntax * test: move test case to test_plugin.py * Test: test on github actions * Test: Test edit mode * Test: Try truning on inline-editing * Tests: Testing the inline editing switch * Some lint chocolate * Fix: Persisetence of inline_editing switch * Add: some comments * Fix: dark mode support for inline-editor Add: icon setting for cmsplugins * Fix: flake8 unused import * Fix: Remove toggle button on touch devices and in collapsed menus. * No white space before of * Fix: No white space at elf for inline.html * Fix: namespace events, unregister events * Fix: z-index to let dialog float above structure board * Update: readme.rst * NO NEWLINE AT THE END! * NO NEWLINE AT THE END * Fix: remove newlines at end of text.html and inline.html * Fix: displayStyle undefined bug
1 parent ad86d37 commit 31cb918

File tree

86 files changed

+1446
-965
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

86 files changed

+1446
-965
lines changed

README.rst

Lines changed: 31 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -57,7 +57,7 @@ One of the easiest contributions you can make is helping to translate this addon
5757
Documentation
5858
=============
5959

60-
See ``REQUIREMENTS`` in the `setup.py <https://github.com/divio/djangocms-text-ckeditor/blob/master/setup.py>`_
60+
See ``REQUIREMENTS`` in the `setup.py <https://github.com/django-cms/djangocms-text-ckeditor/blob/master/setup.py>`_
6161
file for additional dependencies listed in the
6262

6363
The current integrated Version of CKEditor is: **4.17.2**
@@ -88,6 +88,32 @@ Upgrading from ``cms.plugins.text``
8888
Configuration
8989
-------------
9090

91+
Inline editing feature
92+
**********************
93+
94+
Inline editing allows editors to directly click on a text plugin and change
95+
the contents in django CMS' edit mode. The CKEditor appears directly around
96+
the text field and can be used normally. Changes are saved as soon as the
97+
text field leaves focus.
98+
99+
Inline editing requires to encapsulate the HTML text in a ``<div>`` in
100+
edit mode. This might cause some side effects with a site's CSS, e.g. direct
101+
child rules.
102+
103+
To activate inline editing add the following line in your project's
104+
``settings.py``::
105+
106+
TEXT_INLINE_EDITING = True
107+
108+
This will add a toggle button to the toolbar to allow to switch inline editing
109+
on and off for the current session.
110+
111+
When inline editing is active the editor will save the plugin's content each time it loses
112+
focus. If only text has changed the user can immediately continue to edit. If
113+
a text-enabled plugin was changed, added, or removed he page will refresh to
114+
update the page tree and get the correctly rendered version of the changed
115+
plugin.
116+
91117
Default content in Placeholder
92118
******************************
93119

@@ -97,7 +123,7 @@ If you use Django-CMS >= 3.0, you can use ``TextPlugin`` in "default_plugins"
97123
HTML content. If you want to add some "default children" to your
98124
automagically added plugin (i.e. a ``LinkPlugin``), you have to put children
99125
references in the body. References are ``"%(_tag_child_<order>)s"`` with the
100-
inserted order of chidren. For example::
126+
inserted order of children. For example::
101127

102128
CMS_PLACEHOLDER_CONF = {
103129
'content': {
@@ -212,7 +238,7 @@ configuration parameter in your settings::
212238
#. Add `configuration='MYSETTING'` to the `HTMLField` usage(s) you want to
213239
customize;
214240
#. Define a setting parameter named as the string used in the `configuration`
215-
argument of the `HTMLField` instance with the desidered configuration;
241+
argument of the `HTMLField` instance with the desired configuration;
216242

217243
Values not specified in your custom configuration will be taken from the global
218244
``CKEDITOR_SETTINGS``.
@@ -252,7 +278,7 @@ to note:
252278
.. _add styles and js configuration: https://github.com/divio/django-cms-demo/blob/7a104acaa749c52a8ed4870a74898e38daf20e46/src/settings.py#L318-L324
253279
.. _stop CKEditor from removing empty spans: https://github.com/divio/django-cms-explorer/blob/908a88afa4e1d1176e267e77eb5c61e31ef0f9e5/static/js/addons/ckeditor.wysiwyg.js#L73
254280
.. _allowedContent: http://docs.ckeditor.com/#!/guide/dev_allowed_content_rules
255-
.. _to contain: https://github.com/divio/djangocms-text-ckeditor/issues/405#issuecomment-276814197
281+
.. _to contain: https://github.com/django-cms/djangocms-text-ckeditor/issues/405#issuecomment-276814197
256282

257283

258284
Drag & Drop Images
@@ -262,7 +288,7 @@ In IE and Firefox based browsers it is possible to drag and drop a picture into
262288
This image is base64 encoded and lives in the 'src' attribute as a 'data' tag.
263289

264290
We detect this images, encode them and convert them to picture plugins.
265-
If you want to overwirite this behavior for your own picture plugin:
291+
If you want to overwrite this behavior for your own picture plugin:
266292

267293
There is a setting called::
268294

0 commit comments

Comments
 (0)