Skip to content
Projects
Groups
Snippets
Help
This project
Loading...
Sign in / Register
Toggle navigation
B
baas-ide
Project
Project
Details
Activity
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Board
Labels
Milestones
JIRA
JIRA
Merge Requests
1
Merge Requests
1
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Registry
Registry
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
guxukai
baas-ide
Commits
e5469454
Unverified
Commit
e5469454
authored
Jan 25, 2019
by
Levi Barnes
Committed by
GitHub
Jan 25, 2019
Browse files
Options
Browse Files
Download
Plain Diff
Merge pull request #1 from ethereum/master
Sync with main repo
parents
d4d91b8b
bab2fb1e
Show whitespace changes
Inline
Side-by-side
Showing
19 changed files
with
457 additions
and
453 deletions
+457
-453
app.js
src/app.js
+44
-4
contractParser.js
src/app/contract/contractParser.js
+2
-31
staticAnalysisView.js
src/app/staticanalysis/staticAnalysisView.js
+17
-22
analysis-tab.js
src/app/tabs/analysis-tab.js
+13
-33
debugger-tab.js
src/app/tabs/debugger-tab.js
+7
-29
plugin-tab.js
src/app/tabs/plugin-tab.js
+15
-27
run-tab.js
src/app/tabs/run-tab.js
+102
-135
dropdownlogic.js
src/app/tabs/runTab/model/dropdownlogic.js
+2
-2
recorder.js
src/app/tabs/runTab/model/recorder.js
+7
-0
recorder.js
src/app/tabs/runTab/recorder.js
+6
-7
analysis-tab-styles.js
src/app/tabs/styles/analysis-tab-styles.js
+12
-0
debugger-tab-styles.js
src/app/tabs/styles/debugger-tab-styles.js
+14
-0
plugin-tab-styles.js
src/app/tabs/styles/plugin-tab-styles.js
+15
-0
support-tab-styles.js
src/app/tabs/styles/support-tab-styles.js
+84
-0
tabbed-menu-styles.js
src/app/tabs/styles/tabbed-menu-styles.js
+42
-0
test-tab-styles.js
src/app/tabs/styles/test-tab-styles.js
+6
-1
support-tab.js
src/app/tabs/support-tab.js
+30
-113
tabbed-menu.js
src/app/tabs/tabbed-menu.js
+3
-40
test-tab.js
src/app/tabs/test-tab.js
+36
-9
No files found.
src/app.js
View file @
e5469454
'use strict'
'use strict'
var
$
=
require
(
'jquery'
)
var
csjs
=
require
(
'csjs-inject'
)
var
csjs
=
require
(
'csjs-inject'
)
var
yo
=
require
(
'yo-yo'
)
var
yo
=
require
(
'yo-yo'
)
var
async
=
require
(
'async'
)
var
async
=
require
(
'async'
)
...
@@ -423,14 +424,53 @@ Please make a backup of your contracts and start using http://remix.ethereum.org
...
@@ -423,14 +424,53 @@ Please make a backup of your contracts and start using http://remix.ethereum.org
let
compileTab
=
new
CompileTab
(
self
.
_components
.
registry
)
let
compileTab
=
new
CompileTab
(
self
.
_components
.
registry
)
let
tabs
=
{
let
tabs
=
{
compile
:
compileTab
,
compile
:
compileTab
,
run
:
new
RunTab
(
self
.
_components
.
registry
),
run
:
new
RunTab
(
registry
.
get
(
'udapp'
).
api
,
registry
.
get
(
'udappUI'
).
api
,
registry
.
get
(
'config'
).
api
,
registry
.
get
(
'filemanager'
).
api
,
registry
.
get
(
'editor'
).
api
,
registry
.
get
(
'logCallback'
).
api
,
registry
.
get
(
'filepanel'
).
api
,
registry
.
get
(
'pluginmanager'
).
api
,
registry
.
get
(
'compilersartefacts'
).
api
),
settings
:
new
SettingsTab
(
self
.
_components
.
registry
),
settings
:
new
SettingsTab
(
self
.
_components
.
registry
),
analysis
:
new
AnalysisTab
(
self
.
_components
.
registry
),
analysis
:
new
AnalysisTab
(
registry
),
debug
:
new
DebuggerTab
(
self
.
_components
.
registry
),
debug
:
new
DebuggerTab
(),
support
:
new
SupportTab
(
self
.
_components
.
registry
),
support
:
new
SupportTab
(),
test
:
new
TestTab
(
self
.
_components
.
registry
,
compileTab
)
test
:
new
TestTab
(
self
.
_components
.
registry
,
compileTab
)
}
}
registry
.
get
(
'app'
).
api
.
event
.
register
(
'tabChanged'
,
(
tabName
)
=>
{
if
(
tabName
===
'Support'
)
tabs
.
support
.
loadTab
()
})
let
transactionContextAPI
=
{
getAddress
:
(
cb
)
=>
{
cb
(
null
,
$
(
'#txorigin'
).
val
())
},
getValue
:
(
cb
)
=>
{
try
{
var
number
=
document
.
querySelector
(
'#value'
).
value
var
select
=
document
.
getElementById
(
'unit'
)
var
index
=
select
.
selectedIndex
var
selectedUnit
=
select
.
querySelectorAll
(
'option'
)[
index
].
dataset
.
unit
var
unit
=
'ether'
// default
if
([
'ether'
,
'finney'
,
'gwei'
,
'wei'
].
indexOf
(
selectedUnit
)
>=
0
)
{
unit
=
selectedUnit
}
cb
(
null
,
executionContext
.
web3
().
toWei
(
number
,
unit
))
}
catch
(
e
)
{
cb
(
e
)
}
},
getGasLimit
:
(
cb
)
=>
{
cb
(
null
,
$
(
'#gasLimit'
).
val
())
}
}
udapp
.
resetAPI
(
transactionContextAPI
)
// ---------------- Righthand-panel --------------------
// ---------------- Righthand-panel --------------------
self
.
_components
.
righthandpanel
=
new
RighthandPanel
({
tabs
,
pluginManager
})
self
.
_components
.
righthandpanel
=
new
RighthandPanel
({
tabs
,
pluginManager
})
self
.
_view
.
rightpanel
.
appendChild
(
self
.
_components
.
righthandpanel
.
render
())
self
.
_view
.
rightpanel
.
appendChild
(
self
.
_components
.
righthandpanel
.
render
())
...
...
src/app/contract/contractParser.js
View file @
e5469454
'use strict'
'use strict'
var
solcTranslate
=
require
(
'solc/translate'
)
var
remixLib
=
require
(
'remix-lib'
)
var
remixLib
=
require
(
'remix-lib'
)
var
txHelper
=
remixLib
.
execution
.
txHelper
var
txHelper
=
remixLib
.
execution
.
txHelper
...
@@ -42,7 +43,7 @@ var getDetails = function (contractName, contract, source) {
...
@@ -42,7 +43,7 @@ var getDetails = function (contractName, contract, source) {
}
}
if
(
source
&&
contract
.
assembly
!==
null
)
{
if
(
source
&&
contract
.
assembly
!==
null
)
{
detail
[
'Assembly'
]
=
formatAssemblyText
(
contract
.
evm
.
legacyAssembly
,
''
,
source
.
content
)
detail
[
'Assembly'
]
=
solcTranslate
.
prettyPrintLegacyAssemblyJSON
(
contract
.
evm
.
legacyAssembly
,
source
.
content
)
}
}
return
detail
return
detail
...
@@ -58,36 +59,6 @@ var retrieveMetadataHash = function (bytecode) {
...
@@ -58,36 +59,6 @@ var retrieveMetadataHash = function (bytecode) {
}
}
}
}
var
formatAssemblyText
=
function
(
asm
,
prefix
,
source
)
{
if
(
typeof
asm
===
typeof
''
||
asm
===
null
||
asm
===
undefined
)
{
return
prefix
+
asm
+
'
\
n'
}
var
text
=
prefix
+
'.code
\
n'
asm
[
'.code'
].
forEach
(
function
(
item
,
_i
)
{
var
v
=
item
.
value
===
undefined
?
''
:
item
.
value
var
src
=
''
if
(
item
.
begin
!==
undefined
&&
item
.
end
!==
undefined
)
{
src
=
source
.
slice
(
item
.
begin
,
item
.
end
).
replace
(
'
\
n'
,
'
\\
n'
,
'g'
)
}
if
(
src
.
length
>
30
)
{
src
=
src
.
slice
(
0
,
30
)
+
'...'
}
if
(
item
.
name
!==
'tag'
)
{
text
+=
' '
}
text
+=
prefix
+
item
.
name
+
' '
+
v
+
'
\
t
\
t
\
t'
+
src
+
'
\
n'
})
text
+=
prefix
+
'.data
\
n'
let
asmData
=
(
asm
[
'.data'
]
||
[])
for
(
let
i
in
asmData
)
{
let
item
=
asmData
[
i
]
text
+=
' '
+
prefix
+
''
+
i
+
':
\
n'
text
+=
formatAssemblyText
(
item
,
prefix
+
' '
,
source
)
}
return
text
}
var
gethDeploy
=
function
(
contractName
,
jsonInterface
,
bytecode
)
{
var
gethDeploy
=
function
(
contractName
,
jsonInterface
,
bytecode
)
{
var
code
=
''
var
code
=
''
var
funABI
=
txHelper
.
getConstructorInterface
(
jsonInterface
)
var
funABI
=
txHelper
.
getConstructorInterface
(
jsonInterface
)
...
...
src/app/staticanalysis/staticAnalysisView.js
View file @
e5469454
...
@@ -50,7 +50,7 @@ staticAnalysisView.prototype.render = function () {
...
@@ -50,7 +50,7 @@ staticAnalysisView.prototype.render = function () {
${
this
.
modulesView
}
${
this
.
modulesView
}
</div>
</div>
<div class="
${
css
.
buttons
}
">
<div class="
${
css
.
buttons
}
">
<button class=
${
css
.
buttonRun
}
onclick=
${
function
()
{
self
.
run
()
}
}
>Run</button>
<button class=
"
${
css
.
buttonRun
}
" onclick="
${
function
()
{
self
.
run
()
}
}"
>Run</button>
<label class="
${
css
.
label
}
" for="autorunstaticanalysis">
<label class="
${
css
.
label
}
" for="autorunstaticanalysis">
<input id="autorunstaticanalysis"
<input id="autorunstaticanalysis"
type="checkbox"
type="checkbox"
...
@@ -59,8 +59,8 @@ staticAnalysisView.prototype.render = function () {
...
@@ -59,8 +59,8 @@ staticAnalysisView.prototype.render = function () {
>
>
Auto run
Auto run
</label>
</label>
<label class="
${
css
.
label
}
" for="check
allstaticanalysi
s">
<label class="
${
css
.
label
}
" for="check
AllEntrie
s">
<input id="check
allstaticanalysi
s"
<input id="check
AllEntrie
s"
type="checkbox"
type="checkbox"
onclick="
${
function
(
event
)
{
self
.
checkAll
(
event
)
}
}"
onclick="
${
function
(
event
)
{
self
.
checkAll
(
event
)
}
}"
style="vertical-align:bottom"
style="vertical-align:bottom"
...
@@ -135,29 +135,23 @@ staticAnalysisView.prototype.run = function () {
...
@@ -135,29 +135,23 @@ staticAnalysisView.prototype.run = function () {
}
}
}
}
staticAnalysisView
.
prototype
.
checkAll
=
function
(
event
)
{
staticAnalysisView
.
prototype
.
checkModule
=
function
(
event
)
{
if
(
!
this
.
view
)
{
let
selected
=
this
.
view
.
querySelectorAll
(
'[name="staticanalysismodule"]:checked'
)
return
let
checkAll
=
this
.
view
.
querySelector
(
'[id="checkAllEntries"]'
)
}
if
(
event
.
target
.
checked
)
{
var
all
=
this
.
view
.
querySelectorAll
(
'[name="staticanalysismodule"]'
)
checkAll
.
checked
=
true
var
isAnySelected
=
false
}
else
if
(
!
selected
.
length
)
{
for
(
var
i
=
0
;
i
<
all
.
length
;
i
++
)
{
checkAll
.
checked
=
false
if
(
all
[
i
].
checked
===
true
)
{
isAnySelected
=
true
break
}
}
for
(
var
j
=
0
;
j
<
all
.
length
;
j
++
)
{
all
[
j
].
checked
=
!
isAnySelected
}
}
event
.
target
.
checked
=
!
isAnySelected
}
}
staticAnalysisView
.
prototype
.
checkModule
=
function
(
event
)
{
staticAnalysisView
.
prototype
.
checkAll
=
function
(
event
)
{
var
selectAll
=
this
.
view
.
querySelector
(
'[id="checkallstaticanalysis" ]'
)
if
(
!
this
.
view
)
{
if
(
event
.
target
.
checked
)
{
return
selectAll
.
checked
=
true
}
}
// checks/unchecks all
var
checkBoxes
=
this
.
view
.
querySelectorAll
(
'[name="staticanalysismodule"]'
)
checkBoxes
.
forEach
((
checkbox
)
=>
{
checkbox
.
checked
=
event
.
target
.
checked
})
}
}
staticAnalysisView
.
prototype
.
renderModules
=
function
()
{
staticAnalysisView
.
prototype
.
renderModules
=
function
()
{
...
@@ -170,6 +164,7 @@ staticAnalysisView.prototype.renderModules = function () {
...
@@ -170,6 +164,7 @@ staticAnalysisView.prototype.renderModules = function () {
<label class="
${
css
.
label
}
">
<label class="
${
css
.
label
}
">
<input id="staticanalysismodule_
${
categoryId
}
_
${
i
}
"
<input id="staticanalysismodule_
${
categoryId
}
_
${
i
}
"
type="checkbox"
type="checkbox"
class="staticAnalysisItem"
name="staticanalysismodule"
name="staticanalysismodule"
index=
${
item
.
_index
}
index=
${
item
.
_index
}
checked="true"
checked="true"
...
...
src/app/tabs/analysis-tab.js
View file @
e5469454
var
yo
=
require
(
'yo-yo'
)
var
yo
=
require
(
'yo-yo'
)
var
csjs
=
require
(
'csjs-inject'
)
var
StaticAnalysis
=
require
(
'../staticanalysis/staticAnalysisView'
)
var
StaticAnalysis
=
require
(
'../staticanalysis/staticAnalysisView'
)
var
globalRegistry
=
require
(
'../../global/registry'
)
var
EventManager
=
require
(
'../../lib/events'
)
var
EventManager
=
require
(
'../../lib/events'
)
var
css
=
require
(
'./styles/analysis-tab-styles'
)
class
AnalysisTab
{
module
.
exports
=
class
AnalysisTab
{
constructor
(
registry
)
{
constructor
(
localRegistry
)
{
this
.
event
=
new
EventManager
()
const
self
=
this
this
.
registry
=
registry
self
.
event
=
new
EventManager
()
self
.
_view
=
{
el
:
null
}
self
.
data
=
{}
self
.
_components
=
{}
self
.
_components
.
registry
=
localRegistry
||
globalRegistry
self
.
_deps
=
{}
}
}
render
()
{
render
()
{
const
self
=
this
var
staticanalysis
=
new
StaticAnalysis
()
var
staticanalysis
=
new
StaticAnalysis
()
staticanalysis
.
event
.
register
(
'staticAnaysisWarning'
,
(
count
)
=>
{
this
.
registry
.
put
({
api
:
staticanalysis
,
name
:
'staticanalysis'
})
if
(
count
>
0
)
{
const
msg
=
`Static Analysis raised
${
count
}
warning(s) that requires your attention. Check Solidity Static Analysis Module for more information.`
const
settings
=
{
type
:
'staticAnalysisWarning'
,
useSpan
:
true
}
self
.
event
.
trigger
(
'newStaticAnaysisWarningMessage'
,
[
msg
,
settings
])
}
})
self
.
_components
.
registry
.
put
({
api
:
staticanalysis
,
name
:
'staticanalysis'
})
if
(
self
.
_view
.
el
)
return
self
.
_view
.
el
self
.
_view
.
el
=
yo
`
<div class="
${
css
.
analysisTabView
}
"id="staticanalysisView">
${
staticanalysis
.
render
()}
</div>`
return
self
.
_view
.
el
if
(
this
.
el
)
return
this
.
el
this
.
el
=
yo
`<div class="
${
css
.
analysisTabView
}
"id="staticanalysisView">
${
staticanalysis
.
render
()}
</div>`
return
this
.
el
}
}
}
}
const
css
=
csjs
`
.analysisTabView {
module
.
exports
=
AnalysisTab
padding: 2%;
padding-bottom: 3em;
display: flex;
flex-direction: column;
}
`
src/app/tabs/debugger-tab.js
View file @
e5469454
var
yo
=
require
(
'yo-yo'
)
var
yo
=
require
(
'yo-yo'
)
var
cs
js
=
require
(
'csjs-inject
'
)
var
cs
s
=
require
(
'./styles/debugger-tab-styles
'
)
var
DebuggerUI
=
require
(
'../debugger/debuggerUI'
)
var
DebuggerUI
=
require
(
'../debugger/debuggerUI'
)
var
globalRegistry
=
require
(
'../../global/registry'
)
var
EventManager
=
require
(
'../../lib/events'
)
var
styles
=
require
(
'../ui/styles-guide/theme-chooser'
).
chooser
()
const
css
=
csjs
`
.debuggerTabView {
padding: 2%;
}
.debugger {
margin-bottom: 1%;
${
styles
.
rightPanel
.
debuggerTab
.
box_Debugger
}
}
`
class
DebuggerTab
{
class
DebuggerTab
{
constructor
(
localRegistry
)
{
constructor
()
{
const
self
=
this
this
.
el
=
null
self
.
event
=
new
EventManager
()
self
.
_view
=
{
el
:
null
}
self
.
data
=
{}
self
.
_components
=
{}
self
.
_components
.
registry
=
localRegistry
||
globalRegistry
}
}
render
()
{
render
()
{
const
self
=
this
if
(
this
.
el
)
return
this
.
el
if
(
self
.
_view
.
el
)
return
self
.
_view
.
el
self
.
_view
.
el
=
yo
`
this
.
el
=
yo
`
<div class="
${
css
.
debuggerTabView
}
" id="debugView">
<div class="
${
css
.
debuggerTabView
}
" id="debugView">
<div id="debugger" class="
${
css
.
debugger
}
"></div>
<div id="debugger" class="
${
css
.
debugger
}
"></div>
</div>`
</div>`
this
.
debuggerUI
=
new
DebuggerUI
(
self
.
_view
.
el
.
querySelector
(
'#debugger'
))
this
.
debuggerUI
=
new
DebuggerUI
(
this
.
el
.
querySelector
(
'#debugger'
))
// self._view.transactionDebugger = this.debuggerUI.view()
return
this
.
el
return
self
.
_view
.
el
}
}
debugger
()
{
debugger
()
{
// return this._view.transactionDebugger
return
this
.
debuggerUI
return
this
.
debuggerUI
}
}
}
}
...
...
src/app/tabs/plugin-tab.js
View file @
e5469454
var
yo
=
require
(
'yo-yo'
)
var
yo
=
require
(
'yo-yo'
)
var
cs
js
=
require
(
'csjs-inject
'
)
var
cs
s
=
require
(
'./styles/plugin-tab-styles
'
)
var
globalRegistry
=
require
(
'../../global/registry'
)
class
PluginTab
{
var
EventManager
=
require
(
'../../lib/events'
)
module
.
exports
=
class
plugintab
{
constructor
(
json
)
{
constructor
(
json
,
localRegistry
)
{
this
.
el
=
null
const
self
=
this
this
.
data
=
{
json
}
self
.
event
=
new
EventManager
()
self
.
_view
=
{
el
:
null
}
self
.
data
=
{
json
}
self
.
_components
=
{}
self
.
_components
.
registry
=
localRegistry
||
globalRegistry
}
}
render
()
{
render
()
{
const
self
=
this
if
(
this
.
el
)
return
this
.
el
if
(
self
.
_view
.
el
)
return
self
.
_view
.
el
self
.
_view
.
el
=
yo
`
this
.
el
=
yo
`
<div class="
${
css
.
pluginTabView
}
" id="pluginView">
<div class="
${
css
.
pluginTabView
}
" id="pluginView">
<iframe class="
${
css
.
iframe
}
" src="
${
self
.
data
.
json
.
url
}
/index.html"></iframe>
<iframe class="
${
css
.
iframe
}
" src="
${
this
.
data
.
json
.
url
}
/index.html"></iframe>
</div>`
</div>`
return
self
.
_view
.
el
return
this
.
el
}
}
}
}
const
css
=
csjs
`
.pluginTabView {
module
.
exports
=
PluginTab
height: 100%;
width: 100%;
}
.iframe {
height: 100%;
width: 100%;
border: 0;
}
`
src/app/tabs/run-tab.js
View file @
e5469454
var
$
=
require
(
'jquery'
)
var
yo
=
require
(
'yo-yo'
)
var
yo
=
require
(
'yo-yo'
)
var
EventManager
=
require
(
'../../lib/events'
)
var
EventManager
=
require
(
'../../lib/events'
)
var
globlalRegistry
=
require
(
'../../global/registry'
)
var
executionContext
=
require
(
'../../execution-context'
)
var
Card
=
require
(
'../ui/card'
)
var
Card
=
require
(
'../ui/card'
)
var
css
=
require
(
'./styles/run-tab-styles'
)
var
css
=
require
(
'./styles/run-tab-styles'
)
...
@@ -15,170 +12,140 @@ var ContractDropdownUI = require('./runTab/contractDropdown.js')
...
@@ -15,170 +12,140 @@ var ContractDropdownUI = require('./runTab/contractDropdown.js')
var
Recorder
=
require
(
'./runTab/model/recorder.js'
)
var
Recorder
=
require
(
'./runTab/model/recorder.js'
)
var
RecorderUI
=
require
(
'./runTab/recorder.js'
)
var
RecorderUI
=
require
(
'./runTab/recorder.js'
)
function
runTab
(
opts
,
localRegistry
)
{
class
RunTab
{
var
self
=
this
self
.
event
=
new
EventManager
()
constructor
(
udapp
,
udappUI
,
config
,
fileManager
,
editor
,
logCallback
,
filePanel
,
pluginManager
,
compilersArtefacts
)
{
self
.
_view
=
{}
this
.
event
=
new
EventManager
()
self
.
data
=
{
count
:
0
,
this
.
renderInstanceContainer
()
text
:
`All transactions (deployed contracts and function executions) in this environment can be saved and replayed in
this
.
renderSettings
(
udapp
)
another environment. e.g Transactions created in Javascript VM can be replayed in the Injected Web3.`
this
.
renderDropdown
(
udappUI
,
fileManager
,
pluginManager
,
compilersArtefacts
,
config
,
editor
,
udapp
,
filePanel
,
logCallback
)
}
this
.
renderRecorder
(
udapp
,
udappUI
,
fileManager
,
config
,
logCallback
)
self
.
_components
=
{}
this
.
renderRecorderCard
()
self
.
_components
.
registry
=
localRegistry
||
globlalRegistry
this
.
renderContainer
()
self
.
_components
.
transactionContextAPI
=
{
getAddress
:
(
cb
)
=>
{
cb
(
null
,
$
(
'#txorigin'
).
val
())
},
getValue
:
(
cb
)
=>
{
try
{
var
number
=
document
.
querySelector
(
'#value'
).
value
var
select
=
document
.
getElementById
(
'unit'
)
var
index
=
select
.
selectedIndex
var
selectedUnit
=
select
.
querySelectorAll
(
'option'
)[
index
].
dataset
.
unit
var
unit
=
'ether'
// default
if
([
'ether'
,
'finney'
,
'gwei'
,
'wei'
].
indexOf
(
selectedUnit
)
>=
0
)
{
unit
=
selectedUnit
}
cb
(
null
,
executionContext
.
web3
().
toWei
(
number
,
unit
))
}
catch
(
e
)
{
cb
(
e
)
}
},
getGasLimit
:
(
cb
)
=>
{
cb
(
null
,
$
(
'#gasLimit'
).
val
())
}
}
}
// dependencies
self
.
_deps
=
{
renderContainer
()
{
udapp
:
self
.
_components
.
registry
.
get
(
'udapp'
).
api
,
this
.
container
=
yo
`<div class="
${
css
.
runTabView
}
" id="runTabView" ></div>`
udappUI
:
self
.
_components
.
registry
.
get
(
'udappUI'
).
api
,
config
:
self
.
_components
.
registry
.
get
(
'config'
).
api
,
var
el
=
yo
`
fileManager
:
self
.
_components
.
registry
.
get
(
'filemanager'
).
api
,
<div>
editor
:
self
.
_components
.
registry
.
get
(
'editor'
).
api
,
${
this
.
settingsUI
.
render
()}
logCallback
:
self
.
_components
.
registry
.
get
(
'logCallback'
).
api
,
${
this
.
contractDropdownUI
.
render
()}
filePanel
:
self
.
_components
.
registry
.
get
(
'filepanel'
).
api
,
${
this
.
recorderCard
.
render
()}
pluginManager
:
self
.
_components
.
registry
.
get
(
'pluginmanager'
).
api
,
${
this
.
instanceContainer
}
compilersArtefacts
:
self
.
_components
.
registry
.
get
(
'compilersartefacts'
).
api
</div>
`
this
.
container
.
appendChild
(
el
)
}
}
self
.
_deps
.
udapp
.
resetAPI
(
self
.
_components
.
transactionContextAPI
)
self
.
_view
.
recorderCount
=
yo
`<span>0</span>`
renderInstanceContainer
()
{
self
.
_view
.
instanceContainer
=
yo
`<div class="
${
css
.
instanceContainer
}
"></div>`
this
.
instanceContainer
=
yo
`<div class="
${
css
.
instanceContainer
}
"></div>`
self
.
_view
.
clearInstanceElement
=
yo
`
<i class="
${
css
.
clearinstance
}
${
css
.
icon
}
fa fa-trash" onclick=
${()
=>
self
.
event
.
trigger
(
'clearInstance'
,
[])}
const
instanceContainerTitle
=
yo
`
title="Clear instances list and reset recorder" aria-hidden="true">
</i>`
self
.
_view
.
instanceContainerTitle
=
yo
`
<div class=
${
css
.
instanceContainerTitle
}
<div class=
${
css
.
instanceContainerTitle
}
title="Autogenerated generic user interfaces for interaction with deployed contracts">
title="Autogenerated generic user interfaces for interaction with deployed contracts">
Deployed Contracts
Deployed Contracts
${
self
.
_view
.
clearInstanceElement
}
<i class="
${
css
.
clearinstance
}
${
css
.
icon
}
fa fa-trash" onclick=
${()
=>
this
.
event
.
trigger
(
'clearInstance'
,
[])}
title="Clear instances list and reset recorder" aria-hidden="true">
</i>
</div>`
</div>`
self
.
_view
.
noInstancesText
=
yo
`
this
.
noInstancesText
=
yo
`
<div class="
${
css
.
noInstancesText
}
">
<div class="
${
css
.
noInstancesText
}
">
Currently you have no contract instances to interact with.
Currently you have no contract instances to interact with.
</div>`
</div>`
var
container
=
yo
`<div class="
${
css
.
runTabView
}
" id="runTabView" ></div>`
this
.
event
.
register
(
'clearInstance'
,
()
=>
{
this
.
instanceContainer
.
innerHTML
=
''
// clear the instances list
this
.
instanceContainer
.
appendChild
(
instanceContainerTitle
)
this
.
instanceContainer
.
appendChild
(
this
.
noInstancesText
)
})
this
.
instanceContainer
.
appendChild
(
instanceContainerTitle
)
this
.
instanceContainer
.
appendChild
(
this
.
noInstancesText
)
}
renderSettings
(
udapp
)
{
var
settings
=
new
Settings
(
udapp
)
this
.
settingsUI
=
new
SettingsUI
(
settings
)
this
.
settingsUI
.
event
.
register
(
'clearInstance'
,
()
=>
{
this
.
event
.
trigger
(
'clearInstance'
,
[])
})
}
renderDropdown
(
udappUI
,
fileManager
,
pluginManager
,
compilersArtefacts
,
config
,
editor
,
udapp
,
filePanel
,
logCallback
)
{
var
dropdownLogic
=
new
DropdownLogic
(
fileManager
,
pluginManager
,
compilersArtefacts
,
config
,
editor
,
udapp
,
filePanel
)
this
.
contractDropdownUI
=
new
ContractDropdownUI
(
dropdownLogic
,
logCallback
)
var
recorder
=
new
Recorder
(
self
.
_deps
.
udapp
,
self
.
_deps
.
fileManager
,
self
.
_deps
.
config
)
this
.
contractDropdownUI
.
event
.
register
(
'clearInstance'
,
()
=>
{
recorder
.
event
.
register
(
'newTxRecorded'
,
(
count
)
=>
{
var
noInstancesText
=
this
.
noInstancesText
this
.
data
.
count
=
count
if
(
noInstancesText
.
parentNode
)
{
noInstancesText
.
parentNode
.
removeChild
(
noInstancesText
)
}
this
.
_view
.
recorderCount
.
innerText
=
count
})
this
.
contractDropdownUI
.
event
.
register
(
'newContractABIAdded'
,
(
abi
,
address
)
=>
{
this
.
instanceContainer
.
appendChild
(
udappUI
.
renderInstanceFromABI
(
abi
,
address
,
address
))
})
})
recorder
.
event
.
register
(
'cleared'
,
()
=>
{
this
.
contractDropdownUI
.
event
.
register
(
'newContractInstanceAdded'
,
(
contractObject
,
address
,
value
)
=>
{
this
.
data
.
count
=
0
this
.
instanceContainer
.
appendChild
(
udappUI
.
renderInstance
(
contractObject
,
address
,
value
))
this
.
_view
.
recorderCount
.
innerText
=
0
})
})
executionContext
.
event
.
register
(
'contextChanged'
,
recorder
.
clearAll
.
bind
(
recorder
))
}
self
.
event
.
register
(
'clearInstance'
,
recorder
.
clearAll
.
bind
(
recorder
))
var
recorderInterface
=
new
RecorderUI
(
recorder
,
self
)
renderRecorder
(
udapp
,
udappUI
,
fileManager
,
config
,
logCallback
)
{
recorderInterface
.
render
()
this
.
recorderCount
=
yo
`<span>0</span>`
self
.
_view
.
collapsedView
=
yo
`
var
recorder
=
new
Recorder
(
udapp
,
fileManager
,
config
)
recorder
.
event
.
register
(
'recorderCountChange'
,
(
count
)
=>
{
this
.
recorderCount
.
innerText
=
count
})
this
.
event
.
register
(
'clearInstance'
,
recorder
.
clearAll
.
bind
(
recorder
))
this
.
recorderInterface
=
new
RecorderUI
(
recorder
,
logCallback
)
this
.
recorderInterface
.
event
.
register
(
'newScenario'
,
(
abi
,
address
,
contractName
)
=>
{
var
noInstancesText
=
this
.
noInstancesText
if
(
noInstancesText
.
parentNode
)
{
noInstancesText
.
parentNode
.
removeChild
(
noInstancesText
)
}
this
.
instanceContainer
.
appendChild
(
udappUI
.
renderInstanceFromABI
(
abi
,
address
,
contractName
))
})
this
.
recorderInterface
.
render
()
}
renderRecorderCard
()
{
const
collapsedView
=
yo
`
<div class=
${
css
.
recorderCollapsedView
}
>
<div class=
${
css
.
recorderCollapsedView
}
>
<div class=
${
css
.
recorderCount
}
>
${
self
.
_view
.
recorderCount
}
</div>
<div class=
${
css
.
recorderCount
}
>
${
this
.
recorderCount
}
</div>
</div>`
</div>`
self
.
_view
.
expandedView
=
yo
`
const
expandedView
=
yo
`
<div class=
${
css
.
recorderExpandedView
}
>
<div class=
${
css
.
recorderExpandedView
}
>
<div class=
${
css
.
recorderDescription
}
>
<div class=
${
css
.
recorderDescription
}
>
${
self
.
data
.
text
}
All transactions (deployed contracts and function executions) in this environment can be saved and replayed in
another environment. e.g Transactions created in Javascript VM can be replayed in the Injected Web3.
</div>
</div>
<div class="
${
css
.
transactionActions
}
">
<div class="
${
css
.
transactionActions
}
">
${
recorderInterface
.
recordButton
}
${
this
.
recorderInterface
.
recordButton
}
${
recorderInterface
.
runButton
}
${
this
.
recorderInterface
.
runButton
}
</div>
</div>
</div>
</div>
</div>`
</div>`
self
.
recorderOpts
=
{
this
.
recorderCard
=
new
Card
({},
{},
{
title
:
'Transactions recorded:'
,
collapsedView
:
collapsedView
})
title
:
'Transactions recorded:'
,
this
.
recorderCard
.
event
.
register
(
'expandCollapseCard'
,
(
arrow
,
body
,
status
)
=>
{
collapsedView
:
self
.
_view
.
collapsedView
}
var
recorderCard
=
new
Card
({},
{},
self
.
recorderOpts
)
recorderCard
.
event
.
register
(
'expandCollapseCard'
,
(
arrow
,
body
,
status
)
=>
{
body
.
innerHTML
=
''
body
.
innerHTML
=
''
status
.
innerHTML
=
''
status
.
innerHTML
=
''
if
(
arrow
===
'down'
)
{
if
(
arrow
===
'down'
)
{
status
.
appendChild
(
self
.
_view
.
collapsedView
)
status
.
appendChild
(
collapsedView
)
body
.
appendChild
(
self
.
_view
.
expandedView
)
body
.
appendChild
(
expandedView
)
}
else
if
(
arrow
===
'up'
)
{
}
else
if
(
arrow
===
'up'
)
{
status
.
appendChild
(
self
.
_view
.
collapsedView
)
status
.
appendChild
(
collapsedView
)
}
}
})
})
}
var
settings
=
new
Settings
(
self
.
_deps
.
udapp
)
render
()
{
var
settingsUI
=
new
SettingsUI
(
settings
)
return
this
.
container
}
self
.
event
.
register
(
'clearInstance'
,
()
=>
{
this
.
_view
.
instanceContainer
.
innerHTML
=
''
// clear the instances list
this
.
_view
.
instanceContainer
.
appendChild
(
self
.
_view
.
instanceContainerTitle
)
this
.
_view
.
instanceContainer
.
appendChild
(
self
.
_view
.
noInstancesText
)
})
settingsUI
.
event
.
register
(
'clearInstance'
,
()
=>
{
this
.
event
.
trigger
(
'clearInstance'
,
[])
})
var
dropdownLogic
=
new
DropdownLogic
(
this
.
_deps
.
fileManager
,
this
.
_deps
.
pluginManager
,
this
.
_deps
.
compilersArtefacts
,
this
.
_deps
.
compiler
,
this
.
_deps
.
config
,
this
.
_deps
.
editor
,
this
.
_deps
.
udapp
,
this
.
_deps
.
filePanel
)
var
contractDropdownUI
=
new
ContractDropdownUI
(
dropdownLogic
,
this
.
_deps
.
logCallback
)
contractDropdownUI
.
event
.
register
(
'clearInstance'
,
()
=>
{
var
noInstancesText
=
this
.
_view
.
noInstancesText
if
(
noInstancesText
.
parentNode
)
{
noInstancesText
.
parentNode
.
removeChild
(
noInstancesText
)
}
})
contractDropdownUI
.
event
.
register
(
'newContractABIAdded'
,
(
abi
,
address
)
=>
{
this
.
_view
.
instanceContainer
.
appendChild
(
this
.
_deps
.
udappUI
.
renderInstanceFromABI
(
abi
,
address
,
address
))
})
contractDropdownUI
.
event
.
register
(
'newContractInstanceAdded'
,
(
contractObject
,
address
,
value
)
=>
{
this
.
_view
.
instanceContainer
.
appendChild
(
this
.
_deps
.
udappUI
.
renderInstance
(
contractObject
,
address
,
value
))
})
this
.
_view
.
instanceContainer
.
appendChild
(
this
.
_view
.
instanceContainerTitle
)
this
.
_view
.
instanceContainer
.
appendChild
(
this
.
_view
.
noInstancesText
)
var
el
=
yo
`
<div>
${
settingsUI
.
render
()}
${
contractDropdownUI
.
render
()}
${
recorderCard
.
render
()}
${
self
.
_view
.
instanceContainer
}
</div>
`
container
.
appendChild
(
el
)
return
{
render
()
{
return
container
}
}
}
}
module
.
exports
=
r
unTab
module
.
exports
=
R
unTab
src/app/tabs/runTab/model/dropdownlogic.js
View file @
e5469454
...
@@ -9,10 +9,9 @@ var CompilerAbstract = require('../../../compiler/compiler-abstract')
...
@@ -9,10 +9,9 @@ var CompilerAbstract = require('../../../compiler/compiler-abstract')
var
EventManager
=
remixLib
.
EventManager
var
EventManager
=
remixLib
.
EventManager
class
DropdownLogic
{
class
DropdownLogic
{
constructor
(
fileManager
,
pluginManager
,
compilersArtefacts
,
co
mpiler
,
co
nfig
,
editor
,
udapp
,
filePanel
)
{
constructor
(
fileManager
,
pluginManager
,
compilersArtefacts
,
config
,
editor
,
udapp
,
filePanel
)
{
this
.
pluginManager
=
pluginManager
this
.
pluginManager
=
pluginManager
this
.
compilersArtefacts
=
compilersArtefacts
this
.
compilersArtefacts
=
compilersArtefacts
this
.
compiler
=
compiler
this
.
config
=
config
this
.
config
=
config
this
.
editor
=
editor
this
.
editor
=
editor
this
.
udapp
=
udapp
this
.
udapp
=
udapp
...
@@ -27,6 +26,7 @@ class DropdownLogic {
...
@@ -27,6 +26,7 @@ class DropdownLogic {
})
})
}
}
// TODO: can be moved up; the event in contractDropdown will have to refactored a method instead
listenToCompilationEvents
()
{
listenToCompilationEvents
()
{
this
.
pluginManager
.
event
.
register
(
'sendCompilationResult'
,
(
file
,
source
,
languageVersion
,
data
)
=>
{
this
.
pluginManager
.
event
.
register
(
'sendCompilationResult'
,
(
file
,
source
,
languageVersion
,
data
)
=>
{
// TODO check whether the tab is configured
// TODO check whether the tab is configured
...
...
src/app/tabs/runTab/model/recorder.js
View file @
e5469454
...
@@ -80,6 +80,13 @@ class Recorder {
...
@@ -80,6 +80,13 @@ class Recorder {
this
.
data
.
_createdContracts
[
address
]
=
timestamp
this
.
data
.
_createdContracts
[
address
]
=
timestamp
this
.
data
.
_createdContractsReverse
[
timestamp
]
=
address
this
.
data
.
_createdContractsReverse
[
timestamp
]
=
address
})
})
executionContext
.
event
.
register
(
'contextChanged'
,
this
.
clearAll
.
bind
(
this
))
this
.
event
.
register
(
'newTxRecorded'
,
(
count
)
=>
{
this
.
event
.
trigger
(
'recorderCountChange'
,
[
count
])
})
this
.
event
.
register
(
'cleared'
,
()
=>
{
this
.
event
.
trigger
(
'recorderCountChange'
,
[
0
])
})
}
}
/**
/**
...
...
src/app/tabs/runTab/recorder.js
View file @
e5469454
var
yo
=
require
(
'yo-yo'
)
var
yo
=
require
(
'yo-yo'
)
var
remixLib
=
require
(
'remix-lib'
)
var
EventManager
=
remixLib
.
EventManager
var
csjs
=
require
(
'csjs-inject'
)
var
csjs
=
require
(
'csjs-inject'
)
var
css
=
require
(
'../styles/run-tab-styles'
)
var
css
=
require
(
'../styles/run-tab-styles'
)
...
@@ -8,10 +10,10 @@ var confirmDialog = require('../../execution/confirmDialog')
...
@@ -8,10 +10,10 @@ var confirmDialog = require('../../execution/confirmDialog')
class
RecorderUI
{
class
RecorderUI
{
constructor
(
recorder
,
parentSelf
)
{
constructor
(
recorder
,
logCallBack
)
{
this
.
recorder
=
recorder
this
.
recorder
=
recorder
this
.
parentSelf
=
parentSelf
this
.
logCallBack
=
logCallBack
this
.
logCallBack
=
this
.
parentSelf
.
_deps
.
logCallback
this
.
event
=
new
EventManager
()
}
}
render
()
{
render
()
{
...
@@ -67,10 +69,7 @@ class RecorderUI {
...
@@ -67,10 +69,7 @@ class RecorderUI {
return
modalDialogCustom
.
alert
(
error
)
return
modalDialogCustom
.
alert
(
error
)
}
}
var
noInstancesText
=
this
.
parentSelf
.
_view
.
noInstancesText
this
.
event
.
trigger
(
'newScenario'
,
[
abi
,
address
,
contractName
])
if
(
noInstancesText
.
parentNode
)
{
noInstancesText
.
parentNode
.
removeChild
(
noInstancesText
)
}
this
.
parentSelf
.
_view
.
instanceContainer
.
appendChild
(
this
.
parentSelf
.
_deps
.
udappUI
.
renderInstanceFromABI
(
abi
,
address
,
contractName
))
})
})
}
}
...
...
src/app/tabs/styles/analysis-tab-styles.js
0 → 100644
View file @
e5469454
var
csjs
=
require
(
'csjs-inject'
)
const
css
=
csjs
`
.analysisTabView {
padding: 2%;
padding-bottom: 3em;
display: flex;
flex-direction: column;
}
`
module
.
exports
=
css
src/app/tabs/styles/debugger-tab-styles.js
0 → 100644
View file @
e5469454
var
csjs
=
require
(
'csjs-inject'
)
var
styles
=
require
(
'../../ui/styles-guide/theme-chooser'
).
chooser
()
const
css
=
csjs
`
.debuggerTabView {
padding: 2%;
}
.debugger {
margin-bottom: 1%;
${
styles
.
rightPanel
.
debuggerTab
.
box_Debugger
}
}
`
module
.
exports
=
css
src/app/tabs/styles/plugin-tab-styles.js
0 → 100644
View file @
e5469454
var
csjs
=
require
(
'csjs-inject'
)
const
css
=
csjs
`
.pluginTabView {
height: 100%;
width: 100%;
}
.iframe {
height: 100%;
width: 100%;
border: 0;
}
`
module
.
exports
=
css
src/app/tabs/styles/support-tab-styles.js
0 → 100644
View file @
e5469454
const
csjs
=
require
(
'csjs-inject'
)
const
styles
=
require
(
'../../ui/styles-guide/theme-chooser'
).
chooser
()
const
css
=
csjs
`
.supportTabView {
height: 100%;
padding: 2%;
padding-bottom: 3em;
display: flex;
flex-direction: column;
overflow: hidden;
overflow-y: auto;
}
.chat {
${
styles
.
rightPanel
.
supportTab
.
box_IframeContainer
}
display: flex;
flex-direction: column;
align-items: center;
height: 85%;
padding: 0;
}
.chatTitle {
height: 40px;
width: 90%;
display: flex;
align-items: center;
justify-content: center;
margin-top: 15px;
}
.chatTitle:hover {
cursor: pointer;
}
.icon {
height: 70%;
margin-right: 2%;
}
.chatTitleText {
font-size: 17px;
font-weight: bold;
}
.chatTitleText {
opacity: 0.8;
}
.chatIframe {
width: 100%;
height: 100%;
transform: scale(0.9);
padding: 0;
border: none;
}
.infoBox {
${
styles
.
rightPanel
.
supportTab
.
box_SupportInfo
}
}
.remixdinstallation {
padding: 3px;
border-radius: 2px;
margin-left: 5px;
}
.info {
${
styles
.
rightPanel
.
settingsTab
.
box_SolidityVersionInfo
}
;
margin-top: 1em;
word-break: break-word;
}
.title {
font-size: 1.1em;
font-weight: bold;
margin-bottom: 1em;
}
.crow {
display: flex;
overflow: auto;
clear: both;
padding: .2em;
}
.crow label {
cursor:pointer;
}
.crowNoFlex {
overflow: auto;
clear: both;
}
`
module
.
exports
=
css
src/app/tabs/styles/tabbed-menu-styles.js
0 → 100644
View file @
e5469454
const
csjs
=
require
(
'csjs-inject'
)
const
styles
=
require
(
'../../ui/styles-guide/theme-chooser'
).
chooser
()
const
css
=
csjs
`
.menu {
display: flex;
background-color:
${
styles
.
rightPanel
.
BackgroundColor_Pre
}
;
list-style: none;
margin: 0;
padding: 0;
}
.active {
background-color:
${
styles
.
rightPanel
.
backgroundColor_Tab
}
;
color:
${
styles
.
appProperties
.
mainText_Color
}
}
.options {
float: left;
padding-top: 0.7em;
min-width: 60px;
font-size: 0.9em;
cursor: pointer;
font-size: 1em;
text-align: center;
}
.optionViews {
background-color:
${
styles
.
rightPanel
.
backgroundColor_Tab
}
;
overflow: scroll;
height: 100%;
}
.optionViews > div {
display: none;
}
.optionViews .pre {
word-wrap: break-word;
background-color:
${
styles
.
rightPanel
.
BackgroundColor_Pre
}
;
border-radius: 3px;
display: inline-block;
padding: 0 0.6em;
}
`
module
.
exports
=
css
src/app/tabs/styles/test-tab-styles.js
View file @
e5469454
...
@@ -45,6 +45,8 @@ var css = csjs`
...
@@ -45,6 +45,8 @@ var css = csjs`
.buttons {
.buttons {
${
styles
.
rightPanel
.
testTab
.
box_listTests
}
;
${
styles
.
rightPanel
.
testTab
.
box_listTests
}
;
margin: 2%;
margin: 2%;
display: flex;
align-items: center;
}
}
.runButton {
.runButton {
${
styles
.
rightPanel
.
testTab
.
button_runTests
}
;
${
styles
.
rightPanel
.
testTab
.
button_runTests
}
;
...
@@ -58,6 +60,9 @@ var css = csjs`
...
@@ -58,6 +60,9 @@ var css = csjs`
font-weight: bold;
font-weight: bold;
margin-bottom: 1em;
margin-bottom: 1em;
}
}
.label {
display: flex;
align-items: center;
}
`
`
module
.
exports
=
css
module
.
exports
=
css
src/app/tabs/support-tab.js
View file @
e5469454
const
yo
=
require
(
'yo-yo'
)
const
yo
=
require
(
'yo-yo'
)
const
csjs
=
require
(
'csjs-inject
'
)
var
css
=
require
(
'./styles/support-tab-styles
'
)
var
globalRegistry
=
require
(
'../../global/registry'
)
class
SupportTab
{
const
styles
=
require
(
'../ui/styles-guide/theme-chooser'
).
chooser
()
var
EventManager
=
require
(
'../../lib/events'
)
module
.
exports
=
class
SupportTab
{
constructor
(
localRegistry
)
{
constructor
(
localRegistry
)
{
const
self
=
this
this
.
el
=
null
self
.
event
=
new
EventManager
()
this
.
gitterIframe
=
''
self
.
_view
=
{
el
:
null
,
gitterIframe
:
''
,
config
:
{}
}
this
.
gitterIsLoaded
=
false
self
.
data
=
{
gitterIsLoaded
:
false
}
self
.
_components
=
{}
self
.
_components
.
registry
=
localRegistry
||
globalRegistry
self
.
_deps
=
{
app
:
self
.
_components
.
registry
.
get
(
'app'
).
api
}
}
self
.
_deps
.
app
.
event
.
register
(
'tabChanged'
,
(
tabName
)
=>
{
loadTab
()
{
if
(
tabName
!==
'Support'
||
self
.
data
.
gitterIsLoaded
)
return
if
(
this
.
gitterIsLoaded
)
return
const
iframe
=
yo
`<iframe class="
${
css
.
chatIframe
}
" src='https://gitter.im/ethereum/remix/~embed'>`
const
iframe
=
yo
`<iframe class="
${
css
.
chatIframe
}
" src='https://gitter.im/ethereum/remix/~embed'>`
self
.
_view
.
gitterIframe
.
parentNode
.
replaceChild
(
iframe
,
self
.
_view
.
gitterIframe
)
this
.
gitterIframe
.
parentNode
.
replaceChild
(
iframe
,
this
.
gitterIframe
)
self
.
_view
.
gitterIframe
=
iframe
this
.
gitterIframe
=
iframe
self
.
_view
.
el
.
style
.
display
=
'block'
this
.
el
.
style
.
display
=
'block'
self
.
data
.
gitterIsLoaded
=
true
this
.
gitterIsLoaded
=
true
})
}
}
render
()
{
render
()
{
const
self
=
this
if
(
this
.
el
)
return
this
.
el
if
(
self
.
_view
.
el
)
return
self
.
_view
.
el
self
.
_view
.
gitterIframe
=
yo
`<div></div>`
this
.
gitterIframe
=
yo
`<div></div>`
self
.
_view
.
config
.
remixd
=
yo
`
const
remixd
=
yo
`
<div class="
${
css
.
info
}
">
<div class="
${
css
.
info
}
">
<div class=
${
css
.
title
}
>Accessing local files</div>
<div class=
${
css
.
title
}
>Accessing local files</div>
<div class="
${
css
.
crow
}
">
<div class="
${
css
.
crow
}
">
...
@@ -44,7 +36,8 @@ module.exports = class SupportTab {
...
@@ -44,7 +36,8 @@ module.exports = class SupportTab {
<div class="
${
css
.
crow
}
"><a target="_blank" href="https://remix.readthedocs.io/en/latest/tutorial_remixd_filesystem">http://remix.readthedocs.io/en/latest/tutorial_remixd_filesystem.html</a></div>
<div class="
${
css
.
crow
}
"><a target="_blank" href="https://remix.readthedocs.io/en/latest/tutorial_remixd_filesystem">http://remix.readthedocs.io/en/latest/tutorial_remixd_filesystem.html</a></div>
<div class="
${
css
.
crow
}
">Installation: <pre class=
${
css
.
remixdinstallation
}
>npm install remixd -g</pre></div>
<div class="
${
css
.
crow
}
">Installation: <pre class=
${
css
.
remixdinstallation
}
>npm install remixd -g</pre></div>
</div>`
</div>`
self
.
_view
.
config
.
localremixd
=
yo
`
const
localremixd
=
yo
`
<div class="
${
css
.
info
}
">
<div class="
${
css
.
info
}
">
<div class=
${
css
.
title
}
>Running Remix locally</div>
<div class=
${
css
.
title
}
>Running Remix locally</div>
<div class="
${
css
.
crow
}
">
<div class="
${
css
.
crow
}
">
...
@@ -57,7 +50,8 @@ module.exports = class SupportTab {
...
@@ -57,7 +50,8 @@ module.exports = class SupportTab {
</div>
</div>
<a target="_blank" href="https://github.com/horizon-games/remix-app">https://github.com/horizon-games/remix-app</a>
<a target="_blank" href="https://github.com/horizon-games/remix-app">https://github.com/horizon-games/remix-app</a>
</div>`
</div>`
self
.
_view
.
el
=
yo
`
this
.
el
=
yo
`
<div class="
${
css
.
supportTabView
}
" id="supportView">
<div class="
${
css
.
supportTabView
}
" id="supportView">
<div class="
${
css
.
infoBox
}
">
<div class="
${
css
.
infoBox
}
">
Have a question, found a bug or want to propose a feature? Have a look at the
Have a question, found a bug or want to propose a feature? Have a look at the
...
@@ -66,95 +60,18 @@ module.exports = class SupportTab {
...
@@ -66,95 +60,18 @@ module.exports = class SupportTab {
<a target="_blank" href='https://solidity.readthedocs.io/en/latest/'> Solidity</a>.
<a target="_blank" href='https://solidity.readthedocs.io/en/latest/'> Solidity</a>.
</div>
</div>
<div class="
${
css
.
chat
}
">
<div class="
${
css
.
chat
}
">
<div class="
${
css
.
chatTitle
}
" onclick=
${
openLink
}
title='Click to open chat in Gitter'>
<div class="
${
css
.
chatTitle
}
" onclick=
${
()
=>
{
window
.
open
(
'https://gitter.im/ethereum/remix'
)
}
}
title
=
'Click to open chat in Gitter'
>
<
div
class
=
"${css.chatTitleText}"
>
ethereum
/
remix
community
chat
<
/div
>
<
div
class
=
"${css.chatTitleText}"
>
ethereum
/
remix
community
chat
<
/div
>
<
/div
>
<
/div
>
${
self
.
_view
.
gitterIframe
}
$
{
this
.
gitterIframe
}
</div>
</div>
${
self
.
_view
.
config
.
remixd
}
${
remixd
}
${
self
.
_view
.
config
.
localremixd
}
${
localremixd
}
</div>`
</div>`
return
self
.
_view
.
el
function
openLink
()
{
window
.
open
(
'https://gitter.im/ethereum/remix'
)
}
return
this
.
el
}
}
}
}
const
css
=
csjs
`
module
.
exports
=
SupportTab
.supportTabView {
height: 100%;
padding: 2%;
padding-bottom: 3em;
display: flex;
flex-direction: column;
overflow: hidden;
overflow-y: auto;
}
.chat {
${
styles
.
rightPanel
.
supportTab
.
box_IframeContainer
}
display: flex;
flex-direction: column;
align-items: center;
height: 85%;
padding: 0;
}
.chatTitle {
height: 40px;
width: 90%;
display: flex;
align-items: center;
justify-content: center;
margin-top: 15px;
}
.chatTitle:hover {
cursor: pointer;
}
.icon {
height: 70%;
margin-right: 2%;
}
.chatTitleText {
font-size: 17px;
font-weight: bold;
}
.chatTitleText {
opacity: 0.8;
}
.chatIframe {
width: 100%;
height: 100%;
transform: scale(0.9);
padding: 0;
border: none;
}
.infoBox {
${
styles
.
rightPanel
.
supportTab
.
box_SupportInfo
}
}
.remixdinstallation {
padding: 3px;
border-radius: 2px;
margin-left: 5px;
}
.info {
${
styles
.
rightPanel
.
settingsTab
.
box_SolidityVersionInfo
}
;
margin-top: 1em;
word-break: break-word;
}
.title {
font-size: 1.1em;
font-weight: bold;
margin-bottom: 1em;
}
.crow {
display: flex;
overflow: auto;
clear: both;
padding: .2em;
}
.crow label {
cursor:pointer;
}
.crowNoFlex {
overflow: auto;
clear: both;
}
`
src/app/tabs/tabbed-menu.js
View file @
e5469454
var
yo
=
require
(
'yo-yo'
)
var
yo
=
require
(
'yo-yo'
)
var
cs
js
=
require
(
'csjs-inject
'
)
var
cs
s
=
require
(
'./styles/tabbed-menu-styles
'
)
var
globalRegistry
=
require
(
'../../global/registry'
)
var
globalRegistry
=
require
(
'../../global/registry'
)
var
helper
=
require
(
'../../lib/helper'
)
var
helper
=
require
(
'../../lib/helper'
)
var
styles
=
require
(
'../ui/styles-guide/theme-chooser'
).
chooser
()
var
EventManager
=
require
(
'../../lib/events'
)
var
EventManager
=
require
(
'../../lib/events'
)
module
.
exports
=
class
TabbedMenu
{
class
TabbedMenu
{
constructor
(
localRegistry
)
{
constructor
(
localRegistry
)
{
const
self
=
this
const
self
=
this
self
.
event
=
new
EventManager
()
self
.
event
=
new
EventManager
()
...
@@ -91,40 +90,4 @@ module.exports = class TabbedMenu {
...
@@ -91,40 +90,4 @@ module.exports = class TabbedMenu {
}
}
}
}
const
css
=
csjs
`
module
.
exports
=
TabbedMenu
.menu {
display: flex;
background-color:
${
styles
.
rightPanel
.
BackgroundColor_Pre
}
;
list-style: none;
margin: 0;
padding: 0;
}
.active {
background-color:
${
styles
.
rightPanel
.
backgroundColor_Tab
}
;
color:
${
styles
.
appProperties
.
mainText_Color
}
}
.options {
float: left;
padding-top: 0.7em;
min-width: 60px;
font-size: 0.9em;
cursor: pointer;
font-size: 1em;
text-align: center;
}
.optionViews {
background-color:
${
styles
.
rightPanel
.
backgroundColor_Tab
}
;
overflow: scroll;
height: 100%;
}
.optionViews > div {
display: none;
}
.optionViews .pre {
word-wrap: break-word;
background-color:
${
styles
.
rightPanel
.
BackgroundColor_Pre
}
;
border-radius: 3px;
display: inline-block;
padding: 0 0.6em;
}
`
src/app/tabs/test-tab.js
View file @
e5469454
...
@@ -100,8 +100,8 @@ module.exports = class TestTab {
...
@@ -100,8 +100,8 @@ module.exports = class TestTab {
}
}
self
.
_deps
.
filePanel
.
event
.
register
(
'newTestFileCreated'
,
file
=>
{
self
.
_deps
.
filePanel
.
event
.
register
(
'newTestFileCreated'
,
file
=>
{
var
testList
=
document
.
querySelector
(
"[class^='testList']"
)
var
testList
=
self
.
view
.
querySelector
(
"[class^='testList']"
)
var
test
=
yo
`<label
><input onchange=
${(
e
)
=>
toggleCheckbox
(
e
,
file
)}
type="checkbox" checked="true">
${
file
}
</label>`
var
test
=
yo
`<label
class="singleTestLabel"><input class="singleTest" onchange=
${(
e
)
=>
toggleCheckbox
(
e
.
target
.
checked
,
file
)}
type="checkbox" checked="true">
${
file
}
</label>`
testList
.
appendChild
(
test
)
testList
.
appendChild
(
test
)
self
.
data
.
allTests
.
push
(
file
)
self
.
data
.
allTests
.
push
(
file
)
self
.
data
.
selectedTests
.
push
(
file
)
self
.
data
.
selectedTests
.
push
(
file
)
...
@@ -133,13 +133,32 @@ module.exports = class TestTab {
...
@@ -133,13 +133,32 @@ module.exports = class TestTab {
function
listTests
()
{
function
listTests
()
{
var
tests
=
self
.
data
.
allTests
var
tests
=
self
.
data
.
allTests
return
tests
.
map
(
test
=>
yo
`<label
><input onchange =
${(
e
)
=>
toggleCheckbox
(
e
,
test
)}
type="checkbox" checked="true">
${
test
}
</label>`
)
return
tests
.
map
(
test
=>
yo
`<label
class="singleTestLabel"><input class="singleTest" onchange =
${(
e
)
=>
toggleCheckbox
(
e
.
target
.
checked
,
test
)}
type="checkbox" checked="true">
${
test
}
</label>`
)
}
}
function
toggleCheckbox
(
e
,
test
)
{
function
toggleCheckbox
(
eChecked
,
test
)
{
var
selectedTests
=
self
.
data
.
selectedTests
if
(
!
self
.
data
.
selectedTests
)
{
selectedTests
=
e
.
target
.
checked
?
[...
selectedTests
,
test
]
:
selectedTests
.
filter
(
el
=>
el
!==
test
)
self
.
data
.
selectedTests
=
self
.
_view
.
el
.
querySelectorAll
(
'.singleTest:checked'
)
}
let
selectedTests
=
self
.
data
.
selectedTests
selectedTests
=
eChecked
?
[...
selectedTests
,
test
]
:
selectedTests
.
filter
(
el
=>
el
!==
test
)
self
.
data
.
selectedTests
=
selectedTests
self
.
data
.
selectedTests
=
selectedTests
let
checkAll
=
self
.
_view
.
el
.
querySelector
(
'[id="checkAllTests"]'
)
if
(
eChecked
)
{
checkAll
.
checked
=
true
}
else
if
(
!
selectedTests
.
length
)
{
checkAll
.
checked
=
false
}
}
function
checkAll
(
event
)
{
let
checkBoxes
=
self
.
_view
.
el
.
querySelectorAll
(
'.singleTest'
)
const
checkboxesLabels
=
self
.
_view
.
el
.
querySelectorAll
(
'.singleTestLabel'
)
// checks/unchecks all
for
(
let
i
=
0
;
i
<
checkBoxes
.
length
;
i
++
)
{
checkBoxes
[
i
].
checked
=
event
.
target
.
checked
toggleCheckbox
(
event
.
target
.
checked
,
checkboxesLabels
[
i
].
innerText
)
}
}
}
var
runTests
=
function
()
{
var
runTests
=
function
()
{
...
@@ -177,12 +196,20 @@ module.exports = class TestTab {
...
@@ -177,12 +196,20 @@ module.exports = class TestTab {
<br/>
<br/>
For more details, see
For more details, see
How to test smart contracts guide in our documentation.
How to test smart contracts guide in our documentation.
<div class=
${
css
.
generateTestFile
}
onclick=
${
generateTestFile
}
>Generate test file</div>
<div class=
"
${
css
.
generateTestFile
}
" onclick="
${
generateTestFile
}
"
>Generate test file</div>
</div>
</div>
<div class="
${
css
.
tests
}
">
<div class="
${
css
.
tests
}
">
${
self
.
testList
}
${
self
.
testList
}
<div class=
${
css
.
buttons
}
>
<div class="
${
css
.
buttons
}
">
<div class=
${
css
.
runButton
}
onclick=
${
runTests
}
>Run Tests</div>
<div class="
${
css
.
runButton
}
" onclick="
${
runTests
}
">Run Tests</div>
<label class="
${
css
.
label
}
" for="checkAllTests">
<input id="checkAllTests"
type="checkbox"
onclick="
${
function
(
event
)
{
checkAll
(
event
)
}
}"
checked="true"
>
Check/Uncheck all
</label>
</div>
</div>
${
testsOutput
}
${
testsOutput
}
${
testsSummary
}
${
testsSummary
}
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment