Merge pull request #1807 from ethereum/variousFixesOnExplorer

Various fixes on explorer

src/app.js

@@ -17,7 +17,6 @@ var GistHandler = require('./lib/gist-handler')
 var helper = require('./lib/helper')
 var Storage = remixLib.Storage
 var Browserfiles = require('./app/files/browser-files')
-var BrowserfilesTree = require('./app/files/browser-files-tree')
 var SharedFolder = require('./app/files/shared-folder')
 var Config = require('./config')
 var Renderer = require('./app/ui/renderer')
@@ -140,10 +139,7 @@ class App extends ApiFactory {
 
     self._components.filesProviders = {}
     self._components.filesProviders['browser'] = new Browserfiles(fileStorage)
-    self._components.filesProviders['config'] = new BrowserfilesTree('config', configStorage)
-    self._components.filesProviders['config'].init()
     registry.put({api: self._components.filesProviders['browser'], name: 'fileproviders/browser'})
-    registry.put({api: self._components.filesProviders['config'], name: 'fileproviders/config'})
 
     var remixd = new Remixd(65520)
     registry.put({api: remixd, name: 'remixd'})
@@ -416,7 +412,7 @@ Please make a backup of your contracts and start using http://remix.ethereum.org
   const swapPanelApi = new SwapPanelApi(swapPanelComponent, verticalIconsComponent) // eslint-disable-line
   const mainPanelApi = new SwapPanelApi(mainPanelComponent, verticalIconsComponent) // eslint-disable-line
   const verticalIconsApi = new VerticalIconsApi(verticalIconsComponent) // eslint-disable-line
-
+  registry.put({api: verticalIconsApi, name: 'verticalicon'})
   registry.put({api: appManager.proxy(), name: 'pluginmanager'})
 
   pluginManagerComponent.setApp(appManager)
@@ -465,7 +461,6 @@ Please make a backup of your contracts and start using http://remix.ethereum.org
     compileTab
   )
   let sourceHighlighters = registry.get('editor').api.sourceHighlighters
