publicServers react please.
This commit is contained in:
Jean Ouina
parent
b2bd611dee
commit
ae69111d41
|
|
@ -31,8 +31,8 @@ See this [gist](https://gist.github.com/ObserverOfTime/d7e60eb9aa7fe837545c8cb77
|
|||
### Windows
|
||||
1. Download and extract this: https://github.com/rauenzi/BetterDiscordApp/archive/injector.zip
|
||||
2. Rename `BetterDiscordApp-injector` to `app`.
|
||||
3. Go to `%localappdata%\Discord\`, and locate the directory with the largest version number (e.g. `app-0.0.306`).
|
||||
4. Within `app-0.0.306` navigate to `resources`.
|
||||
3. Go to `%localappdata%\Discord\`, and locate the directory with the largest version number (e.g. `app-0.0.307`).
|
||||
4. Within `app-0.0.307` navigate to `resources`.
|
||||
5. If an `app` folder already exists inside `resources`, delete it.
|
||||
6. Move the `app` folder (the one you downloaded and renamed) inside of `resources`.
|
||||
7. Fully quit Discord and restart it.
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
|
@ -0,0 +1,166 @@
|
|||
import Utils from "./utils";
|
||||
import v2 from "./v2";
|
||||
import { uuidv4 } from "./distant";
|
||||
import { timingSafeEqual } from "crypto";
|
||||
|
||||
export default new class Layers {
|
||||
constructor(){
|
||||
this.layers = []
|
||||
window.Lightcord.BetterDiscord.Layers = this
|
||||
}
|
||||
|
||||
get isInjected(){
|
||||
return !!document.querySelector("div.Layers.injected")
|
||||
}
|
||||
|
||||
inject(){
|
||||
if(this.isInjected)return
|
||||
let [
|
||||
classNameLayers
|
||||
] = [
|
||||
Utils.removeDa(v2.WebpackModules.find(e => e.layers && e.layer).layers)
|
||||
]
|
||||
const layers = document.querySelector("."+classNameLayers);
|
||||
if (!layers) return false;
|
||||
const ReactInstance = Lightcord.Api.Utils.FindReact(layers, 1)
|
||||
if(!ReactInstance)return layers
|
||||
this.ReactInstance = ReactInstance
|
||||
let render = ReactInstance.render
|
||||
ReactInstance.render = () => {
|
||||
let returnValue = render.call(ReactInstance)
|
||||
let classList = returnValue.props.children[1].props.className.split(" ")
|
||||
classList.push("Layers")
|
||||
classList.push("injected")
|
||||
returnValue.props.children[1].props.className = classList.join(" ")
|
||||
|
||||
this.layers.forEach(layer => {
|
||||
returnValue.props.children[1].props.children.push(layer[1])
|
||||
})
|
||||
|
||||
return returnValue
|
||||
}
|
||||
ReactInstance.forceUpdate()
|
||||
}
|
||||
|
||||
createLayer(children, props = {}){
|
||||
let id = uuidv4()
|
||||
let layer = null
|
||||
this.layers.push([id, <Layer {...props} getLayer={lay => {
|
||||
layer = lay
|
||||
}} key={id} id={id} remove={() => {
|
||||
let index = this.layers.findIndex(e => e[0] === id)
|
||||
if(index === -1)return
|
||||
this.layers.splice(index, 1)
|
||||
layer = null
|
||||
if(this.ReactInstance)this.ReactInstance.forceUpdate()
|
||||
this.inject()
|
||||
}}>{children}</Layer>])
|
||||
if(this.ReactInstance)this.ReactInstance.forceUpdate()
|
||||
this.inject()
|
||||
return {
|
||||
remove: () => {
|
||||
if(!layer){
|
||||
let index = this.layers.findIndex(e => e[0] === id)
|
||||
if(index === -1)return
|
||||
this.layers.splice(index, 1)
|
||||
layer = null
|
||||
if(this.ReactInstance)this.ReactInstance.forceUpdate()
|
||||
this.inject()
|
||||
}else{
|
||||
layer.remove()
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
let LayerModules
|
||||
export class Layer extends React.Component {
|
||||
constructor(){
|
||||
super(...arguments)
|
||||
this.state = {
|
||||
animation: new this.modules[0].default.Value(0)
|
||||
}
|
||||
this.props.getLayer(this)
|
||||
this.keydown = this.keydown.bind(this)
|
||||
}
|
||||
|
||||
keydown(e){
|
||||
if (e.which === 27) {
|
||||
this.remove()
|
||||
}
|
||||
}
|
||||
|
||||
get modules(){
|
||||
return LayerModules || (LayerModules = [
|
||||
v2.WebpackModules.find(e => e.default && e.default.Value && e.default.div)
|
||||
])
|
||||
}
|
||||
|
||||
componentWillUnmount(){
|
||||
window.removeEventListener("keydown", this.keydown)
|
||||
}
|
||||
|
||||
componentDidMount(ev){
|
||||
window.addEventListener("keydown", this.keydown)
|
||||
}
|
||||
|
||||
remove(){
|
||||
this.props.remove()
|
||||
}
|
||||
|
||||
componentWillEnter(ev){
|
||||
this.modules[0].default.timing(this.state.animation, {
|
||||
toValue: 1,
|
||||
duration: 100
|
||||
}).start(ev)
|
||||
}
|
||||
|
||||
componentWillLeave(ev){
|
||||
this.modules[0].default.timing(this.state.animation, {
|
||||
toValue: 0,
|
||||
duration: 100
|
||||
}).start(ev)
|
||||
}
|
||||
|
||||
render(){
|
||||
let interpolation = this.state.animation.interpolate({
|
||||
inputRange: [0, 1],
|
||||
outputRange: [1.07, 1]
|
||||
})
|
||||
let style = {
|
||||
opacity: this.state.animation,
|
||||
transform: [{
|
||||
scale: interpolation
|
||||
}]
|
||||
}
|
||||
let Div = this.modules[0].default.div
|
||||
return <Div className={[__SECRET_EMOTION__.css({
|
||||
backgroundColor:"var(--background-primary)",
|
||||
position: "absolute",
|
||||
top: 0,
|
||||
right: 0,
|
||||
bottom: 0,
|
||||
left: 0,
|
||||
display: "flex",
|
||||
overflow: "hidden",
|
||||
WebkitBoxOrient: "vertical",
|
||||
WebkitBoxDirection: "normal",
|
||||
msFlexDirection: "column",
|
||||
flexDirection: "column",
|
||||
zIndex: 101
|
||||
}),process.platform==="win32"?__SECRET_EMOTION__.css({
|
||||
top: "-22px",
|
||||
paddingTop: "22px"
|
||||
}):null,...(this.props.className?this.props.className.split(" "):[])].filter(e=>e).join(" ") || null} style={style}>
|
||||
{this.props.children(() => {
|
||||
this.remove()
|
||||
})}
|
||||
</Div>
|
||||
}
|
||||
}
|
||||
Layer.defaultProps = {
|
||||
id: null,
|
||||
children: null
|
||||
}
|
||||
|
|
@ -5,7 +5,7 @@ import Utils from "./utils";
|
|||
import DOM from "./domtools";
|
||||
|
||||
import V2C_PublicServers from "../ui/publicservers/publicServers";
|
||||
import Layer from "../ui/publicservers/layer";
|
||||
import Layers from "./Layers";
|
||||
|
||||
export default new class V2_PublicServers {
|
||||
|
||||
|
|
@ -14,38 +14,10 @@ export default new class V2_PublicServers {
|
|||
window.Lightcord.BetterDiscord.V2_PublicServers = this
|
||||
}
|
||||
|
||||
get component() {
|
||||
return BDV2.react.createElement(Layer, {rootId: "pubslayerroot", id: "pubslayer"}, BDV2.react.createElement(V2C_PublicServers, {rootId: "pubslayerroot"}));
|
||||
}
|
||||
|
||||
get root() {
|
||||
const _root = document.getElementById("pubslayerroot");
|
||||
if (!_root) {
|
||||
if (!this.injectRoot()) return null;
|
||||
return this.root;
|
||||
}
|
||||
return _root;
|
||||
}
|
||||
|
||||
injectRoot() {
|
||||
let [
|
||||
classNameLayers
|
||||
] = [
|
||||
Utils.removeDa(BDModules.get(e => e.layers && e.layer)[0].layers)
|
||||
]
|
||||
const layers = DOM.query(".layers, ."+classNameLayers);
|
||||
if (!layers) return false;
|
||||
layers.append(DOM.createElement("<div id='pubslayerroot'>"));
|
||||
return true;
|
||||
}
|
||||
|
||||
render() {
|
||||
const root = this.root;
|
||||
if (!root) {
|
||||
console.log("FAILED TO LOCATE ROOT: .layers");
|
||||
return;
|
||||
}
|
||||
BDV2.reactDom.render(this.component, root);
|
||||
Layers.createLayer((close) => {
|
||||
return BDV2.react.createElement(V2C_PublicServers, {rootId: "pubslayerroot", close})
|
||||
})
|
||||
}
|
||||
|
||||
get button() {
|
||||
|
|
|
|||
|
|
@ -1,89 +0,0 @@
|
|||
import BDV2 from "../../modules/v2";
|
||||
import DOM from "../../modules/domtools";
|
||||
|
||||
export default class V2C_Layer extends BDV2.reactComponent {
|
||||
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.keyupListener = this.keyupListener.bind(this);
|
||||
}
|
||||
|
||||
keyupListener(e) {
|
||||
if (e.which === 27) {
|
||||
BDV2.reactDom.unmountComponentAtNode(this.refs.root.parentNode);
|
||||
}
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
window.addEventListener("keyup", this.keyupListener);
|
||||
|
||||
const thisNode = DOM.query(`#${this.props.id}`);
|
||||
DOM.animate({
|
||||
duration: 200,
|
||||
update: function(progress) {
|
||||
thisNode.style.transform = `scale(${1.1 - 0.1 * progress}) translateZ(0px)`;
|
||||
thisNode.style.opacity = progress;
|
||||
if (progress == 1) {
|
||||
setImmediate(() => {
|
||||
thisNode.style.transform = "";
|
||||
thisNode.style.opacity = "";
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
componentWillUnmount() {
|
||||
window.removeEventListener("keyup", this.keyupListener);
|
||||
|
||||
const thisNode = DOM.query(`#${this.props.id}`);
|
||||
DOM.animate({
|
||||
duration: 200,
|
||||
update: function(progress) {
|
||||
thisNode.style.transform = `scale(${1.1 - 0.1 * (1 - progress)}) translateZ(0px)`;
|
||||
thisNode.style.opacity = 1 - progress;
|
||||
if (progress == 1) {
|
||||
setImmediate(() => {
|
||||
thisNode.remove();
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
const layer = DOM.query(".publicServersOpen");
|
||||
layer.classList.remove("publicServersOpen");
|
||||
DOM.animate({
|
||||
duration: 200,
|
||||
update: function(progress) {
|
||||
layer.style.transform = `scale(${0.07 * progress + 0.93}) translateZ(0px)`;
|
||||
layer.style.opacity = progress;
|
||||
if (progress == 1) {
|
||||
setImmediate(() => {
|
||||
layer.style.transform = "";
|
||||
layer.style.opacity = "";
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
componentWillMount() {
|
||||
const layer = DOM.query("[class*=\"layer-\"]");
|
||||
layer.classList.add("publicServersOpen");
|
||||
DOM.animate({
|
||||
duration: 200,
|
||||
update: function(progress) {
|
||||
layer.style.transform = `scale(${0.07 * (1 - progress) + 0.93}) translateZ(0px)`;
|
||||
layer.style.opacity = 1 - progress;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
render() {
|
||||
return BDV2.react.createElement(
|
||||
"div",
|
||||
{className: "layer bd-layer "+BDModules.get(e => e.layer && e.animating)[0].layer, id: this.props.id, ref: "root", style: {opacity: 0, transform: "scale(1.1) translateZ(0px)"}},
|
||||
this.props.children
|
||||
);
|
||||
}
|
||||
}
|
||||
|
|
@ -1,435 +1,450 @@
|
|||
import BDV2 from "../../modules/v2";
|
||||
|
||||
import Tools from "../tools";
|
||||
import SettingsTitle from "../settingsTitle";
|
||||
import TabBarSeparator from "../tabBarSeparator";
|
||||
import TabBarHeader from "../tabBarHeader";
|
||||
import TabBarItem from "../tabBarItem";
|
||||
|
||||
import ServerCard from "./serverCard";
|
||||
import SidebarView from "./sidebarView";
|
||||
|
||||
export default class V2C_PublicServers extends BDV2.reactComponent {
|
||||
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.setInitialState();
|
||||
this.close = this.close.bind(this);
|
||||
this.changeCategory = this.changeCategory.bind(this);
|
||||
this.search = this.search.bind(this);
|
||||
this.searchKeyDown = this.searchKeyDown.bind(this);
|
||||
this.checkConnection = this.checkConnection.bind(this);
|
||||
this.join = this.join.bind(this);
|
||||
this.connect = this.connect.bind(this);
|
||||
|
||||
this.GuildStore = BDV2.WebpackModules.findByUniqueProperties(["getGuilds"]);
|
||||
this.AvatarDefaults = BDV2.WebpackModules.findByUniqueProperties(["getUserAvatarURL", "DEFAULT_AVATARS"]);
|
||||
this.InviteActions = BDV2.WebpackModules.findByUniqueProperties(["acceptInvite"]);
|
||||
this.SortedGuildStore = BDV2.WebpackModules.findByUniqueProperties(["getSortedGuilds"]);
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
this.checkConnection();
|
||||
}
|
||||
|
||||
setInitialState() {
|
||||
this.state = {
|
||||
selectedCategory: -1,
|
||||
title: "Loading...",
|
||||
loading: true,
|
||||
servers: [],
|
||||
next: null,
|
||||
connection: {
|
||||
state: 0,
|
||||
user: null
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
close() {
|
||||
BDV2.reactDom.unmountComponentAtNode(document.getElementById(this.props.rootId));
|
||||
}
|
||||
|
||||
search(query, clear) {
|
||||
const self = this;
|
||||
fetch(`${self.endPoint}${query}${query ? "&schema=new" : "?schema=new"}`, {
|
||||
method: "get"
|
||||
}).then(async res => {
|
||||
if(res.status !== 200)throw await res.text()
|
||||
let data = await res.json()
|
||||
|
||||
let servers = data.results.reduce((arr, server) => {
|
||||
server.joined = false;
|
||||
arr.push(server);
|
||||
// arr.push(<ServerCard server={server} join={self.join}/>);
|
||||
return arr;
|
||||
}, []);
|
||||
|
||||
if (!clear) {
|
||||
servers = self.state.servers.concat(servers);
|
||||
}
|
||||
else {
|
||||
//servers.unshift(self.bdServer);
|
||||
}
|
||||
|
||||
let end = data.size + data.from;
|
||||
data.next = `?from=${end}`;
|
||||
if (self.state.term) data.next += `&term=${self.state.term}`;
|
||||
if (self.state.selectedCategory) data.next += `&category=${self.categoryButtons[self.state.selectedCategory]}`;
|
||||
if (end >= data.total) {
|
||||
end = data.total;
|
||||
data.next = null;
|
||||
}
|
||||
|
||||
let title = `Showing 1-${end} of ${data.total} results in ${self.categoryButtons[self.state.selectedCategory]}`;
|
||||
if (self.state.term) title += ` for ${self.state.term}`;
|
||||
|
||||
self.setState({
|
||||
loading: false,
|
||||
title: title,
|
||||
servers: servers,
|
||||
next: data.next
|
||||
});
|
||||
|
||||
if (clear) {
|
||||
//console.log(self);
|
||||
self.refs.sbv.refs.contentScroller.scrollTop = 0;
|
||||
}
|
||||
}).catch((err) => {
|
||||
console.error(err)
|
||||
return self.setState({
|
||||
loading: false,
|
||||
title: "Failed to load servers. Check console for details"
|
||||
});
|
||||
})
|
||||
}
|
||||
|
||||
async join(serverCard) {
|
||||
if (serverCard.props.pinned) return this.InviteActions.acceptInvite(serverCard.props.invite_code);
|
||||
|
||||
await fetch(`${this.joinEndPoint}/${serverCard.props.server.identifier}`,{
|
||||
method: "GET",
|
||||
credentials: "include",
|
||||
mode: "cors",
|
||||
headers: {
|
||||
"Accept": "application/json",
|
||||
"Content-Type": "application/json"
|
||||
}
|
||||
});
|
||||
|
||||
serverCard.setState({joined: true});
|
||||
}
|
||||
|
||||
connect() {
|
||||
const self = this;
|
||||
const options = self.windowOptions;
|
||||
options.x = Math.round(window.screenX + window.innerWidth / 2 - options.width / 2);
|
||||
options.y = Math.round(window.screenY + window.innerHeight / 2 - options.height / 2);
|
||||
|
||||
self.joinWindow = new (window.require("electron").remote.BrowserWindow)(options);
|
||||
const url = "https://auth.discordservers.com/connect?scopes=guilds.join&previousUrl=https://auth.discordservers.com/info";
|
||||
self.joinWindow.webContents.on("did-navigate", (event, url) => {
|
||||
if (url != "https://auth.discordservers.com/info") return;
|
||||
self.joinWindow.close();
|
||||
self.checkConnection();
|
||||
});
|
||||
self.joinWindow.loadURL(url);
|
||||
}
|
||||
|
||||
get windowOptions() {
|
||||
return {
|
||||
width: 500,
|
||||
height: 550,
|
||||
backgroundColor: "#282b30",
|
||||
show: true,
|
||||
resizable: false,
|
||||
maximizable: false,
|
||||
minimizable: false,
|
||||
alwaysOnTop: true,
|
||||
frame: false,
|
||||
center: false,
|
||||
webPreferences: {
|
||||
nodeIntegration: false
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
get bdServer() {
|
||||
const server = {
|
||||
name: "BetterDiscord",
|
||||
online: "7500+",
|
||||
members: "20000+",
|
||||
categories: ["community", "programming", "support"],
|
||||
description: "Official BetterDiscord server for support etc",
|
||||
identifier: "86004744966914048",
|
||||
iconUrl: "https://cdn.discordapp.com/icons/86004744966914048/292e7f6bfff2b71dfd13e508a859aedd.webp",
|
||||
nativejoin: true,
|
||||
invite_code: "0Tmfo5ZbORCRqbAd",
|
||||
pinned: true
|
||||
};
|
||||
const server2 = {
|
||||
name: "Lightcord",
|
||||
online: "30+",
|
||||
members: "50+",
|
||||
categories: ["community", "programming", "support"],
|
||||
description: "Official Lightcord server for support etc",
|
||||
identifier: "86004744966914048",
|
||||
iconUrl: "https://avatars3.githubusercontent.com/u/65690058?s=200&v=4",
|
||||
nativejoin: true,
|
||||
invite_code: "7eFff2A",
|
||||
pinned: true
|
||||
};
|
||||
const guildList = this.SortedGuildStore.getFlattenedGuildIds();
|
||||
const defaultList = this.AvatarDefaults.DEFAULT_AVATARS;
|
||||
return [
|
||||
BDV2.react.createElement(ServerCard, {server: server2, pinned: true, join: this.join, guildList: guildList, fallback: defaultList[Math.floor(Math.random() * 5)]}),
|
||||
BDV2.react.createElement(ServerCard, {server: server, pinned: true, join: this.join, guildList: guildList, fallback: defaultList[Math.floor(Math.random() * 5)]})
|
||||
]
|
||||
}
|
||||
|
||||
get endPoint() {
|
||||
return "https://search.discordservers.com";
|
||||
}
|
||||
|
||||
get joinEndPoint() {
|
||||
return "https://j.discordservers.com";
|
||||
}
|
||||
|
||||
get connectEndPoint() {
|
||||
return "https://join.discordservers.com/connect";
|
||||
}
|
||||
|
||||
async checkConnection() {
|
||||
const self = this;
|
||||
try {
|
||||
const response = await fetch(`https://auth.discordservers.com/info`,{
|
||||
method: "GET",
|
||||
credentials: "include",
|
||||
mode: "cors",
|
||||
headers: {
|
||||
"Accept": "application/json",
|
||||
"Content-Type": "application/json"
|
||||
}
|
||||
});
|
||||
const data = await response.json();
|
||||
self.setState({
|
||||
selectedCategory: 0,
|
||||
connection: {
|
||||
state: 2,
|
||||
user: data
|
||||
}
|
||||
});
|
||||
self.search("", true);
|
||||
}
|
||||
catch (error) {
|
||||
console.error(error)
|
||||
self.setState({
|
||||
title: "Not connected to discordservers.com!",
|
||||
loading: true,
|
||||
selectedCategory: -1,
|
||||
connection: {
|
||||
state: 1,
|
||||
user: null
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
render() {
|
||||
return BDV2.react.createElement(SidebarView, {ref: "sbv"}, this.component);
|
||||
}
|
||||
|
||||
get component() {
|
||||
return {
|
||||
sidebar: {
|
||||
component: this.sidebar
|
||||
},
|
||||
content: {
|
||||
component: this.content
|
||||
},
|
||||
tools: {
|
||||
component: BDV2.react.createElement(Tools, {key: "pt", ref: "tools", onClick: this.close})
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
get sidebar() {
|
||||
return BDV2.react.createElement(
|
||||
"div",
|
||||
{className: "sidebar", key: "ps"},
|
||||
BDV2.react.createElement(
|
||||
"div",
|
||||
{className: "ui-tab-bar SIDE"},
|
||||
BDV2.react.createElement(
|
||||
"div",
|
||||
{className: "ui-tab-bar-header", style: {fontSize: "16px"}},
|
||||
"Public Servers"
|
||||
),
|
||||
BDV2.react.createElement(TabBarSeparator, null),
|
||||
this.searchInput,
|
||||
BDV2.react.createElement(TabBarSeparator, null),
|
||||
BDV2.react.createElement(TabBarHeader, {text: "Categories"}),
|
||||
this.categoryButtons.map((value, index) => {
|
||||
return BDV2.react.createElement(TabBarItem, {id: index, onClick: this.changeCategory, key: index, text: value, selected: this.state.selectedCategory === index});
|
||||
}),
|
||||
BDV2.react.createElement(TabBarSeparator, null),
|
||||
this.footer,
|
||||
this.connection
|
||||
)
|
||||
);
|
||||
}
|
||||
|
||||
get searchInput() {
|
||||
return BDV2.react.createElement(
|
||||
"div",
|
||||
{className: "ui-form-item"},
|
||||
BDV2.react.createElement(
|
||||
"div",
|
||||
{className: "ui-text-input flex-vertical", style: {width: "172px", marginLeft: "10px"}},
|
||||
BDV2.react.createElement("input", {ref: "searchinput", onKeyDown: this.searchKeyDown, onChange: () => {}, type: "text", className: "input default", placeholder: "Search...", maxLength: "50"})
|
||||
)
|
||||
);
|
||||
}
|
||||
|
||||
searchKeyDown(e) {
|
||||
const self = this;
|
||||
if (self.state.loading || e.which !== 13) return;
|
||||
self.setState({
|
||||
loading: true,
|
||||
title: "Loading...",
|
||||
term: e.target.value
|
||||
});
|
||||
let query = `?term=${e.target.value}`;
|
||||
if (self.state.selectedCategory !== 0) {
|
||||
query += `&category=${self.categoryButtons[self.state.selectedCategory]}`;
|
||||
}
|
||||
self.search(query, true);
|
||||
}
|
||||
|
||||
get categoryButtons() {
|
||||
return ["All", "FPS Games", "MMO Games", "Strategy Games", "MOBA Games", "RPG Games", "Tabletop Games", "Sandbox Games", "Simulation Games", "Music", "Community", "Language", "Programming", "Other"];
|
||||
}
|
||||
|
||||
changeCategory(id) {
|
||||
const self = this;
|
||||
if (self.state.loading) return;
|
||||
self.refs.searchinput.value = "";
|
||||
self.setState({
|
||||
loading: true,
|
||||
selectedCategory: id,
|
||||
title: "Loading...",
|
||||
term: null
|
||||
});
|
||||
if (id === 0) {
|
||||
self.search("", true);
|
||||
return;
|
||||
}
|
||||
self.search(`?category=${self.categoryButtons[id]}`, true);
|
||||
}
|
||||
|
||||
get content() {
|
||||
const self = this;
|
||||
const guildList = this.SortedGuildStore.getFlattenedGuildIds();
|
||||
const defaultList = this.AvatarDefaults.DEFAULT_AVATARS;
|
||||
if (self.state.connection.state === 1) return self.notConnected;
|
||||
let columnModule = BDModules.get(e => e.contentColumnDefault)[0]
|
||||
return [BDV2.react.createElement(
|
||||
"div",
|
||||
{ref: "content", key: "pc", className: columnModule.contentColumn+" "+columnModule.contentColumn+" content-column default"},
|
||||
BDV2.react.createElement(SettingsTitle, {text: self.state.title}),
|
||||
self.bdServer,
|
||||
self.state.servers.map((server) => {
|
||||
return BDV2.react.createElement(ServerCard, {key: server.identifier, server: server, join: self.join, guildList: guildList, fallback: defaultList[Math.floor(Math.random() * 5)]});
|
||||
}),
|
||||
self.state.next && BDV2.react.createElement(
|
||||
"button",
|
||||
{type: "button", onClick: () => {
|
||||
if (self.state.loading) return;self.setState({loading: true}); self.search(self.state.next, false);
|
||||
}, className: "ui-button filled brand small grow", style: {width: "100%", marginTop: "10px", marginBottom: "10px"}},
|
||||
BDV2.react.createElement(
|
||||
"div",
|
||||
{className: "ui-button-contents"},
|
||||
self.state.loading ? "Loading" : "Load More"
|
||||
)
|
||||
),
|
||||
self.state.servers.length > 0 && BDV2.react.createElement(SettingsTitle, {text: self.state.title})
|
||||
)];
|
||||
}
|
||||
|
||||
get notConnected() {
|
||||
const self = this;
|
||||
//return BDV2.react.createElement(SettingsTitle, { text: self.state.title });
|
||||
let columnModule = BDModules.get(e => e.contentColumnDefault)[0]
|
||||
return [BDV2.react.createElement(
|
||||
"div",
|
||||
{key: "ncc", ref: "content", className: columnModule.contentColumn+" "+columnModule.contentColumn+" content-column default"},
|
||||
BDV2.react.createElement(
|
||||
"h2",
|
||||
{className: "ui-form-title h2 margin-reset margin-bottom-20"},
|
||||
"Not connected to discordservers.com!",
|
||||
BDV2.react.createElement(
|
||||
"button",
|
||||
{
|
||||
onClick: self.connect,
|
||||
type: "button",
|
||||
className: "ui-button filled brand small grow",
|
||||
style: {
|
||||
display: "inline-block",
|
||||
minHeight: "18px",
|
||||
marginLeft: "10px",
|
||||
lineHeight: "14px"
|
||||
}
|
||||
},
|
||||
BDV2.react.createElement(
|
||||
"div",
|
||||
{className: "ui-button-contents"},
|
||||
"Connect"
|
||||
)
|
||||
)
|
||||
), self.bdServer
|
||||
)];
|
||||
}
|
||||
|
||||
get footer() {
|
||||
return BDV2.react.createElement(
|
||||
"div",
|
||||
{className: "ui-tab-bar-header"},
|
||||
BDV2.react.createElement(
|
||||
"a",
|
||||
{href: "https://discordservers.com", target: "_blank"},
|
||||
"Discordservers.com"
|
||||
)
|
||||
);
|
||||
}
|
||||
|
||||
get connection() {
|
||||
const self = this;
|
||||
const {connection} = self.state;
|
||||
if (connection.state !== 2) return BDV2.react.createElement("span", null);
|
||||
|
||||
return BDV2.react.createElement(
|
||||
"span",
|
||||
null,
|
||||
BDV2.react.createElement(TabBarSeparator, null),
|
||||
BDV2.react.createElement(
|
||||
"span",
|
||||
{style: {color: "#b9bbbe", fontSize: "10px", marginLeft: "10px"}},
|
||||
"Connected as: ",
|
||||
`${connection.user.username}#${connection.user.discriminator}`
|
||||
),
|
||||
BDV2.react.createElement(
|
||||
"div",
|
||||
{style: {padding: "5px 10px 0 10px"}},
|
||||
BDV2.react.createElement(
|
||||
"button",
|
||||
{style: {width: "100%", minHeight: "20px"}, type: "button", className: "ui-button filled brand small grow"},
|
||||
BDV2.react.createElement(
|
||||
"div",
|
||||
{className: "ui-button-contents", onClick: self.connect},
|
||||
"Reconnect"
|
||||
)
|
||||
)
|
||||
)
|
||||
);
|
||||
}
|
||||
import BDV2 from "../../modules/v2";
|
||||
|
||||
import Tools from "../tools";
|
||||
import SettingsTitle from "../settingsTitle";
|
||||
import TabBarSeparator from "../tabBarSeparator";
|
||||
import TabBarHeader from "../tabBarHeader";
|
||||
import TabBarItem from "../tabBarItem";
|
||||
|
||||
import ServerCard from "./serverCard";
|
||||
import SidebarView from "./sidebarView";
|
||||
|
||||
export default class V2C_PublicServers extends BDV2.reactComponent {
|
||||
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.setInitialState();
|
||||
this.close = this.close.bind(this);
|
||||
this.changeCategory = this.changeCategory.bind(this);
|
||||
this.search = this.search.bind(this);
|
||||
this.searchKeyDown = this.searchKeyDown.bind(this);
|
||||
this.checkConnection = this.checkConnection.bind(this);
|
||||
this.join = this.join.bind(this);
|
||||
this.connect = this.connect.bind(this);
|
||||
|
||||
this.GuildStore = BDV2.WebpackModules.findByUniqueProperties(["getGuilds"]);
|
||||
this.AvatarDefaults = BDV2.WebpackModules.findByUniqueProperties(["getUserAvatarURL", "DEFAULT_AVATARS"]);
|
||||
this.InviteActions = BDV2.WebpackModules.findByUniqueProperties(["acceptInvite"]);
|
||||
this.SortedGuildStore = BDV2.WebpackModules.findByUniqueProperties(["getSortedGuilds"]);
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
this.checkConnection();
|
||||
}
|
||||
|
||||
setInitialState() {
|
||||
this.state = {
|
||||
selectedCategory: -1,
|
||||
title: "Loading...",
|
||||
loading: true,
|
||||
servers: [],
|
||||
next: null,
|
||||
connection: {
|
||||
state: 0,
|
||||
user: null
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
close() {
|
||||
this.props.close()
|
||||
}
|
||||
|
||||
search(query, clear) {
|
||||
const self = this;
|
||||
fetch(`${self.endPoint}${query}${query ? "&schema=new" : "?schema=new"}`, {
|
||||
method: "get"
|
||||
}).then(async res => {
|
||||
if(res.status !== 200)throw await res.text()
|
||||
let data = await res.json()
|
||||
|
||||
let servers = data.results.reduce((arr, server) => {
|
||||
server.joined = false;
|
||||
arr.push(server);
|
||||
// arr.push(<ServerCard server={server} join={self.join}/>);
|
||||
return arr;
|
||||
}, []);
|
||||
|
||||
if (!clear) {
|
||||
servers = self.state.servers.concat(servers);
|
||||
}
|
||||
else {
|
||||
//servers.unshift(self.bdServer);
|
||||
}
|
||||
|
||||
let end = data.size + data.from;
|
||||
data.next = `?from=${end}`;
|
||||
if (self.state.term) data.next += `&term=${self.state.term}`;
|
||||
if (self.state.selectedCategory) data.next += `&category=${self.categoryButtons[self.state.selectedCategory]}`;
|
||||
if (end >= data.total) {
|
||||
end = data.total;
|
||||
data.next = null;
|
||||
}
|
||||
|
||||
let title = `Showing 1-${end} of ${data.total} results in ${self.categoryButtons[self.state.selectedCategory]}`;
|
||||
if (self.state.term) title += ` for ${self.state.term}`;
|
||||
|
||||
self.setState({
|
||||
loading: false,
|
||||
title: title,
|
||||
servers: servers,
|
||||
next: data.next
|
||||
});
|
||||
|
||||
if (clear) {
|
||||
//console.log(self);
|
||||
self.refs.sbv.refs.contentScroller.scrollTop = 0;
|
||||
}
|
||||
}).catch((err) => {
|
||||
console.error(err)
|
||||
return self.setState({
|
||||
loading: false,
|
||||
title: "Failed to load servers. Check console for details"
|
||||
});
|
||||
})
|
||||
}
|
||||
|
||||
async join(serverCard) {
|
||||
if (serverCard.props.pinned) return this.InviteActions.acceptInvite(serverCard.props.invite_code);
|
||||
|
||||
await fetch(`${this.joinEndPoint}/${serverCard.props.server.identifier}`,{
|
||||
method: "GET",
|
||||
credentials: "include",
|
||||
mode: "cors",
|
||||
headers: {
|
||||
"Accept": "application/json",
|
||||
"Content-Type": "application/json"
|
||||
}
|
||||
});
|
||||
|
||||
serverCard.setState({joined: true});
|
||||
}
|
||||
|
||||
connect() {
|
||||
const self = this;
|
||||
const options = self.windowOptions;
|
||||
options.x = Math.round(window.screenX + window.innerWidth / 2 - options.width / 2);
|
||||
options.y = Math.round(window.screenY + window.innerHeight / 2 - options.height / 2);
|
||||
|
||||
self.joinWindow = new (window.require("electron").remote.BrowserWindow)(options);
|
||||
const url = "https://auth.discordservers.com/connect?scopes=guilds.join&previousUrl=https://auth.discordservers.com/info";
|
||||
self.joinWindow.webContents.on("did-navigate", (event, url) => {
|
||||
if (url != "https://auth.discordservers.com/info") return;
|
||||
self.joinWindow.close();
|
||||
self.checkConnection();
|
||||
});
|
||||
self.joinWindow.loadURL(url);
|
||||
}
|
||||
|
||||
get windowOptions() {
|
||||
return {
|
||||
width: 500,
|
||||
height: 550,
|
||||
backgroundColor: "#282b30",
|
||||
show: true,
|
||||
resizable: false,
|
||||
maximizable: false,
|
||||
minimizable: false,
|
||||
alwaysOnTop: true,
|
||||
frame: false,
|
||||
center: false,
|
||||
webPreferences: {
|
||||
nodeIntegration: false
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
get bdServer() {
|
||||
const server = {
|
||||
name: "BetterDiscord",
|
||||
online: "30000+",
|
||||
members: "70000+",
|
||||
categories: ["community", "programming", "support"],
|
||||
description: "Official BetterDiscord server for support etc",
|
||||
identifier: "86004744966914048",
|
||||
iconUrl: "https://cdn.discordapp.com/icons/86004744966914048/292e7f6bfff2b71dfd13e508a859aedd.webp",
|
||||
nativejoin: true,
|
||||
invite_code: "0Tmfo5ZbORCRqbAd",
|
||||
pinned: true
|
||||
};
|
||||
const server2 = {
|
||||
name: "Lightcord",
|
||||
online: "100+",
|
||||
members: "300+",
|
||||
categories: ["community", "programming", "support"],
|
||||
description: "Official Lightcord server for support etc",
|
||||
identifier: "705908350218666117",
|
||||
iconUrl: "https://github.com/lightcord.png",
|
||||
nativejoin: true,
|
||||
invite_code: "7eFff2A",
|
||||
pinned: true
|
||||
};
|
||||
const guildList = this.SortedGuildStore.getFlattenedGuildIds();
|
||||
const defaultList = this.AvatarDefaults.DEFAULT_AVATARS;
|
||||
return [
|
||||
BDV2.react.createElement(ServerCard, {server: server2, pinned: true, join: this.join, guildList: guildList, fallback: defaultList[Math.floor(Math.random() * 5)]}),
|
||||
BDV2.react.createElement(ServerCard, {server: server, pinned: true, join: this.join, guildList: guildList, fallback: defaultList[Math.floor(Math.random() * 5)]})
|
||||
]
|
||||
}
|
||||
|
||||
get endPoint() {
|
||||
return "https://search.discordservers.com";
|
||||
}
|
||||
|
||||
get joinEndPoint() {
|
||||
return "https://j.discordservers.com";
|
||||
}
|
||||
|
||||
get connectEndPoint() {
|
||||
return "https://join.discordservers.com/connect";
|
||||
}
|
||||
|
||||
async checkConnection() {
|
||||
const self = this;
|
||||
try {
|
||||
const response = await fetch(`https://auth.discordservers.com/info`,{
|
||||
method: "GET",
|
||||
credentials: "include",
|
||||
mode: "cors",
|
||||
headers: {
|
||||
"Accept": "application/json",
|
||||
"Content-Type": "application/json"
|
||||
}
|
||||
});
|
||||
const text = await response.text()
|
||||
if(!text){
|
||||
self.setState({
|
||||
title: "Not connected to discordservers.com!",
|
||||
loading: true,
|
||||
selectedCategory: -1,
|
||||
connection: {
|
||||
state: 1,
|
||||
user: null
|
||||
}
|
||||
});
|
||||
return
|
||||
}
|
||||
const data = JSON.parse(text)
|
||||
self.setState({
|
||||
selectedCategory: 0,
|
||||
connection: {
|
||||
state: 2,
|
||||
user: data
|
||||
}
|
||||
});
|
||||
self.search("", true);
|
||||
}
|
||||
catch (error) {
|
||||
console.error(error)
|
||||
self.setState({
|
||||
title: "Not connected to discordservers.com!",
|
||||
loading: true,
|
||||
selectedCategory: -1,
|
||||
connection: {
|
||||
state: 1,
|
||||
user: null
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
render() {
|
||||
return BDV2.react.createElement("div", {id: "pubslayerroot"},
|
||||
BDV2.react.createElement("div", {id: "pubslayer"}, BDV2.react.createElement(SidebarView, {ref: "sbv"}, this.component))
|
||||
);
|
||||
}
|
||||
|
||||
get component() {
|
||||
return {
|
||||
sidebar: {
|
||||
component: this.sidebar
|
||||
},
|
||||
content: {
|
||||
component: this.content
|
||||
},
|
||||
tools: {
|
||||
component: BDV2.react.createElement(Tools, {key: "pt", ref: "tools", onClick: this.close})
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
get sidebar() {
|
||||
return BDV2.react.createElement(
|
||||
"div",
|
||||
{className: "sidebar", key: "ps"},
|
||||
BDV2.react.createElement(
|
||||
"div",
|
||||
{className: "ui-tab-bar SIDE"},
|
||||
BDV2.react.createElement(
|
||||
"div",
|
||||
{className: "ui-tab-bar-header", style: {fontSize: "16px"}},
|
||||
"Public Servers"
|
||||
),
|
||||
BDV2.react.createElement(TabBarSeparator, null),
|
||||
this.searchInput,
|
||||
BDV2.react.createElement(TabBarSeparator, null),
|
||||
BDV2.react.createElement(TabBarHeader, {text: "Categories"}),
|
||||
this.categoryButtons.map((value, index) => {
|
||||
return BDV2.react.createElement(TabBarItem, {id: index, onClick: this.changeCategory, key: index, text: value, selected: this.state.selectedCategory === index});
|
||||
}),
|
||||
BDV2.react.createElement(TabBarSeparator, null),
|
||||
this.footer,
|
||||
this.connection
|
||||
)
|
||||
);
|
||||
}
|
||||
|
||||
get searchInput() {
|
||||
return BDV2.react.createElement(
|
||||
"div",
|
||||
{className: "ui-form-item"},
|
||||
BDV2.react.createElement(
|
||||
"div",
|
||||
{className: "ui-text-input flex-vertical", style: {width: "172px", marginLeft: "10px"}},
|
||||
BDV2.react.createElement("input", {ref: "searchinput", onKeyDown: this.searchKeyDown, onChange: () => {}, type: "text", className: "input default", placeholder: "Search...", maxLength: "50"})
|
||||
)
|
||||
);
|
||||
}
|
||||
|
||||
searchKeyDown(e) {
|
||||
const self = this;
|
||||
if (self.state.loading || e.which !== 13) return;
|
||||
self.setState({
|
||||
loading: true,
|
||||
title: "Loading...",
|
||||
term: e.target.value
|
||||
});
|
||||
let query = `?term=${e.target.value}`;
|
||||
if (self.state.selectedCategory !== 0) {
|
||||
query += `&category=${self.categoryButtons[self.state.selectedCategory]}`;
|
||||
}
|
||||
self.search(query, true);
|
||||
}
|
||||
|
||||
get categoryButtons() {
|
||||
return ["All", "FPS Games", "MMO Games", "Strategy Games", "MOBA Games", "RPG Games", "Tabletop Games", "Sandbox Games", "Simulation Games", "Music", "Community", "Language", "Programming", "Other"];
|
||||
}
|
||||
|
||||
changeCategory(id) {
|
||||
const self = this;
|
||||
if (self.state.loading) return;
|
||||
self.refs.searchinput.value = "";
|
||||
self.setState({
|
||||
loading: true,
|
||||
selectedCategory: id,
|
||||
title: "Loading...",
|
||||
term: null
|
||||
});
|
||||
if (id === 0) {
|
||||
self.search("", true);
|
||||
return;
|
||||
}
|
||||
self.search(`?category=${self.categoryButtons[id]}`, true);
|
||||
}
|
||||
|
||||
get content() {
|
||||
const self = this;
|
||||
const guildList = this.SortedGuildStore.getFlattenedGuildIds();
|
||||
const defaultList = this.AvatarDefaults.DEFAULT_AVATARS;
|
||||
if (self.state.connection.state === 1) return self.notConnected;
|
||||
let columnModule = BDModules.get(e => e.contentColumnDefault)[0]
|
||||
return [BDV2.react.createElement(
|
||||
"div",
|
||||
{ref: "content", key: "pc", className: columnModule.contentColumn+" "+columnModule.contentColumn+" content-column default"},
|
||||
BDV2.react.createElement(SettingsTitle, {text: self.state.title}),
|
||||
self.bdServer,
|
||||
self.state.servers.map((server) => {
|
||||
return BDV2.react.createElement(ServerCard, {key: server.identifier, server: server, join: self.join, guildList: guildList, fallback: defaultList[Math.floor(Math.random() * 5)]});
|
||||
}),
|
||||
self.state.next && BDV2.react.createElement(
|
||||
"button",
|
||||
{type: "button", onClick: () => {
|
||||
if (self.state.loading) return;self.setState({loading: true}); self.search(self.state.next, false);
|
||||
}, className: "ui-button filled brand small grow", style: {width: "100%", marginTop: "10px", marginBottom: "10px"}},
|
||||
BDV2.react.createElement(
|
||||
"div",
|
||||
{className: "ui-button-contents"},
|
||||
self.state.loading ? "Loading" : "Load More"
|
||||
)
|
||||
),
|
||||
self.state.servers.length > 0 && BDV2.react.createElement(SettingsTitle, {text: self.state.title})
|
||||
)];
|
||||
}
|
||||
|
||||
get notConnected() {
|
||||
const self = this;
|
||||
//return BDV2.react.createElement(SettingsTitle, { text: self.state.title });
|
||||
let columnModule = BDModules.get(e => e.contentColumnDefault)[0]
|
||||
return [BDV2.react.createElement(
|
||||
"div",
|
||||
{key: "ncc", ref: "content", className: columnModule.contentColumn+" "+columnModule.contentColumn+" content-column default"},
|
||||
BDV2.react.createElement(
|
||||
"h2",
|
||||
{className: "ui-form-title h2 margin-reset margin-bottom-20"},
|
||||
"Not connected to discordservers.com!",
|
||||
BDV2.react.createElement(
|
||||
"button",
|
||||
{
|
||||
onClick: self.connect,
|
||||
type: "button",
|
||||
className: "ui-button filled brand small grow",
|
||||
style: {
|
||||
display: "inline-block",
|
||||
minHeight: "18px",
|
||||
marginLeft: "10px",
|
||||
lineHeight: "14px"
|
||||
}
|
||||
},
|
||||
BDV2.react.createElement(
|
||||
"div",
|
||||
{className: "ui-button-contents"},
|
||||
"Connect"
|
||||
)
|
||||
)
|
||||
), self.bdServer
|
||||
)];
|
||||
}
|
||||
|
||||
get footer() {
|
||||
return BDV2.react.createElement(
|
||||
"div",
|
||||
{className: "ui-tab-bar-header"},
|
||||
BDV2.react.createElement(
|
||||
"a",
|
||||
{href: "https://discordservers.com", target: "_blank"},
|
||||
"Discordservers.com"
|
||||
)
|
||||
);
|
||||
}
|
||||
|
||||
get connection() {
|
||||
const self = this;
|
||||
const {connection} = self.state;
|
||||
if (connection.state !== 2) return BDV2.react.createElement("span", null);
|
||||
|
||||
return BDV2.react.createElement(
|
||||
"span",
|
||||
null,
|
||||
BDV2.react.createElement(TabBarSeparator, null),
|
||||
BDV2.react.createElement(
|
||||
"span",
|
||||
{style: {color: "#b9bbbe", fontSize: "10px", marginLeft: "10px"}},
|
||||
"Connected as: ",
|
||||
`${connection.user.username}#${connection.user.discriminator}`
|
||||
),
|
||||
BDV2.react.createElement(
|
||||
"div",
|
||||
{style: {padding: "5px 10px 0 10px"}},
|
||||
BDV2.react.createElement(
|
||||
"button",
|
||||
{style: {width: "100%", minHeight: "20px"}, type: "button", className: "ui-button filled brand small grow"},
|
||||
BDV2.react.createElement(
|
||||
"div",
|
||||
{className: "ui-button-contents", onClick: self.connect},
|
||||
"Reconnect"
|
||||
)
|
||||
)
|
||||
)
|
||||
);
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1 @@
|
|||
module.exports = window["__SECRET_EMOTION__"]
|
||||
|
|
@ -1238,6 +1238,12 @@
|
|||
"integrity": "sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c=",
|
||||
"dev": true
|
||||
},
|
||||
"typescript": {
|
||||
"version": "3.9.7",
|
||||
"resolved": "https://registry.npmjs.org/typescript/-/typescript-3.9.7.tgz",
|
||||
"integrity": "sha512-BLbiRkiBzAwsjut4x/dsibSTB6yWpwT5qWmC2OfuCg3GgVQCSgMs4vEctYPhsaGtd0AeuuHMkjZ2h2WG8MSzRw==",
|
||||
"dev": true
|
||||
},
|
||||
"universalify": {
|
||||
"version": "0.1.2",
|
||||
"resolved": "https://registry.npmjs.org/universalify/-/universalify-0.1.2.tgz",
|
||||
|
|
|
|||
|
|
@ -42,6 +42,7 @@
|
|||
"cross-spawn": "^7.0.3",
|
||||
"electron": "^8.4.0",
|
||||
"terser": "^4.7.0",
|
||||
"typescript": "^3.9.7",
|
||||
"yazl": "^2.5.1"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue