From 3a25ef4d00736ec1b5d47ddf89353f6bf8276ee1 Mon Sep 17 00:00:00 2001 From: Angelo Dini Date: Fri, 6 Jan 2017 11:18:27 +0100 Subject: [PATCH] Remove drag & drop image support (#125) * Remove dnd support from image * added small adaption --- .editorconfig | 3 + CHANGELOG.rst | 8 +- aldryn_bootstrap3/models.py | 2 +- .../aldryn_bootstrap3/widgets/dragndrop.html | 74 ++++++++++ .../aldryn_bootstrap3/plugins/image.html | 127 ++++++------------ 5 files changed, 121 insertions(+), 93 deletions(-) create mode 100644 aldryn_bootstrap3/templates/admin/aldryn_bootstrap3/widgets/dragndrop.html diff --git a/.editorconfig b/.editorconfig index 82e37062..4545b663 100644 --- a/.editorconfig +++ b/.editorconfig @@ -35,3 +35,6 @@ insert_final_newline = false [*plugins/responsive.html] insert_final_newline = false + +[*plugins/image.html] +insert_final_newline = false diff --git a/CHANGELOG.rst b/CHANGELOG.rst index 8b1ddf21..8c594b5c 100644 --- a/CHANGELOG.rst +++ b/CHANGELOG.rst @@ -30,9 +30,11 @@ Changelog ``PANEL_CONTEXT_DEFAULT``, ``ACCORDION_ITEM_CONTEXT_CHOICES``, ``ACCORDION_ITEM_CONTEXT_DEFAULT``, ``LIST_GROUP_ITEM_CONTEXT_CHOICES``, ``LIST_GROUP_ITEM_CONTEXT_DEFAULT`` -* **Backwards incompatible** change using the Bootstrap 3 Panel plugin: - the Panel only allows header, body and footer now to be its direct decendands - and the descendends require the "Panel" parent. +* **Backwards incompatible** changes: + * The Panel only allows header, body and footer now to be its direct + decendands and the descendends require the "Panel" parent. + * Drag & drop support has been removed from the rendered plugin markup + until a cleaner version is ready 1.1.2 (2016-09-05) diff --git a/aldryn_bootstrap3/models.py b/aldryn_bootstrap3/models.py index 0f1b7d19..bc28cbee 100644 --- a/aldryn_bootstrap3/models.py +++ b/aldryn_bootstrap3/models.py @@ -390,7 +390,7 @@ class Boostrap3ImagePlugin(CMSPlugin): attributes = AttributesField( verbose_name=_('Attributes'), blank=True, - excluded_keys=['alt', 'class'], + excluded_keys=['src', 'alt', 'class', 'title'], ) classes = model_fields.Classes() diff --git a/aldryn_bootstrap3/templates/admin/aldryn_bootstrap3/widgets/dragndrop.html b/aldryn_bootstrap3/templates/admin/aldryn_bootstrap3/widgets/dragndrop.html new file mode 100644 index 00000000..1c69e632 --- /dev/null +++ b/aldryn_bootstrap3/templates/admin/aldryn_bootstrap3/widgets/dragndrop.html @@ -0,0 +1,74 @@ +{% comment %} + +NOTE: Drag and drop support has been removed for now, this file is kept +for reference on the old implementation / assets + +DOCS: https://html.spec.whatwg.org/multipage/embedded-content.html#introduction-3:viewport-based-selection-2 +the browser assumes size="100vw" by default, which means +"assume this image will be displayed at full width on the +current viewport and pick an image from srcset accordingly". + +{# only load js and css required for dnd upload if toolbar is available #} +{% if request.toolbar and request.toolbar.show_toolbar and request.toolbar.edit_mode %} + {% addtoblock "css" %}{% endaddtoblock %} + {% addtoblock "js" %}{% endaddtoblock %} + {% addtoblock "js" %}{% endaddtoblock %} +{% endif %} + +{% endcomment %} + +{% comment %} +# attached before the image +{% if request.toolbar and request.toolbar.show_toolbar and request.toolbar.edit_mode %} + {% if has_dnd_support %} + + {% endif %} +{% endif %} + +# attached after the image +{% if request.toolbar and request.toolbar.show_toolbar and request.toolbar.edit_mode %} + {% if has_dnd_support %} + + + + {% endif %}{# has_dnd_support #} +{% endif %} + +# attached to the css +{% if request.toolbar and request.toolbar.show_toolbar and request.toolbar.edit_mode %}js-original-image {% endif %} +{% endcomment %} + +{% comment %} +The raw image (original image) can be accessed via: + * {{ instance.file.url }} +There are additional parameters available for thumbnailing purposes: + * {{ instance.srcset.lg }} large + * {{ instance.srcset.md }} medium + * {{ instance.srcset.sm }} small + * {{ instance.srcset.xs }} extra small +Example: {% thumbnail instance.file instance.srcset.lg.size ... %} + +In addition, an iterable object is available via ``instance.srcset.items`` to +access all size settings at once. +Example: {% for device, src in instance.srcset.items %} +{% endcomment %} diff --git a/aldryn_bootstrap3/templates/aldryn_bootstrap3/plugins/image.html b/aldryn_bootstrap3/templates/aldryn_bootstrap3/plugins/image.html index 1aa386e8..f5e3b30b 100644 --- a/aldryn_bootstrap3/templates/aldryn_bootstrap3/plugins/image.html +++ b/aldryn_bootstrap3/templates/aldryn_bootstrap3/plugins/image.html @@ -1,96 +1,45 @@ -{% load i18n cms_tags thumbnail staticfiles sekizai_tags %} -{% comment %} -DOCS: https://html.spec.whatwg.org/multipage/embedded-content.html#introduction-3:viewport-based-selection-2 -the browser assumes size="100vw" by default, which means -"assume this image will be displayed at full width on the -current viewport and pick an image from srcset accordingly". +{% load i18n cms_tags thumbnail staticfiles sekizai_tags %}{% comment %} +The raw image (original image) can be accessed via: + * {{ instance.file.url }} +There are additional parameters available for thumbnailing purposes: + * {{ instance.srcset.lg }} large + * {{ instance.srcset.md }} medium + * {{ instance.srcset.sm }} small + * {{ instance.srcset.xs }} extra small +Example: {% thumbnail instance.file instance.srcset.lg.size ... %} -TODO: currently we're always upscaling the image physically. - would it be better to upscale it with css? img-response - does not seem to do that yet. -{% endcomment %} - -{# only load js and css required for dnd upload if toolbar is available #} -{% if request.toolbar and request.toolbar.show_toolbar and request.toolbar.edit_mode %} - {% addtoblock "css" %}{% endaddtoblock %} - {% addtoblock "js" %}{% endaddtoblock %} - {% addtoblock "js" %}{% endaddtoblock %} -{% endif %} - -{% spaceless %} - {% if request.toolbar and request.toolbar.show_toolbar and request.toolbar.edit_mode %} - {% if has_dnd_support %} - - {% endif %} - {% endif %} - {{ instance.alt }} - {% if request.toolbar and request.toolbar.show_toolbar and request.toolbar.edit_mode %} - {% if has_dnd_support %} - - - - {% endif %}{# has_dnd_support #} - {% endif %}{# toolbar #} -{% endspaceless %} -{% if 0 %} - 
+In addition, an iterable object is available via ``instance.srcset.items`` to
+access all size settings at once.
+Example: {% for device, src in instance.srcset.items %}
+{% endcomment %}{{ instance.alt }}
-
-    
-        {% for device, src in instance.srcset.items %}
-            {{ src|pprint }}
-        {% endfor %}
-    

-{% endif %}
+    {% endif %}
+    {{ instance.attributes_str }}
+>{# include "admin/aldryn_bootstrap3/widgets/dragndrop.html" #}
\ No newline at end of file