aboutsummaryrefslogtreecommitdiffhomepage
path: root/src/MenuItem.mjs
diff options
context:
space:
mode:
authorHsieh Chin Fan <pham@topo.tw>2024-09-28 17:47:52 +0800
committerHsieh Chin Fan <pham@topo.tw>2024-09-28 17:47:52 +0800
commit933eba7dc3bdc979fefadd47388b20b8360e1d6b (patch)
tree9b88908d88a025aaaa1d70306afde8e49fedab27 /src/MenuItem.mjs
parent5a64dfc8bb8169e72b7c1164f18c6912e9e3576e (diff)
style: prettier
Diffstat (limited to 'src/MenuItem.mjs')
-rw-r--r--src/MenuItem.mjs102
1 files changed, 51 insertions, 51 deletions
diff --git a/src/MenuItem.mjs b/src/MenuItem.mjs
index 85ab1a2..2f9aff4 100644
--- a/src/MenuItem.mjs
+++ b/src/MenuItem.mjs
@@ -1,97 +1,97 @@
1import { createGeoLink } from './dumbymap' 1import { createGeoLink } from "./dumbymap";
2 2
3export function nextMap() { 3export function nextMap() {
4 const element = document.createElement('div') 4 const element = document.createElement("div");
5 element.className = 'menu-item' 5 element.className = "menu-item";
6 element.innerHTML = 'Next Map <span class="info">(Tab)</span>' 6 element.innerHTML = 'Next Map <span class="info">(Tab)</span>';
7 element.onclick = () => this.utils.focusNextMap() 7 element.onclick = () => this.utils.focusNextMap();
8 8
9 return element 9 return element;
10} 10}
11 11
12export function nextBlock() { 12export function nextBlock() {
13 const element = document.createElement('div') 13 const element = document.createElement("div");
14 element.className = 'menu-item' 14 element.className = "menu-item";
15 element.innerHTML = 'Next Block <span class="info">(n)</span>' 15 element.innerHTML = 'Next Block <span class="info">(n)</span>';
16 element.onclick = () => this.utils.focusNextBlock() 16 element.onclick = () => this.utils.focusNextBlock();
17 17
18 return element 18 return element;
19} 19}
20 20
21export function nextLayout() { 21export function nextLayout() {
22 const element = document.createElement('div') 22 const element = document.createElement("div");
23 element.className = 'menu-item' 23 element.className = "menu-item";
24 element.innerHTML = 'Next Layout <span class="info">(x)</span>' 24 element.innerHTML = 'Next Layout <span class="info">(x)</span>';
25 element.onclick = () => this.utils.switchToNextLayout() 25 element.onclick = () => this.utils.switchToNextLayout();
26 26
27 return element 27 return element;
28} 28}
29 29
30export class GeoLink { 30export class GeoLink {
31
32 constructor({ range }) { 31 constructor({ range }) {
33 this.range = range 32 this.range = range;
34 } 33 }
35 34
36 createElement = () => { 35 createElement = () => {
37 const element = document.createElement('div') 36 const element = document.createElement("div");
38 element.className = 'menu-item' 37 element.className = "menu-item";
39 element.innerText = "Add GeoLink" 38 element.innerText = "Add GeoLink";
40 element.onclick = this.addGeoLinkbyRange 39 element.onclick = this.addGeoLinkbyRange;
41 40
42 return element 41 return element;
43 } 42 };
44 43
45 addGeoLinkbyRange = () => { 44 addGeoLinkbyRange = () => {
46 const range = this.range 45 const range = this.range;
47 const content = range.toString() 46 const content = range.toString();
48 // FIXME Apply geolink only on matching sub-range 47 // FIXME Apply geolink only on matching sub-range
49 const match = content.match(/(^\D*[\d.]+)\D+([\d.]+)\D*$/) 48 const match = content.match(/(^\D*[\d.]+)\D+([\d.]+)\D*$/);
50 if (!match) return false 49 if (!match) return false;
51 50
52 const [x, y] = match.slice(1) 51 const [x, y] = match.slice(1);
53 const anchor = document.createElement('a') 52 const anchor = document.createElement("a");
54 anchor.textContent = content 53 anchor.textContent = content;
55 // FIXME apply WGS84 54 // FIXME apply WGS84
56 anchor.href = `geo:${y},${x}?xy=${x},${y}` 55 anchor.href = `geo:${y},${x}?xy=${x},${y}`;
57 56
58 if (createGeoLink(anchor)) { 57 if (createGeoLink(anchor)) {
59 range.deleteContents() 58 range.deleteContents();
60 range.insertNode(anchor) 59 range.insertNode(anchor);
61 } 60 }
62 } 61 };
63} 62}
64export class Suggestion { 63export class Suggestion {
65 constructor({ text, replace }) { 64 constructor({ text, replace }) {
66 this.text = text 65 this.text = text;
67 this.replace = replace 66 this.replace = replace;
68 } 67 }
69 68
70 createElement(codemirror) { 69 createElement(codemirror) {
71 const option = document.createElement('div'); 70 const option = document.createElement("div");
72 if (this.text.startsWith('<')) { 71 if (this.text.startsWith("<")) {
73 option.innerHTML = this.text; 72 option.innerHTML = this.text;
74 } else { 73 } else {
75 option.innerText = this.text; 74 option.innerText = this.text;
76 } 75 }
77 option.classList.add('container__suggestion'); 76 option.classList.add("container__suggestion");
78 option.onmouseover = () => { 77 option.onmouseover = () => {
79 Array.from(option.parentElement?.children ?? []) 78 Array.from(option.parentElement?.children ?? []).forEach(s =>
80 .forEach(s => s.classList.remove('focus')) 79 s.classList.remove("focus"),
81 option.classList.add('focus') 80 );
82 } 81 option.classList.add("focus");
82 };
83 option.onmouseout = () => { 83 option.onmouseout = () => {
84 option.classList.remove('focus') 84 option.classList.remove("focus");
85 } 85 };
86 option.onclick = () => { 86 option.onclick = () => {
87 const anchor = codemirror.getCursor() 87 const anchor = codemirror.getCursor();
88 codemirror.setSelection(anchor, { ...anchor, ch: 0 }) 88 codemirror.setSelection(anchor, { ...anchor, ch: 0 });
89 codemirror.replaceSelection(this.replace) 89 codemirror.replaceSelection(this.replace);
90 codemirror.focus(); 90 codemirror.focus();
91 const newAnchor = { ...anchor, ch: this.replace.length } 91 const newAnchor = { ...anchor, ch: this.replace.length };
92 codemirror.setCursor(newAnchor); 92 codemirror.setCursor(newAnchor);
93 }; 93 };
94 94
95 return option 95 return option;
96 } 96 }
97} 97}