@ -1,33 +1,38 @@
var yo = require ( 'yo-yo' )
var csjs = require ( 'csjs-inject' )
// var globalRegistry = require('../../../global/registry')
let yo = require ( 'yo-yo' )
let csjs = require ( 'csjs-inject' )
let globalRegistry = require ( '../../../global/registry' )
let CompilerImport = require ( '../../compiler/compiler-imports' )
var modalDialogCustom = require ( '../modal-dialog-custom' )
var tooltip = require ( '../tooltip' )
var css = csjs `
let css = csjs `
. sectionContainer {
display : table - cell ;
display : flex ;
flex - direction : column ;
flex - wrap : wrap ;
align - content : space - around ;
padding : 20 px ;
max - width : 300 px ;
max - width : 340 px ;
min - height : 300 px ;
background - color : var ( -- light ) ;
font - family : "Lucida Console" , Monaco , monospace ;
}
. landingPage {
height : 100 % ;
width : 100 % ;
background - color : var ( -- light ) ;
flex - wrap : wrap ;
justify - content : space - evenly ;
user - select : none ;
}
. im {
display : grid ;
max - width : 15 0px ;
max - height : 16 0px ;
max - width : 20 0px ;
max - height : 20 0px ;
width : 100 % ;
height : 100 % ;
padding : 20 px ;
background - color : var ( -- bg - light ) ;
align - self : center ;
}
. im : hover {
}
@ -43,73 +48,109 @@ export class LandingPage extends ApiFactory {
constructor ( appManager , appStore ) {
super ( )
this . sections = [ ]
/ * v a r a c t i o n s S t a r t = [
let load = function ( item ) {
let compilerImport = new CompilerImport ( )
let fileProviders = globalRegistry . get ( 'fileproviders' ) . api
modalDialogCustom . prompt ( null , 'Enter the ' + item + ' you would like to load.' , null , ( target ) => {
if ( target !== '' ) {
compilerImport . import (
target ,
( loadingMsg ) => { tooltip ( loadingMsg ) } ,
( error , content , cleanUrl , type , url ) => {
if ( error ) {
modalDialogCustom . alert ( error )
} else {
if ( fileProviders [ type ] ) {
fileProviders [ type ] . addReadOnly ( cleanUrl , content , url )
}
}
}
)
}
} )
}
var actionsStart = [
{ label : 'New file' ,
type : 'callback' ,
payload : ( ) => {
let fileExplorer = globalRegistry . get ( 'fileexplorer' ) . api
fileExplorer . creatNewFile ( )
let fileExplorer = globalRegistry . get ( 'fileexplorer/browser ' ) . api
fileExplorer . create NewFile ( )
}
} ,
{ label : 'Import from GitHub' , type : ` callback ` , payload : ( ) => { this . alert ( ` -imported from GitHub- ` ) } } ,
{ label : 'Import from gist' , type : ` callback ` , payload : ( ) => { this . alert ( ` -imported from gist- ` ) } } ,
{ label : 'Import from swarm' , type : ` callback ` , payload : ( ) => { this . alert ( ` -imported from swarm- ` ) } } ,
{ label : 'Import from ipfs' , type : ` callback ` , payload : ( ) => { this . alert ( ` -imported from ipfs- ` ) } } ,
{ label : 'Import from gist' , type : ` callback ` , payload : ( ) => { this . alert ( ` -imported from gist- ` ) } } ,
{ label : 'Open file' , type : ` callback ` , payload : ( ) => { this . alert ( ` -imported from gist- ` ) } }
] * /
var actionsLearn = [
{ label : 'Remix documentation' , type : ` link ` , payload : ` https://remix.readthedocs.io/en/latest/# ` } ,
{ label : 'GitHub repository' , type : ` link ` , payload : ` https://github.com/ethereum/remix-ide ` } ,
{ label : 'Access local file system. remixd' , type : ` link ` , payload : ` https://remix.readthedocs.io/en/latest/tutorial_remixd_filesystem.html ` } ,
{ label : 'npm module for remixd' , type : ` link ` , payload : ` https://www.npmjs.com/package/remixd ` } ,
{ label : 'Medium posts' , type : ` link ` , payload : ` https://medium.com/remix-ide ` } ,
{ label : 'Tutorials' , type : ` link ` , payload : ` https://github.com/ethereum/remix-workshops ` }
]
var actionsPlugins = [
{ label : 'Remix plugins & modules' , type : ` link ` , payload : ` https://github.com/ethereum/remix-plugin/blob/master/readme.md ` } ,
{ label : 'Repository on GitHub' , type : ` link ` , payload : ` https://github.com/ethereum/remix-plugin ` } ,
{ label : 'Examples' , type : ` link ` , payload : ` https://github.com/ethereum/remix-plugin/tree/master/examples ` } ,
{ label : 'Build a plugin for Remix' , type : ` link ` , payload : ` https://medium.com/remix-ide/build-a-plugin-for-remix-90d43b209c5a ` }
{ label : 'Open file' ,
type : ` callback ` ,
description : ` ` ,
payload : ( ) => { this . alert ( ` -imported from gist- ` ) }
} ,
{ label : 'Import from gist' ,
type : ` callback ` ,
description : ` ` ,
payload : ( ) => {
let app = globalRegistry . get ( 'app' ) . api
app . loadFromGist ( { gist : '' } )
}
} ,
{ label : 'Import from GitHub' ,
type : ` callback ` ,
description : ` ` ,
payload : ( ) => {
load ( 'URL' )
}
} ,
{ label : 'Import from Swarm' ,
type : ` callback ` ,
description : ` ` ,
payload : ( ) => { load ( 'bzz-raw URL' ) }
} ,
{ label : 'Import from IPFS' ,
type : ` callback ` ,
description : ` ` ,
payload : ( ) => { load ( 'IPFS URL' ) }
} ,
{ label : 'Connect to localhost' ,
type : ` callback ` ,
description : ` ` ,
payload : ( ) => {
appManager . ensureActivated ( 'remixd' )
}
}
]
var actionsHelp = [
{ label : 'Gitter channel' , type : ` link ` , payload : ` https://gitter.im/ethereum/remix ` } ,
{ label : 'Stack Overflow' , type : ` link ` , payload : ` https://stackoverflow.com/questions/tagged/remix ` } ,
{ label : 'Reddit' , type : ` link ` , payload : ` https://www.reddit.com/r/ethdev/search?q=remix&restrict_sr=1 ` }
{ label : 'Remix documentation' , type : ` link ` , description : ` ` , payload : ` https://remix.readthedocs.io/en/latest/# ` } ,
{ label : 'Access local file system. remixd' , description : ` ` , type : ` link ` , payload : ` https://remix.readthedocs.io/en/latest/tutorial_remixd_filesystem.html ` } ,
{ label : 'Medium posts' , type : ` link ` , description : ` ` , payload : ` https://medium.com/remix-ide ` } ,
{ label : 'Plugins & modules' , type : ` link ` , description : ` ` , payload : ` https://github.com/ethereum/remix-plugin/blob/master/readme.md ` } ,
{ label : 'GitHub repo' , type : ` link ` , description : ` ` , payload : ` https://github.com/ethereum/remix-ide ` } ,
{ label : 'Gitter channel' , type : ` link ` , description : ` ` , payload : ` https://gitter.im/ethereum/remix ` } ,
{ label : 'Stack Overflow' , type : ` link ` , description : ` ` , payload : ` https://stackoverflow.com/questions/tagged/remix ` } ,
{ label : 'Reddit' , type : ` link ` , description : ` ` , payload : ` https://www.reddit.com/r/ethdev/search?q=remix&restrict_sr=1 ` }
]
// var sectionStart = new Section('Start', actionsStart)
var sectionLearn = new Section ( 'Learn' , actionsLearn )
var sectionPlugins = new Section ( 'Plugins' , actionsPlugins )
var sectionHelp = new Section ( 'Help' , actionsHelp )
var sectionStart = new Section ( 'Start' , actionsStart )
let sectionHelp = new Section ( 'Help' , actionsHelp )
var sectionsWorkspaces = [ ]
this . sectionWorkspaceMain = [ ]
this . sectionWorkspaceOthers = [ ]
defaultWorkspaces ( appManager ) . forEach ( ( workspace ) => {
sectionsWorkspaces . push ( {
label : workspace . title ,
type : 'callback' ,
payload : ( ) => { workspace . activate ( ) }
} )
} )
sectionsWorkspaces . push ( {
label : 'Close All Modules' ,
type : 'callback' ,
payload : ( ) => {
appStore . getActives ( )
. filter ( ( { profile } ) => ! profile . required )
. forEach ( ( profile ) => { appManager . deactivateOne ( profile . name ) } )
if ( workspace . isMain ) {
this . sectionWorkspaceMain . push ( {
label : workspace . title ,
type : 'callback' ,
description : workspace . description ,
payload : ( ) => { workspace . activate ( ) }
} )
} else {
this . sectionWorkspaceOthers . push ( {
label : workspace . title ,
type : 'callback' ,
description : workspace . description ,
payload : ( ) => { workspace . activate ( ) }
} )
}
} )
var sectionWorkspace = new Section ( 'Workspaces' , sectionsWorkspaces )
this . sections . push ( sectionWorkspace )
// this.sections.push(sectionStart)
this . sections . push ( sectionLearn )
this . sections . push ( sectionPlugins )
this . sections . push ( sectionStart )
this . sections . push ( sectionHelp )
}
@ -131,20 +172,54 @@ export class LandingPage extends ApiFactory {
< div class = "${css.landingPage}" >
< / d i v >
`
totalLook . appendChild ( yo `
< div class = "${css.sectionContainer} p-2" >
< img class = "${css.im}" src = "${logo}" / >
$ { this . sections [ 0 ] . render ( ) }
< / d i v >
` )
for ( let i = 1 ; i < this . sections . length ; i ++ ) {
totalLook . appendChild ( yo `
let main = yo ` <div class="container m-4"></div> `
for ( let i = 0 ; i < this . sectionWorkspaceMain . length ; i ++ ) {
main . appendChild ( yo `
< span class = "btn btn-secondary btn-lg m-2" onclick = "${this.sectionWorkspaceMain[i].payload}" >
$ { this . sectionWorkspaceMain [ i ] . label }
< / s p a n >
` )
}
let others = yo ` <div class="container m-4"></div> `
for ( let i = 0 ; i < this . sectionWorkspaceOthers . length ; i ++ ) {
others . appendChild ( yo `
< span class = "btn btn-secondary btn-sm m-2" onclick = "${this.sectionWorkspaceOthers[i].payload}" >
$ { this . sectionWorkspaceOthers [ i ] . label }
< / s p a n >
` )
}
let docs = yo ` <div class="container m-4"></div> `
for ( let i = 0 ; i < this . sections . length ; i ++ ) {
docs . appendChild ( yo `
< div class = "${css.sectionContainer} p-2" >
$ { this . sections [ i ] . render ( ) }
< / d i v >
` )
}
totalLook . appendChild ( yo `
< div class = "container-fluid" >
< div class = "row" >
< div class = "card m-4 p-4" style = "min-width: 50%;" >
< img class = "card-img-top ${css.im}" src = "${logo}" / >
< div class = "card-body-fluid m-4" >
< h5 class = "card-header m-4" > Workspaces < / h 5 >
< h6 > Create , compile and execute smart contracts < / h 6 >
< p > $ { main } < / p >
< h6 > Most used plugins < / h 6 >
< p > $ { others } < / p >
< / d i v >
< / d i v >
< div >
$ { docs }
< / d i v >
< / d i v >
< / d i v >
` )
return totalLook
}
}
yann300
6 years ago
committed by
GitHub