feat: Support djangocms-static-ace to load ace code editor from static files (#156)

Author: fsbraun

CHANGELOG.rst

@@ -2,6 +2,10 @@
 Changelog
 =========
 
+unreleased
+==========
+
+* Added support for djangocms-static-ace to serve the ace code editor locally
 
 2.0.0 (2020-09-02)
 ==================

README.rst

@@ -83,6 +83,13 @@ For a manual install:
 
 * run ``python manage.py migrate``
 
+The Code plugin uses the ace code editor which is loaded from a CDN by default.
+If you want the ace code editor to be served from static files, please use
+``djangocms-bootstrap4[static-ace]`` instead of ``djangocms-bootstrap4`` in your
+requirements or with pip. Make the static files fore the ace code editor available
+to your project by adding ``djangocms_static_ace`` to your project's
+``INSTALLED_APPS``.
+
 
 Configuration
 -------------
@@ -110,7 +117,8 @@ It provides the following **standard** Bootstrap 4 components:
 * `Tabs <https://getbootstrap.com/docs/4.0/components/navs/#tabs>`_
 * `Utilities (Spacing) <https://getbootstrap.com/docs/4.0/utilities/>`_
 
-django CMS Bootstrap 4 **does not** add the styles or javascript files to your frontend, these need to be added at your discretion.
+django CMS Bootstrap 4 **does not** add the styles or javascript files to your
+frontend, these need to be added at your discretion.
 
 
 Settings

djangocms_bootstrap4/contrib/bootstrap4_content/forms.py

@@ -1,8 +1,16 @@
+from django.conf import settings as django_settings
 from django.forms.models import ModelForm
 from django.forms.widgets import Textarea
 
 
 class Bootstrap4CodeForm(ModelForm):
+    class Media:
+        js = (
+            "admin/vendor/ace/ace.js"
+            if "djangocms_static_ace" in django_settings.INSTALLED_APPS
+            else "https://cdnjs.cloudflare.com/ajax/libs/ace/1.9.6/ace.js",
+        )
+
     class Meta:
         # When used inside djangocms-text-ckeditor
         # this causes the label field to be prefilled with the selected text.

djangocms_bootstrap4/contrib/bootstrap4_content/templates/djangocms_bootstrap4/admin/code.html

@@ -1,10 +1,7 @@
 {% extends "admin/change_form.html" %}
 
 {% block object-tools %}
-{{ block.super }}
-
-<script src="https://cdnjs.cloudflare.com/ajax/libs/ace/1.2.9/ace.js"></script>
-<script>
+{{ block.super }}<script>
 django.jQuery(function () {
     // ace editor cannot be attached directly to a textarea
     var textarea = django.jQuery('textarea').css('display', 'none');
@@ -18,7 +15,19 @@
 
     // init editor with settings
     var editor = ace.edit(div[0]);
-    editor.setTheme('ace/theme/github');
+    var darkMode;
+
+    if (window.parent.CMS.API.Helpers.getColorScheme) {
+        darkMode = window.parent.CMS.API.Helpers.getColorScheme() === 'dark';
+    } else {
+        // django CMS pre-3.11.1
+        darkMode =  window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches;
+    }
+    if (darkMode) {
+        editor.setTheme('ace/theme/tomorrow_night');
+    }  else {
+        editor.setTheme('ace/theme/github');
+    }
     editor.getSession().setValue(textarea.val());
     editor.getSession().setMode('ace/mode/html');
     editor.setOptions({

setup.py

@@ -15,6 +15,13 @@
 ]
 
 
+EXTRA_REQUIREMENTS = {
+    "static-ace": [
+        "djangocms-static-ace",
+    ]
+}
+
+
 CLASSIFIERS = [
     'Development Status :: 5 - Production/Stable',
     'Environment :: Web Environment',
@@ -56,6 +63,7 @@
     include_package_data=True,
     zip_safe=False,
     install_requires=REQUIREMENTS,
+    extras_require=EXTRA_REQUIREMENTS,
     classifiers=CLASSIFIERS,
     test_suite='tests.settings.run',
 )

tests/test_migrations.py

@@ -4,12 +4,18 @@
 
 from django.core.management import call_command
 from django.test import TestCase, override_settings
+from cms import __version__
+from distutils.version import LooseVersion
 
 
 class MigrationTestCase(TestCase):
 
     @override_settings(MIGRATION_MODULES={})
     def test_for_missing_migrations(self):
+        if LooseVersion("3.9") <= LooseVersion(__version__) < LooseVersion("3.10"):
+            # django-cms 3.9 creates migrations to BigAutoField hence skip this test
+            return
+
         output = StringIO()
         options = {
             'interactive': False,