From 06310659070a007fefdaa38b2dd50fb9e6cf0c98 Mon Sep 17 00:00:00 2001 From: d11e9 Date: Fri, 2 Oct 2015 16:18:19 +0100 Subject: [PATCH 01/21] multiple files --- index.html | 110 +++++++++++++++++++++++++++++-- stylesheets/browser-solidity.css | 61 ++++++++++++++++- 2 files changed, 165 insertions(+), 6 deletions(-) diff --git a/index.html b/index.html index 40db36629a..e523ef6b05 100644 --- a/index.html +++ b/index.html @@ -50,6 +50,9 @@ THE SOFTWARE.
+
+ + +
@@ -79,20 +82,119 @@ THE SOFTWARE. // ----------------- editor ---------------------- - var SOL_CACHE_KEY = "sol-cache"; + var SOL_CACHE_FILE = "Untitled.sol" + var SOL_CACHE_FILES_KEY = "sol-cache-files"; var editor = ace.edit("input"); var session = editor.getSession(); var Range = ace.require('ace/range').Range; var errMarkerId = null; - var solCache = window.localStorage.getItem( SOL_CACHE_KEY ); + var solFiles = JSON.parse( window.localStorage.getItem( SOL_CACHE_FILES_KEY ) ) || [SOL_CACHE_FILE]; + window.localStorage.setItem( SOL_CACHE_FILES_KEY, JSON.stringify( solFiles ) ); + + var solCache = window.localStorage.getItem( SOL_CACHE_FILE ); editor.setValue( solCache || BALLOT_EXAMPLE, 1 ); + session.setMode("ace/mode/javascript"); session.setTabSize(4); session.setUseSoftTabs(true); + // ----------------- file selector------------- + + var count = 0; + var $filesEl = $('#files'); + + $filesEl.on( 'click','.newFile', function(){ + count++; + var name = 'Unititled'+count+'.sol'; + solFiles.push( name ) + SOL_CACHE_FILE = name; + window.localStorage.setItem( SOL_CACHE_FILES_KEY, JSON.stringify( solFiles ) ); + window.localStorage.setItem( SOL_CACHE_FILE, '' ); + console.log('new file added: ', solFiles) + updateFiles(); + }) + + $filesEl.on( 'click','.file:not(.active)', showFileHandler ) + + $filesEl.on( 'click','.file.active', function(ev){ + var $fileTabEl = $(this) + var originalName = $fileTabEl.find('.name').text() + console.log("click active: ", originalName ) + ev.preventDefault() + if ($(this).find('input').length > 0 ) return false; + var $fileNameInputEl = $(''); + $fileTabEl.html( $fileNameInputEl ) + $fileNameInputEl.focus() + + $fileNameInputEl.on( 'blur', function(ev){ + ev.preventDefault() + var newName = ev.target.value; + var $new = null + if (confirm( "Are you sure you want to rename: " + originalName + " to " + newName + '?' )) { + + solFiles[solFiles.indexOf(originalName)] = newName + window.localStorage.setItem( newName, window.localStorage.getItem(originalName) ); + window.localStorage.setItem( SOL_CACHE_FILES_KEY, JSON.stringify( solFiles ) ); + window.localStorage.setItem( originalName, '') + SOL_CACHE_FILE = newName; + updateFiles() + } + + fileTabFromName(newName || originalName ).addClass('active') + return false; + }) + return false; + }) + + $filesEl.on( 'click','.file .remove', function(ev){ + ev.preventDefault(); + var name = $(this).parent().find('.name').text() + + if (confirm( "Are you sure you want to remove: " + name + " from local storage?" )) { + console.log("remove file, ", ev.target) + var index = solFiles.indexOf(name); + solFiles[index] = undefined; + window.localStorage.setItem( SOL_CACHE_FILES_KEY, JSON.stringify( solFiles ) ); + SOL_CACHE_FILE = solFiles[ Math.max(0, index - 1)] + window.localStorage.setItem( name, null) + updateFiles() + } + return false; + }) + + function showFileHandler (ev) { + ev.preventDefault() + SOL_CACHE_FILE = $(this).find('.name').text(); + console.log('click normal', SOL_CACHE_FILE, typeof window.localStorage.getItem( SOL_CACHE_FILE )) + updateFiles() + return false; + } + + function fileTabFromName(name) { + return $('#files .file').filter(function(){ return $(this).find('.name').text() == name; }) + } + + function updateFiles () { + console.log("Update files", solFiles, SOL_CACHE_FILE, typeof window.localStorage.getItem( SOL_CACHE_FILE ) ) + $filesEl.find('.file').remove() + for (var f in solFiles) { + if (solFiles[f]) $filesEl.append( fileTabTemplate(solFiles[f]) ); + } + var active = fileTabFromName(SOL_CACHE_FILE); + active.addClass('active') + editor.setValue( window.localStorage.getItem( SOL_CACHE_FILE ) || '', 1 ); + } + + function fileTabTemplate(name){ + return $(''+name+'x'); + } + + SOL_CACHE_FILE = solFiles[0] + updateFiles(); + // ----------------- version selector------------- // var soljsonSources is provided by bin/list.js @@ -209,7 +311,7 @@ THE SOFTWARE. var onChange = function() { var input = editor.getValue(); if (input === "") { - window.localStorage.setItem( SOL_CACHE_KEY, '' ) + window.localStorage.setItem( SOL_CACHE_FILE, '' ) return; } if (input === previousInput) @@ -288,7 +390,7 @@ THE SOFTWARE. }; var renderContracts = function(data, source) { - window.localStorage.setItem( SOL_CACHE_KEY, source ); + window.localStorage.setItem( SOL_CACHE_FILE, source ); $('#output').empty(); for (var contractName in data.contracts) { diff --git a/stylesheets/browser-solidity.css b/stylesheets/browser-solidity.css index 1d791a52a8..2994fc7270 100644 --- a/stylesheets/browser-solidity.css +++ b/stylesheets/browser-solidity.css @@ -10,12 +10,69 @@ body { width: auto; bottom: 0px; right: 37em; - } -#input { + +#files { font-size: 15px; + height: 2.5em; + box-sizing: border-box; + line-height: 2em; + padding: 0.5em 0.5em 0; +} + +#files .file, +#files .newFile { + display: inline-block; + padding: 0 0.6em; + box-sizing: border-box; + background-color: #f0f0f0; + cursor: pointer; + margin-right: 0.5em; + position: relative; +} + +#files .newFile { + background-color: #B1EAC5; + font-weight: bold; + color: #4E775D; +} + +#files .file.active { + font-weight: bold; + background-color: #F0F0F0; + border: 1px solid #BFBFBF; + box-shadow: 0 0 5px rgba(0,0,0,0.25); + border-bottom: 0 none; + padding-right: 2.5em; +} +#files .file .remove { position: absolute; + right: 0; top: 0; + height: 1.25em; + width: 1.25em; + line-height: 1em; + border-radius: 1em; + color: #FF8080; + display: none; + margin: 0.4em; + text-align: center; +} + +#files .file input { + background-color: transparent; + border: 0 none; + border-bottom: 1px dotted black; + line-height: 1em; + margin: 0.5em 0; +} + +#files .file.active .remove { display: inline-block; } + +#input { + font-size: 15px; + position: absolute; + top: 2.5em; left: 0; right: 0; bottom: 0; From 5eb10e8414d250008efe17a1725e08ffd07081e9 Mon Sep 17 00:00:00 2001 From: d11e9 Date: Fri, 2 Oct 2015 17:31:40 +0100 Subject: [PATCH 02/21] fix multiple files bugs --- index.html | 20 ++++++++------------ stylesheets/browser-solidity.css | 3 --- 2 files changed, 8 insertions(+), 15 deletions(-) diff --git a/index.html b/index.html index e523ef6b05..518c8bcf1a 100644 --- a/index.html +++ b/index.html @@ -93,11 +93,12 @@ THE SOFTWARE. var solFiles = JSON.parse( window.localStorage.getItem( SOL_CACHE_FILES_KEY ) ) || [SOL_CACHE_FILE]; window.localStorage.setItem( SOL_CACHE_FILES_KEY, JSON.stringify( solFiles ) ); - var solCache = window.localStorage.getItem( SOL_CACHE_FILE ); - editor.setValue( solCache || BALLOT_EXAMPLE, 1 ); + var solCache = window.localStorage.getItem( SOL_CACHE_FILE ) || BALLOT_EXAMPLE; + window.localStorage.setItem( SOL_CACHE_FILE, solCache ) + editor.setValue( solCache, 1 ); - session.setMode("ace/mode/javascript"); + session.setMode("ace/mode/javascript"); session.setTabSize(4); session.setUseSoftTabs(true); @@ -113,7 +114,6 @@ THE SOFTWARE. SOL_CACHE_FILE = name; window.localStorage.setItem( SOL_CACHE_FILES_KEY, JSON.stringify( solFiles ) ); window.localStorage.setItem( SOL_CACHE_FILE, '' ); - console.log('new file added: ', solFiles) updateFiles(); }) @@ -122,7 +122,6 @@ THE SOFTWARE. $filesEl.on( 'click','.file.active', function(ev){ var $fileTabEl = $(this) var originalName = $fileTabEl.find('.name').text() - console.log("click active: ", originalName ) ev.preventDefault() if ($(this).find('input').length > 0 ) return false; var $fileNameInputEl = $(''); @@ -135,10 +134,10 @@ THE SOFTWARE. var $new = null if (confirm( "Are you sure you want to rename: " + originalName + " to " + newName + '?' )) { - solFiles[solFiles.indexOf(originalName)] = newName + solFiles.splice( solFiles.indexOf(originalName), 1, newName ); window.localStorage.setItem( newName, window.localStorage.getItem(originalName) ); window.localStorage.setItem( SOL_CACHE_FILES_KEY, JSON.stringify( solFiles ) ); - window.localStorage.setItem( originalName, '') + window.localStorage.removeItem( originalName ) SOL_CACHE_FILE = newName; updateFiles() } @@ -154,12 +153,11 @@ THE SOFTWARE. var name = $(this).parent().find('.name').text() if (confirm( "Are you sure you want to remove: " + name + " from local storage?" )) { - console.log("remove file, ", ev.target) var index = solFiles.indexOf(name); - solFiles[index] = undefined; + solFiles.splice(index, 1 ); window.localStorage.setItem( SOL_CACHE_FILES_KEY, JSON.stringify( solFiles ) ); SOL_CACHE_FILE = solFiles[ Math.max(0, index - 1)] - window.localStorage.setItem( name, null) + window.localStorage.removeItem( name ) updateFiles() } return false; @@ -168,7 +166,6 @@ THE SOFTWARE. function showFileHandler (ev) { ev.preventDefault() SOL_CACHE_FILE = $(this).find('.name').text(); - console.log('click normal', SOL_CACHE_FILE, typeof window.localStorage.getItem( SOL_CACHE_FILE )) updateFiles() return false; } @@ -178,7 +175,6 @@ THE SOFTWARE. } function updateFiles () { - console.log("Update files", solFiles, SOL_CACHE_FILE, typeof window.localStorage.getItem( SOL_CACHE_FILE ) ) $filesEl.find('.file').remove() for (var f in solFiles) { if (solFiles[f]) $filesEl.append( fileTabTemplate(solFiles[f]) ); diff --git a/stylesheets/browser-solidity.css b/stylesheets/browser-solidity.css index 2994fc7270..1cc1eae2d4 100644 --- a/stylesheets/browser-solidity.css +++ b/stylesheets/browser-solidity.css @@ -39,9 +39,6 @@ body { #files .file.active { font-weight: bold; - background-color: #F0F0F0; - border: 1px solid #BFBFBF; - box-shadow: 0 0 5px rgba(0,0,0,0.25); border-bottom: 0 none; padding-right: 2.5em; } From 9a3352aa34a027597f2459c84e087beef7e46a16 Mon Sep 17 00:00:00 2001 From: d11e9 Date: Fri, 2 Oct 2015 18:10:08 +0100 Subject: [PATCH 03/21] allow imports from local files --- index.html | 29 ++++++++++++++++++++++++----- 1 file changed, 24 insertions(+), 5 deletions(-) diff --git a/index.html b/index.html index 518c8bcf1a..224b593443 100644 --- a/index.html +++ b/index.html @@ -80,12 +80,12 @@ THE SOFTWARE. + if (Module) + onCompilerLoaded(); + + editor.getSession().on('change', onChange); + + document.querySelector('#optimize').addEventListener('change', compile); + + // ----------------- compiler output renderer ---------------------- + var detailsOpen = {}; + + var renderError = function(message) { + $('#output') + .append($('
').text(message));
+			var err = message.match(/^:([0-9]*):([0-9]*)/)
+			if (err && err.length) {
+				var errLine = parseInt( err[1], 10 ) - 1;
+				var errCol = err[2] ? parseInt( err[2], 10 ) : 0;
+				sourceAnnotations[sourceAnnotations.length] ={
+					row: errLine,
+					column: errCol,
+					text: message,
+					type: "error"
+				};
+				editor.getSession().setAnnotations(sourceAnnotations);
+			}
+		};
+
+		var gethDeploy = function(contractName, interface, bytecode){
+			var code = "";
+			var funABI = getConstructorInterface($.parseJSON(interface));
+
+			$.each(funABI.inputs, function(i, inp) {
+				code += "var "+inp.name+" = /* var of type " + inp.type + " here */ ;\n";
+			});
+
+			code += "\nvar "+contractName+"Contract = web3.eth.contract("+interface.replace("\n","")+");"
+				+"\nvar "+contractName+" = "+contractName+"Contract.new(";
+			
+			$.each(funABI.inputs, function(i, inp) {
+				code += "\n   "+inp.name+",";
+			});
+						
+			code += "\n   {"+
+			"\n     from: web3.eth.accounts[0], "+
+			"\n     data: '"+bytecode+"', "+
+			"\n     gas: 1000000"+
+			"\n   }, function(e, contract){"+
+			"\n    if (typeof contract.address != 'undefined') {"+            
+			"\n         console.log(e, contract);"+
+			"\n         console.log('Contract mined! address: ' + contract.address + ' transactionHash: ' + contract.transactionHash);" +
+			"\n    }" +
+			"\n })";
+
+
+			return code;
+		};
+
+		var combined = function(contractName, interface, bytecode){
+			return JSON.stringify( [{name: contractName, interface: interface, bytecode: bytecode}]);
+
+		};
+
+		var renderContracts = function(data, source) {
+		window.localStorage.setItem( SOL_CACHE_FILE, source );
+
+			$('#output').empty();
+			for (var contractName in data.contracts) {
+				var contract = data.contracts[contractName];
+				var title = $('
').text(contractName);
+				var contractOutput = $('
')
+					.append(title);
+				var body = $('
')
+				contractOutput.append( body );
+				if (contract.bytecode.length > 0)
+					title.append($('
').text((contract.bytecode.length / 2) + ' bytes'))
+					body.append(getExecuteInterface(contract, contractName))
+						.append(tableRow('Bytecode', contract.bytecode));
+				body.append(tableRow('Interface', contract['interface']))
+					.append(textRow('Web3 deploy', gethDeploy(contractName.toLowerCase(),contract['interface'],contract.bytecode), 'deploy'))
+					.append(textRow('uDApp', combined(contractName,contract['interface'],contract.bytecode), 'deploy'))
+					.append(getDetails(contract, source, contractName));
+
+				$('#output').append(contractOutput);
+				title.click(function(ev){ $(this).parent().toggleClass('hide') });
+			}
+
+			$('.col2 input,textarea').click(function() { this.select(); } );
+		};
+		var tableRowItems = function(first, second, cls) {
+			return $('
')
+				.addClass(cls)
+				.append($('
').append(first))
+				.append($('
').append(second));
+		};
+		var tableRow = function(description, data) {
+			return tableRowItems(
+				$('').text(description),
+				$('').val(data));
+		};
+		var textRow = function(description, data, cls) {
+			return tableRowItems(
+				$('').text(description),
+				$('