mirror of
https://github.com/ENSL/ensl_gathers.git
synced 2024-11-29 15:42:18 +00:00
commit
9af3466bc9
4 changed files with 79 additions and 83 deletions
71
app/javascripts/components/discord.js
Normal file
71
app/javascripts/components/discord.js
Normal file
|
@ -0,0 +1,71 @@
|
||||||
|
const React = require("react");
|
||||||
|
|
||||||
|
const discordDefaults = {
|
||||||
|
url: "https://discord.gg/Bvs3KjX",
|
||||||
|
alien: {
|
||||||
|
channel: "https://discord.gg/UcN724q",
|
||||||
|
},
|
||||||
|
marine: {
|
||||||
|
channel: "https://discord.gg/eGwfHXz",
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
const DiscordButton = exports.DiscordButton = React.createClass({
|
||||||
|
getInitialState() {
|
||||||
|
return {
|
||||||
|
open: false
|
||||||
|
};
|
||||||
|
},
|
||||||
|
|
||||||
|
toggleOpen(e) {
|
||||||
|
e.preventDefault();
|
||||||
|
this.setState({ open: !this.state.open });
|
||||||
|
},
|
||||||
|
getDefaultProps() {
|
||||||
|
return discordDefaults
|
||||||
|
},
|
||||||
|
|
||||||
|
marineUrl() {
|
||||||
|
return discordDefaults.marine.channel;
|
||||||
|
},
|
||||||
|
|
||||||
|
alienUrl() {
|
||||||
|
return discordDefaults.alien.channel;
|
||||||
|
},
|
||||||
|
|
||||||
|
chevron() {
|
||||||
|
if (this.state.open) {
|
||||||
|
return <i className="fa fa-angle-down pull-right"></i>;
|
||||||
|
} else {
|
||||||
|
return <i className="fa fa-angle-right pull-right"></i>;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
render() {
|
||||||
|
const open = this.state.open;
|
||||||
|
let componentClass = ["treeview"];
|
||||||
|
let dropdown;
|
||||||
|
if (open) {
|
||||||
|
componentClass.push("active");
|
||||||
|
dropdown = (
|
||||||
|
<ul className="treeview-menu menu-open" style={{display: "block"}}>
|
||||||
|
<li><a href={this.props.url}>Join Discord channel</a></li>
|
||||||
|
<li><a href={this.marineUrl()}>Join Marine channel</a></li>
|
||||||
|
<li><a href={this.alienUrl()}>Join Alien channel</a></li>
|
||||||
|
<li><p className="let-me-copy">Server: {discordDefaults.url}</p></li>
|
||||||
|
</ul>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
return (
|
||||||
|
<li className={componentClass.join(" ")}>
|
||||||
|
<a href="#" onClick={this.toggleOpen}>
|
||||||
|
<i className="fa fa-microphone"></i><span>Discord</span>
|
||||||
|
{this.chevron()}
|
||||||
|
</a>
|
||||||
|
{dropdown}
|
||||||
|
</li>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
|
@ -8,7 +8,7 @@ import {SoundPanel} from "javascripts/components/sound";
|
||||||
import {SettingsPanel} from "javascripts/components/settings";
|
import {SettingsPanel} from "javascripts/components/settings";
|
||||||
import {ArchivedGathers} from "javascripts/components/gatherArchive";
|
import {ArchivedGathers} from "javascripts/components/gatherArchive";
|
||||||
import {CurrentUser, ProfileModal, UserMenu} from "javascripts/components/user";
|
import {CurrentUser, ProfileModal, UserMenu} from "javascripts/components/user";
|
||||||
import {TeamSpeakButton, TeamSpeakModal} from "javascripts/components/teamspeak";
|
import {DiscordButton, DiscordModal} from "javascripts/components/discord";
|
||||||
|
|
||||||
const React = require("react");
|
const React = require("react");
|
||||||
|
|
||||||
|
@ -485,7 +485,7 @@ const GatherPage = React.createClass({
|
||||||
gatherSelectedCallback={this.onGatherSelected} />
|
gatherSelectedCallback={this.onGatherSelected} />
|
||||||
<ul className="sidebar-menu">
|
<ul className="sidebar-menu">
|
||||||
<li className="header">Information</li>
|
<li className="header">Information</li>
|
||||||
<TeamSpeakButton />
|
<DiscordButton />
|
||||||
<InfoButton />
|
<InfoButton />
|
||||||
</ul>
|
</ul>
|
||||||
<ul className="sidebar-menu">
|
<ul className="sidebar-menu">
|
||||||
|
|
|
@ -1,81 +0,0 @@
|
||||||
const React = require("react");
|
|
||||||
|
|
||||||
const teamspeakDefaults = {
|
|
||||||
url: "ts3server://ensl.org/",
|
|
||||||
password: "ns2gather",
|
|
||||||
alien: {
|
|
||||||
channel: "NS2 Gather/Gather #1/Alien",
|
|
||||||
password: "ns2gather"
|
|
||||||
},
|
|
||||||
marine: {
|
|
||||||
channel: "NS2 Gather/Gather #1/Marine",
|
|
||||||
password: "ns2gather"
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
const TeamSpeakButton = exports.TeamSpeakButton = React.createClass({
|
|
||||||
getInitialState() {
|
|
||||||
return {
|
|
||||||
open: false
|
|
||||||
};
|
|
||||||
},
|
|
||||||
|
|
||||||
toggleOpen(e) {
|
|
||||||
e.preventDefault();
|
|
||||||
this.setState({ open: !this.state.open });
|
|
||||||
},
|
|
||||||
getDefaultProps() {
|
|
||||||
return teamspeakDefaults
|
|
||||||
},
|
|
||||||
|
|
||||||
marineUrl() {
|
|
||||||
return this.teamSpeakUrl(this.props.marine);
|
|
||||||
},
|
|
||||||
|
|
||||||
alienUrl() {
|
|
||||||
return this.teamSpeakUrl(this.props.alien);
|
|
||||||
},
|
|
||||||
|
|
||||||
teamSpeakUrl(conn) {
|
|
||||||
let params = `channel=${encodeURIComponent(conn.channel)}&
|
|
||||||
channelpassword=${encodeURIComponent(conn.password)}`;
|
|
||||||
return (`${this.props.url}?${params}`);
|
|
||||||
},
|
|
||||||
|
|
||||||
chevron() {
|
|
||||||
if (this.state.open) {
|
|
||||||
return <i className="fa fa-angle-down pull-right"></i>;
|
|
||||||
} else {
|
|
||||||
return <i className="fa fa-angle-right pull-right"></i>;
|
|
||||||
}
|
|
||||||
},
|
|
||||||
|
|
||||||
render() {
|
|
||||||
const open = this.state.open;
|
|
||||||
let componentClass = ["treeview"];
|
|
||||||
let dropdown;
|
|
||||||
if (open) {
|
|
||||||
componentClass.push("active");
|
|
||||||
dropdown = (
|
|
||||||
<ul className="treeview-menu menu-open" style={{display: "block"}}>
|
|
||||||
<li><a href={this.props.url}>Join Teamspeak Lobby</a></li>
|
|
||||||
<li><a href={this.marineUrl()}>Join Marine Teamspeak</a></li>
|
|
||||||
<li><a href={this.alienUrl()}>Join Alien Teamspeak</a></li>
|
|
||||||
<li><a href="#">Server: {teamspeakDefaults.url}</a></li>
|
|
||||||
<li><a href="#">Password: {teamspeakDefaults.password}</a></li>
|
|
||||||
</ul>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<li className={componentClass.join(" ")}>
|
|
||||||
<a href="#" onClick={this.toggleOpen}>
|
|
||||||
<i className="fa fa-microphone"></i><span>Teamspeak</span>
|
|
||||||
{this.chevron()}
|
|
||||||
</a>
|
|
||||||
{dropdown}
|
|
||||||
</li>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
|
@ -381,3 +381,9 @@ html, body {
|
||||||
padding-bottom: 2px;
|
padding-bottom: 2px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.let-me-copy {
|
||||||
|
padding: 5px 5px 5px 15px;
|
||||||
|
display: block;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue