LESA/custum-hyprpanel
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Styled power menu

Browse Source
This commit is contained in:
Jas Singh
2024-06-09 22:28:07 -07:00
parent d695d9aa67
commit 608137a604
12 changed files with 166 additions and 70 deletions
Download Patch File Download Diff File Expand all files Collapse all files

40
;
View File

@@ -1,40 +0,0 @@
import { exec } from "resource:///com/github/Aylur/ags/utils.js";
import { Bar, BarAlt } from "./modules/bar/bar.js";
import DirectoryMonitorService from "./directoryMonitorService.js";
import MenuWindows from "./modules/menus/main.js";
const applyScss = () => {
// Compile scss
exec(`sass ${App.configDir}/scss/main.scss ${App.configDir}/style.css`);
exec(
`sass ${App.configDir}/scss/highlight.scss ${App.configDir}/highlight.css`,
);
console.log("Scss compiled");
// Apply compiled css
App.resetCss();
App.applyCss(`${App.configDir}/style.css`);
console.log("Compiled css applied");
};
DirectoryMonitorService.connect("changed", () => applyScss());
applyScss();
export default {
style: `${App.configDir}/style.css`,
closeWindowDelay: {
sideright: 350,
launcher: 350,
bar0: 350,
},
};
App.config({
windows: [
...MenuWindows,
Bar(0),
BarAlt(1),
BarAlt(2),
],
});

29
modules/bar/media/index.js
View File

