Refs #901, adds simple content block model to concordia app in simila…

…r style to simple pages
LibraryOfCongress · Jun 11, 2019 · 9f844fb · 9f844fb
1 parent ab3541c
commit 9f844fb
Show file tree

Hide file tree

Showing 4 changed files with 150 additions and 0 deletions.
diff --git a/concordia/admin/__init__.py b/concordia/admin/__init__.py
@@ -23,6 +23,7 @@
     Item,
     Project,
     Resource,
+    SimpleContentBlock,
     SimplePage,
     SiteReport,
     Tag,
@@ -399,6 +400,17 @@ def truncated_text(self, obj):
     truncated_text.short_description = "Text"
 
 
+@admin.register(SimpleContentBlock)
+class SimpleContentBlockAdmin(admin.ModelAdmin):
+    list_display = ("label", "created_on", "updated_on")
+    readonly_fields = ("created_on", "updated_on")
+
+    fieldsets = (
+        (None, {"fields": ("created_on", "updated_on", "label")}),
+        ("Body", {"classes": ("markdown-preview",), "fields": ("body",)}),
+    )
+
+
 @admin.register(SimplePage)
 class SimplePageAdmin(admin.ModelAdmin):
     list_display = ("path", "title", "created_on", "updated_on")

diff --git a/concordia/migrations/0033_auto_20190611_1611.py b/concordia/migrations/0033_auto_20190611_1611.py
@@ -0,0 +1,38 @@
+# Generated by Django 2.2.1 on 2019-06-11 20:11
+
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [("concordia", "0032_topic_ordering")]
+
+    operations = [
+        migrations.CreateModel(
+            name="SimpleContentBlock",
+            fields=[
+                (
+                    "id",
+                    models.AutoField(
+                        auto_created=True,
+                        primary_key=True,
+                        serialize=False,
+                        verbose_name="ID",
+                    ),
+                ),
+                ("created_on", models.DateTimeField(auto_now_add=True)),
+                ("updated_on", models.DateTimeField(auto_now=True)),
+                (
+                    "label",
+                    models.CharField(
+                        help_text=(
+                            "Label that is used to refer to this content in the code"
+                        ),
+                        max_length=255,
+                    ),
+                ),
+                ("body", models.TextField()),
+            ],
+        ),
+        migrations.AlterModelOptions(name="topic", options={}),
+    ]
diff --git a/concordia/models.py b/concordia/models.py
@@ -357,6 +357,21 @@ class AssetTranscriptionReservation(models.Model):
     updated_on = models.DateTimeField(auto_now=True)
 
 
+class SimpleContentBlock(models.Model):
+    created_on = models.DateTimeField(editable=False, auto_now_add=True)
+    updated_on = models.DateTimeField(editable=False, auto_now=True)
+
+    label = models.CharField(
+        max_length=255,
+        help_text="Label that is used to refer to this content in the code",
+    )
+
+    body = models.TextField()
+
+    def __str__(self):
+        return f"SimpleContentBlock: {self.label}"
+
+
 class SimplePage(models.Model):
     created_on = models.DateTimeField(editable=False, auto_now_add=True)
     updated_on = models.DateTimeField(editable=False, auto_now=True)

diff --git a/concordia/templates/admin/concordia/simplecontentblock/change_form.html b/concordia/templates/admin/concordia/simplecontentblock/change_form.html
@@ -0,0 +1,85 @@
+{% extends "admin/change_form.html" %}
+
+{% block extrahead %}
+    {{ block.super }}
+
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.42.0/codemirror.min.css" integrity="sha256-I8NyGs4wjbMuBSUE40o55W6k6P7tu/7G28/JGUUYCIs=" crossorigin="anonymous" />
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha256-YLGeXaapI0/5IgZopewRJcFXomhRMlYYjugPLSyNjTY=" crossorigin="anonymous" />
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.42.0/codemirror.min.js" integrity="sha256-cEZZfu/xNhXjnj1TRr9CrIGoAZ2hztIzwNTUv0Zcll8=" crossorigin="anonymous"></script>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.42.0/mode/markdown/markdown.min.js" integrity="sha256-BZXkUzlSBobUXEiSFbDIbTc/DOqhNdegF/iK5m99kbk=" crossorigin="anonymous"></script>
+    <script src="https://cdn.jsdelivr.net/npm/prettier@1.15.2/standalone.js" integrity="sha256-J+EGJvtGc2C0TOj2teUqFDcW5ovV2oimUkdea60++qE=" crossorigin="anonymous"></script>
+    <script src="https://cdn.jsdelivr.net/npm/prettier@1.15.2/parser-markdown.js" integrity="sha256-ceDp4sXOqX8LdQaP9OsnQ1oS1JTlt4vwIVdBmCxPkME=" crossorigin="anonymous"></script>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/remarkable/1.7.1/remarkable.min.js" integrity="sha256-ltAts6+/XysEs9E5RF/t0H+0eD3ET6NpbqzshWkqeic=" crossorigin="anonymous"></script>
+{% endblock extrahead %}
+
+{% block content %}
+    {{ block.super }}
+
+    <script>
+        (function($) {
+            var md = new Remarkable({ html: true });
+
+            var $bodyRow = $(".field-body");
+            $bodyRow.find("label").remove();
+
+            var $bodyPreview = $('<div id="id_body_preview" class="container">');
+            $bodyPreview.insertAfter("#id_body");
+
+            var editor = CodeMirror.fromTextArea(document.getElementById("id_body"), {
+                mode: "markdown",
+                lineNumbers: true,
+                highlightFormatting: true,
+                indentUnit: 4,
+                lineWrapping: true,
+            });
+
+            var queuedUpdate;
+
+            editor.on("change", queueUpdate);
+
+            function queueUpdate() {
+                if (queuedUpdate) {
+                    window.cancelAnimationFrame(queuedUpdate);
+                }
+                queuedUpdate = window.requestAnimationFrame(updatePreview);
+            }
+
+            function updatePreview() {
+                $bodyPreview.empty().html(md.render(editor.getValue()));
+            }
+
+            $('<button class="button">Run Prettier</button>')
+                .prependTo(".field-body")
+                .on("click", function(evt) {
+                    evt.preventDefault();
+                    var pretty = prettier.format(editor.getValue(), {
+                        parser: "markdown",
+                        plugins: prettierPlugins,
+                        printWidth: 120,
+                        tabWidth: 4
+                    });
+
+                    editor.setValue(pretty);
+                    queueUpdate();
+
+                    return false;
+                });
+
+            updatePreview();
+        })(django.jQuery);
+    </script>
+
+    <style>
+        .field-body > div {
+            display: flex;
+            width: 100%;
+        }
+
+        .field-body > div > * {
+            flex-basis: 50%;
+            overflow-y: auto;
+
+            min-height: 500px;
+        }
+    </style>
+{% endblock content %}