diff --git a/modules/dashboard/dash/Media.qml b/modules/dashboard/dash/Media.qml index 1cc99531..0e123072 100644 --- a/modules/dashboard/dash/Media.qml +++ b/modules/dashboard/dash/Media.qml @@ -22,6 +22,7 @@ Item { readonly property real arcCoverGap: Tokens.spacing.extraSmall property bool coverHadPrevious + property color coverFallbackColour: Colours.layer(Colours.palette.m3surfaceContainerHighest, 2) anchors.top: parent.top anchors.bottom: parent.bottom @@ -33,6 +34,10 @@ Item { } } + Behavior on coverFallbackColour { + CAnim {} + } + Timer { running: Players.active?.isPlaying ?? false interval: GlobalConfig.dashboard.mediaUpdateInterval @@ -82,15 +87,18 @@ Item { } Item { - id: coverShape + id: coverShapeWrapper anchors.fill: parent layer.enabled: true + opacity: root.coverFallbackColour.a MaterialShape { + id: coverShape + implicitSize: cover.width shape: MaterialShape.Cookie12Sided - color: Colours.layer(Colours.palette.m3surfaceContainerHighest, 2) + color: Qt.alpha(root.coverFallbackColour, 1) Anim on rotation { running: true @@ -159,7 +167,7 @@ Item { layer.enabled: true layer.effect: Mask { - maskSource: coverShape + maskSource: coverShapeWrapper } retainWhileLoading: true diff --git a/modules/dashboard/dash/User.qml b/modules/dashboard/dash/User.qml index 32b642d8..cd0a96ef 100644 --- a/modules/dashboard/dash/User.qml +++ b/modules/dashboard/dash/User.qml @@ -16,9 +16,15 @@ Item { required property DrawerVisibilities visibilities required property FileDialog facePicker + property color pfpFallbackColour: Colours.layer(Colours.palette.m3surfaceContainerHighest, 2) + anchors.fill: parent anchors.margins: Tokens.padding.large + Behavior on pfpFallbackColour { + CAnim {} + } + Item { id: pfpContainer @@ -34,13 +40,10 @@ Item { anchors.centerIn: parent implicitSize: parent.height shape: MaterialShape.Pill - color: Colours.layer(Colours.palette.m3surfaceContainerHigh, 2) + color: Qt.alpha(root.pfpFallbackColour, 1) + opacity: root.pfpFallbackColour.a layer.enabled: true - Behavior on color { - CAnim {} - } - MouseArea { id: mouse @@ -67,14 +70,30 @@ Item { maskSource: shape } + Loader { + anchors.centerIn: parent + asynchronous: true + active: pfp.status !== Image.Ready + + sourceComponent: MaterialIcon { + text: "person_add" + color: Colours.palette.m3onSurfaceVariant + fontStyle: Tokens.font.icon.extraLarge + fill: 1 + grade: -2 // Ugh material symbols are such a pain with fill + } + } + CachingImage { + id: pfp + anchors.fill: parent path: `${Paths.home}/.face` } StyledRect { anchors.fill: parent - color: Qt.alpha(Colours.palette.m3scrim, 0.4) + color: Qt.alpha(Colours.palette.m3scrim, pfp.status === Image.Ready ? 0.4 : 0) opacity: mouse.containsMouse ? 1 : 0 layer.enabled: opacity < 1