Skip to content

Commit d956cee

Browse files
dannyhp1dannyhp1
committed
Added ability to load code based on uuid from pastebin.
1 parent dbc0009 commit d956cee

File tree

2 files changed

+105
-51
lines changed

2 files changed

+105
-51
lines changed

‎src/App/App.js‎

Lines changed: 13 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
import React, { Component } from 'react';
2+
import { BrowserRouter as Router, Route } from 'react-router-dom';
23
import Header from '../components/Header';
34
import CoderpadWrapper from '../components/CoderpadWrapper';
45
import './App.css';
@@ -8,7 +9,18 @@ class App extends Component {
89
return (
910
<div className="App">
1011
<Header />
11-
<CoderpadWrapper />
12+
<Router>
13+
<Route
14+
exact
15+
path='/'
16+
render={(props) => <CoderpadWrapper {...props} />}
17+
/>
18+
<Route
19+
exact
20+
path='/:id'
21+
render={(props) => <CoderpadWrapper {...props} />}
22+
/>
23+
</Router>
1224
</div>
1325
);
1426
}

‎src/components/CoderpadWrapper.js‎

Lines changed: 92 additions & 50 deletions
Original file line numberDiff line numberDiff line change
@@ -22,9 +22,18 @@ const LOAD_CODE_PROD_GET_URL= 'https://aws.dannyhp.com/pastebin/load/%s'
2222
const LOAD_CODE_GET_URL = LOAD_CODE_PROD_GET_URL
2323

2424
// Default settings on page loadup.
25-
const DEFAULT_LANGUAGE = 'python'
25+
const SUPPORTED_LANGUAGES = ['java', 'python', 'c_cpp']
26+
const DEFAULT_LANGUAGE = 'java'
2627
const DEFAULT_AUTOCOMPLETE = false
2728
const DEFAULT_PRACTICE = false
29+
const DEFAULT_SETTINGS = {
30+
language: DEFAULT_LANGUAGE,
31+
source: {'java': code['java'], 'python': code['python'], 'c_cpp': code['c_cpp']},
32+
results: [ ],
33+
disabled: false,
34+
practice: DEFAULT_PRACTICE,
35+
autocomplete: DEFAULT_AUTOCOMPLETE
36+
};
2837

2938
// Notification messages.
3039
const EXECUTING_CODE_MESSAGE = 'Running your code...'
@@ -33,45 +42,68 @@ const EXECUTING_CODE_ERROR = 'Code cannot be executed. Network connection to ser
3342
class CoderpadWrapper extends Component {
3443
constructor(props) {
3544
super(props)
36-
37-
// Default language set to Java; coderpad now supports C++, Java, and Python.
38-
this.state = this.getInitialState()
45+
this.state = DEFAULT_SETTINGS;
46+
this.getInitialState();
3947
}
4048

49+
/**
50+
* Attempts to fetch code from pastebin and load into coderpad.
51+
*/
4152
getInitialState = () => {
42-
return ({
43-
language: DEFAULT_LANGUAGE,
44-
source: {'java': code['java'], 'python': code['python'], 'c_cpp': code['c_cpp']},
45-
results: [ ],
46-
disabled: false,
47-
practice: DEFAULT_PRACTICE,
48-
autocomplete: DEFAULT_AUTOCOMPLETE
49-
})
53+
console.log(this.props);
54+
if (this.props.match.path === "/:id") {
55+
const paste_id = this.props.match.params.id;
56+
const get_url = LOAD_CODE_GET_URL.replace('%s', paste_id);
57+
58+
console.log(get_url);
59+
axios.get(get_url)
60+
.then(response => {
61+
const status = response.data.status
62+
if(status === 'success') {
63+
const language = response.data.type;
64+
const code = response.data.text;
65+
if(SUPPORTED_LANGUAGES.includes(language)) {
66+
this.onChangeLanguage(language);
67+
this.onChangeCode(code);
68+
}
69+
}
70+
}).catch(error => {
71+
return;
72+
})
73+
}
5074
}
5175

5276
/**
5377
* Changes the current source code.
5478
* @param string value The source code as a string.
5579
*/
5680
onChangeCode = (value) => {
57-
let currentSource = this.state.source
58-
currentSource[this.state.language] = value
81+
let currentSource = this.state.source;
82+
currentSource[this.state.language] = value;
5983

6084
this.setState({
6185
...this.state,
6286
source: currentSource
63-
})
87+
});
6488
}
6589

6690
/**
6791
* Changes the programming language.
68-
* @param event event The event of switching select box.
92+
* @param value The new value to set as the programming language.
6993
*/
70-
onChangeLanguage = (event) => {
94+
onChangeLanguage = (value) => {
7195
this.setState({
7296
...this.state,
73-
language: event.target.value
74-
})
97+
language: value
98+
});
99+
}
100+
101+
/**
102+
* Changes the programming language.
103+
* @param event The event of switching select box.
104+
*/
105+
onChangeLanguageEvent = (event) => {
106+
this.onChangeLanguage(event.target.value);
75107
}
76108

