v1.2.10.6

This commit is contained in:
2023-03-18 12:26:59 +00:00
parent 97b4f49509
commit a4da299248
46 changed files with 31377 additions and 48 deletions
Binary file not shown.
+17 -15
View File
@@ -46,11 +46,12 @@ The type of activity determines the sequence and period for which they are prese
##### Icons
* Where to find icons: https://www.canva.com/learn/free-icons-download/
* https://icons8.com
* https://www.smashingmagazine.com/category/freebies
* https://goodstuffnononsense.com/icons-category/free/
* https://www.iconfinder.com/
- **Bootstrap**: https://icons.getbootstrap.com/
- Where to find icons: https://www.canva.com/learn/free-icons-download/
- https://icons8.com
- https://www.smashingmagazine.com/category/freebies
- https://goodstuffnononsense.com/icons-category/free/
- https://www.iconfinder.com/
##### Animated gifs
@@ -60,16 +61,17 @@ The type of activity determines the sequence and period for which they are prese
##### HTML Editor Controls
* RoosterJS
* https://github.com/microsoft/roosterjs
* https://github.com/microsoft/roosterjs/wiki/How-to-use
* https://github.com/microsoft/roosterjs/wiki#useful-links
* https://www.npmjs.com/package/roosterjs - distribution files.
* https://registry.npmjs.org/roosterjs/latest - dist - tarball for download URL.
* Download specific version: https://registry.npmjs.org/roosterjs/-/roosterjs-8.41.0.tgz
* TinyMCE
* NuGet package available but effectively doesn nothing - no longer able to copy script filles to aapplication folders.
* Manually copy files from: https://www.tiny.cloud/get-tiny/self-hosted/
- RoosterJS
- https://github.com/microsoft/roosterjs
- https://github.com/microsoft/roosterjs/wiki/How-to-use
- https://github.com/microsoft/roosterjs/wiki#useful-links
- https://github.com/microsoft/roosterjs/tree/master/packages/roosterjs-editor-api/lib/format - styling interface.
- https://www.npmjs.com/package/roosterjs - distribution files.
- https://registry.npmjs.org/roosterjs/latest - dist - tarball for download URL.
- Download specific version: https://registry.npmjs.org/roosterjs/-/roosterjs-8.41.0.tgz
- TinyMCE
- NuGet package available but effectively doesn nothing - no longer able to copy script filles to aapplication folders.
- Manually copy files from: https://www.tiny.cloud/get-tiny/self-hosted/
###### TinyMCE
@@ -4,7 +4,6 @@
/* User Report - Index */
ViewData["Title"] = "User Reports";
Model.AdditionalFiles_JS.Add("js/sax-spt-rpt.js");
Model.AdditionalFiles_JS.Add("rjs/rooster-min.js");
}
<div class="sax-panel UserReports">
@@ -3,6 +3,7 @@
@{
/* Support - User Report dialog */
Model.AdditionalFiles_CSS.Add("rjs/sax-rjs.css");
Model.AdditionalFiles_JS.Add("rjs/rooster-min.js");
Model.AdditionalFiles_JS.Add("rjs/sax-rjs.js");
}
@@ -22,7 +23,7 @@
<div class="spacer4"></div>
@* User Report form *@
@using (@Html.BeginForm(FormMethod.Post, new { @id = "frmUserReport", @class = "sax-form", @onSubmit = "return false;" }))
@using (@Html.BeginForm(FormMethod.Post, new { @id = "frmUserReport", @class = "sax-form", @autocomplete = "off", @onSubmit = "return false;" }))
{
@Html.HiddenFor(model => model.UserReport.Id, new { @class = "UserReportId" })
@Html.HiddenFor(model => model.UserReport.Exists, new { @class = "UserReportExists" })
@@ -73,7 +74,7 @@
<div class="sax-control">
@Html.HiddenFor(model => model.UserReport.Report, new { @id = "ifUserReportReport", @class = "UserReportReport sax-input" })
<div class="rjs-container">
<div class="rjs-editor" style="min-height:96px;max-height:256px;"></div>
<div class="rjs-editor"></div>
<div class="rjs-toolbar"></div>
</div>
</div>
Binary file not shown.

Before

Width:  |  Height:  |  Size: 3.7 KiB

After

Width:  |  Height:  |  Size: 3.7 KiB

@@ -0,0 +1,4 @@
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-indent" viewBox="0 0 16 16">
<path fill-rule="evenodd" d="M3 8a.5.5 0 0 1 .5-.5h6.793L8.146 5.354a.5.5 0 1 1 .708-.708l3 3a.5.5 0 0 1 0 .708l-3 3a.5.5 0 0 1-.708-.708L10.293 8.5H3.5A.5.5 0 0 1 3 8Z"/>
<path fill-rule="evenodd" d="M12.5 4a.5.5 0 0 1 .5.5v7a.5.5 0 0 1-1 0v-7a.5.5 0 0 1 .5-.5Z"/>
</svg>

After

Width:  |  Height:  |  Size: 401 B

@@ -0,0 +1,4 @@
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-list-ol" viewBox="0 0 16 16">
<path fill-rule="evenodd" d="M5 11.5a.5.5 0 0 1 .5-.5h9a.5.5 0 0 1 0 1h-9a.5.5 0 0 1-.5-.5zm0-4a.5.5 0 0 1 .5-.5h9a.5.5 0 0 1 0 1h-9a.5.5 0 0 1-.5-.5zm0-4a.5.5 0 0 1 .5-.5h9a.5.5 0 0 1 0 1h-9a.5.5 0 0 1-.5-.5z"/>
<path d="M1.713 11.865v-.474H2c.217 0 .363-.137.363-.317 0-.185-.158-.31-.361-.31-.223 0-.367.152-.373.31h-.59c.016-.467.373-.787.986-.787.588-.002.954.291.957.703a.595.595 0 0 1-.492.594v.033a.615.615 0 0 1 .569.631c.003.533-.502.8-1.051.8-.656 0-1-.37-1.008-.794h.582c.008.178.186.306.422.309.254 0 .424-.145.422-.35-.002-.195-.155-.348-.414-.348h-.3zm-.004-4.699h-.604v-.035c0-.408.295-.844.958-.844.583 0 .96.326.96.756 0 .389-.257.617-.476.848l-.537.572v.03h1.054V9H1.143v-.395l.957-.99c.138-.142.293-.304.293-.508 0-.18-.147-.32-.342-.32a.33.33 0 0 0-.342.338v.041zM2.564 5h-.635V2.924h-.031l-.598.42v-.567l.629-.443h.635V5z"/>
</svg>

After

Width:  |  Height:  |  Size: 983 B

@@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-list-ul" viewBox="0 0 16 16">
<path fill-rule="evenodd" d="M5 11.5a.5.5 0 0 1 .5-.5h9a.5.5 0 0 1 0 1h-9a.5.5 0 0 1-.5-.5zm0-4a.5.5 0 0 1 .5-.5h9a.5.5 0 0 1 0 1h-9a.5.5 0 0 1-.5-.5zm0-4a.5.5 0 0 1 .5-.5h9a.5.5 0 0 1 0 1h-9a.5.5 0 0 1-.5-.5zm-3 1a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm0 4a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm0 4a1 1 0 1 0 0-2 1 1 0 0 0 0 2z"/>
</svg>

After

Width:  |  Height:  |  Size: 447 B

@@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-text-indent-left" viewBox="0 0 16 16">
<path d="M2 3.5a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5zm.646 2.146a.5.5 0 0 1 .708 0l2 2a.5.5 0 0 1 0 .708l-2 2a.5.5 0 0 1-.708-.708L4.293 8 2.646 6.354a.5.5 0 0 1 0-.708zM7 6.5a.5.5 0 0 1 .5-.5h6a.5.5 0 0 1 0 1h-6a.5.5 0 0 1-.5-.5zm0 3a.5.5 0 0 1 .5-.5h6a.5.5 0 0 1 0 1h-6a.5.5 0 0 1-.5-.5zm-5 3a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5z"/>
</svg>

After

Width:  |  Height:  |  Size: 517 B

@@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-text-indent-right" viewBox="0 0 16 16">
<path d="M2 3.5a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5zm10.646 2.146a.5.5 0 0 1 .708.708L11.707 8l1.647 1.646a.5.5 0 0 1-.708.708l-2-2a.5.5 0 0 1 0-.708l2-2zM2 6.5a.5.5 0 0 1 .5-.5h6a.5.5 0 0 1 0 1h-6a.5.5 0 0 1-.5-.5zm0 3a.5.5 0 0 1 .5-.5h6a.5.5 0 0 1 0 1h-6a.5.5 0 0 1-.5-.5zm0 3a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5z"/>
</svg>

After

Width:  |  Height:  |  Size: 503 B

@@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-type-bold" viewBox="0 0 16 16">
<path d="M8.21 13c2.106 0 3.412-1.087 3.412-2.823 0-1.306-.984-2.283-2.324-2.386v-.055a2.176 2.176 0 0 0 1.852-2.14c0-1.51-1.162-2.46-3.014-2.46H3.843V13H8.21zM5.908 4.674h1.696c.963 0 1.517.451 1.517 1.244 0 .834-.629 1.32-1.73 1.32H5.908V4.673zm0 6.788V8.598h1.73c1.217 0 1.88.492 1.88 1.415 0 .943-.643 1.449-1.832 1.449H5.907z"/>
</svg>

After

Width:  |  Height:  |  Size: 470 B

@@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-type-h1" viewBox="0 0 16 16">
<path d="M8.637 13V3.669H7.379V7.62H2.758V3.67H1.5V13h1.258V8.728h4.62V13h1.259zm5.329 0V3.669h-1.244L10.5 5.316v1.265l2.16-1.565h.062V13h1.244z"/>
</svg>

After

Width:  |  Height:  |  Size: 282 B

@@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-type-h2" viewBox="0 0 16 16">
<path d="M7.638 13V3.669H6.38V7.62H1.759V3.67H.5V13h1.258V8.728h4.62V13h1.259zm3.022-6.733v-.048c0-.889.63-1.668 1.716-1.668.957 0 1.675.608 1.675 1.572 0 .855-.554 1.504-1.067 2.085l-3.513 3.999V13H15.5v-1.094h-4.245v-.075l2.481-2.844c.875-.998 1.586-1.784 1.586-2.953 0-1.463-1.155-2.556-2.919-2.556-1.941 0-2.966 1.326-2.966 2.74v.049h1.223z"/>
</svg>

After

Width:  |  Height:  |  Size: 482 B

@@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-type-h3" viewBox="0 0 16 16">
<path d="M7.637 13V3.669H6.379V7.62H1.758V3.67H.5V13h1.258V8.728h4.62V13h1.259zm3.625-4.272h1.018c1.142 0 1.935.67 1.949 1.674.013 1.005-.78 1.737-2.01 1.73-1.08-.007-1.853-.588-1.935-1.32H9.108c.069 1.327 1.224 2.386 3.083 2.386 1.935 0 3.343-1.155 3.309-2.789-.027-1.51-1.251-2.16-2.037-2.249v-.068c.704-.123 1.764-.91 1.723-2.229-.035-1.353-1.176-2.4-2.954-2.385-1.873.006-2.857 1.162-2.898 2.358h1.196c.062-.69.711-1.299 1.696-1.299.998 0 1.695.622 1.695 1.525.007.922-.718 1.592-1.695 1.592h-.964v1.074z"/>
</svg>

After

Width:  |  Height:  |  Size: 646 B

@@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-type-italic" viewBox="0 0 16 16">
<path d="M7.991 11.674 9.53 4.455c.123-.595.246-.71 1.347-.807l.11-.52H7.211l-.11.52c1.06.096 1.128.212 1.005.807L6.57 11.674c-.123.595-.246.71-1.346.806l-.11.52h3.774l.11-.52c-1.06-.095-1.129-.211-1.006-.806z"/>
</svg>

After

Width:  |  Height:  |  Size: 351 B

@@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-type-strikethrough" viewBox="0 0 16 16">
<path d="M6.333 5.686c0 .31.083.581.27.814H5.166a2.776 2.776 0 0 1-.099-.76c0-1.627 1.436-2.768 3.48-2.768 1.969 0 3.39 1.175 3.445 2.85h-1.23c-.11-1.08-.964-1.743-2.25-1.743-1.23 0-2.18.602-2.18 1.607zm2.194 7.478c-2.153 0-3.589-1.107-3.705-2.81h1.23c.144 1.06 1.129 1.703 2.544 1.703 1.34 0 2.31-.705 2.31-1.675 0-.827-.547-1.374-1.914-1.675L8.046 8.5H1v-1h14v1h-3.504c.468.437.675.994.675 1.697 0 1.826-1.436 2.967-3.644 2.967z"/>
</svg>

After

Width:  |  Height:  |  Size: 579 B

@@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-type-underline" viewBox="0 0 16 16">
<path d="M5.313 3.136h-1.23V9.54c0 2.105 1.47 3.623 3.917 3.623s3.917-1.518 3.917-3.623V3.136h-1.23v6.323c0 1.49-.978 2.57-2.687 2.57-1.709 0-2.687-1.08-2.687-2.57V3.136zM12.5 15h-9v-1h9v1z"/>
</svg>

After

Width:  |  Height:  |  Size: 334 B

@@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-type" viewBox="0 0 16 16">
<path d="m2.244 13.081.943-2.803H6.66l.944 2.803H8.86L5.54 3.75H4.322L1 13.081h1.244zm2.7-7.923L6.34 9.314H3.51l1.4-4.156h.034zm9.146 7.027h.035v.896h1.128V8.125c0-1.51-1.114-2.345-2.646-2.345-1.736 0-2.59.916-2.666 2.174h1.108c.068-.718.595-1.19 1.517-1.19.971 0 1.518.52 1.518 1.464v.731H12.19c-1.647.007-2.522.8-2.522 2.058 0 1.319.957 2.18 2.345 2.18 1.06 0 1.716-.43 2.078-1.011zm-1.763.035c-.752 0-1.456-.397-1.456-1.244 0-.65.424-1.115 1.408-1.115h1.805v.834c0 .896-.752 1.525-1.757 1.525z"/>
</svg>

After

Width:  |  Height:  |  Size: 631 B

@@ -0,0 +1,4 @@
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-unindent" viewBox="0 0 16 16">
<path fill-rule="evenodd" d="M13 8a.5.5 0 0 0-.5-.5H5.707l2.147-2.146a.5.5 0 1 0-.708-.708l-3 3a.5.5 0 0 0 0 .708l3 3a.5.5 0 0 0 .708-.708L5.707 8.5H12.5A.5.5 0 0 0 13 8Z"/>
<path fill-rule="evenodd" d="M3.5 4a.5.5 0 0 0-.5.5v7a.5.5 0 0 0 1 0v-7a.5.5 0 0 0-.5-.5Z"/>
</svg>

After

Width:  |  Height:  |  Size: 404 B

+68 -8
View File
@@ -16,8 +16,10 @@
.rjs-editor
{
padding:4px 8px 4px 8px;
overflow-y:scroll;
min-height: 96px;
max-height: 256px;
padding: 4px 8px 4px 8px;
overflow-y: scroll;
}
.rjs-editor:focus
@@ -27,16 +29,74 @@
.rjs-toolbar
{
display:none;
min-height:24px;
padding:2px 4px 4px 4px;
border-top:1px solid #808080;
overflow:hidden;
display: none;
min-height: 16px;
padding: 2px 4px 2px 4px;
line-height: 0;
border-top: 1px solid #808080;
overflow: hidden;
}
.rjs-container.rjs-editing .rjs-toolbar
{
display:block;
display: block;
}
.rjs-toolbar .rjs-action
{
display: inline-block;
width: 24px;
height: 24px;
margin: 0 1px;
border: 1px solid transparent;
border-radius: 4px;
background-position: center center;
background-repeat: no-repeat;
}
.rjs-toolbar .rjs-action:hover
{
border-color: #b0b0b0;
}
.rjs-toolbar .rjs-action.rjs-bold
{
background-image: url("/img/Bootstrap/icon/type-bold.svg");
}
.rjs-toolbar .rjs-action.rjs-italic
{
background-image: url("/img/Bootstrap/icon/type-italic.svg");
}
.rjs-toolbar .rjs-action.rjs-underline
{
background-image: url("/img/Bootstrap/icon/type-underline.svg");
}
.rjs-toolbar .rjs-action.rjs-text
{
background-image: url("/img/Bootstrap/icon/type-text.svg");
}
.rjs-toolbar .rjs-action.rjs-indent
{
background-image: url("/img/Bootstrap/icon/indent.svg");
}
.rjs-toolbar .rjs-action.rjs-unindent
{
background-image: url("/img/Bootstrap/icon/unindent.svg");
}
.rjs-toolbar .rjs-action.rjs-list-number
{
background-image: url("/img/Bootstrap/icon/list-ol.svg");
}
.rjs-toolbar .rjs-action.rjs-list-bullit
{
background-image: url("/img/Bootstrap/icon/list-ul.svg");
}
/* The End */
+27 -12
View File
@@ -9,21 +9,38 @@
//--------------------------------------------------------------
rjs.init = function ($pnl, $inp, data)
{
let $con = $pnl.closest(".rjs-container");
let $tb = $('.rjs-toolbar', $con).empty();
let editor = roosterjs.createEditor($pnl[0], [], data);
$pnl.off('focus').on('focus', function () { rjs.onFocusEditor($pnl, editor, $inp); });
$pnl.off('blur').on('blur', function () { rjs.onBlurEditor($pnl, editor, $inp); });
$pnl.off('focus').on('focus', function (evt) { rjs.onFocusEditor(evt, $pnl, $con, $tb, editor, $inp); });
$pnl.off('blur').on('blur', function (evt) { rjs.onBlurEditor(evt, $pnl, $con, $tb, editor, $inp); });
rjs.initToolbar($pnl, $tb, editor);
return editor;
}
rjs.onFocusEditor = function ($pnl, rjsEd, $inp)
rjs.initToolbar = function ($pnl, $tb, ed)
{
//sax.debug('rjs.onFocusEditor', $pnl, rjsEd, $inp);
$pnl.closest(".rjs-container").addClass("rjs-editing");
$tb.off('click').on('click', function () { $pnl.focus(); });
rjs.addTbAction($pnl, $tb, 'bold', 'Bold', function () { roosterjs.toggleBold(ed); });
rjs.addTbAction($pnl, $tb, 'italic', 'Italic', function () { roosterjs.toggleItalic(ed); });
rjs.addTbAction($pnl, $tb, 'underline', 'Underline', function () { roosterjs.toggleUnderline(ed); });
rjs.addTbAction($pnl, $tb, 'list-number', 'Numbered list', function () { roosterjs.toggleNumbering(ed); });
rjs.addTbAction($pnl, $tb, 'list-bullit', 'Bullit list', function () { roosterjs.toggleBullet(ed); });
rjs.addTbAction($pnl, $tb, 'indent', 'Indent', function () { roosterjs.setIndentation(ed, 0); });
rjs.addTbAction($pnl, $tb, 'unindent', 'Unindent', function () { roosterjs.setIndentation(ed, 1); });
}
rjs.onBlurEditor = function ($pnl, rjsEd, $inp)
rjs.addTbAction = function ($pnl, $tb, act, ttl, fn)
{
//sax.debug('rjs.onBlurEditor');
$pnl.closest(".rjs-container").removeClass("rjs-editing");
while ($pnl.children().length>1)
$tb.append($('<div>').addClass('rjs-action rjs-' + act).prop('title', ttl).prop('tabindex',9).on('click', fn));
}
rjs.onFocusEditor = function (evt, $pnl, $con, $tb, rjsEd, $inp)
{
$con.addClass("rjs-editing");
}
rjs.onBlurEditor = function (evt, $pnl, $con, $tb, rjsEd, $inp)
{
if ($.contains($con[0],evt.relatedTarget)) return;
$con.removeClass("rjs-editing");
while ($pnl.children().length > 1)
{
let lc = $pnl.children().last();
if (!lc || lc.text().trim().length) break;
@@ -32,9 +49,7 @@
$inp.val($pnl.html());
}
//--------------------------------------------------------------
$(function ()
{
});
//$(function (){});
//--------------------------------------------------------------
}(window, window.document));
/* The End */
@@ -39,6 +39,10 @@
<ExcludeFromSingleFile>true</ExcludeFromSingleFile>
<CopyToPublishDirectory>PreserveNewest</CopyToPublishDirectory>
</Content>
<Content Update="wwwroot\rjs\sax-rjs.css">
<ExcludeFromSingleFile>true</ExcludeFromSingleFile>
<CopyToPublishDirectory>PreserveNewest</CopyToPublishDirectory>
</Content>
</ItemGroup>
<ItemGroup>
@@ -3,7 +3,9 @@
@{
// Online - Support - Feedback.
ViewData["Title"] = "Support - Feedback";
// Scripts.
Model.AdditionalFiles_CSS.Add("rjs/sax-rjs.css");
Model.AdditionalFiles_JS.Add("rjs/rooster-min.js");
Model.AdditionalFiles_JS.Add("rjs/sax-rjs.js");
Model.AdditionalFiles_JS.Add("js/sax-spt-rpt.js");
}
@@ -110,7 +112,7 @@
@* User Report dialog *@
<div id="dlgUserReport" class="sax-dialog" title="@Localiser["support.caption.user.report"]">
<div class="spacer2"></div>
@using (Html.BeginForm(FormMethod.Post, new { @id = "frmUserReport", @class = "sax-form", @onSubmit = "return false;" }))
@using (Html.BeginForm(FormMethod.Post, new { @id = "frmUserReport", @class = "sax-form", @autocomplete = "off", @onSubmit = "return false;" }))
{
@Html.HiddenFor(model => model.UserReport.Id, new { @id = "", @class = "UserReportId" })
@Html.HiddenFor(model => model.UserReport.Exists, new { @id = "", @class = "UserReportExists" })
@@ -143,7 +145,7 @@
</div>
<div class="col-sm">
<div class="sax-control">
@Html.TextBoxFor(model => model.UserReport.Title, new { @id = "ifUserReportTitle", @class = "UserReportTitle sax-input", @maxlength = @Model.GetControlMaxLength(SaxDbDfn_Support.ColumnIdx.UserReport_Report) })
@Html.TextBoxFor(model => model.UserReport.Title, new { @id = "ifUserReportTitle", @class = "UserReportTitle sax-input", @maxlength = @Model.GetControlMaxLength(SaxDbDfn_Support.ColumnIdx.UserReport_Title) })
</div>
<div class="sax-message"></div>
</div>
@@ -160,7 +162,11 @@
</div>
<div class="col-sm">
<div class="sax-control">
@Html.TextAreaFor(model => model.UserReport.Report, new { @id = "ifUserReportReport", @class = "UserReportReport sax-textarea", @rows = 15, @maxlength = @Model.GetControlMaxLength(SaxDbDfn_Support.ColumnIdx.UserReport_Report) })
@Html.HiddenFor(model => model.UserReport.Report, new { @id = "ifUserReportReport", @class = "UserReportReport sax-input" })
<div class="rjs-container">
<div class="rjs-editor"></div>
<div class="rjs-toolbar"></div>
</div>
</div>
<div class="sax-message"></div>
</div>
@@ -2,11 +2,13 @@
Base stylesheet.
*/
@import url('https://fonts.googleapis.com/css2?family=Work+Sans&display=swap');
body
{
margin: 0;
padding: 0;
font-family: Verdana, Helvetica, Arial, sans-serif;
font-family: 'Work Sans', Verdana, Helvetica, Arial, sans-serif;
font-size: 1rem;
line-height: 1.25rem;
background-color: #fff;
@@ -49,7 +49,7 @@ html
body
{
font-family: Verdana, Helvetica, Arial, Lucida, sans-serif;
font-family: 'Work Sans', Verdana, Helvetica, Arial, Lucida, sans-serif;
background-color: #e9edf6;
}
@@ -0,0 +1,4 @@
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-indent" viewBox="0 0 16 16">
<path fill-rule="evenodd" d="M3 8a.5.5 0 0 1 .5-.5h6.793L8.146 5.354a.5.5 0 1 1 .708-.708l3 3a.5.5 0 0 1 0 .708l-3 3a.5.5 0 0 1-.708-.708L10.293 8.5H3.5A.5.5 0 0 1 3 8Z"/>
<path fill-rule="evenodd" d="M12.5 4a.5.5 0 0 1 .5.5v7a.5.5 0 0 1-1 0v-7a.5.5 0 0 1 .5-.5Z"/>
</svg>

After

Width:  |  Height:  |  Size: 401 B

@@ -0,0 +1,4 @@
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-list-ol" viewBox="0 0 16 16">
<path fill-rule="evenodd" d="M5 11.5a.5.5 0 0 1 .5-.5h9a.5.5 0 0 1 0 1h-9a.5.5 0 0 1-.5-.5zm0-4a.5.5 0 0 1 .5-.5h9a.5.5 0 0 1 0 1h-9a.5.5 0 0 1-.5-.5zm0-4a.5.5 0 0 1 .5-.5h9a.5.5 0 0 1 0 1h-9a.5.5 0 0 1-.5-.5z"/>
<path d="M1.713 11.865v-.474H2c.217 0 .363-.137.363-.317 0-.185-.158-.31-.361-.31-.223 0-.367.152-.373.31h-.59c.016-.467.373-.787.986-.787.588-.002.954.291.957.703a.595.595 0 0 1-.492.594v.033a.615.615 0 0 1 .569.631c.003.533-.502.8-1.051.8-.656 0-1-.37-1.008-.794h.582c.008.178.186.306.422.309.254 0 .424-.145.422-.35-.002-.195-.155-.348-.414-.348h-.3zm-.004-4.699h-.604v-.035c0-.408.295-.844.958-.844.583 0 .96.326.96.756 0 .389-.257.617-.476.848l-.537.572v.03h1.054V9H1.143v-.395l.957-.99c.138-.142.293-.304.293-.508 0-.18-.147-.32-.342-.32a.33.33 0 0 0-.342.338v.041zM2.564 5h-.635V2.924h-.031l-.598.42v-.567l.629-.443h.635V5z"/>
</svg>

After

Width:  |  Height:  |  Size: 983 B

@@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-list-ul" viewBox="0 0 16 16">
<path fill-rule="evenodd" d="M5 11.5a.5.5 0 0 1 .5-.5h9a.5.5 0 0 1 0 1h-9a.5.5 0 0 1-.5-.5zm0-4a.5.5 0 0 1 .5-.5h9a.5.5 0 0 1 0 1h-9a.5.5 0 0 1-.5-.5zm0-4a.5.5 0 0 1 .5-.5h9a.5.5 0 0 1 0 1h-9a.5.5 0 0 1-.5-.5zm-3 1a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm0 4a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm0 4a1 1 0 1 0 0-2 1 1 0 0 0 0 2z"/>
</svg>

After

Width:  |  Height:  |  Size: 447 B

@@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-text-indent-left" viewBox="0 0 16 16">
<path d="M2 3.5a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5zm.646 2.146a.5.5 0 0 1 .708 0l2 2a.5.5 0 0 1 0 .708l-2 2a.5.5 0 0 1-.708-.708L4.293 8 2.646 6.354a.5.5 0 0 1 0-.708zM7 6.5a.5.5 0 0 1 .5-.5h6a.5.5 0 0 1 0 1h-6a.5.5 0 0 1-.5-.5zm0 3a.5.5 0 0 1 .5-.5h6a.5.5 0 0 1 0 1h-6a.5.5 0 0 1-.5-.5zm-5 3a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5z"/>
</svg>

After

Width:  |  Height:  |  Size: 517 B

@@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-text-indent-right" viewBox="0 0 16 16">
<path d="M2 3.5a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5zm10.646 2.146a.5.5 0 0 1 .708.708L11.707 8l1.647 1.646a.5.5 0 0 1-.708.708l-2-2a.5.5 0 0 1 0-.708l2-2zM2 6.5a.5.5 0 0 1 .5-.5h6a.5.5 0 0 1 0 1h-6a.5.5 0 0 1-.5-.5zm0 3a.5.5 0 0 1 .5-.5h6a.5.5 0 0 1 0 1h-6a.5.5 0 0 1-.5-.5zm0 3a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5z"/>
</svg>

After

Width:  |  Height:  |  Size: 503 B

@@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-type-bold" viewBox="0 0 16 16">
<path d="M8.21 13c2.106 0 3.412-1.087 3.412-2.823 0-1.306-.984-2.283-2.324-2.386v-.055a2.176 2.176 0 0 0 1.852-2.14c0-1.51-1.162-2.46-3.014-2.46H3.843V13H8.21zM5.908 4.674h1.696c.963 0 1.517.451 1.517 1.244 0 .834-.629 1.32-1.73 1.32H5.908V4.673zm0 6.788V8.598h1.73c1.217 0 1.88.492 1.88 1.415 0 .943-.643 1.449-1.832 1.449H5.907z"/>
</svg>

After

Width:  |  Height:  |  Size: 470 B

@@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-type-h1" viewBox="0 0 16 16">
<path d="M8.637 13V3.669H7.379V7.62H2.758V3.67H1.5V13h1.258V8.728h4.62V13h1.259zm5.329 0V3.669h-1.244L10.5 5.316v1.265l2.16-1.565h.062V13h1.244z"/>
</svg>

After

Width:  |  Height:  |  Size: 282 B

@@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-type-h2" viewBox="0 0 16 16">
<path d="M7.638 13V3.669H6.38V7.62H1.759V3.67H.5V13h1.258V8.728h4.62V13h1.259zm3.022-6.733v-.048c0-.889.63-1.668 1.716-1.668.957 0 1.675.608 1.675 1.572 0 .855-.554 1.504-1.067 2.085l-3.513 3.999V13H15.5v-1.094h-4.245v-.075l2.481-2.844c.875-.998 1.586-1.784 1.586-2.953 0-1.463-1.155-2.556-2.919-2.556-1.941 0-2.966 1.326-2.966 2.74v.049h1.223z"/>
</svg>

After

Width:  |  Height:  |  Size: 482 B

@@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-type-h3" viewBox="0 0 16 16">
<path d="M7.637 13V3.669H6.379V7.62H1.758V3.67H.5V13h1.258V8.728h4.62V13h1.259zm3.625-4.272h1.018c1.142 0 1.935.67 1.949 1.674.013 1.005-.78 1.737-2.01 1.73-1.08-.007-1.853-.588-1.935-1.32H9.108c.069 1.327 1.224 2.386 3.083 2.386 1.935 0 3.343-1.155 3.309-2.789-.027-1.51-1.251-2.16-2.037-2.249v-.068c.704-.123 1.764-.91 1.723-2.229-.035-1.353-1.176-2.4-2.954-2.385-1.873.006-2.857 1.162-2.898 2.358h1.196c.062-.69.711-1.299 1.696-1.299.998 0 1.695.622 1.695 1.525.007.922-.718 1.592-1.695 1.592h-.964v1.074z"/>
</svg>

After

Width:  |  Height:  |  Size: 646 B

@@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-type-italic" viewBox="0 0 16 16">
<path d="M7.991 11.674 9.53 4.455c.123-.595.246-.71 1.347-.807l.11-.52H7.211l-.11.52c1.06.096 1.128.212 1.005.807L6.57 11.674c-.123.595-.246.71-1.346.806l-.11.52h3.774l.11-.52c-1.06-.095-1.129-.211-1.006-.806z"/>
</svg>

After

Width:  |  Height:  |  Size: 351 B

@@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-type-strikethrough" viewBox="0 0 16 16">
<path d="M6.333 5.686c0 .31.083.581.27.814H5.166a2.776 2.776 0 0 1-.099-.76c0-1.627 1.436-2.768 3.48-2.768 1.969 0 3.39 1.175 3.445 2.85h-1.23c-.11-1.08-.964-1.743-2.25-1.743-1.23 0-2.18.602-2.18 1.607zm2.194 7.478c-2.153 0-3.589-1.107-3.705-2.81h1.23c.144 1.06 1.129 1.703 2.544 1.703 1.34 0 2.31-.705 2.31-1.675 0-.827-.547-1.374-1.914-1.675L8.046 8.5H1v-1h14v1h-3.504c.468.437.675.994.675 1.697 0 1.826-1.436 2.967-3.644 2.967z"/>
</svg>

After

Width:  |  Height:  |  Size: 579 B

@@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-type-underline" viewBox="0 0 16 16">
<path d="M5.313 3.136h-1.23V9.54c0 2.105 1.47 3.623 3.917 3.623s3.917-1.518 3.917-3.623V3.136h-1.23v6.323c0 1.49-.978 2.57-2.687 2.57-1.709 0-2.687-1.08-2.687-2.57V3.136zM12.5 15h-9v-1h9v1z"/>
</svg>

After

Width:  |  Height:  |  Size: 334 B

@@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-type" viewBox="0 0 16 16">
<path d="m2.244 13.081.943-2.803H6.66l.944 2.803H8.86L5.54 3.75H4.322L1 13.081h1.244zm2.7-7.923L6.34 9.314H3.51l1.4-4.156h.034zm9.146 7.027h.035v.896h1.128V8.125c0-1.51-1.114-2.345-2.646-2.345-1.736 0-2.59.916-2.666 2.174h1.108c.068-.718.595-1.19 1.517-1.19.971 0 1.518.52 1.518 1.464v.731H12.19c-1.647.007-2.522.8-2.522 2.058 0 1.319.957 2.18 2.345 2.18 1.06 0 1.716-.43 2.078-1.011zm-1.763.035c-.752 0-1.456-.397-1.456-1.244 0-.65.424-1.115 1.408-1.115h1.805v.834c0 .896-.752 1.525-1.757 1.525z"/>
</svg>

After

Width:  |  Height:  |  Size: 631 B

@@ -0,0 +1,4 @@
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-unindent" viewBox="0 0 16 16">
<path fill-rule="evenodd" d="M13 8a.5.5 0 0 0-.5-.5H5.707l2.147-2.146a.5.5 0 1 0-.708-.708l-3 3a.5.5 0 0 0 0 .708l3 3a.5.5 0 0 0 .708-.708L5.707 8.5H12.5A.5.5 0 0 0 13 8Z"/>
<path fill-rule="evenodd" d="M3.5 4a.5.5 0 0 0-.5.5v7a.5.5 0 0 0 1 0v-7a.5.5 0 0 0-.5-.5Z"/>
</svg>

After

Width:  |  Height:  |  Size: 404 B

@@ -4,7 +4,7 @@
(function (win, doc, undef)
{
"use strict";
let sf = sax.mdl.supportFeedback = sax.mdl.supportFeedback || { data: {}, ajax: {} };
let sf = sax.mdl.supportFeedback = sax.mdl.supportFeedback || { data: {}, ajax: {}, rjs: {}, $ctrl: {} };
let $pnl = sf.$pnl = {}, $dlg = sf.$dlg = {}, $frm = sf.$frm = {};
//--------------------------------------------------------------
sf.refreshResults = function (delay)
@@ -96,6 +96,7 @@
{
sf.clearItem();
$('#cbReportType', $frm.rpt).prepend($("<option>", { value: '', selected: true }));
sf.rjs.reportEditor = sax.rjs.init(sf.$pnl.reportEditor, sf.$ctrl.reportInput, '');
$dlg.rpt.dialog('option', 'title', sax.dlg.title.createUserReport);
sf.openItemDialog();
}
@@ -123,7 +124,7 @@
}
sf.doUpdateItem = function (response)
{
sax.debug('doUpdateItem', response);
//sax.debug('doUpdateItem', response);
if (!response || !response.success) return;
let item = response.report;
if (!item) return;
@@ -131,14 +132,14 @@
$('input.UserReportExists', $frm.rpt).val(1);
$('select.UserReportType', $frm.rpt).val(item.reportType);
$('input.UserReportTitle', $frm.rpt).val(item.reportTitle);
$('textarea.UserReportReport', $frm.rpt).val(item.report);
sf.rjs.reportEditor = sax.rjs.init(sf.$pnl.reportEditor, sf.$ctrl.reportInput, item.report);
sf.openItemDialog();
}
sf.storeItem = function ()
{
let fn = function (response)
{
sax.debug('onStoreItem', response);
//sax.debug('onStoreItem', response);
if (!response) return;
sax.refreshControlValues(response.controlValues, $frm.rpt);
if (!response.success) return;
@@ -175,6 +176,8 @@
$dlg.rpt = $('#dlgUserReport').dialog(opt);
$frm.rpt = $('#frmUserReport', $dlg.rpt);
$frm.rpt.on('input', '.sax-input, .sax-textarea', function () { sax.clearControlError(this); }).on('change', '.sax-select', function () { sax.clearControlError(this); });
sf.$ctrl.reportInput = $(".UserReportReport .sax-control .UserReportReport");
sf.$pnl.reportEditor = $(".UserReportReport .sax-control .rjs-editor");
setTimeout(sf.refreshResults, 250);
});
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large Load Diff
File diff suppressed because one or more lines are too long
@@ -0,0 +1,102 @@
/*
RoosterJS stylesheet.
*/
.rjs-container
{
border: solid 1px #595959;
border-top-left-radius: 2px;
border-bottom-left-radius: 2px;
}
.rjs-container.rjs-editing
{
/*box-shadow: 0 0 0 2px #80808040 inset;*/
}
.rjs-editor
{
min-height: 96px;
max-height: 256px;
padding: 4px 8px 4px 8px;
overflow-y: scroll;
}
.rjs-editor:focus
{
/*box-shadow:none;*/
}
.rjs-toolbar
{
display: none;
min-height: 16px;
padding: 2px 4px 2px 4px;
line-height: 0;
border-top: 1px solid #808080;
overflow: hidden;
}
.rjs-container.rjs-editing .rjs-toolbar
{
display: block;
}
.rjs-toolbar .rjs-action
{
display: inline-block;
width: 24px;
height: 24px;
margin: 0 1px;
border: 1px solid transparent;
border-radius: 4px;
background-position: center center;
background-repeat: no-repeat;
}
.rjs-toolbar .rjs-action:hover
{
border-color: #b0b0b0;
}
.rjs-toolbar .rjs-action.rjs-bold
{
background-image: url("/img/Bootstrap/icon/type-bold.svg");
}
.rjs-toolbar .rjs-action.rjs-italic
{
background-image: url("/img/Bootstrap/icon/type-italic.svg");
}
.rjs-toolbar .rjs-action.rjs-underline
{
background-image: url("/img/Bootstrap/icon/type-underline.svg");
}
.rjs-toolbar .rjs-action.rjs-text
{
background-image: url("/img/Bootstrap/icon/type-text.svg");
}
.rjs-toolbar .rjs-action.rjs-indent
{
background-image: url("/img/Bootstrap/icon/indent.svg");
}
.rjs-toolbar .rjs-action.rjs-unindent
{
background-image: url("/img/Bootstrap/icon/unindent.svg");
}
.rjs-toolbar .rjs-action.rjs-list-number
{
background-image: url("/img/Bootstrap/icon/list-ol.svg");
}
.rjs-toolbar .rjs-action.rjs-list-bullit
{
background-image: url("/img/Bootstrap/icon/list-ul.svg");
}
/* The End */
@@ -0,0 +1,55 @@
/*
* RoosterJS scripts.
*/
(function (win, doc, undef)
{
/* Rooster JS Editor. */
"use strict";
let rjs = sax.rjs = sax.rjs || {};
//--------------------------------------------------------------
rjs.init = function ($pnl, $inp, data)
{
let $con = $pnl.closest(".rjs-container");
let $tb = $('.rjs-toolbar', $con).empty();
let editor = roosterjs.createEditor($pnl[0], [], data);
$pnl.off('focus').on('focus', function (evt) { rjs.onFocusEditor(evt, $pnl, $con, $tb, editor, $inp); });
$pnl.off('blur').on('blur', function (evt) { rjs.onBlurEditor(evt, $pnl, $con, $tb, editor, $inp); });
rjs.initToolbar($pnl, $tb, editor);
return editor;
}
rjs.initToolbar = function ($pnl, $tb, ed)
{
$tb.off('click').on('click', function () { $pnl.focus(); });
rjs.addTbAction($pnl, $tb, 'bold', 'Bold', function () { roosterjs.toggleBold(ed); });
rjs.addTbAction($pnl, $tb, 'italic', 'Italic', function () { roosterjs.toggleItalic(ed); });
rjs.addTbAction($pnl, $tb, 'underline', 'Underline', function () { roosterjs.toggleUnderline(ed); });
rjs.addTbAction($pnl, $tb, 'list-number', 'Numbered list', function () { roosterjs.toggleNumbering(ed); });
rjs.addTbAction($pnl, $tb, 'list-bullit', 'Bullit list', function () { roosterjs.toggleBullet(ed); });
rjs.addTbAction($pnl, $tb, 'indent', 'Indent', function () { roosterjs.setIndentation(ed, 0); });
rjs.addTbAction($pnl, $tb, 'unindent', 'Unindent', function () { roosterjs.setIndentation(ed, 1); });
}
rjs.addTbAction = function ($pnl, $tb, act, ttl, fn)
{
$tb.append($('<div>').addClass('rjs-action rjs-' + act).prop('title', ttl).prop('tabindex',9).on('click', fn));
}
rjs.onFocusEditor = function (evt, $pnl, $con, $tb, rjsEd, $inp)
{
$con.addClass("rjs-editing");
}
rjs.onBlurEditor = function (evt, $pnl, $con, $tb, rjsEd, $inp)
{
if ($.contains($con[0],evt.relatedTarget)) return;
$con.removeClass("rjs-editing");
while ($pnl.children().length > 1)
{
let lc = $pnl.children().last();
if (!lc || lc.text().trim().length) break;
lc.remove();
}
$inp.val($pnl.html());
}
//--------------------------------------------------------------
//$(function (){});
//--------------------------------------------------------------
}(window, window.document));
/* The End */