Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: re-implement ContextMenu & Menu #2776

Merged
merged 19 commits into from
Feb 8, 2024
Merged

feat: re-implement ContextMenu & Menu #2776

Show file tree
Hide file tree
Changes from 7 commits
Commits
Show all changes
19 commits
Select commit Hold shift + click to select a range
83adfa6
feat: Better ContextMenu
Delusoire Jan 22, 2024
0a12b93
fix: Fixed couple issues
Delusoire Jan 22, 2024
d4a704c
fix: fixing crash when passing non react components as children
Delusoire Jan 22, 2024
de46574
Merge branch 'spicetify:master' into master
Delusoire Jan 22, 2024
3925756
fix: linting
Delusoire Jan 22, 2024
81c7beb
feat: extend functionality for Profile menu
Delusoire Jan 22, 2024
6c1d372
fix: formatting
Delusoire Jan 22, 2024
7ed19b9
feat: onWebpackLoaded hook
Delusoire Jan 22, 2024
0e11d9a
fix(preprocess): get variable names for Menu hook from function signa…
Delusoire Jan 22, 2024
34f6a54
fix: move useContext inside component
Delusoire Jan 22, 2024
15188e2
Merge branch 'spicetify:master' into master
Delusoire Jan 24, 2024
397e15f
Merge branch 'spicetify:master' into master
Delusoire Jan 25, 2024
e35699b
y
Delusoire Feb 2, 2024
aa99ae0
Merge branch 'master' of https://github.com/Delusoire/spicetify-cli
Delusoire Feb 2, 2024
db4ba55
feat(wrapper): added platformLoaded event
Delusoire Feb 3, 2024
bd71ae8
fix: replace callbacks with awaited ephemeral Promises
Delusoire Feb 3, 2024
9887315
Update preprocess.go
Delusoire Feb 5, 2024
d0b624a
feat(wrapper): made `parseProps` more readable
Delusoire Feb 7, 2024
efeb9ce
Merge branch 'master' of https://github.com/Delusoire/spicetify-cli
Delusoire Feb 7, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
59 changes: 33 additions & 26 deletions jsHelper/expFeatures.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -126,32 +126,39 @@
notice.innerText = "Waiting for Spotify to finish loading...";
content.appendChild(notice);

new Spicetify.Menu.Item(
"Experimental features",
false,
() => {
Spicetify.PopupModal.display({
title: "Experimental features",
content,
isLarge: true
});
if (!isFallback) return;

const closeButton = document.querySelector("body > generic-modal button.main-trackCreditsModal-closeBtn");
const modalOverlay = document.querySelector("body > generic-modal > div");

if (closeButton && modalOverlay) {
closeButton.onclick = () => location.reload();
modalOverlay.onclick = e => {
// If clicked on overlay, also reload
if (e.target === modalOverlay) {
location.reload();
}
};
}
},
`<svg xmlns="http://www.w3.org/2000/svg" version="1.0" viewBox="0 0 863 924" width="16" height="16" fill="currentcolor"><g transform="translate(0,924) scale(0.1,-0.1)"><path d="M3725 9160 c-148 -4 -306 -10 -350 -14 -117 -11 -190 -49 -291 -150 -132 -133 -170 -234 -162 -431 7 -163 50 -255 185 -396 l64 -66 -10 -994 c-13 -1268 -15 -1302 -63 -1494 -87 -352 -263 -756 -511 -1172 -111 -186 -705 -1084 -1371 -2073 -537 -797 -585 -882 -607 -1090 -33 -317 39 -586 218 -810 114 -142 229 -235 386 -311 90 -43 116 -51 217 -65 209 -27 723 -33 2725 -33 2278 1 3098 9 3190 32 231 59 482 234 607 423 142 215 195 408 185 674 -9 241 -46 337 -240 634 -53 81 -97 156 -97 167 0 10 -6 19 -13 19 -19 0 -1264 1863 -1621 2424 -166 261 -361 668 -444 928 -42 129 -88 314 -107 428 -20 119 -34 783 -34 1683 l-1 629 80 91 c125 142 170 250 170 408 0 96 -16 162 -61 255 -74 152 -221 264 -371 284 -182 25 -1072 35 -1673 20z m1574 -388 c89 -20 141 -84 141 -172 0 -47 -5 -64 -30 -98 -16 -23 -38 -46 -50 -52 -45 -24 -311 -33 -985 -33 -764 0 -958 8 -1004 44 -42 33 -71 89 -71 138 0 56 34 127 69 145 30 16 151 35 256 40 159 7 1633 -3 1674 -12z m-116 -839 c11 -175 18 -570 27 -1378 9 -824 10 -825 70 -1066 81 -320 193 -597 398 -984 178 -337 326 -569 1065 -1663 186 -277 337 -505 335 -508 -3 -2 -1223 -3 -2712 -2 l-2707 3 82 120 c45 66 290 431 544 810 437 654 626 953 779 1233 229 416 404 893 445 1207 21 158 31 532 31 1175 0 360 3 766 7 902 l6 247 126 4 c69 1 435 4 812 5 l686 2 6 -107z"/></g></svg>`
).register();
const addMenu = () =>
new Spicetify.Menu.Item(
"Experimental features",
true,
() => {
Spicetify.PopupModal.display({
title: "Experimental features",
content,
isLarge: true
});
if (!isFallback) return;

const closeButton = document.querySelector("body > generic-modal button.main-trackCreditsModal-closeBtn");
const modalOverlay = document.querySelector("body > generic-modal > div");

if (closeButton && modalOverlay) {
closeButton.onclick = () => location.reload();
modalOverlay.onclick = e => {
// If clicked on overlay, also reload
if (e.target === modalOverlay) {
location.reload();
}
};
}
},
`<svg xmlns="http://www.w3.org/2000/svg" version="1.0" viewBox="0 0 863 924" width="16" height="16" fill="currentcolor"><g transform="translate(0,924) scale(0.1,-0.1)"><path d="M3725 9160 c-148 -4 -306 -10 -350 -14 -117 -11 -190 -49 -291 -150 -132 -133 -170 -234 -162 -431 7 -163 50 -255 185 -396 l64 -66 -10 -994 c-13 -1268 -15 -1302 -63 -1494 -87 -352 -263 -756 -511 -1172 -111 -186 -705 -1084 -1371 -2073 -537 -797 -585 -882 -607 -1090 -33 -317 39 -586 218 -810 114 -142 229 -235 386 -311 90 -43 116 -51 217 -65 209 -27 723 -33 2725 -33 2278 1 3098 9 3190 32 231 59 482 234 607 423 142 215 195 408 185 674 -9 241 -46 337 -240 634 -53 81 -97 156 -97 167 0 10 -6 19 -13 19 -19 0 -1264 1863 -1621 2424 -166 261 -361 668 -444 928 -42 129 -88 314 -107 428 -20 119 -34 783 -34 1683 l-1 629 80 91 c125 142 170 250 170 408 0 96 -16 162 -61 255 -74 152 -221 264 -371 284 -182 25 -1072 35 -1673 20z m1574 -388 c89 -20 141 -84 141 -172 0 -47 -5 -64 -30 -98 -16 -23 -38 -46 -50 -52 -45 -24 -311 -33 -985 -33 -764 0 -958 8 -1004 44 -42 33 -71 89 -71 138 0 56 34 127 69 145 30 16 151 35 256 40 159 7 1633 -3 1674 -12z m-116 -839 c11 -175 18 -570 27 -1378 9 -824 10 -825 70 -1066 81 -320 193 -597 398 -984 178 -337 326 -569 1065 -1663 186 -277 337 -505 335 -508 -3 -2 -1223 -3 -2712 -2 l-2707 3 82 120 c45 66 290 431 544 810 437 654 626 953 779 1233 229 416 404 893 445 1207 21 158 31 532 31 1175 0 360 3 766 7 902 l6 247 126 4 c69 1 435 4 812 5 l686 2 6 -107z"/></g></svg>`
).register();

if (Spicetify.React) {
addMenu();
} else {
document.addEventListener("webpack-loaded", addMenu);
}

(function waitForRemoteConfigResolver() {
// Don't show options if hooks aren't patched/loaded
Expand Down
38 changes: 23 additions & 15 deletions jsHelper/homeConfig.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -163,35 +163,43 @@ SpicetifyHomeConfig = {};
}
}

const menu = new Spicetify.Menu.Item("Home config", false, self => {
self.isEnabled = !self.isEnabled;
if (self.isEnabled) {
injectInteraction();
} else {
removeInteraction();
}
});
SpicetifyHomeConfig.addToMenu = () => menu.register();
SpicetifyHomeConfig.removeMenu = () => {
menu.isEnabled = false;
menu.deregister();
const addMenu = () => {
const menu = new Spicetify.Menu.Item("Home config", true, self => {
self.isEnabled = !self.isEnabled;
if (self.isEnabled) {
injectInteraction();
} else {
removeInteraction();
}
});
SpicetifyHomeConfig.addToMenu = () => menu.register();
SpicetifyHomeConfig.removeMenu = () => {
menu.isEnabled = false;
menu.deregister();
};
};

if (Spicetify.React) {
addMenu();
} else {
document.addEventListener("webpack-loaded", addMenu);
}

(function waitForHistoryAPI() {
if (!Spicetify.Platform?.History || !mounted) {
setTimeout(waitForHistoryAPI, 100);
return;
}
// Init
if (Spicetify.Platform.History.location.pathname === "/") {
SpicetifyHomeConfig.addToMenu();
SpicetifyHomeConfig.addToMenu?.();
}

Spicetify.Platform.History.listen(({ pathname }) => {
if (pathname === "/") {
SpicetifyHomeConfig.addToMenu();
SpicetifyHomeConfig.addToMenu?.();
} else {
SpicetifyHomeConfig.removeMenu();
SpicetifyHomeConfig.removeMenu?.();
}
});
})();
Expand Down
41 changes: 20 additions & 21 deletions jsHelper/sidebarConfig.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -169,24 +169,27 @@ color: var(--spice-button-disabled);
writeStorage();
}

const sidebarConfigItem = new Spicetify.Menu.Item(
"Sidebar config",
false,
self => {
self.isEnabled = !self.isEnabled;
if (self.isEnabled) {
injectInteraction();
} else {
removeInteraction();
}
},
`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" width="16px" height="16px" fill="currentcolor"><path d="M44.7,11L36,19.6c0,0-2.6,0-5.2-2.6s-2.6-5.2-2.6-5.2l8.7-8.7c-4.9-1.2-10.8,0.4-14.4,4c-5.4,5.4-0.6,12.3-2,13.7C12.9,28.7,5.1,34.7,4.9,35c-2.3,2.3-2.4,6-0.2,8.2c2.2,2.2,5.9,2.1,8.2-0.2c0.3-0.3,6.7-8.4,14.2-15.9c1.4-1.4,8,3.7,13.6-1.8C44.2,21.7,45.9,15.9,44.7,11z M9.4,41.1c-1.4,0-2.5-1.1-2.5-2.5C6.9,37.1,8,36,9.4,36c1.4,0,2.5,1.1,2.5,2.5C11.9,39.9,10.8,41.1,9.4,41.1z"/></svg>`
);

function finishInit() {
if (initialized) return;
sidebarConfigItem.register();
const addMenu = () => {
new Spicetify.Menu.Item(
"Sidebar config",
true,
self => {
self.isEnabled = !self.isEnabled;
if (self.isEnabled) {
injectInteraction();
} else {
removeInteraction();
}
},
`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" width="16px" height="16px" fill="currentcolor"><path d="M44.7,11L36,19.6c0,0-2.6,0-5.2-2.6s-2.6-5.2-2.6-5.2l8.7-8.7c-4.9-1.2-10.8,0.4-14.4,4c-5.4,5.4-0.6,12.3-2,13.7C12.9,28.7,5.1,34.7,4.9,35c-2.3,2.3-2.4,6-0.2,8.2c2.2,2.2,5.9,2.1,8.2-0.2c0.3-0.3,6.7-8.4,14.2-15.9c1.4-1.4,8,3.7,13.6-1.8C44.2,21.7,45.9,15.9,44.7,11z M9.4,41.1c-1.4,0-2.5-1.1-2.5-2.5C6.9,37.1,8,36,9.4,36c1.4,0,2.5,1.1,2.5,2.5C11.9,39.9,10.8,41.1,9.4,41.1z"/></svg>`
).register();
initialized = true;
};

if (Spicetify.React) {
addMenu();
} else {
document.addEventListener("webpack-loaded", addMenu);
}

function InitSidebarConfig() {
Expand Down Expand Up @@ -254,8 +257,6 @@ color: var(--spice-button-disabled);

arrangeItems(storage);
appendItems();

finishInit();
}

function InitSidebarXConfig() {
Expand Down Expand Up @@ -309,8 +310,6 @@ color: var(--spice-button-disabled);

arrangeItems(storage);
appendItems();

finishInit();
}

InitSidebarConfig();
Expand Down
Loading