kocoded/oqtane.framework
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge pull request #3585 from sbwalker/dev

Browse Source 
add an AllowRichText parameter to the RichTextEditor component and add logic to handle JS Interop failures
This commit is contained in:
Shaun Walker 2023-12-20 16:59:06 -05:00 committed by GitHub
commit e99df58bce
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 118 additions and 109 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

29
Oqtane.Client/Modules/Controls/RichTextEditor.razor
View File

@ -6,7 +6,9 @@
<div class="row" style="margin-bottom: 50px;">
<div class="col">
<TabStrip ActiveTab="@_activeTab">
<TabStrip>
@if (AllowRichText)
{
<TabPanel Name="Rich" Heading="Rich Text Editor" ResourceKey="RichTextEditor">
@if (_richfilemanager)
{
@ -17,7 +19,9 @@
<div class="d-flex justify-content-center mb-2">
@if (AllowRawHtml)
{
<button type="button" class="btn btn-secondary" @onclick="RefreshRichText">@Localizer["SynchronizeContent"]</button>@((MarkupString)"&nbsp;&nbsp;")
<button type="button" class="btn btn-secondary" @onclick="RefreshRichText">@Localizer["SynchronizeContent"]</button>
@((MarkupString)"&nbsp;&nbsp;")
}
@if (AllowFileManagement)
{
@ -70,6 +74,7 @@
</div>
</div>
</TabPanel>
}
@if (AllowRawHtml)
{
<TabPanel Name="Raw" Heading="Raw HTML Editor" ResourceKey="HtmlEditor">
@ -106,7 +111,6 @@
</div>
@code {
private string _activeTab = "Rich";
private ElementReference _editorElement;
private ElementReference _toolBar;
private bool _richfilemanager = false;
@ -130,6 +134,9 @@
[Parameter]
public bool AllowFileManagement { get; set; } = true;
[Parameter]
public bool AllowRichText { get; set; } = true;
[Parameter]
public bool AllowRawHtml { get; set; } = true;
@ -175,14 +182,11 @@
await interop.LoadEditorContent(_editorElement, _richhtml);
if (AllowRichText)
{
// preserve a copy of the rich text content (Quill sanitizes content so we need to retrieve it from the editor)
_originalrichhtml = await interop.GetHtml(_editorElement);
if (_originalrichhtml != _originalrawhtml)
{
_activeTab = "Raw";
StateHasChanged();
}
}
}
@ -221,11 +225,16 @@
return _rawhtml;
}
else
{
var richhtml = "";
if (AllowRichText)
{
// return rich text content if it has changed
var interop = new RichTextEditorInterop(JSRuntime);
var richhtml = await interop.GetHtml(_editorElement);
if (richhtml != _originalrichhtml)
richhtml = await interop.GetHtml(_editorElement);
}
// rich text value will only be blank if AllowRichText is disabled or the JS Interop method failed
if (richhtml != _originalrichhtml && !string.IsNullOrEmpty(richhtml) && !string.IsNullOrEmpty(_originalrichhtml))
{
return richhtml;
}