@@ -42,14 +42,22 @@ const Media = () => {
return foundMatch ? foundMatch[1] : "󰝚";
};
const label = Utils.watch("󰎇 Nothing is playing 󰎇", mpris, "player-changed", () => {
const songIcon = Variable("");
const label = Utils.watch(
"󰎇 No media playing 󰎇",
mpris,
"player-changed",
() => {
if (activePlayer.value) {
const { track_title, identity } = activePlayer.value;
return `${getIconForPlayer(identity)} ${track_title}`;
songIcon.value = getIconForPlayer(identity);
return track_title.length === 0 ? ` No media playing...` : ` ${track_title}`;
} else {
return "󰎇 Nothing is playing 󰎇";
return "󰎇 No media playing 󰎇";
}
});
},
);
return {
component: Widget.Box({
@@ -59,12 +67,21 @@ const Media = () => {
on_primary_click: () => mpris.getPlayer("")?.playPause(),
on_scroll_up: () => mpris.getPlayer("")?.next(),
on_scroll_down: () => mpris.getPlayer("")?.previous(),
child: Widget.Label({
child: Widget.Box({
children: [
Widget.Label({
class_name: "bar-media_icon",
label: songIcon.bind("value"),
maxWidthChars: 30,
}),
Widget.Label({
label,
truncate: 'end',
truncate: "end",
wrap: true,
maxWidthChars: 30,
}),
],
}),
}),
}),
isVisible: false,

6
modules/bar/power/index.js
View File

@@ -2,8 +2,7 @@ export const Power = () => {
return {
component: Widget.Box({
child: Widget.Button({
class_name: "powermenu",
on_clicked: () => App.toggleWindow("powermenu"),
class_name: "bar-powermenu",
child: Widget.Label({
class_name: "bar-power_label",
label: "⏻",
@@ -11,5 +10,8 @@ export const Power = () => {
}),
}),
isVisible: true,
props: {
on_clicked: () => App.toggleWindow("powermenu"),
},
};
};

6
modules/bar/workspaces/index.js
View File

@@ -27,12 +27,6 @@ const Workspaces = (monitor = -1, wsMap = {}, ws = 8) => {
label: `${i}`,
setup: (self) =>
self.hook(hyprland, () => {
// console.log(`currentMonitor: ${monitor}`);
console.log(i);
console.log(JSON.stringify(hyprland.getWorkspace(i), null, 2));
if (hyprland.getWorkspace(i)) {
// console.log(`currentMonitor: ${monitor}`);
}
self.toggleClassName(
"active",
hyprland.active.workspace.id === i,

2
modules/menus/PopupWindow.js
View File

@@ -127,7 +127,7 @@ export default ({
name,
class_names: [name, "popup-window"],
setup: w => w.keybind("Escape", () => App.closeWindow(name)),
visible: true,
visible: false,
keymode: "on-demand",
exclusivity,
layer: "top",

6
modules/menus/power/verification.js
View File

@@ -30,14 +30,12 @@ export default () =>
homogeneous: true,
children: [
Widget.Button({
class_name: "verification-button bar-verification_no",
child: Widget.Label("No"),
on_clicked: () => App.toggleWindow("verification"),
setup: (self) =>
self.hook(App, (_, name, visible) => {
if (name === "verification" && visible) self.grab_focus();
}),
}),
Widget.Button({
class_name: "verification-button bar-verification_yes",
child: Widget.Label("Yes"),
on_clicked: powermenu.exec,
}),

3
modules/shared/barItemBox.js
View File

@@ -7,9 +7,10 @@ export const BarItemBox = (child) => {
return child.isVisible;
};
return Widget.Box({
return Widget.Button({
class_name: "bar_item_box_visible",
child: child.component,
visible: computeVisible(),
...child.props
});
};

5
scss/bar/media.scss
View File

@@ -4,3 +4,8 @@
font-size: 1rem;
color: $green;
}
.bar-media_icon {
font-size: 1.3rem;
color: $green;
}

4
scss/bar/power.scss
View File

@@ -4,3 +4,7 @@
color: $red;
margin-right: 2px;
}
.bar-powermenu {
// margin: 8px;
}

62
scss/menus/powermenu.scss
View File

@@ -15,7 +15,8 @@ window#verification .verification {
@include floating-widget;
padding: 7px * 1.6 * 1.5;
min-width: 300px;
min-height: 100px;
min-height: 80px;
font-size: 1.3em;
.text-box {
margin-bottom: $spacing;
@@ -29,6 +30,65 @@ window#verification .verification {
font-size: 1.1em;
}
}
.verification-button {
background: $crust;
padding: 10px 0px;
margin: 5px 25px;
border: 2px solid;
border-color: $crust;
border-radius: $radius;
opacity: 1;
transition: border-color 0.2s ease-in-out;
transition: opacity .3s ease-in-out;
&:hover {
&.bar-verification_yes{
border-color: $green;
transition: border-color 0.2s ease-in-out;
}
&.bar-verification_no {
border-color: $red;
transition: border-color 0.2s ease-in-out;
}
}
&:focus {
&.bar-verification_yes{
border-color: $green;
transition: border-color 0.2s ease-in-out;
}
&.bar-verification_no {
border-color: $red;
transition: border-color 0.2s ease-in-out;
}
}
&:active {
&.bar-verification_yes {
border-color: rgba($green, 0.4);
transition: border-color 0.2s ease-in-out;
}
&.bar-verification_no {
border-color: rgba($red, 0.4);
transition: border-color 0.2s ease-in-out;
}
image {
opacity: .3;
transition: opacity .3s ease-in-out;
}
label {
opacity: .3;
transition: opacity .3s ease-in-out;
}
}
}
.bar-verification_no label {
color: $red;
}
.bar-verification_yes label {
color: $green;
}
}
window#powermenu .powermenu {

57
style.css
View File

@@ -312,6 +312,11 @@ spinner:checked {
color: #a6e3a1;
}
.bar-media_icon {
font-size: 1.3rem;
color: #a6e3a1;
}
.bar-network {
color: #cba6f7;
}
@@ -430,7 +435,8 @@ window#verification .verification {
padding: 20px;
padding: 16.8px;
min-width: 300px;
min-height: 100px;
min-height: 80px;
font-size: 1.3em;
}
window#verification .verification .text-box {
margin-bottom: 12px;
@@ -442,6 +448,55 @@ window#verification .verification .text-box .desc {
color: rgba(146, 120, 182, 0.9);
font-size: 1.1em;
}
window#verification .verification .verification-button {
background: #11111b;
padding: 10px 0px;
margin: 5px 25px;
border: 2px solid;
border-color: #11111b;
border-radius: 11px;
opacity: 1;
transition: border-color 0.2s ease-in-out;
transition: opacity 0.3s ease-in-out;
}
window#verification .verification .verification-button:hover.bar-verification_yes {
border-color: #a6e3a1;
transition: border-color 0.2s ease-in-out;
}
window#verification .verification .verification-button:hover.bar-verification_no {
border-color: #f38ba8;
transition: border-color 0.2s ease-in-out;
}
window#verification .verification .verification-button:focus.bar-verification_yes {
border-color: #a6e3a1;
transition: border-color 0.2s ease-in-out;
}
window#verification .verification .verification-button:focus.bar-verification_no {
border-color: #f38ba8;
transition: border-color 0.2s ease-in-out;
}
window#verification .verification .verification-button:active.bar-verification_yes {
border-color: rgba(166, 227, 161, 0.4);
transition: border-color 0.2s ease-in-out;
}
window#verification .verification .verification-button:active.bar-verification_no {
border-color: rgba(243, 139, 168, 0.4);
transition: border-color 0.2s ease-in-out;
}
window#verification .verification .verification-button:active image {
opacity: 0.3;
transition: opacity 0.3s ease-in-out;
}
window#verification .verification .verification-button:active label {
opacity: 0.3;
transition: opacity 0.3s ease-in-out;
}
window#verification .verification .bar-verification_no label {
color: #f38ba8;
}
window#verification .verification .bar-verification_yes label {
color: #a6e3a1;
}
window#powermenu .powermenu {
margin: 12px;