77109
/**
@@ -81,7 +113,7 @@ class CoderpadWrapper extends Component {
81113
this.setState({
82114
...this.state,
83115
practice: !this.state.practice
84-
})
116+
});
85117
}
86118

87119
/**
@@ -91,72 +123,72 @@ class CoderpadWrapper extends Component {
91123
this.setState({
92124
...this.state,
93125
autocomplete: !this.state.autocomplete
94-
})
126+
});
95127
}
96128

97129
/**
98130
* Adds code executing message and disables run button.
99131
*/
100132
setRunningStatus = () => {
101-
let currentResults = this.state.results
102-
currentResults.unshift(EXECUTING_CODE_MESSAGE)
133+
let currentResults = this.state.results;
134+
currentResults.unshift(EXECUTING_CODE_MESSAGE);
103135

104136
this.setState({
105137
...this.state,
106138
results: currentResults,
107139
disabled: true
108-
})
140+
});
109141
}
110142

111143
/**
112144
* Removes code executing message and reenables run button.
113145
*/
114146
setFinishedStatus = () => {
115-
let currentResults = this.state.results
116-
currentResults.shift()
147+
let currentResults = this.state.results;
148+
currentResults.shift();
117149

118150
this.setState({
119151
...this.state,
120152
results: currentResults,
121153
disabled: false
122-
})
154+
});
123155
}
124156

125157
/**
126158
* Makes request to backend server and parses code execution results.
127159
*/
128160
executeCode = () => {
129-
this.setRunningStatus()
161+
this.setRunningStatus();
130162

131163
axios.post(EXECUTE_CODE_POST_URL, {
132164
language: this.state.language,
133165
code: this.state.source[this.state.language],
134166
}).then(response => {
135-
const build = response['data']['build']
167+
const build = response['data']['build'];
136168
// const error = response['data']['error']
137-
const run = response['data']['run']
169+
const run = response['data']['run'];
138170

139-
const result = { build: null, message: null }
171+
const result = { build: null, message: null };
140172

141173
if (run !== 'None') {
142-
result['build'] = true
143-
result['message'] = run
174+
result['build'] = true;
175+
result['message'] = run;
144176
} else {
145-
result['build'] = false
146-
result['message'] = build
177+
result['build'] = false;
178+
result['message'] = build;
147179
}
148180

149-
this.addToLog(result)
181+
this.addToLog(result);
150182
}).catch(error => {
151-
this.setFinishedStatus()
183+
this.setFinishedStatus();
152184

153-
let currentResults = this.state.results
154-
currentResults.unshift(EXECUTING_CODE_ERROR)
185+
let currentResults = this.state.results;
186+
currentResults.unshift(EXECUTING_CODE_ERROR);
155187

156188
this.setState({
157189
...this.state,
158190
results: currentResults
159-
})
191+
});
160192
})
161193
}
162194

@@ -167,7 +199,7 @@ class CoderpadWrapper extends Component {
167199
this.setState({
168200
...this.state,
169201
results: [ ]
170-
})
202+
});
171203
}
172204

173205
/**
@@ -176,28 +208,33 @@ class CoderpadWrapper extends Component {
176208
*/
177209
addToLog = (result) => {
178210
// Before processing the new result, we must pop the message 'Running your code...' off and re-enable the button.
179-
this.setFinishedStatus()
180-
181-
// TODO: Keep only a specific amount of logs.
182-
let currentResults = this.state.results
211+
this.setFinishedStatus();
212+
let currentResults = this.state.results;
183213

184214
if (result['build'] === true) {
185-
currentResults.unshift('[' + languages[this.state.language] + '] Build successfully completed!\nStandard output:\n' + result['message'])
215+
currentResults.unshift('[' + languages[this.state.language] + '] Build successfully completed!\nStandard output:\n' + result['message']);
186216
} else {
187-
currentResults.unshift('[' + languages[this.state.language] + '] Build failed!\nBuild errors:\n' + result['message'])
217+
currentResults.unshift('[' + languages[this.state.language] + '] Build failed!\nBuild errors:\n' + result['message']);
188218
}
189219

190220
this.setState({
191221
...this.state,
192222
results: currentResults
193-
})
223+
});
194224
}
195225

196226
/**
197227
* Compiles the list of logs into a single string.
198228
*/
199229
getLogs = () => {
200-
return this.state.results.join('\n\n')
230+
return this.state.results.join('\n\n');
231+
}
232+
233+
/**
234+
* Saves the code snippet and copies link to clipboard.
235+
*/
236+
saveCode = () => {
237+
console.log("Here!");
201238
}
202239

203240
render() {
@@ -223,7 +260,7 @@ class CoderpadWrapper extends Component {
223260
labelId='select-language-label'
224261
id='select-language'
225262
value={this.state.language}
226-
onChange={this.onChangeLanguage}
263+
onChange={this.onChangeLanguageEvent}
227264
style={{ color: '#ffffff' }}
228265
>
229266
<MenuItem value='java'>{languages['java']}</MenuItem>
@@ -257,6 +294,11 @@ class CoderpadWrapper extends Component {
257294
/>
258295
</Grid>
259296
<Grid item xs={6} style={{ textAlign: 'right' }}>
297+
<Button variant='contained' color='primary'
298+
onClick={this.saveCode}
299+
style={{ background: '#0269a4', marginRight: '2.5%' }}>
300+
Save Code
301+
</Button>
260302
<Button variant='contained' color='primary'
261303
onClick={this.clearLogs}
262304
style={{ background: '#0269a4', marginRight: '2.5%' }}>

0 commit comments

Comments
 (0)