tongChong
/
wangEditor
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Merge remote-tracking branch 'origin/dev' into feature-strikethrough 

# Conflicts:
#	src/config/menus.ts
#	src/menus/menu-list.ts
This commit is contained in:
lkw199711 2020-06-20 23:09:52 +08:00
parent 511cdd05dc 6923608c8c
commit 10ebbe4352
30 changed files with 1210 additions and 40 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
.gitignore vendored
View File

@ -106,3 +106,5 @@ dist
examples/test-page/
.DS_Store
ISSUE1.md

6
ISSUE.md
View File

@ -1,10 +1,6 @@
# 问题记录
webpack 配置路径别名
统一整理 public protected private
`command.ts` 中暂时不使用 `styleWithCSS` —— 或者做到 config 中
统一整理 public protected private
`text/index.ts` 代码角度，需要拆分
- 获取 json 还没做

3
attachment/README.md Normal file
View File

@ -0,0 +1,3 @@
# Attachment
附加内容，和代码运行无关。

7
attachment/icomoon/Read Me.txt Executable file
View File

@ -0,0 +1,7 @@
Open *demo.html* to see a list of all the glyphs in your font along with their codes/ligatures.
To use the generated font in desktop programs, you can install the TTF font. In order to copy the character associated with each icon, refer to the text box at the bottom right corner of each glyph in demo.html. The character inside this text box may be invisible; but it can still be copied. See this guide for more info: https://icomoon.io/#docs/local-fonts
You won't need any of the files located under the *demo-files* directory when including the generated font in your own projects.
You can import *selection.json* back to the IcoMoon app using the *Import Icons* button (or via Main Menu → Manage Projects) to retrieve your icon selection.

155
attachment/icomoon/demo-files/demo.css Executable file
View File

@ -0,0 +1,155 @@
body {
padding: 0;
margin: 0;
font-family: sans-serif;
font-size: 1em;
line-height: 1.5;
color: #555;
background: #fff;
}
h1 {
font-size: 1.5em;
font-weight: normal;
}
small {
font-size: .66666667em;
}
a {
color: #e74c3c;
text-decoration: none;
}
a:hover, a:focus {
box-shadow: 0 1px #e74c3c;
}
.bshadow0, input {
box-shadow: inset 0 -2px #e7e7e7;
}
input:hover {
box-shadow: inset 0 -2px #ccc;
}
input, fieldset {
font-family: sans-serif;
font-size: 1em;
margin: 0;
padding: 0;
border: 0;
}
input {
color: inherit;
line-height: 1.5;
height: 1.5em;
padding: .25em 0;
}
input:focus {
outline: none;
box-shadow: inset 0 -2px #449fdb;
}
.glyph {
font-size: 16px;
width: 15em;
padding-bottom: 1em;
margin-right: 4em;
margin-bottom: 1em;
float: left;
overflow: hidden;
}
.liga {
width: 80%;
width: calc(100% - 2.5em);
}
.talign-right {
text-align: right;
}
.talign-center {
text-align: center;
}
.bgc1 {
background: #f1f1f1;
}
.fgc1 {
color: #999;
}
.fgc0 {
color: #000;
}
p {
margin-top: 1em;
margin-bottom: 1em;
}
.mvm {
margin-top: .75em;
margin-bottom: .75em;
}
.mtn {
margin-top: 0;
}
.mtl, .mal {
margin-top: 1.5em;
}
.mbl, .mal {
margin-bottom: 1.5em;
}
.mal, .mhl {
margin-left: 1.5em;
margin-right: 1.5em;
}
.mhmm {
margin-left: 1em;
margin-right: 1em;
}
.mls {
margin-left: .25em;
}
.ptl {
padding-top: 1.5em;
}
.pbs, .pvs {
padding-bottom: .25em;
}
.pvs, .pts {
padding-top: .25em;
}
.unit {
float: left;
}
.unitRight {
float: right;
}
.size1of2 {
width: 50%;
}
.size1of1 {
width: 100%;
}
.clearfix:before, .clearfix:after {
content: " ";
display: table;
}
.clearfix:after {
clear: both;
}
.hidden-true {
display: none;
}
.textbox0 {
width: 3em;
background: #f1f1f1;
padding: .25em .5em;
line-height: 1.5;
height: 1.5em;
}
#testDrive {
display: block;
padding-top: 24px;
line-height: 1.5;
}
.fs0 {
font-size: 16px;
}
.fs1 {
font-size: 16px;
}
.fs2 {
font-size: 16px;
}

28
attachment/icomoon/demo-files/demo.js Executable file
View File

@ -0,0 +1,28 @@
if (!('boxShadow' in document.body.style)) {
document.body.setAttribute('class', 'noBoxShadow')
}
document.body.addEventListener('click', function (e) {
var target = e.target
if (target.tagName === 'INPUT' && target.getAttribute('class').indexOf('liga') === -1) {
target.select()
}
})
;(function () {
var fontSize = document.getElementById('fontSize'),
testDrive = document.getElementById('testDrive'),
testText = document.getElementById('testText')
function updateTest() {
testDrive.innerHTML = testText.value || String.fromCharCode(160)
if (window.icomoonLiga) {
window.icomoonLiga(testDrive)
}
}
function updateSize() {
testDrive.style.fontSize = fontSize.value + 'px'
}
fontSize.addEventListener('change', updateSize, false)
testText.addEventListener('input', updateTest, false)
testText.addEventListener('change', updateTest, false)
updateSize()
})()

489
attachment/icomoon/demo.html Executable file
View File

