diff --git a/src/app/tabs/styles/tabbed-menu-styles.js b/src/app/tabs/styles/tabbed-menu-styles.js deleted file mode 100644 index 4480912135..0000000000 --- a/src/app/tabs/styles/tabbed-menu-styles.js +++ /dev/null @@ -1,36 +0,0 @@ -const csjs = require('csjs-inject') - -const css = csjs` - .menu { - display: flex; - list-style: none; - margin: 0; - padding: 0; - } - .active { - } - .options { - float: left; - padding-top: 0.7em; - min-width: 60px; - font-size: 0.9em; - cursor: pointer; - font-size: 1em; - text-align: center; - } - .optionViews { - overflow: scroll; - height: 100%; - } - .optionViews > div { - display: none; - } - .optionViews .pre { - word-wrap: break-word; - border-radius: 3px; - display: inline-block; - padding: 0 0.6em; - } -` - -module.exports = css diff --git a/src/app/tabs/tabbed-menu.js b/src/app/tabs/tabbed-menu.js deleted file mode 100644 index dbbb798b73..0000000000 --- a/src/app/tabs/tabbed-menu.js +++ /dev/null @@ -1,90 +0,0 @@ -var yo = require('yo-yo') -var css = require('./styles/tabbed-menu-styles') - -var globalRegistry = require('../../global/registry') -var helper = require('../../lib/helper') - -var EventManager = require('../../lib/events') - -class TabbedMenu { - constructor (localRegistry) { - const self = this - self.event = new EventManager() - self._components = {} - self._components.registry = localRegistry || globalRegistry - self._deps = { - app: self._components.registry.get('app').api - } - self._view = { el: null, viewport: null, tabs: {}, contents: {} } - } - render () { - const self = this - if (self._view.el) return self._view.el - self._view.el = yo`` - return self._view.el - } - renderViewport () { - const self = this - if (self._view.viewport) return self._view.viewport - self._view.viewport = yo` -
- ${Object.values(self._view.contents)} -
` - return self._view.viewport - } - addTab (title, cssClass, content) { - const self = this - if (helper.checkSpecialChars(title)) return - if (self._view.contents[title] || self._view.tabs[title]) throw new Error('tab already exists') - self._view.contents[title] = content - self._view.tabs[title] = yo`
  • ${title}
  • ` - if (self._view.el) self._view.el.appendChild(self._view.tabs[title]) - if (self._view.viewport) self._view.viewport.appendChild(self._view.contents[title]) - } - removeTabByTitle (title) { - const self = this - if (self._view.tabs[title]) { - self._view.tabs[title].parentNode.removeChild(self._view.tabs[title]) - } - if (self._view.contents[title]) { - self._view.contents[title].parentNode.removeChild(self._view.contents[title]) - } - delete self._view.contents[title] - delete self._view.tabs[title] - } - getTabByClass (tabClass) { - const self = this - return self._view.el.querySelector(`li.${tabClass}`) - } - updateTabTitle (tabClass, title) { - const self = this - var tab = self.getTabByClass(tabClass) - if (tab) tab.innerHTML = title - } - selectTabByTitle (title) { - const self = this - self.selectTab(self._view.tabs[title]) - } - selectTabByClassName (tabClass) { - const self = this - var tab = self.getTabByClass(tabClass) - if (tab) self.selectTab(tab) - return tab - } - selectTab (el) { - const self = this - if (!el.classList.contains(css.active)) { - var nodes = Object.values(self._view.tabs) - for (var i = 0; i < nodes.length; ++i) { - nodes[i].classList.remove(css.active) - self._view.contents[nodes[i].getAttribute('title')].style.display = 'none' - } - } - var title = el.getAttribute('title') - self._view.contents[el.getAttribute('title')].style.display = 'block' - el.classList.add(css.active) - self._deps.app.event.trigger('tabChanged', [title]) - } -} - -module.exports = TabbedMenu