Use ApiFactory and a getter for profile.

src/app.js

@@ -7,7 +7,6 @@ var async = require('async')
 var request = require('request')
 var remixLib = require('remix-lib')
 var EventManager = require('./lib/events')
-var EventEmitter = require('events')
 var registry = require('./global/registry')
 var UniversalDApp = require('./universal-dapp.js')
 var UniversalDAppUI = require('./universal-dapp-ui.js')
@@ -55,8 +54,10 @@ const FilePanel = require('./app/panels/file-panel')
 import PanelsResize from './lib/panels-resize'
 import { EntityStore } from './lib/store'
 import { RemixAppManager } from './remixAppManager'
-import { generateHomePage, homepageProfile } from './app/ui/landing-page/generate'
+import { LandingPage } from './app/ui/landing-page/landing-page'
 import framingService from './framingService'
+import { ApiFactory } from 'remix-plugin'
+import { TxListenerModule } from './app/tabs/txlistener-module'
 
 var css = csjs`
   html { box-sizing: border-box; }
@@ -116,8 +117,9 @@ var css = csjs`
   }
 `
 
-class App {
+class App extends ApiFactory {
   constructor (api = {}, events = {}, opts = {}) {
+    super()
     var self = this
     this.event = new EventManager()
     self._components = {}
@@ -173,7 +175,7 @@ class App {
     run.apply(self)
   }
 
-  profile () {
+  get profile () {
     return {
       name: 'app',
       description: 'service - provides information about current context (network).',
@@ -373,26 +375,13 @@ Please make a backup of your contracts and start using http://remix.ethereum.org
   /*
     that proxy is used by appManager to broadcast new transaction event
   */
-  const txListenerModuleProxy = {
-    event: new EventEmitter(),
-    profile () {
-      return {
-        name: 'txListener',
-        displayName: 'transaction listener',
-        events: ['newTransaction'],
-        description: 'service - notify new transactions'
-      }
-    }
-  }
-  txlistener.event.register('newTransaction', (tx) => {
-    txListenerModuleProxy.event.emit('newTransaction', tx)
-  })
+  const txListenerModule = new TxListenerModule(txlistener)
 
   txlistener.startListening()
 
   // TODO: There are still a lot of dep between editorpanel and filemanager
 
-  let appStore = new EntityStore('module', { actives: [], ids: [], entities: {} })
+  let appStore = new EntityStore('module', 'name')
   const appManager = new RemixAppManager(appStore)
   registry.put({api: appManager, name: 'appmanager'})
 
@@ -458,33 +447,35 @@ Please make a backup of your contracts and start using http://remix.ethereum.org
   let settings = new SettingsTab(self._components.registry)
   let analysis = new AnalysisTab(registry)
   let debug = new DebuggerTab()
+  const landingPage = new LandingPage(appManager, appStore)
   // let support = new SupportTab()
   let test = new TestTab(self._components.registry, compileTab)
   let sourceHighlighters = registry.get('editor').api.sourceHighlighters
   let configProvider = self._components.filesProviders['config']
 
   appManager.init([
-    { profile: homepageProfile(), api: generateHomePage(appManager, appStore) },
-    { profile: this.profile(), api: this },
-    { profile: udapp.profile(), api: udapp },
-    { profile: fileManager.profile(), api: fileManager },
-    { profile: sourceHighlighters.profile(), api: sourceHighlighters },
-    { profile: configProvider.profile(), api: configProvider },
-    { profile: txListenerModuleProxy.profile(), api: txListenerModuleProxy },
-    { profile: filePanel.profile(), api: filePanel },
+    this.api(),
+    landingPage.api(),
+    udapp.api(),
+    fileManager.api(),
+    sourceHighlighters.api(),
+    configProvider.api(),
+    txListenerModule.api(),
+    filePanel.api(),
     // { profile: support.profile(), api: support },
-    { profile: settings.profile(), api: settings },
-    { profile: pluginManagerComponent.profile(), api: pluginManagerComponent }])
+    settings.api(),
+    pluginManagerComponent.api()
+  ])
 
   appManager.registerMany([
-    { profile: compileTab.profile(), api: compileTab },
-    { profile: run.profile(), api: run },
-    { profile: debug.profile(), api: debug },
-    { profile: analysis.profile(), api: analysis },
-    { profile: test.profile(), api: test },
-    { profile: filePanel.remixdHandle.profile(), api: filePanel.remixdHandle }
+    compileTab.api(),
+    run.api(),
+    debug.api(),
+    analysis.api(),
+    test.api(),
+    filePanel.remixdHandle.api(),
+    ...appManager.plugins()
   ])
-  appManager.registerMany(appManager.plugins())
 
   framingService.start(appStore, swapPanelApi, verticalIconsApi, mainPanelApi, this._components.resizeFeature)
 

src/app/components/plugin-manager-component.js

@@ -2,7 +2,7 @@ const yo = require('yo-yo')
 const csjs = require('csjs-inject')
 const EventEmitter = require('events')
 const LocalPlugin = require('./local-plugin')
-import { Plugin } from 'remix-plugin'
+import { Plugin, ApiFactory } from 'remix-plugin'
 
 const css = csjs`
   .pluginSearch {
@@ -34,9 +34,10 @@ const css = csjs`
   }
 `
 
-class PluginManagerComponent {
+class PluginManagerComponent extends ApiFactory {
 
   constructor () {
+    super()
     this.event = new EventEmitter()
     this.views = {
       root: null,
@@ -46,7 +47,7 @@ class PluginManagerComponent {
     this.filter = ''
   }
 
-  profile () {
+  get profile () {
     return {
       displayName: 'plugin manager',
       name: 'pluginManager',
@@ -71,10 +72,10 @@ class PluginManagerComponent {
   }
 
   renderItem (name) {
-    const mod = this.store.getOne(name)
-    if (!mod) return
+    const api = this.store.getOne(name)
+    if (!api) return
     const isActive = this.store.actives.includes(name)
-    const displayName = (mod.profile.displayName) ? mod.profile.displayName : name
+    const displayName = (api.profile.displayName) ? api.profile.displayName : name
 
     const activationButton = isActive
       ? yo`
@@ -92,7 +93,7 @@ class PluginManagerComponent {
           <h6 class="${css.displayName}">${displayName}</h6>
           ${activationButton}
         </div>
-        <p class="${css.description}">${mod.profile.description}</p>
+        <p class="${css.description}">${api.profile.description}</p>
       </article>
     `
   }
@@ -109,8 +110,8 @@ class PluginManagerComponent {
       if (!profile) return
       const resolveLocaton = (iframe) => this.appManager.resolveLocation(profile, iframe)
       const api = new Plugin(profile, { resolveLocaton })
-      this.appManager.registerOne({profile, api})
-      this.appManager.activateOne(profile.name)
+      this.appManager.registerOne(api)
+      this.appManager.activateOne(api.name)
     } catch (err) {
       // TODO : Use an alert to handle this error instead of a console.log
       console.log(`Cannot create Plugin : ${err.message}`)
@@ -119,11 +120,11 @@ class PluginManagerComponent {
 
   render () {
     // Filtering helpers
-    const isFiltered = ({profile}) => profile.name.toLowerCase().includes(this.filter)
+    const isFiltered = (api) => api.name.toLowerCase().includes(this.filter)
     const isNotRequired = ({profile}) => !profile.required
     const sortByName = (a, b) => {
-      const nameA = a.profile.name.toUpperCase()
-      const nameB = b.profile.name.toUpperCase()
+      const nameA = a.name.toUpperCase()
+      const nameB = b.name.toUpperCase()
       return (nameA < nameB) ? -1 : (nameA > nameB) ? 1 : 0
     }
 
@@ -132,10 +133,10 @@ class PluginManagerComponent {
       .filter(isFiltered)
       .filter(isNotRequired)
       .sort(sortByName)
-      .reduce(({actives, inactives}, {profile}) => {
-        return this.store.actives.includes(profile.name)
-          ? { actives: [...actives, profile.name], inactives }
-          : { inactives: [...inactives, profile.name], actives }
+      .reduce(({actives, inactives}, api) => {
+        return this.store.actives.includes(api.name)
+          ? { actives: [...actives, api.name], inactives }
+          : { inactives: [...inactives, api.name], actives }
       }, { actives: [], inactives: [] })
 
     const activeTile = actives.length !== 0

src/app/editor/SourceHighlighters.js

 'use strict'
 const SourceHighlighter = require('./sourceHighlighter')
 
-class SourceHighlighters {
+import { ApiFactory } from 'remix-plugin'
+
+class SourceHighlighters extends ApiFactory {
 
   constructor () {
+    super()
     this.highlighters = {}
   }
 
-  profile () {
+  get profile () {
     return {
       displayName: 'source highlighters',
       name: 'sourceHighlighters',

src/app/files/remixd-handle.js

+import { ApiFactory } from 'remix-plugin'
+
 var yo = require('yo-yo')
 var modalDialog = require('../ui/modaldialog')
 
@@ -14,13 +16,14 @@ var css = csjs`
   }
 `
 
-export class RemixdHandle {
+export class RemixdHandle extends ApiFactory {
   constructor (fileSystemExplorer, locahostProvider) {
+    super()
     this.fileSystemExplorer = fileSystemExplorer
     this.locahostProvider = locahostProvider
   }
 
-  profile () {
+  get profile () {
     return {
       name: 'remixd',
       methods: [],

src/app/panels/file-panel.js

@@ -17,6 +17,8 @@ var globalRegistry = require('../../global/registry')
 
 var css = require('./styles/file-panel-styles')
 
+import { ApiFactory } from 'remix-plugin'
+
 var canUpload = window.File || window.FileReader || window.FileList || window.Blob
 
 /*
@@ -36,7 +38,10 @@ var canUpload = window.File || window.FileReader || window.FileList || window.Bl
       - call fileProvider API
 */
 
-function filepanel (localRegistry) {
+module.exports = class Filepanel extends ApiFactory {
+
+  constructor (localRegistry) {
+    super()
     var self = this
     self._components = {}
     self._components.registry = localRegistry || globalRegistry
@@ -163,18 +168,6 @@ function filepanel (localRegistry) {
 
     self.render = function render () { return element }
 
-  self.profile = function () {
-    return {
-      name: 'fileExplorers',
-      displayName: 'file explorers',
-      methods: [],
-      events: [],
-      icon: 'data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPHN2ZyB3aWR0aD0iMTc5MiIgaGVpZ2h0PSIxNzkyIiB2aWV3Qm94PSIwIDAgMTc5MiAxNzkyIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxwYXRoIGQ9Ik0xNjk2IDM4NHE0MCAwIDY4IDI4dDI4IDY4djEyMTZxMCA0MC0yOCA2OHQtNjggMjhoLTk2MHEtNDAgMC02OC0yOHQtMjgtNjh2LTI4OGgtNTQ0cS00MCAwLTY4LTI4dC0yOC02OHYtNjcycTAtNDAgMjAtODh0NDgtNzZsNDA4LTQwOHEyOC0yOCA3Ni00OHQ4OC0yMGg0MTZxNDAgMCA2OCAyOHQyOCA2OHYzMjhxNjgtNDAgMTI4LTQwaDQxNnptLTU0NCAyMTNsLTI5OSAyOTloMjk5di0yOTl6bS02NDAtMzg0bC0yOTkgMjk5aDI5OXYtMjk5em0xOTYgNjQ3bDMxNi0zMTZ2LTQxNmgtMzg0djQxNnEwIDQwLTI4IDY4dC02OCAyOGgtNDE2djY0MGg1MTJ2LTI1NnEwLTQwIDIwLTg4dDQ4LTc2em05NTYgODA0di0xMTUyaC0zODR2NDE2cTAgNDAtMjggNjh0LTY4IDI4aC00MTZ2NjQwaDg5NnoiLz48L3N2Zz4=',
-      description: ' - ',
-      kind: 'fileexplorer'
-    }
-  }
-
     function uploadFile (event) {
       // TODO The file explorer is merely a view on the current state of
       // the files module. Please ask the user here if they want to overwrite
@@ -317,6 +310,19 @@ function filepanel (localRegistry) {
         })
       }
     }
+  }
+
+  get profile () {
+    return {
+      name: 'fileExplorers',
+      displayName: 'file explorers',
+      methods: [],
+      events: [],
+      icon: 'data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPHN2ZyB3aWR0aD0iMTc5MiIgaGVpZ2h0PSIxNzkyIiB2aWV3Qm94PSIwIDAgMTc5MiAxNzkyIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxwYXRoIGQ9Ik0xNjk2IDM4NHE0MCAwIDY4IDI4dDI4IDY4djEyMTZxMCA0MC0yOCA2OHQtNjggMjhoLTk2MHEtNDAgMC02OC0yOHQtMjgtNjh2LTI4OGgtNTQ0cS00MCAwLTY4LTI4dC0yOC02OHYtNjcycTAtNDAgMjAtODh0NDgtNzZsNDA4LTQwOHEyOC0yOCA3Ni00OHQ4OC0yMGg0MTZxNDAgMCA2OCAyOHQyOCA2OHYzMjhxNjgtNDAgMTI4LTQwaDQxNnptLTU0NCAyMTNsLTI5OSAyOTloMjk5di0yOTl6bS02NDAtMzg0bC0yOTkgMjk5aDI5OXYtMjk5em0xOTYgNjQ3bDMxNi0zMTZ2LTQxNmgtMzg0djQxNnEwIDQwLTI4IDY4dC02OCAyOGgtNDE2djY0MGg1MTJ2LTI1NnEwLTQwIDIwLTg4dDQ4LTc2em05NTYgODA0di0xMTUyaC0zODR2NDE2cTAgNDAtMjggNjh0LTY4IDI4aC00MTZ2NjQwaDg5NnoiLz48L3N2Zz4=',
+      description: ' - ',
+      kind: 'fileexplorer'
+    }
+  }
 }
 
 // return all the files, except the temporary/readonly ones..
@@ -340,4 +346,3 @@ function packageFiles (filesProvider, callback) {
   })
 }
 
-module.exports = filepanel

src/app/tabs/analysis-tab.js

@@ -3,13 +3,16 @@ var StaticAnalysis = require('../staticanalysis/staticAnalysisView')
 var EventManager = require('../../lib/events')
 var css = require('./styles/analysis-tab-styles')
 
-class AnalysisTab {
+import { ApiFactory } from 'remix-plugin'
+
+class AnalysisTab extends ApiFactory {
 
   constructor (registry) {
+    super()
     this.event = new EventManager()
     this.registry = registry
   }
-  profile () {
+  get profile () {
     return {
       name: 'solidityStaticAnalysis',
       displayName: 'solidity static analysis',

src/app/tabs/compile-tab.js

@@ -17,9 +17,12 @@ var css = require('./styles/compile-tab-styles')
 const CompileTabLogic = require('./compileTab/compileTab.js')
 const CompilerContainer = require('./compileTab/compilerContainer.js')
 
-class CompileTab {
+import { ApiFactory } from 'remix-plugin'
+
+class CompileTab extends ApiFactory {
 
   constructor (registry) {
+    super()
     this.events = new EventEmitter()
     this._view = {
       el: null,
@@ -56,6 +59,18 @@ class CompileTab {
     )
   }
 
+  get profile () {
+    return {
+      displayName: 'solidity compiler',
+      name: 'solidity',
+      methods: ['getCompilationResult'],
+      events: ['compilationFinished'],
+      icon: 'data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDE2LjAuMywgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPgo8IURPQ1RZUEUgc3ZnIFBVQkxJQyAiLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4iICJodHRwOi8vd3d3LnczLm9yZy9HcmFwaGljcy9TVkcvMS4xL0RURC9zdmcxMS5kdGQiPgo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zOnNrZXRjaD0iaHR0cDovL3d3dy5ib2hlbWlhbmNvZGluZy5jb20vc2tldGNoL25zIgoJIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IiB3aWR0aD0iMTMwMHB4IiBoZWlnaHQ9IjEzMDBweCIKCSB2aWV3Qm94PSIwIDAgMTMwMCAxMzAwIiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCAxMzAwIDEzMDAiIHhtbDpzcGFjZT0icHJlc2VydmUiPgo8dGl0bGU+VmVjdG9yIDE8L3RpdGxlPgo8ZGVzYz5DcmVhdGVkIHdpdGggU2tldGNoLjwvZGVzYz4KPGcgaWQ9IlBhZ2UtMSIgc2tldGNoOnR5cGU9Ik1TUGFnZSI+Cgk8ZyBpZD0ic29saWRpdHkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDQwMi4wMDAwMDAsIDExOC4wMDAwMDApIiBza2V0Y2g6dHlwZT0iTVNMYXllckdyb3VwIj4KCQk8ZyBpZD0iR3JvdXAiIHNrZXRjaDp0eXBlPSJNU1NoYXBlR3JvdXAiPgoJCQk8cGF0aCBpZD0iU2hhcGUiIG9wYWNpdHk9IjAuNDUiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgICAgIiBkPSJNMzcxLjc3MiwxMzUuMzA4TDI0MS4wNjgsMzY3LjYxSC0yMC4xNThsMTMwLjYxNC0yMzIuMzAyCgkJCQlIMzcxLjc3MiIvPgoJCQk8cGF0aCBpZD0iU2hhcGVfMV8iIG9wYWNpdHk9IjAuNiIgZW5hYmxlLWJhY2tncm91bmQ9Im5ldyAgICAiIGQ9Ik0yNDEuMDY4LDM2Ny42MWgyNjEuMzE4TDM3MS43NzIsMTM1LjMwOEgxMTAuNDU2CgkJCQlMMjQxLjA2OCwzNjcuNjF6Ii8+CgkJCTxwYXRoIGlkPSJTaGFwZV8yXyIgb3BhY2l0eT0iMC44IiBlbmFibGUtYmFja2dyb3VuZD0ibmV3ICAgICIgZD0iTTExMC40NTYsNTk5LjgyMkwyNDEuMDY4LDM2Ny42MUwxMTAuNDU2LDEzNS4zMDgKCQkJCUwtMjAuMTU4LDM2Ny42MUwxMTAuNDU2LDU5OS44MjJ6Ii8+CgkJCTxwYXRoIGlkPSJTaGFwZV8zXyIgb3BhY2l0eT0iMC40NSIgZW5hYmxlLWJhY2tncm91bmQ9Im5ldyAgICAiIGQ9Ik0xMTEuNzIxLDk0OC4yNzVsMTMwLjcwNC0yMzIuMzAzaDI2MS4zMThMMzczLjAzOCw5NDguMjc1CgkJCQlIMTExLjcyMSIvPgoJCQk8cGF0aCBpZD0iU2hhcGVfNF8iIG9wYWNpdHk9IjAuNiIgZW5hYmxlLWJhY2tncm91bmQ9Im5ldyAgICAiIGQ9Ik0yNDIuNDI0LDcxNS45NzNILTE4Ljg5M2wxMzAuNjEzLDIzMi4zMDNoMjYxLjMxNwoJCQkJTDI0Mi40MjQsNzE1Ljk3M3oiLz4KCQkJPHBhdGggaWQ9IlNoYXBlXzVfIiBvcGFjaXR5PSIwLjgiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgICAgIiBkPSJNMzczLjAzOCw0ODMuNzYxTDI0Mi40MjQsNzE1Ljk3M2wxMzAuNjE0LDIzMi4zMDMKCQkJCWwxMzAuNzA0LTIzMi4zMDNMMzczLjAzOCw0ODMuNzYxeiIvPgoJCTwvZz4KCTwvZz4KPC9nPgo8L3N2Zz4K',
+      description: 'compile solidity contracts',
+      kind: 'compile'
+    }
+  }
+
   activate () {
     this.listenToEvents()
     this.compilerContainer.activate()
@@ -131,18 +146,6 @@ class CompileTab {
     })
   }
 
-  profile () {
-    return {
-      displayName: 'solidity compiler',
-      name: 'solidity',
-      methods: ['getCompilationResult'],
-      events: ['compilationFinished'],
-      icon: 'data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDE2LjAuMywgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPgo8IURPQ1RZUEUgc3ZnIFBVQkxJQyAiLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4iICJodHRwOi8vd3d3LnczLm9yZy9HcmFwaGljcy9TVkcvMS4xL0RURC9zdmcxMS5kdGQiPgo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zOnNrZXRjaD0iaHR0cDovL3d3dy5ib2hlbWlhbmNvZGluZy5jb20vc2tldGNoL25zIgoJIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IiB3aWR0aD0iMTMwMHB4IiBoZWlnaHQ9IjEzMDBweCIKCSB2aWV3Qm94PSIwIDAgMTMwMCAxMzAwIiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCAxMzAwIDEzMDAiIHhtbDpzcGFjZT0icHJlc2VydmUiPgo8dGl0bGU+VmVjdG9yIDE8L3RpdGxlPgo8ZGVzYz5DcmVhdGVkIHdpdGggU2tldGNoLjwvZGVzYz4KPGcgaWQ9IlBhZ2UtMSIgc2tldGNoOnR5cGU9Ik1TUGFnZSI+Cgk8ZyBpZD0ic29saWRpdHkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDQwMi4wMDAwMDAsIDExOC4wMDAwMDApIiBza2V0Y2g6dHlwZT0iTVNMYXllckdyb3VwIj4KCQk8ZyBpZD0iR3JvdXAiIHNrZXRjaDp0eXBlPSJNU1NoYXBlR3JvdXAiPgoJCQk8cGF0aCBpZD0iU2hhcGUiIG9wYWNpdHk9IjAuNDUiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgICAgIiBkPSJNMzcxLjc3MiwxMzUuMzA4TDI0MS4wNjgsMzY3LjYxSC0yMC4xNThsMTMwLjYxNC0yMzIuMzAyCgkJCQlIMzcxLjc3MiIvPgoJCQk8cGF0aCBpZD0iU2hhcGVfMV8iIG9wYWNpdHk9IjAuNiIgZW5hYmxlLWJhY2tncm91bmQ9Im5ldyAgICAiIGQ9Ik0yNDEuMDY4LDM2Ny42MWgyNjEuMzE4TDM3MS43NzIsMTM1LjMwOEgxMTAuNDU2CgkJCQlMMjQxLjA2OCwzNjcuNjF6Ii8+CgkJCTxwYXRoIGlkPSJTaGFwZV8yXyIgb3BhY2l0eT0iMC44IiBlbmFibGUtYmFja2dyb3VuZD0ibmV3ICAgICIgZD0iTTExMC40NTYsNTk5LjgyMkwyNDEuMDY4LDM2Ny42MUwxMTAuNDU2LDEzNS4zMDgKCQkJCUwtMjAuMTU4LDM2Ny42MUwxMTAuNDU2LDU5OS44MjJ6Ii8+CgkJCTxwYXRoIGlkPSJTaGFwZV8zXyIgb3BhY2l0eT0iMC40NSIgZW5hYmxlLWJhY2tncm91bmQ9Im5ldyAgICAiIGQ9Ik0xMTEuNzIxLDk0OC4yNzVsMTMwLjcwNC0yMzIuMzAzaDI2MS4zMThMMzczLjAzOCw5NDguMjc1CgkJCQlIMTExLjcyMSIvPgoJCQk8cGF0aCBpZD0iU2hhcGVfNF8iIG9wYWNpdHk9IjAuNiIgZW5hYmxlLWJhY2tncm91bmQ9Im5ldyAgICAiIGQ9Ik0yNDIuNDI0LDcxNS45NzNILTE4Ljg5M2wxMzAuNjEzLDIzMi4zMDNoMjYxLjMxNwoJCQkJTDI0Mi40MjQsNzE1Ljk3M3oiLz4KCQkJPHBhdGggaWQ9IlNoYXBlXzVfIiBvcGFjaXR5PSIwLjgiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgICAgIiBkPSJNMzczLjAzOCw0ODMuNzYxTDI0Mi40MjQsNzE1Ljk3M2wxMzAuNjE0LDIzMi4zMDMKCQkJCWwxMzAuNzA0LTIzMi4zMDNMMzczLjAzOCw0ODMuNzYxeiIvPgoJCTwvZz4KCTwvZz4KPC9nPgo8L3N2Zz4K',
-      description: 'compile solidity contracts',
-      kind: 'compile'
-    }
-  }
-
   getCompilationResult () {
     return new Promise((resolve, reject) => {
       resolve(this.compileTabLogic.compiler.lastCompilationResult)

src/app/tabs/debugger-tab.js

@@ -3,12 +3,16 @@ var css = require('./styles/debugger-tab-styles')
 
 var DebuggerUI = require('../debugger/debuggerUI')
 
-class DebuggerTab {
+import { ApiFactory } from 'remix-plugin'
+
+class DebuggerTab extends ApiFactory {
+
   constructor () {
+    super()
     this.el = null
   }
 
-  profile () {
+  get profile () {
     return {
       displayName: 'debugger',
       name: 'debugger',

src/app/tabs/run-tab.js

@@ -12,9 +12,12 @@ var ContractDropdownUI = require('./runTab/contractDropdown.js')
 var Recorder = require('./runTab/model/recorder.js')
 var RecorderUI = require('./runTab/recorder.js')
 
-class RunTab {
+import { ApiFactory } from 'remix-plugin'
+
+class RunTab extends ApiFactory {
 
   constructor (udapp, udappUI, config, fileManager, editor, logCallback, filePanel, pluginManager, compilersArtefacts) {
+    super()
     this.event = new EventManager()
 
     this.renderInstanceContainer()
@@ -25,6 +28,18 @@ class RunTab {
     this.renderContainer()
   }
 
+  get profile () {
+    return {
+      name: 'run',
+      displayName: 'run transactions',
+      methods: [],
+      events: [],
+      icon: 'data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPHN2ZyB3aWR0aD0iMTc5MiIgaGVpZ2h0PSIxNzkyIiB2aWV3Qm94PSIwIDAgMTc5MiAxNzkyIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxwYXRoIGQ9Ik0xNTc2IDkyN2wtMTMyOCA3MzhxLTIzIDEzLTM5LjUgM3QtMTYuNS0zNnYtMTQ3MnEwLTI2IDE2LjUtMzZ0MzkuNSAzbDEzMjggNzM4cTIzIDEzIDIzIDMxdC0yMyAzMXoiLz48L3N2Zz4=',
+      description: 'execute and save transactions',
+      kind: 'run'
+    }
+  }
+
   renderContainer () {
     this.container = yo`<div class="${css.runTabView}" id="runTabView" ></div>`
 
@@ -147,17 +162,6 @@ class RunTab {
     return this.container
   }
 
-  profile () {
-    return {
-      name: 'run',
-      displayName: 'run transactions',
-      methods: [],
-      events: [],
-      icon: 'data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPHN2ZyB3aWR0aD0iMTc5MiIgaGVpZ2h0PSIxNzkyIiB2aWV3Qm94PSIwIDAgMTc5MiAxNzkyIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxwYXRoIGQ9Ik0xNTc2IDkyN2wtMTMyOCA3MzhxLTIzIDEzLTM5LjUgM3QtMTYuNS0zNnYtMTQ3MnEwLTI2IDE2LjUtMzZ0MzkuNSAzbDEzMjggNzM4cTIzIDEzIDIzIDMxdC0yMyAzMXoiLz48L3N2Zz4=',
-      description: 'execute and save transactions',
-      kind: 'run'
-    }
-  }
 }
 
 module.exports = RunTab

src/app/tabs/settings-tab.js

@@ -9,8 +9,11 @@ var styleGuide = require('../ui/styles-guide/theme-chooser')
 var Storage = remixLib.Storage
 var EventManager = require('../../lib/events')
 
-module.exports = class SettingsTab {
+import { ApiFactory } from 'remix-plugin'
+
+module.exports = class SettingsTab extends ApiFactory {
   constructor (localRegistry) {
+    super()
     const self = this
     self._components = {}
     self._components.registry = localRegistry || globalRegistry
@@ -37,7 +40,7 @@ module.exports = class SettingsTab {
     self._components.themeStorage = new Storage('style:')
     self.data.currentTheme = self._components.themeStorage.get('theme') || 'light'
   }
-  profile () {
+  get profile () {
     return {
       displayName: 'settings',
       name: 'settings',
@@ -45,7 +48,8 @@ module.exports = class SettingsTab {
       events: [],
       icon: 'data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPHN2ZyB3aWR0aD0iMTc5MiIgaGVpZ2h0PSIxNzkyIiB2aWV3Qm94PSIwIDAgMTc5MiAxNzkyIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxwYXRoIGQ9Ik0xMTUyIDg5NnEwLTEwNi03NS0xODF0LTE4MS03NS0xODEgNzUtNzUgMTgxIDc1IDE4MSAxODEgNzUgMTgxLTc1IDc1LTE4MXptNTEyLTEwOXYyMjJxMCAxMi04IDIzdC0yMCAxM2wtMTg1IDI4cS0xOSA1NC0zOSA5MSAzNSA1MCAxMDcgMTM4IDEwIDEyIDEwIDI1dC05IDIzcS0yNyAzNy05OSAxMDh0LTk0IDcxcS0xMiAwLTI2LTlsLTEzOC0xMDhxLTQ0IDIzLTkxIDM4LTE2IDEzNi0yOSAxODYtNyAyOC0zNiAyOGgtMjIycS0xNCAwLTI0LjUtOC41dC0xMS41LTIxLjVsLTI4LTE4NHEtNDktMTYtOTAtMzdsLTE0MSAxMDdxLTEwIDktMjUgOS0xNCAwLTI1LTExLTEyNi0xMTQtMTY1LTE2OC03LTEwLTctMjMgMC0xMiA4LTIzIDE1LTIxIDUxLTY2LjV0NTQtNzAuNXEtMjctNTAtNDEtOTlsLTE4My0yN3EtMTMtMi0yMS0xMi41dC04LTIzLjV2LTIyMnEwLTEyIDgtMjN0MTktMTNsMTg2LTI4cTE0LTQ2IDM5LTkyLTQwLTU3LTEwNy0xMzgtMTAtMTItMTAtMjQgMC0xMCA5LTIzIDI2LTM2IDk4LjUtMTA3LjV0OTQuNS03MS41cTEzIDAgMjYgMTBsMTM4IDEwN3E0NC0yMyA5MS0zOCAxNi0xMzYgMjktMTg2IDctMjggMzYtMjhoMjIycTE0IDAgMjQuNSA4LjV0MTEuNSAyMS41bDI4IDE4NHE0OSAxNiA5MCAzN2wxNDItMTA3cTktOSAyNC05IDEzIDAgMjUgMTAgMTI5IDExOSAxNjUgMTcwIDcgOCA3IDIyIDAgMTItOCAyMy0xNSAyMS01MSA2Ni41dC01NCA3MC41cTI2IDUwIDQxIDk4bDE4MyAyOHExMyAyIDIxIDEyLjV0OCAyMy41eiIvPjwvc3ZnPg==',
       description: ' - ',
-      kind: 'settings'
+      kind: 'settings',
+      location: 'swapPanel',
     }
   }
   render () {

src/app/tabs/support-tab.js

 const yo = require('yo-yo')
 var css = require('./styles/support-tab-styles')
 
-class SupportTab {
+import { ApiFactory } from 'remix-plugin'
+
+class SupportTab extends ApiFactory {
 
   constructor (localRegistry) {
+    super()
     this.el = null
     this.gitterIframe = ''
     this.gitterIsLoaded = false
@@ -18,7 +21,8 @@ class SupportTab {
     this.el.style.display = 'block'
     this.gitterIsLoaded = true
   }
-  profile () {
+
+  get profile () {
     return {
       name: 'support',
       methods: [],
@@ -27,6 +31,7 @@ class SupportTab {
       description: 'help center'
     }
   }
+
   render () {
     if (this.el) return this.el
 

src/app/tabs/test-tab.js

@@ -7,8 +7,11 @@ var globalRegistry = require('../../global/registry')
 var css = require('./styles/test-tab-styles')
 var remixTests = require('remix-tests')
 
-module.exports = class TestTab {
+import { ApiFactory } from 'remix-plugin'
+
+module.exports = class TestTab extends ApiFactory {
   constructor (localRegistry, compileTab) {
+    super()
     // TODO here is a direct reference to compile tab, should be removed
     const self = this
     self.compileTab = compileTab
@@ -23,7 +26,8 @@ module.exports = class TestTab {
     self.data = {}
     self.testList = yo`<div class=${css.testList}></div>`
   }
-  profile () {
+
+  get profile () {
     return {
       name: 'solidityUnitTesting',
       displayName: 'solidity unit testing',
@@ -33,6 +37,7 @@ module.exports = class TestTab {
       description: ' - '
     }
   }
+
   render () {
     const self = this
     var testsOutput = yo`<div class="${css.container} border border-primary border-right-0 border-left-0 border-bottom-0" hidden='true' id="tests"></div>`

src/app/tabs/txlistener-module.js

+import { ApiFactory } from 'remix-plugin'
+import { EventEmitter } from 'events'
+
+export class TxListenerModule extends ApiFactory {
+
+  constructor (txlistener) {
+    super()
+    this.events = new EventEmitter()
+    txlistener.event.register('newTransaction', (tx) => {
+      this.events.emit('newTransaction', tx)
+    })
+  }
+
+  get profile () {
+    return {
+      name: 'txListener',
+      displayName: 'transaction listener',
+      events: ['newTransaction'],
+      description: 'service - notify new transactions'
+    }
+  }
+}

src/app/ui/landing-page/generate.js

-/* global */
-import LandingPage from './landing-page'
-import Section from './section'
-import { defaultWorkspaces } from './workspace'
-
-export function homepageProfile () {
-  return {
-    displayName: 'home',
-    name: 'home',
-    methods: [],
-    events: [],
-    description: ' - ',
-    icon: 'data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjwhRE9DVFlQRSBzdmcgIFBVQkxJQyAnLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4nICAnaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkJz48c3ZnIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDUwIDUwIiBoZWlnaHQ9IjUwcHgiIGlkPSJMYXllcl8xIiB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCA1MCA1MCIgd2lkdGg9IjUwcHgiIHhtbDpzcGFjZT0icHJlc2VydmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPjxyZWN0IGZpbGw9Im5vbmUiIGhlaWdodD0iNTAiIHdpZHRoPSI1MCIvPjxnPjxwYXRoIGQ9IiAgIE0yNSwxQzExLjc0NSwxLDEsMTEuNzQ1LDEsMjVzMTAuNzQ1LDI0LDI0LDI0czI0LTEwLjc0NSwyNC0yNFMzOC4yNTUsMSwyNSwxTDI1LDF6IiBmaWxsPSJub25lIiBzdHJva2U9IiMwMDAwMDAiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLW1pdGVybGltaXQ9IjEwIiBzdHJva2Utd2lkdGg9IjIiLz48L2c+PHBhdGggZD0iICBNNDAuNjk2LDYuODMyYzAsMC0xMy4xNjksOC4yMTItMTEuNTMyLDIyLjMzMmMxLjE0Miw5Ljg1OCwxMS45MzUsMTMuMzc3LDExLjkzNSwxMy4zNzciIGZpbGw9Im5vbmUiIHN0cm9rZT0iIzAwMDAwMCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHN0cm9rZS13aWR0aD0iMi4wNTgzIi8+PHBhdGggZD0iICBNNy4zODUsOC45MTNjMCwwLDMuMDQxLDYuNDc2LDMuMDQxLDE4LjE2OWMwLDkuMjQ2LTMuNTgzLDEyLjkxMS0zLjU4MywxMi45MTEiIGZpbGw9Im5vbmUiIHN0cm9rZT0iIzAwMDAwMCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHN0cm9rZS13aWR0aD0iMi4wNTgzIi8+PHBhdGggZD0iICBNMS44NTIsMjIuOTMyYzAsMCw2LjQ5Myw2LjIzMiwyMy4xNDgsNi4yMzJzMjMuNDM4LTYuMjQ2LDIzLjQzOC02LjI0NiIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwMDAwIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS1taXRlcmxpbWl0PSIxMCIgc3Ryb2tlLXdpZHRoPSIyLjA1ODMiLz48cGF0aCBkPSIgIE0yNS42NDgsMS41NDhjMCwwLTYuODk1LDcuOTM1LTYuODk1LDIzLjQ1MkMxOC43NTQsNDAuNTE4LDI1LDQ4LjYyNSwyNSw0OC42MjUiIGZpbGw9Im5vbmUiIHN0cm9rZT0iIzAwMDAwMCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHN0cm9rZS13aWR0aD0iMi4wNTgzIi8+PC9zdmc+',
-    prefferedLocation: 'mainPanel'
-  }
-}
-
-export function generateHomePage (appManager, appStore) {
-  /*
-  var actions1 = [
-    {label: 'new file', type: `callback`, payload: () => { alert(`-new file created-`) }},
-    {label: 'import from GitHub', type: `callback`, payload: () => { alert(`-imported from GitHub-`) }},
-    {label: 'import from gist', type: `callback`, payload: () => { alert(`-imported from gist-`) }}
-  ]
-
-  var actions2 = [
-    {label: '...', type: `callback`, payload: () => { alert(`-...-`) }}
-  ]
-
-  var actions3 = [
-    {label: 'Remix documentation', type: `link`, payload: `https://remix.readthedocs.io/en/latest/#`},
-    {label: 'GitHub repository', type: `link`, payload: `https://github.com/ethereum/remix-ide`},
-    {label: 'acces local file system (remixd)', type: `link`, payload: `https://remix.readthedocs.io/en/latest/tutorial_remixd_filesystem.html`},
-    {label: 'npm module for remixd', type: `link`, payload: `https://www.npmjs.com/package/remixd`},
-    {label: 'medium posts', type: `link`, payload: `https://medium.com/remix-ide`},
-    {label: 'tutorials', type: `link`, payload: `https://github.com/ethereum/remix-workshops`}
-  ]
-
-  var actions4 = [
-    {label: 'Remix plugins & modules', type: `link`, payload: `https://github.com/ethereum/remix-plugin/blob/master/readme.md`},
-    {label: 'repository on GitHub', type: `link`, payload: `https://github.com/ethereum/remix-plugin`},
-    {label: 'examples', type: `link`, payload: `https://github.com/ethereum/remix-plugin/tree/master/examples`},
-    {label: 'build plugin for Remix', type: `link`, payload: `https://medium.com/remix-ide/build-a-plugin-for-remix-90d43b209c5a`}
-  ]
-
-  var actions5 = [
-    {label: 'Gitter channel', type: `link`, payload: `https://gitter.im/ethereum/remix`},
-    {label: 'Stack Overflow', type: `link`, payload: `https://stackoverflow.com/questions/tagged/remix`},
-    {label: 'Reddit', type: `link`, payload: `https://www.reddit.com/r/ethdev/search?q=remix&restrict_sr=1`}
-  ]
-
-  var section1 = new Section('Start', actions1)
-  var section2 = new Section('Recent', actions2)
-  var section3 = new Section('Learn', actions3)
-  var section4 = new Section('Plugins', actions4)
-  var section5 = new Section('Help', actions5)
-  */
-
-  var sectionsWorkspaces = []
-  sectionsWorkspaces.push({
-    label: 'Close All Modules',
-    type: 'callback',
-    payload: () => {
-      appStore.getActives()
-      .filter(({profile}) => !profile.required)
-      .forEach((profile) => { appManager.deactivateOne(profile.name) })
-    }})
-  defaultWorkspaces(appManager).forEach((workspace) => {
-    sectionsWorkspaces.push({label: workspace.title, type: 'callback', payload: () => { workspace.activate() }})
-  })
-  var sectionWorkspace = new Section('Workspaces', sectionsWorkspaces)
-  return new LandingPage([sectionWorkspace])
-}

src/app/ui/landing-page/landing-page.js

@@ -27,9 +27,79 @@ var css = csjs`
   }
 `
 
-class LandingPage {
-  constructor (sections) {
-    this.sections = sections
+import { defaultWorkspaces } from './workspace'
+import { ApiFactory } from 'remix-plugin'
+import Section from './section'
+
+export class LandingPage extends ApiFactory {
+
+  constructor (appManager, appStore) {
+    super()
+    /*
+    var actions1 = [
+      {label: 'new file', type: `callback`, payload: () => { alert(`-new file created-`) }},
+      {label: 'import from GitHub', type: `callback`, payload: () => { alert(`-imported from GitHub-`) }},
+      {label: 'import from gist', type: `callback`, payload: () => { alert(`-imported from gist-`) }}
+    ]
+
+    var actions2 = [
+      {label: '...', type: `callback`, payload: () => { alert(`-...-`) }}
+    ]
+
+    var actions3 = [
+      {label: 'Remix documentation', type: `link`, payload: `https://remix.readthedocs.io/en/latest/#`},
+      {label: 'GitHub repository', type: `link`, payload: `https://github.com/ethereum/remix-ide`},
+      {label: 'acces local file system (remixd)', type: `link`, payload: `https://remix.readthedocs.io/en/latest/tutorial_remixd_filesystem.html`},
+      {label: 'npm module for remixd', type: `link`, payload: `https://www.npmjs.com/package/remixd`},
+      {label: 'medium posts', type: `link`, payload: `https://medium.com/remix-ide`},
+      {label: 'tutorials', type: `link`, payload: `https://github.com/ethereum/remix-workshops`}
+    ]
+
+    var actions4 = [
+      {label: 'Remix plugins & modules', type: `link`, payload: `https://github.com/ethereum/remix-plugin/blob/master/readme.md`},
+      {label: 'repository on GitHub', type: `link`, payload: `https://github.com/ethereum/remix-plugin`},
+      {label: 'examples', type: `link`, payload: `https://github.com/ethereum/remix-plugin/tree/master/examples`},
+      {label: 'build plugin for Remix', type: `link`, payload: `https://medium.com/remix-ide/build-a-plugin-for-remix-90d43b209c5a`}
+    ]
+
+    var actions5 = [
+      {label: 'Gitter channel', type: `link`, payload: `https://gitter.im/ethereum/remix`},
+      {label: 'Stack Overflow', type: `link`, payload: `https://stackoverflow.com/questions/tagged/remix`},
+      {label: 'Reddit', type: `link`, payload: `https://www.reddit.com/r/ethdev/search?q=remix&restrict_sr=1`}
+    ]
+
+    var section1 = new Section('Start', actions1)
+    var section2 = new Section('Recent', actions2)
+    var section3 = new Section('Learn', actions3)
+    var section4 = new Section('Plugins', actions4)
+    var section5 = new Section('Help', actions5)
+    */
+    const sectionsWorkspaces = []
+    sectionsWorkspaces.push({
+      label: 'Close All Modules',
+      type: 'callback',
+      payload: () => {
+        appStore.getActives()
+        .filter(({profile}) => !profile.required)
+        .forEach((profile) => { appManager.deactivateOne(profile.name) })
+      }})
+    defaultWorkspaces(appManager).forEach((workspace) => {
+      sectionsWorkspaces.push({label: workspace.title, type: 'callback', payload: () => { workspace.activate() }})
+    })
+    const sectionWorkspace = new Section('Workspaces', sectionsWorkspaces)
+    this.sections = sectionWorkspace
+  }
+
+  get profile () {
+    return {
+      displayName: 'home',
+      name: 'home',
+      methods: [],
+      events: [],
+      description: ' - ',
+      icon: 'data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjwhRE9DVFlQRSBzdmcgIFBVQkxJQyAnLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4nICAnaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkJz48c3ZnIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDUwIDUwIiBoZWlnaHQ9IjUwcHgiIGlkPSJMYXllcl8xIiB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCA1MCA1MCIgd2lkdGg9IjUwcHgiIHhtbDpzcGFjZT0icHJlc2VydmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPjxyZWN0IGZpbGw9Im5vbmUiIGhlaWdodD0iNTAiIHdpZHRoPSI1MCIvPjxnPjxwYXRoIGQ9IiAgIE0yNSwxQzExLjc0NSwxLDEsMTEuNzQ1LDEsMjVzMTAuNzQ1LDI0LDI0LDI0czI0LTEwLjc0NSwyNC0yNFMzOC4yNTUsMSwyNSwxTDI1LDF6IiBmaWxsPSJub25lIiBzdHJva2U9IiMwMDAwMDAiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLW1pdGVybGltaXQ9IjEwIiBzdHJva2Utd2lkdGg9IjIiLz48L2c+PHBhdGggZD0iICBNNDAuNjk2LDYuODMyYzAsMC0xMy4xNjksOC4yMTItMTEuNTMyLDIyLjMzMmMxLjE0Miw5Ljg1OCwxMS45MzUsMTMuMzc3LDExLjkzNSwxMy4zNzciIGZpbGw9Im5vbmUiIHN0cm9rZT0iIzAwMDAwMCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHN0cm9rZS13aWR0aD0iMi4wNTgzIi8+PHBhdGggZD0iICBNNy4zODUsOC45MTNjMCwwLDMuMDQxLDYuNDc2LDMuMDQxLDE4LjE2OWMwLDkuMjQ2LTMuNTgzLDEyLjkxMS0zLjU4MywxMi45MTEiIGZpbGw9Im5vbmUiIHN0cm9rZT0iIzAwMDAwMCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHN0cm9rZS13aWR0aD0iMi4wNTgzIi8+PHBhdGggZD0iICBNMS44NTIsMjIuOTMyYzAsMCw2LjQ5Myw2LjIzMiwyMy4xNDgsNi4yMzJzMjMuNDM4LTYuMjQ2LDIzLjQzOC02LjI0NiIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwMDAwIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS1taXRlcmxpbWl0PSIxMCIgc3Ryb2tlLXdpZHRoPSIyLjA1ODMiLz48cGF0aCBkPSIgIE0yNS42NDgsMS41NDhjMCwwLTYuODk1LDcuOTM1LTYuODk1LDIzLjQ1MkMxOC43NTQsNDAuNTE4LDI1LDQ4LjYyNSwyNSw0OC42MjUiIGZpbGw9Im5vbmUiIHN0cm9rZT0iIzAwMDAwMCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHN0cm9rZS13aWR0aD0iMi4wNTgzIi8+PC9zdmc+',
+      location: 'mainPanel'
+    }
   }
 
   render () {
@@ -48,5 +118,3 @@ class LandingPage {
     return totalLook
   }
 }
-
-module.exports = LandingPage