@ -0,0 +1,489 @@
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>IcoMoon Demo</title>
<meta name="description" content="An Icon Font Generated By IcoMoon.io">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="demo-files/demo.css">
<link rel="stylesheet" href="style.css"></head>
<body>
<div class="bgc1 clearfix">
<h1 class="mhmm mvm"><span class="fgc1">Font Name:</span> icomoon <small class="fgc1">(Glyphs:&nbsp;30)</small></h1>
</div>
<div class="clearfix mhl ptl">
<h1 class="mvm mtn fgc1">Grid Size: 16</h1>
<div class="glyph fs1">
<div class="clearfix bshadow0 pbs">
<span class="icon-pencil2"></span>
<span class="mls"> icon-pencil2</span>
</div>
<fieldset class="fs0 size1of1 clearfix hidden-false">
<input type="text" readonly value="e906" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe906;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix hidden-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="pencil2, write2" class="liga unitRight" />
</div>
</div>
<div class="glyph fs1">
<div class="clearfix bshadow0 pbs">
<span class="icon-image"></span>
<span class="mls"> icon-image</span>
</div>
<fieldset class="fs0 size1of1 clearfix hidden-false">
<input type="text" readonly value="e90d" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe90d;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix hidden-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="image, picture" class="liga unitRight" />
</div>
</div>
<div class="glyph fs1">
<div class="clearfix bshadow0 pbs">
<span class="icon-play"></span>
<span class="mls"> icon-play</span>
</div>
<fieldset class="fs0 size1of1 clearfix hidden-false">
<input type="text" readonly value="e912" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe912;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix hidden-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="play, video" class="liga unitRight" />
</div>
</div>
<div class="glyph fs1">
<div class="clearfix bshadow0 pbs">
<span class="icon-location"></span>
<span class="mls"> icon-location</span>
</div>
<fieldset class="fs0 size1of1 clearfix hidden-false">
<input type="text" readonly value="e947" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe947;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix hidden-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="location, map-marker" class="liga unitRight" />
</div>
</div>
<div class="glyph fs1">
<div class="clearfix bshadow0 pbs">
<span class="icon-undo"></span>
<span class="mls"> icon-undo</span>
</div>
<fieldset class="fs0 size1of1 clearfix hidden-false">
<input type="text" readonly value="e965" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe965;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix hidden-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="undo, ccw" class="liga unitRight" />
</div>
</div>
<div class="glyph fs1">
<div class="clearfix bshadow0 pbs">
<span class="icon-redo"></span>
<span class="mls"> icon-redo</span>
</div>
<fieldset class="fs0 size1of1 clearfix hidden-false">
<input type="text" readonly value="e966" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe966;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix hidden-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="redo, cw" class="liga unitRight" />
</div>
</div>
<div class="glyph fs1">
<div class="clearfix bshadow0 pbs">
<span class="icon-quotes-left"></span>
<span class="mls"> icon-quotes-left</span>
</div>
<fieldset class="fs0 size1of1 clearfix hidden-false">
<input type="text" readonly value="e977" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe977;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix hidden-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="quotes-left, ldquo" class="liga unitRight" />
</div>
</div>
<div class="glyph fs1">
<div class="clearfix bshadow0 pbs">
<span class="icon-list-numbered"></span>
<span class="mls"> icon-list-numbered</span>
</div>
<fieldset class="fs0 size1of1 clearfix hidden-false">
<input type="text" readonly value="e9b9" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe9b9;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix hidden-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="list-numbered, options" class="liga unitRight" />
</div>
</div>
<div class="glyph fs1">
<div class="clearfix bshadow0 pbs">
<span class="icon-list2"></span>
<span class="mls"> icon-list2</span>
</div>
<fieldset class="fs0 size1of1 clearfix hidden-false">
<input type="text" readonly value="e9bb" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe9bb;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix hidden-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="list2, todo2" class="liga unitRight" />
</div>
</div>
<div class="glyph fs1">
<div class="clearfix bshadow0 pbs">
<span class="icon-upload2"></span>
<span class="mls"> icon-upload2</span>
</div>
<fieldset class="fs0 size1of1 clearfix hidden-false">
<input type="text" readonly value="e9c6" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe9c6;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix hidden-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="upload2, load2" class="liga unitRight" />
</div>
</div>
<div class="glyph fs1">
<div class="clearfix bshadow0 pbs">
<span class="icon-link"></span>
<span class="mls"> icon-link</span>
</div>
<fieldset class="fs0 size1of1 clearfix hidden-false">
<input type="text" readonly value="e9cb" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe9cb;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix hidden-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="link, chain" class="liga unitRight" />
</div>
</div>
<div class="glyph fs1">
<div class="clearfix bshadow0 pbs">
<span class="icon-happy"></span>
<span class="mls"> icon-happy</span>
</div>
<fieldset class="fs0 size1of1 clearfix hidden-false">
<input type="text" readonly value="e9df" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe9df;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix hidden-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="happy, emoticon" class="liga unitRight" />
</div>
</div>
<div class="glyph fs1">
<div class="clearfix bshadow0 pbs">
<span class="icon-cancel-circle"></span>
<span class="mls"> icon-cancel-circle</span>
</div>
<fieldset class="fs0 size1of1 clearfix hidden-false">
<input type="text" readonly value="ea0d" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xea0d;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix hidden-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="cancel-circle, close" class="liga unitRight" />
</div>
</div>
<div class="glyph fs1">
<div class="clearfix bshadow0 pbs">
<span class="icon-font"></span>
<span class="mls"> icon-font</span>
</div>
<fieldset class="fs0 size1of1 clearfix hidden-false">
<input type="text" readonly value="ea5c" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xea5c;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix hidden-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="font, typeface" class="liga unitRight" />
</div>
</div>
<div class="glyph fs1">
<div class="clearfix bshadow0 pbs">
<span class="icon-text-height"></span>
<span class="mls"> icon-text-height</span>
</div>
<fieldset class="fs0 size1of1 clearfix hidden-false">
<input type="text" readonly value="ea5f" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xea5f;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix hidden-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="text-height, wysiwyg" class="liga unitRight" />
</div>
</div>
<div class="glyph fs1">
<div class="clearfix bshadow0 pbs">
<span class="icon-bold"></span>
<span class="mls"> icon-bold</span>
</div>
<fieldset class="fs0 size1of1 clearfix hidden-false">
<input type="text" readonly value="ea62" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xea62;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix hidden-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="bold, wysiwyg4" class="liga unitRight" />
</div>
</div>
<div class="glyph fs1">
<div class="clearfix bshadow0 pbs">
<span class="icon-underline"></span>
<span class="mls"> icon-underline</span>
</div>
<fieldset class="fs0 size1of1 clearfix hidden-false">
<input type="text" readonly value="ea63" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xea63;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix hidden-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="underline, wysiwyg5" class="liga unitRight" />
</div>
</div>
<div class="glyph fs1">
<div class="clearfix bshadow0 pbs">
<span class="icon-italic"></span>
<span class="mls"> icon-italic</span>
</div>
<fieldset class="fs0 size1of1 clearfix hidden-false">
<input type="text" readonly value="ea64" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xea64;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix hidden-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="italic, wysiwyg6" class="liga unitRight" />
</div>
</div>
<div class="glyph fs1">
<div class="clearfix bshadow0 pbs">
<span class="icon-strikethrough"></span>
<span class="mls"> icon-strikethrough</span>
</div>
<fieldset class="fs0 size1of1 clearfix hidden-false">
<input type="text" readonly value="ea65" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xea65;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix hidden-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="strikethrough, wysiwyg7" class="liga unitRight" />
</div>
</div>
<div class="glyph fs1">
<div class="clearfix bshadow0 pbs">
<span class="icon-page-break"></span>
<span class="mls"> icon-page-break</span>
</div>
<fieldset class="fs0 size1of1 clearfix hidden-false">
<input type="text" readonly value="ea68" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xea68;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix hidden-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="page-break, wysiwyg10" class="liga unitRight" />
</div>
</div>
<div class="glyph fs1">
<div class="clearfix bshadow0 pbs">
<span class="icon-table2"></span>
<span class="mls"> icon-table2</span>
</div>
<fieldset class="fs0 size1of1 clearfix hidden-false">
<input type="text" readonly value="ea71" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xea71;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix hidden-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="table2, wysiwyg19" class="liga unitRight" />
</div>
</div>
<div class="glyph fs1">
<div class="clearfix bshadow0 pbs">
<span class="icon-paragraph-left"></span>
<span class="mls"> icon-paragraph-left</span>
</div>
<fieldset class="fs0 size1of1 clearfix hidden-false">
<input type="text" readonly value="ea77" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xea77;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix hidden-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="paragraph-left, wysiwyg25" class="liga unitRight" />
</div>
</div>
<div class="glyph fs1">
<div class="clearfix bshadow0 pbs">
<span class="icon-paragraph-center"></span>
<span class="mls"> icon-paragraph-center</span>
</div>
<fieldset class="fs0 size1of1 clearfix hidden-false">
<input type="text" readonly value="ea78" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xea78;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix hidden-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="paragraph-center, wysiwyg26" class="liga unitRight" />
</div>
</div>
<div class="glyph fs1">
<div class="clearfix bshadow0 pbs">
<span class="icon-paragraph-right"></span>
<span class="mls"> icon-paragraph-right</span>
</div>
<fieldset class="fs0 size1of1 clearfix hidden-false">
<input type="text" readonly value="ea79" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xea79;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix hidden-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="paragraph-right, wysiwyg27" class="liga unitRight" />
</div>
</div>
<div class="glyph fs1">
<div class="clearfix bshadow0 pbs">
<span class="icon-paint-format"></span>
<span class="mls"> icon-paint-format</span>
</div>
<fieldset class="fs0 size1of1 clearfix hidden-false">
<input type="text" readonly value="e90c" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe90c;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix hidden-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="paint-format, format" class="liga unitRight" />
</div>
</div>
</div>
<div class="clearfix mhl ptl">
<h1 class="mvm mtn fgc1">Grid Size: 14</h1>
<div class="glyph fs2">
<div class="clearfix bshadow0 pbs">
<span class="icon-close"></span>
<span class="mls"> icon-close</span>
</div>
<fieldset class="fs0 size1of1 clearfix hidden-false">
<input type="text" readonly value="f00d" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xf00d;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix hidden-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="" class="liga unitRight" />
</div>
</div>
<div class="glyph fs2">
<div class="clearfix bshadow0 pbs">
<span class="icon-remove"></span>
<span class="mls"> icon-remove</span>
</div>
<fieldset class="fs0 size1of1 clearfix hidden-false">
<input type="text" readonly value="f00d" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xf00d;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix hidden-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="" class="liga unitRight" />
</div>
</div>
<div class="glyph fs2">
<div class="clearfix bshadow0 pbs">
<span class="icon-times"></span>
<span class="mls"> icon-times</span>
</div>
<fieldset class="fs0 size1of1 clearfix hidden-false">
<input type="text" readonly value="f00d" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xf00d;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix hidden-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="" class="liga unitRight" />
</div>
</div>
<div class="glyph fs2">
<div class="clearfix bshadow0 pbs">
<span class="icon-trash-o"></span>
<span class="mls"> icon-trash-o</span>
</div>
<fieldset class="fs0 size1of1 clearfix hidden-false">
<input type="text" readonly value="f014" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xf014;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix hidden-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="" class="liga unitRight" />
</div>
</div>
<div class="glyph fs2">
<div class="clearfix bshadow0 pbs">
<span class="icon-terminal"></span>
<span class="mls"> icon-terminal</span>
</div>
<fieldset class="fs0 size1of1 clearfix hidden-false">
<input type="text" readonly value="f120" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xf120;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix hidden-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="" class="liga unitRight" />
</div>
</div>
<div class="glyph fs2">
<div class="clearfix bshadow0 pbs">
<span class="icon-header"></span>
<span class="mls"> icon-header</span>
</div>
<fieldset class="fs0 size1of1 clearfix hidden-false">
<input type="text" readonly value="f1dc" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xf1dc;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix hidden-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="" class="liga unitRight" />
</div>
</div>
<div class="glyph fs2">
<div class="clearfix bshadow0 pbs">
<span class="icon-paint-brush"></span>
<span class="mls"> icon-paint-brush</span>
</div>
<fieldset class="fs0 size1of1 clearfix hidden-false">
<input type="text" readonly value="f1fc" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xf1fc;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix hidden-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="" class="liga unitRight" />
</div>
</div>
</div>
<!--[if gt IE 8]><!-->
<div class="mhl clearfix mbl">
<h1>Font Test Drive</h1>
<label>
Font Size: <input id="fontSize" type="number" class="textbox0 mbm"
min="8" value="48" />
px
</label>
<input id="testText" type="text" class="phl size1of1 mvl"
placeholder="Type some text to test..." value=""/>
<div id="testDrive" class="icon-" style="font-family: icomoon">&nbsp;
</div>
</div>
<!--<![endif]-->
<div class="bgc1 clearfix">
<p class="mhl">Generated by <a href="https://icomoon.io/app">IcoMoon</a></p>
</div>
<script src="demo-files/demo.js"></script>
</body>
</html>

