1
0
mirror of https://github.com/mgerb/go-discord-bot synced 2026-01-10 09:02:49 +00:00

prevent all audio clips from loading on ui - many other small fixes

This commit is contained in:
2017-04-07 22:35:53 -05:00
parent e6c492a5eb
commit 2811d3cc1e
10 changed files with 83 additions and 55 deletions

View File

@@ -22,10 +22,6 @@ module.exports = {
"error",
4
],
"quotes": [
"error",
"single"
],
"semi": [
"error",
"always"

View File

@@ -3,13 +3,15 @@ import ReactDOM from 'react-dom';
import { Router, Route, IndexRoute, browserHistory } from 'react-router';
import Wrapper from './Wrapper';
import Home from './pages/Home/Home';
import Soundboard from './pages/Soundboard/Soundboard';
import NotFound from './pages/NotFound/NotFound';
ReactDOM.render(
<Router history={browserHistory}>
<Route path="/" component={Wrapper}>
<IndexRoute component={Soundboard}/>
<IndexRoute component={Home}/>
<Route path="/soundboard" component={Soundboard}/>
<Route path="*" component={NotFound}/>
</Route>
</Router>

View File

@@ -8,8 +8,9 @@ export default class Navbar extends React.Component {
render() {
return (
<div className="Navbar">
<div className="Navbar__header">Sound<br/>Bot</div>
<Link to="/" className="Navbar__item" onlyActiveOnIndex activeClassName="Navbar__item--active">Soundboard</Link>
<div className="Navbar__header">Go Discord Bot</div>
<Link to="/" className="Navbar__item" onlyActiveOnIndex activeClassName="Navbar__item--active">Home</Link>
<Link to="/soundboard" className="Navbar__item" activeClassName="Navbar__item--active">Soundboard</Link>
</div>
);
}

View File

@@ -33,8 +33,7 @@
justify-content: center;
text-align: center;
color: $white;
transition: background-color 0.1s linear;
transition: color 0.1s linear;
transition: background-color 0.1s linear, color 0.2s linear;
&:hover {
background-color: $gray1;

26
app/pages/Home/Home.js Normal file
View File

@@ -0,0 +1,26 @@
import React from 'react';
import './Home.scss';
export default class Home extends React.Component {
render() {
return (
<div className="Home">
<div className="Card">
<div className="Card__header">
Go Discord Bot
</div>
<p>Drag and drop files to upload. Sounds can be played in discord by typing the commands on the next page.</p>
<br/>
<p>Gif command now supported! Example: !gif awesome cat gifs</p>
<br/>
<p>Check out the source code on
<a href="https://github.com/mgerb/GoBot" target="_blank"> GitHub
<i className="fa fa-github" aria-hidden="true"/>
</a>
</p>
</div>
</div>
);
}
}

3
app/pages/Home/Home.scss Normal file
View File

@@ -0,0 +1,3 @@
.Home {
padding: 10px;
}

View File

@@ -9,6 +9,7 @@ export default class SoundList extends React.Component {
super();
this.state = {
soundList: [],
showAudioControls: [],
};
}
@@ -18,14 +19,13 @@ export default class SoundList extends React.Component {
getSoundList() {
if (!this.soundListCache) {
axios.get("/soundlist")
.then((response) => {
axios.get("/soundlist").then((response) => {
this.soundListCache = response.data;
this.setState({
soundList: response.data,
});
}).catch((error) => {
console.warn(error.response.data);
}).catch(() => {
//console.warn(error.response.data);
});
} else {
this.setState({
@@ -47,26 +47,37 @@ export default class SoundList extends React.Component {
}
}
handleShowAudio(index) {
let temp = this.state.showAudioControls;
temp[index] = true;
this.setState({
showAudioControls: temp,
});
}
render() {
return (
<div className="Card">
<div className="Card__header">
Sounds
<i className="fa fa fa-volume-up" aria-hidden="true"></i>
<i className="fa fa fa-volume-up" aria-hidden="true"/>
</div>
{this.state.soundList.length > 0 ? this.state.soundList.map((sound, index) => {
return <div key={index} className="SoundList__item">
return (
<div key={index} className="SoundList__item">
<div>
{sound.prefix + sound.name}
</div>
{this.checkExtension(sound.extension) ?
{this.checkExtension(sound.extension) && this.state.showAudioControls[index] ?
<audio controls src={"/sounds/" + sound.name + "." + sound.extension}
type={"audio/" + sound.extension}
style={{width: "100px"}}/>
: null}
: <i className="fa fa-play link" aria-hidden="true" onClick={() => this.handleShowAudio(index)}/> }
</div>
);
}) : null}
</div>
);

View File

@@ -47,7 +47,7 @@ export default class Soundboard extends React.Component {
formData.append("password", this.state.password);
axios.put("/upload", formData, this.config)
.then((response) => {
.then(() => {
this.setState({
password: "",
percentCompleted: 0,
@@ -77,18 +77,6 @@ export default class Soundboard extends React.Component {
return (
<div className="Soundboard">
<div className="column">
<div className="Card">
<div className="Card__header">
Discord Sound Bot
</div>
<p>Drag and drop files to upload. The sounds can then be played in discord by typing the commands below.</p>
<p>Check out the source code on
<a href="https://github.com/mgerb/GoBot" target="_blank"> GitHub
<i className="fa fa-github" aria-hidden="true"></i>
</a>
</p>
<p>Follow the readme to set up your own bot!</p>
</div>
<SoundList ref="SoundList"/>
</div>

View File

@@ -2,10 +2,11 @@
box-sizing: border-box;
}
a {
a, .link {
text-decoration: none;
color: $primaryBlue;
transition: color 0.1s linear;
cursor: pointer;
&:hover {
color: darken(white, 10%);

View File

@@ -1,11 +1,12 @@
package webserver
import (
"log"
"../config"
"./handlers"
"github.com/buaazp/fasthttprouter"
"github.com/valyala/fasthttp"
"log"
)
func logger(next fasthttp.RequestHandler) fasthttp.RequestHandler {
@@ -28,7 +29,7 @@ func registerRoutes(router *fasthttprouter.Router) {
router.PUT("/upload", handlers.FileUpload)
router.ServeFiles("/static/*filepath", "./static")
router.ServeFiles("/sounds/*filepath", "./sounds")
router.ServeFiles("/sounds/*filepath", config.Config.SoundsPath)
router.NotFound = func(ctx *fasthttp.RequestCtx) {
fasthttp.ServeFile(ctx, "./index.html")