ags
This commit is contained in:
Lilith
parent
3addca47b2
commit
8ec67f8fad
GPG key ID:
8712A0F317C37175
5 changed files with 0 additions and 329 deletions
|
|
@ -1,108 +0,0 @@
|
|||
|
||||
const { query } = await Service.import("applications")
|
||||
const WINDOW_NAME = "applauncher"
|
||||
|
||||
/** @param {import('resource:///com/github/Aylur/ags/service/applications.js').Application} app */
|
||||
const AppItem = app => Widget.Button({
|
||||
on_clicked: () => {
|
||||
App.closeWindow(WINDOW_NAME)
|
||||
app.launch()
|
||||
},
|
||||
attribute: { app },
|
||||
child: Widget.Box({
|
||||
children: [
|
||||
Widget.Icon({
|
||||
icon: app.icon_name || "",
|
||||
size: 42,
|
||||
}),
|
||||
Widget.Label({
|
||||
class_name: "title",
|
||||
label: app.name,
|
||||
xalign: 0,
|
||||
vpack: "center",
|
||||
truncate: "end",
|
||||
}),
|
||||
],
|
||||
}),
|
||||
})
|
||||
|
||||
const Applauncher = ({ width = 500, height = 500, spacing = 12 }) => {
|
||||
// list of application buttons
|
||||
let applications = query("").map(AppItem)
|
||||
|
||||
// container holding the buttons
|
||||
const list = Widget.Box({
|
||||
vertical: true,
|
||||
children: applications,
|
||||
spacing,
|
||||
})
|
||||
|
||||
// repopulate the box, so the most frequent apps are on top of the list
|
||||
function repopulate() {
|
||||
applications = query("").map(AppItem)
|
||||
list.children = applications
|
||||
}
|
||||
|
||||
// search entry
|
||||
const entry = Widget.Entry({
|
||||
hexpand: true,
|
||||
css: `margin-bottom: ${spacing}px;`,
|
||||
|
||||
// to launch the first item on Enter
|
||||
on_accept: () => {
|
||||
// make sure we only consider visible (searched for) applications
|
||||
const results = applications.filter((item) => item.visible);
|
||||
if (results[0]) {
|
||||
App.toggleWindow(WINDOW_NAME)
|
||||
results[0].attribute.app.launch()
|
||||
}
|
||||
},
|
||||
|
||||
// filter out the list
|
||||
on_change: ({ text }) => applications.forEach(item => {
|
||||
item.visible = item.attribute.app.match(text ?? "")
|
||||
}),
|
||||
})
|
||||
|
||||
return Widget.Box({
|
||||
vertical: true,
|
||||
css: `margin: ${spacing * 2}px;`,
|
||||
children: [
|
||||
entry,
|
||||
|
||||
// wrap the list in a scrollable
|
||||
Widget.Scrollable({
|
||||
hscroll: "never",
|
||||
css: `min-width: ${width}px;`
|
||||
+ `min-height: ${height}px;`,
|
||||
child: list,
|
||||
}),
|
||||
],
|
||||
setup: self => self.hook(App, (_, windowName, visible) => {
|
||||
if (windowName !== WINDOW_NAME)
|
||||
return
|
||||
|
||||
// when the applauncher shows up
|
||||
if (visible) {
|
||||
repopulate()
|
||||
entry.text = ""
|
||||
entry.grab_focus()
|
||||
}
|
||||
}),
|
||||
})
|
||||
}
|
||||
|
||||
// there needs to be only one instance
|
||||
export const applauncher = Widget.Window({
|
||||
name: WINDOW_NAME,
|
||||
setup: self => self.keybind("Escape", () => {
|
||||
App.closeWindow(WINDOW_NAME)
|
||||
}),
|
||||
visible: false,
|
||||
keymode: "exclusive",
|
||||
child: Applauncher({
|
||||
width: 500,
|
||||
height: 500,
|
||||
spacing: 12,
|
||||
}),
|
||||
})
|
||||
|
|
@ -1,5 +0,0 @@
|
|||
import { applauncher } from "./applauncher.js"
|
||||
|
||||
App.config({
|
||||
windows: [applauncher],
|
||||
})
|
||||
|
|
@ -1,154 +0,0 @@
|
|||
|
||||
const mpris = await Service.import("mpris")
|
||||
const players = mpris.bind("players")
|
||||
|
||||
const FALLBACK_ICON = "audio-x-generic-symbolic"
|
||||
const PLAY_ICON = "media-playback-start-symbolic"
|
||||
const PAUSE_ICON = "media-playback-pause-symbolic"
|
||||
const PREV_ICON = "media-skip-backward-symbolic"
|
||||
const NEXT_ICON = "media-skip-forward-symbolic"
|
||||
|
||||
/** @param {number} length */
|
||||
function lengthStr(length) {
|
||||
const min = Math.floor(length / 60)
|
||||
const sec = Math.floor(length % 60)
|
||||
const sec0 = sec < 10 ? "0" : ""
|
||||
return `${min}:${sec0}${sec}`
|
||||
}
|
||||
|
||||
/** @param {import('types/service/mpris').MprisPlayer} player */
|
||||
function Player(player) {
|
||||
const img = Widget.Box({
|
||||
class_name: "img",
|
||||
vpack: "start",
|
||||
css: player.bind("cover_path").transform(p => `
|
||||
background-image: url('${p}');
|
||||
`),
|
||||
})
|
||||
|
||||
const title = Widget.Label({
|
||||
class_name: "title",
|
||||
wrap: true,
|
||||
hpack: "start",
|
||||
label: player.bind("track_title"),
|
||||
})
|
||||
|
||||
const artist = Widget.Label({
|
||||
class_name: "artist",
|
||||
wrap: true,
|
||||
hpack: "start",
|
||||
label: player.bind("track_artists").transform(a => a.join(", ")),
|
||||
})
|
||||
|
||||
const positionSlider = Widget.Slider({
|
||||
class_name: "position",
|
||||
draw_value: false,
|
||||
on_change: ({ value }) => player.position = value * player.length,
|
||||
visible: player.bind("length").as(l => l > 0),
|
||||
setup: self => {
|
||||
function update() {
|
||||
const value = player.position / player.length
|
||||
self.value = value > 0 ? value : 0
|
||||
}
|
||||
self.hook(player, update)
|
||||
self.hook(player, update, "position")
|
||||
self.poll(1000, update)
|
||||
},
|
||||
})
|
||||
|
||||
const positionLabel = Widget.Label({
|
||||
class_name: "position",
|
||||
hpack: "start",
|
||||
setup: self => {
|
||||
const update = (_, time) => {
|
||||
self.label = lengthStr(time || player.position)
|
||||
self.visible = player.length > 0
|
||||
}
|
||||
|
||||
self.hook(player, update, "position")
|
||||
self.poll(1000, update)
|
||||
},
|
||||
})
|
||||
|
||||
const lengthLabel = Widget.Label({
|
||||
class_name: "length",
|
||||
hpack: "end",
|
||||
visible: player.bind("length").transform(l => l > 0),
|
||||
label: player.bind("length").transform(lengthStr),
|
||||
})
|
||||
|
||||
const icon = Widget.Icon({
|
||||
class_name: "icon",
|
||||
hexpand: true,
|
||||
hpack: "end",
|
||||
vpack: "start",
|
||||
tooltip_text: player.identity || "",
|
||||
icon: player.bind("entry").transform(entry => {
|
||||
const name = `${entry}-symbolic`
|
||||
return Utils.lookUpIcon(name) ? name : FALLBACK_ICON
|
||||
}),
|
||||
})
|
||||
|
||||
const playPause = Widget.Button({
|
||||
class_name: "play-pause",
|
||||
on_clicked: () => player.playPause(),
|
||||
visible: player.bind("can_play"),
|
||||
child: Widget.Icon({
|
||||
icon: player.bind("play_back_status").transform(s => {
|
||||
switch (s) {
|
||||
case "Playing": return PAUSE_ICON
|
||||
case "Paused":
|
||||
case "Stopped": return PLAY_ICON
|
||||
}
|
||||
}),
|
||||
}),
|
||||
})
|
||||
|
||||
const prev = Widget.Button({
|
||||
on_clicked: () => player.previous(),
|
||||
visible: player.bind("can_go_prev"),
|
||||
child: Widget.Icon(PREV_ICON),
|
||||
})
|
||||
|
||||
const next = Widget.Button({
|
||||
on_clicked: () => player.next(),
|
||||
visible: player.bind("can_go_next"),
|
||||
child: Widget.Icon(NEXT_ICON),
|
||||
})
|
||||
|
||||
return Widget.Box(
|
||||
{ class_name: "player" },
|
||||
img,
|
||||
Widget.Box(
|
||||
{
|
||||
vertical: true,
|
||||
hexpand: true,
|
||||
},
|
||||
Widget.Box([
|
||||
title,
|
||||
icon,
|
||||
]),
|
||||
artist,
|
||||
Widget.Box({ vexpand: true }),
|
||||
positionSlider,
|
||||
Widget.CenterBox({
|
||||
start_widget: positionLabel,
|
||||
center_widget: Widget.Box([
|
||||
prev,
|
||||
playPause,
|
||||
next,
|
||||
]),
|
||||
end_widget: lengthLabel,
|
||||
}),
|
||||
),
|
||||
)
|
||||
}
|
||||
|
||||
export function Media() {
|
||||
return Widget.Box({
|
||||
vertical: true,
|
||||
css: "min-height: 2px; min-width: 2px;", // small hack to make it visible
|
||||
visible: players.as(p => p.length > 0),
|
||||
children: players.as(p => p.map(Player)),
|
||||
})
|
||||
}
|
||||
|
|
@ -1,12 +0,0 @@
|
|||
import { Media } from "./Media.js"
|
||||
|
||||
const win = Widget.Window({
|
||||
name: "mpris",
|
||||
anchor: ["top", "right"],
|
||||
child: Media(),
|
||||
})
|
||||
|
||||
App.config({
|
||||
style: "./style.css",
|
||||
windows: [win],
|
||||
})
|
||||
|
|
@ -1,50 +0,0 @@
|
|||
|
||||
.player {
|
||||
padding: 10px;
|
||||
min-width: 350px;
|
||||
}
|
||||
|
||||
.player .img {
|
||||
min-width: 100px;
|
||||
min-height: 100px;
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
border-radius: 13px;
|
||||
margin-right: 1em;
|
||||
}
|
||||
|
||||
.player .title {
|
||||
font-size: 1.2em;
|
||||
}
|
||||
|
||||
.player .artist {
|
||||
font-size: 1.1em;
|
||||
color: @insensitive_fg_color;
|
||||
}
|
||||
|
||||
.player scale.position {
|
||||
padding: 0;
|
||||
margin-bottom: .3em;
|
||||
}
|
||||
|
||||
.player scale.position trough {
|
||||
min-height: 8px;
|
||||
}
|
||||
|
||||
.player scale.position highlight {
|
||||
background-color: @theme_fg_color;
|
||||
}
|
||||
|
||||
.player scale.position slider {
|
||||
all: unset;
|
||||
}
|
||||
|
||||
.player button {
|
||||
min-height: 1em;
|
||||
min-width: 1em;
|
||||
padding: .3em;
|
||||
}
|
||||
|
||||
.player button.play-pause {
|
||||
margin: 0 .3em;
|
||||
}
|
||||
Loading…
Add table
Add a link
Reference in a new issue