BIN
attachment/icomoon/fonts/icomoon.eot Executable file
View File

Binary file not shown.

40
attachment/icomoon/fonts/icomoon.svg Executable file
View File

@ -0,0 +1,40 @@
<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
<svg xmlns="http://www.w3.org/2000/svg">
<metadata>Generated by IcoMoon</metadata>
<defs>
<font id="icomoon" horiz-adv-x="1024">
<font-face units-per-em="1024" ascent="960" descent="-64" />
<missing-glyph horiz-adv-x="1024" />
<glyph unicode="&#x20;" horiz-adv-x="512" d="" />
<glyph unicode="&#xe906;" glyph-name="pencil2" d="M384 320l128 64 448 448-64 64-448-448-64-128zM289.3 92.902c-31.632 66.728-65.666 100.762-132.396 132.394l99.096 272.792 128 77.912 384 384h-192l-384-384-192-640 640 192 384 384v192l-384-384-77.912-128z" />
<glyph unicode="&#xe90c;" glyph-name="paint-format" d="M1024 384v384h-192v64c0 35.2-28.8 64-64 64h-704c-35.2 0-64-28.8-64-64v-192c0-35.2 28.8-64 64-64h704c35.2 0 64 28.8 64 64v64h128v-256h-576v-128h-32c-17.674 0-32-14.326-32-32v-320c0-17.674 14.326-32 32-32h128c17.674 0 32 14.326 32 32v320c0 17.674-14.326 32-32 32h-32v64h576zM768 768h-704v64h704v-64z" />
<glyph unicode="&#xe90d;" glyph-name="image" d="M959.884 832c0.040-0.034 0.082-0.076 0.116-0.116v-767.77c-0.034-0.040-0.076-0.082-0.116-0.116h-895.77c-0.040 0.034-0.082 0.076-0.114 0.116v767.772c0.034 0.040 0.076 0.082 0.114 0.114h895.77zM960 896h-896c-35.2 0-64-28.8-64-64v-768c0-35.2 28.8-64 64-64h896c35.2 0 64 28.8 64 64v768c0 35.2-28.8 64-64 64v0zM832 672c0-53.020-42.98-96-96-96s-96 42.98-96 96 42.98 96 96 96 96-42.98 96-96zM896 128h-768v128l224 384 256-320h64l224 192z" />
<glyph unicode="&#xe912;" glyph-name="play" d="M981.188 799.892c-143.632 20.65-302.332 32.108-469.186 32.108-166.86 0-325.556-11.458-469.194-32.108-27.53-107.726-42.808-226.75-42.808-351.892 0-125.14 15.278-244.166 42.808-351.89 143.638-20.652 302.336-32.11 469.194-32.11 166.854 0 325.552 11.458 469.186 32.11 27.532 107.724 42.812 226.75 42.812 351.89 0 125.142-15.28 244.166-42.812 351.892zM384.002 256v384l320-192-320-192z" />
<glyph unicode="&#xe947;" glyph-name="location" d="M512 960c-176.732 0-320-143.268-320-320 0-320 320-704 320-704s320 384 320 704c0 176.732-143.27 320-320 320zM512 448c-106.040 0-192 85.96-192 192s85.96 192 192 192 192-85.96 192-192-85.96-192-192-192z" />
<glyph unicode="&#xe965;" glyph-name="undo" d="M512 896c-141.384 0-269.376-57.32-362.032-149.978l-149.968 149.978v-384h384l-143.532 143.522c69.496 69.492 165.492 112.478 271.532 112.478 212.068 0 384-171.924 384-384 0-114.696-50.292-217.636-130.018-288l84.666-96c106.302 93.816 173.352 231.076 173.352 384 0 282.77-229.23 512-512 512z" />
<glyph unicode="&#xe966;" glyph-name="redo" d="M0 384c0-152.924 67.048-290.184 173.35-384l84.666 96c-79.726 70.364-130.016 173.304-130.016 288 0 212.076 171.93 384 384 384 106.042 0 202.038-42.986 271.53-112.478l-143.53-143.522h384v384l-149.97-149.978c-92.654 92.658-220.644 149.978-362.030 149.978-282.77 0-512-229.23-512-512z" />
<glyph unicode="&#xe977;" glyph-name="quotes-left" d="M225 512c123.712 0 224-100.29 224-224 0-123.712-100.288-224-224-224s-224 100.288-224 224l-1 32c0 247.424 200.576 448 448 448v-128c-85.474 0-165.834-33.286-226.274-93.726-11.634-11.636-22.252-24.016-31.83-37.020 11.438 1.8 23.16 2.746 35.104 2.746zM801 512c123.71 0 224-100.29 224-224 0-123.712-100.29-224-224-224s-224 100.288-224 224l-1 32c0 247.424 200.576 448 448 448v-128c-85.474 0-165.834-33.286-226.274-93.726-11.636-11.636-22.254-24.016-31.832-37.020 11.44 1.8 23.16 2.746 35.106 2.746z" />
<glyph unicode="&#xe9b9;" glyph-name="list-numbered" d="M384 128h640v-128h-640zM384 512h640v-128h-640zM384 896h640v-128h-640zM192 960v-256h-64v192h-64v64zM128 434v-50h128v-64h-192v146l128 60v50h-128v64h192v-146zM256 256v-320h-192v64h128v64h-128v64h128v64h-128v64z" />
<glyph unicode="&#xe9bb;" glyph-name="list2" d="M384 896h640v-128h-640v128zM384 512h640v-128h-640v128zM384 128h640v-128h-640v128zM0 832c0 70.692 57.308 128 128 128s128-57.308 128-128c0-70.692-57.308-128-128-128s-128 57.308-128 128zM0 448c0 70.692 57.308 128 128 128s128-57.308 128-128c0-70.692-57.308-128-128-128s-128 57.308-128 128zM0 64c0 70.692 57.308 128 128 128s128-57.308 128-128c0-70.692-57.308-128-128-128s-128 57.308-128 128z" />
<glyph unicode="&#xe9c6;" glyph-name="upload2" d="M0 64h1024v-64h-1024zM1024 192v-64h-1024v64l128 256h256v-128h256v128h256zM224 640l288 288 288-288h-224v-256h-128v256z" />
<glyph unicode="&#xe9cb;" glyph-name="link" d="M440.236 324.234c-13.31 0-26.616 5.076-36.77 15.23-95.134 95.136-95.134 249.934 0 345.070l192 192c46.088 46.086 107.36 71.466 172.534 71.466s126.448-25.38 172.536-71.464c95.132-95.136 95.132-249.934 0-345.070l-87.766-87.766c-20.308-20.308-53.23-20.308-73.54 0-20.306 20.306-20.306 53.232 0 73.54l87.766 87.766c54.584 54.586 54.584 143.404 0 197.99-26.442 26.442-61.6 41.004-98.996 41.004s-72.552-14.562-98.996-41.006l-192-191.998c-54.586-54.586-54.586-143.406 0-197.992 20.308-20.306 20.306-53.232 0-73.54-10.15-10.152-23.462-15.23-36.768-15.23zM256-52c-65.176 0-126.45 25.38-172.534 71.464-95.134 95.136-95.134 249.934 0 345.070l87.764 87.764c20.308 20.306 53.234 20.306 73.54 0 20.308-20.306 20.308-53.232 0-73.54l-87.764-87.764c-54.586-54.586-54.586-143.406 0-197.992 26.44-26.44 61.598-41.002 98.994-41.002s72.552 14.562 98.998 41.006l192 191.998c54.584 54.586 54.584 143.406 0 197.992-20.308 20.308-20.306 53.232 0 73.54 20.306 20.306 53.232 20.306 73.54-0.002 95.132-95.134 95.132-249.932 0.002-345.068l-192.002-192c-46.090-46.088-107.364-71.466-172.538-71.466z" />
<glyph unicode="&#xe9df;" glyph-name="happy" d="M512-64c282.77 0 512 229.23 512 512s-229.23 512-512 512-512-229.23-512-512 229.23-512 512-512zM512 864c229.75 0 416-186.25 416-416s-186.25-416-416-416-416 186.25-416 416 186.25 416 416 416zM512 361.24c115.95 0 226.23 30.806 320 84.92-14.574-178.438-153.128-318.16-320-318.16-166.868 0-305.422 139.872-320 318.304 93.77-54.112 204.050-85.064 320-85.064zM256 608c0 53.019 28.654 96 64 96s64-42.981 64-96c0-53.019-28.654-96-64-96s-64 42.981-64 96zM640 608c0 53.019 28.654 96 64 96s64-42.981 64-96c0-53.019-28.654-96-64-96s-64 42.981-64 96z" />
<glyph unicode="&#xea0d;" glyph-name="cancel-circle" d="M512 960c-282.77 0-512-229.23-512-512s229.23-512 512-512 512 229.23 512 512-229.23 512-512 512zM512 32c-229.75 0-416 186.25-416 416s186.25 416 416 416 416-186.25 416-416-186.25-416-416-416zM672 704l-160-160-160 160-96-96 160-160-160-160 96-96 160 160 160-160 96 96-160 160 160 160z" />
<glyph unicode="&#xea5c;" glyph-name="font" d="M799.596 943.792c-90.526 0-148.62 16.208-241.848 16.208-301.284 0-441.792-171.584-441.792-345.872 0-102.678 48.64-136.458 144.564-136.458-6.758 14.864-18.914 31.080-18.914 104.034 0 204.010 77.006 263.458 175.636 267.51 0 0-80.918-793.374-315.778-888.542v-24.672h316.594l108.026 512h197.844l44.072 128h-214.908l51.944 246.19c59.446-12.156 117.542-24.316 167.532-24.316 62.148 0 118.894 18.914 149.968 162.126-37.826-12.16-78.362-16.208-122.94-16.208z" />
<glyph unicode="&#xea5f;" glyph-name="text-height" d="M896 192h128l-160-192-160 192h128v512h-128l160 192 160-192h-128zM640 896v-256l-64 128h-192v-704h128v-64h-384v64h128v704h-192l-64-128v256z" />
<glyph unicode="&#xea62;" glyph-name="bold" d="M707.88 475.348c37.498 44.542 60.12 102.008 60.12 164.652 0 141.16-114.842 256-256 256h-320v-896h384c141.158 0 256 114.842 256 256 0 92.956-49.798 174.496-124.12 219.348zM384 768h101.5c55.968 0 101.5-57.42 101.5-128s-45.532-128-101.5-128h-101.5v256zM543 128h-159v256h159c58.45 0 106-57.42 106-128s-47.55-128-106-128z" />
<glyph unicode="&#xea63;" glyph-name="underline" d="M704 896h128v-416c0-159.058-143.268-288-320-288-176.73 0-320 128.942-320 288v416h128v-416c0-40.166 18.238-78.704 51.354-108.506 36.896-33.204 86.846-51.494 140.646-51.494s103.75 18.29 140.646 51.494c33.116 29.802 51.354 68.34 51.354 108.506v416zM192 128h640v-128h-640z" />
<glyph unicode="&#xea64;" glyph-name="italic" d="M896 896v-64h-128l-320-768h128v-64h-448v64h128l320 768h-128v64z" />
<glyph unicode="&#xea65;" glyph-name="strikethrough" d="M1024 448v-64h-234.506c27.504-38.51 42.506-82.692 42.506-128 0-70.878-36.66-139.026-100.58-186.964-59.358-44.518-137.284-69.036-219.42-69.036-82.138 0-160.062 24.518-219.42 69.036-63.92 47.938-100.58 116.086-100.58 186.964h128c0-69.382 87.926-128 192-128s192 58.618 192 128c0 69.382-87.926 128-192 128h-512v64h299.518c-2.338 1.654-4.656 3.324-6.938 5.036-63.92 47.94-100.58 116.086-100.58 186.964s36.66 139.024 100.58 186.964c59.358 44.518 137.282 69.036 219.42 69.036 82.136 0 160.062-24.518 219.42-69.036 63.92-47.94 100.58-116.086 100.58-186.964h-128c0 69.382-87.926 128-192 128s-192-58.618-192-128c0-69.382 87.926-128 192-128 78.978 0 154.054-22.678 212.482-64h299.518z" />
<glyph unicode="&#xea68;" glyph-name="page-break" d="M0 448h128v-64h-128zM192 448h192v-64h-192zM448 448h128v-64h-128zM640 448h192v-64h-192zM896 448h128v-64h-128zM880 960l16-448h-768l16 448h32l16-384h640l16 384zM144-64l-16 384h768l-16-384h-32l-16 320h-640l-16-320z" />
<glyph unicode="&#xea71;" glyph-name="table2" d="M0 896v-896h1024v896h-1024zM384 320v192h256v-192h-256zM640 256v-192h-256v192h256zM640 768v-192h-256v192h256zM320 768v-192h-256v192h256zM64 512h256v-192h-256v192zM704 512h256v-192h-256v192zM704 576v192h256v-192h-256zM64 256h256v-192h-256v192zM704 64v192h256v-192h-256z" />
<glyph unicode="&#xea77;" glyph-name="paragraph-left" d="M0 896h1024v-128h-1024zM0 704h640v-128h-640zM0 320h640v-128h-640zM0 512h1024v-128h-1024zM0 128h1024v-128h-1024z" />
<glyph unicode="&#xea78;" glyph-name="paragraph-center" d="M0 896h1024v-128h-1024zM192 704h640v-128h-640zM192 320h640v-128h-640zM0 512h1024v-128h-1024zM0 128h1024v-128h-1024z" />
<glyph unicode="&#xea79;" glyph-name="paragraph-right" d="M0 896h1024v-128h-1024zM384 704h640v-128h-640zM384 320h640v-128h-640zM0 512h1024v-128h-1024zM0 128h1024v-128h-1024z" />
<glyph unicode="&#xf00d;" glyph-name="close, remove, times" horiz-adv-x="805" d="M741.714 195.428q0-22.857-16-38.857l-77.714-77.714q-16-16-38.857-16t-38.857 16l-168 168-168-168q-16-16-38.857-16t-38.857 16l-77.714 77.714q-16 16-16 38.857t16 38.857l168 168-168 168q-16 16-16 38.857t16 38.857l77.714 77.714q16 16 38.857 16t38.857-16l168-168 168 168q16 16 38.857 16t38.857-16l77.714-77.714q16-16 16-38.857t-16-38.857l-168-168 168-168q16-16 16-38.857z" />
<glyph unicode="&#xf014;" glyph-name="trash-o" horiz-adv-x="805" d="M292.571 530.286v-329.143q0-8-5.143-13.143t-13.143-5.143h-36.571q-8 0-13.143 5.143t-5.143 13.143v329.143q0 8 5.143 13.143t13.143 5.143h36.571q8 0 13.143-5.143t5.143-13.143zM438.857 530.286v-329.143q0-8-5.143-13.143t-13.143-5.143h-36.571q-8 0-13.143 5.143t-5.143 13.143v329.143q0 8 5.143 13.143t13.143 5.143h36.571q8 0 13.143-5.143t5.143-13.143zM585.143 530.286v-329.143q0-8-5.143-13.143t-13.143-5.143h-36.571q-8 0-13.143 5.143t-5.143 13.143v329.143q0 8 5.143 13.143t13.143 5.143h36.571q8 0 13.143-5.143t5.143-13.143zM658.286 116.571v541.714h-512v-541.714q0-12.571 4-23.143t8.286-15.429 6-4.857h475.429q1.714 0 6 4.857t8.286 15.429 4 23.143zM274.286 731.428h256l-27.429 66.857q-4 5.143-9.714 6.286h-181.143q-5.714-1.143-9.714-6.286zM804.571 713.143v-36.571q0-8-5.143-13.143t-13.143-5.143h-54.857v-541.714q0-47.429-26.857-82t-64.571-34.571h-475.429q-37.714 0-64.571 33.429t-26.857 80.857v544h-54.857q-8 0-13.143 5.143t-5.143 13.143v36.571q0 8 5.143 13.143t13.143 5.143h176.571l40 95.429q8.571 21.143 30.857 36t45.143 14.857h182.857q22.857 0 45.143-14.857t30.857-36l40-95.429h176.571q8 0 13.143-5.143t5.143-13.143z" />
<glyph unicode="&#xf120;" glyph-name="terminal" horiz-adv-x="958" d="M334.286 389.143l-266.286-266.286q-5.714-5.714-13.143-5.714t-13.143 5.714l-28.571 28.571q-5.714 5.714-5.714 13.143t5.714 13.143l224.571 224.571-224.571 224.571q-5.714 5.714-5.714 13.143t5.714 13.143l28.571 28.571q5.714 5.714 13.143 5.714t13.143-5.714l266.286-266.286q5.714-5.714 5.714-13.143t-5.714-13.143zM950.857 128v-36.571q0-8-5.143-13.143t-13.143-5.143h-548.571q-8 0-13.143 5.143t-5.143 13.143v36.571q0 8 5.143 13.143t13.143 5.143h548.571q8 0 13.143-5.143t5.143-13.143z" />
<glyph unicode="&#xf1dc;" glyph-name="header" d="M961.143 0q-25.143 0-75.714 2t-76.286 2q-25.143 0-75.429-2t-75.429-2q-13.714 0-21.143 11.714t-7.429 26q0 17.714 9.714 26.286t22.286 9.714 29.143 4 25.714 8.571q18.857 12 18.857 80l-0.571 223.429q0 12-0.571 17.714-7.429 2.286-28.571 2.286h-385.714q-21.714 0-29.143-2.286-0.571-5.714-0.571-17.714l-0.571-212q0-81.143 21.143-93.714 9.143-5.714 27.429-7.429t32.571-2 25.714-8.571 11.429-26q0-14.857-7.143-27.429t-20.857-12.571q-26.857 0-79.714 2t-79.143 2q-24.571 0-73.143-2t-72.571-2q-13.143 0-20.286 12t-7.143 25.714q0 17.143 8.857 25.714t20.571 10 27.143 4.286 24 8.571q18.857 13.143 18.857 81.714l-0.571 32.571v464.571q0 1.714 0.286 14.857t0 20.857-0.857 22-2 24-3.714 20.857-6.286 18-9.143 10.286q-8.571 5.714-25.714 6.857t-30.286 1.143-23.429 8-10.286 25.714q0 14.857 6.857 27.429t20.571 12.571q26.286 0 79.143-2t79.143-2q24 0 72.286 2t72.286 2q14.286 0 21.429-12.571t7.143-27.429q0-17.143-9.714-24.857t-22-8.286-28.286-2.286-24.571-7.429q-20-12-20-91.429l0.571-182.857q0-12 0.571-18.286 7.429-1.714 22.286-1.714h399.429q14.286 0 21.714 1.714 0.571 6.286 0.571 18.286l0.571 182.857q0 79.429-20 91.429-10.286 6.286-33.429 7.143t-37.714 7.429-14.571 28.286q0 14.857 7.143 27.429t21.429 12.571q25.143 0 75.429-2t75.429-2q24.571 0 73.714 2t73.714 2q14.286 0 21.429-12.571t7.143-27.429q0-17.143-10-25.143t-22.857-8.286-29.429-1.714-25.143-7.143q-20-13.143-20-92l0.571-538.857q0-68 19.429-80 9.143-5.714 26.286-7.714t30.571-2.571 23.714-8.857 10.286-25.429q0-14.857-6.857-27.429t-20.571-12.571z" />
<glyph unicode="&#xf1fc;" glyph-name="paint-brush" horiz-adv-x="1023" d="M922.857 950.857q40 0 70-26.571t30-66.571q0-36-25.714-86.286-189.714-359.429-265.714-429.714-55.429-52-124.571-52-72 0-123.714 52.857t-51.714 125.429q0 73.143 52.571 121.143l364.571 330.857q33.714 30.857 74.286 30.857zM403.429 360q22.286-43.429 60.857-74.286t86-43.429l0.571-40.571q2.286-121.714-74-198.286t-199.143-76.571q-70.286 0-124.571 26.571t-87.143 72.857-49.429 104.571-16.571 125.714q4-2.857 23.429-17.143t35.429-25.429 33.714-20.857 26.286-9.714q23.429 0 31.429 21.143 14.286 37.714 32.857 64.286t39.714 43.429 50.286 27.143 58.857 14.571 71.429 6z" />
</font></defs></svg>
Side by Side

