diff options
Diffstat (limited to 'src/MenuItem.mjs')
-rw-r--r-- | src/MenuItem.mjs | 35 |
1 files changed, 21 insertions, 14 deletions
diff --git a/src/MenuItem.mjs b/src/MenuItem.mjs index 98f3bae..5604ef1 100644 --- a/src/MenuItem.mjs +++ b/src/MenuItem.mjs | |||
@@ -1,6 +1,5 @@ | |||
1 | import { createGeoLink } from './dumbymap'; | 1 | import { createGeoLink } from './dumbymap'; |
2 | import { scrollToBlock } from './dumbyUtils'; | 2 | import { scrollToBlock } from './dumbyUtils'; |
3 | import { default as PlainModal } from 'plain-modal'; | ||
4 | 3 | ||
5 | class Item extends HTMLDivElement { | 4 | class Item extends HTMLDivElement { |
6 | constructor({ text, innerHTML, onclick }) { | 5 | constructor({ text, innerHTML, onclick }) { |
@@ -38,7 +37,7 @@ window.customElements.define('menu-folder', Folder, { extends: 'div' }); | |||
38 | 37 | ||
39 | export const pickMapItem = dumbymap => | 38 | export const pickMapItem = dumbymap => |
40 | new Folder({ | 39 | new Folder({ |
41 | innerHTML: '<span>Focus a Map<span><span class="info">(Tab)</span>', | 40 | innerHTML: '<span>Maps<span><span class="info">(Tab)</span>', |
42 | items: dumbymap.utils.renderedMaps().map( | 41 | items: dumbymap.utils.renderedMaps().map( |
43 | map => | 42 | map => |
44 | new Item({ | 43 | new Item({ |
@@ -53,15 +52,16 @@ export const pickMapItem = dumbymap => | |||
53 | 52 | ||
54 | export const pickBlockItem = dumbymap => | 53 | export const pickBlockItem = dumbymap => |
55 | new Folder({ | 54 | new Folder({ |
56 | innerHTML: '<span>Focus Block<span><span class="info">(n/p)</span>', | 55 | innerHTML: '<span>Blocks<span><span class="info">(n/p)</span>', |
57 | items: dumbymap.blocks.map( | 56 | items: dumbymap.blocks.map( |
58 | (block, index) => | 57 | (block, index) => |
59 | new Item({ | 58 | new Item({ |
60 | text: | 59 | text: |
60 | `<strong>(${index})</strong>` + | ||
61 | block | 61 | block |
62 | .querySelector('p') | 62 | .querySelector('p') |
63 | ?.textContent.substring(0, 20) | 63 | ?.textContent.substring(0, 15) |
64 | .concat(' ...') ?? `Block ${index}`, | 64 | .concat(' ...'), |
65 | onclick: () => { | 65 | onclick: () => { |
66 | block.classList.add('focus'); | 66 | block.classList.add('focus'); |
67 | scrollToBlock(block); | 67 | scrollToBlock(block); |
@@ -72,13 +72,13 @@ export const pickBlockItem = dumbymap => | |||
72 | 72 | ||
73 | export const pickLayoutItem = dumbymap => | 73 | export const pickLayoutItem = dumbymap => |
74 | new Folder({ | 74 | new Folder({ |
75 | innerHTML: '<span>Switch Layout<span><span class="info">(x)</span>', | 75 | innerHTML: '<span>Layouts<span><span class="info">(x)</span>', |
76 | items: [ | 76 | items: [ |
77 | new Item({ | 77 | new Item({ |
78 | text: 'EDIT', | 78 | text: 'EDIT', |
79 | onclick: () => | 79 | onclick: () => |
80 | dumbymap.container | 80 | dumbymap.container |
81 | .closest('.playground') | 81 | .closest('[data-mode]') |
82 | .setAttribute('data-mode', 'editing'), | 82 | .setAttribute('data-mode', 'editing'), |
83 | }), | 83 | }), |
84 | ...dumbymap.layouts.map( | 84 | ...dumbymap.layouts.map( |
@@ -161,10 +161,17 @@ export class Suggestion { | |||
161 | } | 161 | } |
162 | } | 162 | } |
163 | 163 | ||
164 | export const modal = new Item({ | 164 | export const renderResults = (dumbymap, map) => |
165 | text: 'Render Results', | 165 | new Item({ |
166 | onclick: () => { | 166 | text: 'Render Results', |
167 | const modal = new PlainModal(); | 167 | onclick: e => { |
168 | modal.open(); | 168 | const modal = dumbymap.modal; |
169 | }, | 169 | modal.open(); |
170 | }); | 170 | modal.overlayBlur = 3; |
171 | modal.closeByEscKey = false; | ||
172 | // HACK find another way to override inline style | ||
173 | document.querySelector('.plainmodal-overlay-force').style.position = | ||
174 | 'static'; | ||
175 | console.log(map.renderer.results) | ||
176 | }, | ||
177 | }); | ||