From cee386941b5328f4f9823cd5ba885b9a0b9770ca Mon Sep 17 00:00:00 2001 From: Kenny Wolf Date: Tue, 6 Sep 2022 11:06:29 +0200 Subject: [PATCH 1/4] Create for loop to initialize multiple textareas In some applications there may be multiple textareas to add in a form. --- .../django-editorjs-fields/js/django-editorjs-fields.js | 8 +++++--- 1 file changed, 5 insertions(+), 3 deletions(-) diff --git a/django_editorjs_fields/static/django-editorjs-fields/js/django-editorjs-fields.js b/django_editorjs_fields/static/django-editorjs-fields/js/django-editorjs-fields.js index dd82a3f0..c90cc0d0 100644 --- a/django_editorjs_fields/static/django-editorjs-fields/js/django-editorjs-fields.js +++ b/django_editorjs_fields/static/django-editorjs-fields/js/django-editorjs-fields.js @@ -163,10 +163,12 @@ // Event if (typeof django === "object" && django.jQuery) { django.jQuery(document).on("formset:added", function (event, $row) { - var textarea = $row.find("[data-editorjs-textarea]").get(0) + var areas = $row.find("[data-editorjs-textarea]").get() - if (textarea) { - initEditorJsField(textarea) + if (areas) { + for (let i = 0; i < areas.length; i++) { + initEditorJsField(areas[i]) + } } }) } From 6bb85de31f3860bfb160a0aa30ea4a8b9c98cfa5 Mon Sep 17 00:00:00 2001 From: Ilya Kotlyakov Date: Fri, 16 Sep 2022 16:46:46 +0200 Subject: [PATCH 2/4] Update Dark Theme for Editor.js --- .gitignore | 6 +- django_editorjs_fields/config.py | 2 +- .../css/django-editorjs-fields.css | 211 ++++++++++++------ example/example/settings.py | 4 +- 4 files changed, 144 insertions(+), 79 deletions(-) diff --git a/.gitignore b/.gitignore index 74ed2be2..01014219 100644 --- a/.gitignore +++ b/.gitignore @@ -1,7 +1,9 @@ -/.DS_Store -/.vscode +.DS_Store +.vscode +.idea venv/ +.venv/ dist/ __pycache__ diff --git a/django_editorjs_fields/config.py b/django_editorjs_fields/config.py index 23a6e91b..e213ecdb 100644 --- a/django_editorjs_fields/config.py +++ b/django_editorjs_fields/config.py @@ -5,7 +5,7 @@ DEBUG = getattr(settings, "DEBUG", False) -VERSION = getattr(settings, "EDITORJS_VERSION", '2.22.2') +VERSION = getattr(settings, "EDITORJS_VERSION", '2.25.0') # ATTACHMENT_REQUIRE_AUTHENTICATION = str( # getattr(settings, "EDITORJS_ATTACHMENT_REQUIRE_AUTHENTICATION", True) diff --git a/django_editorjs_fields/static/django-editorjs-fields/css/django-editorjs-fields.css b/django_editorjs_fields/static/django-editorjs-fields/css/django-editorjs-fields.css index e559dfb5..b35cd91a 100644 --- a/django_editorjs_fields/static/django-editorjs-fields/css/django-editorjs-fields.css +++ b/django_editorjs_fields/static/django-editorjs-fields/css/django-editorjs-fields.css @@ -1,101 +1,164 @@ div[data-editorjs-holder] { - display: inline-block; - width: 100%; - max-width: 750px; - padding: 1.5em 1em; - border: 1px solid #ccc; - border-radius: 4px; - background-color: #fcfeff; + display: inline-block; + width: 100%; + max-width: 750px; + padding: 1.5em 1em; + border: 1px solid #ccc; + border-radius: 4px; + background-color: #fcfeff; } + .codex-editor .ce-rawtool__textarea { - background-color: #010e15; - color: #ccced2; + background-color: #010e15; + color: #ccced2; } + .codex-editor .cdx-list { - margin: 0; - padding-left: 32px; - outline: none; + margin: 0; + padding-left: 32px; + outline: none; } + .codex-editor .cdx-list__item { - padding: 8px; - line-height: 1.4em; - list-style: inherit; + padding: 8px; + line-height: 1.4em; + list-style: inherit; } + .codex-editor .cdx-checklist__item-text { - align-self: center; + align-self: center; } + .codex-editor .ce-header { - padding: 1em 0; - margin: 0; - margin-bottom: -1em; - line-height: 1.4em; - outline: none; - background: transparent; - color: #000; - font-weight: 800; - text-transform: initial; + padding: 1em 0; + margin: 0; + margin-bottom: -1em; + line-height: 1.4em; + outline: none; + background: transparent; + color: #000; + font-weight: 800; + text-transform: initial; } + .codex-editor h2.ce-header { - font-size: 1.5em; + font-size: 1.5em; } + .codex-editor h3.ce-header { - font-size: 1.3em; + font-size: 1.3em; } + .codex-editor h4.ce-header { - font-size: 1.1em; + font-size: 1.1em; } + .codex-editor blockquote { - border: initial; - margin: initial; - color: initial; - font-size: inherit; + border: initial; + margin: initial; + color: initial; + font-size: inherit; } + .codex-editor .wrapper .cdx-button { - display: none; + display: none; } + .codex-editor .link-tool__progress { - float: initial; - width: 100%; - line-height: initial; - padding: initial; + float: initial; + width: 100%; + line-height: initial; + padding: initial; } + @media (max-width: 767px) { - div[data-editorjs-holder] { - width: auto; - } - .aligned .form-row, - .aligned .form-row > div { - flex-direction: column; - } + div[data-editorjs-holder] { + width: auto; + } + + .aligned .form-row, + .aligned .form-row>div { + flex-direction: column; + } } + @media (prefers-color-scheme: dark) { - .change-form #container #content-main div[data-editorjs-holder] { - border: 1px solid var(--border-color); - background-color: var(--body-bg); - } - .change-form #container #content-main .link-tool__input { - color: var(--primary); - } - .change-form #container #content-main .codex-editor .ce-header, - .change-form #container #content-main .codex-editor blockquote { - color: var(--body-fg); - } - .change-form #container #content-main .codex-editor .ce-rawtool__textarea { - background-color: #264b5d; - color: #fbfbfb; - } - .change-form #container #content-main .cdx-marker { - background: #fff03b; - } - .change-form #container #content-main .ce-inline-toolbar { - color: #000; - } - .change-form #container #content-main ::-moz-selection, - .change-form #container #content-main ::selection { - color: #fff; - background: #616161; - } - .change-form #container #content-main .ce-block--selected .ce-block__content { - background: #426b8a; - } -} + + .tc-popover, + .tc-wrap { + --color-border: #4c6b7a !important; + --color-background: #264b5d !important; + --color-background-hover: #162a34 !important; + --color-text-secondary: #fbfbfb !important; + } + + .change-form #container #content-main div[data-editorjs-holder] { + border: 1px solid var(--border-color); + background-color: var(--body-bg); + } + + .change-form #container #content-main .link-tool__input { + color: var(--primary); + } + + .change-form #container #content-main .codex-editor .ce-header, + .change-form #container #content-main .codex-editor blockquote { + color: var(--body-fg); + } + + .change-form #container #content-main .codex-editor .ce-rawtool__textarea { + background-color: #264b5d; + color: #fbfbfb; + } + + .change-form #container #content-main .cdx-marker { + background: #fff03b; + } + + .change-form #container #content-main .ce-inline-toolbar { + color: #000; + } + + .change-form #container #content-main ::-moz-selection, + .change-form #container #content-main ::selection { + color: #fff; + background: #616161; + } + + .change-form #container #content-main .ce-block--selected .ce-block__content { + background: #426b8a; + } + + .change-form #container #content-main .codex-editor svg { + fill: #fff + } + + .change-form #container #content-main .ce-toolbar__plus:hover, + .change-form #container #content-main .ce-toolbar__settings-btn:hover { + background-color: #264b5d; + } + + .change-form #container #content-main .ce-popover__item-icon, + .change-form #container #content-main .ce-conversion-tool__icon { + background: #2fa9a9; + } + + .change-form #container #content-main .ce-popover, + .change-form #container #content-main .ce-settings, + .change-form #container #content-main .ce-inline-toolbar, + .change-form #container #content-main .ce-conversion-toolbar { + background-color: #264b5d; + border-color: #4c6b7a; + color: #fbfbfb + } + + .change-form #container #content-main .ce-popover__item:hover, + .change-form #container #content-main .ce-settings__button:hover, + .change-form #container #content-main .cdx-settings-button:hover, + .change-form #container #content-main .ce-inline-toolbar__dropdown:hover, + .change-form #container #content-main .ce-inline-tool:hover, + .change-form #container #content-main .ce-conversion-tool:hover { + background-color: #162a34; + color: #fff + } +} \ No newline at end of file diff --git a/example/example/settings.py b/example/example/settings.py index 1695a7a3..cefc992a 100644 --- a/example/example/settings.py +++ b/example/example/settings.py @@ -88,7 +88,7 @@ 'ENGINE': 'django.db.backends.postgresql', 'NAME': 'test_django', 'USER': 'postgres', - 'PASSWORD': 'toor', + 'PASSWORD': 'postgres', 'HOST': '127.0.0.1', 'PORT': '5432', } @@ -167,7 +167,7 @@ MEDIA_URL = "/media/" # django_editorjs_fields -EDITORJS_VERSION = '2.22.3' +EDITORJS_VERSION = '2.25.0' # EDITORJS_IMAGE_NAME_ORIGINAL = True # EDITORJS_IMAGE_UPLOAD_PATH_DATE = None # EDITORJS_IMAGE_NAME = lambda filename, **_: f"{filename}_12345" From cb03ade7cbc3ffd08bd3a95fd3a5d6540e57314f Mon Sep 17 00:00:00 2001 From: Ilya Kotlyakov Date: Fri, 16 Sep 2022 16:49:09 +0200 Subject: [PATCH 3/4] Update README.md --- README.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/README.md b/README.md index 87e24126..0fa12336 100644 --- a/README.md +++ b/README.md @@ -294,7 +294,7 @@ The application can be configured by editing the project's `settings.py` file. | Key | Description | Default | Type | -| --------------------------------- | ---------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------ | +| --------------------------------- | ---------------------------------------------------------------------- |-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------| ------------------------------------------------------------------------------------------------------------------------ | | `EDITORJS_DEFAULT_PLUGINS` | List of plugins names Editor.js from npm | [See above](#plugins) | `list[str]`, `tuple[str]` | | `EDITORJS_DEFAULT_CONFIG_TOOLS` | Map of Tools to use | [See above](#plugins) | `dict[str, dict]` | | `EDITORJS_IMAGE_UPLOAD_PATH` | Path uploads images | `uploads/images/` | `str` | @@ -302,7 +302,7 @@ file. | `EDITORJS_IMAGE_NAME_ORIGINAL` | To use the original name of the image file? | `False` | `bool` | | `EDITORJS_IMAGE_NAME` | Image file name. Ignored when `EDITORJS_IMAGE_NAME_ORIGINAL` is `True` | `token_urlsafe(8)` | `callable(filename: str, file: InMemoryUploadedFile)` ([docs](https://docs.djangoproject.com/en/3.0/ref/files/uploads/)) | | `EDITORJS_EMBED_HOSTNAME_ALLOWED` | List of allowed hostname for embed | `('player.vimeo.com','www.youtube.com','coub.com','vine.co','imgur.com','gfycat.com','player.twitch.tv','player.twitch.tv','music.yandex.ru','codepen.io','www.instagram.com','twitframe.com','assets.pinterest.com','www.facebook.com','www.aparat.com'),` | `list[str]`, `tuple[str]` | -| `EDITORJS_VERSION` | Version Editor.js | `2.22.3` | `str` | +| `EDITORJS_VERSION` | Version Editor.js | `2.25.0` | `str` | For `EDITORJS_IMAGE_NAME` was used `from secrets import token_urlsafe` From ba992e04a1373501ab0fb405ef1b005aaa9b75cd Mon Sep 17 00:00:00 2001 From: Ilya Kotlyakov Date: Fri, 16 Sep 2022 17:01:13 +0200 Subject: [PATCH 4/4] Up version --- django_editorjs_fields/__init__.py | 2 +- pyproject.toml | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/django_editorjs_fields/__init__.py b/django_editorjs_fields/__init__.py index 93e4c25a..7e8e60c5 100644 --- a/django_editorjs_fields/__init__.py +++ b/django_editorjs_fields/__init__.py @@ -1,4 +1,4 @@ -__version__ = "0.2.6" +__version__ = "0.2.7" from .fields import EditorJsJSONField, EditorJsTextField from .widgets import EditorJsWidget diff --git a/pyproject.toml b/pyproject.toml index c8ce2f3b..8ba9c8db 100644 --- a/pyproject.toml +++ b/pyproject.toml @@ -1,6 +1,6 @@ [tool.poetry] name = "django-editorjs-fields" -version = "0.2.6" +version = "0.2.7" description = "Django plugin for using Editor.js" authors = ["Ilya Kotlyakov "] license = "MIT"