After

Width:  |  Height:  |  Size: 14 KiB

BIN
attachment/icomoon/fonts/icomoon.ttf Executable file
View File

Binary file not shown.

BIN
attachment/icomoon/fonts/icomoon.woff Executable file
View File

Binary file not shown.

1
attachment/icomoon/selection.json Executable file
View File

File diff suppressed because one or more lines are too long

123
attachment/icomoon/style.css Executable file
View File

@ -0,0 +1,123 @@
@font-face {
font-family: 'icomoon';
src: url('fonts/icomoon.eot?mz0cvx');
src: url('fonts/icomoon.eot?mz0cvx#iefix') format('embedded-opentype'),
url('fonts/icomoon.ttf?mz0cvx') format('truetype'),
url('fonts/icomoon.woff?mz0cvx') format('woff'),
url('fonts/icomoon.svg?mz0cvx#icomoon') format('svg');
font-weight: normal;
font-style: normal;
font-display: block;
}
[class^="icon-"], [class*=" icon-"] {
/* use !important to prevent issues with browser extensions that change fonts */
font-family: 'icomoon' !important;
speak: never;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
/* Better Font Rendering =========== */
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.icon-pencil2:before {
content: "\e906";
}
.icon-image:before {
content: "\e90d";
}
.icon-play:before {
content: "\e912";
}
.icon-location:before {
content: "\e947";
}
.icon-undo:before {
content: "\e965";
}
.icon-redo:before {
content: "\e966";
}
.icon-quotes-left:before {
content: "\e977";
}
.icon-list-numbered:before {
content: "\e9b9";
}
.icon-list2:before {
content: "\e9bb";
}
.icon-upload2:before {
content: "\e9c6";
}
.icon-link:before {
content: "\e9cb";
}
.icon-happy:before {
content: "\e9df";
}
.icon-cancel-circle:before {
content: "\ea0d";
}
.icon-font:before {
content: "\ea5c";
}
.icon-text-height:before {
content: "\ea5f";
}
.icon-bold:before {
content: "\ea62";
}
.icon-underline:before {
content: "\ea63";
}
.icon-italic:before {
content: "\ea64";
}
.icon-strikethrough:before {
content: "\ea65";
}
.icon-page-break:before {
content: "\ea68";
}
.icon-table2:before {
content: "\ea71";
}
.icon-paragraph-left:before {
content: "\ea77";
}
.icon-paragraph-center:before {
content: "\ea78";
}
.icon-paragraph-right:before {
content: "\ea79";
}
.icon-paint-format:before {
content: "\e90c";
}
.icon-close:before {
content: "\f00d";
}
.icon-remove:before {
content: "\f00d";
}
.icon-times:before {
content: "\f00d";
}
.icon-trash-o:before {
content: "\f014";
}
.icon-terminal:before {
content: "\f120";
}
.icon-header:before {
content: "\f1dc";
}
.icon-paint-brush:before {
content: "\f1fc";
}

30
examples/getJSON.html Normal file
View File

@ -0,0 +1,30 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>wangEditor example</title>
<style>
</style>
</head>
<body>
<p>
wangEditor getJSON
</p>
<div id="div1">
<p>我是一行文字</p>
<p>我是一行<b>这里加粗</b>文字</p>
<p>我是一行<a href="123" target="_blank">链接</a>文字</p>
<p><img src="https://www.tslang.cn/assets/images/fork_me_ribbon.svg" style="width: 200px;"/></p>
</div>
<script src="../dist/wangEditor.js"></script>
<script>
const E = window.wangEditor
const editor = new E('#div1')
editor.create()
console.log( editor.txt.getJSON() )
</script>
</body>
</html>

26
examples/styleWithCSS.html Normal file
View File

@ -0,0 +1,26 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>wangEditor example</title>
<style>
</style>
</head>
<body>
<p>
wangEditor demo
</p>
<div id="div1"></div>
<script src="../dist/wangEditor.js"></script>
<script>
const E = window.wangEditor
const editor = new E('#div1')
editor.customConfig.styleWithCSS = true
editor.create()
</script>
</body>
</html>

BIN
src/assets/font/w-e-icon.woff Normal file → Executable file
View File

Binary file not shown.

5
src/assets/style/icon.less
View File

@ -105,4 +105,7 @@
}
.w-e-icon-text-heigh:before {
content: "\ea5f";
}
}
.w-e-icon-paint-format:before {
content: "\e90c";
}

