Merge pull request #13279 from abpframework/CmsKit-Editor-Issue-10970

Cms kit editor issue 10970
4 years ago · c98cc0f3b8
12 changed files with 83 additions and 65 deletions
--- a/modules/cms-kit/src/Volo.CmsKit.Admin.Web/Pages/CmsKit/BlogPosts/Create.cshtml
+++ b/modules/cms-kit/src/Volo.CmsKit.Admin.Web/Pages/CmsKit/BlogPosts/Create.cshtml
@ -98,3 +98,4 @@
        }
    </abp-card-footer>
 </abp-card>
+<input hidden id="GeneratedWidgetText" />
--- a/modules/cms-kit/src/Volo.CmsKit.Admin.Web/Pages/CmsKit/BlogPosts/Update.cshtml
+++ b/modules/cms-kit/src/Volo.CmsKit.Admin.Web/Pages/CmsKit/BlogPosts/Update.cshtml
@ -95,3 +95,4 @@
        <abp-button button-type="Primary" type="submit" text="@L["Submit"].Value" id="button-blog-post-update" />
    </abp-card-footer>
 </abp-card>
+<input hidden id="GeneratedWidgetText" />
--- a/modules/cms-kit/src/Volo.CmsKit.Admin.Web/Pages/CmsKit/BlogPosts/create.js
+++ b/modules/cms-kit/src/Volo.CmsKit.Admin.Web/Pages/CmsKit/BlogPosts/create.js
@ -7,7 +7,7 @@ $(function () {
        Published: 1,
        SendToReview: 2
    };
-    
+
    var $selectBlog = $('#BlogSelectionSelect');
    var $formCreate = $('#form-blog-post-create');
    var $title = $('#ViewModel_Title');
@ -250,21 +250,17 @@ $(function () {
    var fileUploadUri = "/api/cms-kit-admin/media/blogpost";
    var fileUriPrefix = "/api/cms-kit/media/";

-    initAllEditors();
+    initEditor();

-    function initAllEditors() {
-        $('.content-editor').each(function (i, item) {
-            initEditor(item);
-        });
-    }
+    var editor;

-    function initEditor(element) {
-        var $editorContainer = $(element);
+    function initEditor() {
+        var $editorContainer = $("#ContentEditor");
        var inputName = $editorContainer.data('input-id');
        var $editorInput = $('#' + inputName);
        var initialValue = $editorInput.val();

-        var editor = new toastui.Editor({
+        editor = new toastui.Editor({
            el: $editorContainer[0],
            usageStatistics: false,
            useCommandShortcut: true,
@ -333,6 +329,11 @@ $(function () {
        });
    }

+    $('#GeneratedWidgetText').on('change', function () {
+        var txt = $('#GeneratedWidgetText').val();
+        editor.insertText(txt);
+    });
+
    function createAddWidgetButton() {
        const button = document.createElement('button');

--- a/modules/cms-kit/src/Volo.CmsKit.Admin.Web/Pages/CmsKit/BlogPosts/update.js
+++ b/modules/cms-kit/src/Volo.CmsKit.Admin.Web/Pages/CmsKit/BlogPosts/update.js
@ -161,21 +161,16 @@ $(function () {
    var fileUploadUri = "/api/cms-kit-admin/media/blogpost";
    var fileUriPrefix = "/api/cms-kit/media/";

-    initAllEditors();
+    initEditor();

-    function initAllEditors() {
-        $('.content-editor').each(function (i, item) {
-            initEditor(item);
-        });
-    }
-
-    function initEditor(element) {
-        var $editorContainer = $(element);
+    var editor;
+    function initEditor() {
+        var $editorContainer = $("#ContentEditor");
        var inputName = $editorContainer.data('input-id');
        var $editorInput = $('#' + inputName);
        var initialValue = $editorInput.val();

-        var editor = new toastui.Editor({
+        editor = new toastui.Editor({
            el: $editorContainer[0],
            usageStatistics: false,
            useCommandShortcut: true,
@ -255,6 +250,11 @@ $(function () {
        );
    });

+    $('#GeneratedWidgetText').on('change', function () {
+        var txt = $('#GeneratedWidgetText').val();
+        editor.insertText(txt);
+    });
+
    function createAddWidgetButton() {
        const button = document.createElement('button');

--- a/modules/cms-kit/src/Volo.CmsKit.Admin.Web/Pages/CmsKit/Contents/addWidgetModal.js
+++ b/modules/cms-kit/src/Volo.CmsKit.Admin.Web/Pages/CmsKit/Contents/addWidgetModal.js
@ -30,11 +30,6 @@ $(function () {
                    }
                });

-                var contentEditorText = $("#ContentEditor")[0].innerText
-                    .replace('WritePreview', '')
-                    .replace('MarkdownWYSIWYG', '')
-                    .replace('W', '');
-
                let updatedText = '';
                if (widgetType != undefined) {

@ -48,16 +43,8 @@ $(function () {
                    updatedText += "]";
                }

-                if (contentEditorText == '\n\n\n') {
-                    //TODO fails event
-                    var fixedData = "<div>" + updatedText + "</div>";
-                    var innerHtml = $("#ContentEditor")[0].innerHTML;
-                    var replacedInnerHtml = innerHtml.replace('<div><br></div>', fixedData);
-                    $("#ContentEditor")[0].innerHTML = replacedInnerHtml;
-                }
-                else {
-                    $('.ProseMirror div').contents()[0].data = contentEditorText + updatedText;
-                }
+                $('#GeneratedWidgetText').val(updatedText);
+                $("#GeneratedWidgetText").trigger("change");

                $('#addWidgetModal').modal('hide');
            });
--- a/modules/cms-kit/src/Volo.CmsKit.Admin.Web/Pages/CmsKit/Pages/Create.cshtml
+++ b/modules/cms-kit/src/Volo.CmsKit.Admin.Web/Pages/CmsKit/Pages/Create.cshtml
@ -76,3 +76,4 @@
        <abp-button button-type="Primary" type="submit" text="@L["Submit"].Value" id="button-page-create" />
    </abp-card-footer>
 </abp-card>
+<input hidden id="GeneratedWidgetText" />
--- a/modules/cms-kit/src/Volo.CmsKit.Admin.Web/Pages/CmsKit/Pages/Update.cshtml
+++ b/modules/cms-kit/src/Volo.CmsKit.Admin.Web/Pages/CmsKit/Pages/Update.cshtml
@ -83,3 +83,4 @@
        <abp-button button-type="Primary" type="submit" text="@L["Submit"].Value" id="button-page-update" />
    </abp-card-footer>
 </abp-card>
+<input hidden id="GeneratedWidgetText" />
--- a/modules/cms-kit/src/Volo.CmsKit.Admin.Web/Pages/CmsKit/Pages/create.js
+++ b/modules/cms-kit/src/Volo.CmsKit.Admin.Web/Pages/CmsKit/Pages/create.js
@ -89,21 +89,16 @@ $(function () {
    var fileUploadUri = "/api/cms-kit-admin/media/page";
    var fileUriPrefix = "/api/cms-kit/media/";

-    initAllEditors();
-
-    function initAllEditors() {
-        $('.content-editor').each(function (i, item) {
-            initEditor(item);
-        });
-    }
-
-    function initEditor(element) {
-        var $editorContainer = $(element);
+    initEditor();
+    
+    var editor;
+    function initEditor() {
+        var $editorContainer = $("#ContentEditor");
        var inputName = $editorContainer.data('input-id');
        var $editorInput = $('#' + inputName);
        var initialValue = $editorInput.val();

-        var editor = new toastui.Editor({
+        editor = new toastui.Editor({
            el: $editorContainer[0],
            usageStatistics: false,
            useCommandShortcut: true,
@ -138,7 +133,7 @@ $(function () {
            }
        });
    }
-
+    
    function uploadFile(blob, callback, source) {
        var UPPY_OPTIONS = {
            endpoint: fileUploadUri,
@ -171,8 +166,12 @@ $(function () {
        });
    }

+    $('#GeneratedWidgetText').on('change',function () {
+        var txt = $('#GeneratedWidgetText').val();
+        editor.insertText(txt);
+    });
+    
    function createAddWidgetButton() {
-        //TODO add auth
        const button = document.createElement('button');

        button.className = 'toastui-editor-toolbar-icons last dropdown';
--- a/modules/cms-kit/src/Volo.CmsKit.Admin.Web/Pages/CmsKit/Pages/update.js
+++ b/modules/cms-kit/src/Volo.CmsKit.Admin.Web/Pages/CmsKit/Pages/update.js
@ -59,21 +59,16 @@ $(function () {
    var fileUploadUri = "/api/cms-kit-admin/media/page";
    var fileUriPrefix = "/api/cms-kit/media/";

-    initAllEditors();
+    initEditor();

-    function initAllEditors() {
-        $('.content-editor').each(function (i, item) {
-            initEditor(item);
-        });
-    }
-
-    function initEditor(element) {
-        var $editorContainer = $(element);
+    var editor;
+    function initEditor() {
+        var $editorContainer = $("#ContentEditor");
        var inputName = $editorContainer.data('input-id');
        var $editorInput = $('#' + inputName);
        var initialValue = $editorInput.val();

-        var editor = new toastui.Editor({
+        editor = new toastui.Editor({
            el: $editorContainer[0],
            usageStatistics: false,
            useCommandShortcut: true,
@ -141,6 +136,11 @@ $(function () {
        });
    }

+    $('#GeneratedWidgetText').on('change', function () {
+        var txt = $('#GeneratedWidgetText').val();
+        editor.insertText(txt);
+    });
+    
    function createAddWidgetButton() {
        const button = document.createElement('button');

--- a/modules/cms-kit/src/Volo.CmsKit.Common.Application/Volo/CmsKit/Contents/CmsKitContentWidgetOptions.cs
+++ b/modules/cms-kit/src/Volo.CmsKit.Common.Application/Volo/CmsKit/Contents/CmsKitContentWidgetOptions.cs
@ -11,7 +11,7 @@ public class CmsKitContentWidgetOptions
        WidgetConfigs = new();
    }

-    public void AddWidget(string widgetKey, string widgetName, string editorWidgetName = null)
+    public void AddWidget(string widgetKey, string widgetName, string editorWidgetName)
    {
        var config = new ContentWidgetConfig(widgetName, editorWidgetName);
        WidgetConfigs.Add(widgetKey, config);
--- a/modules/cms-kit/test/Volo.CmsKit.Application.Tests/Contents/ContentAdminAppService_Tests.cs
+++ b/modules/cms-kit/test/Volo.CmsKit.Application.Tests/Contents/ContentAdminAppService_Tests.cs
@ -0,0 +1,27 @@
+using System.Linq;
+using System.Threading.Tasks;
+using Shouldly;
+using Volo.CmsKit.Admin.Contents;
+using Xunit;
+
+namespace Volo.CmsKit.Contents;
+
+public class ContentAdminAppService_Tests : CmsKitApplicationTestBase
+{
+    private readonly IContentAdminAppService _contentAdminAppService;
+
+    public ContentAdminAppService_Tests()
+    {
+        _contentAdminAppService = GetRequiredService<IContentAdminAppService>();
+    }
+
+    [Fact]
+    public async Task ShouldGet_PagedListAsync()
+    {
+        var widgets = await _contentAdminAppService.GetWidgetsAsync();
+
+        widgets.Items.Count.ShouldBe(0);
+        widgets.Items.Any().ShouldBeFalse();
+    }
+
+}
--- a/modules/cms-kit/test/Volo.CmsKit.Application.Tests/Contents/ContentParser_Test.cs
+++ b/modules/cms-kit/test/Volo.CmsKit.Application.Tests/Contents/ContentParser_Test.cs
@ -20,8 +20,8 @@ public class ContentParser_Test : CmsKitDomainTestBase
    [Fact]
    public async Task ParseAsync_ShouldWorkWithDifferentWidgetTypes()
    {
-        _options.Value.AddWidget(testData.PollName, testData.WidgetName);
-        _options.Value.AddWidget("ImageGallery", "ImageGallery");
+        _options.Value.AddWidget(testData.PollName, testData.WidgetName, string.Empty);
+        _options.Value.AddWidget("ImageGallery", "ImageGallery", string.Empty);
        contentParser = new ContentParser(_options);

        var content = @"**ABP Framework** is completely open source and developed in a community-driven manner.
@ -54,7 +54,7 @@ public class ContentParser_Test : CmsKitDomainTestBase
    [Fact]
    public async Task ParseAsync_ShouldWorkWithWrongConfigOptions()
    {
-        _options.Value.AddWidget(testData.WidgetName, testData.PollName);
+        _options.Value.AddWidget(testData.WidgetName, testData.PollName, string.Empty);
        contentParser = new ContentParser(_options);

        var content = @"**ABP Framework** is completely open source and developed in a community-driven manner.
@ -70,7 +70,7 @@ public class ContentParser_Test : CmsKitDomainTestBase
    [Fact]
    public async Task ParseAsync_ShouldWorkWithWrongWidgetType()
    {
-        _options.Value.AddWidget(testData.PollName, testData.WidgetName);
+        _options.Value.AddWidget(testData.PollName, testData.WidgetName, string.Empty);
        contentParser = new ContentParser(_options);

        var content = @"**ABP Framework** is completely open source and developed in a community-driven manner.
@ -86,7 +86,7 @@ public class ContentParser_Test : CmsKitDomainTestBase
    [Fact]
    public async Task ParseAsync_ShouldWorkWithWrongPollName()
    {
-        _options.Value.AddWidget(testData.PollName, testData.WidgetName);
+        _options.Value.AddWidget(testData.PollName, testData.WidgetName, string.Empty);
        contentParser = new ContentParser(_options);

        var content = @"**ABP Framework** is completely open source and developed in a community-driven manner.
@ -103,7 +103,7 @@ public class ContentParser_Test : CmsKitDomainTestBase
    [MemberData(nameof(ExampleData))]
    public async Task ParseAsync_ShouldWorkProperlyWithCorrectInputs(string content, int expectedLine)
    {
-        _options.Value.AddWidget(testData.PollName, testData.WidgetName);
+        _options.Value.AddWidget(testData.PollName, testData.WidgetName, string.Empty);
        contentParser = new ContentParser(_options);

        var widgets = await contentParser.ParseAsync(content);