vue-editify 0.1.12 → 0.1.13
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/examples/App.vue +2 -2
- package/lib/editify.es.js +102 -3
- package/lib/editify.umd.js +1 -1
- package/lib/index.d.ts +1 -1
- package/lib/style.css +1 -1
- package/package.json +1 -1
- package/src/core/function.ts +189 -90
- package/src/editify/editify.vue +1 -1
- package/src/index.ts +1 -1
package/src/core/function.ts
CHANGED
@@ -19,8 +19,11 @@ export const getParsedomElementByElement = (element: AlexElement, parsedom: stri
|
|
19
19
|
|
20
20
|
//获取光标是否在指定标签下,如果是返回该标签对应的元素,否则返回null
|
21
21
|
export const getCurrentParsedomElement = (editor: AlexEditor, dataRangeCaches: AlexElementsRangeType, parsedom: string) => {
|
22
|
-
if (editor.range
|
23
|
-
return
|
22
|
+
if (!editor.range) {
|
23
|
+
return null
|
24
|
+
}
|
25
|
+
if (editor.range.anchor.element.isEqual(editor.range.focus.element)) {
|
26
|
+
return getParsedomElementByElement(editor.range.anchor.element, parsedom)
|
24
27
|
}
|
25
28
|
const arr = dataRangeCaches.list.map(item => {
|
26
29
|
return getParsedomElementByElement(item.element, parsedom)
|
@@ -85,8 +88,11 @@ export const isTask = function (element: AlexElement) {
|
|
85
88
|
|
86
89
|
//选区是否含有代码块
|
87
90
|
export const hasPreInRange = (editor: AlexEditor, dataRangeCaches: AlexElementsRangeType) => {
|
88
|
-
if (editor.range
|
89
|
-
return
|
91
|
+
if (!editor.range) {
|
92
|
+
return false
|
93
|
+
}
|
94
|
+
if (editor.range.anchor.isEqual(editor.range.focus)) {
|
95
|
+
return !!getParsedomElementByElement(editor.range.anchor.element, 'pre')
|
90
96
|
}
|
91
97
|
return dataRangeCaches.flatList.some(item => {
|
92
98
|
return !!getParsedomElementByElement(item.element, 'pre')
|
@@ -95,8 +101,11 @@ export const hasPreInRange = (editor: AlexEditor, dataRangeCaches: AlexElementsR
|
|
95
101
|
|
96
102
|
//选区是否全部在代码块内
|
97
103
|
export const isRangeInPre = (editor: AlexEditor, dataRangeCaches: AlexElementsRangeType) => {
|
98
|
-
if (editor.range
|
99
|
-
return
|
104
|
+
if (!editor.range) {
|
105
|
+
return false
|
106
|
+
}
|
107
|
+
if (editor.range.anchor.isEqual(editor.range.focus)) {
|
108
|
+
return !!getParsedomElementByElement(editor.range.anchor.element, 'pre')
|
100
109
|
}
|
101
110
|
return dataRangeCaches.list.every(item => {
|
102
111
|
return !!getParsedomElementByElement(item.element, 'pre')
|
@@ -105,8 +114,11 @@ export const isRangeInPre = (editor: AlexEditor, dataRangeCaches: AlexElementsRa
|
|
105
114
|
|
106
115
|
//选区是否含有引用
|
107
116
|
export const hasQuoteInRange = (editor: AlexEditor, dataRangeCaches: AlexElementsRangeType) => {
|
108
|
-
if (editor.range
|
109
|
-
return
|
117
|
+
if (!editor.range) {
|
118
|
+
return false
|
119
|
+
}
|
120
|
+
if (editor.range.anchor.isEqual(editor.range.focus)) {
|
121
|
+
return !!getParsedomElementByElement(editor.range.anchor.element, 'blockquote')
|
110
122
|
}
|
111
123
|
return dataRangeCaches.flatList.some(item => {
|
112
124
|
return !!getParsedomElementByElement(item.element, 'blockquote')
|
@@ -115,8 +127,11 @@ export const hasQuoteInRange = (editor: AlexEditor, dataRangeCaches: AlexElement
|
|
115
127
|
|
116
128
|
//选区是否全部在引用内
|
117
129
|
export const isRangeInQuote = (editor: AlexEditor, dataRangeCaches: AlexElementsRangeType) => {
|
118
|
-
if (editor.range
|
119
|
-
return
|
130
|
+
if (!editor.range) {
|
131
|
+
return false
|
132
|
+
}
|
133
|
+
if (editor.range.anchor.isEqual(editor.range.focus)) {
|
134
|
+
return !!getParsedomElementByElement(editor.range.anchor.element, 'blockquote')
|
120
135
|
}
|
121
136
|
return dataRangeCaches.list.every(item => {
|
122
137
|
return !!getParsedomElementByElement(item.element, 'blockquote')
|
@@ -125,8 +140,11 @@ export const isRangeInQuote = (editor: AlexEditor, dataRangeCaches: AlexElements
|
|
125
140
|
|
126
141
|
//选区是否含有有序列表或者无序列表
|
127
142
|
export const hasListInRange = (editor: AlexEditor, dataRangeCaches: AlexElementsRangeType, ordered: boolean | undefined = false) => {
|
128
|
-
if (editor.range
|
129
|
-
return
|
143
|
+
if (!editor.range) {
|
144
|
+
return false
|
145
|
+
}
|
146
|
+
if (editor.range.anchor.isEqual(editor.range.focus)) {
|
147
|
+
return elementIsInList(editor.range.anchor.element, ordered)
|
130
148
|
}
|
131
149
|
return dataRangeCaches.flatList.some(item => {
|
132
150
|
return elementIsInList(item.element, ordered)
|
@@ -135,8 +153,11 @@ export const hasListInRange = (editor: AlexEditor, dataRangeCaches: AlexElements
|
|
135
153
|
|
136
154
|
//选区是否全部在有序列表或者无序列表内
|
137
155
|
export const isRangeInList = (editor: AlexEditor, dataRangeCaches: AlexElementsRangeType, ordered: boolean | undefined = false) => {
|
138
|
-
if (editor.range
|
139
|
-
return
|
156
|
+
if (!editor.range) {
|
157
|
+
return false
|
158
|
+
}
|
159
|
+
if (editor.range.anchor.isEqual(editor.range.focus)) {
|
160
|
+
return elementIsInList(editor.range.anchor.element, ordered)
|
140
161
|
}
|
141
162
|
return dataRangeCaches.list.every(item => {
|
142
163
|
return elementIsInList(item.element, ordered)
|
@@ -145,8 +166,11 @@ export const isRangeInList = (editor: AlexEditor, dataRangeCaches: AlexElementsR
|
|
145
166
|
|
146
167
|
//选区是否含有任务列表
|
147
168
|
export const hasTaskInRange = (editor: AlexEditor, dataRangeCaches: AlexElementsRangeType) => {
|
148
|
-
if (editor.range
|
149
|
-
return
|
169
|
+
if (!editor.range) {
|
170
|
+
return false
|
171
|
+
}
|
172
|
+
if (editor.range.anchor.isEqual(editor.range.focus)) {
|
173
|
+
return elementIsInTask(editor.range.anchor.element)
|
150
174
|
}
|
151
175
|
return dataRangeCaches.flatList.some(item => {
|
152
176
|
return elementIsInTask(item.element)
|
@@ -155,8 +179,11 @@ export const hasTaskInRange = (editor: AlexEditor, dataRangeCaches: AlexElements
|
|
155
179
|
|
156
180
|
//选区是否全部在任务列表里
|
157
181
|
export const isRangeInTask = (editor: AlexEditor, dataRangeCaches: AlexElementsRangeType) => {
|
158
|
-
if (editor.range
|
159
|
-
return
|
182
|
+
if (!editor.range) {
|
183
|
+
return false
|
184
|
+
}
|
185
|
+
if (editor.range.anchor.isEqual(editor.range.focus)) {
|
186
|
+
return elementIsInTask(editor.range.anchor.element)
|
160
187
|
}
|
161
188
|
return dataRangeCaches.list.every(item => {
|
162
189
|
return elementIsInTask(item.element)
|
@@ -165,8 +192,11 @@ export const isRangeInTask = (editor: AlexEditor, dataRangeCaches: AlexElementsR
|
|
165
192
|
|
166
193
|
//选区是否含有链接
|
167
194
|
export const hasLinkInRange = (editor: AlexEditor, dataRangeCaches: AlexElementsRangeType) => {
|
168
|
-
if (editor.range
|
169
|
-
return
|
195
|
+
if (!editor.range) {
|
196
|
+
return false
|
197
|
+
}
|
198
|
+
if (editor.range.anchor.isEqual(editor.range.focus)) {
|
199
|
+
return !!getParsedomElementByElement(editor.range.anchor.element, 'a')
|
170
200
|
}
|
171
201
|
return dataRangeCaches.flatList.some(item => {
|
172
202
|
return !!getParsedomElementByElement(item.element, 'a')
|
@@ -175,8 +205,11 @@ export const hasLinkInRange = (editor: AlexEditor, dataRangeCaches: AlexElements
|
|
175
205
|
|
176
206
|
//选区是否含有表格
|
177
207
|
export const hasTableInRange = (editor: AlexEditor, dataRangeCaches: AlexElementsRangeType) => {
|
178
|
-
if (editor.range
|
179
|
-
return
|
208
|
+
if (!editor.range) {
|
209
|
+
return false
|
210
|
+
}
|
211
|
+
if (editor.range.anchor.isEqual(editor.range.focus)) {
|
212
|
+
return !!getParsedomElementByElement(editor.range.anchor.element, 'table')
|
180
213
|
}
|
181
214
|
return dataRangeCaches.flatList.some(item => {
|
182
215
|
return !!getParsedomElementByElement(item.element, 'table')
|
@@ -185,8 +218,11 @@ export const hasTableInRange = (editor: AlexEditor, dataRangeCaches: AlexElement
|
|
185
218
|
|
186
219
|
//选区是否含有图片
|
187
220
|
export const hasImageInRange = (editor: AlexEditor, dataRangeCaches: AlexElementsRangeType) => {
|
188
|
-
if (editor.range
|
189
|
-
return
|
221
|
+
if (!editor.range) {
|
222
|
+
return false
|
223
|
+
}
|
224
|
+
if (editor.range.anchor.isEqual(editor.range.focus)) {
|
225
|
+
return !!getParsedomElementByElement(editor.range.anchor.element, 'img')
|
190
226
|
}
|
191
227
|
return dataRangeCaches.flatList.some(item => {
|
192
228
|
return !!getParsedomElementByElement(item.element, 'img')
|
@@ -195,8 +231,11 @@ export const hasImageInRange = (editor: AlexEditor, dataRangeCaches: AlexElement
|
|
195
231
|
|
196
232
|
//选区是否含有视频
|
197
233
|
export const hasVideoInRange = (editor: AlexEditor, dataRangeCaches: AlexElementsRangeType) => {
|
198
|
-
if (editor.range
|
199
|
-
return
|
234
|
+
if (!editor.range) {
|
235
|
+
return false
|
236
|
+
}
|
237
|
+
if (editor.range.anchor.isEqual(editor.range.focus)) {
|
238
|
+
return !!getParsedomElementByElement(editor.range.anchor.element, 'video')
|
200
239
|
}
|
201
240
|
return dataRangeCaches.flatList.some(item => {
|
202
241
|
return !!getParsedomElementByElement(item.element, 'video')
|
@@ -205,11 +244,14 @@ export const hasVideoInRange = (editor: AlexEditor, dataRangeCaches: AlexElement
|
|
205
244
|
|
206
245
|
//查询光标所在的文本元素是否具有某个样式
|
207
246
|
export const queryTextStyle = (editor: AlexEditor, dataRangeCaches: AlexElementsRangeType, name: string, value?: string | number) => {
|
247
|
+
if (!editor.range) {
|
248
|
+
return false
|
249
|
+
}
|
208
250
|
//起点和终点在一起
|
209
|
-
if (editor.range
|
251
|
+
if (editor.range.anchor.isEqual(editor.range.focus)) {
|
210
252
|
//如果是文本元素并且具有样式
|
211
|
-
if (editor.range
|
212
|
-
return queryHasValue(editor.range
|
253
|
+
if (editor.range.anchor.element.isText() && editor.range.anchor.element.hasStyles()) {
|
254
|
+
return queryHasValue(editor.range.anchor.element.styles!, name, value)
|
213
255
|
}
|
214
256
|
//不是文本元素或者没有样式直接返回
|
215
257
|
return false
|
@@ -236,11 +278,14 @@ export const queryTextStyle = (editor: AlexEditor, dataRangeCaches: AlexElements
|
|
236
278
|
|
237
279
|
//查询光标所在的文本元素是否具有某个标记
|
238
280
|
export const queryTextMark = (editor: AlexEditor, dataRangeCaches: AlexElementsRangeType, name: string, value?: string | number) => {
|
281
|
+
if (!editor.range) {
|
282
|
+
return false
|
283
|
+
}
|
239
284
|
//起点和终点在一起
|
240
|
-
if (editor.range
|
285
|
+
if (editor.range.anchor.isEqual(editor.range.focus)) {
|
241
286
|
//如果是文本元素并且具有标记
|
242
|
-
if (editor.range
|
243
|
-
return queryHasValue(editor.range
|
287
|
+
if (editor.range.anchor.element.isText() && editor.range.anchor.element.hasMarks()) {
|
288
|
+
return queryHasValue(editor.range.anchor.element.marks!, name, value)
|
244
289
|
}
|
245
290
|
//不是文本元素或者没有标记直接返回
|
246
291
|
return false
|
@@ -283,6 +328,9 @@ export const getRangeText = (dataRangeCaches: AlexElementsRangeType) => {
|
|
283
328
|
|
284
329
|
//获取光标选取内的扁平化元素数组(可能会分割文本元素导致stack变更,同时也会更新选取元素和光标位置)
|
285
330
|
export const getFlatElementsByRange = (editor: AlexEditor, dataRangeCaches: AlexElementsRangeType) => {
|
331
|
+
if (!editor.range) {
|
332
|
+
return []
|
333
|
+
}
|
286
334
|
//获取选区数据的长度
|
287
335
|
let length = dataRangeCaches.flatList.length
|
288
336
|
//返回的元素数组
|
@@ -324,11 +372,11 @@ export const getFlatElementsByRange = (editor: AlexEditor, dataRangeCaches: Alex
|
|
324
372
|
if (selectEl) {
|
325
373
|
//如果i为0的话肯定是起点
|
326
374
|
if (i == 0) {
|
327
|
-
editor.range
|
375
|
+
editor.range.anchor.moveToStart(selectEl)
|
328
376
|
}
|
329
377
|
//如果i是最后一个序列的话肯定是终点
|
330
378
|
if (i == length - 1) {
|
331
|
-
editor.range
|
379
|
+
editor.range.focus.moveToEnd(selectEl)
|
332
380
|
}
|
333
381
|
elements.push(selectEl)
|
334
382
|
}
|
@@ -380,14 +428,17 @@ export const elementToTask = function (element: AlexElement) {
|
|
380
428
|
|
381
429
|
//设置标题
|
382
430
|
export const setHeading = (editor: AlexEditor, dataRangeCaches: AlexElementsRangeType, editTrans: (key: string) => any, parsedom: string) => {
|
431
|
+
if (!editor.range) {
|
432
|
+
return
|
433
|
+
}
|
383
434
|
const values = getButtonOptionsConfig(editTrans).heading!.map(item => {
|
384
435
|
return (<ButtonOptionsItemType>item).value
|
385
436
|
})
|
386
437
|
if (!values.includes(parsedom)) {
|
387
438
|
throw new Error('The parameter supports only h1-h6 and p')
|
388
439
|
}
|
389
|
-
if (editor.range
|
390
|
-
const block = editor.range
|
440
|
+
if (editor.range.anchor.isEqual(editor.range.focus)) {
|
441
|
+
const block = editor.range.anchor.element.getBlock()
|
391
442
|
//先转为段落
|
392
443
|
elementToParagraph(block)
|
393
444
|
//设置标题
|
@@ -408,6 +459,9 @@ export const setHeading = (editor: AlexEditor, dataRangeCaches: AlexElementsRang
|
|
408
459
|
|
409
460
|
//根级块元素或者内部块元素增加缩进
|
410
461
|
export const setIndentIncrease = (editor: AlexEditor, dataRangeCaches: AlexElementsRangeType) => {
|
462
|
+
if (!editor.range) {
|
463
|
+
return
|
464
|
+
}
|
411
465
|
const fn = (element: AlexElement) => {
|
412
466
|
if (element.hasStyles()) {
|
413
467
|
if (element.styles!.hasOwnProperty('text-indent')) {
|
@@ -427,9 +481,9 @@ export const setIndentIncrease = (editor: AlexEditor, dataRangeCaches: AlexEleme
|
|
427
481
|
}
|
428
482
|
}
|
429
483
|
}
|
430
|
-
if (editor.range
|
431
|
-
const block = editor.range
|
432
|
-
const inblock = editor.range
|
484
|
+
if (editor.range.anchor.isEqual(editor.range.focus)) {
|
485
|
+
const block = editor.range.anchor.element.getBlock()
|
486
|
+
const inblock = editor.range.anchor.element.getInblock()
|
433
487
|
if (inblock && inblock.behavior == 'block' && !inblock.isPreStyle()) {
|
434
488
|
fn(inblock)
|
435
489
|
} else if (!block.isPreStyle()) {
|
@@ -450,6 +504,9 @@ export const setIndentIncrease = (editor: AlexEditor, dataRangeCaches: AlexEleme
|
|
450
504
|
|
451
505
|
//根级块元素或者内部块元素减少缩进
|
452
506
|
export const setIndentDecrease = (editor: AlexEditor, dataRangeCaches: AlexElementsRangeType) => {
|
507
|
+
if (!editor.range) {
|
508
|
+
return
|
509
|
+
}
|
453
510
|
const fn = (element: AlexElement) => {
|
454
511
|
if (element.hasStyles() && element.styles!.hasOwnProperty('text-indent')) {
|
455
512
|
let val = element.styles!['text-indent']
|
@@ -461,9 +518,9 @@ export const setIndentDecrease = (editor: AlexEditor, dataRangeCaches: AlexEleme
|
|
461
518
|
element.styles!['text-indent'] = `${val - 2 >= 0 ? val - 2 : 0}em`
|
462
519
|
}
|
463
520
|
}
|
464
|
-
if (editor.range
|
465
|
-
const block = editor.range
|
466
|
-
const inblock = editor.range
|
521
|
+
if (editor.range.anchor.isEqual(editor.range.focus)) {
|
522
|
+
const block = editor.range.anchor.element.getBlock()
|
523
|
+
const inblock = editor.range.anchor.element.getInblock()
|
467
524
|
if (inblock && inblock.behavior == 'block' && !inblock.isPreStyle()) {
|
468
525
|
fn(inblock)
|
469
526
|
} else if (!block.isPreStyle()) {
|
@@ -484,11 +541,14 @@ export const setIndentDecrease = (editor: AlexEditor, dataRangeCaches: AlexEleme
|
|
484
541
|
|
485
542
|
//插入或者取消引用
|
486
543
|
export const setQuote = (editor: AlexEditor, dataRangeCaches: AlexElementsRangeType) => {
|
544
|
+
if (!editor.range) {
|
545
|
+
return
|
546
|
+
}
|
487
547
|
//是否都在引用里
|
488
548
|
const flag = isRangeInQuote(editor, dataRangeCaches)
|
489
549
|
//起点和终点在一起
|
490
|
-
if (editor.range
|
491
|
-
const block = editor.range
|
550
|
+
if (editor.range.anchor.isEqual(editor.range.focus)) {
|
551
|
+
const block = editor.range.anchor.element.getBlock()
|
492
552
|
elementToParagraph(block)
|
493
553
|
if (!flag) {
|
494
554
|
block.parsedom = 'blockquote'
|
@@ -515,9 +575,12 @@ export const setQuote = (editor: AlexEditor, dataRangeCaches: AlexElementsRangeT
|
|
515
575
|
|
516
576
|
//设置对齐方式,参数取值justify/left/right/center
|
517
577
|
export const setAlign = (editor: AlexEditor, dataRangeCaches: AlexElementsRangeType, value: string) => {
|
518
|
-
if (editor.range
|
519
|
-
|
520
|
-
|
578
|
+
if (!editor.range) {
|
579
|
+
return
|
580
|
+
}
|
581
|
+
if (editor.range.anchor.isEqual(editor.range.focus)) {
|
582
|
+
const block = editor.range.anchor.element.getBlock()
|
583
|
+
const inblock = editor.range.anchor.element.getInblock()
|
521
584
|
if (inblock) {
|
522
585
|
if (inblock.hasStyles()) {
|
523
586
|
inblock.styles!['text-align'] = value
|
@@ -572,11 +635,14 @@ export const setAlign = (editor: AlexEditor, dataRangeCaches: AlexElementsRangeT
|
|
572
635
|
|
573
636
|
//插入或者取消 有序或者无序列表 ordered为true表示有序列表
|
574
637
|
export const setList = (editor: AlexEditor, dataRangeCaches: AlexElementsRangeType, ordered: boolean) => {
|
638
|
+
if (!editor.range) {
|
639
|
+
return
|
640
|
+
}
|
575
641
|
//是否都在列表内
|
576
642
|
const flag = isRangeInList(editor, dataRangeCaches, ordered)
|
577
643
|
//起点和终点在一起
|
578
|
-
if (editor.range
|
579
|
-
const block = editor.range
|
644
|
+
if (editor.range.anchor.isEqual(editor.range.focus)) {
|
645
|
+
const block = editor.range.anchor.element.getBlock()
|
580
646
|
if (flag) {
|
581
647
|
elementToParagraph(block)
|
582
648
|
} else {
|
@@ -605,11 +671,14 @@ export const setList = (editor: AlexEditor, dataRangeCaches: AlexElementsRangeTy
|
|
605
671
|
|
606
672
|
//插入或者取消任务列表
|
607
673
|
export const setTask = (editor: AlexEditor, dataRangeCaches: AlexElementsRangeType) => {
|
674
|
+
if (!editor.range) {
|
675
|
+
return
|
676
|
+
}
|
608
677
|
//是否都在任务列表那
|
609
678
|
const flag = isRangeInTask(editor, dataRangeCaches)
|
610
679
|
//起点和终点在一起
|
611
|
-
if (editor.range
|
612
|
-
const block = editor.range
|
680
|
+
if (editor.range.anchor.isEqual(editor.range.focus)) {
|
681
|
+
const block = editor.range.anchor.element.getBlock()
|
613
682
|
if (flag) {
|
614
683
|
elementToParagraph(block)
|
615
684
|
} else {
|
@@ -638,23 +707,26 @@ export const setTask = (editor: AlexEditor, dataRangeCaches: AlexElementsRangeTy
|
|
638
707
|
|
639
708
|
//设置文本元素的样式,styles为{ 'font-weight':'bold' }这类格式
|
640
709
|
export const setTextStyle = (editor: AlexEditor, dataRangeCaches: AlexElementsRangeType, styles: ObjectType) => {
|
710
|
+
if (!editor.range) {
|
711
|
+
return
|
712
|
+
}
|
641
713
|
//起点和终点在一起
|
642
|
-
if (editor.range
|
714
|
+
if (editor.range.anchor.isEqual(editor.range.focus)) {
|
643
715
|
//如果是空白文本元素直接设置样式
|
644
|
-
if (editor.range
|
645
|
-
if (editor.range
|
646
|
-
Object.assign(editor.range
|
716
|
+
if (editor.range.anchor.element.isSpaceText()) {
|
717
|
+
if (editor.range.anchor.element.hasStyles()) {
|
718
|
+
Object.assign(editor.range.anchor.element.styles!, cloneData(styles))
|
647
719
|
} else {
|
648
|
-
editor.range
|
720
|
+
editor.range.anchor.element.styles = cloneData(styles)
|
649
721
|
}
|
650
722
|
}
|
651
723
|
//如果是文本元素
|
652
|
-
else if (editor.range
|
724
|
+
else if (editor.range.anchor.element.isText()) {
|
653
725
|
//新建一个空白文本元素
|
654
726
|
const el = AlexElement.getSpaceElement()
|
655
727
|
//继承文本元素的样式和标记
|
656
|
-
el.styles = cloneData(editor.range
|
657
|
-
el.marks = cloneData(editor.range
|
728
|
+
el.styles = cloneData(editor.range.anchor.element.styles)
|
729
|
+
el.marks = cloneData(editor.range.anchor.element.marks)
|
658
730
|
//设置样式
|
659
731
|
if (el.hasStyles()) {
|
660
732
|
Object.assign(el.styles!, cloneData(styles))
|
@@ -688,26 +760,29 @@ export const setTextStyle = (editor: AlexEditor, dataRangeCaches: AlexElementsRa
|
|
688
760
|
|
689
761
|
//设置文本元素的标记,marks为{ 'class':'a' }这类格式
|
690
762
|
export const setTextMark = (editor: AlexEditor, dataRangeCaches: AlexElementsRangeType, marks: ObjectType) => {
|
763
|
+
if (!editor.range) {
|
764
|
+
return
|
765
|
+
}
|
691
766
|
if (!DapCommon.isObject(marks)) {
|
692
767
|
throw new Error('The argument must be an object')
|
693
768
|
}
|
694
769
|
//起点和终点在一起
|
695
|
-
if (editor.range
|
770
|
+
if (editor.range.anchor.isEqual(editor.range.focus)) {
|
696
771
|
//如果是空白文本元素直接设置标记
|
697
|
-
if (editor.range
|
698
|
-
if (editor.range
|
699
|
-
Object.assign(editor.range
|
772
|
+
if (editor.range.anchor.element.isSpaceText()) {
|
773
|
+
if (editor.range.anchor.element.hasMarks()) {
|
774
|
+
Object.assign(editor.range.anchor.element.marks!, cloneData(marks))
|
700
775
|
} else {
|
701
|
-
editor.range
|
776
|
+
editor.range.anchor.element.marks = cloneData(marks)
|
702
777
|
}
|
703
778
|
}
|
704
779
|
//如果是文本元素
|
705
|
-
else if (editor.range
|
780
|
+
else if (editor.range.anchor.element.isText()) {
|
706
781
|
//新建一个空白文本元素
|
707
782
|
const el = AlexElement.getSpaceElement()
|
708
783
|
//继承文本元素的样式和标记
|
709
|
-
el.styles = cloneData(editor.range
|
710
|
-
el.marks = cloneData(editor.range
|
784
|
+
el.styles = cloneData(editor.range.anchor.element.styles)
|
785
|
+
el.marks = cloneData(editor.range.anchor.element.marks)
|
711
786
|
//设置标记
|
712
787
|
if (el.hasMarks()) {
|
713
788
|
Object.assign(el.marks!, cloneData(marks))
|
@@ -741,6 +816,9 @@ export const setTextMark = (editor: AlexEditor, dataRangeCaches: AlexElementsRan
|
|
741
816
|
|
742
817
|
//移除文本元素的样式,styleNames是样式名称数组,如果不存在则移除全部样式
|
743
818
|
export const removeTextStyle = (editor: AlexEditor, dataRangeCaches: AlexElementsRangeType, styleNames?: string[]) => {
|
819
|
+
if (!editor.range) {
|
820
|
+
return
|
821
|
+
}
|
744
822
|
//移除样式的方法
|
745
823
|
const removeFn = (el: AlexElement) => {
|
746
824
|
//如果参数是数组,表示删除指定的样式
|
@@ -761,17 +839,17 @@ export const removeTextStyle = (editor: AlexEditor, dataRangeCaches: AlexElement
|
|
761
839
|
}
|
762
840
|
}
|
763
841
|
//如果起点和终点在一起
|
764
|
-
if (editor.range
|
842
|
+
if (editor.range.anchor.isEqual(editor.range.focus)) {
|
765
843
|
//如果是空白文本元素直接移除样式
|
766
|
-
if (editor.range
|
767
|
-
removeFn(editor.range
|
844
|
+
if (editor.range.anchor.element.isSpaceText()) {
|
845
|
+
removeFn(editor.range.anchor.element)
|
768
846
|
}
|
769
847
|
//如果是文本元素则新建一个空白文本元素
|
770
|
-
else if (editor.range
|
848
|
+
else if (editor.range.anchor.element.isText()) {
|
771
849
|
const el = AlexElement.getSpaceElement()
|
772
850
|
//继承文本元素的样式和标记
|
773
|
-
el.styles = cloneData(editor.range
|
774
|
-
el.marks = cloneData(editor.range
|
851
|
+
el.styles = cloneData(editor.range.anchor.element.styles)
|
852
|
+
el.marks = cloneData(editor.range.anchor.element.marks)
|
775
853
|
//移除样式
|
776
854
|
removeFn(el)
|
777
855
|
//插入
|
@@ -791,6 +869,9 @@ export const removeTextStyle = (editor: AlexEditor, dataRangeCaches: AlexElement
|
|
791
869
|
|
792
870
|
//移除文本元素的标记,markNames是标记名称数组,如果不存在则移除全部标记
|
793
871
|
export const removeTextMark = (editor: AlexEditor, dataRangeCaches: AlexElementsRangeType, markNames?: string[]) => {
|
872
|
+
if (!editor.range) {
|
873
|
+
return
|
874
|
+
}
|
794
875
|
//移除样式的方法
|
795
876
|
const removeFn = (el: AlexElement) => {
|
796
877
|
//如果参数是数组,表示删除指定的样式
|
@@ -811,17 +892,17 @@ export const removeTextMark = (editor: AlexEditor, dataRangeCaches: AlexElements
|
|
811
892
|
}
|
812
893
|
}
|
813
894
|
//如果起点和终点在一起
|
814
|
-
if (editor.range
|
895
|
+
if (editor.range.anchor.isEqual(editor.range.focus)) {
|
815
896
|
//如果是空白文本元素直接移除标记
|
816
|
-
if (editor.range
|
817
|
-
removeFn(editor.range
|
897
|
+
if (editor.range.anchor.element.isSpaceText()) {
|
898
|
+
removeFn(editor.range.anchor.element)
|
818
899
|
}
|
819
900
|
//如果是文本元素则新建一个空白文本元素
|
820
|
-
else if (editor.range
|
901
|
+
else if (editor.range.anchor.element.isText()) {
|
821
902
|
const el = AlexElement.getSpaceElement()
|
822
903
|
//继承文本元素的样式和标记
|
823
|
-
el.styles = cloneData(editor.range
|
824
|
-
el.marks = cloneData(editor.range
|
904
|
+
el.styles = cloneData(editor.range.anchor.element.styles)
|
905
|
+
el.marks = cloneData(editor.range.anchor.element.marks)
|
825
906
|
//移除标记
|
826
907
|
removeFn(el)
|
827
908
|
//插入
|
@@ -841,9 +922,12 @@ export const removeTextMark = (editor: AlexEditor, dataRangeCaches: AlexElements
|
|
841
922
|
|
842
923
|
//设置块元素或者根级块元素的行高
|
843
924
|
export const setLineHeight = (editor: AlexEditor, dataRangeCaches: AlexElementsRangeType, value: string | number) => {
|
844
|
-
if (editor.range
|
845
|
-
|
846
|
-
|
925
|
+
if (!editor.range) {
|
926
|
+
return
|
927
|
+
}
|
928
|
+
if (editor.range.anchor.isEqual(editor.range.focus)) {
|
929
|
+
const block = editor.range.anchor.element.getBlock()
|
930
|
+
const inblock = editor.range.anchor.element.getInblock()
|
847
931
|
if (inblock) {
|
848
932
|
if (inblock.hasStyles()) {
|
849
933
|
inblock.styles!['line-height'] = value
|
@@ -898,6 +982,9 @@ export const setLineHeight = (editor: AlexEditor, dataRangeCaches: AlexElementsR
|
|
898
982
|
|
899
983
|
//插入链接
|
900
984
|
export const insertLink = (editor: AlexEditor, text: string, url: string, newOpen: boolean) => {
|
985
|
+
if (!editor.range) {
|
986
|
+
return
|
987
|
+
}
|
901
988
|
if (!text) {
|
902
989
|
text = url
|
903
990
|
}
|
@@ -915,6 +1002,9 @@ export const insertLink = (editor: AlexEditor, text: string, url: string, newOpe
|
|
915
1002
|
|
916
1003
|
//插入图片
|
917
1004
|
export const insertImage = (editor: AlexEditor, value: string) => {
|
1005
|
+
if (!editor.range) {
|
1006
|
+
return
|
1007
|
+
}
|
918
1008
|
const image = new AlexElement(
|
919
1009
|
'closed',
|
920
1010
|
'img',
|
@@ -929,6 +1019,9 @@ export const insertImage = (editor: AlexEditor, value: string) => {
|
|
929
1019
|
|
930
1020
|
//插入视频
|
931
1021
|
export const insertVideo = (editor: AlexEditor, value: string) => {
|
1022
|
+
if (!editor.range) {
|
1023
|
+
return
|
1024
|
+
}
|
932
1025
|
const video = new AlexElement(
|
933
1026
|
'closed',
|
934
1027
|
'video',
|
@@ -943,12 +1036,15 @@ export const insertVideo = (editor: AlexEditor, value: string) => {
|
|
943
1036
|
const rightSpace = AlexElement.getSpaceElement()
|
944
1037
|
editor.addElementAfter(rightSpace, video)
|
945
1038
|
editor.addElementBefore(leftSpace, video)
|
946
|
-
editor.range
|
947
|
-
editor.range
|
1039
|
+
editor.range.anchor.moveToEnd(rightSpace)
|
1040
|
+
editor.range.focus.moveToEnd(rightSpace)
|
948
1041
|
}
|
949
1042
|
|
950
1043
|
//插入表格
|
951
1044
|
export const insertTable = (editor: AlexEditor, rowLength: number, colLength: number) => {
|
1045
|
+
if (!editor.range) {
|
1046
|
+
return
|
1047
|
+
}
|
952
1048
|
const table = new AlexElement('block', 'table', null, null, null)
|
953
1049
|
const tbody = new AlexElement('inblock', 'tbody', null, null, null)
|
954
1050
|
editor.addElementTo(tbody, table)
|
@@ -968,12 +1064,15 @@ export const insertTable = (editor: AlexEditor, rowLength: number, colLength: nu
|
|
968
1064
|
const breakEl = new AlexElement('closed', 'br', null, null, null)
|
969
1065
|
editor.addElementTo(breakEl, paragraph)
|
970
1066
|
editor.addElementAfter(paragraph, table)
|
971
|
-
editor.range
|
972
|
-
editor.range
|
1067
|
+
editor.range.anchor.moveToStart(tbody)
|
1068
|
+
editor.range.focus.moveToStart(tbody)
|
973
1069
|
}
|
974
1070
|
|
975
1071
|
//插入或者取消代码块
|
976
1072
|
export const insertCodeBlock = (editor: AlexEditor, dataRangeCaches: AlexElementsRangeType) => {
|
1073
|
+
if (!editor.range) {
|
1074
|
+
return
|
1075
|
+
}
|
977
1076
|
const pre = getCurrentParsedomElement(editor, dataRangeCaches, 'pre')
|
978
1077
|
if (pre) {
|
979
1078
|
let content = ''
|
@@ -994,8 +1093,8 @@ export const insertCodeBlock = (editor: AlexEditor, dataRangeCaches: AlexElement
|
|
994
1093
|
pre.toEmpty()
|
995
1094
|
} else {
|
996
1095
|
//起点和终点在一起
|
997
|
-
if (editor.range
|
998
|
-
const block = editor.range
|
1096
|
+
if (editor.range.anchor.isEqual(editor.range.focus)) {
|
1097
|
+
const block = editor.range.anchor.element.getBlock()
|
999
1098
|
elementToParagraph(block)
|
1000
1099
|
block.parsedom = 'pre'
|
1001
1100
|
const paragraph = new AlexElement('block', AlexElement.BLOCK_NODE, null, null, null)
|
@@ -1005,8 +1104,8 @@ export const insertCodeBlock = (editor: AlexEditor, dataRangeCaches: AlexElement
|
|
1005
1104
|
}
|
1006
1105
|
//起点和终点不在一起
|
1007
1106
|
else {
|
1008
|
-
editor.range
|
1009
|
-
editor.range
|
1107
|
+
editor.range.anchor.moveToStart(dataRangeCaches.list[0].element.getBlock())
|
1108
|
+
editor.range.focus.moveToEnd(dataRangeCaches.list[dataRangeCaches.list.length - 1].element.getBlock())
|
1010
1109
|
const res = dataRangeCaches.flatList.filter(el => el.element.isText())
|
1011
1110
|
const obj: ObjectType = {}
|
1012
1111
|
res.forEach(el => {
|
package/src/editify/editify.vue
CHANGED
package/src/index.ts
CHANGED
@@ -12,7 +12,7 @@ import { InsertImageUploadErrorType } from './components/insertImage/props'
|
|
12
12
|
import { InsertVideoUploadErrorType } from './components/insertVideo/props'
|
13
13
|
|
14
14
|
//版本号
|
15
|
-
const version = '0.1.
|
15
|
+
const version = '0.1.13'
|
16
16
|
//安装函数
|
17
17
|
const install = (app: App) => {
|
18
18
|
app.component(Editify.name!, Editify)
|