Skip to content

Commit

Permalink
2.26.0
Browse files Browse the repository at this point in the history
2.26.0
  • Loading branch information
JiHong88 committed Mar 11, 2020
2 parents 6765fa4 + 6f437ea commit ea0b44d
Show file tree
Hide file tree
Showing 63 changed files with 5,876 additions and 2,579 deletions.
242 changes: 188 additions & 54 deletions README.md

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion dist/css/suneditor.min.css

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion dist/suneditor.min.js

Large diffs are not rendered by default.

3 changes: 2 additions & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
"sideEffects": [
"./src/assets/css/*.css"
],
"version": "2.25.0",
"version": "2.26.0",
"description": "Pure JavaScript based WYSIWYG web editor",
"main": "src/suneditor.js",
"keywords": [
Expand Down Expand Up @@ -51,6 +51,7 @@
"karma": "^3.1.4",
"karma-chrome-launcher": "^2.2.0",
"karma-jasmine": "^1.1.2",
"katex": "^0.11.1",
"lodash": "^4.17.14",
"mini-css-extract-plugin": "^0.4.5",
"optimize-css-assets-webpack-plugin": "^5.0.3",
Expand Down
5 changes: 3 additions & 2 deletions sample/css/bootstrap.css
Original file line number Diff line number Diff line change
Expand Up @@ -727,7 +727,7 @@ input[type="button"].btn-block {
float: left;
height: 50px;
padding: 15px 15px;
font-size: 18px;
font-size: 22px;
line-height: 20px;
}
.navbar-brand:hover,
Expand Down Expand Up @@ -795,7 +795,8 @@ input[type="button"].btn-block {
.navbar-inverse {
background-color: #f4b124;
border-color: #ffebc1;
padding-top: 10px;
padding-top: 5px;
padding-bottom: 5px;
}
.navbar-inverse .navbar-brand {
color: #333;
Expand Down
9 changes: 1 addition & 8 deletions sample/css/sample.css
Original file line number Diff line number Diff line change
@@ -1,12 +1,5 @@
body {
background-color:black;
background-image:
radial-gradient(white, rgba(255,255,255,.2) 2px, transparent 40px),
radial-gradient(white, rgba(255,255,255,.15) 1px, transparent 30px),
radial-gradient(white, rgba(255,255,255,.1) 2px, transparent 40px),
radial-gradient(rgba(255,255,255,.4), rgba(255,255,255,.1) 2px, transparent 30px);
background-size: 550px 550px, 350px 350px, 250px 250px, 150px 150px;
background-position: 0 0, 40px 60px, 130px 270px, 70px 100px;
background-color: #000;
}

.content {
Expand Down
949 changes: 806 additions & 143 deletions sample/html/customPlugins.html

Large diffs are not rendered by default.

41 changes: 29 additions & 12 deletions sample/html/examples.html
Original file line number Diff line number Diff line change
Expand Up @@ -157,9 +157,9 @@
<p></p>
<textarea id="imageManagement" style="display: none;">
<p>cat</p>
<div class="se-component se-image-container __se__float-none" contenteditable="false" style=""><figure style="margin: 0px;"><img src="http://suneditor.com/docs/s-cat.jpg" data-align="none" alt="" data-rotate="" data-proportion="true" data-rotatex="" data-rotatey="" origin-size="300,199" data-origin="300,199" data-file-name="s-cat.jpg" data-file-size="40500" style="width: 300px; transform: rotate(0deg); height: 198px;" data-size="300px,198px" data-index="0"></figure></div>
<div class="se-component se-image-container __se__float-none" contenteditable="false"><figure style="margin: 0px;"><img src="http://suneditor.com/docs/s-cat.jpg" data-align="none" alt="" data-rotate="" data-proportion="true" data-rotatex="" data-rotatey="" origin-size="300,199" data-origin="300,199" data-file-name="s-cat.jpg" data-file-size="40500" style="width: 300px; transform: rotate(0deg); height: 198px;" data-size="300px,198px" data-index="0"></figure></div>
<p>cat1</p>
<div class="se-component se-image-container __se__float-none" contenteditable="false" style=""><figure style="margin: 0px; width: 300px;"><img src="http://suneditor.com/docs/s-cat1.jpg" data-align="none" alt="" data-rotate="" data-proportion="true" data-rotatex="" data-rotatey="" origin-size="300,200" data-origin="300,200" data-file-name="s-cat1.jpg" data-file-size="52000" style="width: 300px; height: 174px; transform: rotate(0deg);" data-size="300px,174px" data-index="2"><figcaption style="margin-top: 0px;"><div>Insert description</div></figcaption></figure></div>
<div class="se-component se-image-container __se__float-none" contenteditable="false"><figure style="margin: 0px; width: 300px;"><img src="http://suneditor.com/docs/s-cat1.jpg" data-align="none" alt="" data-rotate="" data-proportion="true" data-rotatex="" data-rotatey="" origin-size="300,200" data-origin="300,200" data-file-name="s-cat1.jpg" data-file-size="52000" style="width: 300px; height: 174px; transform: rotate(0deg);" data-size="300px,174px" data-index="2"><figcaption style="margin-top: 0px;"><div>Insert description</div></figcaption></figure></div>
<p><br></p>
</textarea>
<div class="image-list">
Expand Down Expand Up @@ -478,17 +478,23 @@
<span class="pl-c"><span class="pl-c">//</span> Event functions -------------------------------------------------------------------------------------</span>
<span class="pl-c"><span class="pl-c">//</span> It can be redefined by receiving event object as parameter.</span>
<span class="pl-c"><span class="pl-c">//</span> It is not called in exceptional cases and is called after the default event function has finished.</span>
<span class="pl-smi">editor</span>.<span class="pl-en">onScroll</span> <span class="pl-k">=</span> <span class="pl-k">function</span> (<span class="pl-smi">e</span>) { <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">'</span>onScroll<span class="pl-pds">'</span></span>, e) }
<span class="pl-smi">editor</span>.<span class="pl-en">onScroll</span> <span class="pl-k">=</span> <span class="pl-k">function</span> (<span class="pl-smi">e</span>, <span class="pl-smi">core</span>) { <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">'</span>onScroll<span class="pl-pds">'</span></span>, e) }

<span class="pl-smi">editor</span>.<span class="pl-en">onClick</span> <span class="pl-k">=</span> <span class="pl-k">function</span> (<span class="pl-smi">e</span>) { <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">'</span>onClick<span class="pl-pds">'</span></span>, e) }
<span class="pl-smi">editor</span>.<span class="pl-en">onClick</span> <span class="pl-k">=</span> <span class="pl-k">function</span> (<span class="pl-smi">e</span>, <span class="pl-smi">core</span>) { <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">'</span>onClick<span class="pl-pds">'</span></span>, e) }

<span class="pl-smi">editor</span>.<span class="pl-en">onKeyDown</span> <span class="pl-k">=</span> <span class="pl-k">function</span> (<span class="pl-smi">e</span>) { <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">'</span>onKeyDown<span class="pl-pds">'</span></span>, e) }
<span class="pl-smi">editor</span>.<span class="pl-en">onMouseDown</span> <span class="pl-k">=</span> <span class="pl-k">function</span> (<span class="pl-smi">e</span>, <span class="pl-smi">core</span>) { <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">'</span>onMouseDown<span class="pl-pds">'</span></span>, e) }

<span class="pl-smi">editor</span>.<span class="pl-en">onKeyUp</span> <span class="pl-k">=</span> <span class="pl-k">function</span> (<span class="pl-smi">e</span>) { <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">'</span>onKeyUp<span class="pl-pds">'</span></span>, e) }
<span class="pl-smi">editor</span>.<span class="pl-en">onKeyDown</span> <span class="pl-k">=</span> <span class="pl-k">function</span> (<span class="pl-smi">e</span>, <span class="pl-smi">core</span>) { <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">'</span>onKeyDown<span class="pl-pds">'</span></span>, e) }

<span class="pl-smi">editor</span>.<span class="pl-en">onDrop</span> <span class="pl-k">=</span> <span class="pl-k">function</span> (<span class="pl-smi">e</span>) { <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">'</span>onDrop<span class="pl-pds">'</span></span>, e) }
<span class="pl-smi">editor</span>.<span class="pl-en">onKeyUp</span> <span class="pl-k">=</span> <span class="pl-k">function</span> (<span class="pl-smi">e</span>, <span class="pl-smi">core</span>) { <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">'</span>onKeyUp<span class="pl-pds">'</span></span>, e) }

<span class="pl-smi">editor</span>.<span class="pl-en">onChange</span> <span class="pl-k">=</span> <span class="pl-k">function</span> (<span class="pl-smi">contents</span>) { <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">'</span>onChange<span class="pl-pds">'</span></span>, contents) }
<span class="pl-smi">editor</span>.<span class="pl-en">onDrop</span> <span class="pl-k">=</span> <span class="pl-k">function</span> (<span class="pl-smi">e</span>, <span class="pl-smi">core</span>) { <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">'</span>onDrop<span class="pl-pds">'</span></span>, e) }

<span class="pl-smi">editor</span>.<span class="pl-en">onChange</span> <span class="pl-k">=</span> <span class="pl-k">function</span> (<span class="pl-smi">contents</span>, <span class="pl-smi">core</span>) { <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">'</span>onChange<span class="pl-pds">'</span></span>, contents) }

<span class="pl-smi">editor</span>.<span class="pl-en">onFocus</span> <span class="pl-k">=</span> <span class="pl-k">function</span> (<span class="pl-smi">e</span>, <span class="pl-smi">core</span>) { <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">'</span>onFocus<span class="pl-pds">'</span></span>, e) }

<span class="pl-smi">editor</span>.<span class="pl-en">onBlur</span> <span class="pl-k">=</span> <span class="pl-k">function</span> (<span class="pl-smi">e</span>, <span class="pl-smi">core</span>) { <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">'</span>onBlur<span class="pl-pds">'</span></span>, e) }

<span class="pl-c"><span class="pl-c">//</span> onload event</span>
<span class="pl-c"><span class="pl-c">//</span> When reloaded with the "setOptions" method, the value of the "reload" argument is true.</span>
Expand All @@ -504,7 +510,7 @@
<span class="pl-c"> * cleanData : HTML string modified for editor format</span>
<span class="pl-c"> * maxCharCount : maxChartCount option (true if max character is exceeded)</span>
<span class="pl-c"><span class="pl-c">*/</span></span>
<span class="pl-smi">editor</span>.<span class="pl-en">onPaste</span> <span class="pl-k">=</span> <span class="pl-k">function</span> (<span class="pl-smi">e</span>, <span class="pl-smi">cleanData</span>, <span class="pl-smi">maxCharCount</span>) { <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">'</span>onPaste<span class="pl-pds">'</span></span>, e, cleanData, maxCharCount) }
<span class="pl-smi">editor</span>.<span class="pl-en">onPaste</span> <span class="pl-k">=</span> <span class="pl-k">function</span> (<span class="pl-smi">e</span>, <span class="pl-smi">cleanData</span>, <span class="pl-smi">maxCharCount</span>, <span class="pl-smi">core</span>) { <span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">'</span>onPaste<span class="pl-pds">'</span></span>, e, cleanData, maxCharCount) }

<span class="pl-c"><span class="pl-c">//</span> Called when the image is uploaded or the uploaded image is deleted.</span>
<span class="pl-c"><span class="pl-c">/**</span></span>
Expand All @@ -520,7 +526,7 @@
<span class="pl-c"> * }</span>
<span class="pl-c"> * remainingFilesCount: Count of remaining image files</span>
<span class="pl-c"><span class="pl-c">*/</span></span>
<span class="pl-smi">editor</span>.<span class="pl-en">onImageUpload</span> <span class="pl-k">=</span> <span class="pl-k">function</span> (<span class="pl-smi">targetImgElement</span>, <span class="pl-smi">index</span>, <span class="pl-smi">state</span>, <span class="pl-smi">imageInfo</span>, <span class="pl-smi">remainingFilesCount</span>) {
<span class="pl-smi">editor</span>.<span class="pl-en">onImageUpload</span> <span class="pl-k">=</span> <span class="pl-k">function</span> (<span class="pl-smi">targetImgElement</span>, <span class="pl-smi">index</span>, <span class="pl-smi">state</span>, <span class="pl-smi">imageInfo</span>, <span class="pl-smi">remainingFilesCount</span>, <span class="pl-smi">core</span>) {
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">`</span>targetImgElement:<span class="pl-s1"><span class="pl-pse">${</span>targetImgElement<span class="pl-pse">}</span></span>, index:<span class="pl-s1"><span class="pl-pse">${</span>index<span class="pl-pse">}</span></span>, state('create', 'update', 'delete'):<span class="pl-s1"><span class="pl-pse">${</span>state<span class="pl-pse">}</span></span><span class="pl-pds">`</span></span>)
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">`</span>imageInfo:<span class="pl-s1"><span class="pl-pse">${</span>imageInfo<span class="pl-pse">}</span></span>, remainingFilesCount:<span class="pl-s1"><span class="pl-pse">${</span>remainingFilesCount<span class="pl-pse">}</span></span><span class="pl-pds">`</span></span>)
}
Expand All @@ -531,15 +537,22 @@
<span class="pl-c"> * errorMessage: Error message to show</span>
<span class="pl-c"> * result: Result object </span>
<span class="pl-c"><span class="pl-c">*/</span></span>
<span class="pl-smi">editor</span>.<span class="pl-en">onImageUploadError</span> <span class="pl-k">=</span> <span class="pl-k">function</span> (<span class="pl-smi">errorMessage</span>, <span class="pl-smi">result</span>) {
<span class="pl-smi">editor</span>.<span class="pl-en">onImageUploadError</span> <span class="pl-k">=</span> <span class="pl-k">function</span> (<span class="pl-smi">errorMessage</span>, <span class="pl-smi">result</span>, <span class="pl-smi">core</span>) {
<span class="pl-en">alert</span>(errorMessage)
}

<span class="pl-c"><span class="pl-c">//</span> Called before the image is uploaded.</span>
<span class="pl-c"><span class="pl-c">//</span> If false is returned, no image upload is performed.</span>
<span class="pl-smi">editor</span>.<span class="pl-en">onImageUploadBefore</span> <span class="pl-k">=</span> <span class="pl-c1">null</span>

<span class="pl-c"><span class="pl-c">//</span> It replaces the default callback function of the image upload.</span>
<span class="pl-smi">editor</span>.<span class="pl-en">imageUploadHandler</span> <span class="pl-k">=</span> <span class="pl-c1">null</span>

<span class="pl-c"><span class="pl-c">/**</span></span>
<span class="pl-c"> * toolbar: Toolbar Element</span>
<span class="pl-c"> * context: The editor's context object (editor.getContext())</span>
<span class="pl-c"><span class="pl-c">*/</span></span>
<span class="pl-smi">editor</span>.<span class="pl-en">showInline</span> <span class="pl-k">=</span> <span class="pl-k">function</span> (<span class="pl-smi">toolbar</span>, <span class="pl-smi">context</span>) {
<span class="pl-smi">editor</span>.<span class="pl-en">showInline</span> <span class="pl-k">=</span> <span class="pl-k">function</span> (<span class="pl-smi">toolbar</span>, <span class="pl-smi">context</span>, <span class="pl-smi">core</span>) {
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">'</span>toolbar<span class="pl-pds">'</span></span>, toolbar);
<span class="pl-en">console</span>.<span class="pl-c1">log</span>(<span class="pl-s"><span class="pl-pds">'</span>context<span class="pl-pds">'</span></span>, context);
}</pre></div>
Expand Down Expand Up @@ -791,11 +804,15 @@

suneditor.onload = function (core, reload) { console.log('onload-core', core); console.log('onload-reload', reload)}
suneditor.onScroll = function (e) { console.log('onScroll', e); }
suneditor.onMouseDown = function (e) { console.log('onMouseDown', e) }
suneditor.onClick = function (e) { console.log('onClick', e) }
suneditor.onKeyDown = function (e) { console.log('onKeyDown', e) }
suneditor.onKeyUp = function (e) { console.log('onKeyUp', e) }
suneditor.onDrop = function (e) { console.log('onDrop', e) }
suneditor.onChange = function (contents) { console.log('onChange', contents) }
suneditor.onPaste = function (e, cleanData, maxCharCount, core) { console.log('onPaste', e, cleanData, maxCharCount) }
suneditor.onFocus = function (contents) { console.log('onFocus', contents) }
suneditor.onBlur = function (contents) { console.log('onBlur', contents) }
suneditor.onImageUpload = function (targetImgElement, index, state, imageInfo, remainingFilesCount) {
console.log('targetImgElement:' + targetImgElement + ', index:' + index + ', state("create","update","delete"):' + state + ', imageInfo:' + imageInfo + ', remainingFilesCount:' + remainingFilesCount)
}
Expand Down
Loading

0 comments on commit ea0b44d

Please sign in to comment.