tronair-gui
Version:
Web application/GUI for performing airdrops on the TRON blockchain
210 lines (190 loc) • 8.59 kB
JavaScript
import React, { Component } from 'react';
import './App.css';
import img_state0_elImage282629 from './images/SubmitScreen_state0_elImage282629_282629.jpg';
import Submitoptions from './Submitoptions';
import Cnbanner from './Cnbanner';
import Progressbar from './Progressbar';
import Sidebar from './Sidebar';
import img_state1_elImage282629 from './images/SubmitScreen_state0_elImage282629_282629.jpg';
import Demoscreen from './Demoscreen';
import { Row, Button, Icon } from 'antd';
import "antd/dist/antd.css";
export default class SubmitScreen extends Component {
// --- Functions for component state index 0 (1 of 2) ---
renderState0() {
// eslint-disable-next-line no-unused-vars
let baseStyle = {};
// eslint-disable-next-line no-unused-vars
let layoutFlowStyle = {};
if (this.props.transitionId && this.props.transitionId.length > 0 && this.props.atTopOfScreenStack && this.props.transitionForward) {
baseStyle.animation = '0.25s ease-in-out '+this.props.transitionId;
}
if ( !this.props.atTopOfScreenStack) {
layoutFlowStyle.height = '100vh';
layoutFlowStyle.overflow = 'hidden';
}
const style_state0_elBackground134370 = {
width: '100%',
height: '100%',
};
const style_state0_elBackground134370_outer = {
backgroundColor: '#f6f6f6',
};
const style_state0_elImage282629 = {
backgroundImage: 'url('+img_state0_elImage282629+')',
backgroundRepeat: 'no-repeat',
backgroundPosition: '50% 50%',
backgroundSize: 'cover',
};
const style_state0_elComponent289835_outer = {
boxShadow: '0.0px 6.8px 48px rgba(0, 0, 0, 0.4500)',
borderRadius: '5px',
};
return (
<div className="AppScreen SubmitScreen" style={baseStyle}>
<div className="background">
<div className='appBg containerMinHeight state0_elBackground134370' style={style_state0_elBackground134370_outer}>
<div style={style_state0_elBackground134370} />
</div>
<div className='containerMinHeight state0_elImage282629' style={style_state0_elImage282629} />
</div>
<div className="layoutFlow" style={layoutFlowStyle}>
<div className='hasNestedComps state0_elComponent289835' style={style_state0_elComponent289835_outer}>
<div>
<Submitoptions ref={(el)=> this._state0_elComponent289835 = el} appActions={this.props.appActions} deviceInfo={this.props.deviceInfo} locStrings={this.props.locStrings} />
</div>
</div>
<div>
<Row
style={{
height: '50px',
marginTop: '5px',
marginLeft: '20%',
}}>
<Button
style={{
cursor:'pointer',
pointerEvents:'auto',
textAlign: 'center',
width: '20%',
height: '45px',
}}
size='large'
onClick={() => { this.props.appActions.goToScreen('review', { transitionId: 'fadeIn' }) }}>
<Icon type="caret-left" />
Go Back
</Button>
</Row>
</div>
</div>
<div className="screenFgContainer">
<div className="foreground">
<div className='hasNestedComps state0_elCNBanner154895'>
<Cnbanner visualStateIndex={this.props.ds_isLoggedIn} ref={(el)=> this._state0_elCNBanner154895 = el} appActions={this.props.appActions} deviceInfo={this.props.deviceInfo} locStrings={this.props.locStrings} />
</div>
<div className='hasNestedComps state0_elProgressbar254548'>
<Progressbar visualStateIndex={3} ref={(el)=> this._state0_elProgressbar254548 = el} appActions={this.props.appActions} deviceInfo={this.props.deviceInfo} locStrings={this.props.locStrings} />
</div>
<div>
<Sidebar {...this.props} visualStateIndex={this.props.ds_isLoggedIn} ref={(el)=> this._elNavBar2 = el} appActions={this.props.appActions} deviceInfo={this.props.deviceInfo} locStrings={this.props.locStrings} />
</div>
</div>
</div>
</div>
)
}
// --- Functions for component state index 1 (2 of 2) ---
renderState1() {
// eslint-disable-next-line no-unused-vars
let baseStyle = {};
// eslint-disable-next-line no-unused-vars
let layoutFlowStyle = {};
if (this.props.transitionId && this.props.transitionId.length > 0 && this.props.atTopOfScreenStack && this.props.transitionForward) {
baseStyle.animation = '0.25s ease-in-out '+this.props.transitionId;
}
if ( !this.props.atTopOfScreenStack) {
layoutFlowStyle.height = '100vh';
layoutFlowStyle.overflow = 'hidden';
}
const style_state1_elBackground134370 = {
width: '100%',
height: '100%',
};
const style_state1_elBackground134370_outer = {
backgroundColor: '#f6f6f6',
};
const style_state1_elImage282629 = {
backgroundImage: 'url('+img_state1_elImage282629+')',
backgroundRepeat: 'no-repeat',
backgroundPosition: '50% 50%',
backgroundSize: 'cover',
};
const style_state1_elComponent289835_outer = {
boxShadow: '0.0px 6.8px 48px rgba(0, 0, 0, 0.4500)',
borderRadius: '5px',
};
// const fntsz = this.props.appActions.dataSlots.ds_win_width*0.017 + 'px';
return (
<div className="AppScreen SubmitScreen" style={baseStyle}>
<div className="background">
<div className='appBg containerMinHeight state1_elBackground134370' style={style_state1_elBackground134370_outer}>
<div style={style_state1_elBackground134370} />
</div>
<div className='containerMinHeight state1_elImage282629' style={style_state1_elImage282629} />
</div>
<div className="layoutFlow" style={layoutFlowStyle}>
<div className='hasNestedComps state1_elComponent289835' style={style_state1_elComponent289835_outer}>
<div>
<Submitoptions ref={(el)=> this._state1_elComponent289835 = el} appActions={this.props.appActions} deviceInfo={this.props.deviceInfo} locStrings={this.props.locStrings} />
</div>
</div>
<div style={{cursor:'pointer',pointerEvents:'auto'}}>
<Row
style={{
height: '50px',
marginTop: '5px',
marginLeft: '20%',
}}>
<Button
style={{
textAlign: 'center',
width: '20%',
height: '45px',
}}
size='large'
onClick={this.onClick_goBackBtn}>
<Icon type="caret-left" />
Go Back
</Button>
</Row>
</div>
</div>
<div className="screenFgContainer">
<div className="foreground">
<div className='hasNestedComps state1_elCNBanner154895'>
<Cnbanner visualStateIndex={this.props.ds_isLoggedIn} ref={(el)=> this._state1_elCNBanner154895 = el} appActions={this.props.appActions} deviceInfo={this.props.deviceInfo} locStrings={this.props.locStrings} />
</div>
<div className='hasNestedComps state1_elProgressbar254548'>
<Progressbar visualStateIndex={3} ref={(el)=> this._state1_elProgressbar254548 = el} appActions={this.props.appActions} deviceInfo={this.props.deviceInfo} locStrings={this.props.locStrings} />
</div>
<div className='hasNestedComps containerMinHeight state1_elComponent'>
<Demoscreen ref={(el)=> this._state1_elComponent = el} appActions={this.props.appActions} deviceInfo={this.props.deviceInfo} locStrings={this.props.locStrings} />
</div>
<div>
<Sidebar {...this.props} visualStateIndex={this.props.ds_isLoggedIn} ref={(el)=> this._elNavBar2 = el} appActions={this.props.appActions} deviceInfo={this.props.deviceInfo} locStrings={this.props.locStrings} />
</div>
</div>
</div>
</div>
)
}
render() {
switch (parseInt((this.props.ds_commence_drop !== undefined) ? this.props.ds_commence_drop : 0, 10)) {
default:
case 0:
return this.renderState0();
case 1:
return this.renderState1();
}
}
}