POC: For Style Plugin, Support Automatic Tag

TACC · Jan 18, 2022 · a4114c5 · a4114c5
1 parent d773289
commit a4114c5
Show file tree

Hide file tree

Showing 3 changed files with 93 additions and 2 deletions.
diff --git a/taccsite_cms/settings.py b/taccsite_cms/settings.py
@@ -225,10 +225,11 @@ def gettext(s): return s
                 'django_settings_export.settings_export'
             ],
             'libraries': {
-                # NOTE: These are an unnecessary alternative config, because taccsite_cms is in INSTALLED_APPS, but are comfortably explicit
+                # NOTE: These may be unnecessary alternative config, because taccsite_cms is in INSTALLED_APPS, but are comfortably explicit
                 # SEE: https://docs.djangoproject.com/en/3.1/howto/custom-template-tags/#code-layout
                 'custom_portal_settings': 'taccsite_cms.templatetags.custom_portal_settings',
                 'tacc_uri_shortcuts': 'taccsite_cms.templatetags.tacc_uri_shortcuts',
+                'preferred_tag_for_class': 'taccsite_cms.templatetags.preferred_tag_for_class',
             },
             'loaders': [
                 'django.template.loaders.filesystem.Loader',
@@ -423,6 +424,34 @@ def get_subdirs_as_module_names(path):
 
 FEATURES = ''
 
+########################
+# PLUGIN SETTINGS
+########################
+
+# https://github.com/django-cms/djangocms-style
+DJANGOCMS_STYLE_CHOICES = [
+    # https://confluence.tacc.utexas.edu/x/c5TtDg
+    'o-section o-section--style-light',
+    'o-section o-section--style-dark',
+    'c-callout',
+    'c-recognition c-recognition--style-light',
+    'c-recognition c-recognition--style-dark',
+]
+DJANGOCMS_STYLE_TAGS_DEFAULT = 'Automatic'
+DJANGOCMS_STYLE_TAGS = [
+    # CMS editor may neglect tag so we support intelligent tag choice
+    # SEE: taccsite_cms/templatetags/preferred_tag_for_class.py
+    DJANGOCMS_STYLE_TAGS_DEFAULT,
+    # Ordered by expected usage
+    'section', 'article', 'header', 'footer', 'aside', 'div',
+    # Not expected but not unreasonable
+    'h1', 'h2', 'h3', 'h4', 'h5', 'h6'
+]
+
+########################
+# SETTINGS IMPORT & EXPORT
+########################
+
 try:
     from taccsite_cms.settings_custom import *
 except:
@@ -450,5 +479,6 @@ def get_subdirs_as_module_names(path):
     'FAVICON',
     'INCLUDES_CORE_PORTAL',
     'GOOGLE_ANALYTICS_PROPERTY_ID',
-    'GOOGLE_ANALYTICS_PRELOAD'
+    'GOOGLE_ANALYTICS_PRELOAD',
+    'DJANGOCMS_STYLE_TAGS_DEFAULT'
 ]
diff --git a/taccsite_cms/templates/djangocms_style/default/style.html b/taccsite_cms/templates/djangocms_style/default/style.html
@@ -0,0 +1,23 @@
+{% load preferred_tag_for_class %}
+
+{# SEE: https://github.com/django-cms/djangocms-style/blob/9e9ba9f/djangocms_style/templates/djangocms_style/default/style.html #}
+
+{# FAQ: CMS editor may not choose a semantic tag, so we'll do it for them #}
+{% load cms_tags %}<{# NOTE: (Begin) Change from original #}{% spaceless %}
+    {{ instance.tag_type|preferred_tag_for_class:instance.class_name }}{% endspaceless %}{# NOTE: (End) Change from original #} {% spaceless %}
+    {% endspaceless %}{% if instance.id_name %}id="{{ instance.id_name }}" {% endif %}{% spaceless %}
+    {% endspaceless %}{% if instance.class_name or instance.additional_classes %}class="{% spaceless %}
+        {{ instance.class_name }} {{ instance.get_additional_classes }}
+    {% endspaceless %}"{% endif %}{% spaceless %}
+    {% endspaceless %}{% if inline_styles %} style="{{ inline_styles }}"{% endif %}{% if instance.attributes_str %} {{ instance.attributes_str }}{% endif %}>{% for plugin in instance.child_plugin_instances %}{% render_plugin plugin %}{% endfor %}</{# NOTE: (Begin) Change from original #}{{ instance.tag_type|preferred_tag_for_class:instance.class_name }}{# NOTE: (End) Change from original #}>{% comment %}
+    # The formatting of this file is very specific to remove unnecessary whitespaces
+    # Available variables:
+    {{ instance.label }}
+    {{ instance.tag_type }}
+    {{ instance.class_name }}
+    {{ instance.additional_classes }} or {{ instance.get_additional_classes }}
+    {{ instance.id_name }}
+    {{ instance.attributes_str }}
+    {{ instance.padding_top|right|bottom|left }} or {{ inline_styles }}
+    {{ instance.margin_top|right|bottom|left }} oe {{ inline_styles }}
+{% endcomment %}
diff --git a/taccsite_cms/templatetags/preferred_tag_for_class.py b/taccsite_cms/templatetags/preferred_tag_for_class.py
@@ -0,0 +1,38 @@
+from django import template
+
+from django.conf import settings
+
+register = template.Library()
+
+def preferred_tag_for_class(tag, classname):
+    """
+    Custom Template Tag Filter `preferred_tag_for_class`
+
+    Use: Get the preferred HTML tag to use for a given class
+
+    Load custom tag into template:
+        {% load preferred_tag_for_class %}
+
+    Template inline usage:
+        {% fallback_tag|preferred_tag_for_class:classname %}
+
+    Example:
+        {% with tag=instance.tag_type|preferred_tag_for_class:classname %}
+            <{{ tag }}">{% instance.tag_type %}</{{ tag }}>
+        {% endwith %}
+    """
+    new_tag = tag
+
+    # If user chose div, they
+    if (tag == settings.DJANGOCMS_STYLE_TAGS_DEFAULT):
+        if      (classname == 'o-section o-section--style-light' or
+                 classname == 'o-section o-section--style-dark'):
+            new_tag = 'section'
+        elif    (classname == 'c-callout' or
+                 classname == 'c-recognition c-recognition--style-light' or
+                 classname == 'c-recognition c-recognition--style-dark'):
+            new_tag = 'aside'
+
+    return new_tag
+
+register.filter('preferred_tag_for_class', preferred_tag_for_class)