| 1 |
|
| 2 | const d3 = require('./d3.js')
|
| 3 | const icons = require('./icons')
|
| 4 | const EventEmitter = require('events')
|
| 5 |
|
| 6 | class Menu extends EventEmitter {
|
| 7 | constructor () {
|
| 8 | super()
|
| 9 |
|
| 10 | this.container = d3.select('#menu')
|
| 11 |
|
| 12 | this.setupThemeToggle()
|
| 13 | this.setupGridToggle()
|
| 14 | }
|
| 15 |
|
| 16 | setupGridToggle () {
|
| 17 | const gridButton = this.container.append('div')
|
| 18 | .classed('toggle', true)
|
| 19 | .attr('id', 'toggle-grid')
|
| 20 | .on('click', () => this.emit('toggle-grid'))
|
| 21 |
|
| 22 | gridButton.append('svg')
|
| 23 | .classed('grid-2x2', true)
|
| 24 | .call(icons.insertIcon('grid-2x2'))
|
| 25 | gridButton.append('svg')
|
| 26 | .classed('grid-1x4', true)
|
| 27 | .call(icons.insertIcon('grid-1x4'))
|
| 28 | }
|
| 29 |
|
| 30 | setupThemeToggle () {
|
| 31 | const themeButton = this.container.append('div')
|
| 32 | .classed('toggle', true)
|
| 33 | .attr('id', 'light-theme')
|
| 34 | .on('click', () => this.emit('toggle-theme'))
|
| 35 |
|
| 36 | themeButton.append('svg')
|
| 37 | .classed('theme-dark', true)
|
| 38 | .call(icons.insertIcon('lightmode'))
|
| 39 | themeButton.append('svg')
|
| 40 | .classed('theme-light', true)
|
| 41 | .call(icons.insertIcon('darkmode'))
|
| 42 | }
|
| 43 | }
|
| 44 |
|
| 45 | module.exports = new Menu()
|