grassrootseconomics/openethereum
5
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

sms verification: fix styling ✨

Browse Source
This commit is contained in:
Jannis R 2016-11-17 12:26:59 +01:00
parent ed2b8e14fc
commit 13448930e9
No known key found for this signature in database
GPG Key ID: 0FE83946296A88A5
9 changed files with 101 additions and 77 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
js/src/contracts/abi/index.js
View File

@ -23,6 +23,7 @@ import githubhint from './githubhint.json';
import owned from './owned.json';
import registry from './registry.json';
import signaturereg from './signaturereg.json';
import smsVerification from './sms-verification.json';
import tokenreg from './tokenreg.json';
import wallet from './wallet.json';
@ -36,6 +37,7 @@ export {
owned,
registry,
signaturereg,
smsVerification,
tokenreg,
wallet
};

1
js/src/modals/SMSVerification/Done/done.css
View File

@ -23,6 +23,7 @@
display: flex;
align-items: center;
}
.message {
margin-top: 0;
margin-bottom: 0;

16
js/src/modals/SMSVerification/GatherData/gatherData.css
View File

@ -37,11 +37,13 @@
.terms {
line-height: 1.3;
opacity: .7;
}
.terms ul {
padding-left: 1.5em;
}
.terms li {
margin-top: .2em;
margin-bottom: .2em;
ul {
padding-left: 1.5em;
}
li {
margin-top: .2em;
margin-bottom: .2em;
}
}

11
js/src/modals/SMSVerification/GatherData/gatherData.js
View File

@ -96,8 +96,7 @@ export default class GatherData extends Component {
<p className={ styles.message }>Your account is already verified.</p>
</div>
);
}
if (isVerified === false) {
} else if (isVerified === false) {
return (
<div className={ styles.container }>
<SuccessIcon />
@ -105,7 +104,9 @@ export default class GatherData extends Component {
</div>
);
}
return (<p className={ styles.message }>Checking if your account is verified…</p>);
return (
<p className={ styles.message }>Checking if your account is verified…</p>
);
}
renderRequested () {
@ -132,7 +133,9 @@ export default class GatherData extends Component {
</div>
);
}
return (<p className={ styles.message }>Checking if you requested verification…</p>);
return (
<p className={ styles.message }>Checking if you requested verification…</p>
);
}
numberOnSubmit = (value) => {

1
js/src/modals/SMSVerification/QueryCode/queryCode.js
View File

@ -45,6 +45,7 @@ export default class QueryCode extends Component {
onChange = (_, code) => {
this.props.setCode(code.trim());
}
onSubmit = (code) => {
this.props.setCode(code.trim());
}

29
js/src/modals/SMSVerification/SMSVerification.js
View File

@ -83,7 +83,9 @@ export default class SMSVerification extends Component {
onClick={ onClose }
/>
);
if (error) return (<div>{ cancel }</div>);
if (error) {
return (<div>{ cancel }</div>);
}
if (phase === 4) {
return (
@ -100,14 +102,19 @@ export default class SMSVerification extends Component {
}
let action;
if (phase === 3) {
action = store.done;
} else if (phase === 2) {
action = store.sendConfirmation;
} else if (phase === 1) {
action = store.queryCode;
} else if (phase === 0) {
action = store.sendRequest;
switch (phase) {
case 0:
action = store.sendRequest;
break;
case 1:
action = store.queryCode;
break;
case 2:
action = store.sendConfirmation;
break;
case 3:
action = store.done;
break;
}
return (
@ -124,7 +131,9 @@ export default class SMSVerification extends Component {
}
renderStep (phase, error) {
if (error) return (<p>{ error }</p>);
if (error) {
return (<p>{ error }</p>);
}
const {
step,

32
js/src/modals/SMSVerification/SendRequest/sendRequest.js
View File

@ -35,23 +35,25 @@ export default class SendRequest extends Component {
render () {
const { step, tx } = this.props;
if (step === POSTING_REQUEST) {
return (<p>A verification request will be sent to the contract. Please authorize this using the Parity Signer.</p>);
}
switch (step) {
case POSTING_REQUEST:
return (<p>A verification request will be sent to the contract. Please authorize this using the Parity Signer.</p>);
if (step === POSTED_REQUEST) {
return (
<div className={ styles.centered }>
<TxHash hash={ tx } maxConfirmations={ 1 } />
<p>Please keep this window open.</p>
</div>
);
}
case POSTED_REQUEST:
return (
<div className={ styles.centered }>
<TxHash hash={ tx } maxConfirmations={ 1 } />
<p>Please keep this window open.</p>
</div>
);
if (step === REQUESTING_SMS) {
return (<p>Requesting an SMS from the Parity server.</p>);
}
case REQUESTING_SMS:
return (
<p>Requesting an SMS from the Parity server.</p>
);
return null;
default:
return null;
}
}
}

82
js/src/modals/SMSVerification/store.js
View File

@ -69,29 +69,18 @@ export default class VerificationStore {
return false;
}
if (this.step === GATHERED_DATA) {
return this.fee && this.isVerified === false && this.isNumberValid && this.consentGiven;
switch (this.step) {
case GATHERED_DATA:
return this.fee && this.isVerified === false && this.isNumberValid && this.consentGiven;
case REQUESTED_SMS:
return this.requestTx;
case QUERY_CODE:
return this.isCodeValid;
case POSTED_CONFIRMATION:
return this.confirmationTx;
default:
return false;
}
if (this.step === REQUESTED_SMS) {
return this.requestTx;
}
if (this.step === QUERY_CODE) {
return this.isCodeValid;
}
if (this.step === POSTED_CONFIRMATION) {
return this.confirmationTx;
}
return false;
}
@action setNumber = (number) => {
this.number = number;
}
@action setConsentGiven = (consentGiven) => {
this.consentGiven = consentGiven;
}
@action setCode = (code) => {
this.code = code;
}
constructor (api, account) {
@ -106,6 +95,18 @@ export default class VerificationStore {
});
}
@action setNumber = (number) => {
this.number = number;
}
@action setConsentGiven = (consentGiven) => {
this.consentGiven = consentGiven;
}
@action setCode = (code) => {
this.code = code;
}
@action gatherData = () => {
const { contract, account } = this;
this.step = GATHERING_DATA;
@ -137,10 +138,11 @@ export default class VerificationStore {
this.error = 'Failed to check if requested: ' + err.message;
});
Promise.all([ fee, isVerified, hasRequested ])
.then(() => {
this.step = GATHERED_DATA;
});
Promise
.all([ fee, isVerified, hasRequested ])
.then(() => {
this.step = GATHERED_DATA;
});
}
@action sendRequest = () => {
@ -165,13 +167,13 @@ export default class VerificationStore {
.then((txHash) => {
this.requestTx = txHash;
return checkIfTxFailed(api, txHash, options.gas)
.then((hasFailed) => {
if (hasFailed) {
throw new Error('Transaction failed, all gas used up.');
}
this.step = POSTED_REQUEST;
return waitForConfirmations(api, txHash, 1);
});
.then((hasFailed) => {
if (hasFailed) {
throw new Error('Transaction failed, all gas used up.');
}
this.step = POSTED_REQUEST;
return waitForConfirmations(api, txHash, 1);
});
});
}
@ -214,13 +216,13 @@ export default class VerificationStore {
.then((txHash) => {
this.confirmationTx = txHash;
return checkIfTxFailed(api, txHash, options.gas)
.then((hasFailed) => {
if (hasFailed) {
throw new Error('Transaction failed, all gas used up.');
}
this.step = POSTED_CONFIRMATION;
return waitForConfirmations(api, txHash, 1);
});
.then((hasFailed) => {
if (hasFailed) {
throw new Error('Transaction failed, all gas used up.');
}
this.step = POSTED_CONFIRMATION;
return waitForConfirmations(api, txHash, 1);
});
})
.then(() => {
this.step = DONE;

4
js/src/ui/TxHash/txHash.js
View File

@ -102,7 +102,9 @@ class TxHash extends Component {
<div className={ styles.confirm }>
<LinearProgress
className={ styles.progressbar }
min={ 0 } max={ maxConfirmations } value={ value }
min={ 0 }
max={ maxConfirmations }
value={ value }
color='white'
mode='determinate' />
<div className={ styles.progressinfo }>