Commit fb1bfc63 authored by chriseth's avatar chriseth

Merge pull request #133 from d11e9/storage.sync

Extension storage sync and updated query params and files
parents 456d4949 e9742449
...@@ -5,52 +5,100 @@ body { ...@@ -5,52 +5,100 @@ body {
font-weight: normal; font-weight: normal;
} }
#editor { #editor {
position: absolute; position: absolute;
top: 0; top: 0;
left: 0px; left: 0;
width: auto; width: auto;
bottom: 0px; bottom: 0;
right: 37em; right: 37em;
} }
.scroller {
position: absolute;
z-index: 999;
text-align: center;
cursor: pointer;
display: none;
padding: 0 0.9em;
vertical-align: middle;
background-color: rgba(255,255,255,0.8);
height: 100%;
font-size: 1.3em;
}
.scroller i {
line-height: 3em;
}
.scroller-right {
right: 0;
}
.scroller-left {
left: 0;
}
.files-wrapper {
position: absolute;
overflow: hidden;
top: 0;
left: 3em;
right: 3em;
}
#files { #files {
list-style: none;
margin: 0;
font-size: 15px; font-size: 15px;
height: 2.5em; height: 2.5em;
box-sizing: border-box; box-sizing: border-box;
line-height: 2em; line-height: 2em;
padding: 0.5em 0 0; padding: 0.5em 0 0;
position: relative;
left: 0;
top:0;
min-width:3000px;
border-bottom: 0 none;
} }
#files .file, #files .file {
#files .newFile {
display: inline-block; display: inline-block;
padding: 0 0.6em; padding: 0 0.6em;
box-sizing: border-box; box-sizing: border-box;
background-color: #f0f0f0; background-color: #F4F6FF;
cursor: pointer; cursor: pointer;
margin-right: 0.5em; border-right: 0.5em solid white;
position: relative; position: relative;
display:table-cell;
text-align: center;
vertical-align: middle;
color: #999;
} }
#files .newFile, .newFile,
#files .toggleRHP { .toggleRHP {
background-color: #B1EAC5; display: block;
float: left;
margin-top: 0.5em;
padding: 0.6em; padding: 0.6em;
font-weight: bold; font-weight: bold;
cursor: pointer; cursor: pointer;
color: black; color: black;
} }
#files .toggleRHP { .toggleRHP {
float: right; float: right;
width: 2em; position: absolute;
box-sizing: border-box; right: 0;
} }
#files .file.active { #files .file.active {
color: black;
font-weight: bold; font-weight: bold;
border-bottom: 0 none; border-bottom: 0 none;
padding-right: 2.5em; padding-right: 2em;
} }
#files .file .remove { #files .file .remove {
position: absolute; position: absolute;
...@@ -76,6 +124,8 @@ body { ...@@ -76,6 +124,8 @@ body {
#files .file.active .remove { display: inline-block; } #files .file.active .remove { display: inline-block; }
#input { #input {
border-top: 3px solid #F4F6FF;
padding-top: 0.5em;
font-size: 15px; font-size: 15px;
position: absolute; position: absolute;
top: 2.5em; top: 2.5em;
...@@ -93,42 +143,30 @@ body { ...@@ -93,42 +143,30 @@ body {
right: 0; right: 0;
bottom: 0px; bottom: 0px;
overflow: auto; overflow: auto;
border-left: 3px solid #efefef;
box-sizing: border-box; box-sizing: border-box;
} }
#output { #output {
border-top: 3px solid #efefef;
display: block; display: block;
} }
#header { #header {
font-size: 14px;
font-size: 12px; font-size: 12px;
} }
#header #helpButton {
float: left;
padding: 1.2em;
padding-left: 2.2em;
font-size: 1.5em;
cursor: pointer;
margin: auto;
color: #000;
outline: none;
}
#header #solIcon { #header #solIcon {
float: right; float: right;
height: 5.1em; height: 100%;
background-color: white; background-color: white;
} }
#header #menu { #header #menu {
border-bottom: 3px solid #F4F6FF;
overflow: hidden; overflow: hidden;
background-color: #efefef; height: 2em;
height: 5.1em; font-size: 1.25em;
padding-top: 0.5em;
box-sizing: content-box;
} }
...@@ -139,20 +177,26 @@ body { ...@@ -139,20 +177,26 @@ body {
} }
#header #options li { #header #options li {
color: #aaa;
float: left; float: left;
padding: 1.2em; padding: 0.5em 0.6em;
font-size: 1.5em; font-size: 1em;
cursor: pointer; cursor: pointer;
background-color: transparent;
margin-right: 0.5em;
} }
#header #options li.active { #header #options li.active {
color: black; background-color: #F4F6FF;
}
#header #options li a {
color: inherit;
} }
#header #optionViews { #header #optionViews {
clear: both; clear: both;
overflow: auto; overflow: auto;
background-color: #F4F6FF;
} }
#header #optionViews > div { #header #optionViews > div {
display: none; display: none;
...@@ -174,7 +218,7 @@ body { ...@@ -174,7 +218,7 @@ body {
#header #optionViews .pre { #header #optionViews .pre {
word-wrap: break-word; word-wrap: break-word;
background-color: #efefef; background-color: #C6CFF7;
font-family: monospace; font-family: monospace;
border-radius: 3px; border-radius: 3px;
display: inline-block; display: inline-block;
...@@ -193,7 +237,7 @@ body { ...@@ -193,7 +237,7 @@ body {
} }
#header #gist { #header #gist {
background-color: #efefef; background-color: #C6CFF7;
font-size: 12px; font-size: 12px;
padding: 0.25em; padding: 0.25em;
color: black; color: black;
...@@ -259,11 +303,11 @@ body { ...@@ -259,11 +303,11 @@ body {
#output .udapp { #output .udapp {
border: 0 none; border: 0 none;
box-shadow: none; box-shadow: none;
border-bottom: 3px solid #efefef; border-bottom: 3px solid #F4F6FF;
} }
.row { .crow {
overflow: auto; overflow: auto;
display: block; display: block;
clear: both; clear: both;
...@@ -297,7 +341,9 @@ body { ...@@ -297,7 +341,9 @@ body {
word-wrap: break-word; word-wrap: break-word;
cursor: pointer; cursor: pointer;
position: relative; position: relative;
margin: 0.25em; margin: 0.5em;
border-radius: 0.6em;
padding: 1em 1.5em;
} }
.sol.error pre, .sol.error pre,
...@@ -306,25 +352,26 @@ body { ...@@ -306,25 +352,26 @@ body {
margin: 0; margin: 0;
font-size: 10px; font-size: 10px;
border: 0 none; border: 0 none;
padding: 0;
border-radius: 0;
} }
.sol.error .close, .sol.error .close,
.sol.warning .close { .sol.warning .close {
font-weight: bold; font-weight: bold;
position: absolute; position: absolute;
color: rgba(0,0,0,0.5);
top: 0; top: 0;
right: 0; right: 0;
padding: 0.5em; padding: 0.5em;
} }
.sol.error { .sol.error {
background-color: rgba(255, 0, 0, 0.5); background-color: rgba(255, 0, 0, 0.4);
border: 1px solid #D00909;
} }
.sol.warning { .sol.warning {
background-color: rgba(210, 202, 36, 0.5); background-color: rgba(210, 202, 36, 0.4);
border: 1px solid #BBB427;
} }
#ghostbar { #ghostbar {
...@@ -338,17 +385,23 @@ body { ...@@ -338,17 +385,23 @@ body {
bottom: 0; bottom: 0;
} }
#dragbar{ #dragbar {
background-color: transparent; background-color: transparent;
position: absolute; position: absolute;
width: 10px; width: 1em;
right: -10px; right: -3px;
top: 0; top: 3em;
bottom: 0; bottom: 0;
cursor: col-resize; cursor: col-resize;
z-index: 999; z-index: 999;
border-right: 3px solid #F4F6FF;
} }
#editor .ace-tm .ace_gutter,
#editor .ace-tm .ace_gutter-active-line,
#editor .ace-tm .ace_marker-layer .ace_active-line {
background-color: rgba(225, 229, 251, 0.5);
}
input[readonly] { input[readonly] {
padding: .4em; padding: .4em;
......
...@@ -121,7 +121,7 @@ ...@@ -121,7 +121,7 @@
.udapp .instance { .udapp .instance {
padding: 0.4em; padding: 0.4em;
background-color: rgba(236, 215, 215, 0.43); background-color: rgb(244, 246, 255);
margin-bottom: 1em; margin-bottom: 1em;
position: relative; position: relative;
} }
......
This diff is collapsed.
chrome.browserAction.onClicked.addListener(function(tab) { chrome.browserAction.onClicked.addListener(function(tab) {
chrome.tabs.create({'url': chrome.extension.getURL('index.html')}, function(tab) {
// tab opened chrome.storage.sync.set({"chrome-app-sync": true});
});
chrome.tabs.create({'url': chrome.extension.getURL('index.html')}, function(tab) {
// tab opened
});
}); });
...@@ -33,10 +33,12 @@ ...@@ -33,10 +33,12 @@
<link rel="stylesheet" href="assets/css/universal-dapp.css"> <link rel="stylesheet" href="assets/css/universal-dapp.css">
<link rel="stylesheet" href="assets/css/browser-solidity.css"> <link rel="stylesheet" href="assets/css/browser-solidity.css">
<link rel="stylesheet" href="assets/css/font-awesome.min.css"> <link rel="stylesheet" href="assets/css/font-awesome.min.css">
<link rel="icon" type="x-icon" href="icon.png">
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no"> <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
<script src="https://ethereum.github.io/solc-bin/bin/list.js"></script> <script src="https://ethereum.github.io/solc-bin/bin/list.js"></script>
<script src="assets/js/jquery-2.1.3.min.js"></script> <script src="assets/js/jquery-2.1.3.min.js"></script>
<script src="bin/list.js"></script>
<script src="assets/js/ace.js"></script> <script src="assets/js/ace.js"></script>
<script src="assets/js/mode-solidity.js"></script> <script src="assets/js/mode-solidity.js"></script>
<script src="assets/js/ethereumjs-vm.js"></script> <script src="assets/js/ethereumjs-vm.js"></script>
...@@ -49,10 +51,13 @@ ...@@ -49,10 +51,13 @@
<div id="editor"> <div id="editor">
<div id="files"> <span class="newFile" title="New File"><i class="fa fa-file-code-o"></i></span>
<span class="newFile" title="New File"><i class="fa fa-file-text-o"></i></span> <div class="files-wrapper">
<span class="toggleRHP" title="Toggle right hand panel"><i class="fa fa-columns"></i></span> <div class="scroller scroller-left"><i class="fa fa-chevron-left "></i></div>
<div class="scroller scroller-right"><i class="fa fa-chevron-right "></i></div>
<ul id="files" class="nav nav-tabs"></ul>
</div> </div>
<span class="toggleRHP" title="Toggle right hand panel"><i class="fa fa-angle-double-right"></i></span>
<div id="input"></div> <div id="input"></div>
<div id="dragbar"></div> <div id="dragbar"></div>
</div> </div>
...@@ -61,40 +66,40 @@ ...@@ -61,40 +66,40 @@
<div id="header"> <div id="header">
<div id="menu"> <div id="menu">
<ul id="options"> <ul id="options">
<li class="settingsView active"><i class="fa fa-gear"></i></li> <li class="settingsView active" title="Settings"><i class="fa fa-gear"></i></li>
<li class="txView"><i class="fa fa-send"></i></li> <li class="txView" title="Transaction"><i class="fa fa-send"></i></li>
<li class="envView"><i class="fa fa-cube"></i></li> <li class="envView" title="Environment"><i class="fa fa-cube"></i></li>
<li class="publishView"><i class="fa fa-cloud-upload"></i></li> <li class="publishView" title="Publish" ><i class="fa fa-cloud-upload"></i></li>
<li id="helpButton"><a href="https://solidity.readthedocs.org" target="_blank" title="Open Documentation" class="fa fa-question"></a></li>
</ul> </ul>
<a href="https://solidity.readthedocs.org" target="_blank" id="helpButton" class="fa fa-question" title="Documentation" class="fa fa-question"></a>
<img id="solIcon" title="Solidity realtime compiler and runtime" src="assets/img/sol.svg" alt="Solidity realtime compiler and runtime"> <img id="solIcon" title="Solidity realtime compiler and runtime" src="assets/img/sol.svg" alt="Solidity realtime compiler and runtime">
</div> </div>
<div id="optionViews" class="settingsView"> <div id="optionViews" class="settingsView">
<div id="txView"> <div id="txView">
<div class="row"> <div class="crow">
<label for="txorigin"><select name="txorigin" id="txorigin"></select> Transaction origin</label> <label for="txorigin"><select name="txorigin" id="txorigin"></select> Transaction origin</label>
</div> </div>
<div class="row hide"> <div class="crow hide">
<label for="gas"><input type="number" id="gas" value="0"> Gas</label> <label for="gas"><input type="number" id="gas" value="0"> Gas</label>
</div> </div>
<div class="row hide"> <div class="crow hide">
<label for="gasPrice"><input type="number" id="gasPrice" value="0"> Gas Price</label> <label for="gasPrice"><input type="number" id="gasPrice" value="0"> Gas Price</label>
</div> </div>
<div class="row"> <div class="crow">
<label for="value"><input type="text" id="value" value="0"> Value (e.g. .7 ether or 5 wei, defaults to ether)</label> <label for="value"><input type="text" id="value" value="0"> Value (e.g. .7 ether or 5 wei, defaults to ether)</label>
</div> </div>
</div> </div>
<div id="settingsView"> <div id="settingsView">
<div class="version row"><strong>Solidity version:</strong> <span id="version">(loading)</span></div> <div class="version crow"><strong>Solidity version:</strong> <span id="version">(loading)</span></div>
<div class="row">Change to: <select id="versionSelector"></select></div> <div class="crow">Change to: <select id="versionSelector"></select></div>
<div class="row"> <div class="crow">
<label for="editorWrap"><input id="editorWrap" type="checkbox">Text Wrap</label> <label for="editorWrap"><input id="editorWrap" type="checkbox">Text Wrap</label>
<label for="optimize"><input id="optimize" type="checkbox">Enable Optimization</label> <label for="optimize"><input id="optimize" type="checkbox">Enable Optimization</label>
</div> </div>
</div> </div>
<div id="publishView"> <div id="publishView">
<p><button id="gist" title="Publish all files as public gist on github.com"><i class="fa fa-github"></i> Publish Gist</button> Publish all open files to an anonymous github gist.</p> <p><button id="gist" title="Publish all files as public gist on github.com"><i class="fa fa-github"></i> Publish Gist</button> Publish all open files to an anonymous github gist.</p>
<p>You can also load a gist by adding the following <span class="pre">?gist=GIST_ID</span> to your url, where GIST_ID is the id of the gist to load.</p> <p>You can also load a gist by adding the following <span class="pre">#gist=GIST_ID</span> to your url, where GIST_ID is the id of the gist to load.</p>
</div> </div>
<div id="envView"> <div id="envView">
<span id="executionContext"> <span id="executionContext">
......
...@@ -5,24 +5,28 @@ ...@@ -5,24 +5,28 @@
"description": "Realtime compiler and runtime", "description": "Realtime compiler and runtime",
"devtools_page": "devtools.html", "devtools_page": "devtools.html",
"update_url": "https://chriseth.github.io/browser-solidity/", "update_url": "https://chriseth.github.io/browser-solidity/",
"version": "1.0", "version": "1.1",
"manifest_version": 2, "manifest_version": 2,
"background": { "background": {
"scripts": ["background.js"], "scripts": ["background.js"],
"persistent": true "persistent": true
}, },
"icons": {
"32": "icon.png"
},
"browser_action": { "browser_action": {
"default_icon": "icon.png" "default_icon": "icon.png"
}, },
"permissions": [ "permissions": [
"storage",
"tabs", "tabs",
"activeTab", "activeTab",
"https://ajax.googleapis.com/", "https://ajax.googleapis.com/",
"webRequest", "webRequest",
"webRequestBlocking", "webRequestBlocking",
"\u003Call_urls>", "\u003Call_urls>"
"storage"
] ]
} }
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment