Skip to content

Commit 105f259

Browse files
authored
Merge pull request #709 from itscrystalline/vertical-lyrics-fetch
feat(lyrics-fetch): vertical lyrics display
2 parents f7c929d + 54f1885 commit 105f259

4 files changed

Lines changed: 151 additions & 58 deletions

File tree

lyrics-fetch/BarWidget.qml

Lines changed: 106 additions & 49 deletions
Original file line numberDiff line numberDiff line change
@@ -28,18 +28,26 @@ Item {
2828
property bool hideWhenEmpty: pluginApi?.pluginSettings?.hideWhenEmpty ?? true
2929
property string customFontFamily: pluginApi?.pluginSettings?.fontFamily ?? Settings.data.ui.fontDefault
3030
property bool adaptScrollSpeed: pluginApi?.pluginSettings?.adaptScrollSpeed ?? true
31+
property string verticalRotationDirectionSetting: pluginApi?.pluginSettings?.verticalRotationDirection ?? "auto"
32+
property string verticalRotationDirection: {
33+
if (verticalRotationDirectionSetting === "cw" || verticalRotationDirectionSetting === "ccw")
34+
return verticalRotationDirectionSetting;
35+
return barPosition === "left" ? "cw" : "ccw";
36+
}
3137

3238
visible: !hideWhenEmpty || (lyricText !== "No Lyrics" && lyricText !== "")
3339

3440
property bool hovered: false
3541
property real scaling: 1.0
3642

3743
readonly property int iconSize: Math.round(18 * scaling)
38-
readonly property int verticalSize: Math.round((Style.baseWidgetSize - 5) * scaling)
39-
readonly property bool isVertical: Settings.data.bar.position === "left" || Settings.data.bar.position === "right"
44+
readonly property string barPosition: Settings.data.bar.position
45+
readonly property bool isVertical: barPosition === "left" || barPosition === "right"
46+
readonly property string verticalTooltipSide: barPosition === "left" ? "right" : "left"
47+
readonly property real capsuleThickness: Style.capsuleHeight
4048

41-
implicitWidth: visible ? (isVertical ? verticalSize : container.width) : 0
42-
implicitHeight: visible ? (isVertical ? verticalSize : Style.capsuleHeight) : 0
49+
implicitWidth: visible ? (isVertical ? capsuleThickness : container.width) : 0
50+
implicitHeight: visible ? (isVertical ? container.height : Style.capsuleHeight) : 0
4351

4452
Behavior on implicitWidth {
4553
NumberAnimation {
@@ -59,8 +67,8 @@ Item {
5967
anchors.left: parent.left
6068
anchors.verticalCenter: parent.verticalCenter
6169

62-
width: isVertical ? verticalSize : root.lyricText === "" ? iconSize + Style.marginS : root.widgetWidth
63-
height: isVertical ? verticalSize : Style.capsuleHeight
70+
width: isVertical ? capsuleThickness : root.lyricText === "" ? iconSize + Style.marginS : root.widgetWidth
71+
height: isVertical ? (root.lyricText === "" ? iconSize + Style.marginS : root.widgetWidth) : Style.capsuleHeight
6472

6573
radius: Style.radiusM
6674
color: Style.capsuleColor
@@ -81,54 +89,90 @@ Item {
8189
}
8290
}
8391

84-
RowLayout {
92+
Item {
93+
id: contentWrapper
8594
anchors.fill: parent
86-
anchors.margins: isVertical ? 0 : Style.marginS * scaling
87-
spacing: Style.marginS * scaling
88-
visible: !isVertical
89-
90-
NIcon {
91-
Layout.alignment: Qt.AlignVCenter
92-
Layout.preferredWidth: iconSize
93-
Layout.preferredHeight: iconSize
94-
icon: "music"
95-
color: root.hovered ? Color.mPrimary : Color.mOnSurfaceVariant
96-
pointSize: Style.fontSizeL * scaling
97-
}
9895

99-
Item {
100-
Layout.fillWidth: true
101-
Layout.fillHeight: true
102-
clip: true
96+
RowLayout {
97+
anchors.fill: parent
98+
anchors.margins: Style.marginS * scaling
99+
spacing: Style.marginS * scaling
100+
visible: !isVertical
101+
102+
NIcon {
103+
Layout.alignment: Qt.AlignVCenter
104+
Layout.preferredWidth: iconSize
105+
Layout.preferredHeight: iconSize
106+
icon: "music"
107+
color: root.hovered ? Color.mPrimary : Color.mOnSurfaceVariant
108+
pointSize: Style.fontSizeL * scaling
109+
}
110+
111+
Item {
112+
Layout.fillWidth: true
113+
Layout.fillHeight: true
114+
clip: true
103115

104-
ScrollingText {
105-
anchors.fill: parent
106-
anchors.verticalCenter: parent.verticalCenter
116+
ScrollingText {
117+
anchors.fill: parent
118+
anchors.verticalCenter: parent.verticalCenter
107119

108-
text: root.lyricText
109-
textColor: Color.mOnSurface
120+
text: root.lyricText
121+
textColor: Color.mOnSurface
110122

111-
fontSize: root.customFontSize * scaling
112-
fontFamily: root.customFontFamily
123+
fontSize: root.customFontSize * scaling
124+
fontFamily: root.customFontFamily
113125

114-
mode: root.scrollMode
115-
speed: root.adaptScrollSpeed ? (titleMetrics.contentWidth - parent.width + 50) / root.lyricInterval * 1250 : root.scrollSpeed
116-
needsScroll: titleMetrics.contentWidth > parent.width
126+
mode: root.scrollMode
127+
speed: root.adaptScrollSpeed ? adaptiveSpeed : root.scrollSpeed
128+
needsScroll: titleMetrics.contentWidth > parent.width
129+
}
117130
}
118131
}
119-
}
120132

121-
Item {
122-
visible: isVertical
123-
anchors.centerIn: parent
124-
width: parent.width
125-
height: parent.height
133+
ColumnLayout {
134+
anchors.fill: parent
135+
anchors.margins: Style.marginS * scaling
136+
spacing: Style.marginS * scaling
137+
visible: isVertical
138+
139+
NIcon {
140+
Layout.alignment: Qt.AlignHCenter
141+
Layout.preferredWidth: iconSize
142+
Layout.preferredHeight: iconSize
143+
icon: "music"
144+
color: root.hovered ? Color.mPrimary : Color.mOnSurfaceVariant
145+
pointSize: Style.fontSizeL * scaling
146+
}
126147

127-
NIcon {
128-
anchors.centerIn: parent
129-
icon: "music"
130-
color: root.hovered ? Color.mPrimary : Color.mOnSurfaceVariant
131-
pointSize: Style.fontSizeM * scaling
148+
Item {
149+
Layout.fillWidth: true
150+
Layout.fillHeight: true
151+
clip: true
152+
153+
Item {
154+
anchors.centerIn: parent
155+
width: parent.height
156+
height: parent.width
157+
rotation: root.verticalRotationDirection === "cw" ? -90 : 90
158+
transformOrigin: Item.Center
159+
160+
ScrollingText {
161+
anchors.fill: parent
162+
anchors.verticalCenter: parent.verticalCenter
163+
164+
text: root.lyricText
165+
textColor: Color.mOnSurface
166+
167+
fontSize: root.customFontSize * scaling
168+
fontFamily: root.customFontFamily
169+
170+
mode: root.scrollMode
171+
speed: root.adaptScrollSpeed ? adaptiveSpeed : root.scrollSpeed
172+
needsScroll: titleMetrics.contentWidth > parent.width
173+
}
174+
}
175+
}
132176
}
133177
}
134178

@@ -162,16 +206,16 @@ Item {
162206
onEntered: {
163207
root.hovered = true;
164208
if (isVertical)
165-
TooltipService.show(root, root.lyricText, "right");
209+
TooltipService.show(root, root.lyricText, root.verticalTooltipSide);
166210
}
167211
onExited: {
168212
root.hovered = false;
169213
TooltipService.hide();
170214
}
171-
onClicked: (mouse) => {
172-
// Logger.d("MouseArea", "mouse clicked:", mouse.button)
215+
onClicked: mouse => {
216+
// Logger.d("MouseArea", "mouse clicked:", mouse.button)
173217
if (mouse.button === Qt.LeftButton) {
174-
openMediaPlayer.running = true
218+
openMediaPlayer.running = true;
175219
} else if (mouse.button === Qt.RightButton) {
176220
PanelService.showContextMenu(contextMenu, root, root.screen);
177221
}
@@ -203,8 +247,20 @@ Item {
203247
property real fontSize
204248
property string fontFamily
205249
property string mode
206-
property int speed
250+
property real speed
207251
property bool needsScroll
252+
readonly property real adaptiveSpeed: {
253+
if (!root.adaptScrollSpeed)
254+
return root.scrollSpeed;
255+
if (root.lyricInterval <= 0)
256+
return root.scrollSpeed;
257+
258+
const distance = titleMetrics.contentWidth - scrollText.width + 50;
259+
if (distance <= 0)
260+
return root.scrollSpeed;
261+
262+
return Math.max(1, (distance / root.lyricInterval) * 1250);
263+
}
208264

209265
implicitHeight: titleText.height
210266
clip: true
@@ -316,6 +372,7 @@ Item {
316372

317373
RowLayout {
318374
spacing: root.widgetWidth
375+
x: root.isVertical && root.verticalRotationDirection === "cw" ? parent.height - height : 0
319376

320377
NText {
321378
id: titleText

lyrics-fetch/Settings.qml

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,14 @@ ColumnLayout {
1616
property string draftFontFamily: pluginApi?.pluginSettings?.fontFamily ?? "Inter"
1717
property bool draftAdaptScrollSpeed: pluginApi?.pluginSettings?.adaptScrollSpeed ?? true
1818
property bool draftHideWhenPaused: pluginApi?.pluginSettings?.hideWhenPaused ?? true
19+
property string draftVerticalRotationDirection: {
20+
const savedDirection = pluginApi?.pluginSettings?.verticalRotationDirection;
21+
if (savedDirection === "auto" || savedDirection === "cw" || savedDirection === "ccw")
22+
return savedDirection;
23+
return "auto";
24+
}
25+
26+
readonly property bool isBarVertical: Settings.data.bar.position === "left" || Settings.data.bar.position === "right"
1927

2028
spacing: Style.marginM
2129

@@ -26,6 +34,7 @@ ColumnLayout {
2634
pluginApi.pluginSettings.scrollMode = draftMode;
2735
pluginApi.pluginSettings.adaptScrollSpeed = draftAdaptScrollSpeed;
2836
pluginApi.pluginSettings.hideWhenPaused = draftHideWhenPaused;
37+
pluginApi.pluginSettings.verticalRotationDirection = draftVerticalRotationDirection;
2938
pluginApi.pluginSettings.fontSize = draftFontSize;
3039
pluginApi.pluginSettings.hideWhenEmpty = draftHideWhenEmpty;
3140
// Save the selected font
@@ -144,6 +153,29 @@ ColumnLayout {
144153
}
145154
}
146155

156+
NComboBox {
157+
visible: root.isBarVertical
158+
label: pluginApi?.tr("settings.vertical-rotation.title")
159+
description: pluginApi?.tr("settings.vertical-rotation.description")
160+
Layout.fillWidth: true
161+
model: [
162+
{
163+
name: pluginApi?.tr("settings.vertical-rotation.auto"),
164+
key: "auto"
165+
},
166+
{
167+
name: pluginApi?.tr("settings.vertical-rotation.ccw"),
168+
key: "ccw"
169+
},
170+
{
171+
name: pluginApi?.tr("settings.vertical-rotation.cw"),
172+
key: "cw"
173+
}
174+
]
175+
currentKey: draftVerticalRotationDirection
176+
onSelected: key => draftVerticalRotationDirection = key
177+
}
178+
147179
NToggle {
148180
label: pluginApi?.tr("settings.hide-when-paused")
149181
checked: draftHideWhenPaused

lyrics-fetch/i18n/en.json

Lines changed: 8 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -9,9 +9,7 @@
99
"size": "Font Size",
1010
"size-desc": "Text size in points."
1111
},
12-
1312
"width": "Widget Width",
14-
1513
"scroll": {
1614
"speed": "Scroll Speed",
1715
"mode": {
@@ -23,11 +21,16 @@
2321
"adapt": "Adapt scroll speed to line",
2422
"adapt-desc": "Change scroll speed based on length of line"
2523
},
26-
2724
"hide-when-empty": "Hide when empty",
28-
"hide-when-paused": "Hide when paused"
25+
"hide-when-paused": "Hide when paused",
26+
"vertical-rotation": {
27+
"title": "Vertical lyrics orientation",
28+
"description": "Change direction of the lyrics when using a vertical bar.",
29+
"auto": "Automatic",
30+
"cw": "Clockwise",
31+
"ccw": "Counterclockwise"
32+
}
2933
},
30-
3134
"lyrics": {
3235
"paused": "Music paused",
3336
"loading": "Wait Loading 🪿",

lyrics-fetch/manifest.json

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,14 @@
11
{
22
"id": "lyrics-fetch",
33
"name": "Lyrics Fetch/Bar Display",
4-
"version": "1.0.1",
4+
"version": "1.1.0",
55
"minNoctaliaVersion": "3.6.0",
66
"author": "Pever3ll",
77
"license": "GPLv3",
88
"description": "Uses MPRIS data to fetch song lyrics from lrclib.net and displays it in the bar.",
99
"tags": [
10-
"Bar",
11-
"Music"
10+
"Bar",
11+
"Music"
1212
],
1313
"entryPoints": {
1414
"main": "Main.qml",
@@ -25,7 +25,8 @@
2525
"fontSize": 10,
2626
"scrollMode": "always",
2727
"hideWhenEmpty": true,
28-
"adaptScrollSpeed": true
28+
"adaptScrollSpeed": true,
29+
"verticalRotationDirection": "auto"
2930
}
3031
},
3132
"repository": "https://github.com/noctalia-dev/noctalia-plugins"

0 commit comments

Comments
 (0)