This commit is contained in:
Mirco Wittrien 2021-08-27 13:42:55 +02:00
parent d6c51a5c66
commit 8f0758d9c2
2 changed files with 20 additions and 16 deletions

View File

@ -1083,10 +1083,10 @@ img:not([src]), img[src=""], img[src="null"] {
z-index: 1; z-index: 1;
} }
[REPLACE_CLASS_popoutarrowtop] { [REPLACE_CLASS_popoutarrowtop] {
margin-top: -16px; margin-bottom: 8px;
} }
[REPLACE_CLASS_popoutarrowbottom] { [REPLACE_CLASS_popoutarrowbottom] {
margin-top: 16px; margin-top: 8px;
} }
[REPLACE_CLASS_popoutarrowtop]::before { [REPLACE_CLASS_popoutarrowtop]::before {
border-bottom-color: transparent; border-bottom-color: transparent;

View File

@ -2,7 +2,7 @@
* @name SpotifyControls * @name SpotifyControls
* @author DevilBro * @author DevilBro
* @authorId 278543574059057154 * @authorId 278543574059057154
* @version 1.2.2 * @version 1.2.3
* @description Adds a Control Panel while listening to Spotify on a connected Account * @description Adds a Control Panel while listening to Spotify on a connected Account
* @invite Jx3TjNS * @invite Jx3TjNS
* @donate https://www.paypal.me/MircoWittrien * @donate https://www.paypal.me/MircoWittrien
@ -17,12 +17,12 @@ module.exports = (_ => {
"info": { "info": {
"name": "SpotifyControls", "name": "SpotifyControls",
"author": "DevilBro", "author": "DevilBro",
"version": "1.2.2", "version": "1.2.3",
"description": "Adds a Control Panel while listening to Spotify on a connected Account" "description": "Adds a Control Panel while listening to Spotify on a connected Account"
}, },
"changeLog": { "changeLog": {
"improved": { "fixed": {
"Ordder": "Spotify Controls Panel will always be the first panel above account details/voice connection state/listen alongs" "Volume Popout": "No longer closes after a second"
} }
} }
}; };
@ -144,7 +144,6 @@ module.exports = (_ => {
} }
if (!lastSong) return null; if (!lastSong) return null;
let playerSize = this.props.maximized ? "big" : "small";
let coverSrc = BDFDB.LibraryModules.AssetUtils.getAssetImage(lastSong.application_id, lastSong.assets.large_image); let coverSrc = BDFDB.LibraryModules.AssetUtils.getAssetImage(lastSong.application_id, lastSong.assets.large_image);
let connection = (BDFDB.LibraryModules.ConnectionStore.getAccounts().find(n => n.type == "spotify") || {}); let connection = (BDFDB.LibraryModules.ConnectionStore.getAccounts().find(n => n.type == "spotify") || {});
showActivity = showActivity != undefined ? showActivity : (connection.show_activity || connection.showActivity); showActivity = showActivity != undefined ? showActivity : (connection.show_activity || connection.showActivity);
@ -225,7 +224,7 @@ module.exports = (_ => {
children: [ children: [
BDFDB.ReactUtils.createElement(SpotifyControlsButtonComponent, { BDFDB.ReactUtils.createElement(SpotifyControlsButtonComponent, {
type: "share", type: "share",
playerSize: playerSize, player: this,
style: this.props.maximized ? {marginRight: 4} : {}, style: this.props.maximized ? {marginRight: 4} : {},
onClick: _ => { onClick: _ => {
let url = BDFDB.ObjectUtils.get(playbackState, "item.external_urls.spotify") || BDFDB.ObjectUtils.get(playbackState, "context.external_urls.spotify"); let url = BDFDB.ObjectUtils.get(playbackState, "item.external_urls.spotify") || BDFDB.ObjectUtils.get(playbackState, "context.external_urls.spotify");
@ -238,7 +237,7 @@ module.exports = (_ => {
}), }),
BDFDB.ReactUtils.createElement(SpotifyControlsButtonComponent, { BDFDB.ReactUtils.createElement(SpotifyControlsButtonComponent, {
type: "shuffle", type: "shuffle",
playerSize: playerSize, player: this,
active: playbackState.shuffle_state, active: playbackState.shuffle_state,
disabled: socketDevice.device.is_restricted, disabled: socketDevice.device.is_restricted,
onClick: _ => { onClick: _ => {
@ -251,7 +250,7 @@ module.exports = (_ => {
}), }),
BDFDB.ReactUtils.createElement(SpotifyControlsButtonComponent, { BDFDB.ReactUtils.createElement(SpotifyControlsButtonComponent, {
type: "previous", type: "previous",
playerSize: playerSize, player: this,
disabled: socketDevice.device.is_restricted, disabled: socketDevice.device.is_restricted,
onClick: _ => { onClick: _ => {
if (previousIsClicked || !_this.settings.general.doubleBack) { if (previousIsClicked || !_this.settings.general.doubleBack) {
@ -271,7 +270,7 @@ module.exports = (_ => {
}), }),
BDFDB.ReactUtils.createElement(SpotifyControlsButtonComponent, { BDFDB.ReactUtils.createElement(SpotifyControlsButtonComponent, {
type: "pauseplay", type: "pauseplay",
playerSize: playerSize, player: this,
icon: this.props.song ? 0 : 1, icon: this.props.song ? 0 : 1,
disabled: socketDevice.device.is_restricted, disabled: socketDevice.device.is_restricted,
onClick: _ => { onClick: _ => {
@ -287,7 +286,7 @@ module.exports = (_ => {
}), }),
BDFDB.ReactUtils.createElement(SpotifyControlsButtonComponent, { BDFDB.ReactUtils.createElement(SpotifyControlsButtonComponent, {
type: "next", type: "next",
playerSize: playerSize, player: this,
disabled: socketDevice.device.is_restricted, disabled: socketDevice.device.is_restricted,
onClick: _ => { onClick: _ => {
this.request(socketDevice.socket, socketDevice.device, "next"); this.request(socketDevice.socket, socketDevice.device, "next");
@ -295,7 +294,7 @@ module.exports = (_ => {
}), }),
BDFDB.ReactUtils.createElement(SpotifyControlsButtonComponent, { BDFDB.ReactUtils.createElement(SpotifyControlsButtonComponent, {
type: "repeat", type: "repeat",
playerSize: playerSize, player: this,
icon: playbackState.repeat_state != repeatStates[2] ? 0 : 1, icon: playbackState.repeat_state != repeatStates[2] ? 0 : 1,
active: playbackState.repeat_state != repeatStates[0], active: playbackState.repeat_state != repeatStates[0],
disabled: socketDevice.device.is_restricted, disabled: socketDevice.device.is_restricted,
@ -309,7 +308,7 @@ module.exports = (_ => {
}), }),
BDFDB.ReactUtils.createElement(SpotifyControlsButtonComponent, { BDFDB.ReactUtils.createElement(SpotifyControlsButtonComponent, {
type: "volume", type: "volume",
playerSize: playerSize, player: this,
icon: Math.ceil(currentVolume/34), icon: Math.ceil(currentVolume/34),
disabled: socketDevice.device.is_restricted, disabled: socketDevice.device.is_restricted,
style: this.props.maximized ? {marginLeft: 4} : {}, style: this.props.maximized ? {marginLeft: 4} : {},
@ -370,7 +369,8 @@ module.exports = (_ => {
}; };
const SpotifyControlsButtonComponent = class SpotifyControlsButton extends BdApi.React.Component { const SpotifyControlsButtonComponent = class SpotifyControlsButton extends BdApi.React.Component {
render() { render() {
if (!this.props.playerSize || !_this.settings.buttons[this.props.type] || !_this.settings.buttons[this.props.type][this.props.playerSize]) return null; let playerSize = this.props.player.props.maximized ? "big" : "small";
if (!playerSize || !_this.settings.buttons[this.props.type] || !_this.settings.buttons[this.props.type][playerSize]) return null;
let button = BDFDB.ReactUtils.createElement(BDFDB.LibraryComponents.Button, BDFDB.ObjectUtils.exclude(Object.assign({}, this.props, { let button = BDFDB.ReactUtils.createElement(BDFDB.LibraryComponents.Button, BDFDB.ObjectUtils.exclude(Object.assign({}, this.props, {
className: BDFDB.DOMUtils.formatClassName(BDFDB.disCN.accountinfobutton, this.props.disabled ? BDFDB.disCN.accountinfobuttondisabled : BDFDB.disCN.accountinfobuttonenabled, this.props.active && BDFDB.disCN._spotifycontrolsbuttonactive), className: BDFDB.DOMUtils.formatClassName(BDFDB.disCN.accountinfobutton, this.props.disabled ? BDFDB.disCN.accountinfobuttondisabled : BDFDB.disCN.accountinfobuttonenabled, this.props.active && BDFDB.disCN._spotifycontrolsbuttonactive),
look: BDFDB.LibraryComponents.Button.Looks.BLANK, look: BDFDB.LibraryComponents.Button.Looks.BLANK,
@ -378,13 +378,16 @@ module.exports = (_ => {
children: _this.defaults.buttons[this.props.type] && _this.defaults.buttons[this.props.type].icons ? (_this.defaults.buttons[this.props.type].icons[this.props.icon] || _this.defaults.buttons[this.props.type].icons[0]) : "?", children: _this.defaults.buttons[this.props.type] && _this.defaults.buttons[this.props.type].icons ? (_this.defaults.buttons[this.props.type].icons[this.props.icon] || _this.defaults.buttons[this.props.type].icons[0]) : "?",
onClick: this.props.disabled ? _ => {} : this.props.onClick, onClick: this.props.disabled ? _ => {} : this.props.onClick,
onContextMenu: this.props.disabled ? _ => {} : this.props.onContextMenu, onContextMenu: this.props.disabled ? _ => {} : this.props.onContextMenu,
}), "active", "disabled", "renderPopout", "icon", "type", "playerSize")); }), "active", "disabled", "renderPopout", "icon", "type"));
return !this.props.disabled && typeof this.props.renderPopout == "function" ? BDFDB.ReactUtils.createElement(BDFDB.LibraryComponents.PopoutContainer, { return !this.props.disabled && typeof this.props.renderPopout == "function" ? BDFDB.ReactUtils.createElement(BDFDB.LibraryComponents.PopoutContainer, {
children: button, children: button,
animation: BDFDB.LibraryComponents.PopoutContainer.Animation.SCALE, animation: BDFDB.LibraryComponents.PopoutContainer.Animation.SCALE,
position: BDFDB.LibraryComponents.PopoutContainer.Positions.TOP, position: BDFDB.LibraryComponents.PopoutContainer.Positions.TOP,
align: BDFDB.LibraryComponents.PopoutContainer.Align.CENTER, align: BDFDB.LibraryComponents.PopoutContainer.Align.CENTER,
arrow: true, arrow: true,
open: this.props.player.props.buttonStates.indexOf(this.props.type) > -1,
onOpen: _ => this.props.player.props.buttonStates.push(this.props.type),
onClose: _ => BDFDB.ArrayUtils.remove(this.props.player.props.buttonStates, this.props.type, true),
renderPopout: this.props.renderPopout renderPopout: this.props.renderPopout
}) : button; }) : button;
} }
@ -803,6 +806,7 @@ module.exports = (_ => {
key: "SPOTIFY_CONTROLS", key: "SPOTIFY_CONTROLS",
song: BDFDB.LibraryModules.SpotifyTrackUtils.getActivity(false), song: BDFDB.LibraryModules.SpotifyTrackUtils.getActivity(false),
maximized: BDFDB.DataUtils.load(this, "playerState", "maximized"), maximized: BDFDB.DataUtils.load(this, "playerState", "maximized"),
buttonStates: [],
timeline: this.settings.general.addTimeline, timeline: this.settings.general.addTimeline,
activityToggle: this.settings.general.addActivityButton activityToggle: this.settings.general.addActivityButton
}, true), }, true),