matt1432/nixos-configs
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

refactor(ags notifs): clarify code

Browse source
This commit is contained in:
matt1432 2023-11-01 15:29:47 -04:00
parent 0f02a0494e
commit b5f16fcfcb
4 changed files with 53 additions and 57 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
devices/wim/config/ags/js/media-player/gesture.js
View file

@ -38,7 +38,7 @@ export default ({
const playerBox = overlay.list().at(-1);
// Sliding right
// Slide right
if (offset >= 0) {
playerBox.setStyle(`
margin-left: ${offset}px;
@ -47,7 +47,7 @@ export default ({
`);
}
// Sliding left
// Slide left
else {
offset = Math.abs(offset);
playerBox.setStyle(`

6
devices/wim/config/ags/js/notifications/center.js
View file

@ -12,13 +12,13 @@ const ClearButton = () => EventBox({
child: Button({
onPrimaryClickRelease: button => {
button._popups.children.forEach(ch => {
ch.child.setStyle(ch.child._leftAnim1);
ch.child.setStyle(ch.child._slideLeft);
ch.sensitive = false;
});
button._notifList.children.forEach(ch => {
if (ch.child) {
ch.child.setStyle(ch.child._rightAnim1);
ch.child.setStyle(ch.child._slideRight);
ch.sensitive = false;
}
timeout(500, () => {
@ -94,7 +94,7 @@ const NotificationList = Box({
[Notifications, (box, id) => {
for (const ch of box.children) {
if (ch._id == id) {
ch.child.setStyle(ch.child._rightAnim1);
ch.child.setStyle(ch.child._slideRight);
ch.sensitive = false;
timeout(500, () => box.remove(ch));
return;

98
devices/wim/config/ags/js/notifications/gesture.js
View file

@ -36,52 +36,55 @@ export default ({
const gesture = Gtk.GestureDrag.new(widget);
const leftAnim1 = `transition: margin 0.5s ease, opacity 0.5s ease;
margin-left: -${Number(maxOffset + endMargin)}px;
margin-right: ${Number(maxOffset + endMargin)}px;
opacity: 0;`;
const TRANSITION = 'transition: margin 0.5s ease, opacity 0.5s ease;';
const SQUEEZED = 'margin-bottom: -70px; margin-top: -70px;';
const MAX_LEFT = `
margin-left: -${Number(maxOffset + endMargin)}px;
margin-right: ${Number(maxOffset + endMargin)}px;
`;
const MAX_RIGHT = `
margin-left: ${Number(maxOffset + endMargin)}px;
margin-right: -${Number(maxOffset + endMargin)}px;
`;
const leftAnim2 = `transition: margin 0.5s ease, opacity 0.5s ease;
margin-left: -${Number(maxOffset + endMargin)}px;
margin-right: ${Number(maxOffset + endMargin)}px;
margin-bottom: -70px; margin-top: -70px; opacity: 0;`;
const rightAnim1 = `transition: margin 0.5s ease, opacity 0.5s ease;
margin-left: ${Number(maxOffset + endMargin)}px;
margin-right: -${Number(maxOffset + endMargin)}px;
opacity: 0;`;
const rightAnim2 = `transition: margin 0.5s ease, opacity 0.5s ease;
margin-left: ${Number(maxOffset + endMargin)}px;
margin-right: -${Number(maxOffset + endMargin)}px;
margin-bottom: -70px; margin-top: -70px; opacity: 0;`;
const slideLeft = `${TRANSITION} ${MAX_LEFT} opacity: 0;`;
const squeezeLeft = `${TRANSITION} ${MAX_LEFT} ${SQUEEZED} opacity: 0;`;
const slideRight = `${TRANSITION} ${MAX_RIGHT} opacity: 0;`;
const squeezeRight = `${TRANSITION} ${MAX_RIGHT} ${SQUEEZED} opacity: 0;`;
widget.add(Box({
properties: [
['leftAnim1', leftAnim1],
['leftAnim2', leftAnim2],
['rightAnim1', rightAnim1],
['rightAnim2', rightAnim2],
['slideLeft', slideLeft],
['squeezeLeft', squeezeLeft],
['slideRight', slideRight],
['squeezeRight', squeezeRight],
['ready', false],
],
children: [
...children,
child,
],
style: leftAnim2,
style: squeezeLeft,
connections: [
[gesture, self => {
var offset = gesture.get_offset()[1];
// Slide right
if (offset >= 0) {
self.setStyle(`margin-left: ${Number(offset + startMargin)}px;
margin-right: -${Number(offset + startMargin)}px;`);
self.setStyle(`
margin-left: ${Number(offset + startMargin)}px;
margin-right: -${Number(offset + startMargin)}px;
`);
}
// Slide left
else {
offset = Math.abs(offset);
self.setStyle(`margin-right: ${Number(offset + startMargin)}px;
margin-left: -${Number(offset + startMargin)}px;`);
self.setStyle(`
margin-right: ${Number(offset + startMargin)}px;
margin-left: -${Number(offset + startMargin)}px;
`);
}
self.get_parent()._dragging = Math.abs(offset) > 10;
@ -91,51 +94,44 @@ export default ({
}, 'drag-update'],
[gesture, self => {
// ?
if (!self._ready) {
self.setStyle(`transition: margin 0.5s ease, opacity 0.5s ease;
margin-left: -${Number(maxOffset + endMargin)}px;
margin-right: ${Number(maxOffset + endMargin)}px;
margin-bottom: 0px; margin-top: 0px; opacity: 0;`);
self.setStyle(slideLeft);
timeout(500, () => {
self.setStyle(`transition: margin 0.5s ease, opacity 0.5s ease;
margin-left: ${startMargin}px;
margin-right: ${startMargin}px;
margin-bottom: unset; margin-top: unset;
opacity: 1;`);
});
timeout(500, () => self.setStyle(`${TRANSITION} margin: unset; opacity: 1;`));
timeout(1000, () => self._ready = true);
return;
}
const offset = gesture.get_offset()[1];
// If crosses threshold after letting go, slide away
if (Math.abs(offset) > maxOffset) {
// Slide away right
if (offset > 0) {
self.setStyle(rightAnim1);
// Disable inputs during animation
widget.sensitive = false;
timeout(500, () => {
self.setStyle(rightAnim2);
});
self.setStyle(slideRight);
timeout(500, () => self.setStyle(squeezeRight));
}
// Slide away left
else {
self.setStyle(leftAnim1);
// Disable inputs during animation
widget.sensitive = false;
timeout(500, () => {
self.setStyle(leftAnim2);
});
self.setStyle(slideLeft);
timeout(500, () => self.setStyle(squeezeLeft));
}
timeout(1000, () => {
command();
self.destroy();
});
}
else {
self.setStyle(`transition: margin 0.5s ease, opacity 0.5s ease;
margin-left: ${startMargin}px;
margin-right: ${startMargin}px;
margin-bottom: unset; margin-top: unset;
opacity: 1;`);
self.setStyle(`${TRANSITION} margin: unset; opacity: 1;`);
if (widget.window)
widget.window.set_cursor(Gdk.Cursor.new_from_name(display, 'grab'));

2
devices/wim/config/ags/js/notifications/popup.js
View file

@ -53,7 +53,7 @@ const Popups = () => Box({
box._map.get(id).interval = interval(4500, () => {
const notif = box._map.get(id);
if (!notif._hovered) {
notif.child.setStyle(notif.child._leftAnim1);
notif.child.setStyle(notif.child._slideLeft);
if (notif.interval) {
timeout(500, () => notif.destroy());