From dc91ef571fff775084d061091290b9e8d7073dd4 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Jon=C3=A1=C5=A1=20Havelka?= Date: Tue, 19 Nov 2024 22:05:12 +0100 Subject: [PATCH 1/2] Upgrade CKEditoru na verzi 5 --- mamweb/admin.py | 4 +- mamweb/settings_common.py | 109 +++++++++++++++++++++++----- mamweb/static/css/ckeditor5_fix.css | 3 + mamweb/urls.py | 2 +- novinky/admin.py | 4 +- requirements.txt | 2 +- soustredeni/admin.py | 4 +- various/storage.py | 11 +++ 8 files changed, 112 insertions(+), 27 deletions(-) create mode 100644 mamweb/static/css/ckeditor5_fix.css create mode 100644 various/storage.py diff --git a/mamweb/admin.py b/mamweb/admin.py index ba3d9648..a58df505 100644 --- a/mamweb/admin.py +++ b/mamweb/admin.py @@ -13,11 +13,11 @@ from django.contrib.flatpages.admin import FlatPageAdmin as FlatPageAdminOld from django.contrib.flatpages.admin import FlatpageForm as FlatpageFormOld from django import forms -from ckeditor_uploader.widgets import CKEditorUploadingWidget +from django_ckeditor_5.widgets import CKEditor5Widget class FlatpageForm(FlatpageFormOld): - content = forms.CharField(widget=CKEditorUploadingWidget()) + content = forms.CharField(widget=CKEditor5Widget()) class Meta: model = FlatPage # this is not automatically inherited from FlatpageFormOld exclude = [] diff --git a/mamweb/settings_common.py b/mamweb/settings_common.py index 55817b6d..3bfbcfc4 100644 --- a/mamweb/settings_common.py +++ b/mamweb/settings_common.py @@ -110,8 +110,7 @@ INSTALLED_APPS = ( 'reversion', 'django_countries', 'solo', - 'ckeditor', - 'ckeditor_uploader', + 'django_ckeditor_5', 'taggit', 'dal', 'dal_select2', @@ -186,26 +185,98 @@ SUMMERNOTE_CONFIG = { ] } -CKEDITOR_UPLOAD_PATH = "uploads/" -CKEDITOR_IMAGE_BACKEND = 'pillow' -#CKEDITOR_JQUERY_URL = '//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js' -CKEDITOR_CONFIGS = { +CKEDITOR_5_CUSTOM_CSS = "css/ckeditor5_fix.css" +# customColorPalette = [ +# { +# 'color': 'hsl(4, 90%, 58%)', +# 'label': 'Red', +# }, +# { +# 'color': 'hsl(340, 82%, 52%)', +# 'label': 'Pink', +# }, +# { +# 'color': 'hsl(291, 64%, 42%)', +# 'label': 'Purple', +# }, +# { +# 'color': 'hsl(262, 52%, 47%)', +# 'label': 'Deep Purple', +# }, +# { +# 'color': 'hsl(231, 48%, 48%)', +# 'label': 'Indigo', +# }, +# { +# 'color': 'hsl(207, 90%, 54%)', +# 'label': 'Blue', +# }, +# ] +CKEDITOR_5_FILE_STORAGE = "various.storage.UploadStorage" +CKEDITOR_5_CONFIGS = { 'default': { - 'entities': False, - 'toolbar': [ - ['Source', 'ShowBlocks', '-', 'Maximize'], - ['Bold', 'Italic', 'Subscript', 'Superscript', '-', 'RemoveFormat'], - ['NumberedList','BulletedList','-','Blockquote','-','JustifyLeft','JustifyCenter','JustifyRight','JustifyBlock'], - ['Link', 'Unlink', 'Anchor', '-', 'Image', 'Table', 'HorizontalRule'], - ['Format'], - + 'language': 'cs', + 'blockToolbar': [ + 'paragraph', 'heading1', 'heading2', 'heading3', + '|', + 'bulletedList', 'numberedList', + '|', + 'blockQuote', ], -# 'toolbar': 'full', - 'height': '40em', - 'width': '100%', - 'toolbarStartupExpanded': False, - 'allowedContent' : True, + 'toolbar': ['sourceEditing', '|', 'heading', '|', + # 'outdent', 'indent', '|', + 'bold', 'italic', 'link', 'underline', 'strikethrough', + 'code', + # 'subscript', 'superscript', + # 'highlight', + '|', 'codeBlock', 'insertImage', + 'bulletedList', 'numberedList', 'todoList', '|', + # 'blockQuote', '|', + # 'fontSize', 'fontFamily', 'fontColor', 'fontBackgroundColor', + # 'mediaEmbed', + 'removeFormat', + # 'insertTable', + ], + 'image': { + 'toolbar': ['imageTextAlternative', '|', 'imageStyle:alignLeft', + 'imageStyle:alignRight', 'imageStyle:alignCenter', 'imageStyle:side', '|'], + 'styles': [ + 'full', + 'side', + 'alignLeft', + 'alignRight', + 'alignCenter', + ] + + }, + # 'table': { + # 'contentToolbar': [ 'tableColumn', 'tableRow', 'mergeTableCells', + # 'tableProperties', 'tableCellProperties' ], + # 'tableProperties': { + # 'borderColors': customColorPalette, + # 'backgroundColors': customColorPalette, + # }, + # 'tableCellProperties': { + # 'borderColors': customColorPalette, + # 'backgroundColors': customColorPalette, + # } + # }, + 'heading' : { + 'options': [ + { 'model': 'paragraph', 'title': 'Paragraph', 'class': 'ck-heading_paragraph' }, + { 'model': 'heading1', 'view': 'h1', 'title': 'Heading 1', 'class': 'ck-heading_heading1' }, + { 'model': 'heading2', 'view': 'h2', 'title': 'Heading 2', 'class': 'ck-heading_heading2' }, + { 'model': 'heading3', 'view': 'h3', 'title': 'Heading 3', 'class': 'ck-heading_heading3' }, + ] + }, }, + 'list': { + 'properties': { + 'styles': 'true', + 'startIndex': 'true', + 'reversed': 'true', + }, + } } # Webpack loader diff --git a/mamweb/static/css/ckeditor5_fix.css b/mamweb/static/css/ckeditor5_fix.css new file mode 100644 index 00000000..3c53ce82 --- /dev/null +++ b/mamweb/static/css/ckeditor5_fix.css @@ -0,0 +1,3 @@ +.ck.ck-editor { + color: black !important; +} diff --git a/mamweb/urls.py b/mamweb/urls.py index 42761c1f..eed460c2 100644 --- a/mamweb/urls.py +++ b/mamweb/urls.py @@ -15,7 +15,7 @@ urlpatterns = [ # Admin a nastroje path('admin/', admin.site.urls), # NOQA - path('ckeditor/', include('ckeditor_uploader.urls')), + path("ckeditor5/", include('django_ckeditor_5.urls')), # Tvorba = ročníky, čísla, problémy atd. (ma vlastni podadresare) path('', include('tvorba.urls')), diff --git a/novinky/admin.py b/novinky/admin.py index eecef739..98ea9b58 100644 --- a/novinky/admin.py +++ b/novinky/admin.py @@ -1,7 +1,7 @@ import django.forms from django.contrib import admin -from ckeditor_uploader.widgets import CKEditorUploadingWidget +from django_ckeditor_5.widgets import CKEditor5Widget from .models import Novinky @@ -10,7 +10,7 @@ class NovinkyAdminForm(django.forms.ModelForm): class Meta: model = Novinky widgets = { - 'text': CKEditorUploadingWidget, + 'text': CKEditor5Widget, } fields = '__all__' diff --git a/requirements.txt b/requirements.txt index bba1bad0..96aa4d7d 100644 --- a/requirements.txt +++ b/requirements.txt @@ -14,7 +14,7 @@ Django<5.0 django-reversion # Version control na datech v databázi django-countries # Políčko ve formu / field v modelu ohledně států django-solo # Singleton model (speciálně Nastavení) -django-ckeditor # Editor htmlka (hlavně v adminu u flatpages) +django-ckeditor-5 # Editor htmlka (hlavně v adminu u flatpages) django-cleanup # Uklízí media/ od smazaných „databázových“ souborů django-taggit # Taggy v djangu (speciálně zaměření problémů) django-autocomplete-light>=3.9.0 # Automatické doplňování (problémů, účastníků, …) ve formulářích diff --git a/soustredeni/admin.py b/soustredeni/admin.py index 2f84eb59..0e038d62 100644 --- a/soustredeni/admin.py +++ b/soustredeni/admin.py @@ -3,7 +3,7 @@ from django.contrib import admin from django.forms import widgets from django.db import models -from ckeditor_uploader.widgets import CKEditorUploadingWidget +from django_ckeditor_5.widgets import CKEditor5Widget import soustredeni.models as m @@ -42,7 +42,7 @@ class SoustredeniAdminForm(django.forms.ModelForm): class Meta: model = m.Soustredeni widgets = { - 'text': CKEditorUploadingWidget, + 'text': CKEditor5Widget, } fields = '__all__' diff --git a/various/storage.py b/various/storage.py new file mode 100644 index 00000000..9a4ecdd1 --- /dev/null +++ b/various/storage.py @@ -0,0 +1,11 @@ +import os +from urllib.parse import urljoin + +from django.conf import settings +from django.core.files.storage import FileSystemStorage + +class UploadStorage(FileSystemStorage): + """Storage pro CKEditor""" + + location = os.path.join(settings.MEDIA_ROOT, "uploads") + base_url = urljoin(settings.MEDIA_URL, "uploads/") From 5853b243ddd2e6a03b814989866c5233a7a3438b Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Jon=C3=A1=C5=A1=20Havelka?= Date: Tue, 26 Nov 2024 18:34:54 +0100 Subject: [PATCH 2/2] =?UTF-8?q?Koment=C3=A1=C5=99?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- mamweb/static/css/ckeditor5_fix.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/mamweb/static/css/ckeditor5_fix.css b/mamweb/static/css/ckeditor5_fix.css index 3c53ce82..9cfdc5e2 100644 --- a/mamweb/static/css/ckeditor5_fix.css +++ b/mamweb/static/css/ckeditor5_fix.css @@ -1,3 +1,3 @@ .ck.ck-editor { - color: black !important; + color: black !important; /* V tmavém módu zapomene CKEditor přepnout barvu textu. (Bílý text na bílém pozadí je best.) */ }