rhp: refactor api/events/opts

src/app/panels/righthand-panel.js

@@ -17,17 +17,20 @@ const RunTab = require('../tabs/run-tab')
 const EventManager = remixLib.EventManager
 const styles = styleguide.chooser()
 
-module.exports = function RighthandPanel (appAPI = {}, events = {}, opts = {}) {
+module.exports = function RighthandPanel (api = {}, events = {}, opts = {}) {
   const self = this
-  self._api = appAPI
+  self._api = api
+  self._events = events
+  self._opts = opts
   self.event = new EventManager()
-  self._view = {}
+  self._view = { el: null, tabbedMenu: null, tabbedMenuViewport: null, dragbar: null }
+  self._components = {}
 
   const optionViews = yo`<div id="optionViews"></div>`
   self._view.dragbar = yo`<div id="dragbar" class=${css.dragbar}></div>`
   // load tabbed menu component
-  const tabEvents = {compiler: events.compiler, app: events.app, rhp: self.event}
+  const tabEvents = {compiler: self._events.compiler, app: self._events.app, rhp: self.event}
-  self._view.tabbedMenu = new TabbedMenu(appAPI, tabEvents)
+  self._view.tabbedMenu = new TabbedMenu(self._api, tabEvents)
   const options = self._view.tabbedMenu.render()
   options.classList.add(css.opts)
   self._view.element = yo`
@@ -42,21 +45,21 @@ module.exports = function RighthandPanel (appAPI = {}, events = {}, opts = {}) {
     </div>
   `
   // selectTabByClassName
-  appAPI.switchTab = tabClass => self._view.tabbedMenu.selectTabByClassName(tabClass)
+  self._api.switchTab = tabClass => self._view.tabbedMenu.selectTabByClassName(tabClass)
 
-  events.rhp = self.event
+  self._events.rhp = self.event
 
-  const compileTab = new CompileTab(appAPI, events, opts)
+  const compileTab = new CompileTab(self._api, self._events, self._opts)
   optionViews.appendChild(compileTab.render())
-  const runTab = new RunTab(appAPI, events, opts)
+  const runTab = new RunTab(self._api, self._events, self._opts)
   optionViews.appendChild(runTab.render())
-  const settingsTab = new SettingsTab(appAPI, events, opts)
+  const settingsTab = new SettingsTab(self._api, self._events, self._opts)
   optionViews.appendChild(settingsTab.render())
-  const analysisTab = new AnalysisTab(appAPI, events, opts)
+  const analysisTab = new AnalysisTab(self._api, self._events, self._opts)
   optionViews.appendChild(analysisTab.render())
-  const debuggerTab = new DebuggerTab(appAPI, events, opts)
+  const debuggerTab = new DebuggerTab(self._api, self._events, self._opts)
   optionViews.appendChild(debuggerTab.render())
-  const supportTab = new SupportTab(appAPI, events, opts)
+  const supportTab = new SupportTab(self._api, self._events, self._opts)
   optionViews.appendChild(supportTab.render())
   var testTab = new TestTab(appAPI, events, opts)
   optionViews.appendChild(testTab.render())
@@ -69,9 +72,9 @@ module.exports = function RighthandPanel (appAPI = {}, events = {}, opts = {}) {
   this._view.tabbedMenu.addTab('Test', 'testView', optionViews.querySelector('#testView'))
   this._view.tabbedMenu.selectTabByTitle('Compile')
 
-  self.pluginManager = new PluginManager(opts.pluginAPI, events)
+  self.pluginManager = new PluginManager(self._opts.pluginAPI, self._events)
-  events.rhp.register('plugin-loadRequest', (json) => {
+  self._events.rhp.register('plugin-loadRequest', (json) => {
-    const tab = new PluginTab({}, events, json)
+    const tab = new PluginTab({}, self._events, json)
     const content = tab.render()
     optionViews.appendChild(content)
     this._view.tabbedMenu.addTab(json.title, 'plugin', content)