8
src/config/cmd.ts Normal file
View File

@ -0,0 +1,8 @@
/**
* @description 命令配置项
* @author wangfupeng
*/
export default {
styleWithCSS: false, // 默认 false
}

4
src/config/index.ts
View File

@ -6,6 +6,7 @@
import menusConfig from './menus'
import eventsConfig from './events'
import styleConfig from './style'
import cmdConfig from './cmd'
// 定义配置项的类型规范
export type ConfigType = {
@ -17,9 +18,10 @@ export type ConfigType = {
onfocus: Function
onblur: Function
onchangeTimeout: number
styleWithCSS: boolean
}
// 合并所有的配置信息
const defaultConfig = Object.assign({}, menusConfig, eventsConfig, styleConfig)
const defaultConfig = Object.assign({}, menusConfig, eventsConfig, styleConfig, cmdConfig)
export default defaultConfig

2
src/config/menus.ts
View File

@ -4,7 +4,7 @@
*/
export default {
menus: ['bold', 'head', 'link', 'strikethrough'],
menus: ['bold', 'head', 'link', 'underline', 'strikethrough'],
fontNames: ['宋体', '微软雅黑', 'Arial', 'Tahoma', 'Verdana'],

8
src/editor/command.ts
View File

@ -25,11 +25,9 @@ class Command {
public do(name: string, value?: string | DomElement): void {
const editor = this.editor
// // 使用 styleWithCSS —— 暂不使用
// if (!editor._useStyleWithCSS) {
// document.execCommand('styleWithCSS', null, true)
// editor._useStyleWithCSS = true
// }
if (editor.config.styleWithCSS) {
document.execCommand('styleWithCSS', false, 'true')
}
const selection = editor.selection

2
src/menus/menu-list.ts
View File

@ -6,11 +6,13 @@
import Bold from './bold/index'
import Head from './head/index'
import Link from './link/index'
import Underline from './underline/index'
import Strikethrough from './strikethrough/index'
export default {
bold: Bold,
head: Head,
link: Link,
underline: Underline,
strikethrough: Strikethrough,
}

57
src/menus/underline/index.ts Normal file
View File

@ -0,0 +1,57 @@
/**
* @description 下划线 underline
* @author dyl
*
*/
import BtnMenu from '../menu-constructors/BtnMenu'
import $ from '../../utils/dom-core'
import Editor from '../../editor/index'
import { MenuActive } from '../menu-constructors/Menu'
class Underline extends BtnMenu implements MenuActive {
constructor(editor: Editor) {
const $elem = $(
`<div class="w-e-menu">
<i class="w-e-icon-underline"></i>
</div>`
)
super($elem, editor)
}
/**
* 点击事件
*/
public clickHandler(): void {
const editor = this.editor
const isSelectEmpty = editor.selection.isSelectionEmpty()
if (isSelectEmpty) {
// 选区范围是空的，插入并选中一个“空白”
editor.selection.createEmptyRange()
}
// 执行 Underline 命令
editor.cmd.do('underline')
if (isSelectEmpty) {
// 需要将选区范围折叠起来
editor.selection.collapseRange()
editor.selection.restoreSelection()
}
}
/**
* 尝试修改菜单激活状态
*/
public tryChangeActive(): void {
const editor = this.editor
if (editor.cmd.queryCommandState('underline')) {
this.active()
} else {
this.unActive()
}
}
}
export default Underline

4
src/text/event-hooks/index.ts
View File

@ -6,6 +6,7 @@
import Text from '../index'
import enterToCreateP from './enter-to-create-p'
import deleteToKeepP from './del-to-keep-p'
import tabToSpan from './tab-to-space'
/**
* 初始化 text 事件钩子函数
@ -20,6 +21,9 @@ function initTextHooks(text: Text): void {
// 删除时，保留 <p><br></p>
deleteToKeepP(editor, eventHooks.deleteUpEvents, eventHooks.deleteDownEvents)
// tab 转换为空格
tabToSpan(editor, eventHooks.tabDownEvents)
}
export default initTextHooks

40
src/text/event-hooks/tab-to-space.ts Normal file
View File

@ -0,0 +1,40 @@
/**
* @description 编辑区域 tab 的特殊处理
* @author wangfupeng
*/
import Editor from '../../editor/index'
/**
* 编辑区域 tab 的特殊处理，转换为空格
* @param editor 编辑器实例
* @param tabDownEvents tab down 事件钩子
*/
function tabHandler(editor: Editor, tabDownEvents: Function[]) {
// 定义函数
function fn() {
if (!editor.cmd.queryCommandSupported('insertHTML')) {
// 必须原生支持 insertHTML 命令
return
}
const $selectionElem = editor.selection.getSelectionContainerElem()
if (!$selectionElem) {
return
}
const $parentElem = $selectionElem.parent()
const selectionNodeName = $selectionElem.getNodeName()
const parentNodeName = $parentElem.getNodeName()
if (selectionNodeName === 'CODE' && parentNodeName === 'PRE') {
// <pre><code> 里面
editor.cmd.do('insertHTML', ' ')
} else {
// 普通文字
editor.cmd.do('insertHTML', '&nbsp;&nbsp;&nbsp;&nbsp;')
}
}
// 保留函数
tabDownEvents.push(fn)
}
export default tabHandler

68
src/text/getChildrenJSON.ts Normal file
View File

@ -0,0 +1,68 @@
/**
* @description 获取子元素的 JSON 格式数据
* @author wangfupeng
*/
import { replaceHtmlSymbol } from '../utils/util'
import $, { DomElement } from '../utils/dom-core'
type AttrType = {
name: string
value: string
}
export type NodeType = {
tag: string
attrs: AttrType[]
children: NodeListType
}
export type NodeListType = Array<string | NodeType>
/**
* 获取子元素的 JSON 格式数据
* @param $elem DOM 节点
*/
function getChildrenJSON($elem: DomElement): NodeListType {
const result: NodeListType = [] // 存储结果
const $children = $elem.childNodes() || [] // 注意 childNodes() 可以获取文本节点
$children.forEach((curElem: HTMLElement) => {
let elemResult
const nodeType = curElem.nodeType
// 文本节点
if (nodeType === 3) {
elemResult = curElem.textContent || ''
elemResult = replaceHtmlSymbol(elemResult)
}
// 普通 DOM 节点
if (nodeType === 1) {
elemResult = {}
elemResult = elemResult as NodeType
// tag
elemResult.tag = curElem.nodeName.toLowerCase()
// attr
const attrData = []
const attrList = curElem.attributes || []
const attrListLength = attrList.length || 0
for (let i = 0; i < attrListLength; i++) {
const attr = attrList[i]
attrData.push({
name: attr.name,
value: attr.value,
})
}
elemResult.attrs = attrData
// children（递归）
elemResult.children = getChildrenJSON($(curElem))
}
if (elemResult) {
result.push(elemResult)
}
})
return result
}
export default getChildrenJSON

72
src/text/index.ts
View File

@ -7,11 +7,14 @@ import $ from '../utils/dom-core'
import Editor from '../editor/index'
import initEventHooks from './event-hooks/index'
import { UA } from '../utils/util'
import getChildrenJSON, { NodeListType } from './getChildrenJSON'
// 各个事件钩子函数
type TextEventHooks = {
dropEvents: Function[]
keyupEvents: Function[]
tabUpEvents: Function[] // tab 键（keyCode === ）Up 时
tabDownEvents: Function[] // tab 键（keyCode === 9）Down 时
enterUpEvents: Function[] // enter 键（keyCode === 13）up 时
deleteUpEvents: Function[] // 删除键（keyCode === 8）up 时
deleteDownEvents: Function[] // 删除键（keyCode === 8）down 时
@ -28,6 +31,8 @@ class Text {
this.eventHooks = {
dropEvents: [],
keyupEvents: [],
tabUpEvents: [],
tabDownEvents: [],
enterUpEvents: [],
deleteUpEvents: [],
deleteDownEvents: [],
@ -42,11 +47,11 @@ class Text {
// 实时保存选取范围
this._saveRange()
// 绑定事件
this._bindEventHooks()
// 初始化 text 事件钩子函数
initEventHooks(this)
// 绑定事件
this._bindEvent()
}
/**
@ -78,7 +83,14 @@ class Text {
editor.initSelection()
}
// 获取 JSON
/**
* 获取 json 格式的数据
*/
public getJSON(): NodeListType {
const editor = this.editor
const $textElem = editor.$textElem
return getChildrenJSON($textElem)
}
/**
* 获取/设置 字符串内容
@ -146,51 +158,57 @@ class Text {
/**
* 绑定事件，事件会触发钩子函数
*/
private _bindEvent(): void {
private _bindEventHooks(): void {
const $textElem = this.editor.$textElem
const eventHooks = this.eventHooks
// enter 键 up 时的 hooks
const enterUpEvents = eventHooks.enterUpEvents
$textElem.on('keyup', (e: KeyboardEvent) => {
if (e.keyCode !== 13) {
// 不是回车键
return
}
if (e.keyCode !== 13) return
const enterUpEvents = eventHooks.enterUpEvents
enterUpEvents.forEach(fn => fn(e))
})
// delete 键 up 时 hooks
const deleteUpEvents = eventHooks.deleteUpEvents
$textElem.on('keyup', (e: KeyboardEvent) => {
if (e.keyCode !== 8) {
// 不是删除键
return
}
if (e.keyCode !== 8) return
const deleteUpEvents = eventHooks.deleteUpEvents
deleteUpEvents.forEach(fn => fn(e))
})
// delete 键 down 时 hooks
const deleteDownEvents = eventHooks.deleteDownEvents
$textElem.on('keydown', (e: KeyboardEvent) => {
if (e.keyCode !== 8) {
// 不是删除键
return
}
if (e.keyCode !== 8) return
const deleteDownEvents = eventHooks.deleteDownEvents
deleteDownEvents.forEach(fn => fn(e))
})
// 粘贴
const pasteEvents = eventHooks.pasteEvents
$textElem.on('paste', (e: Event) => {
if (UA.isIE()) {
return
} else {
// 阻止默认行为，使用 execCommand 的粘贴命令
e.preventDefault()
}
if (UA.isIE()) return // IE 不支持
// 阻止默认行为，使用 execCommand 的粘贴命令
e.preventDefault()
const pasteEvents = eventHooks.pasteEvents
pasteEvents.forEach(fn => fn(e))
})
// tab up
$textElem.on('keyup', (e: KeyboardEvent) => {
if (e.keyCode !== 9) return
e.preventDefault()
const tabUpEvents = eventHooks.tabUpEvents
tabUpEvents.forEach(fn => fn(e))
})
// tab down
$textElem.on('keydown', (e: KeyboardEvent) => {
if (e.keyCode !== 9) return
e.preventDefault()
const tabDownEvents = eventHooks.tabDownEvents
tabDownEvents.forEach(fn => fn(e))
})
}
}

11
test/config/cmd.test.ts Normal file
View File

@ -0,0 +1,11 @@
/**
* @description cmd 相关配置，test
* @author wangfupeng
*/
import createEditor from '../fns/create-editor'
test('styleWithCSS 测试', () => {
const editor = createEditor(document, 'div1')
expect(editor.config.styleWithCSS).toBe(false)
})

25
test/menus/underline.test.ts Normal file
View File

@ -0,0 +1,25 @@
/**
* @description underline test
* @author dyl
*/
import createEditor from '../fns/create-editor'
import Editor from '../../src/editor'
import Underline from '../../src/menus/underline/index'
import mockCmdFn from '../fns/command-mock'
import { getMenuInstance } from '../fns/menus'
let editor: Editor
let underlineMenu: Underline
test('下划线', () => {
editor = createEditor(document, 'div1') // 赋值给全局变量
// 找到 underline 菜单
underlineMenu = getMenuInstance(editor, Underline) as Underline
// 执行点击事件，模拟下划线功能
mockCmdFn(document)
; (underlineMenu as Underline).clickHandler()
expect(document.execCommand).toBeCalledWith('underline', false, undefined) // mock fn 被调用
})

34
test/text/api.test.ts
View File

@ -5,6 +5,7 @@
import createEditor from '../fns/create-editor'
import Editor from '../../src/editor'
import { NodeType } from '../../src/text/getChildrenJSON'
let editor: Editor
let TEXT = '这是用于 editor.text API 单元测试的文字'
@ -32,6 +33,39 @@ test('追加内容', () => {
expect(html.indexOf(r)).toBeGreaterThan(0)
})
test('获取 JSON', () => {
const html = `<p>我是一行文字</p><p>我是一行<b>这里加粗</b>文字</p><p>我是一行<a href="123" target="_blank">链接</a>文字</p>`
editor.txt.html(html)
const result = editor.txt.getJSON()
expect(Array.isArray(result)).toBe(true) // 是一个数组
// 第一个 p 标签
const p0 = result[0] as NodeType
expect(p0.tag).toBe('p')
expect(p0.children[0]).toBe('我是一行文字')
// 第二个 p 标签
const p1 = result[1] as NodeType
expect(p1.children.length).toBe(3)
const b = p1.children[1] as NodeType // b 标签
expect(b.tag).toBe('b')
expect(b.children[0]).toBe('这里加粗')
// 第三个 p 标签
const p2 = result[2] as NodeType
const a = p2.children[1] as NodeType // a 标签
expect(a.attrs.length).toBe(2)
const attr1 = a.attrs[0] // 属性
expect(attr1.name).toBe('href')
expect(attr1.value).toBe('123')
const attr2 = a.attrs[1]
expect(attr2.name).toBe('target')
expect(attr2.value).toBe('_blank')
})
// 最后测
test('清空内容', () => {
editor.txt.clear()