diff --git a/src/app/tabs/compile-tab.js b/src/app/tabs/compile-tab.js index a87d566322..b78bfdad36 100644 --- a/src/app/tabs/compile-tab.js +++ b/src/app/tabs/compile-tab.js @@ -76,6 +76,12 @@ class CompileTab extends CompilerApi { */ listenToEvents () { + let onContentChanged = () => { + this.events.emit('statusChanged', {key: 'code', title: 'content changed, needs recompilation', type: 'info'}) + } + this.editor.event.register('contentChanged', onContentChanged) + this.editor.event.register('sessionSwitched', onContentChanged) + this.compiler.event.register('loadingCompiler', () => { this.events.emit('statusChanged', {key: 'spinner', title: 'loading compiler...', type: 'info'}) }) @@ -84,7 +90,7 @@ class CompileTab extends CompilerApi { this.events.emit('statusChanged', {key: '', title: '', type: ''}) }) - this.compiler.event.register('compilationStarted', () => { + this.compileTabLogic.event.on('startingCompilation', () => { if (this._view.errorContainer) { this._view.errorContainer.innerHTML = '' } @@ -93,10 +99,12 @@ class CompileTab extends CompilerApi { this.fileManager.events.on('currentFileChanged', (name) => { this.compilerContainer.currentFile = name + onContentChanged() }) this.fileManager.events.on('noFileSelected', () => { this.compilerContainer.currentFile = '' + onContentChanged() }) this.compiler.event.register('compilationFinished', (success, data, source) => { diff --git a/src/app/tabs/compileTab/compileTab.js b/src/app/tabs/compileTab/compileTab.js index cb5f155261..ca5cd9ce8a 100644 --- a/src/app/tabs/compileTab/compileTab.js +++ b/src/app/tabs/compileTab/compileTab.js @@ -1,4 +1,5 @@ const async = require('async') +const EventEmitter = require('events') var remixTests = require('remix-tests') var Compiler = require('remix-solidity').Compiler var CompilerImport = require('../../compiler/compiler-imports') @@ -9,6 +10,7 @@ const addTooltip = require('../../ui/tooltip') class CompileTab { constructor (queryParams, fileManager, editor, config, fileProviders) { + this.event = new EventEmitter() this.queryParams = queryParams this.compilerImport = new CompilerImport() this.compiler = new Compiler((url, cb) => this.importFileCb(url, cb)) @@ -45,7 +47,11 @@ class CompileTab { provider.get(target, (error, content) => { if (error) return console.log(error) sources[target] = { content } - this.compiler.compile(sources, target) + this.event.emit('startingCompilation') + setTimeout(() => { + // setTimeout fix the animation on chrome... (animation triggered by 'staringCompilation') + this.compiler.compile(sources, target) + }, 100) }) } diff --git a/src/app/tabs/compileTab/compilerContainer.js b/src/app/tabs/compileTab/compilerContainer.js index a0f3e2e528..0058ed3ad3 100644 --- a/src/app/tabs/compileTab/compilerContainer.js +++ b/src/app/tabs/compileTab/compilerContainer.js @@ -47,6 +47,13 @@ class CompilerContainer { this.editor.event.register('contentChanged', this.scheduleCompilation.bind(this)) this.editor.event.register('sessionSwitched', this.scheduleCompilation.bind(this)) + this.compileTabLogic.event.on('startingCompilation', () => { + if (!this._view.compileIcon) return + this._view.compileIcon.setAttribute('title', 'compiling...') + this._view.compileIcon.classList.remove(`${css.bouncingIcon}`) + this._view.compileIcon.classList.add(`${css.spinningIcon}`) + }) + this.compileTabLogic.compiler.event.register('compilationDuration', (speed) => { if (!this._view.warnCompilationSlow) return if (speed > 1000) { @@ -70,13 +77,6 @@ class CompilerContainer { this._view.warnCompilationSlow.style.visibility = 'hidden' }) - this.compileTabLogic.compiler.event.register('compilationStarted', () => { - if (!this._view.compileIcon) return - this._view.compileIcon.setAttribute('title', 'compiling...') - this._view.compileIcon.classList.remove(`${css.bouncingIcon}`) - this._view.compileIcon.classList.add(`${css.spinningIcon}`) - }) - this.compileTabLogic.compiler.event.register('compilerLoaded', () => { if (!this._view.compileIcon) return this._view.compileIcon.setAttribute('title', '')