2
style.css.map
View File

@@ -1 +1 @@
{"version":3,"sourceRoot":"","sources":["scss/main.scss","scss/common/common.scss","scss/colors.scss","scss/common/widget-button.scss","scss/bar/menu.scss","scss/bar/audio.scss","scss/bar/media.scss","scss/bar/network.scss","scss/bar/bluetooth.scss","scss/bar/clock.scss","scss/bar/workspace.scss","scss/bar/window_title.scss","scss/bar/systray.scss","scss/bar/power.scss","scss/bar/bar.scss","scss/menus/powermenu.scss","scss/common/floating-widget.scss"],"names":[],"mappings":"AAAA;EACE;EACA;;;ACFF;EACE;EACA;EACA,kBCFgB;EDGhB;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACI,kBChBW;;ADkBf;EACE,OCnBa;;ADqBf;EACE;EACA;EACA;EACA;;AAGJ;EACE;EACA;EACA,kBC/Be;;;ADmCnB;EACE;EACA;EACA;EACA,OCvCiB;;;AD0CnB;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;AAAA;EAEE;EACA;EACA;EACA;EACA;EACA,kBC9DiB;ED+DjB;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;AAAA;EAEE;EACA,kBC9EgB;;;ADiFlB;AAAA;EAEE;EACA,kBCpFgB;;;ADuFlB;AAAA;AAAA;EAGE,OC1FgB;ED2FhB,kBC7CW;;;ADgDb;AAAA;AAAA;EAGE;EACA,kBCpDW;;;ADuDb;AAAA;AAAA;EAGE;EACA,kBC3DW;;;AD8Db;EACE;EACA;EACA;EACA;EACA,kBChHiB;EDiHjB;EACA;EACA;;;AAGF;EACE,kBC1EW;;;AD6Eb;EACE;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA,kBCvIc;EDwId;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA,kBChKiB;;;ADmKnB;EACE;EACA,kBCxHW;;;AD2Hb;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA,OC1IW;ED2IX,kBCzLgB;ED0LhB;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE,kBC1MgB;ED2MhB,OC5Mc;ED6Md;;;AAGF;EACE;EACA;EACA,kBCjNiB;;;ADoNnB;EACE;IACE;;;AAIJ;EACE;EACA;EACA;;;AAGF;EACE;EACA;;;AE/NF;EACE,YDmCM;EClCN;EACA;EACA;EACA;EACA;EACA;EACA;EACA,cD2BM;EC1BN;EACA;;AAEA;EACE;EACA,cDSO;ECRP;;AAGF;EAEE;EACA,cDEO;;ACCT;EACE;EACA;EACA;EACA;;AAGF;EACE,YApCM;;AAyCN;EACE;EACJ;;AAEE;EACE;EACJ;;;AC/CF;EACE,OFsBK;EErBL;EACA;;;ACFA;EACE;;;AAIJ;EACE;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;;AAIJ;EACE;EACA,OHRM;;;AGWR;EACE,OHZM;;;AIpBR;EACE;EACA,OJoBM;;;AKtBR;EACE,OLgBM;;;AMjBR;EACE;EACA,ONsBI;;;AMnBN;EACE,ONkBI;;;AOxBN;EACE,OPeK;;;AQfL;EACE;EACA;EACA;EACA;EACA;EACA;EACA,kBRmBO;;AQjBP;EACE,kBRQG;EQPH;EACA;;AAGF;EACE,kBROA;EQNA;EACA;;;AAMN;EACE;;;AC1BF;EACE,OTeK;;;AUhBP;EACE;;;AAGF;EACE,YViCO;;;AU/BT;EACE;EACA,OVkBS;;;AUfX;EACE,kBVsBS;;;AUnBX;EACE,kBVmBS;EUlBT;;;AAGF;EACE,kBVKS;;;AW3BX;EACE,OXiBI;EWhBJ;;;ACFF;EACE,YZqCO;EYpCP;EACA;;;AAGF;EACE,YZ6BS;EY5BT;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;;;ACzBF;AAAA;EAGI;;;AAQJ;ECTI;EACA;EACA,kBdiCG;EchCH,OdwCS;EcvCT;EACA;EDMA;EACA;EACA;;AAEA;EACI,eAVE;;AAYF;EACI;;AAGJ;EACI;EACA;;;AAKZ;EC7BI;EACA;EACA,kBdiCG;EchCH,OdwCS;EcvCT;EACA;;AD0BA;EACI;;AAGJ;EACI;;;AAMA;EACI,cb3BN;;Aa6BE;EACI,cb1BJ;;Aa4BA;EACI,cb3BN;;Aa6BE;EACI,cblCJ;;AawCA;EACI;;AAEJ;EACI;;AAEJ;EACI;;AAEJ;EACI;;;AAKR;EACI,Ob1DF;;Aa4DF;EACI,ObzDA;;Aa2DJ;EACI,Ob9DA;;AagEJ;EACI,Ob7DF;;;AakEF;EACI,ObzEF;;Aa2EF;EACI,ObxEA;;Aa0EJ;EACI,Ob7EA;;Aa+EJ;EACI,Ob5EF","file":"style.css"}
{"version":3,"sourceRoot":"","sources":["scss/main.scss","scss/common/common.scss","scss/colors.scss","scss/common/widget-button.scss","scss/bar/menu.scss","scss/bar/audio.scss","scss/bar/media.scss","scss/bar/network.scss","scss/bar/bluetooth.scss","scss/bar/clock.scss","scss/bar/workspace.scss","scss/bar/window_title.scss","scss/bar/systray.scss","scss/bar/power.scss","scss/bar/bar.scss","scss/menus/powermenu.scss","scss/common/floating-widget.scss"],"names":[],"mappings":"AAAA;EACE;EACA;;;ACFF;EACE;EACA;EACA,kBCFgB;EDGhB;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACI,kBChBW;;ADkBf;EACE,OCnBa;;ADqBf;EACE;EACA;EACA;EACA;;AAGJ;EACE;EACA;EACA,kBC/Be;;;ADmCnB;EACE;EACA;EACA;EACA,OCvCiB;;;AD0CnB;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;AAAA;EAEE;EACA;EACA;EACA;EACA;EACA,kBC9DiB;ED+DjB;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;AAAA;EAEE;EACA,kBC9EgB;;;ADiFlB;AAAA;EAEE;EACA,kBCpFgB;;;ADuFlB;AAAA;AAAA;EAGE,OC1FgB;ED2FhB,kBC7CW;;;ADgDb;AAAA;AAAA;EAGE;EACA,kBCpDW;;;ADuDb;AAAA;AAAA;EAGE;EACA,kBC3DW;;;AD8Db;EACE;EACA;EACA;EACA;EACA,kBChHiB;EDiHjB;EACA;EACA;;;AAGF;EACE,kBC1EW;;;AD6Eb;EACE;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA,kBCvIc;EDwId;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA,kBChKiB;;;ADmKnB;EACE;EACA,kBCxHW;;;AD2Hb;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA,OC1IW;ED2IX,kBCzLgB;ED0LhB;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE,kBC1MgB;ED2MhB,OC5Mc;ED6Md;;;AAGF;EACE;EACA;EACA,kBCjNiB;;;ADoNnB;EACE;IACE;;;AAIJ;EACE;EACA;EACA;;;AAGF;EACE;EACA;;;AE/NF;EACE,YDmCM;EClCN;EACA;EACA;EACA;EACA;EACA;EACA;EACA,cD2BM;EC1BN;EACA;;AAEA;EACE;EACA,cDSO;ECRP;;AAGF;EAEE;EACA,cDEO;;ACCT;EACE;EACA;EACA;EACA;;AAGF;EACE,YApCM;;AAyCN;EACE;EACJ;;AAEE;EACE;EACJ;;;AC/CF;EACE,OFsBK;EErBL;EACA;;;ACFA;EACE;;;AAIJ;EACE;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;;AAIJ;EACE;EACA,OHRM;;;AGWR;EACE,OHZM;;;AIpBR;EACE;EACA,OJoBM;;;AIjBR;EACE;EACA,OJeM;;;AKtBR;EACE,OLgBM;;;AMjBR;EACE;EACA,ONsBI;;;AMnBN;EACE,ONkBI;;;AOxBN;EACE,OPeK;;;AQfL;EACE;EACA;EACA;EACA;EACA;EACA;EACA,kBRmBO;;AQjBP;EACE,kBRQG;EQPH;EACA;;AAGF;EACE,kBROA;EQNA;EACA;;;AAMN;EACE;;;AC1BF;EACE,OTeK;;;AUhBP;EACE;;;AAGF;EACE,YViCO;;;AU/BT;EACE;EACA,OVkBS;;;AUfX;EACE,kBVsBS;;;AUnBX;EACE,kBVmBS;EUlBT;;;AAGF;EACE,kBVKS;;;AW3BX;EACE,OXiBI;EWhBJ;;;ACFF;EACE,YZqCO;EYpCP;EACA;;;AAGF;EACE,YZ6BS;EY5BT;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;;;ACzBF;AAAA;EAGI;;;AAQJ;ECTI;EACA;EACA,kBdiCG;EchCH,OdwCS;EcvCT;EACA;EDMA;EACA;EACA;EACA;;AAEA;EACI,eAXE;;AAaF;EACI;;AAGJ;EACI;EACA;;AAIR;EACI,YbOA;EaNA;EACA;EACA;EACA,cbGA;EaFA,eA5BC;EA6BD;EACA;EACA;;AAGI;EACI,cbtBR;EauBQ;;AAEJ;EACI,cb9BV;Ea+BU;;AAIJ;EACI,cbhCR;EaiCQ;;AAEJ;EACI,cbxCV;EayCU;;AAKJ;EACI;EACA;;AAEJ;EACI;EACA;;AAGJ;EACI;EACA;;AAEJ;EACI;EACA;;AAIZ;EACI,OblEF;;AaoEF;EACI,ObjEA;;;AaqER;ECzFI;EACA;EACA,kBdiCG;EchCH,OdwCS;EcvCT;EACA;;ADsFA;EACI;;AAGJ;EACI;;;AAMA;EACI,cbvFN;;AayFE;EACI,cbtFJ;;AawFA;EACI,cbvFN;;AayFE;EACI,cb9FJ;;AaoGA;EACI;;AAEJ;EACI;;AAEJ;EACI;;AAEJ;EACI;;;AAKR;EACI,ObtHF;;AawHF;EACI,ObrHA;;AauHJ;EACI,Ob1HA;;Aa4HJ;EACI,ObzHF;;;Aa8HF;EACI,ObrIF;;AauIF;EACI,ObpIA;;AasIJ;EACI,ObzIA;;Aa2IJ;EACI,ObxIF","file":"style.css"}