diff --git a/package.json b/package.json index 31624ddaa8..c7fbb313fc 100644 --- a/package.json +++ b/package.json @@ -38,9 +38,10 @@ "npm-link-local": "^1.1.0", "npm-run-all": "^4.0.2", "onchange": "^3.2.1", - "remix-debug": "0.3.1", "remix-analyzer": "0.3.1", + "remix-debug": "0.3.1", "remix-lib": "0.4.1", + "remix-plugin": "0.0.1-alpha.2", "remix-solidity": "0.3.1", "remix-tests": "0.1.1", "remixd": "0.1.8-alpha.6", diff --git a/src/app.js b/src/app.js index de86c484a9..88ce6c1211 100644 --- a/src/app.js +++ b/src/app.js @@ -22,9 +22,7 @@ var SharedFolder = require('./app/files/shared-folder') var Config = require('./config') var Renderer = require('./app/ui/renderer') var executionContext = require('./execution-context') -var FilePanel = require('./app/panels/file-panel') var EditorPanel = require('./app/panels/editor-panel') -var RighthandPanel = require('./app/panels/righthand-panel') var examples = require('./app/editor/example-contracts') var modalDialogCustom = require('./app/ui/modal-dialog-custom') var TxLogger = require('./app/execution/txLogger') @@ -36,27 +34,16 @@ var NotPersistedExplorer = require('./app/files/NotPersistedExplorer') var toolTip = require('./app/ui/tooltip') var TransactionReceiptResolver = require('./transactionReceiptResolver') -const CompilerAbstract = require('./app/compiler/compiler-abstract') -// const PluginManager = require('./app/plugin/pluginManager') - -// var IconPanel = require('./app/panels/left-icon-panel') +const PluginManagerComponent = require('./app/components/plugin-manager-component') +const PluginManagerApi = require('./app/components/plugin-manager-api') const VerticalIconsComponent = require('./app/components/vertical-icons-component') const VerticalIconsApi = require('./app/components/vertical-icons-api') -// var VerticalIconsProfile = require('./app/panels/vertical-icons-profile') - -const SwapPanelComponent = require('./app/component/swap-panel-component') -const SwapPanelComponent = require('./app/component/swap-panel-api') -const CompileTab = require('./app/tabs/compile-tab') -const SettingsTab = require('./app/tabs/settings-tab') -const AnalysisTab = require('./app/tabs/analysis-tab') -const DebuggerTab = require('./app/tabs/debugger-tab') -const SupportTab = require('./app/tabs/support-tab') -const TestTab = require('./app/tabs/test-tab') -const RunTab = require('./app/tabs/run-tab') +const SwapPanelComponent = require('./app/components/swap-panel-component') +const SwapPanelApi = require('./app/components/swap-panel-api') -const appManager = require('remix-plugin').appManager +const AppManager = require('remix-plugin').AppManager var styleGuide = require('./app/ui/styles-guide/theme-chooser') var styles = styleGuide.chooser() @@ -81,16 +68,18 @@ var css = csjs` height : 100vh; overflow : hidden; } - .centerpanel { + .mainpanel { background-color : ${styles.colors.transparent}; display : flex; flex-direction : column; position : absolute; top : 0; bottom : 0; + left : 450px; overflow : hidden; + width : 800px; } - .leftpanel { + .iconpanel { background-color : ${styles.leftPanel.backgroundColor_Panel}; display : flex; flex-direction : column; @@ -99,16 +88,17 @@ var css = csjs` bottom : 0; left : 0; overflow : hidden; + width : 50px; } - .rightpanel { - background-color : ${styles.rightPanel.backgroundColor_Panel}; + .swappanel { display : flex; flex-direction : column; position : absolute; top : 0; - right : 0; + left : 50px; bottom : 0; overflow : hidden; + width : 400px; } .highlightcode { position:absolute; @@ -176,18 +166,18 @@ class App { self.data = { _layout: { right: { - offset: self._components.config.get('right-offset') || 400, + offset: 400, show: true }, // @TODO: adapt sizes proportionally to browser window size left: { - offset: self._components.config.get('left-offset') || 200, + offset: 200, show: true } } } } _adjustLayout (direction, delta) { - var self = this + /*var self = this var layout = self.data._layout[direction] if (layout) { if (delta === undefined) { @@ -203,10 +193,11 @@ class App { self._view.swappanel.style.width = delta + 'px' self._view.mainpanel.style.left = delta + 'px' } - // if (direction === 'right') { - // self._view.mainpanel.style.width = delta + 'px' - // self._view.swappanel.style.right = delta + 'px' - // } + if (direction === 'right') { + self._view.mainpanel.style.width = delta + 'px' + self._view.swappanel.style.right = delta + 'px' + } + */ } init () { var self = this @@ -218,7 +209,7 @@ class App { if (self._view.el) return self._view.el // not resizable self._view.iconpanel = yo` -
+
${''}
` @@ -232,7 +223,7 @@ class App { // handle the editor + terminal self._view.mainpanel = yo` -
+
${''}
` @@ -245,7 +236,7 @@ class App {
` // INIT - self._adjustLayout('left', self.data._layout.left.offset) + // self._adjustLayout('left', self.data._layout.left.offset) // self._adjustLayout('right', self.data._layout.right.offset) return self._view.el } @@ -353,7 +344,7 @@ Please make a backup of your contracts and start using http://remix.ethereum.org resolveReceipt: function (tx, cb) { transactionReceiptResolver.resolve(tx, cb) } - } + }, event: { udapp: udapp.event }}) @@ -381,103 +372,43 @@ Please make a backup of your contracts and start using http://remix.ethereum.org var fileManager = self._components.fileManager registry.put({api: fileManager, name: 'filemanager'}) - // ----------------- app manager ---------------------------- - const VerticalIconsProfile = { - type: 'verticalIcons', - methods: ['addIcon', 'removeIcon'], - } + // ----------------- Renderer ----------------- + var renderer = new Renderer() + registry.put({api: renderer, name: 'renderer'}) - const SwapPanelProfile = { - type: 'swapPanel', - methods: ['addView', 'showContent'], - } - + // ----------------- app manager ---------------------------- const PluginManagerProfile = { type: 'pluginManager', - methods: [], - } - - const FileManagerProfile = { - type: 'fileManager', - methods: [], - } - - const SettingsProfile = { - type: 'settings', - methods: [], + methods: [] } - const appManager = new appManager() + const appManager = new AppManager({modules: [],plugins : []}) const swapPanelComponent = new SwapPanelComponent() - const pluginManagerComponent = new PluginManagerComponent(appManager) - const verticalIconComponent = new VerticalIconsComponent(appManager) - - const swapPanelApi = new SwapPanelApi(swapPanelComponent) - const verticalIconApi = new VerticalsIconApi(verticalIconComponent) - const pluginManagerAPI = new pluginManagerAPI(pluginManagerComponent) - - // All Plugins and Modules are registered in the contructor - // You cannot add module after - appManager.init({ - // Module should be activated by default - modules: [ - { json: VerticalIconsProfile, api: verticalIconApi }, - { json: SwapPanelProfile, api: swapPanelApi }, - { json: PluginManagerProfile, api: pluginManagerApi }, - { json: FileManagerProfile, api: self._components.filePanel }, - ], - // Plugins need to be activated - plugins: [], - options: { - bootstrap: 'pluginManager' - } - }) - - self._components.filePanel = new FilePanel() - registry.put({api: self._components.filePanel, name: 'filepanel'}) - swapPanelApi.addView('File', self._components.filePanel.render()) - verticalIconApi.addIcon('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjwhRE9DVFlQRSBzdmcgIFBVQkxJQyAnLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4nICAnaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkJz48c3ZnIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDUwIDUwIiBoZWlnaHQ9IjUwcHgiIGlkPSJMYXllcl8xIiB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCA1MCA1MCIgd2lkdGg9IjUwcHgiIHhtbDpzcGFjZT0icHJlc2VydmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPjxyZWN0IGZpbGw9Im5vbmUiIGhlaWdodD0iNTAiIHdpZHRoPSI1MCIvPjxwYXRoIGQ9Ik00NiwxNXYtNCAgYzAtMS4xMDQtMC44OTYtMi0yLTJjMCwwLTI0LjY0OCwwLTI2LDBjLTEuNDY5LDAtMi40ODQtNC00LTRIM0MxLjg5Niw1LDEsNS44OTYsMSw3djR2Mjl2NGMwLDEuMTA0LDAuODk2LDIsMiwyaDM5ICBjMS4xMDQsMCwyLTAuODk2LDItMiIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwMDAwIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1taXRlcmxpbWl0PSIxMCIgc3Ryb2tlLXdpZHRoPSIyIi8+PHBhdGggZD0iTTEsNDRsNS0yNyAgYzAtMS4xMDQsMC44OTYtMiwyLTJoMzljMS4xMDQsMCwyLDAuODk2LDIsMmwtNSwyNyIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwMDAwIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1taXRlcmxpbWl0PSIxMCIgc3Ryb2tlLXdpZHRoPSIyIi8+PC9zdmc+') - - const compileTab = new CompileTab(self._components.registry) - swapPanelApi.addView('Compile', compileTab.render()) - verticalIconApi.addIcon('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjwhRE9DVFlQRSBzdmcgIFBVQkxJQyAnLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4nICAnaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkJz48c3ZnIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDUwIDUwIiBoZWlnaHQ9IjUwcHgiIGlkPSJMYXllcl8xIiB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCA1MCA1MCIgd2lkdGg9IjUwcHgiIHhtbDpzcGFjZT0icHJlc2VydmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPjxyZWN0IGZpbGw9Im5vbmUiIGhlaWdodD0iNTAiIHdpZHRoPSI1MCIvPjxjaXJjbGUgY3g9IjI1IiBjeT0iMjUiIGZpbGw9Im5vbmUiIHI9IjI0IiBzdHJva2U9IiMwMDAwMDAiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLW1pdGVybGltaXQ9IjEwIiBzdHJva2Utd2lkdGg9IjIiLz48ZWxsaXBzZSBjeD0iMjUiIGN5PSIyNSIgZmlsbD0ibm9uZSIgcng9IjEyIiByeT0iMjQiIHN0cm9rZT0iIzAwMDAwMCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHN0cm9rZS13aWR0aD0iMiIvPjxwYXRoIGQ9Ik02LjM2NSw0MC40MzhDMTAuNzY2LDM3LjcyOSwxNy40NzksMzYsMjUsMzYgIGM3LjQxOCwwLDE0LjA0OSwxLjY4MiwxOC40NTEsNC4zMjUiIGZpbGw9Im5vbmUiIHN0cm9rZT0iIzAwMDAwMCIgc3Ryb2tlLW1pdGVybGltaXQ9IjEwIiBzdHJva2Utd2lkdGg9IjIiLz48cGF0aCBkPSJNNDMuNjM1LDkuNTYzQzM5LjIzNCwxMi4yNzEsMzIuNTIxLDE0LDI1LDE0ICBjLTcuNDE3LDAtMTQuMDQ5LTEuNjgyLTE4LjQ1MS00LjMyNSIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwMDAwIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHN0cm9rZS13aWR0aD0iMiIvPjxsaW5lIGZpbGw9Im5vbmUiIHN0cm9rZT0iIzAwMDAwMCIgc3Ryb2tlLW1pdGVybGltaXQ9IjEwIiBzdHJva2Utd2lkdGg9IjIiIHgxPSIxIiB4Mj0iNDkiIHkxPSIyNSIgeTI9IjI1Ii8+PGxpbmUgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwMDAwIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHN0cm9rZS13aWR0aD0iMiIgeDE9IjI1IiB4Mj0iMjUiIHkxPSIxIiB5Mj0iNDkiLz48L3N2Zz4=') - - const testTab = new TestTab(self._components.registry, compileTab) - swapPanelApi.addView('Test', testTab.render()) - verticalIconApi.addIcon('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjwhRE9DVFlQRSBzdmcgIFBVQkxJQyAnLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4nICAnaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkJz48c3ZnIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDUwIDUwIiBoZWlnaHQ9IjUwcHgiIGlkPSJMYXllcl8xIiB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCA1MCA1MCIgd2lkdGg9IjUwcHgiIHhtbDpzcGFjZT0icHJlc2VydmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPjxjaXJjbGUgY3g9IjI1IiBjeT0iMjUiIGZpbGw9Im5vbmUiIHI9IjI0IiBzdHJva2U9IiMwMDAwMDAiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLW1pdGVybGltaXQ9IjEwIiBzdHJva2Utd2lkdGg9IjIiLz48cmVjdCBmaWxsPSJub25lIiBoZWlnaHQ9IjUwIiB3aWR0aD0iNTAiLz48Zz48cGF0aCBkPSJNMjMuNTMzLDMwLjQwN3YtMS40N2MwLTEuNDM2LDAuMzIyLTIuMTg4LDEuMDc1LTMuMjI5bDIuNDA0LTMuM2MxLjI1NC0xLjcyMSwxLjY4NC0yLjU0NiwxLjY4NC0zLjc2NiAgIGMwLTIuMDQ0LTEuNDM0LTMuMzM1LTMuNDc5LTMuMzM1Yy0yLjAwOCwwLTMuMjk5LDEuMjE5LTMuNzI5LDMuNDA3Yy0wLjAzNiwwLjIxNS0wLjE3OSwwLjMyMy0wLjM5NSwwLjI4N2wtMi4yNTktMC4zOTUgICBjLTAuMjE2LTAuMDM2LTAuMzIzLTAuMTc5LTAuMjg4LTAuMzk1YzAuNTM5LTMuNDQzLDMuMDE0LTUuNzAzLDYuNzQ0LTUuNzAzYzMuODcyLDAsNi40OSwyLjU0Niw2LjQ5LDYuMDk3ICAgYzAsMS43MjItMC42MDgsMi45NzctMS44MjgsNC42NjNsLTIuNDAzLDMuM2MtMC43MTcsMC45NjgtMC45MzMsMS40Ny0wLjkzMywyLjY4OXYxLjE0N2MwLDAuMjE1LTAuMTQzLDAuMzU4LTAuMzU4LDAuMzU4aC0yLjM2NyAgIEMyMy42NzYsMzAuNzY2LDIzLjUzMywzMC42MjIsMjMuNTMzLDMwLjQwN3ogTTIzLjM1NCwzMy44NTFjMC0wLjIxNSwwLjE0My0wLjM1OCwwLjM1OS0wLjM1OGgyLjcyNiAgIGMwLjIxNSwwLDAuMzU4LDAuMTQ0LDAuMzU4LDAuMzU4djMuMDg0YzAsMC4yMTYtMC4xNDQsMC4zNTgtMC4zNTgsMC4zNThoLTIuNzI2Yy0wLjIxNywwLTAuMzU5LTAuMTQzLTAuMzU5LTAuMzU4VjMzLjg1MXoiLz48L2c+PC9zdmc+') - - const runTab = new RunTab(self._components.registry) - swapPanelApi.addView('Run', runTab.render()) - verticalIconApi.addIcon('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjwhRE9DVFlQRSBzdmcgIFBVQkxJQyAnLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4nICAnaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkJz48c3ZnIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDUwIDUwIiBoZWlnaHQ9IjUwcHgiIGlkPSJMYXllcl8xIiB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCA1MCA1MCIgd2lkdGg9IjUwcHgiIHhtbDpzcGFjZT0icHJlc2VydmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPjxyZWN0IGZpbGw9Im5vbmUiIGhlaWdodD0iNTAiIHdpZHRoPSI1MCIvPjxwYXRoIGQ9Ik0zMC45MzMsMzIuNTI4Yy0wLjE0Ni0xLjYxMi0wLjA5LTIuNzM3LTAuMDktNC4yMWMwLjczLTAuMzgzLDIuMDM4LTIuODI1LDIuMjU5LTQuODg4YzAuNTc0LTAuMDQ3LDEuNDc5LTAuNjA3LDEuNzQ0LTIuODE4ICBjMC4xNDMtMS4xODctMC40MjUtMS44NTUtMC43NzEtMi4wNjVjMC45MzQtMi44MDksMi44NzQtMTEuNDk5LTMuNTg4LTEyLjM5N2MtMC42NjUtMS4xNjgtMi4zNjgtMS43NTktNC41ODEtMS43NTkgIGMtOC44NTQsMC4xNjMtOS45MjIsNi42ODYtNy45ODEsMTQuMTU2Yy0wLjM0NSwwLjIxLTAuOTEzLDAuODc4LTAuNzcxLDIuMDY1YzAuMjY2LDIuMjExLDEuMTcsMi43NzEsMS43NDQsMi44MTggIGMwLjIyLDIuMDYyLDEuNTgsNC41MDUsMi4zMTIsNC44ODhjMCwxLjQ3MywwLjA1NSwyLjU5OC0wLjA5MSw0LjIxQzE5LjM2NywzNy4yMzgsNy41NDYsMzUuOTE2LDcsNDVoMzggIEM0NC40NTUsMzUuOTE2LDMyLjY4NSwzNy4yMzgsMzAuOTMzLDMyLjUyOHoiLz48L3N2Zz4=') - - const analysisTab = new AnalysisTab(self._components.registry) - swapPanelApi.addView('Analysis', analysisTab.render()) - verticalIconApi.addIcon('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjwhRE9DVFlQRSBzdmcgIFBVQkxJQyAnLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4nICAnaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkJz48c3ZnIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDUwIDUwIiBoZWlnaHQ9IjUwcHgiIGlkPSJMYXllcl8xIiB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCA1MCA1MCIgd2lkdGg9IjUwcHgiIHhtbDpzcGFjZT0icHJlc2VydmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPjxyZWN0IGZpbGw9Im5vbmUiIGhlaWdodD0iNTAiIHdpZHRoPSI1MCIvPjxwb2x5Z29uIGZpbGw9Im5vbmUiIHBvaW50cz0iNDksMTQgMzYsMjEgMzYsMjkgICA0OSwzNiAiIHN0cm9rZT0iIzAwMDAwMCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHN0cm9rZS13aWR0aD0iMiIvPjxwYXRoIGQ9Ik0zNiwzNmMwLDIuMjA5LTEuNzkxLDQtNCw0ICBINWMtMi4yMDksMC00LTEuNzkxLTQtNFYxNGMwLTIuMjA5LDEuNzkxLTQsNC00aDI3YzIuMjA5LDAsNCwxLjc5MSw0LDRWMzZ6IiBmaWxsPSJub25lIiBzdHJva2U9IiMwMDAwMDAiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLW1pdGVybGltaXQ9IjEwIiBzdHJva2Utd2lkdGg9IjIiLz48L3N2Zz4=') - - const debuggerTab = new DebuggerTab(self._components.registry) - swapPanelApi.addView('Debugger', debuggerTab.render()) - verticalIconApi.addIcon('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjwhRE9DVFlQRSBzdmcgIFBVQkxJQyAnLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4nICAnaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkJz48c3ZnIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDUwIDUwIiBoZWlnaHQ9IjUwcHgiIGlkPSJMYXllcl8xIiB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCA1MCA1MCIgd2lkdGg9IjUwcHgiIHhtbDpzcGFjZT0icHJlc2VydmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPjxwb2x5bGluZSBmaWxsPSJub25lIiBwb2ludHM9IjIwLDIzIDIsMjMgMiwxNCAgIDQ4LDE0IDQ4LDIzIDMwLDIzICIgc3Ryb2tlPSIjMDAwMDAwIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1taXRlcmxpbWl0PSIxMCIgc3Ryb2tlLXdpZHRoPSIyIi8+PHJlY3QgZmlsbD0ibm9uZSIgaGVpZ2h0PSIzNCIgc3Ryb2tlPSIjMDAwMDAwIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1taXRlcmxpbWl0PSIxMCIgc3Ryb2tlLXdpZHRoPSIyIiB3aWR0aD0iMTAiIHg9IjIwIiB5PSIxNCIvPjxyZWN0IGZpbGw9Im5vbmUiIGhlaWdodD0iNTAiIHdpZHRoPSI1MCIvPjxwYXRoIGQ9Ik0yMCwyM0g0djI1aDQyVjIzSDMwIiBmaWxsPSJub25lIiBzdHJva2U9IiMwMDAwMDAiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLW1pdGVybGltaXQ9IjEwIiBzdHJva2Utd2lkdGg9IjIiLz48cGF0aCBkPSIgIE0yNSwxM2MwLDAtMy41ODIsMC04LDBzLTktMi41ODEtOS03YzAtMS44MjgsMC44NzgtNCw0LjMxOS00QzE5LjIzNiwyLDE5LjM2MywxMywyNSwxM3oiIGZpbGw9Im5vbmUiIHN0cm9rZT0iIzAwMDAwMCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHN0cm9rZS13aWR0aD0iMiIvPjxwYXRoIGQ9IiAgTTI1LDEzYzAsMCwzLjU4MiwwLDgsMHM5LTIuNTgxLDktN2MwLTEuODI4LTAuODc4LTQtNC4zMTktNEMzMC43NjQsMiwzMC42MzcsMTMsMjUsMTN6IiBmaWxsPSJub25lIiBzdHJva2U9IiMwMDAwMDAiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLW1pdGVybGltaXQ9IjEwIiBzdHJva2Utd2lkdGg9IjIiLz48L3N2Zz4=') - - const supportTab = new SupportTab(self._components.registry) - swapPanelApi.addView('Support', supportTab.render()) - verticalIconApi.addIcon('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjwhRE9DVFlQRSBzdmcgIFBVQkxJQyAnLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4nICAnaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkJz48c3ZnIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDUwIDUwIiBoZWlnaHQ9IjUwcHgiIGlkPSJMYXllcl8xIiB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCA1MCA1MCIgd2lkdGg9IjUwcHgiIHhtbDpzcGFjZT0icHJlc2VydmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPjxyZWN0IGZpbGw9Im5vbmUiIGhlaWdodD0iNTAiIHdpZHRoPSI1MCIvPjxnPjxwYXRoIGQ9Ik0yNSwxMC4wNjIgICBjMC0zLjU5LTIuOTEzLTYuNS02LjUtNi41Yy0zLjU5MywwLTYuNSwyLjkxLTYuNSw2LjVjMCwxLjAwNywwLjIzLDEuOTU1LDAuNjQyLDIuOCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwMDAwIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHN0cm9rZS13aWR0aD0iMiIvPjwvZz48cGF0aCBkPSIgIE00NS4zNzUsMjQuMDI5aC0xLjYyN2MtMC44NDgsMC0xLjI1LTAuMzc3LTEuMzEyLTAuNzYyYy0wLjQ0My0yLjc4OS0yLjI1NS02LjQxMy02LjgwOS04LjAwM2MtMC4wNDQtMi41MjMsMC41MTktNC4zNDMsMS42MTUtNy4zMDQgIGMtMi41NDcsMC42MzktNS4zNjEsMi4wMjYtNy4wMjcsNS43Yy0xLjg3Ny0wLjQ1OS0zLjg4My0wLjcwNy01Ljk3OC0wLjcwN2MtNS40ODUsMC05LjYyMiwxLjY2NC0xMi45MzQsNC4yNDIgIGMtMi45OTEsMi4zMjktNC44Nyw2LjIyOS00LjY0NywxMS41NDljMC4xNjgsNC4wMTMsMi45NjMsNy4wNzUsNS4xMDcsOC43OWMwLjMwOSwwLjI0NCwwLjkyNSwwLjYzNSwwLjYwMywxLjYzMiAgYy0wLjMyMywwLjk5NS0wLjkwMywyLjM4NC0wLjkwMywyLjM4NGMtMC4zMzgsMC44ODYsMC4xMTEsMS44ODEsMC45OTYsMi4yMThsMy4yMTgsMS4yMTZjMC44ODYsMC4zMzgsMS44ODEtMC4xMDksMi4yMTgtMC45OTYgIGMwLDAsMC40MjgtMS4xMTUsMC43NzYtMi4wNDVjMC42NjEtMS43NDgsMS4wNjUtMC4zMyw1LjU2Ni0wLjMzYzQuNjc3LDAsNS4xNDktMC45MTIsNS42MzgsMC41MiAgYzAuMzEzLDAuOTM1LDAuNzAzLDEuODU1LDAuNzAzLDEuODU1YzAuMzM0LDAuODg3LDEuMzMsMS4zMzQsMi4yMTksMC45OTZsMy4yMTQtMS4yMTZjMC44ODgtMC4zMzcsMS4zMzgtMS4zMzIsMC45OTktMi4yMTggIGwtMC41MTYtMS4zNjVjMCwwLTAuNTI1LTAuOSwwLjYtMS41MTFjMi4yNDItMS4yMiwzLjkzMi0zLjA3MSw1LjAyOC01LjM1N2MwLjIzMy0wLjQ5LDAuNTc3LTEuMTU2LDEuNjI2LTEuMTU2aDEuNjI3ICBjMC44OTYsMCwxLjYyNS0wLjcyOSwxLjYyNS0xLjYyNHYtNC44NzlDNDcsMjQuNzYxLDQ2LjI3MSwyNC4wMjksNDUuMzc1LDI0LjAyOXoiIGZpbGw9Im5vbmUiIHN0cm9rZT0iIzAwMDAwMCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHN0cm9rZS13aWR0aD0iMiIvPjxwYXRoIGQ9Ik0zNi40OCwyNi45MjJjLTEuMDU5LDAtMS45MTYtMC44NTctMS45MTYtMS45MTRjMC0xLjA1NSwwLjg1Ny0xLjkxMiwxLjkxNi0xLjkxMmMxLjA1NiwwLDEuOTEsMC44NTcsMS45MSwxLjkxMiAgQzM4LjM5MSwyNi4wNjQsMzcuNTM2LDI2LjkyMiwzNi40OCwyNi45MjJ6Ii8+PHBhdGggZD0iICBNNi44MjYsMjMuMDk2YzAsMC0zLjgyNi0wLjg3Ni0zLjgyNi00LjMyN2MwLTEuNDE1LDAuNzE0LTIuNzE3LDEuOTYzLTMuMjU2IiBmaWxsPSJub25lIiBzdHJva2U9IiMwMDAwMDAiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLW1pdGVybGltaXQ9IjEwIiBzdHJva2Utd2lkdGg9IjIiLz48L3N2Zz4=') + const pluginManagerComponent = new PluginManagerComponent() + registry.put({api: pluginManagerComponent.proxy(), name: 'pluginmanager'}) - const settings = new SettingsTab()(self._components.registry) - swapPanelApi.addView('Settings', settingsTab.render()) - verticalIconApi.addIcon('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjwhRE9DVFlQRSBzdmcgIFBVQkxJQyAnLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4nICAnaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkJz48c3ZnIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDUwIDUwIiBoZWlnaHQ9IjUwcHgiIGlkPSJMYXllcl8xIiB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCA1MCA1MCIgd2lkdGg9IjUwcHgiIHhtbDpzcGFjZT0icHJlc2VydmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPjxyZWN0IGZpbGw9Im5vbmUiIGhlaWdodD0iNTAiIHdpZHRoPSI1MCIvPjxwYXRoIGQ9Ik00OSwyNy45NTR2LTZsLTcuMTQxLTEuMTY3ICBjLTAuNDIzLTEuNjkxLTEuMDg3LTMuMjgxLTEuOTYyLTQuNzM3bDQuMTYyLTUuOTMybC00LjI0My00LjI0MWwtNS44NTYsNC4yMWMtMS40Ni0wLjg4NC0zLjA2LTEuNTU4LTQuNzYzLTEuOTgybC0xLjI0NS03LjEwNmgtNiAgbC0xLjE1Niw3LjA4M2MtMS43MDQsMC40MTgtMy4zMTMsMS4wODMtNC43NzcsMS45NjNMMTAuMTgsNS44NzNsLTQuMjQzLDQuMjQxbDQuMTA3LDUuODc0Yy0wLjg4OCwxLjQ3LTEuNTYzLDMuMDc3LTEuOTkyLDQuNzkyICBMMSwyMS45NTR2Nmw3LjA0NCwxLjI0OWMwLjQyNSwxLjcxMSwxLjEwMSwzLjMxOCwxLjk5Miw0Ljc5bC00LjE2Myw1LjgyM2w0LjI0MSw0LjI0NWw1Ljg4MS00LjExOSAgYzEuNDY4LDAuODgyLDMuMDczLDEuNTUyLDQuNzc3LDEuOTczbDEuMTgsNy4wODdoNmwxLjI2MS03LjEwNWMxLjY5NS0wLjQzLDMuMjk3LTEuMTA1LDQuNzUxLTEuOTlsNS45MjIsNC4xNTVsNC4yNDItNC4yNDUgIGwtNC4yMjctNS44N2MwLjg3NS0xLjQ1NiwxLjUzOS0zLjA0OCwxLjk1OC00LjczOUw0OSwyNy45NTR6IE0yNSwzM2MtNC40MTgsMC04LTMuNTgyLTgtOHMzLjU4Mi04LDgtOHM4LDMuNTgyLDgsOFMyOS40MTgsMzMsMjUsMzMgIHoiIGZpbGw9Im5vbmUiIHN0cm9rZT0iIzAwMDAwMCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHN0cm9rZS13aWR0aD0iMiIvPjwvc3ZnPg==') + self._components.editorpanel.init() + self._components.fileManager.init() + + const verticalIconComponent = new VerticalIconsComponent() - self._components.iconpanel.appendChild(verticalIconComponent.render()) - self._components.iconpanel.event.register('resize', delta => self._adjustLayout('left', delta)) + const swapPanelApi = new SwapPanelApi(swapPanelComponent, verticalIconComponent, pluginManagerComponent) + const verticalIconsApi = new VerticalIconsApi(verticalIconComponent, pluginManagerComponent) + const pluginManagerAPI = new PluginManagerApi(pluginManagerComponent) - self._components.swappanel.appendChild(swapPanelComponent.render()) - self._components.swappanel.event.register('resize', delta => self._adjustLayout('center', delta)) + self._view.mainpanel.appendChild(self._components.editorpanel.render()) + self._view.iconpanel.appendChild(verticalIconComponent.render()) + self._view.swappanel.appendChild(swapPanelComponent.render()) - self._components.editorpanel.init() - self._components.fileManager.init() + pluginManagerComponent.initDefault() + verticalIconComponent.select('FilePanel') + // appManager.init(pluginManagerAPI) - self._components.editorpanel.event.register('resize', direction => self._adjustLayout(direction)) - self._view.centerpanel.appendChild(self._components.editorpanel.render()) + pluginManagerAPI.init({ + modules: [], + plugins: [] + }) // The event listener needs to be registered as early as possible, because the // parent will send the message upon the "load" event. @@ -500,10 +431,6 @@ Please make a backup of your contracts and start using http://remix.ethereum.org self.loadFiles(filesToLoad) } - // ----------------- Renderer ----------------- - var renderer = new Renderer() - registry.put({api: renderer, name: 'renderer'}) - var txLogger = new TxLogger() // eslint-disable-line var queryParams = new QueryParams() diff --git a/src/app/components/plugin-manager-api.js b/src/app/components/plugin-manager-api.js index 2007ade32a..865c0b3ce6 100644 --- a/src/app/components/plugin-manager-api.js +++ b/src/app/components/plugin-manager-api.js @@ -5,18 +5,29 @@ const remixLib = require('remix-lib') const styleguide = require('../ui/styles-guide/theme-chooser') const styles = styleguide.chooser() -const EventManager = remixLib.EventManager - class PluginManagerApi { - constructor (swapPanelComponent, pluginManagerComponent, appManager) { - this.component = swapPanelComponent - this.appManager = appManager - appManager.event.register('pluginLoaded', (item) => { - pluginManagerComponent.addItem(item) - }) - pluginManagerComponent.event.on('activation', (item) => this.event.emit('activation', item)) - pluginManagerComponent.event.on('deactivation', (item) => this.event.emit('deactivation', item)) + constructor (pluginManagerComponent) { + pluginManagerComponent.event.on('activation', (item) => this.event.emit('activation', item)) // listen by appManager + pluginManagerComponent.event.on('deactivation', (item) => this.event.emit('deactivation', item)) // listen by appManager + } + + /* + function called by appManager + */ + addItem (item) { + // add to appManager and then render + this.renderItem(item) + } + + init (data) { + for (var m in data.modules) { + this.renderItem(item) + } + + for (var m in data.plugins) { + this.renderItem(item) + } } } -module.exports = SwapPanelApi +module.exports = PluginManagerApi diff --git a/src/app/components/plugin-manager-component.js b/src/app/components/plugin-manager-component.js index 37af829745..08ede7bc40 100644 --- a/src/app/components/plugin-manager-component.js +++ b/src/app/components/plugin-manager-component.js @@ -1,53 +1,120 @@ var yo = require('yo-yo') var csjs = require('csjs-inject') -const remixLib = require('remix-lib') + +const FilePanel = require('../panels/file-panel') +const CompileTab = require('../tabs/compile-tab') +const SettingsTab = require('../tabs/settings-tab') +const AnalysisTab = require('../tabs/analysis-tab') +const DebuggerTab = require('../tabs/debugger-tab') +const SupportTab = require('../tabs/support-tab') +const TestTab = require('../tabs/test-tab') +const RunTab = require('../tabs/run-tab') + +var registry = require('../../global/registry') const styleguide = require('../ui/styles-guide/theme-chooser') const styles = styleguide.chooser() -const EventManager = remixLib.EventManager +const PluginManagerProxy = require('./plugin-manager-proxy') + +const EventEmitter = require ('events') class PluginManagerComponent { + constructor () { + this.event = new EventEmitter() + this.modulesDefinition = { + 'FilePanel': { name: 'FilePanel', Type: FilePanel, icon: 'data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjwhRE9DVFlQRSBzdmcgIFBVQkxJQyAnLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4nICAnaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkJz48c3ZnIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDUwIDUwIiBoZWlnaHQ9IjUwcHgiIGlkPSJMYXllcl8xIiB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCA1MCA1MCIgd2lkdGg9IjUwcHgiIHhtbDpzcGFjZT0icHJlc2VydmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPjxyZWN0IGZpbGw9Im5vbmUiIGhlaWdodD0iNTAiIHdpZHRoPSI1MCIvPjxwb2x5bGluZSBmaWxsPSJub25lIiBwb2ludHM9IjQ0LDIxIDQ0LDQ5IDYsNDkgICA2LDIxICIgc3Ryb2tlPSIjMDAwMDAwIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1taXRlcmxpbWl0PSIxMCIgc3Ryb2tlLXdpZHRoPSIyIi8+PHBvbHlsaW5lIGZpbGw9Im5vbmUiIHBvaW50cz0iMTksNDkgMTksMjggMzEsMjggICAzMSw0OSAiIHN0cm9rZT0iIzAwMDAwMCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHN0cm9rZS13aWR0aD0iMiIvPjxwb2x5Z29uIHBvaW50cz0iMzUsNSAzNSw4LjAxNiAzNywxMC4wOTQgMzcsNyAzOSw3IDM5LDEyLjIwMyA0MSwxNC4yNjYgNDEsNSAiLz48cG9seWxpbmUgZmlsbD0ibm9uZSIgcG9pbnRzPSIgIDEuMTEsMjUuOTQyIDI1LDEuMDUzIDQ4Ljg5LDI1Ljk0MyAiIHN0cm9rZT0iIzAwMDAwMCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHN0cm9rZS13aWR0aD0iMiIvPjwvc3ZnPg==' }, + 'Solidity Compile': { name: 'Solidity Compile', class: 'evm-compiler', Type: CompileTab, icon: 'data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjwhRE9DVFlQRSBzdmcgIFBVQkxJQyAnLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4nICAnaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkJz48c3ZnIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDUwIDUwIiBoZWlnaHQ9IjUwcHgiIGlkPSJMYXllcl8xIiB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCA1MCA1MCIgd2lkdGg9IjUwcHgiIHhtbDpzcGFjZT0icHJlc2VydmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPjxyZWN0IGZpbGw9Im5vbmUiIGhlaWdodD0iNTAiIHdpZHRoPSI1MCIvPjxwYXRoIGQ9Ik00NiwxNXYtNCAgYzAtMS4xMDQtMC44OTYtMi0yLTJjMCwwLTI0LjY0OCwwLTI2LDBjLTEuNDY5LDAtMi40ODQtNC00LTRIM0MxLjg5Niw1LDEsNS44OTYsMSw3djR2Mjl2NGMwLDEuMTA0LDAuODk2LDIsMiwyaDM5ICBjMS4xMDQsMCwyLTAuODk2LDItMiIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwMDAwIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1taXRlcmxpbWl0PSIxMCIgc3Ryb2tlLXdpZHRoPSIyIi8+PHBhdGggZD0iTTEsNDRsNS0yNyAgYzAtMS4xMDQsMC44OTYtMiwyLTJoMzljMS4xMDQsMCwyLDAuODk2LDIsMmwtNSwyNyIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwMDAwIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1taXRlcmxpbWl0PSIxMCIgc3Ryb2tlLXdpZHRoPSIyIi8+PC9zdmc+' }, + 'Test': { name: 'Test', dep: 'Solidity Compile', Type: TestTab, icon: 'data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjwhRE9DVFlQRSBzdmcgIFBVQkxJQyAnLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4nICAnaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkJz48c3ZnIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDUwIDUwIiBoZWlnaHQ9IjUwcHgiIGlkPSJMYXllcl8xIiB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCA1MCA1MCIgd2lkdGg9IjUwcHgiIHhtbDpzcGFjZT0icHJlc2VydmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPjxyZWN0IGZpbGw9Im5vbmUiIGhlaWdodD0iNTAiIHdpZHRoPSI1MCIvPjxwYXRoIGQ9Ik00OSw0djI1YzAsMC01LjI3MywzLTEyLDMgIGMtMTEuOTI5LDAtMTUuODY5LTQtMjQtNFMxLDMwLDEsMzBWM2MwLDAsMi4wODUtMiwxMi0yczE0LjA0Nyw2LDI0LDZDNDMuMjgxLDcsNDguMTMsNC40NzEsNDksNHoiIGZpbGw9Im5vbmUiIHN0cm9rZT0iIzAwMDAwMCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHN0cm9rZS13aWR0aD0iMiIvPjxsaW5lIGZpbGw9Im5vbmUiIHN0cm9rZT0iIzAwMDAwMCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHN0cm9rZS13aWR0aD0iMiIgeDE9IjEiIHgyPSIxIiB5MT0iMyIgeTI9IjQ5Ii8+PC9zdmc+' }, + 'Run': { name: 'Run', Type: RunTab, icon: 'data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjwhRE9DVFlQRSBzdmcgIFBVQkxJQyAnLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4nICAnaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkJz48c3ZnIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDUwIDUwIiBoZWlnaHQ9IjUwcHgiIGlkPSJMYXllcl8xIiB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCA1MCA1MCIgd2lkdGg9IjUwcHgiIHhtbDpzcGFjZT0icHJlc2VydmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPjxyZWN0IGZpbGw9Im5vbmUiIGhlaWdodD0iNTAiIHdpZHRoPSI1MCIvPjxwYXRoIGQ9Ik00My43MzQsMjFjLTMuNjMxLDAtMTUuMDkyLDAtMTUuMDkyLDAgIFMxNi4yNSw1LjE4OCwxNi4wNDcsNC45MzhzLTAuNDIyLTAuNTk0LTEuMTI1LTAuNjcyYy0wLjg1OS0wLjA5NS0xLjk2OS0wLjIwMy0yLjMyOC0wLjIzNGMtMC40MDYtMC4wMzUtMC43MTksMC4xNDEtMC40OTYsMC43MzQgIEMxMi4zODgsNS41MzksMTguNzQ4LDIxLDE4Ljc0OCwyMUg2LjAzNGMwLDAtMi40NTgtNC43MjItMi44NzgtNS41MzFDMi45NjUsMTUuMTAxLDIuNTU3LDE1LjAxNCwyLDE1SDEuMjk3ICBjLTAuMTI1LDAtMC4zMTIsMC0wLjI4MSwwLjM0NEMxLjA1OCwxNS44MTEsMywyNSwzLDI1cy0xLjg4OCw5LjE5Ny0xLjk4NCw5LjY1NkMwLjk1MywzNC45NTMsMS4xNzIsMzUsMS4yOTcsMzVIMiAgYzAuOTY2LTAuMDA5LDAuOTU0LTAuMDc5LDEuMTU2LTAuNDY5QzMuNTc2LDMzLjcyMiw2LjAzNCwyOSw2LjAzNCwyOWgxMi43MTRjMCwwLTYuMzYsMTUuNDYxLTYuNjUsMTYuMjM0ICBjLTAuMjIzLDAuNTk0LDAuMDksMC43NywwLjQ5NiwwLjczNGMwLjM1OS0wLjAzMSwxLjQ2OS0wLjEzOSwyLjMyOC0wLjIzNGMwLjcwMy0wLjA3OCwwLjkyMi0wLjQyMiwxLjEyNS0wLjY3MlMyOC42NDMsMjksMjguNjQzLDI5ICBzMTEuNDYxLDAsMTUuMDkyLDBjMy43NjYsMCw1LjI2NC0zLjAzMSw1LjI2NC00UzQ3LjQ4NCwyMSw0My43MzQsMjF6IiBmaWxsPSJub25lIiBzdHJva2U9IiMwMDAwMDAiIHN0cm9rZS1taXRlcmxpbWl0PSIxMCIgc3Ryb2tlLXdpZHRoPSIyIi8+PC9zdmc+' }, + 'Solidity Static Analysis': { name: 'Solidity Static Analysis', Type: AnalysisTab, icon: 'data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjwhRE9DVFlQRSBzdmcgIFBVQkxJQyAnLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4nICAnaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkJz48c3ZnIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDUwIDUwIiBoZWlnaHQ9IjUwcHgiIGlkPSJMYXllcl8xIiB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCA1MCA1MCIgd2lkdGg9IjUwcHgiIHhtbDpzcGFjZT0icHJlc2VydmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPjxyZWN0IGZpbGw9Im5vbmUiIGhlaWdodD0iNTAiIHdpZHRoPSI1MCIvPjxjaXJjbGUgY3g9IjIiIGN5PSIyNSIgcj0iMiIvPjxjaXJjbGUgY3g9IjE1IiBjeT0iMTkiIHI9IjIiLz48Y2lyY2xlIGN4PSIyNSIgY3k9IjExIiByPSIyIi8+PGNpcmNsZSBjeD0iMzUiIGN5PSIxNyIgcj0iMiIvPjxjaXJjbGUgY3g9IjQ4IiBjeT0iNSIgcj0iMiIvPjxjaXJjbGUgY3g9IjIiIGN5PSIzOSIgcj0iMiIvPjxjaXJjbGUgY3g9IjE1IiBjeT0iNDEiIHI9IjIiLz48Y2lyY2xlIGN4PSIyNSIgY3k9IjMzIiByPSIyIi8+PGNpcmNsZSBjeD0iMzUiIGN5PSI0MyIgcj0iMiIvPjxjaXJjbGUgY3g9IjQ4IiBjeT0iMzEiIHI9IjIiLz48cG9seWxpbmUgZmlsbD0ibm9uZSIgcG9pbnRzPSIyLDI1IDE1LDE5IDI1LDExICAgMzUsMTcgNDgsNSAiIHN0cm9rZT0iIzAwMDAwMCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHN0cm9rZS13aWR0aD0iMiIvPjxwb2x5bGluZSBmaWxsPSJub25lIiBwb2ludHM9IjIsMzkgMTUsNDEgMjUsMzMgICAzNSw0MyA0OCwzMSAiIHN0cm9rZT0iIzAwMDAwMCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHN0cm9rZS13aWR0aD0iMiIvPjwvc3ZnPg==' }, + 'Debugger': { name: 'Debugger', Type: DebuggerTab, icon: 'data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjwhRE9DVFlQRSBzdmcgIFBVQkxJQyAnLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4nICAnaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkJz48c3ZnIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDUwIDUwIiBoZWlnaHQ9IjUwcHgiIGlkPSJMYXllcl8xIiB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCA1MCA1MCIgd2lkdGg9IjUwcHgiIHhtbDpzcGFjZT0icHJlc2VydmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPjxyZWN0IGZpbGw9Im5vbmUiIGhlaWdodD0iNTAiIHdpZHRoPSI1MCIvPjxwYXRoIGQ9Ik00NiwxNXYtNCAgYzAtMS4xMDQtMC44OTYtMi0yLTJjMCwwLTI0LjY0OCwwLTI2LDBjLTEuNDY5LDAtMi40ODQtNC00LTRIM0MxLjg5Niw1LDEsNS44OTYsMSw3djR2Mjl2NGMwLDEuMTA0LDAuODk2LDIsMiwyaDM5ICBjMS4xMDQsMCwyLTAuODk2LDItMiIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwMDAwIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1taXRlcmxpbWl0PSIxMCIgc3Ryb2tlLXdpZHRoPSIyIi8+PHBhdGggZD0iTTEsNDRsNS0yNyAgYzAtMS4xMDQsMC44OTYtMiwyLTJoMzljMS4xMDQsMCwyLDAuODk2LDIsMmwtNSwyNyIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwMDAwIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1taXRlcmxpbWl0PSIxMCIgc3Ryb2tlLXdpZHRoPSIyIi8+PC9zdmc+' }, + 'Support': { name: 'Support', Type: SupportTab, icon: 'data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjwhRE9DVFlQRSBzdmcgIFBVQkxJQyAnLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4nICAnaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkJz48c3ZnIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDUwIDUwIiBoZWlnaHQ9IjUwcHgiIGlkPSJMYXllcl8xIiB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCA1MCA1MCIgd2lkdGg9IjUwcHgiIHhtbDpzcGFjZT0icHJlc2VydmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPjxyZWN0IGZpbGw9Im5vbmUiIGhlaWdodD0iNTAiIHdpZHRoPSI1MCIvPjxwYXRoIGQ9Ik0zMC45MzMsMzIuNTI4Yy0wLjE0Ni0xLjYxMi0wLjA5LTIuNzM3LTAuMDktNC4yMWMwLjczLTAuMzgzLDIuMDM4LTIuODI1LDIuMjU5LTQuODg4YzAuNTc0LTAuMDQ3LDEuNDc5LTAuNjA3LDEuNzQ0LTIuODE4ICBjMC4xNDMtMS4xODctMC40MjUtMS44NTUtMC43NzEtMi4wNjVjMC45MzQtMi44MDksMi44NzQtMTEuNDk5LTMuNTg4LTEyLjM5N2MtMC42NjUtMS4xNjgtMi4zNjgtMS43NTktNC41ODEtMS43NTkgIGMtOC44NTQsMC4xNjMtOS45MjIsNi42ODYtNy45ODEsMTQuMTU2Yy0wLjM0NSwwLjIxLTAuOTEzLDAuODc4LTAuNzcxLDIuMDY1YzAuMjY2LDIuMjExLDEuMTcsMi43NzEsMS43NDQsMi44MTggIGMwLjIyLDIuMDYyLDEuNTgsNC41MDUsMi4zMTIsNC44ODhjMCwxLjQ3MywwLjA1NSwyLjU5OC0wLjA5MSw0LjIxQzE5LjM2NywzNy4yMzgsNy41NDYsMzUuOTE2LDcsNDVoMzggIEM0NC40NTUsMzUuOTE2LDMyLjY4NSwzNy4yMzgsMzAuOTMzLDMyLjUyOHoiLz48L3N2Zz4=' }, + 'Plugin Manager': { name: 'Plugin Manager', target: this, icon: 'data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjwhRE9DVFlQRSBzdmcgIFBVQkxJQyAnLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4nICAnaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkJz48c3ZnIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDUwIDUwIiBoZWlnaHQ9IjUwcHgiIGlkPSJMYXllcl8xIiB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCA1MCA1MCIgd2lkdGg9IjUwcHgiIHhtbDpzcGFjZT0icHJlc2VydmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPjxyZWN0IGZpbGw9Im5vbmUiIGhlaWdodD0iNTAiIHdpZHRoPSI1MCIvPjxwYXRoIGQ9IiAgTTMyLDM1YzAsMCw4LjMxMiwwLDkuMDk4LDBDNDUuNDYzLDM1LDQ5LDMxLjQ2Myw0OSwyNy4wOTlzLTMuNTM3LTcuOTAyLTcuOTAyLTcuOTAyYy0wLjAyLDAtMC4wMzgsMC4wMDMtMC4wNTgsMC4wMDMgIGMwLjA2MS0wLjQ5NCwwLjEwMy0wLjk5NCwwLjEwMy0xLjUwNGMwLTYuNzEtNS40MzktMTIuMTUtMTIuMTUtMTIuMTVjLTUuMjI5LDAtOS42NzIsMy4zMDktMTEuMzg2LDcuOTQxICBjLTEuMDg3LTEuMDg5LTIuNTkxLTEuNzY0LTQuMjUxLTEuNzY0Yy0zLjMxOSwwLTYuMDA5LDIuNjktNi4wMDksNi4wMDhjMCwwLjA4NSwwLjAxLDAuMTY3LDAuMDEzLDAuMjUxICBDMy42OTUsMTguOTk1LDEsMjIuMzQ0LDEsMjYuMzMxQzEsMzEuMTE5LDQuODgxLDM1LDkuNjcsMzVjMC44MjcsMCw4LjMzLDAsOC4zMywwIiBmaWxsPSJub25lIiBzdHJva2U9IiMwMDAwMDAiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLW1pdGVybGltaXQ9IjEwIiBzdHJva2Utd2lkdGg9IjIiLz48cG9seWxpbmUgZmlsbD0ibm9uZSIgcG9pbnRzPSIzMCw0MSAyNSw0NiAyMCw0MSAgICIgc3Ryb2tlPSIjMDAwMDAwIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1taXRlcmxpbWl0PSIxMCIgc3Ryb2tlLXdpZHRoPSIyIi8+PGxpbmUgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwMDAwIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1taXRlcmxpbWl0PSIxMCIgc3Ryb2tlLXdpZHRoPSIyIiB4MT0iMjUiIHgyPSIyNSIgeTE9IjI2IiB5Mj0iNDUuNjY4Ii8+PC9zdmc+' }, + 'Settings': { name: 'Settings', Type: SettingsTab, icon: 'data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjwhRE9DVFlQRSBzdmcgIFBVQkxJQyAnLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4nICAnaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkJz48c3ZnIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDUwIDUwIiBoZWlnaHQ9IjUwcHgiIGlkPSJMYXllcl8xIiB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCA1MCA1MCIgd2lkdGg9IjUwcHgiIHhtbDpzcGFjZT0icHJlc2VydmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPjxyZWN0IGZpbGw9Im5vbmUiIGhlaWdodD0iNTAiIHdpZHRoPSI1MCIvPjxwYXRoIGQ9Ik00OSwyNy45NTR2LTZsLTcuMTQxLTEuMTY3ICBjLTAuNDIzLTEuNjkxLTEuMDg3LTMuMjgxLTEuOTYyLTQuNzM3bDQuMTYyLTUuOTMybC00LjI0My00LjI0MWwtNS44NTYsNC4yMWMtMS40Ni0wLjg4NC0zLjA2LTEuNTU4LTQuNzYzLTEuOTgybC0xLjI0NS03LjEwNmgtNiAgbC0xLjE1Niw3LjA4M2MtMS43MDQsMC40MTgtMy4zMTMsMS4wODMtNC43NzcsMS45NjNMMTAuMTgsNS44NzNsLTQuMjQzLDQuMjQxbDQuMTA3LDUuODc0Yy0wLjg4OCwxLjQ3LTEuNTYzLDMuMDc3LTEuOTkyLDQuNzkyICBMMSwyMS45NTR2Nmw3LjA0NCwxLjI0OWMwLjQyNSwxLjcxMSwxLjEwMSwzLjMxOCwxLjk5Miw0Ljc5bC00LjE2Myw1LjgyM2w0LjI0MSw0LjI0NWw1Ljg4MS00LjExOSAgYzEuNDY4LDAuODgyLDMuMDczLDEuNTUyLDQuNzc3LDEuOTczbDEuMTgsNy4wODdoNmwxLjI2MS03LjEwNWMxLjY5NS0wLjQzLDMuMjk3LTEuMTA1LDQuNzUxLTEuOTlsNS45MjIsNC4xNTVsNC4yNDItNC4yNDUgIGwtNC4yMjctNS44N2MwLjg3NS0xLjQ1NiwxLjUzOS0zLjA0OCwxLjk1OC00LjczOUw0OSwyNy45NTR6IE0yNSwzM2MtNC40MTgsMC04LTMuNTgyLTgtOHMzLjU4Mi04LDgtOHM4LDMuNTgyLDgsOFMyOS40MTgsMzMsMjUsMzMgIHoiIGZpbGw9Im5vbmUiIHN0cm9rZT0iIzAwMDAwMCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHN0cm9rZS13aWR0aD0iMiIvPjwvc3ZnPg==' } + } + this.activated = {} // list all activated modules + this.plugins = [] + this.data = {} + this.data.proxy = new PluginManagerProxy() + } + + proxy () { + return this.data.proxy + } + + initDefault () { + this.activateInternal('FilePanel') + this.activateInternal('Solidity Compile') + this.activateInternal('Run') + this.activateInternal('Plugin Manager') + this.activateInternal('Settings') + this.activateInternal('Support') } render () { var self = this // loop over all this.modules and this.plugins - var view = yo` + return yo`
+ list all modules / plugins that can be activated
` } - addItem (item) { - // add to appManager and then render - renderItem(item) + activatePlugin (name, api) { + let profile = { json: Plugin1Profile, api: pluginManagerApi } + let plugin = new Plugin(profile, api) + this.appManager.addPlugin(plugin) + // Plugin1Profile.location + // mainpanel or swappanel or bottom-bar + // plugin.render() // plugin.create() } - _activate(item) { + activateInternal (name) { + const mod = this.modulesDefinition[name] + let dep + if (mod.dep) dep = this.activateInternal(mod.dep) + let instance = mod.target + if (!instance && mod.Type) instance = new mod.Type(registry, dep) + if (!instance) return console.log('PluginManagerComponent: no Type or instance to add') + registry.put({api: instance, name: mod.name.toLocaleLowerCase()}) + if (instance.profile && typeof instance.profile === 'function') { + this.event.emit('requestActivation', instance.profile(), instance) + } + this.event.emit('internalActivated', mod, instance.render()) + // if of type evm-compiler, we forward to the internal components + if (mod.class === 'evm-compiler') { + this.data.proxy.register(mod, instance) + } + this.activated[mod.name] = mod + return instance + } + + _activate (item) { this.event.emit('activation', item) } - _deactivate(item) { + _deactivate (item) { this.event.emit('deactivation', item) } renderItem (item) { + this.plugins.push(item) var self = this - var view = yo`
${item.name} ${item.url} - +
` } } -module.exports = SwapPanelComponent +module.exports = PluginManagerComponent const css = csjs` .plugins { diff --git a/src/app/components/plugin-manager-proxy.js b/src/app/components/plugin-manager-proxy.js new file mode 100644 index 0000000000..f4849aa534 --- /dev/null +++ b/src/app/components/plugin-manager-proxy.js @@ -0,0 +1,24 @@ +var yo = require('yo-yo') + +var registry = require('../../global/registry') + +const CompilerAbstract = require('../compiler/compiler-abstract') + +const EventManager = require('remix-lib').EventManager + +class PluginManagerProxy { + + constructor () { + this.event = new EventManager + } + + register (mod, instance) { + instance.event.on('compilationFinished', (file, source, languageVersion, data) => { + registry.get('compilersartefacts').api['__last'] = new CompilerAbstract(languageVersion, data, source) + this.event.trigger('sendCompilationResult', [file, source, languageVersion, data]) + }) + } + +} + +module.exports = PluginManagerProxy diff --git a/src/app/components/swap-panel-api.js b/src/app/components/swap-panel-api.js index b09809c98c..376f016f10 100644 --- a/src/app/components/swap-panel-api.js +++ b/src/app/components/swap-panel-api.js @@ -5,25 +5,30 @@ const remixLib = require('remix-lib') const styleguide = require('../ui/styles-guide/theme-chooser') const styles = styleguide.chooser() -const EventManager = remixLib.EventManager +const EventEmmitter = require('events') class SwapPanelApi { - constructor (swapPanelComponent, pluginManagerApi) { + constructor (swapPanelComponent, verticalIconsComponent, pluginManagerComponent) { this.component = swapPanelComponent + verticalIconsComponent.event.on('showContent', (moduleName) => { + this.component.showContent(moduleName) + }) + pluginManagerComponent.event.on('internalActivated', (mod, content) => { + this.add(mod.name, content) + }) } /* - viewTitle: string content: DOM element + by appManager */ - addView(viewTitle, content) { + add (moduleName, content) { // add the DOM to the swappanel - this.component.addView(viewTitle, contents) + return this.component.add(moduleName, content) } - activate() { - this.event.emit(activated) - this.pluginManagerApi.activated(this.type) + reference (modulename, domElement) { + this.nodes[modulename] = domElement } } diff --git a/src/app/components/swap-panel-component.js b/src/app/components/swap-panel-component.js index bb6c213e09..c10bfbe715 100644 --- a/src/app/components/swap-panel-component.js +++ b/src/app/components/swap-panel-component.js @@ -5,39 +5,40 @@ const remixLib = require('remix-lib') const styleguide = require('../ui/styles-guide/theme-chooser') const styles = styleguide.chooser() -const EventManager = remixLib.EventManager - class SwapPanelComponent { constructor () { + // list of contents + this.contents = {} + // name of the current displayed content + this.currentNode } showContent (moduleName) { // hiding the current view and display the `moduleName` + if (this.contents[moduleName]) { + this.contents[moduleName].style.display = 'block' + if (this.currentNode) { + this.contents[this.currentNode].style.display = 'none' + } + this.currentNode = moduleName + return + } + console.log(`${moduleName} not found`) } - addView (title, content) { - // add the DOM to the swappanel - } + + add (moduleName, content) { + this.contents[moduleName] = yo`
${content}
` + this.view.appendChild(this.contents[moduleName]) + this.showContent(moduleName) + } render () { - var self = this - - var view = yo` + this.view = yo`
-
-

Plugin 1

-
  • Some Text
-
-
-

Plugin 2

-
  • Some Text
-
-
-

Plugin 3

-
  • Some Text
-
` + return this.view } } @@ -45,7 +46,6 @@ module.exports = SwapPanelComponent const css = csjs` .plugins { - width : 300px; } .plugItIn { display : none; diff --git a/src/app/components/vertical-icons-api.js b/src/app/components/vertical-icons-api.js index a11d8a43a3..3cb69883d5 100644 --- a/src/app/components/vertical-icons-api.js +++ b/src/app/components/vertical-icons-api.js @@ -8,17 +8,9 @@ const styles = styleguide.chooser() // API class VerticalIconsApi { - constructor(verticalIconsComponent, pluginManagerApi) { - pluginManagerApi.event.on('activate', (module) => verticalIconsComponent.addIcon(module) ) + constructor(verticalIconsComponent, pluginManagerComponent) { this.component = verticalIconsComponent - } - - addIcon(icon) { - this.component.event.trigger('addIcon', icon) - } - - removeIcon(icon) { - this.component.event.trigger('removeIcon', icon) - } + pluginManagerComponent.event.on('internalActivated', (mod, content) => verticalIconsComponent.addIcon(mod) ) + } } module.exports = VerticalIconsApi diff --git a/src/app/components/vertical-icons-component.js b/src/app/components/vertical-icons-component.js index 57e375272f..3364da36e9 100644 --- a/src/app/components/vertical-icons-component.js +++ b/src/app/components/vertical-icons-component.js @@ -5,34 +5,39 @@ const remixLib = require('remix-lib') const styleguide = require('../ui/styles-guide/theme-chooser') const styles = styleguide.chooser() +const EventEmmitter = require('events') // Component class VerticalIconComponent { - constructor(appManager) { - this.appManager = appManager - appManager.event.register('activated', (item) => { - this.addIcon(item) - }) - appManager.event.register('deactivated', (item) => { - this.removeIcon(item) - }) + constructor() { + this.event = new EventEmmitter } - addIcon (item) { - + addIcon (mod) { + let self = this + this.view.appendChild(yo`
{ self._iconClick(mod.name)}} title=${mod.name}>${mod.name}
`) } removeIcon (item) { } + select (name) { + this.event.emit('showContent', name) + } + + _iconClick (name) { + // called when an icon has been clicked + this.event.emit('showContent', name) + } + render() { - yo` -
-

example

+ this.view = yo` +
` + return this.view } } diff --git a/src/app/panels/editor-panel.js b/src/app/panels/editor-panel.js index 8c4b2ef55d..6906222f01 100644 --- a/src/app/panels/editor-panel.js +++ b/src/app/panels/editor-panel.js @@ -244,12 +244,10 @@ class EditorPanel { function toggleLHP (event) { this.children[0].classList.toggle('fa-angle-double-right') this.children[0].classList.toggle('fa-angle-double-left') - self.event.trigger('resize', ['left']) } function toggleRHP (event) { this.children[0].classList.toggle('fa-angle-double-right') this.children[0].classList.toggle('fa-angle-double-left') - self.event.trigger('resize', ['right']) } function increase () { self._components.editor.editorFontSize(1) } function decrease () { self._components.editor.editorFontSize(-1) } diff --git a/src/app/panels/file-panel.js b/src/app/panels/file-panel.js index a1586dd56b..49433f1065 100644 --- a/src/app/panels/file-panel.js +++ b/src/app/panels/file-panel.js @@ -263,7 +263,6 @@ function filepanel (localRegistry) { document.removeEventListener('mousemove', moveGhostbar) document.removeEventListener('mouseup', removeGhostbar) document.removeEventListener('keydown', cancelGhostbar) - self.event.trigger('resize', [getPosition(event)]) } function createNewFile () { diff --git a/src/app/panels/left-icon-panel.js b/src/app/panels/left-icon-panel.js index 10601dc9da..c68a84235f 100644 --- a/src/app/panels/left-icon-panel.js +++ b/src/app/panels/left-icon-panel.js @@ -132,7 +132,6 @@ module.exports = class LeftIconPanel { document.removeEventListener('mousemove', moveGhostbar) document.removeEventListener('mouseup', removeGhostbar) document.removeEventListener('keydown', cancelGhostbar) - self.event.trigger('resize', [document.body.offsetWidth - getPosition(event)]) } } } diff --git a/src/app/panels/righthand-panel.js b/src/app/panels/righthand-panel.js deleted file mode 100644 index b995c77d73..0000000000 --- a/src/app/panels/righthand-panel.js +++ /dev/null @@ -1,161 +0,0 @@ -const yo = require('yo-yo') -const csjs = require('csjs-inject') -const EventManager = require('../../lib/events') - -var globalRegistry = require('../../global/registry') - -const styleguide = require('../ui/styles-guide/theme-chooser') -const TabbedMenu = require('../tabs/tabbed-menu') -const PluginTab = require('../tabs/plugin-tab') -const DraggableContent = require('../ui/draggableContent') - -const styles = styleguide.chooser() - -module.exports = class RighthandPanel { - constructor ({pluginManager, tabs}, localRegistry) { - const self = this - self._components = {} - self._components.registry = localRegistry || globalRegistry - self._components.registry.put({api: this, name: 'righthandpanel'}) - self.event = new EventManager() - self._view = { - element: null, - tabbedMenu: null, - tabbedMenuViewport: null, - dragbar: null - } - - var tabbedMenu = new TabbedMenu(self._components.registry) - - self._components = { - tabbedMenu: tabbedMenu, - tabs - } - - self._components.tabs.settings.event.register('plugin-loadRequest', json => { - self.loadPlugin(json) - }) - - self.loadPlugin = function (json) { - var modal = new DraggableContent(() => { - pluginManager.unregister(json) - }) - var tab = new PluginTab(json) - var content = tab.render() - document.querySelector('body').appendChild(modal.render(json.title, json.url, content)) - pluginManager.register(json, modal, content) - } - - self._view.dragbar = yo`
` - self._view.element = yo` -
- ${self._view.dragbar} - -
` - - const { compile, run, settings, analysis, debug, support, test } = tabs - self._components.tabbedMenu.addTab('Compile', 'compileView', compile.render()) - self._components.tabbedMenu.addTab('Run', 'runView', run.render()) - self._components.tabbedMenu.addTab('Analysis', 'staticanalysisView', analysis.render()) - self._components.tabbedMenu.addTab('Testing', 'testView', test.render()) - self._components.tabbedMenu.addTab('Debugger', 'debugView', debug.render()) - self._components.tabbedMenu.addTab('Settings', 'settingsView', settings.render()) - self._components.tabbedMenu.addTab('Support', 'supportView', support.render()) - self._components.tabbedMenu.selectTabByTitle('Compile') - } - - render () { - const self = this - if (self._view.element) return self._view.element - return self._view.element - } - - debugger () { - return this._components.tabs.debug.debugger() - } - - focusOn (x) { - if (this._components.tabbedMenu) this._components.tabbedMenu.selectTabByClassName(x) - } - - init () { - // @TODO: init is for resizable drag bar only and should be refactored in the future - const self = this - const limit = 60 - self._view.dragbar.addEventListener('mousedown', mousedown) - const ghostbar = yo`
` - function mousedown (event) { - event.preventDefault() - if (event.which === 1) { - moveGhostbar(event) - document.body.appendChild(ghostbar) - document.addEventListener('mousemove', moveGhostbar) - document.addEventListener('mouseup', removeGhostbar) - document.addEventListener('keydown', cancelGhostbar) - } - } - function cancelGhostbar (event) { - if (event.keyCode === 27) { - document.body.removeChild(ghostbar) - document.removeEventListener('mousemove', moveGhostbar) - document.removeEventListener('mouseup', removeGhostbar) - document.removeEventListener('keydown', cancelGhostbar) - } - } - function getPosition (event) { - const lhp = window['filepanel'].offsetWidth - const max = document.body.offsetWidth - limit - var newpos = (event.pageX > max) ? max : event.pageX - newpos = (newpos > (lhp + limit)) ? newpos : lhp + limit - return newpos - } - function moveGhostbar (event) { // @NOTE VERTICAL ghostbar - ghostbar.style.left = getPosition(event) + 'px' - } - function removeGhostbar (event) { - document.body.removeChild(ghostbar) - document.removeEventListener('mousemove', moveGhostbar) - document.removeEventListener('mouseup', removeGhostbar) - document.removeEventListener('keydown', cancelGhostbar) - self.event.trigger('resize', [document.body.offsetWidth - getPosition(event)]) - } - } -} - -const css = csjs` - .righthandpanel { - display : flex; - flex-direction : column; - top : 0; - right : 0; - bottom : 0; - box-sizing : border-box; - overflow : hidden; - height : 100%; - } - .header { - height : 100%; - } - .dragbar { - position : absolute; - width : 0.5em; - top : 3em; - bottom : 0; - cursor : col-resize; - z-index : 999; - border-left : 2px solid ${styles.rightPanel.bar_Dragging}; - } - .ghostbar { - width : 3px; - background-color : ${styles.rightPanel.bar_Ghost}; - opacity : 0.5; - position : absolute; - cursor : col-resize; - z-index : 9999; - top : 0; - bottom : 0; - } -` diff --git a/src/app/tabs/compile-tab.js b/src/app/tabs/compile-tab.js index f5b9aa5365..e2fba7c881 100644 --- a/src/app/tabs/compile-tab.js +++ b/src/app/tabs/compile-tab.js @@ -1,4 +1,5 @@ /* global Worker */ +const EventEmitter = require('events') const async = require('async') const $ = require('jquery') const yo = require('yo-yo') @@ -25,6 +26,7 @@ const styles = styleGuide.chooser() module.exports = class CompileTab { constructor (localRegistry) { const self = this + self.event = new EventEmitter() self._view = { el: null, autoCompile: null, @@ -115,9 +117,11 @@ module.exports = class CompileTab { self._view.compileIcon.setAttribute('title', '') }) self._components.compiler.event.register('compilationFinished', function finish (success, data, source) { + if (success) { + // forwarding the event to the appManager infra + self.event.emit('compilationFinished', null, source, 'Solidity', data) + } if (self._view.compileIcon) { - const compileTab = document.querySelector('.compileView') - compileTab.style.color = styles.colors.black self._view.compileIcon.style.color = styles.colors.black self._view.compileIcon.classList.remove(`${css.spinningIcon}`) self._view.compileIcon.classList.remove(`${css.bouncingIcon}`) @@ -129,7 +133,6 @@ module.exports = class CompileTab { self._view.contractNames.innerHTML = '' if (success) { // TODO consider using compile tab as a proper module instead of just forwarding event - self._deps.pluginManager.receivedDataFrom('sendCompilationResult', 'solidity-compiler', [data.target, source, self.data.selectedVersion, data]) self._view.contractNames.removeAttribute('disabled') self._components.compiler.visitContracts(contract => { self.data.contractsDetails[contract.name] = parseContracts(contract.name, contract.object, self._components.compiler.getSource(contract.file)) @@ -139,22 +142,16 @@ module.exports = class CompileTab { } else { self._view.contractNames.setAttribute('disabled', true) } - // hightlight the tab if error - if (success) document.querySelector('.compileView').style.color = '' // @TODO: compileView tab - else document.querySelector('.compileView').style.color = styles.colors.red // @TODO: compileView tab - // display warning error if any var error = false if (data['error']) { error = true self._deps.renderer.error(data['error'].formattedMessage, self._view.errorContainer, {type: data['error'].severity || 'error'}) if (data['error'].mode === 'panic') { - /* return modalDialogCustom.alert(yo`
The compiler returned with the following internal error:
${data['error'].formattedMessage}.
The compiler might be in a non-sane state, please be careful and do not use further compilation data to deploy to mainnet. It is heavily recommended to use another browser not affected by this issue (Firefox is known to not be affected).
Please join remix gitter channel for more information.
`) - */ } } if (data.errors && data.errors.length) { @@ -185,6 +182,13 @@ module.exports = class CompileTab { } }) } + profile () { + return { + type: 'solidityCompile', + methods: {}, + events: ['compilationFinished'] + } + } addWarning (msg, settings) { const self = this self._deps.renderer.error(msg, self._view.errorContainerHead, settings) diff --git a/src/app/tabs/settings-tab.js b/src/app/tabs/settings-tab.js index b8f38ed79c..525cd33c39 100644 --- a/src/app/tabs/settings-tab.js +++ b/src/app/tabs/settings-tab.js @@ -205,7 +205,6 @@ module.exports = class SettingsTab { const css = csjs` .settingsTabView { padding: 2%; - display: flex; } .info { ${styles.rightPanel.settingsTab.box_SolidityVersionInfo}; diff --git a/src/app/ui/renderer.js b/src/app/ui/renderer.js index f90e756971..b5b968c72c 100644 --- a/src/app/ui/renderer.js +++ b/src/app/ui/renderer.js @@ -16,7 +16,6 @@ function Renderer (localRegistry) { self._components.registry = localRegistry || globlalRegistry // dependencies self._deps = { - editor: self._components.registry.get('editor').api, fileManager: self._components.registry.get('filemanager').api, config: self._components.registry.get('config').api } @@ -27,13 +26,15 @@ function Renderer (localRegistry) { Renderer.prototype._error = function (file, error) { const self = this + const editor = self._components.registry.get('editor').api if (file === self._deps.config.get('currentFile')) { - self._deps.editor.addAnnotation(error) + editor.addAnnotation(error) } } Renderer.prototype._errorClick = function (errFile, errLine, errCol) { const self = this + const editor = self._components.registry.get('editor').api if (errFile !== self._deps.config.get('currentFile')) { // TODO: refactor with this._components.contextView.jumpTo var provider = self._deps.fileManager.fileProviderOf(errFile) @@ -41,11 +42,11 @@ Renderer.prototype._errorClick = function (errFile, errLine, errCol) { provider.exists(errFile, (error, exist) => { if (error) return console.log(error) self._deps.fileManager.switchFile(errFile) - self._deps.editor.gotoLine(errLine, errCol) + editor.gotoLine(errLine, errCol) }) } } else { - self._deps.editor.gotoLine(errLine, errCol) + editor.gotoLine(errLine, errCol) } }