From 433466a3947e75a36b811795bc21be1fff10b5e8 Mon Sep 17 00:00:00 2001 From: jackyzha0 Date: Mon, 11 May 2020 21:11:16 -0700 Subject: backend redir --- frontend/src/components/ViewPaste.js | 16 ++++++++++++++++ 1 file changed, 16 insertions(+) create mode 100644 frontend/src/components/ViewPaste.js (limited to 'frontend/src/components/ViewPaste.js') diff --git a/frontend/src/components/ViewPaste.js b/frontend/src/components/ViewPaste.js new file mode 100644 index 0000000..aa0da34 --- /dev/null +++ b/frontend/src/components/ViewPaste.js @@ -0,0 +1,16 @@ +import React from 'react'; +// import { TitleInput, PasteInput } from './Inputs' +// import OptionsContainer from './Options' +// import axios from 'axios'; + +class ViewPaste extends React.Component { + render() { + return ( +
+ {this.props.hash} +
+ ); + } +} + +export default ViewPaste \ No newline at end of file -- cgit v1.2.3 From e563ee55db6c7a9fa719289638f5b9a8fbd72fda Mon Sep 17 00:00:00 2001 From: jackyzha0 Date: Mon, 11 May 2020 22:19:40 -0700 Subject: fix readonly + fields + mount err --- frontend/src/components/ViewPaste.js | 64 +++++++++++++++++++++++++++++++++--- 1 file changed, 60 insertions(+), 4 deletions(-) (limited to 'frontend/src/components/ViewPaste.js') diff --git a/frontend/src/components/ViewPaste.js b/frontend/src/components/ViewPaste.js index aa0da34..f9541da 100644 --- a/frontend/src/components/ViewPaste.js +++ b/frontend/src/components/ViewPaste.js @@ -1,16 +1,72 @@ import React from 'react'; -// import { TitleInput, PasteInput } from './Inputs' -// import OptionsContainer from './Options' -// import axios from 'axios'; +import axios from 'axios'; +import Error from './Err'; +import { TitleInput, PasteInput } from './Inputs'; class ViewPaste extends React.Component { + + constructor(props) { + super(props); + + this.state = { + title: '', + content: '', + hasPass: false, + expiry: '', + timestamp: '', + error: '', + }; + } + + newErr(msg) { + this.setState({ error: msg }) + setTimeout(() => { + this.setState({ error: '' }) + }, 3000); + } + render() { return (
- {this.props.hash} + + +
); } + + componentDidMount() { + const serverURL = `http://localhost:8080/api/${this.props.hash}` + + axios.get(serverURL) + .then((response) => { + const data = response.data + console.log(data) + this.setState({ + title: data.title, + content: data.content, + expiry: data.expiry, + timestamp: data.timestamp + }) + }).catch((error) => { + const resp = error.response + + // some weird err + if (resp !== undefined) { + const errTxt = `${resp.statusText}: ${resp.data}` + this.newErr(errTxt) + } else { + // some weird err (e.g. network) + this.newErr(error) + } + }) + } } export default ViewPaste \ No newline at end of file -- cgit v1.2.3 From a1d00c1f90e35f2fb3e33cd51cc30b5e6a44f6ac Mon Sep 17 00:00:00 2001 From: jackyzha0 Date: Mon, 11 May 2020 23:15:07 -0700 Subject: fmt info component --- frontend/src/components/ViewPaste.js | 47 +++++++++++++++++++++++++----------- 1 file changed, 33 insertions(+), 14 deletions(-) (limited to 'frontend/src/components/ViewPaste.js') diff --git a/frontend/src/components/ViewPaste.js b/frontend/src/components/ViewPaste.js index f9541da..bba0219 100644 --- a/frontend/src/components/ViewPaste.js +++ b/frontend/src/components/ViewPaste.js @@ -2,27 +2,38 @@ import React from 'react'; import axios from 'axios'; import Error from './Err'; import { TitleInput, PasteInput } from './Inputs'; +import PasteInfo from './PasteInfo'; + +const RENDER_MODES = Object.freeze({ + RAW: 'raw text', + MD: 'markdown', + LATEX: 'latex', + CODE: 'code', +}) class ViewPaste extends React.Component { constructor(props) { super(props); - this.state = { - title: '', + title: 'untitled paste', content: '', hasPass: false, - expiry: '', - timestamp: '', + expiry: 'no expiry', error: '', + mode: RENDER_MODES.RAW, }; } - - newErr(msg) { + + newErr(msg, duration = 5000) { this.setState({ error: msg }) - setTimeout(() => { - this.setState({ error: '' }) - }, 3000); + + // if duration -1, dont clear + if (duration !== -1) { + setTimeout(() => { + this.setState({ error: '' }) + }, duration); + } } render() { @@ -36,23 +47,31 @@ class ViewPaste extends React.Component { content={this.state.content} id="pasteInput" readOnly /> + ); } + fmtDateStr(dateString) { + const d = new Date(dateString) + const options = { hour: '2-digit', minute: '2-digit', year: 'numeric', month: 'long', day: 'numeric' } + return d.toLocaleDateString("en-US", options).toLocaleLowerCase() + } + componentDidMount() { const serverURL = `http://localhost:8080/api/${this.props.hash}` axios.get(serverURL) .then((response) => { const data = response.data - console.log(data) + console.log(this.fmtDateStr(data.expiry)) this.setState({ title: data.title, content: data.content, - expiry: data.expiry, - timestamp: data.timestamp + expiry: this.fmtDateStr(data.expiry), }) }).catch((error) => { const resp = error.response @@ -60,10 +79,10 @@ class ViewPaste extends React.Component { // some weird err if (resp !== undefined) { const errTxt = `${resp.statusText}: ${resp.data}` - this.newErr(errTxt) + this.newErr(errTxt, -1) } else { // some weird err (e.g. network) - this.newErr(error) + this.newErr(error, -1) } }) } -- cgit v1.2.3 From ee9bb1e9249079379ceff3b031296e284aedc872 Mon Sep 17 00:00:00 2001 From: jackyzha0 Date: Mon, 11 May 2020 23:29:46 -0700 Subject: working no pass rendering --- frontend/src/components/ViewPaste.js | 22 +++++++++++++++++----- 1 file changed, 17 insertions(+), 5 deletions(-) (limited to 'frontend/src/components/ViewPaste.js') diff --git a/frontend/src/components/ViewPaste.js b/frontend/src/components/ViewPaste.js index bba0219..79b1840 100644 --- a/frontend/src/components/ViewPaste.js +++ b/frontend/src/components/ViewPaste.js @@ -36,6 +36,20 @@ class ViewPaste extends React.Component { } } + drawRightMode() { + switch (this.state.mode) { + // TODO: add other renderers + + // default render raw + case RENDER_MODES.RAW: + default: + return (); + } + } + render() { return (
@@ -43,10 +57,9 @@ class ViewPaste extends React.Component { value={this.state.title} id="titleInput" readOnly /> - + + {this.drawRightMode()} + @@ -67,7 +80,6 @@ class ViewPaste extends React.Component { axios.get(serverURL) .then((response) => { const data = response.data - console.log(this.fmtDateStr(data.expiry)) this.setState({ title: data.title, content: data.content, -- cgit v1.2.3