From 0e768edb2f37e3117a7df62f91861a9fb30afabc Mon Sep 17 00:00:00 2001 From: yann300 Date: Mon, 2 Jul 2018 16:24:59 +0200 Subject: [PATCH] move Editor, ContextualListener, ContextView, CommandInterpreter to EditorPanel --- src/app.js | 40 +++++++--------------------- src/app/editor/contextView.js | 18 ++++++------- src/app/editor/contextualListener.js | 12 ++++----- src/app/files/fileManager.js | 6 +++-- src/app/panels/editor-panel.js | 32 +++++++++++++++------- 5 files changed, 51 insertions(+), 57 deletions(-) diff --git a/src/app.js b/src/app.js index 58f23cd070..109c222810 100644 --- a/src/app.js +++ b/src/app.js @@ -24,7 +24,6 @@ var BrowserfilesTree = require('./app/files/browser-files-tree') var chromeCloudStorageSync = require('./app/files/chromeCloudStorageSync') var SharedFolder = require('./app/files/shared-folder') var Config = require('./config') -var Editor = require('./app/editor/editor') var Renderer = require('./app/ui/renderer') var Compiler = require('remix-solidity').Compiler var executionContext = require('./execution-context') @@ -40,12 +39,9 @@ var Txlistener = remixLib.execution.txListener var EventsDecoder = remixLib.execution.EventsDecoder var CompilerImport = require('./app/compiler/compiler-imports') var FileManager = require('./app/files/fileManager') -var ContextualListener = require('./app/editor/contextualListener') -var ContextView = require('./app/editor/contextView') var BasicReadOnlyExplorer = require('./app/files/basicReadOnlyExplorer') var NotPersistedExplorer = require('./app/files/NotPersistedExplorer') var toolTip = require('./app/ui/tooltip') -var CommandInterpreter = require('./lib/cmdInterpreter') var TransactionReceiptResolver = require('./transactionReceiptResolver') var SourceHighlighter = require('./app/editor/sourceHighlighter') @@ -237,7 +233,7 @@ class App { if (self._view.transactionDebugger.isActive) return self._components.fileManager.saveCurrentFile() - self._components.editor.clearAnnotations() + self._components.editorpanel.getEditor().clearAnnotations() var currentFile = self._components.config.get('currentFile') if (currentFile) { if (/.(.sol)$/.exec(currentFile)) { @@ -469,39 +465,23 @@ Please make a backup of your contracts and start using http://remix.ethereum.org txlistener.startListening() - // ----------------- editor ---------------------------- - this._components.editor = new Editor({}) // @TODO: put into editorpanel - var editor = self._components.editor // shortcut for the editor - registry.put({api: editor, name: 'editor'}) + // TODO: There are still a lot of dep between editorpanel and filemanager - // ----------------- Command Interpreter ----------------- - /* - this module basically listen on user input (from terminal && editor) - and interpret them as commands - */ - var cmdInterpreter = new CommandInterpreter() // @TODO: put into editorpanel + // ----------------- editor panel ---------------------- + self._components.editorpanel = new EditorPanel() + registry.put({ api: self._components.editorpanel, name: 'editorpanel' }) - registry.put({api: cmdInterpreter, name: 'cmdinterpreter'}) // ----------------- file manager ---------------------------- - self._components.fileManager = new FileManager() var fileManager = self._components.fileManager registry.put({api: fileManager, name: 'filemanager'}) - // ---------------- ContextualListener ----------------------- - this._components.contextualListener = new ContextualListener() - registry.put({api: this._components.contextualListener, name: 'contextualListener'}) - - // ---------------- ContextView ----------------------- - this._components.contextView = new ContextView() - registry.put({api: this._components.contextView, name: 'contextview'}) - - // ----------------- editor panel ---------------------- - this._components.editorpanel = new EditorPanel() - registry.put({ api: this._components.editorpanel, name: 'editorpanel' }) - this._components.editorpanel.event.register('resize', direction => self._adjustLayout(direction)) + self._components.editorpanel.init() + self._components.fileManager.init() - this._view.centerpanel.appendChild(this._components.editorpanel.render()) + self._components.editorpanel.event.register('resize', direction => self._adjustLayout(direction)) + self._view.centerpanel.appendChild(self._components.editorpanel.render()) + var editor = self._components.editorpanel.getEditor() // The event listener needs to be registered as early as possible, because the // parent will send the message upon the "load" event. diff --git a/src/app/editor/contextView.js b/src/app/editor/contextView.js index a700f06824..c9200ed0b8 100644 --- a/src/app/editor/contextView.js +++ b/src/app/editor/contextView.js @@ -14,13 +14,13 @@ var css = require('./styles/contextView-styles') - rename declaration/references */ class ContextView { - constructor (localRegistry) { + constructor (opts, localRegistry) { const self = this self._components = {} self._components.registry = localRegistry || globalRegistry + self.contextualListener = opts.contextualListener + self.editor = opts.editor self._deps = { - contextualListener: self._components.registry.get('contextualListener').api, - editor: self._components.registry.get('editor').api, compiler: self._components.registry.get('compiler').api, offsetToLineColumnConverter: self._components.registry.get('offsettolinecolumnconverter').api, config: self._components.registry.get('config').api, @@ -31,7 +31,7 @@ class ContextView { this._current this.sourceMappingDecoder = new SourceMappingDecoder() this.previousElement = null - self._deps.contextualListener.event.register('contextChanged', nodes => { + self.contextualListener.event.register('contextChanged', nodes => { this._nodes = nodes this.update() }) @@ -76,7 +76,7 @@ class ContextView { if (isDefinition(last)) { this._current = last } else { - var target = this._deps.contextualListener.declarationOf(last) + var target = this.contextualListener.declarationOf(last) if (target) { this._current = target } else { @@ -94,7 +94,7 @@ class ContextView { var self = this function jumpToLine (lineColumn) { if (lineColumn.start && lineColumn.start.line && lineColumn.start.column) { - self._deps.editor.gotoLine(lineColumn.start.line, lineColumn.end.column + 1) + self.editor.gotoLine(lineColumn.start.line, lineColumn.end.column + 1) } } if (self._deps.compiler.lastCompilationResult && self._deps.compiler.lastCompilationResult.data) { @@ -119,12 +119,12 @@ class ContextView { _render (node, nodeAtCursorPosition) { if (!node) return yo`
` var self = this - var references = self._deps.contextualListener.referencesOf(node) + var references = self.contextualListener.referencesOf(node) var type = (node.attributes && node.attributes.type) ? node.attributes.type : node.name references = `${references ? references.length : '0'} reference(s)` var ref = 0 - var nodes = self._deps.contextualListener.getActiveHighlights() + var nodes = self.contextualListener.getActiveHighlights() for (var k in nodes) { if (nodeAtCursorPosition.id === nodes[k].nodeId) { ref = k @@ -161,7 +161,7 @@ class ContextView { function showGasEstimation () { if (node.name === 'FunctionDefinition') { - var result = self._deps.contextualListener.gasEstimation(node) + var result = self.contextualListener.gasEstimation(node) var executionCost = 'Execution cost: ' + result.executionCost + ' gas' var codeDepositCost = 'Code deposit cost: ' + result.codeDepositCost + ' gas' var estimatedGas = result.codeDepositCost ? `${codeDepositCost}, ${executionCost}` : `${executionCost}` diff --git a/src/app/editor/contextualListener.js b/src/app/editor/contextualListener.js index 5e7038a9dc..103b0349d8 100644 --- a/src/app/editor/contextualListener.js +++ b/src/app/editor/contextualListener.js @@ -9,14 +9,14 @@ var globalRegistry = require('../../global/registry') trigger contextChanged(nodes) */ class ContextualListener { - constructor (localRegistry) { + constructor (opts, localRegistry) { var self = this this.event = new EventManager() self._components = {} self._components.registry = localRegistry || globalRegistry + self.editor = opts.editor self._deps = { compiler: self._components.registry.get('compiler').api, - editor: self._components.registry.get('editor').api, config: self._components.registry.get('config').api, offsetToLineColumnConverter: self._components.registry.get('offsettolinecolumnconverter').api } @@ -37,12 +37,12 @@ class ContextualListener { } }) - self._deps.editor.event.register('contentChanged', () => { this._stopHighlighting() }) + self.editor.event.register('contentChanged', () => { this._stopHighlighting() }) this.sourceMappingDecoder = new SourceMappingDecoder() this.astWalker = new AstWalker() setInterval(() => { - this._highlightItems(self._deps.editor.getCursorPosition(), self._deps.compiler.lastCompilationResult, self._deps.config.get('currentFile')) + this._highlightItems(self.editor.getCursorPosition(), self._deps.compiler.lastCompilationResult, self._deps.config.get('currentFile')) }, 1000) } @@ -132,7 +132,7 @@ class ContextualListener { } var fileName = self._deps.compiler.getSourceName(position.file) if (fileName) { - return self._deps.editor.addMarker(lineColumn, fileName, css) + return self.editor.addMarker(lineColumn, fileName, css) } } return null @@ -164,7 +164,7 @@ class ContextualListener { var self = this for (var eventKey in this._activeHighlights) { var event = this._activeHighlights[eventKey] - self._deps.editor.removeMarker(event.eventId, event.fileTarget) + self.editor.removeMarker(event.eventId, event.fileTarget) } this._activeHighlights = [] } diff --git a/src/app/files/fileManager.js b/src/app/files/fileManager.js index 80a0df3bc1..920deda659 100644 --- a/src/app/files/fileManager.js +++ b/src/app/files/fileManager.js @@ -15,10 +15,12 @@ class FileManager { constructor (localRegistry) { this.tabbedFiles = {} this.event = new EventManager() + this._components = {} + this._components.registry = localRegistry || globalRegistry + } + init () { var self = this - self._components = {} - self._components.registry = localRegistry || globalRegistry self._deps = { compilerImport: self._components.registry.get('compilerimport').api, editor: self._components.registry.get('editor').api, diff --git a/src/app/panels/editor-panel.js b/src/app/panels/editor-panel.js index 19b5a61045..27b5c3d108 100644 --- a/src/app/panels/editor-panel.js +++ b/src/app/panels/editor-panel.js @@ -4,8 +4,12 @@ var EventManager = remixLib.EventManager var $ = require('jquery') var Terminal = require('./terminal') +var Editor = require('../editor/editor') var globalRegistry = require('../../global/registry') +var CommandInterpreter = require('../../lib/cmdInterpreter') +var ContextualListener = require('../editor/contextualListener') +var ContextView = require('../editor/contextView') var styles = require('./styles/editor-panel-styles') var cssTabs = styles.cssTabs var css = styles.css @@ -15,16 +19,15 @@ class EditorPanel { var self = this self._components = {} self._components.registry = localRegistry || globalRegistry + self.event = new EventManager() + } + init () { + var self = this self._deps = { config: self._components.registry.get('config').api, - editor: self._components.registry.get('editor').api, txlistener: self._components.registry.get('txlistener').api, - contextView: self._components.registry.get('contextview').api, - udapp: self._components.registry.get('udapp').api, - cmdInterpreter: self._components.registry.get('cmdinterpreter').api, fileManager: self._components.registry.get('filemanager').api } - self.event = new EventManager() self.data = { _FILE_SCROLL_DELTA: 200, _layout: { @@ -35,12 +38,16 @@ class EditorPanel { } } self._view = {} + var editor = new Editor({}) + self._components.registry.put({api: editor, name: 'editor'}) + var contextualListener = new ContextualListener({editor: editor}) self._components = { - editor: self._deps.editor, // @TODO: instantiate in eventpanel instead of passing via `opts` + editor: editor, + contextualListener: contextualListener, + contextView: new ContextView({contextualListener: contextualListener, editor: editor}), terminal: new Terminal({ api: { - cmdInterpreter: self._deps.cmdInterpreter, - udapp: self._deps.udapp, + cmdInterpreter: new CommandInterpreter(), // @TODO: put into editorpanel getPosition (event) { var limitUp = 36 var limitDown = 20 @@ -52,6 +59,7 @@ class EditorPanel { } }) } + self._components.terminal.event.register('filterChanged', (type, value) => { this.event.trigger('terminalFilterChanged', [type, value]) }) @@ -93,6 +101,10 @@ class EditorPanel { self._components.terminal.scroll2bottom() } } + getEditor () { + var self = this + return self._components.editor + } refresh () { var self = this self._view.tabs.onmouseenter() @@ -119,7 +131,7 @@ class EditorPanel {
${self._renderTabsbar()}
- ${self._deps.contextView.render()} + ${self._components.contextView.render()}
${self._view.editor} ${self._view.terminal} @@ -191,7 +203,7 @@ class EditorPanel { delete self._deps.fileManager.tabbedFiles[name] self._deps.fileManager.refreshTabs() if (Object.keys(self._deps.fileManager.tabbedFiles).length) { - self.switchFile(Object.keys(self._deps.fileManager.tabbedFiles)[0]) + self._deps.fileManager.switchFile(Object.keys(self._deps.fileManager.tabbedFiles)[0]) } else { self._deps.editor.displayEmptyReadOnlySession() self._deps.config.set('currentFile', '')