initial collapsible groups

This commit is contained in:
Zack Rauen 2019-06-04 00:18:15 -04:00
parent 6bed40f21f
commit 18d6da12eb
17 changed files with 547 additions and 134 deletions

View File

@ -32,7 +32,9 @@
"no-var": "error",
"prefer-const": "error",
"react/jsx-uses-react": "error",
"react/jsx-uses-vars": "error"
"react/jsx-uses-vars": "error",
"react/prop-types": 0,
"react/jsx-no-target-blank": "error"
},
"globals": {
"webpackJsonp": false,

View File

@ -24,7 +24,62 @@
/* =============== */
/* END V2 LOADER */
.bd-settings-group .bd-settings-title {
display: flex;
justify-content: space-between;
}
.bd-settings-group .bd-settings-title::after {
content: "";
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxOS4wLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iQ2FscXVlXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSItOTUwIDUzMiAxOCAxOCIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAtOTUwIDUzMiAxOCAxODsiIHhtbDpzcGFjZT0icHJlc2VydmUiPg0KPHN0eWxlIHR5cGU9InRleHQvY3NzIj4NCgkuc3Qwe2ZpbGw6bm9uZTt9DQoJLnN0MXtmaWxsOm5vbmU7c3Ryb2tlOiNGRkZGRkY7c3Ryb2tlLXdpZHRoOjEuNTtzdHJva2UtbWl0ZXJsaW1pdDoxMDt9DQo8L3N0eWxlPg0KPHBhdGggY2xhc3M9InN0MCIgZD0iTS05MzIsNTMydjE4aC0xOHYtMThILTkzMnoiLz4NCjxwb2x5bGluZSBjbGFzcz0ic3QxIiBwb2ludHM9Ii05MzYuNiw1MzguOCAtOTQxLDU0My4yIC05NDUuNCw1MzguOCAiLz4NCjwvc3ZnPg0K);
height: 20px;
width: 20px;
display: inline-block;
vertical-align: bottom;
transition: transform .3s ease;
transform: rotate(0);
}
.bd-settings-group.bd-settings-group-collapsed .bd-settings-title::after {
transition: transform .3s ease;
transform: rotate(90deg);
}
.bd-settings-container {
height: auto;
overflow: hidden;
transition: height 300ms cubic-bezier(0.47, 0, 0.745, 0.715);
}
.bd-settings-group.bd-settings-group-collapsed .bd-settings-container {
height: 0px;
}
.bd-settings-group ~ .bd-settings-group .bd-settings-title {
margin-top: 30px;
transition: margin-top 300ms ease;
}
.bd-settings-group.bd-settings-group-collapsed + .bd-settings-group .bd-settings-title {
margin-top: 0px;
}
.bd-settings-group .bd-settings-title {
order: 1;
align-items: center;
}
.bd-settings-group .bd-settings-title::before {
content: "";
background-color: rgba(114,118,125,.3);
height: 2px;
order: 2;
flex: 1;
margin: 0 10px 0 15px;
}
.bd-settings-group .bd-settings-title::after {
order: 3;
}

2
css/main.min.css vendored

File diff suppressed because one or more lines are too long

View File

