Merge pull request #914 from rolandgeider/issue-626

Add CKeditor to the agenda item text field

openslides/agenda/forms.py

@@ -16,16 +16,19 @@ from django import forms
 from django.utils.translation import ugettext_lazy
 from mptt.forms import TreeNodeChoiceField
 
-from openslides.utils.forms import CssClassMixin
+from openslides.utils.forms import CssClassMixin, CleanHtmlFormMixin
 from openslides.utils.person.forms import PersonFormField
 
 from .models import Item, Speaker
 
 
-class ItemForm(CssClassMixin, forms.ModelForm):
+class ItemForm(CleanHtmlFormMixin, CssClassMixin, forms.ModelForm):
     """
     Form to create of update an item.
     """
+
+    clean_html_fields = ('text', )
+
     parent = TreeNodeChoiceField(
         queryset=Item.objects.all(), label=ugettext_lazy("Parent item"), required=False)
 

openslides/agenda/templates/agenda/edit.html

@@ -2,6 +2,7 @@
 
 {% load i18n %}
 {% load tags %}
+{% load staticfiles %}
 
 {% block title %}
     {% if item %}
@@ -12,6 +13,23 @@
     – {{ block.super }}
 {% endblock %}
 
+{% block header %}
+    {{ block.super }}
+    <link type="text/css" rel="stylesheet" media="all" href="{% static 'styles/ckeditor.css' %}" />
+{% endblock %}
+
+{% block javascript %}
+    {{ block.super }}
+    <script type="text/javascript" src="{% static 'javascript/ckeditor/ckeditor.js' %}"></script>
+    <script type="text/javascript" src="{% static 'javascript/ckeditor-config.js' %}"></script>
+    <script>
+        // Init CKeditor
+        $(function() {
+            CKEDITOR.replace('id_text', ck_options);
+        });
+    </script>
+{% endblock %}
+
 {% block content %}
     <h1>
         {% if item %}

openslides/agenda/templates/agenda/view.html

@@ -44,7 +44,7 @@
 </h1>
 <p>
     {% if not item.content_object %}
-        {{ item.text|safe|linebreaks }}
+        {{ item.text|safe }}
     {% else %}
         <a href="{{ item.content_object|absolute_url }}" class="btn btn-small">{% trans item.content_type.name %} {{ item.content_object }}</a>
     {% endif %}

openslides/motion/templates/motion/motion_form.html

@@ -5,12 +5,14 @@
 {% load staticfiles %}
 
 {% block header %}
+    {{ block.super }}
     <link type="text/css" rel="stylesheet" media="all" href="{% static 'styles/motion.css' %}" />
     <link type="text/css" rel="stylesheet" media="all" href="{% static 'styles/ckeditor.css' %}" />
     <link href="{% static 'styles/jquery.bsmselect.css' %}" type="text/css" rel="stylesheet" />
 {% endblock %}
 
 {% block javascript %}
+    {{ block.super }}
     <script type="text/javascript" src="{% static 'javascript/ckeditor/ckeditor.js' %}"></script>
     <script type="text/javascript" src="{% static 'javascript/ckeditor-config.js' %}"></script>
     <script type="text/javascript" src="{% static 'javascript/jquery.bsmselect.js' %}"></script>
@@ -24,6 +26,12 @@
           listItemLabelClass: 'bsmListItemLabel-custom',
           removeClass: 'bsmListItemRemove-custom'
         });
+
+        // Init CKeditor
+        $(function() {
+            CKEDITOR.replace('id_text', ck_options);
+            CKEDITOR.replace('id_reason', ck_options);
+        });
     </script>
 {% endblock %}
 

openslides/static/javascript/ckeditor-config.js

@@ -1,49 +1,44 @@
 /*
  * Configuration file for the CKeditor
  */
-$(function() {
+var ck_options = {
-        var ck_options = {
 
-                // Using a custom CSS file allows us to specifically style elements entered
+        // Using a custom CSS file allows us to specifically style elements entered
-                // using the editor. Using the CSS prefix class .ckeditor_html prevents these
+        // using the editor. Using the CSS prefix class .ckeditor_html prevents these
-                // styles from meddling with the main layout
+        // styles from meddling with the main layout
 
-                contentsCss: "/static/styles/ckeditor.css",
+        contentsCss: "/static/styles/ckeditor.css",
-                bodyClass: "ckeditor_html",
+        bodyClass: "ckeditor_html",
 
-                allowedContent:
+        allowedContent:
-                        'h1 h2 h3 pre blockquote b i u strike;' +
+                'h1 h2 h3 pre blockquote b i u strike;' +
 
-                        // A workaround for the problem described in http://dev.ckeditor.com/ticket/10192
+                // A workaround for the problem described in http://dev.ckeditor.com/ticket/10192
-                        // Hopefully, the problem will be solved in the final version of CKEditor 4.1
+                // Hopefully, the problem will be solved in the final version of CKEditor 4.1
-                        // If so, then {margin-left} can be removed
+                // If so, then {margin-left} can be removed
-                        'p{margin-left};' +
+                'p{margin-left};' +
 
-                        'a[!href];' +
+                'a[!href];' +
-                        'table tr th td caption;' +
+                'table tr th td caption;' +
-                        'ol ul li;' +
+                'ol ul li;' +
-                        'span{!font-family};' +
+                'span{!font-family};' +
-                        'span{!color};',
+                'span{!color};',
-                removePlugins: "save, print, preview, pagebreak, templates, showblocks, magicline",
+        removePlugins: "save, print, preview, pagebreak, templates, showblocks, magicline",
 
-                // Not part of the standard package of CKEditor
+        // Not part of the standard package of CKEditor
-                // http://ckeditor.com/addon/insertpre
+        // http://ckeditor.com/addon/insertpre
-                extraPlugins: "insertpre",
+        extraPlugins: "insertpre",
 
-                toolbar_Full: [
+        toolbar_Full: [
-                        { name: 'document',    items : [ 'Source','-','Save','DocProps','Preview','Print','-','Templates' ] },
+                { name: 'document',    items : [ 'Source','-','Save','DocProps','Preview','Print','-','Templates' ] },
-                        { name: 'clipboard',   items : [ 'Cut','Copy','Paste','PasteText','PasteFromWord','-','Undo','Redo' ] },
+                { name: 'clipboard',   items : [ 'Cut','Copy','Paste','PasteText','PasteFromWord','-','Undo','Redo' ] },
-                        { name: 'editing',     items : [ 'Find','Replace','-','SpellChecker', 'Scayt' ] },
+                { name: 'editing',     items : [ 'Find','Replace','-','SpellChecker', 'Scayt' ] },
-                        { name: 'forms',       items : [ 'Form', 'Checkbox', 'Radio', 'TextField', 'Textarea', 'Select', 'Button', 'ImageButton', 'HiddenField' ] },
+                { name: 'forms',       items : [ 'Form', 'Checkbox', 'Radio', 'TextField', 'Textarea', 'Select', 'Button', 'ImageButton', 'HiddenField' ] },
-                        { name: 'basicstyles', items : [ 'Bold','Italic','Underline','Strike','Subscript','Superscript','-','RemoveFormat' ] },
+                { name: 'basicstyles', items : [ 'Bold','Italic','Underline','Strike','Subscript','Superscript','-','RemoveFormat' ] },
-                        { name: 'paragraph',   items : [ 'NumberedList','BulletedList','-','Pre','InsertPre','CreateDiv','-','JustifyLeft','JustifyCenter','JustifyRight','JustifyBlock','-','BidiLtr','BidiRtl' ] },
+                { name: 'paragraph',   items : [ 'NumberedList','BulletedList','-','Pre','InsertPre','CreateDiv','-','JustifyLeft','JustifyCenter','JustifyRight','JustifyBlock','-','BidiLtr','BidiRtl' ] },
-                        { name: 'links',       items : [ 'Link','Unlink','Anchor' ] },
+                { name: 'links',       items : [ 'Link','Unlink','Anchor' ] },
-                        { name: 'styles',      items : [ 'Format','FontSize' ] },
+                { name: 'styles',      items : [ 'Format','FontSize' ] },
-                        { name: 'tools',       items : [ 'Maximize', 'ShowBlocks','-','About' ] }
+                { name: 'tools',       items : [ 'Maximize', 'ShowBlocks','-','About' ] }
-                ],
+        ],
-                toolbar: 'Full'
+        toolbar: 'Full'
-        };
+};
-
-        CKEDITOR.replace('id_text', ck_options);
-        CKEDITOR.replace('id_reason', ck_options);
-});