-  let configProvider = self._components.filesProviders['config']
 
   appManager.init([
     this.api(),
@@ -473,7 +468,6 @@ Please make a backup of your contracts and start using http://remix.ethereum.org
     udapp.api(),
     fileManager.api(),
     sourceHighlighters.api(),
-    configProvider.api(),
     txListenerModule.api(),
     filePanel.api(),
     // { profile: support.profile(), api: support },

src/app/components/vertical-icons-component.js

@@ -38,7 +38,7 @@ class VerticalIconComponent {
     if (!api.events) return
     let fn = this.iconStatus[api.profile.name]
     if (fn) {
-      api.events.remove('statusChanged', fn)
+      api.events.removeListener('statusChanged', fn)
       delete this.iconStatus[api.profile.name]
     }
   }

src/app/files/file-explorer.js

@@ -210,24 +210,9 @@ function fileExplorer (localRegistry, files, menuItems) {
   self.treeView.event.register('nodeClick', function (path, childrenContainer) {
     if (!childrenContainer) return
     if (childrenContainer.style.display === 'none') return
-
+    self.updatePath(path)
-    files.resolveDirectory(path, (error, fileTree) => {
-      if (error) console.error(error)
-      if (!fileTree) return
-      var newTree = normalize(path, fileTree)
-      self.treeView.updateNodeFromJSON(path, newTree, true)
-    })
   })
 
-  function normalize (path, filesList) {
-    var prefix = path.split('/')[0]
-    var newList = {}
-    Object.keys(filesList).forEach(key => {
-      newList[prefix + '/' + key] = filesList[key].isDirectory ? {} : { '/content': true }
-    })
-    return newList
-  }
-
   // register to main app, trigger when the current file in the editor changed
   self._deps.fileManager.events.on('currentFileChanged', (newFile) => {
     const explorer = self._deps.fileManager.fileProviderOf(newFile)
@@ -310,6 +295,15 @@ function fileExplorer (localRegistry, files, menuItems) {
   }
 }
 
+fileExplorer.prototype.updatePath = function (path) {
+  this.files.resolveDirectory(path, (error, fileTree) => {
+    if (error) console.error(error)
+    if (!fileTree) return
+    var newTree = normalize(path, fileTree)
+    this.treeView.updateNodeFromJSON(path, newTree, true)
+  })
+}
+
 fileExplorer.prototype.hide = function () {
   if (this.container) this.container.style.display = 'none'
 }
@@ -547,7 +541,17 @@ fileExplorer.prototype.ensureRoot = function (cb) {
     self.container.appendChild(element)
     self.element = element
     if (cb) cb()
+    self.treeView.expand(self.files.type)
+  })
+}
+
+function normalize (path, filesList) {
+  var prefix = path.split('/')[0]
+  var newList = {}
+  Object.keys(filesList).forEach(key => {
+    newList[prefix + '/' + key] = filesList[key].isDirectory ? {} : { '/content': true }
   })
+  return newList
 }
 
 module.exports = fileExplorer

src/app/files/fileManager.js

@@ -26,18 +26,15 @@ class FileManager extends ApiFactory {
       config: this._components.registry.get('config').api,
       browserExplorer: this._components.registry.get('fileproviders/browser').api,
       localhostExplorer: this._components.registry.get('fileproviders/localhost').api,
-      configExplorer: this._components.registry.get('fileproviders/config').api,
       gistExplorer: this._components.registry.get('fileproviders/gist').api,
       filesProviders: this._components.registry.get('fileproviders').api
     }
 
     this._deps.browserExplorer.event.register('fileRenamed', (oldName, newName, isFolder) => { this.fileRenamedEvent(oldName, newName, isFolder) })
     this._deps.localhostExplorer.event.register('fileRenamed', (oldName, newName, isFolder) => { this.fileRenamedEvent(oldName, newName, isFolder) })
-    this._deps.configExplorer.event.register('fileRenamed', (oldName, newName, isFolder) => { this.fileRenamedEvent(oldName, newName, isFolder) })
     this._deps.gistExplorer.event.register('fileRenamed', (oldName, newName, isFolder) => { this.fileRenamedEvent(oldName, newName, isFolder) })
     this._deps.browserExplorer.event.register('fileRemoved', (path) => { this.fileRemovedEvent(path) })
     this._deps.localhostExplorer.event.register('fileRemoved', (path) => { this.fileRemovedEvent(path) })
-    this._deps.configExplorer.event.register('fileRemoved', (path) => { this.fileRemovedEvent(path) })
     this._deps.gistExplorer.event.register('fileRemoved', (path) => { this.fileRemovedEvent(path) })
     this._deps.localhostExplorer.event.register('errored', (event) => { this.removeTabsOf(this._deps.localhostExplorer) })
     this._deps.localhostExplorer.event.register('closed', (event) => { this.removeTabsOf(this._deps.localhostExplorer) })
@@ -192,8 +189,8 @@ class FileManager extends ApiFactory {
         if (fileList.length) {
           _switchFile(browserProvider.type + '/' + fileList[0])
         } else {
-          this.events.emit('currentFileChanged')
           this._deps.editor.displayEmptyReadOnlySession()
+          this.events.emit('noFileSelected')
         }
       })
     }

src/app/panels/editor-panel.js

