-
Notifications
You must be signed in to change notification settings - Fork 1
/
BulletManager.ts
67 lines (54 loc) · 1.8 KB
/
BulletManager.ts
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
export default class BulletManager {
cm; // The codemirror instance
bullets: Map<number, any[]> = new Map()
constructor(cm) {
this.cm = cm
}
detectColor(text: string): string[] {
let colors: string[] = [];
const reColors = {
HEX: /#([A-F0-9]{6}|[A-F0-9]{3,4})\b/gi,
HSL: /hsl\(\s*(?<hue>\d+(deg)?)\s*,\s*(?<s>\d{1,2}|100)%\s*,\s*(?<l>\d{1,2}|100)%\s*\)/gi,
RGB: /rgb(?=\((([^%]*?%[^%]*?){3}|([^%]*?\d[^%]*?){3})\))\(\s*(?<rg>(1?\d{1,2}|2[0-4]\d|25[0-5])%?\s*,\s*){2}(?<b>1?\d{1,2}|2[0-4]\d|25[0-5])%?\s*\)/g,
RGBA: /rgba\(\s*(?<rgb>(1?\d{1,2}|2[0-4]\d|25[0-5])\s*,\s*){3}(?<alpha>(?<=0|\s|,)0?\.\d+|1|0)\s*\)/g,
HSLA: /hsla\(\s*(?<hue>\d+(deg)?)\s*,\s*(?<sl>(\d{1,2}|100)%\s*,\s*){2}(?<alpha>(?<=0|\s|,)0?\.\d+|1|0)\s*\)/gi,
}
for (let format in reColors) {
let re = reColors[format]
if (re.test(text))
colors.push(...text.match(re))
}
return colors
}
showColorBullet(color: string, line: number, ch: number) {
let bullet = document.createElement('span')
bullet.style.cssText = `
margin-right: 0.2em;
margin-left: 0.4em;
padding: 0.35em;
background-color: ${color};
display: inline-block;
border: 0.06em solid white;
border-radius: 50%;
`
let b = this.cm.setBookmark(
{ line, ch },
{ widget: bullet }
)
if (this.bullets.has(line))
this.bullets.get(line).push(b)
else
this.bullets.set(line, [b])
}
processLine(line: number, text: string) {
let colors: string[] = this.detectColor(text)
if (this.bullets.has(line))
this.bullets.get(line).forEach(b => b.clear())
if (colors) {
colors.forEach(color => {
let ch = text.indexOf(color) + color.length
this.showColorBullet(color, line, ch)
})
}
}
}