From 31492c906b1ddfaaceea182a85136b63aefc612e Mon Sep 17 00:00:00 2001 From: yann300 Date: Tue, 16 Apr 2019 22:51:40 +0200 Subject: [PATCH 1/6] don't auto select file --- src/app/ui/landing-page/landing-page.js | 2 -- 1 file changed, 2 deletions(-) diff --git a/src/app/ui/landing-page/landing-page.js b/src/app/ui/landing-page/landing-page.js index 28e5e77bb6..c8d2219437 100644 --- a/src/app/ui/landing-page/landing-page.js +++ b/src/app/ui/landing-page/landing-page.js @@ -160,14 +160,12 @@ export class LandingPage extends BaseApi { this.appManager.ensureActivated('run') this.appManager.ensureActivated('solidityStaticAnalysis') this.appManager.ensureActivated('solidityUnitTesting') - globalRegistry.get('filemanager').api.switchFile() globalRegistry.get('verticalicon').api.select('solidity') } let startVyper = () => { closeAll() this.appManager.ensureActivated('vyper') this.appManager.ensureActivated('run') - globalRegistry.get('filemanager').api.switchFile() globalRegistry.get('verticalicon').api.select('vyper') } From 72d15bf1e9797f9de64c0162e0de0204a4f73bbd Mon Sep 17 00:00:00 2001 From: yann300 Date: Tue, 16 Apr 2019 22:52:00 +0200 Subject: [PATCH 2/6] add more status --- src/app/tabs/compile-tab.js | 10 ++++++++-- 1 file changed, 8 insertions(+), 2 deletions(-) diff --git a/src/app/tabs/compile-tab.js b/src/app/tabs/compile-tab.js index 955db1e7fd..a87d566322 100644 --- a/src/app/tabs/compile-tab.js +++ b/src/app/tabs/compile-tab.js @@ -76,6 +76,14 @@ class CompileTab extends CompilerApi { */ listenToEvents () { + this.compiler.event.register('loadingCompiler', () => { + this.events.emit('statusChanged', {key: 'spinner', title: 'loading compiler...', type: 'info'}) + }) + + this.compiler.event.register('compilerLoaded', () => { + this.events.emit('statusChanged', {key: '', title: '', type: ''}) + }) + this.compiler.event.register('compilationStarted', () => { if (this._view.errorContainer) { this._view.errorContainer.innerHTML = '' @@ -355,8 +363,6 @@ class CompileTab extends CompilerApi { this._view.errorContainer = yo`
` this._view.contractSelection = this.contractSelection() this._view.compilerContainer = this.compilerContainer.render() - const currentFile = this.fileManager.currentFile() - if (currentFile) this.compilerContainer.currentFile = currentFile this._view.el = yo`
From 73c7f934a2a08249fb43c92ed6169e7d1c16e083 Mon Sep 17 00:00:00 2001 From: yann300 Date: Tue, 16 Apr 2019 22:52:37 +0200 Subject: [PATCH 3/6] fix bouncing and spinning --- src/app/tabs/compileTab/compilerContainer.js | 8 +- src/app/tabs/styles/compile-tab-styles.js | 84 ++++++++++++++++---- 2 files changed, 71 insertions(+), 21 deletions(-) diff --git a/src/app/tabs/compileTab/compilerContainer.js b/src/app/tabs/compileTab/compilerContainer.js index d425891b44..a0f3e2e528 100644 --- a/src/app/tabs/compileTab/compilerContainer.js +++ b/src/app/tabs/compileTab/compilerContainer.js @@ -65,29 +65,29 @@ class CompilerContainer { this.compileTabLogic.compiler.event.register('loadingCompiler', () => { if (!this._view.compileIcon) return + this._view.compileIcon.setAttribute('title', 'compiler is loading, please wait a few moments.') this._view.compileIcon.classList.add(`${css.spinningIcon}`) this._view.warnCompilationSlow.style.visibility = 'hidden' - this._view.compileIcon.setAttribute('title', 'compiler is loading, please wait a few moments.') }) 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._view.compileIcon.setAttribute('title', 'compiling...') }) this.compileTabLogic.compiler.event.register('compilerLoaded', () => { if (!this._view.compileIcon) return - this._view.compileIcon.classList.remove(`${css.spinningIcon}`) this._view.compileIcon.setAttribute('title', '') + this._view.compileIcon.classList.remove(`${css.spinningIcon}`) }) this.compileTabLogic.compiler.event.register('compilationFinished', (success, data, source) => { if (!this._view.compileIcon) return + this._view.compileIcon.setAttribute('title', 'idle') this._view.compileIcon.classList.remove(`${css.spinningIcon}`) this._view.compileIcon.classList.remove(`${css.bouncingIcon}`) - this._view.compileIcon.setAttribute('title', 'idle') }) } diff --git a/src/app/tabs/styles/compile-tab-styles.js b/src/app/tabs/styles/compile-tab-styles.js index d14ca2df52..886b49a820 100644 --- a/src/app/tabs/styles/compile-tab-styles.js +++ b/src/app/tabs/styles/compile-tab-styles.js @@ -141,33 +141,83 @@ const css = csjs` .icon { margin-right: 0.3em; } - .spinningIcon { - margin-right: .3em; - animation: spin 2s linear infinite; - } - .bouncingIcon { - margin-right: .3em; - animation: bounce 2s infinite; - } .errorBlobs { padding-left: 5px; padding-right: 5px; } + + .spinningIcon { + display: inline-block; + position: relative; + animation: spin 2s infinite linear; + -moz-animation: spin 2s infinite linear; + -o-animation: spin 2s infinite linear; + -webkit-animation: spin 2s infinite linear; + } @keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } + @-webkit-keyframes spin { + 0% { transform: rotate(0deg); } + 100% { transform: rotate(360deg); } + } + @-moz-keyframes spin { + 0% { transform: rotate(0deg); } + 100% { transform: rotate(360deg); } + } + @-o-keyframes spin { + 0% { transform: rotate(0deg); } + 100% { transform: rotate(360deg); } + } + @-ms-keyframes spin { + 0% { transform: rotate(0deg); } + 100% { transform: rotate(360deg); } + } + + + .bouncingIcon { + display: inline-block; + position: relative; + -moz-animation: bounce 2s infinite linear; + -o-animation: bounce 2s infinite linear; + -webkit-animation: bounce 2s infinite linear; + animation: bounce 2s infinite linear; + } + @-webkit-keyframes bounce { - 0% { - margin-bottom: 0; - } - 70% { - margin-bottom: 0; - } - 100% { - margin-bottom: 0; - } + 0% { top: 0; } + 50% { top: -0.2em; } + 70% { top: -0.3em; } + 100% { top: 0; } + } + @-moz-keyframes bounce { + 0% { top: 0; } + 50% { top: -0.2em; } + 70% { top: -0.3em; } + 100% { top: 0; } + } + @-o-keyframes bounce { + 0% { top: 0; } + 50% { top: -0.2em; } + 70% { top: -0.3em; } + 100% { top: 0; } + } + @-ms-keyframes bounce { + 0% { top: 0; } + 50% { top: -0.2em; } + 70% { top: -0.3em; } + 100% { top: 0; } + } + @keyframes bounce { + 0% { top: 0; } + 50% { top: -0.2em; } + 70% { top: -0.3em; } + 100% { top: 0; } } + + + ` module.exports = css From 9be490277fe604bd8b2dce7988bb7dad04674437 Mon Sep 17 00:00:00 2001 From: yann300 Date: Wed, 17 Apr 2019 08:56:56 +0200 Subject: [PATCH 4/6] fix bouncing / spinning --- src/app/tabs/compile-tab.js | 10 +++++++++- src/app/tabs/compileTab/compileTab.js | 8 +++++++- src/app/tabs/compileTab/compilerContainer.js | 14 +++++++------- 3 files changed, 23 insertions(+), 9 deletions(-) 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', '') From e2d169a666318358e90799fd5edab6c5ba87f5e7 Mon Sep 17 00:00:00 2001 From: yann300 Date: Tue, 23 Apr 2019 10:41:23 +0200 Subject: [PATCH 5/6] update title --- src/app/tabs/compile-tab.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/app/tabs/compile-tab.js b/src/app/tabs/compile-tab.js index b78bfdad36..9e53b65295 100644 --- a/src/app/tabs/compile-tab.js +++ b/src/app/tabs/compile-tab.js @@ -77,7 +77,7 @@ class CompileTab extends CompilerApi { listenToEvents () { let onContentChanged = () => { - this.events.emit('statusChanged', {key: 'code', title: 'content changed, needs recompilation', type: 'info'}) + this.events.emit('statusChanged', {key: 'code', title: 'the content has changed, needs recompilation', type: 'info'}) } this.editor.event.register('contentChanged', onContentChanged) this.editor.event.register('sessionSwitched', onContentChanged) From aac8c8cdf0cf65dd77a038e19d6825cbbb3baf80 Mon Sep 17 00:00:00 2001 From: yann300 Date: Tue, 23 Apr 2019 10:41:28 +0200 Subject: [PATCH 6/6] standard --- src/app/tabs/styles/compile-tab-styles.js | 4 ---- 1 file changed, 4 deletions(-) diff --git a/src/app/tabs/styles/compile-tab-styles.js b/src/app/tabs/styles/compile-tab-styles.js index 886b49a820..17a7fb8b3a 100644 --- a/src/app/tabs/styles/compile-tab-styles.js +++ b/src/app/tabs/styles/compile-tab-styles.js @@ -174,7 +174,6 @@ const css = csjs` 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } - .bouncingIcon { display: inline-block; @@ -215,9 +214,6 @@ const css = csjs` 70% { top: -0.3em; } 100% { top: 0; } } - - - ` module.exports = css