@ -957,6 +957,7 @@ const bdEmoteSettingIDs = {
async initialize() {
super.initialize();
return;
await this.getBlacklist();
await this.loadEmoteData(data__WEBPACK_IMPORTED_MODULE_1__["EmoteInfo"]);
@ -2753,13 +2754,11 @@ Core.prototype.initObserver = function () {
const node = mutation.addedNodes[0];
if (node.classList.contains("layer-3QrUeG")) {
if (node.getElementsByClassName("guild-settings-base-section").length) node.setAttribute("layer-id", "server-settings");
if (node.getElementsByClassName("socialLinks-3jqNFy").length) {
node.setAttribute("layer-id", "user-settings");
node.setAttribute("id", "user-settings");
if (!document.getElementById("bd-settings-sidebar")) _settingspanel__WEBPACK_IMPORTED_MODULE_5__["default"].renderSidebar();
}
if (node.getElementsByClassName("guild-settings-base-section").length) node.setAttribute("layer-id", "server-settings"); // if (node.getElementsByClassName("socialLinks-3jqNFy").length) {
// node.setAttribute("layer-id", "user-settings");
// node.setAttribute("id", "user-settings");
// if (!document.getElementById("bd-settings-sidebar")) SettingsPanel.renderSidebar();
// }
}
}
});
@ -3570,6 +3569,7 @@ __webpack_require__.r(__webpack_exports__);
//WebpackModules.getModule(m => m.getSection && m.getProps && !m.getGuildId && !m.getChannel)
//WebpackModules.getByProps("getGuildId", "getSection")
@ -3622,15 +3622,17 @@ __webpack_require__.r(__webpack_exports__);
label: "BandagedBD"
});
data.returnValue.splice(25, 0, {
section: "IJ1",
label: "Injected Tab 1",
section: "BBD Settings",
label: "Settings",
element: () => this.renderer.core2
});
data.returnValue.splice(26, 0, {
section: "IJ2",
label: "Injected Tab 2",
section: "BBD Test",
label: "Test Tab",
onClick: function () {
console.log("CLICK2");
ui__WEBPACK_IMPORTED_MODULE_6__["Toasts"].success("This can just be a click listener!", {
forceShow: true
});
}
});
}
@ -6648,6 +6650,29 @@ class V2C_ContentColumn extends modules__WEBPACK_IMPORTED_MODULE_0__["React"].Co
/***/ }),
/***/ "./src/ui/settings/divider.jsx":
/*!*************************************!*\
!*** ./src/ui/settings/divider.jsx ***!
\*************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return Divider; });
/* harmony import */ var modules__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! modules */ "./src/modules/modules.js");
class Divider extends modules__WEBPACK_IMPORTED_MODULE_0__["React"].Component {
render() {
return modules__WEBPACK_IMPORTED_MODULE_0__["React"].createElement("div", {
className: "bd-divider divider-3573oO marginTop8-1DLZ1n marginBottom40-2vIwTv"
});
}
}
/***/ }),
/***/ "./src/ui/settings/exitbutton.js":
/*!***************************************!*\
!*** ./src/ui/settings/exitbutton.js ***!
@ -6695,6 +6720,100 @@ class V2C_Tools extends modules__WEBPACK_IMPORTED_MODULE_0__["React"].Component
/***/ }),
/***/ "./src/ui/settings/group.jsx":
/*!***********************************!*\
!*** ./src/ui/settings/group.jsx ***!
\***********************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return Group; });
/* harmony import */ var data__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! data */ "./src/data/data.js");
/* harmony import */ var modules__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! modules */ "./src/modules/modules.js");
/* harmony import */ var _title__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./title */ "./src/ui/settings/title.js");
/* harmony import */ var _vertical__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./vertical */ "./src/ui/settings/vertical.jsx");
/* harmony import */ var _divider__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./divider */ "./src/ui/settings/divider.jsx");
/* harmony import */ var _switch__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./switch */ "./src/ui/settings/switch.js");
class Group extends modules__WEBPACK_IMPORTED_MODULE_1__["React"].Component {
constructor(props) {
super(props);
this.container = modules__WEBPACK_IMPORTED_MODULE_1__["React"].createRef();
this.state = {
collapsed: this.props.collapsible && this.props.collapsed
};
} // render() {
// const {title, settings, button} = this.props;
// const buttonComponent = button ? React.createElement("button", {key: "title-button", className: "bd-pfbtn", onClick: button.onClick}, button.title) : null;
// return [React.createElement(SettingsTitle, {text: title}),
// buttonComponent,
// settings.map(setting => {
// return React.createElement(Switch, {id: setting.id, key: setting.id, data: setting, checked: SettingsCookie[setting.id], onChange: (id, checked) => {
// this.props.onChange(id, checked);
// }});
// })];
// }
collapseGroup() {
if (this.state.collapsed) return this.expandGroup();
const container = modules__WEBPACK_IMPORTED_MODULE_1__["ReactDOM"].findDOMNode(this.container.current); // console.log(container.scrollHeight);
container.style.setProperty("height", container.scrollHeight + "px");
this.setState({
collapsed: true
}, () => setImmediate(() => container.style.setProperty("height", ""))); //
}
expandGroup() {
const container = modules__WEBPACK_IMPORTED_MODULE_1__["ReactDOM"].findDOMNode(this.container.current); // console.log(container.scrollHeight);
container.style.setProperty("height", container.scrollHeight + "px");
this.setState({
collapsed: false
}, () => setTimeout(() => container.style.setProperty("height", ""), 300)); //, () => container.style.setProperty("height", "")
//, () => container.style.setProperty("height", "")
}
render() {
const {
settings
} = this.props;
const groupClass = this.state.collapsed ? "bd-settings-group bd-settings-group-collapsed" : "bd-settings-group";
return modules__WEBPACK_IMPORTED_MODULE_1__["React"].createElement("div", {
className: groupClass
}, modules__WEBPACK_IMPORTED_MODULE_1__["React"].createElement(_title__WEBPACK_IMPORTED_MODULE_2__["default"], {
text: this.props.title,
collapsible: this.props.collapsible,
onClick: () => this.collapseGroup()
}), modules__WEBPACK_IMPORTED_MODULE_1__["React"].createElement(_vertical__WEBPACK_IMPORTED_MODULE_3__["default"], {
className: "bd-settings-container",
ref: this.container
}, settings.map(setting => {
return modules__WEBPACK_IMPORTED_MODULE_1__["React"].createElement(_switch__WEBPACK_IMPORTED_MODULE_5__["default"], {
id: setting.id,
key: setting.id,
name: setting.text,
note: setting.info,
checked: data__WEBPACK_IMPORTED_MODULE_0__["SettingsCookie"][setting.id],
onChange: (id, checked) => {
this.props.onChange(id, checked);
}
});
})), this.props.showDivider && modules__WEBPACK_IMPORTED_MODULE_1__["React"].createElement(_divider__WEBPACK_IMPORTED_MODULE_4__["default"], null));
}
}
/***/ }),
/***/ "./src/ui/settings/panel.js":
/*!**********************************!*\
!*** ./src/ui/settings/panel.js ***!
@ -6963,7 +7082,7 @@ class V2C_PluginCard extends modules__WEBPACK_IMPORTED_MODULE_1__["React"].Compo
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return V2C_SectionedSettingsPanel; });
/* harmony import */ var modules__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! modules */ "./src/modules/modules.js");
/* harmony import */ var _settingsgroup__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./settingsgroup */ "./src/ui/settings/settingsgroup.js");
/* harmony import */ var _group__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./group */ "./src/ui/settings/group.jsx");
class V2C_SectionedSettingsPanel extends modules__WEBPACK_IMPORTED_MODULE_0__["React"].Component {
@ -6975,7 +7094,7 @@ class V2C_SectionedSettingsPanel extends modules__WEBPACK_IMPORTED_MODULE_0__["R
return modules__WEBPACK_IMPORTED_MODULE_0__["React"].createElement("div", {
className: "contentColumn-2hrIYH contentColumnDefault-1VQkGM content-column default"
}, this.props.sections.map(section => {
return modules__WEBPACK_IMPORTED_MODULE_0__["React"].createElement(_settingsgroup__WEBPACK_IMPORTED_MODULE_1__["default"], Object.assign({}, section, {
return modules__WEBPACK_IMPORTED_MODULE_0__["React"].createElement(_group__WEBPACK_IMPORTED_MODULE_1__["default"], Object.assign({}, section, {
onChange: this.props.onChange
}));
}));
@ -7009,6 +7128,8 @@ __webpack_require__.r(__webpack_exports__);
/* harmony import */ var _icons_reload__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../icons/reload */ "./src/ui/icons/reload.js");
/* harmony import */ var _customcss_editor__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../customcss/editor */ "./src/ui/customcss/editor.js");
/* harmony import */ var _settings_settingsgroup__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../settings/settingsgroup */ "./src/ui/settings/settingsgroup.js");
/* harmony import */ var _settings_group__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../settings/group */ "./src/ui/settings/group.jsx");
@ -7063,6 +7184,7 @@ class V2_SettingsPanel {
settings: settings.filter(s => s.category == c)
};
});
console.log(sections);
return sections;
}
@ -7123,7 +7245,7 @@ class V2_SettingsPanel {
get core2() {
return this.coreSettings.map(section => {
return modules__WEBPACK_IMPORTED_MODULE_1__["React"].createElement(_settings_settingsgroup__WEBPACK_IMPORTED_MODULE_13__["default"], Object.assign({}, section, {
return modules__WEBPACK_IMPORTED_MODULE_1__["React"].createElement(_settings_group__WEBPACK_IMPORTED_MODULE_14__["default"], Object.assign({}, section, {
onChange: this.onChange
}));
});
@ -7625,64 +7747,27 @@ class V2C_SideBar extends modules__WEBPACK_IMPORTED_MODULE_0__["React"].Componen
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return V2C_Switch; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return Switch; });
/* harmony import */ var modules__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! modules */ "./src/modules/modules.js");
const flexContainer = "flex-1xMQg5 flex-1O1GKY da-flex da-flex vertical-V37hAW flex-1O1GKY directionColumn-35P_nr justifyStart-2NDFzi alignStretch-DpGPf3 noWrap-3jynv6 switchItem-2hKKKK";
const flexWrap = "flex-1xMQg5 flex-1O1GKY da-flex da-flex horizontal-1ae9ci horizontal-2EEEnY flex-1O1GKY directionRow-3v3tfG justifyStart-2NDFzi alignStart-H-X2h- noWrap-3jynv6";
const flexChild = "flexChild-faoVW3 da-flexChild";
const flexContainer = "flex-1xMQg5 flex-1O1GKY vertical-V37hAW flex-1O1GKY directionColumn-35P_nr justifyStart-2NDFzi alignStretch-DpGPf3 noWrap-3jynv6 switchItem-2hKKKK";
const flexWrap = "flex-1xMQg5 flex-1O1GKY horizontal-1ae9ci horizontal-2EEEnY flex-1O1GKY directionRow-3v3tfG justifyStart-2NDFzi alignStart-H-X2h- noWrap-3jynv6";
const flexChild = "flexChild-faoVW3";
const title = "titleDefault-a8-ZSr title-31JmR4 da-titleDefault da-title";
const switchWrapper = "flexChild-faoVW3 da-flexChild switchEnabled-V2WDBB switch-3wwwcV da-switchEnabled da-switch valueUnchecked-2lU_20 value-2hFrkk sizeDefault-2YlOZr size-3rFEHg themeDefault-24hCdX";
const switchWrapperEnabled = "flexChild-faoVW3 da-flexChild switchEnabled-V2WDBB switch-3wwwcV da-switchEnabled da-switch valueChecked-m-4IJZ value-2hFrkk sizeDefault-2YlOZr size-3rFEHg themeDefault-24hCdX";
const switchClass = "checkboxEnabled-CtinEn checkbox-2tyjJg da-checkboxEnabled da-checkbox";
const description = "description-3_Ncsb formText-3fs7AJ da-description da-formText note-1V3kyJ da-note modeDefault-3a2Ph1 da-modeDefault primary-jw0I4K";
class V2C_Switch extends modules__WEBPACK_IMPORTED_MODULE_0__["React"].Component {
const switchWrapperChecked = "flexChild-faoVW3 da-flexChild switchEnabled-V2WDBB switch-3wwwcV da-switchEnabled da-switch valueChecked-m-4IJZ value-2hFrkk sizeDefault-2YlOZr size-3rFEHg themeDefault-24hCdX";
const switchClass = "checkboxEnabled-CtinEn checkbox-2tyjJg";
const description = "description-3_Ncsb formText-3fs7AJ note-1V3kyJ modeDefault-3a2Ph1 primary-jw0I4K";
const divider = "divider-3573oO dividerDefault-3rvLe-";
class Switch extends modules__WEBPACK_IMPORTED_MODULE_0__["React"].Component {
constructor(props) {
super(props);
this.setInitialState();
this.onChange = this.onChange.bind(this);
}
setInitialState() {
console.log(props);
this.state = {
checked: this.props.checked
};
}
render() {
const {
text,
info
} = this.props.data;
const {
checked
} = this.state;
return modules__WEBPACK_IMPORTED_MODULE_0__["React"].createElement("div", {
className: `ui-flex flex-vertical flex-justify-start flex-align-stretch flex-nowrap ui-switch-item ${flexContainer}`
}, modules__WEBPACK_IMPORTED_MODULE_0__["React"].createElement("div", {
className: `ui-flex flex-horizontal flex-justify-start flex-align-stretch flex-nowrap ${flexWrap}`
}, modules__WEBPACK_IMPORTED_MODULE_0__["React"].createElement("h3", {
className: `ui-form-title h3 margin-reset margin-reset ui-flex-child ${title} ${flexChild}`
}, text), modules__WEBPACK_IMPORTED_MODULE_0__["React"].createElement("div", {
className: `ui-switch-wrapper ui-flex-child ${checked ? switchWrapperEnabled : switchWrapper}`,
style: {
flex: "0 0 auto"
}
}, modules__WEBPACK_IMPORTED_MODULE_0__["React"].createElement("input", {
className: `ui-switch-checkbox ${switchClass}`,
type: "checkbox",
checked: checked,
onChange: e => this.onChange(e)
}), modules__WEBPACK_IMPORTED_MODULE_0__["React"].createElement("div", {
className: `ui-switch ${checked ? "checked" : ""}`
}))), modules__WEBPACK_IMPORTED_MODULE_0__["React"].createElement("div", {
className: `ui-form-text style-description margin-top-4 ${description}`,
style: {
flex: "1 1 auto"
}
}, info));
}
onChange() {
this.props.onChange(this.props.id, !this.state.checked);
this.setState({
@ -7690,7 +7775,94 @@ class V2C_Switch extends modules__WEBPACK_IMPORTED_MODULE_0__["React"].Component
});
}
}
render() {
return modules__WEBPACK_IMPORTED_MODULE_0__["React"].createElement("div", {
className: flexContainer,
style: {
flex: "1 1 auto"
}
}, modules__WEBPACK_IMPORTED_MODULE_0__["React"].createElement("div", {
className: flexWrap,
style: {
flex: "1 1 auto"
}
}, modules__WEBPACK_IMPORTED_MODULE_0__["React"].createElement("div", {
className: flexChild,
style: {
flex: "1 1 auto"
}
}, modules__WEBPACK_IMPORTED_MODULE_0__["React"].createElement("label", {
htmlFor: this.props.id,
className: title
}, this.props.name || this.props.data.text)), modules__WEBPACK_IMPORTED_MODULE_0__["React"].createElement("div", {
className: this.state.checked ? switchWrapperChecked : switchWrapper,
tabIndex: "0",
style: {
flex: "0 0 auto"
}
}, modules__WEBPACK_IMPORTED_MODULE_0__["React"].createElement("input", {
id: this.props.id,
className: switchClass,
type: "checkbox",
tabIndex: "-1",
checked: this.state.checked,
onChange: e => this.onChange(e)
}))), modules__WEBPACK_IMPORTED_MODULE_0__["React"].createElement("div", {
className: description,
style: {
flex: "1 1 auto"
}
}, this.props.note || this.props.data.info), modules__WEBPACK_IMPORTED_MODULE_0__["React"].createElement("div", {
className: divider
}));
}
} // export default class V2C_Switch extends React.Component {
// constructor(props) {
// super(props);
// this.setInitialState();
// this.onChange = this.onChange.bind(this);
// }
// setInitialState() {
// this.state = {
// checked: this.props.checked
// };
// }
// render() {
// const {text, info} = this.props.data;
// const {checked} = this.state;
// return React.createElement(
// "div",
// {className: `ui-flex flex-vertical flex-justify-start flex-align-stretch flex-nowrap ui-switch-item ${flexContainer}`},
// React.createElement(
// "div",
// {className: `ui-flex flex-horizontal flex-justify-start flex-align-stretch flex-nowrap ${flexWrap}`},
// React.createElement(
// "h3",
// {className: `ui-form-title h3 margin-reset margin-reset ui-flex-child ${title} ${flexChild}`},
// text
// ),
// React.createElement(
// "div",
// {className: `ui-switch-wrapper ui-flex-child ${checked ? switchWrapperChecked : switchWrapper}`, style: {flex: "0 0 auto"}},
// React.createElement("input", {className: `ui-switch-checkbox ${switchClass}`, type: "checkbox", checked: checked, onChange: e => this.onChange(e)}),
// React.createElement("div", {className: `ui-switch ${checked ? "checked" : ""}`})
// )
// ),
// React.createElement(
// "div",
// {className: `ui-form-text style-description margin-top-4 ${description}`, style: {flex: "1 1 auto"}},
// info
// )
// );
// }
// onChange() {
// this.props.onChange(this.props.id, !this.state.checked);
// this.setState({
// checked: !this.state.checked
// });
// }
// }
/***/ }),
@ -7917,18 +8089,23 @@ class V2C_ThemeCard extends modules__WEBPACK_IMPORTED_MODULE_1__["React"].Compon
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return V2C_SettingsTitle; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return SettingsTitle; });
/* harmony import */ var modules__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! modules */ "./src/modules/modules.js");
class V2C_SettingsTitle extends modules__WEBPACK_IMPORTED_MODULE_0__["React"].Component {
const className = "bd-settings-title h2-2gWE-o title-3sZWYQ size16-14cGz5 height20-mO2eIN weightSemiBold-NJexzi defaultColor-1_ajX0 defaultMarginh2-2LTaUL marginBottom20-32qID7";
class SettingsTitle extends modules__WEBPACK_IMPORTED_MODULE_0__["React"].Component {
constructor(props) {
super(props);
} //h2-2gWE-o title-3sZWYQ size16-14cGz5 height20-mO2eIN weightSemiBold-NJexzi da-h2 da-title da-size16 da-height20 da-weightSemiBold defaultColor-1_ajX0 da-defaultColor marginTop60-3PGbtK da-marginTop60 marginBottom20-32qID7 da-marginBottom20
render() {
const titleClass = this.props.className ? `${className} ${this.props.className}` : className;
return modules__WEBPACK_IMPORTED_MODULE_0__["React"].createElement("h2", {
className: "ui-form-title h2 margin-reset margin-bottom-20 marginTop60-3PGbtK h2-2gWE-o title-3sZWYQ size16-14cGz5 height20-mO2eIN weightSemiBold-NJexzi defaultColor-1_ajX0 defaultMarginh2-2LTaUL marginBottom20-32qID7"
className: titleClass,
onClick: () => {
this.props.onClick && this.props.onClick();
}
}, this.props.text);
}
@ -7936,6 +8113,31 @@ class V2C_SettingsTitle extends modules__WEBPACK_IMPORTED_MODULE_0__["React"].Co
/***/ }),
/***/ "./src/ui/settings/vertical.jsx":
/*!**************************************!*\
!*** ./src/ui/settings/vertical.jsx ***!
\**************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return VerticalContainer; });
/* harmony import */ var modules__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! modules */ "./src/modules/modules.js");
const className = "bd-vertical-container";
class VerticalContainer extends modules__WEBPACK_IMPORTED_MODULE_0__["React"].Component {
render() {
const containerClass = this.props.className ? `${className} ${this.props.className}` : className;
return modules__WEBPACK_IMPORTED_MODULE_0__["React"].createElement("div", {
className: containerClass
}, this.props.children);
}
}
/***/ }),
/***/ "./src/ui/sidebarview.js":
/*!*******************************!*\
!*** ./src/ui/sidebarview.js ***!

2
js/main.min.js vendored

File diff suppressed because one or more lines are too long

41
package-lock.json generated
View File

@ -3048,7 +3048,8 @@
"ansi-regex": {
"version": "2.1.1",
"bundled": true,
"dev": true
"dev": true,
"optional": true
},
"aproba": {
"version": "1.2.0",
@ -3069,12 +3070,14 @@
"balanced-match": {
"version": "1.0.0",
"bundled": true,
"dev": true
"dev": true,
"optional": true
},
"brace-expansion": {
"version": "1.1.11",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"balanced-match": "^1.0.0",
"concat-map": "0.0.1"
@ -3089,17 +3092,20 @@
"code-point-at": {
"version": "1.1.0",
"bundled": true,
"dev": true
"dev": true,
"optional": true
},
"concat-map": {
"version": "0.0.1",
"bundled": true,
"dev": true
"dev": true,
"optional": true
},
"console-control-strings": {
"version": "1.1.0",
"bundled": true,
"dev": true
"dev": true,
"optional": true
},
"core-util-is": {
"version": "1.0.2",
@ -3216,7 +3222,8 @@
"inherits": {
"version": "2.0.3",
"bundled": true,
"dev": true
"dev": true,
"optional": true
},
"ini": {
"version": "1.3.5",
@ -3228,6 +3235,7 @@
"version": "1.0.0",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"number-is-nan": "^1.0.0"
}
@ -3242,6 +3250,7 @@
"version": "3.0.4",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"brace-expansion": "^1.1.7"
}
@ -3249,12 +3258,14 @@
"minimist": {
"version": "0.0.8",
"bundled": true,
"dev": true
"dev": true,
"optional": true
},
"minipass": {
"version": "2.3.5",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"safe-buffer": "^5.1.2",
"yallist": "^3.0.0"
@ -3273,6 +3284,7 @@
"version": "0.5.1",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"minimist": "0.0.8"
}
@ -3353,7 +3365,8 @@
"number-is-nan": {
"version": "1.0.1",
"bundled": true,
"dev": true
"dev": true,
"optional": true
},
"object-assign": {
"version": "4.1.1",
@ -3365,6 +3378,7 @@
"version": "1.4.0",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"wrappy": "1"
}
@ -3450,7 +3464,8 @@
"safe-buffer": {
"version": "5.1.2",
"bundled": true,
"dev": true
"dev": true,
"optional": true
},
"safer-buffer": {
"version": "2.1.2",
@ -3486,6 +3501,7 @@
"version": "1.0.2",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"code-point-at": "^1.0.0",
"is-fullwidth-code-point": "^1.0.0",
@ -3505,6 +3521,7 @@
"version": "3.0.1",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"ansi-regex": "^2.0.0"
}
@ -3548,12 +3565,14 @@
"wrappy": {
"version": "1.0.2",
"bundled": true,
"dev": true
"dev": true,
"optional": true
},
"yallist": {
"version": "3.0.3",
"bundled": true,
"dev": true
"dev": true,
"optional": true
}
}
},

View File

@ -23,6 +23,7 @@ export default new class EmoteModule extends Builtin {
async initialize() {
super.initialize();
return;
await this.getBlacklist();
await this.loadEmoteData(EmoteInfo);

View File

@ -104,11 +104,11 @@ Core.prototype.initObserver = function () {
if (node.classList.contains("layer-3QrUeG")) {
if (node.getElementsByClassName("guild-settings-base-section").length) node.setAttribute("layer-id", "server-settings");
if (node.getElementsByClassName("socialLinks-3jqNFy").length) {
node.setAttribute("layer-id", "user-settings");
node.setAttribute("id", "user-settings");
if (!document.getElementById("bd-settings-sidebar")) SettingsPanel.renderSidebar();
}
// if (node.getElementsByClassName("socialLinks-3jqNFy").length) {
// node.setAttribute("layer-id", "user-settings");
// node.setAttribute("id", "user-settings");
// if (!document.getElementById("bd-settings-sidebar")) SettingsPanel.renderSidebar();
// }
}
}
});

View File

@ -8,6 +8,7 @@ import WebpackModules from "./webpackmodules";
import {SettingsPanel as SettingsRenderer} from "ui";
import Utilities from "./utilities";
import {Toasts} from "ui";
//WebpackModules.getModule(m => m.getSection && m.getProps && !m.getGuildId && !m.getChannel)
//WebpackModules.getByProps("getGuildId", "getSection")
@ -52,8 +53,8 @@ export default new class SettingsPanel {
console.log(data);
data.returnValue.splice(23, 0, {section: "DIVIDER"});
data.returnValue.splice(24, 0, {section: "HEADER", label: "BandagedBD"});
data.returnValue.splice(25, 0, {section: "IJ1", label: "Injected Tab 1", element: () => this.renderer.core2});
data.returnValue.splice(26, 0, {section: "IJ2", label: "Injected Tab 2", onClick: function() {console.log("CLICK2");}});
data.returnValue.splice(25, 0, {section: "BBD Settings", label: "Settings", element: () => this.renderer.core2});
data.returnValue.splice(26, 0, {section: "BBD Test", label: "Test Tab", onClick: function() {Toasts.success("This can just be a click listener!", {forceShow: true});}});
}});
const viewClass = WebpackModules.getByProps("standardSidebarView").standardSidebarView.split(" ")[0];
const node = document.querySelector(`.${viewClass}`);

View File

@ -0,0 +1,7 @@
import {React} from "modules";
export default class Divider extends React.Component {
render() {
return <div className="bd-divider divider-3573oO marginTop8-1DLZ1n marginBottom40-2vIwTv" />;
}
}

60
src/ui/settings/group.jsx Normal file
View File

@ -0,0 +1,60 @@
import {SettingsCookie} from "data";
import {React, ReactDOM} from "modules";
import Title from "./title";
import Vertical from "./vertical";
import Divider from "./divider";
import Switch from "./switch";
export default class Group extends React.Component {
constructor(props) {
super(props);
this.container = React.createRef();
this.state = {
collapsed: this.props.collapsible && this.props.collapsed
};
}
// render() {
// const {title, settings, button} = this.props;
// const buttonComponent = button ? React.createElement("button", {key: "title-button", className: "bd-pfbtn", onClick: button.onClick}, button.title) : null;
// return [React.createElement(SettingsTitle, {text: title}),
// buttonComponent,
// settings.map(setting => {
// return React.createElement(Switch, {id: setting.id, key: setting.id, data: setting, checked: SettingsCookie[setting.id], onChange: (id, checked) => {
// this.props.onChange(id, checked);
// }});
// })];
// }
collapseGroup() {
if (this.state.collapsed) return this.expandGroup();
const container = ReactDOM.findDOMNode(this.container.current);
// console.log(container.scrollHeight);
container.style.setProperty("height", container.scrollHeight + "px");
this.setState({collapsed: true}, () => setImmediate(() => container.style.setProperty("height", "")));//
}
expandGroup() {
const container = ReactDOM.findDOMNode(this.container.current);
// console.log(container.scrollHeight);
container.style.setProperty("height", container.scrollHeight + "px");
this.setState({collapsed: false}, () => setTimeout(() => container.style.setProperty("height", ""), 300));//, () => container.style.setProperty("height", "")
//, () => container.style.setProperty("height", "")
}
render() {
const {settings} = this.props;
const groupClass = this.state.collapsed ? "bd-settings-group bd-settings-group-collapsed" : "bd-settings-group";
return <div className={groupClass}>
<Title text={this.props.title} collapsible={this.props.collapsible} onClick={() => this.collapseGroup()} />
<Vertical className="bd-settings-container" ref={this.container}>
{settings.map((setting) => {
return <Switch id={setting.id} key={setting.id} name={setting.text} note={setting.info} checked={SettingsCookie[setting.id]} onChange={(id, checked) => {
this.props.onChange(id, checked);
}} />;
})}
</Vertical>
{this.props.showDivider && <Divider />}
</div>;
}
}

View File

@ -1,5 +1,5 @@
import {React} from "modules";
import SettingsGroup from "./settingsgroup";
import SettingsGroup from "./group";
export default class V2C_SectionedSettingsPanel extends React.Component {

View File

@ -13,6 +13,7 @@ import ReloadIcon from "../icons/reload";
import CssEditor from "../customcss/editor";
import SettingsGroup from "../settings/settingsgroup";
import SettingsGroup2 from "../settings/group";
export default class V2_SettingsPanel {
@ -49,6 +50,7 @@ export default class V2_SettingsPanel {
const settings = this.getSettings("core");
const categories = [...new Set(settings.map(s => s.category))];
const sections = categories.map(c => {return {title: c, settings: settings.filter(s => s.category == c)};});
console.log(sections);
return sections;
}
@ -101,7 +103,7 @@ export default class V2_SettingsPanel {
get core2() {
return this.coreSettings.map(section => {
return React.createElement(SettingsGroup, Object.assign({}, section, {onChange: this.onChange}));
return React.createElement(SettingsGroup2, Object.assign({}, section, {onChange: this.onChange}));
});
}

View File

@ -1,61 +1,94 @@
import {React} from "modules";
const flexContainer = "flex-1xMQg5 flex-1O1GKY da-flex da-flex vertical-V37hAW flex-1O1GKY directionColumn-35P_nr justifyStart-2NDFzi alignStretch-DpGPf3 noWrap-3jynv6 switchItem-2hKKKK";
const flexWrap = "flex-1xMQg5 flex-1O1GKY da-flex da-flex horizontal-1ae9ci horizontal-2EEEnY flex-1O1GKY directionRow-3v3tfG justifyStart-2NDFzi alignStart-H-X2h- noWrap-3jynv6";
const flexChild = "flexChild-faoVW3 da-flexChild";
const flexContainer = "flex-1xMQg5 flex-1O1GKY vertical-V37hAW flex-1O1GKY directionColumn-35P_nr justifyStart-2NDFzi alignStretch-DpGPf3 noWrap-3jynv6 switchItem-2hKKKK";
const flexWrap = "flex-1xMQg5 flex-1O1GKY horizontal-1ae9ci horizontal-2EEEnY flex-1O1GKY directionRow-3v3tfG justifyStart-2NDFzi alignStart-H-X2h- noWrap-3jynv6";
const flexChild = "flexChild-faoVW3";
const title = "titleDefault-a8-ZSr title-31JmR4 da-titleDefault da-title";
const switchWrapper = "flexChild-faoVW3 da-flexChild switchEnabled-V2WDBB switch-3wwwcV da-switchEnabled da-switch valueUnchecked-2lU_20 value-2hFrkk sizeDefault-2YlOZr size-3rFEHg themeDefault-24hCdX";
const switchWrapperEnabled = "flexChild-faoVW3 da-flexChild switchEnabled-V2WDBB switch-3wwwcV da-switchEnabled da-switch valueChecked-m-4IJZ value-2hFrkk sizeDefault-2YlOZr size-3rFEHg themeDefault-24hCdX";
const switchClass = "checkboxEnabled-CtinEn checkbox-2tyjJg da-checkboxEnabled da-checkbox";
const description = "description-3_Ncsb formText-3fs7AJ da-description da-formText note-1V3kyJ da-note modeDefault-3a2Ph1 da-modeDefault primary-jw0I4K";
export default class V2C_Switch extends React.Component {
const switchWrapperChecked = "flexChild-faoVW3 da-flexChild switchEnabled-V2WDBB switch-3wwwcV da-switchEnabled da-switch valueChecked-m-4IJZ value-2hFrkk sizeDefault-2YlOZr size-3rFEHg themeDefault-24hCdX";
const switchClass = "checkboxEnabled-CtinEn checkbox-2tyjJg";
const description = "description-3_Ncsb formText-3fs7AJ note-1V3kyJ modeDefault-3a2Ph1 primary-jw0I4K";
const divider = "divider-3573oO dividerDefault-3rvLe-";
export default class Switch extends React.Component {
constructor(props) {
super(props);
this.setInitialState();
this.onChange = this.onChange.bind(this);
}
setInitialState() {
console.log(props);
this.state = {
checked: this.props.checked
};
}
render() {
const {text, info} = this.props.data;
const {checked} = this.state;
return React.createElement(
"div",
{className: `ui-flex flex-vertical flex-justify-start flex-align-stretch flex-nowrap ui-switch-item ${flexContainer}`},
React.createElement(
"div",
{className: `ui-flex flex-horizontal flex-justify-start flex-align-stretch flex-nowrap ${flexWrap}`},
React.createElement(
"h3",
{className: `ui-form-title h3 margin-reset margin-reset ui-flex-child ${title} ${flexChild}`},
text
),
React.createElement(
"div",
{className: `ui-switch-wrapper ui-flex-child ${checked ? switchWrapperEnabled : switchWrapper}`, style: {flex: "0 0 auto"}},
React.createElement("input", {className: `ui-switch-checkbox ${switchClass}`, type: "checkbox", checked: checked, onChange: e => this.onChange(e)}),
React.createElement("div", {className: `ui-switch ${checked ? "checked" : ""}`})
)
),
React.createElement(
"div",
{className: `ui-form-text style-description margin-top-4 ${description}`, style: {flex: "1 1 auto"}},
info
)
);
}
onChange() {
this.props.onChange(this.props.id, !this.state.checked);
this.setState({
checked: !this.state.checked
});
}
render() {
return <div className={flexContainer} style={{flex: "1 1 auto"}}>
<div className={flexWrap} style={{flex: "1 1 auto"}}>
<div className={flexChild} style={{flex: "1 1 auto"}}>
<label htmlFor={this.props.id} className={title}>{this.props.name || this.props.data.text}</label>
</div>
<div className={this.state.checked ? switchWrapperChecked : switchWrapper} tabIndex="0" style={{flex: "0 0 auto"}}>
<input id={this.props.id} className={switchClass} type="checkbox" tabIndex="-1" checked={this.state.checked} onChange={e => this.onChange(e)} />
</div>
</div>
<div className={description} style={{flex: "1 1 auto"}}>{this.props.note || this.props.data.info}</div>
<div className={divider} />
</div>;
}
}
// export default class V2C_Switch extends React.Component {
// constructor(props) {
// super(props);
// this.setInitialState();
// this.onChange = this.onChange.bind(this);
// }
// setInitialState() {
// this.state = {
// checked: this.props.checked
// };
// }
// render() {
// const {text, info} = this.props.data;
// const {checked} = this.state;
// return React.createElement(
// "div",
// {className: `ui-flex flex-vertical flex-justify-start flex-align-stretch flex-nowrap ui-switch-item ${flexContainer}`},
// React.createElement(
// "div",
// {className: `ui-flex flex-horizontal flex-justify-start flex-align-stretch flex-nowrap ${flexWrap}`},
// React.createElement(
// "h3",
// {className: `ui-form-title h3 margin-reset margin-reset ui-flex-child ${title} ${flexChild}`},
// text
// ),
// React.createElement(
// "div",
// {className: `ui-switch-wrapper ui-flex-child ${checked ? switchWrapperChecked : switchWrapper}`, style: {flex: "0 0 auto"}},
// React.createElement("input", {className: `ui-switch-checkbox ${switchClass}`, type: "checkbox", checked: checked, onChange: e => this.onChange(e)}),
// React.createElement("div", {className: `ui-switch ${checked ? "checked" : ""}`})
// )
// ),
// React.createElement(
// "div",
// {className: `ui-form-text style-description margin-top-4 ${description}`, style: {flex: "1 1 auto"}},
// info
// )
// );
// }
// onChange() {
// this.props.onChange(this.props.id, !this.state.checked);
// this.setState({
// checked: !this.state.checked
// });
// }
// }

View File

@ -0,0 +1,17 @@
<h2 class="h2-2gWE-o title-3sZWYQ size16-14cGz5 height20-mO2eIN weightSemiBold-NJexzi da-h2 da-title da-size16 da-height20 da-weightSemiBold defaultColor-1_ajX0 da-defaultColor defaultMarginh2-2LTaUL marginBottom20-32qID7 da-defaultMarginh2 da-marginBottom20">Text &amp; Images</h2>
<div class="vertical-V37hAW flex-1O1GKY directionColumn-35P_nr da-vertical da-flex da-directionColumn">
<h5 class="h5-18_1nd title-3sZWYQ size12-3R0845 height16-2Lv3qA weightSemiBold-NJexzi da-h5 da-title da-size12 da-height16 da-weightSemiBold marginBottom8-AtZOdT da-marginBottom8">Display images, videos, and lolcats</h5>
<div class="flex-1xMQg5 flex-1O1GKY da-flex da-flex vertical-V37hAW flex-1O1GKY directionColumn-35P_nr justifyStart-2NDFzi alignStretch-DpGPf3 noWrap-3jynv6 marginTop8-1DLZ1n da-marginTop8 marginBottom20-32qID7 da-marginBottom20" style="flex: 1 1 auto;">
<div class="flex-1xMQg5 flex-1O1GKY da-flex da-flex horizontal-1ae9ci horizontal-2EEEnY flex-1O1GKY directionRow-3v3tfG justifyStart-2NDFzi alignStart-H-X2h- noWrap-3jynv6" style="flex: 1 1 auto;">
<div class="flexChild-faoVW3 da-flexChild" style="flex: 1 1 auto;">
<label for="100" class="titleDefault-a8-ZSr title-31JmR4 da-titleDefault da-title">When posted as links to chat.</label>
</div>
<div class="flexChild-faoVW3 da-flexChild switchEnabled-V2WDBB switch-3wwwcV da-switchEnabled da-switch valueChecked-m-4IJZ value-2hFrkk sizeDefault-2YlOZr size-3rFEHg themeDefault-24hCdX" tabindex="0" style="flex: 0 0 auto;">
<input id="100" class="checkboxEnabled-CtinEn checkbox-2tyjJg da-checkboxEnabled da-checkbox" type="checkbox" tabindex="-1" checked="">
</div>
</div>
<div class="divider-3573oO da-divider dividerDefault-3rvLe- da-dividerDefault"></div>
</div>
</div>
<div class="divider-3573oO da-divider marginTop8-1DLZ1n da-marginTop8 marginBottom40-2vIwTv da-marginBottom40"></div>

View File

@ -1,14 +1,17 @@
import {React} from "modules";
export default class V2C_SettingsTitle extends React.Component {
const className = "bd-settings-title h2-2gWE-o title-3sZWYQ size16-14cGz5 height20-mO2eIN weightSemiBold-NJexzi defaultColor-1_ajX0 defaultMarginh2-2LTaUL marginBottom20-32qID7";
export default class SettingsTitle extends React.Component {
constructor(props) {
super(props);
}
//h2-2gWE-o title-3sZWYQ size16-14cGz5 height20-mO2eIN weightSemiBold-NJexzi da-h2 da-title da-size16 da-height20 da-weightSemiBold defaultColor-1_ajX0 da-defaultColor marginTop60-3PGbtK da-marginTop60 marginBottom20-32qID7 da-marginBottom20
render() {
const titleClass = this.props.className ? `${className} ${this.props.className}` : className;
return React.createElement(
"h2",
{className: "ui-form-title h2 margin-reset margin-bottom-20 marginTop60-3PGbtK h2-2gWE-o title-3sZWYQ size16-14cGz5 height20-mO2eIN weightSemiBold-NJexzi defaultColor-1_ajX0 defaultMarginh2-2LTaUL marginBottom20-32qID7"},
{className: titleClass, onClick: () => {this.props.onClick && this.props.onClick();}},
this.props.text
);
}

View File

@ -0,0 +1,11 @@
import {React} from "modules";
const className = "bd-vertical-container";
export default class VerticalContainer extends React.Component {
render() {
const containerClass = this.props.className ? `${className} ${this.props.className}` : className;
return <div className={containerClass}>{this.props.children}</div>;
}
}