/* global alert, confirm, prompt, Option, Worker, chrome */ 'use strict' var async = require('async') var $ = require('jquery') var base64 = require('js-base64').Base64 var swarmgw = require('swarmgw') var csjs = require('csjs-inject') var QueryParams = require('./app/query-params') var queryParams = new QueryParams() var GistHandler = require('./app/gist-handler') var gistHandler = new GistHandler() var Remixd = require('./lib/remixd') var Storage = require('./app/files/storage') var Browserfiles = require('./app/files/browser-files') var SharedFolder = require('./app/files/shared-folder') var Config = require('./app/config') var Editor = require('./app/editor') var Renderer = require('./app/renderer') var Compiler = require('./app/compiler') var ExecutionContext = require('./app/execution-context') var UniversalDApp = require('./universal-dapp.js') var Debugger = require('./app/debugger') var EventManager = require('ethereum-remix').lib.EventManager var StaticAnalysis = require('./app/staticanalysis/staticAnalysisView') var OffsetToLineColumnConverter = require('./lib/offsetToLineColumnConverter') var FilePanel = require('./app/file-panel') var RighthandPanel = require('./app/righthand-panel') var examples = require('./app/example-contracts') // The event listener needs to be registered as early as possible, because the // parent will send the message upon the "load" event. var filesToLoad = null var loadFilesCallback = function (files) { filesToLoad = files } // will be replaced later window.addEventListener('message', function (ev) { if (typeof ev.data === typeof [] && ev.data[0] === 'loadFiles') { loadFilesCallback(ev.data[1]) } }, false) var run = function () { var self = this this.event = new EventManager() var fileStorage = new Storage('sol:') var config = new Config(fileStorage) var remixd = new Remixd() var filesProviders = {} filesProviders['browser'] = new Browserfiles(fileStorage) filesProviders['localhost'] = new SharedFolder(remixd) var tabbedFiles = {} // list of files displayed in the tabs bar // return all the files, except the temporary/readonly ones.. package only files from the browser storage. function packageFiles (cb) { var ret = {} var files = filesProviders['browser'] var filtered = Object.keys(files.list()).filter(function (path) { if (!files.isReadOnly(path)) { return path } }) async.eachSeries(filtered, function (path, cb) { ret[path] = { content: files.get(path) } cb() }, () => { cb(ret) }) } function createNonClashingName (path) { var counter = '' if (path.endsWith('.sol')) path = path.substring(0, path.lastIndexOf('.sol')) while (filesProviders['browser'].exists(path + counter + '.sol')) { counter = (counter | 0) + 1 } return path + counter + '.sol' } // Add files received from remote instance (i.e. another browser-solidity) function loadFiles (filesSet) { for (var f in filesSet) { filesProviders['browser'].set(createNonClashingName(f), filesSet[f].content) } switchToNextFile() } // Replace early callback with instant response loadFilesCallback = function (files) { loadFiles(files) } // Run if we did receive an event from remote instance while starting up if (filesToLoad !== null) { loadFiles(filesToLoad) } // ------------------ gist load ---------------- var loadingFromGist = gistHandler.handleLoad(queryParams.get(), function (gistId) { $.ajax({ url: 'https://api.github.com/gists/' + gistId, jsonp: 'callback', dataType: 'jsonp', success: function (response) { if (response.data) { if (!response.data.files) { alert('Gist load error: ' + response.data.message) return } loadFiles(response.data.files) } } }) }) // insert ballot contract if there are no files available if (!loadingFromGist && Object.keys(filesProviders['browser'].list()).length === 0) { if (!filesProviders['browser'].set(examples.ballot.name, examples.ballot.content)) { alert('Failed to store example contract in browser. Remix will not work properly. Please ensure Remix has access to LocalStorage. Safari in Private mode is known not to work.') } } // ----------------- Chrome cloud storage sync -------------------- function chromeCloudSync () { if (typeof chrome === 'undefined' || !chrome || !chrome.storage || !chrome.storage.sync) { return } var obj = {} var done = false var count = 0 function check (key) { chrome.storage.sync.get(key, function (resp) { console.log('comparing to cloud', key, resp) if (typeof resp[key] !== 'undefined' && obj[key] !== resp[key] && confirm('Overwrite "' + key + '"? Click Ok to overwrite local file with file from cloud. Cancel will push your local file to the cloud.')) { console.log('Overwriting', key) filesProviders['browser'].set(key, resp[key]) } else { console.log('add to obj', obj, key) filesProviders['browser'].get(key, (error, content) => { if (error) { console.log(error) } else { obj[key] = content } }) } done++ if (done >= count) { chrome.storage.sync.set(obj, function () { console.log('updated cloud files with: ', obj, this, arguments) }) } }) } for (var y in filesProviders['browser'].list()) { console.log('checking', y) filesProviders['browser'].get(y, (error, content) => { if (error) { console.log(error) } else { obj[y] = content count++ check(y) } }) } } window.syncStorage = chromeCloudSync chromeCloudSync() // ---------------- FilePanel -------------------- // TODO: All FilePanel related CSS should move into file-panel.js // app.js provides file-panel.js with a css selector or a DOM element // and file-panel.js adds its elements (including css), see "Editor" above var css = csjs` .filepanel-container { display : flex; width : 200px; } ` var filepanelContainer = document.querySelector('#filepanel') filepanelContainer.className = css['filepanel-container'] var FilePanelAPI = { createName: createNonClashingName, switchToFile: switchToFile, event: this.event, editorFontSize: function (incr) { editor.editorFontSize(incr) }, currentFile: function () { return config.get('currentFile') }, currentContent: function () { return editor.get(config.get('currentFile')) }, setText: function (text) { editor.setText(text) } } var filePanel = new FilePanel(FilePanelAPI, filesProviders) // TODO this should happen inside file-panel.js filepanelContainer.appendChild(filePanel) filePanel.events.register('ui-hidden', function changeLayout (isHidden) { var value if (isHidden) { value = -parseInt(window['filepanel'].style.width) value = (isNaN(value) ? -window['filepanel'].getBoundingClientRect().width : value) window['filepanel'].style.position = 'absolute' window['filepanel'].style.left = (value - 5) + 'px' window['filepanel'].style.width = -value + 'px' window['tabs-bar'].style.left = '45px' } else { value = -parseInt(window['filepanel'].style.left) + 'px' window['filepanel'].style.position = 'static' window['filepanel'].style.width = value window['filepanel'].style.left = '' window['tabs-bar'].style.left = value } }) filePanel.events.register('ui-resize', function changeLayout (width) { window['filepanel'].style.width = width + 'px' window['tabs-bar'].style.left = width + 'px' }) function fileRenamedEvent (oldName, newName, isFolder) { // TODO please never use 'window' when it is possible to use a variable // that references the DOM node [...window.files.querySelectorAll('.file .name')].forEach(function (span) { if (span.innerText === oldName) span.innerText = newName }) if (!isFolder) { config.set('currentFile', '') editor.discard(oldName) if (tabbedFiles[oldName]) { delete tabbedFiles[oldName] tabbedFiles[newName] = newName } switchToFile(newName) } else { var newFocus for (var k in tabbedFiles) { if (k.indexOf(oldName + '/') === 0) { var newAbsolutePath = k.replace(oldName, newName) tabbedFiles[newAbsolutePath] = newAbsolutePath delete tabbedFiles[k] if (config.get('currentFile') === k) { newFocus = newAbsolutePath } } } if (newFocus) { switchToFile(newFocus) } } refreshTabs() } filesProviders['browser'].event.register('fileRenamed', fileRenamedEvent) filesProviders['localhost'].event.register('fileRenamed', fileRenamedEvent) function fileRemovedEvent (path) { if (path === config.get('currentFile')) { config.set('currentFile', '') switchToNextFile() } editor.discard(path) delete tabbedFiles[path] refreshTabs() } filesProviders['browser'].event.register('fileRemoved', fileRemovedEvent) filesProviders['localhost'].event.register('fileRemoved', fileRemovedEvent) // ------------------ gist publish -------------- $('#gist').click(function () { if (confirm('Are you sure you want to publish all your files anonymously as a public gist on github.com?')) { packageFiles((error, packaged) => { if (error) { console.log(error) } else { var description = 'Created using browser-solidity: Realtime Ethereum Contract Compiler and Runtime. \n Load this file by pasting this gists URL or ID at https://ethereum.github.io/browser-solidity/#version=' + queryParams.get().version + '&optimize=' + queryParams.get().optimize + '&gist=' $.ajax({ url: 'https://api.github.com/gists', type: 'POST', data: JSON.stringify({ description: description, public: true, files: packaged }) }).done(function (response) { if (response.html_url && confirm('Created a gist at ' + response.html_url + ' Would you like to open it in a new window?')) { window.open(response.html_url, '_blank') } }).fail(function (xhr, text, err) { alert('Failed to create gist: ' + (err || 'Unknown transport error')) }) } }) } }) $('#copyOver').click(function () { var target = prompt( 'To which other browser-solidity instance do you want to copy over all files?', 'https://ethereum.github.io/browser-solidity/' ) if (target === null) { return } packageFiles((error, packaged) => { if (error) { console.log(error) } else { $('