Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP

Loading…

Make images and other in-text plugins editable directly with tinymce or wymeditor #1240

Closed
wants to merge 3 commits into from

5 participants

xmedia-systems Jonas Obrist Patrick Lauber Ioan Alexandru Cucu Daniele Procida
xmedia-systems

Make images and other in-text plugins editable directly with tinymce or wymeditor by
forwarding the attributes of the placeholders (particularly class and style) to the rendering context. (Useful for example in picture.html)

xmedia-systems added some commits
xmedia-systems xmedia-systems save admin tags of in-text plugins in the context
(enables plugins to use class and style attributes set by tinymce)
25ca6e0
xmedia-systems xmedia-systems ADDED admin-tag-attributes
MODIFIED picture template to use admin-tag's class and style
8ec3c4d
xmedia-systems xmedia-systems renamed admin_tag to placeholder ff341a6
Jonas Obrist
Collaborator

not entirely sure what this does, could you elaborate a bit more what this is all about?

xmedia-systems

If you insert text-enabled plugins (especially images) tinymce an wymeditor allow to format them by changing their size or setting for example style="float:right;" or class="...". This formatting however is applied to a placeholder image tag, which is replaced on rendering by the actual output of the embedded plugin. Thus the formatting is lost and the user is wondering why his embedded image plugin is aligned right in the editor but not on the page. To solve this I propose to forward the whole placeholder tag (and for convenience its attributes in a dictionary) to the embedded plugin, which is then able to copy for example style and class (like for example in the patched cms/plugins/picture/templates/cms/plugins/picture.html)

Daniele Procida evildmp was assigned
Patrick Lauber
Collaborator

Needs documentation

xmedia-systems

sorry, what would be the right place to document this?

Patrick Lauber
Collaborator

custom_plugins.rst would be the right place... i see that there is a need for writing a section for text embed-able plugins as well. Could you do that?

xmedia-systems

Ok, I'll take a look

Patrick Lauber
Collaborator

still needs docs and remerge

Ioan Alexandru Cucu

@xmedia-systems
Have a look at pbs@c304042
It implements the same feature (bug fix) by using a proper html parser (avoids error prone regex magic)

@digi604
I don't think this actually needs any explicit documentation. The fact that styles set by tinymce aren't passed down to child plugins is very annoying. I would consider this a bug fix rather than a feature.

Ioan Alexandru Cucu

@digi604

If this pull request got abandoned, I would happily open another (with the changeset linked in the comment above).

Patrick Lauber
Collaborator

@kux yes please open an other PR

Ioan Alexandru Cucu

@digi604

Noticed you removed the text plugin from the cms in 28f191c

Is the new djangocms-text-ckeditor compatible with TinyMCE or WYMEditor? (I noticed the widget classes from wymeditor_widget.py and tinymce_widget.py have been removed)

xmedia-systems

@digi604 I'm sorry for not having found the time to improve the documentation but, you know, my patch is a one liner and to document text-enabled plugins would take some more lines... But I also find it annoying that this problem/bug is still present in the current release.

@kux I wouldn't say my regex solution is error prone: it always finds all attributes of a valid html tag or else it's not a tag! (and even then it doesn't throw an exception but simply finds nothing). On the other hand: don't you think a HTML-Parser is too much overhead for a simple attribute extraction? In both: performance and lines of code

xmedia-systems

@kux I also had to brood over the context name to use in plugin templates and there may be better names than my placeholder_attributes but IMHO inherited_from_parent is less clear

Patrick Lauber
Collaborator

@kux djangocms-text-ckeditor should be an inplace replacement for cms.plugins.text. It supports inline plugins as well... and supports drag and drop pictures into the editor.... we extract those images and convert them to picture plugins...

@kux how does the PBS version differ from this one?

Patrick Lauber
Collaborator

closing as this would need to be implemented on djangocms-text-ckeditor.

Patrick Lauber digi604 closed this
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Commits on May 21, 2012
  1. xmedia-systems

    save admin tags of in-text plugins in the context

    xmedia-systems authored
    (enables plugins to use class and style attributes set by tinymce)
Commits on Jun 4, 2012
  1. xmedia-systems

    ADDED admin-tag-attributes

    xmedia-systems authored
    MODIFIED picture template to use admin-tag's class and style
  2. xmedia-systems
This page is out of date. Refresh to see the latest.
4 cms/plugins/picture/templates/cms/plugins/picture.html
View
@@ -1,5 +1,5 @@
-<span class="plugin_picture{% if picture.float %} align-{{ picture.float }}{% endif %}">
+<span class="plugin_picture{% if picture.float %} align-{{ picture.float }}{% endif %} {{ placeholder_attributes.class }}" style="{{ placeholder_attributes.style }}">
{% if link %}<a href="{{ link }}">{% endif %}
<img src="{{ picture.image.url }}" alt="{{ picture.alt }}"{% if picture.longdesc %} title="{{ picture.longdesc }}"{% endif %} />
{% if link %}</a>{% endif %}
-</span>
+</span>
6 cms/plugins/text/utils.py
View
@@ -39,10 +39,14 @@ def plugin_tags_to_user_html(text, context, placeholder):
context is the template context to use, placeholder is the placeholder name
"""
def _render_tag(m):
- plugin_id = int(m.groups()[0])
+ plugin_id = int(m.group(1))
try:
obj = CMSPlugin.objects.get(pk=plugin_id)
obj._render_meta.text_enabled = True
+ context['placeholder_tag'] = m.group(0)
+ context['placeholder_attributes'] = dict(
+ re.compile(r'(\S+)=["\']?((?:.(?!["\']?\s+(?:\S+)=|[>"\']))+.)["\']?').findall(m.group(0))
+ )
except CMSPlugin.DoesNotExist:
# Object must have been deleted. It cannot be rendered to
# end user so just remove it from the HTML altogether
Something went wrong with that request. Please try again.