Прокидывание кода и стейта в title и hash

This commit is contained in:
SleepWalker 2016-03-16 06:46:44 +02:00
parent e0d93c3058
commit bd9635fc12

View File

@ -3,6 +3,7 @@ import React, { Component, PropTypes } from 'react';
import { connect } from 'react-redux'; import { connect } from 'react-redux';
import { FormattedMessage as Message } from 'react-intl'; import { FormattedMessage as Message } from 'react-intl';
import classNames from 'classnames'; import classNames from 'classnames';
import Helmet from 'react-helmet';
import buttons from 'components/ui/buttons.scss'; import buttons from 'components/ui/buttons.scss';
@ -23,36 +24,20 @@ class Finish extends Component {
isCopySupported: document.queryCommandSupported && document.queryCommandSupported('copy') isCopySupported: document.queryCommandSupported && document.queryCommandSupported('copy')
}; };
handleCopyClick = (event) => {
event.preventDefault();
// http://stackoverflow.com/a/987376/5184751
try {
const selection = window.getSelection();
const range = document.createRange();
range.selectNodeContents(this.code);
selection.removeAllRanges();
selection.addRange(range);
const successful = document.execCommand('copy');
selection.removeAllRanges();
// TODO: было бы ещё неплохо сделать какую-то анимацию, вроде "Скопировано",
// ибо сейчас после клика как-то неубедительно, скопировалось оно или нет
console.log('Copying text command was ' + (successful ? 'successful' : 'unsuccessful'));
} catch (err) {}
};
setCode = (el) => {
this.code = el;
};
render() { render() {
const {appName, code, displayCode, success} = this.props; const {appName, code, state, displayCode, success} = this.props;
const {isCopySupported} = this.state; const {isCopySupported} = this.state;
const authData = JSON.stringify({
auth_code: code,
state: state
});
history.pushState(null, null, `#${authData}`);
return ( return (
<div className={styles.finishPage}> <div className={styles.finishPage}>
<Helmet title={authData} />
{success ? ( {success ? (
<div> <div>
<div className={styles.successBackground}></div> <div className={styles.successBackground}></div>
@ -102,11 +87,36 @@ class Finish extends Component {
</div> </div>
); );
} }
handleCopyClick = (event) => {
event.preventDefault();
// http://stackoverflow.com/a/987376/5184751
try {
const selection = window.getSelection();
const range = document.createRange();
range.selectNodeContents(this.code);
selection.removeAllRanges();
selection.addRange(range);
const successful = document.execCommand('copy');
selection.removeAllRanges();
// TODO: было бы ещё неплохо сделать какую-то анимацию, вроде "Скопировано",
// ибо сейчас после клика как-то неубедительно, скопировалось оно или нет
console.log('Copying text command was ' + (successful ? 'successful' : 'unsuccessful'));
} catch (err) {}
};
setCode = (el) => {
this.code = el;
};
} }
export default connect(({auth}) => ({ export default connect(({auth}) => ({
appName: auth.client.name, appName: auth.client.name,
code: auth.oauth.code, code: auth.oauth.code,
displayCode: auth.oauth.displayCode, displayCode: auth.oauth.displayCode,
state: auth.oauth.state,
success: auth.oauth.success success: auth.oauth.success
}))(Finish); }))(Finish);