diff options
-rw-r--r-- | vnext/package.json | 4 | ||||
-rw-r--r-- | vnext/src/components/Chat.js | 3 | ||||
-rw-r--r-- | vnext/src/components/Feeds.js | 3 | ||||
-rw-r--r-- | vnext/src/components/LoginButton.js | 15 | ||||
-rw-r--r-- | vnext/src/components/MessageInput.js | 16 | ||||
-rw-r--r-- | vnext/src/components/Thread.js | 8 | ||||
-rw-r--r-- | vnext/src/index.js | 5 | ||||
-rw-r--r-- | vnext/yarn.lock | 13 |
8 files changed, 36 insertions, 31 deletions
diff --git a/vnext/package.json b/vnext/package.json index 845e6426..640283e7 100644 --- a/vnext/package.json +++ b/vnext/package.json @@ -14,6 +14,7 @@ "babel-core": "^6.26.3", "babel-jest": "^23.0.1", "babel-loader": "^7.1.4", + "babel-plugin-transform-class-properties": "^6.24.1", "babel-preset-env": "^1.7.0", "babel-preset-react": "^6.24.1", "connect-history-api-fallback": "^1.5.0", @@ -38,6 +39,9 @@ "whatwg-fetch": "^2.0.4" }, "babel": { + "plugins": [ + ["transform-class-properties", {"spec": true}] + ], "presets": [ "env", "react" diff --git a/vnext/src/components/Chat.js b/vnext/src/components/Chat.js index 79425c12..c4d9422f 100644 --- a/vnext/src/components/Chat.js +++ b/vnext/src/components/Chat.js @@ -11,13 +11,12 @@ export default class Chat extends React.Component { this.state = { chats: [] }; - this.loadChat = this.loadChat.bind(this); } componentWillMount() { this.loadChat(this.props.match.params.user); } - loadChat(uname) { + loadChat = (uname) => { const { hash } = this.props.visitor; this.setState({ chats: [] diff --git a/vnext/src/components/Feeds.js b/vnext/src/components/Feeds.js index 0f12575f..5e9c14d0 100644 --- a/vnext/src/components/Feeds.js +++ b/vnext/src/components/Feeds.js @@ -61,7 +61,6 @@ class Feed extends React.Component { this.state = { msgs: [] }; - this.loadMessages = this.loadMessages.bind(this); } componentDidMount() { this.loadMessages(this.props.visitor.hash, this.props.location.search); @@ -72,7 +71,7 @@ class Feed extends React.Component { this.loadMessages(nextProps.visitor.hash, nextProps.location.search) } } - loadMessages(hash = '', filter = '') { + loadMessages = (hash = '', filter = '') => { document.body.scrollTop = 0; document.documentElement.scrollTop = 0; this.setState({ msgs: [] }) diff --git a/vnext/src/components/LoginButton.js b/vnext/src/components/LoginButton.js index 22ae2198..fb3c087e 100644 --- a/vnext/src/components/LoginButton.js +++ b/vnext/src/components/LoginButton.js @@ -11,25 +11,24 @@ export default class LoginButton extends React.Component { username: '', password: '' }; - this.toggleModal = this.toggleModal.bind(this); } - toggleModal(event) { + toggleModal = (event) => { if (event) event.preventDefault() this.setState({ isOpen: !this.state.isOpen }); } - usernameChanged(event) { + usernameChanged = (event) => { this.setState({ username: event.target.value }) } - passwordChanged(event) { + passwordChanged = (event) => { this.setState({ password: event.target.value }) } - login(event) { + login = (event) => { event.preventDefault(); let headers = new Headers(); headers.append('Authorization', 'Basic ' + window.btoa(unescape(encodeURIComponent(this.state.username + ":" + this.state.password)))); @@ -67,16 +66,16 @@ export default class LoginButton extends React.Component { </a> </div> <p>Already registered?</p> - <form onSubmit={this.login.bind(this)}> + <form onSubmit={this.login}> <input className="signinput" type="text" name="username" placeholder="Username..." - value={this.state.username} onChange={this.usernameChanged.bind(this)} /><br /> + value={this.state.username} onChange={this.usernameChanged} /><br /> <input className="signinput" type="password" name="password" placeholder="Password..." - value={this.state.password} onChange={this.passwordChanged.bind(this)} /><br /> + value={this.state.password} onChange={this.passwordChanged} /><br /> <input className="signsubmit" type="submit" value="OK" /> </form> </div> diff --git a/vnext/src/components/MessageInput.js b/vnext/src/components/MessageInput.js index 6e698c32..e30962a8 100644 --- a/vnext/src/components/MessageInput.js +++ b/vnext/src/components/MessageInput.js @@ -9,12 +9,6 @@ import Button from './Button'; export default class MessageInput extends React.Component { constructor(props) { super(props) - this.textChanged = this.textChanged.bind(this); - this.attachmentChanged = this.attachmentChanged.bind(this); - this.openfile = this.openfile.bind(this); - this.handleCtrlEnter = this.handleCtrlEnter.bind(this); - this.onSubmit = this.onSubmit.bind(this); - this.textarea = React.createRef(); this.fileinput = React.createRef(); this.state = { @@ -26,13 +20,13 @@ export default class MessageInput extends React.Component { } } - handleCtrlEnter(event) { + handleCtrlEnter = (event) => { if (event.ctrlKey && (event.charCode == 10 || event.charCode == 13)) { this.onSubmit({}) } } - onSubmit(event) { + onSubmit = (event) => { if (event.preventDefault) event.preventDefault(); const input = this.fileinput.current; this.props.onSend({ @@ -50,7 +44,7 @@ export default class MessageInput extends React.Component { componentDidMount() { this.textarea.current.focus() } - textChanged(event) { + textChanged = (event) => { this.setState({ body: event.target.value }) @@ -59,12 +53,12 @@ export default class MessageInput extends React.Component { const height = el.scrollHeight + offset; el.style.height = `${height + offset}px`; } - attachmentChanged(event) { + attachmentChanged = (event) => { this.setState({ attach: event.target.value }) } - openfile() { + openfile = () => { const input = this.fileinput.current; if (this.state.attach) { this.setState({ diff --git a/vnext/src/components/Thread.js b/vnext/src/components/Thread.js index 5ff91346..17c5b55c 100644 --- a/vnext/src/components/Thread.js +++ b/vnext/src/components/Thread.js @@ -21,8 +21,6 @@ export default class Thread extends React.Component { replies: [], active: 0 }; - this.loaded = this.loaded.bind(this); - this.postComment = this.postComment.bind(this); } componentDidMount() { document.body.scrollTop = 0; @@ -55,7 +53,7 @@ export default class Thread extends React.Component { console.log(ex); }); } - loaded() { + loaded = () => { return (this.state.replies && this.state.replies.length > 0) || ('mid' in this.state.msg && !('replies' in this.state.msg)); } setActive(msg, event) { @@ -63,7 +61,7 @@ export default class Thread extends React.Component { active: msg.rid || 0 }) } - postComment(template) { + postComment = (template) => { const url = `https://api.juick.com/comment?hash=${this.props.visitor.hash}`; let form = new FormData(); form.append('mid', template.mid); @@ -150,7 +148,7 @@ export default class Thread extends React.Component { { this.props.visitor.uid > 0 ? ( <React.Fragment> - {this.state.active === msg.rid || <Button onClick={this.setActive.bind(this, msg)}><Icon name="ei-envelope" size="s" />Reply</Button>} + {this.state.active === msg.rid || <Button onClick={() => this.setActive(msg)}><Icon name="ei-envelope" size="s" />Reply</Button>} {this.state.active === msg.rid && <MessageInput data={msg} onSend={this.postComment} />} </React.Fragment> ) : ( diff --git a/vnext/src/index.js b/vnext/src/index.js index 556745ff..2caaf5bb 100644 --- a/vnext/src/index.js +++ b/vnext/src/index.js @@ -20,7 +20,6 @@ const elClassBackground = 'header--background'; class App extends React.Component { constructor(props) { super(props); - this.auth = this.auth.bind(this); let params = qs.parse(window.location.search) if (params.hash) { window.localStorage.hash = params.hash @@ -125,7 +124,7 @@ class App extends React.Component { {user.uid > 0 ? <Link to={{ pathname: '/post' }}><Icon name="ei-pencil" size="s" />Post</Link> : - <LoginButton title="Login" onAuth={this.auth.bind(this)} /> + <LoginButton title="Login" onAuth={this.auth} /> } </li> </ul> @@ -216,7 +215,7 @@ class App extends React.Component { </Router> ) } - auth(data) { + auth = (data) => { if (data) { window.localStorage.hash = data; fetch(`https://api.juick.com/users?hash=${data}`) diff --git a/vnext/yarn.lock b/vnext/yarn.lock index fa1abae1..10c5cf09 100644 --- a/vnext/yarn.lock +++ b/vnext/yarn.lock @@ -654,6 +654,10 @@ babel-plugin-syntax-async-functions@^6.8.0: version "6.13.0" resolved "https://registry.yarnpkg.com/babel-plugin-syntax-async-functions/-/babel-plugin-syntax-async-functions-6.13.0.tgz#cad9cad1191b5ad634bf30ae0872391e0647be95" +babel-plugin-syntax-class-properties@^6.8.0: + version "6.13.0" + resolved "https://registry.yarnpkg.com/babel-plugin-syntax-class-properties/-/babel-plugin-syntax-class-properties-6.13.0.tgz#d7eb23b79a317f8543962c505b827c7d6cac27de" + babel-plugin-syntax-exponentiation-operator@^6.8.0: version "6.13.0" resolved "https://registry.yarnpkg.com/babel-plugin-syntax-exponentiation-operator/-/babel-plugin-syntax-exponentiation-operator-6.13.0.tgz#9ee7e8337290da95288201a6a57f4170317830de" @@ -682,6 +686,15 @@ babel-plugin-transform-async-to-generator@^6.22.0: babel-plugin-syntax-async-functions "^6.8.0" babel-runtime "^6.22.0" +babel-plugin-transform-class-properties@^6.24.1: + version "6.24.1" + resolved "https://registry.yarnpkg.com/babel-plugin-transform-class-properties/-/babel-plugin-transform-class-properties-6.24.1.tgz#6a79763ea61d33d36f37b611aa9def81a81b46ac" + dependencies: + babel-helper-function-name "^6.24.1" + babel-plugin-syntax-class-properties "^6.8.0" + babel-runtime "^6.22.0" + babel-template "^6.24.1" + babel-plugin-transform-es2015-arrow-functions@^6.22.0: version "6.22.0" resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-arrow-functions/-/babel-plugin-transform-es2015-arrow-functions-6.22.0.tgz#452692cb711d5f79dc7f85e440ce41b9f244d221" |