@@ -127,7 +127,7 @@ class EditorPanel {
       if (delta === undefined) {
         layout.show = !layout.show
         if (layout.show) delta = layout.offset
-        else delta = containerHeight
+        else delta = 0
       } else {
         layout.show = true
         self._deps.config.set(`terminal-${direction}-offset`, delta)

src/app/panels/file-panel.js

@@ -47,7 +47,6 @@ module.exports = class Filepanel extends ApiFactory {
     var swarmExplorer = new FileExplorer(self._components.registry, self._deps.fileProviders['swarm'])
     var githubExplorer = new FileExplorer(self._components.registry, self._deps.fileProviders['github'])
     var gistExplorer = new FileExplorer(self._components.registry, self._deps.fileProviders['gist'], ['updateGist'])
-    var configExplorer = new FileExplorer(self._components.registry, self._deps.fileProviders['config'])
     var httpExplorer = new FileExplorer(self._components.registry, self._deps.fileProviders['http'])
     var httpsExplorer = new FileExplorer(self._components.registry, self._deps.fileProviders['https'])
 
@@ -72,7 +71,6 @@ module.exports = class Filepanel extends ApiFactory {
           <div class="${css.fileexplorer}">           
             <div>
               <div class=${css.treeview}>${fileExplorer.init()}</div>
-              <div class="configexplorer ${css.treeview}">${configExplorer.init()}</div>
               <div class="filesystemexplorer ${css.treeview}">${fileSystemExplorer.init()}</div>
               <div class="swarmexplorer ${css.treeview}">${swarmExplorer.init()}</div>
               <div class="githubexplorer ${css.treeview}">${githubExplorer.init()}</div>
@@ -89,7 +87,6 @@ module.exports = class Filepanel extends ApiFactory {
     self.event = event
     var element = template()
     fileExplorer.ensureRoot()
-    configExplorer.ensureRoot()
     self._deps.fileProviders['localhost'].event.register('connecting', (event) => {
     })
 
@@ -109,10 +106,6 @@ module.exports = class Filepanel extends ApiFactory {
       self._deps.fileManager.switchFile(path)
     })
 
-    configExplorer.events.register('focus', function (path) {
-      self._deps.fileManager.switchFile(path)
-    })
-
     fileSystemExplorer.events.register('focus', function (path) {
       self._deps.fileManager.switchFile(path)
     })

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

@@ -1,3 +1,5 @@
+let globalRegistry = require('../../../global/registry')
+
 export class Workspace {
   constructor (title, description, isMain, activate, deactivate) {
     this.title = title
@@ -19,6 +21,8 @@ export const defaultWorkspaces = (appManager) => {
         appManager.ensureActivated('run')
         appManager.ensureActivated('solidityStaticAnalysis')
         appManager.ensureActivated('solidityUnitTesting')
+        globalRegistry.get('filemanager').api.switchFile()
+        globalRegistry.get('verticalicon').api.select('solidity')
       }, () => {}),
     new Workspace(
       'Vyper',
@@ -27,6 +31,8 @@ export const defaultWorkspaces = (appManager) => {
       () => {
         appManager.ensureActivated('vyper')
         appManager.ensureActivated('run')
+        globalRegistry.get('filemanager').api.switchFile()
+        globalRegistry.get('verticalicon').api.select('vyper')
       }, () => {}),
     new Workspace('Debugger', 'Debug transactions with remix', false, () => {
       appManager.ensureActivated('debugger')

src/framingService.js

@@ -13,6 +13,5 @@ export default {
 
     verticalIconApi.select('fileExplorers')
     mainPanelApi.showContent('home')
-    resizeFeature.minimize()
   }
 }

test-browser/helpers/init.js

@@ -19,7 +19,7 @@ module.exports = function (browser, callback) {
 function initModules (browser, callback) {
   browser.click('#icon-panel div[plugin="pluginManager"]')
   .execute(function () {
-    document.querySelector('div[title="pluginManager"]').scrollTop = document.querySelector('div[title="pluginManager"]').scrollHeight
+    document.querySelector('div[id="pluginManager"]').scrollTop = document.querySelector('div[id="pluginManager"]').scrollHeight
   }, [], function () {
     browser.click('#pluginManager article[title="solidity"] button')
     .click('#pluginManager article[title="run"] button')

test-browser/tests/simpleContract.js

@@ -25,7 +25,6 @@ function runTests (browser) {
     .waitForElementVisible('#icon-panel', 10000)
     .clickLaunchIcon('solidity')
     .clickLaunchIcon('fileExplorers')
-    .click('#swap-panel label[data-path="browser"]')
     .perform(() => {
       // the first fn is used to pass browser to the other ones.
       async.waterfall([function (callback) { callback(null, browser) },