import QtQuick
import Quickshell
import QtQuick.Window

import "../services"
import "../constants" 

PanelWindow {
    id: fortuneBox

    required property ShellScreen modelData
    screen: modelData
    property int horizontalPadding: 12
    property int verticalPadding: 8
    property real backgroundOpacity: 0.8
    implicitWidth: fortuneText.implicitWidth + (horizontalPadding * 2)
    implicitHeight: fortuneText.implicitHeight + (verticalPadding * 2)
    aboveWindows: false

    color: Qt.alpha(Colors.md3.on_secondary, backgroundOpacity)

    FortuneService {
        id: fortuneService
    }

    // Canvas {
    //     id: gradientCanvas
    //     anchors.fill: parent

    //     onPaint: {
    //         var ctx = getContext("2d");
    //         ctx.reset();

    //         var grad = ctx.createLinearGradient(0, 0, width, height);
    //         grad.addColorStop(0.0, "rgba(0, 0, 0, 0.0)");
    //         grad.addColorStop(0.3, "rgba(0, 0, 0, 0.55)");
    //         grad.addColorStop(1.0, "rgba(0, 0, 0, 0.80)");

    //         ctx.fillStyle = grad;
    //         ctx.fillRect(0, 0, width, height);

    //         // Fade all sides out so panel edges are not visible.
    //         var edgeFade = Math.max(10, Math.min(width, height) * 0.4);

    //         ctx.globalCompositeOperation = "destination-in";

    //         var maskX = ctx.createLinearGradient(0, 0, width, 0);
    //         maskX.addColorStop(0.0, "rgba(0, 0, 0, 0.0)");
    //         maskX.addColorStop(edgeFade / width, "rgba(0, 0, 0, 1.0)");
    //         maskX.addColorStop(1.0 - (edgeFade / width), "rgba(0, 0, 0, 1.0)");
    //         maskX.addColorStop(1.0, "rgba(0, 0, 0, 0.0)");
    //         ctx.fillStyle = maskX;
    //         ctx.fillRect(0, 0, width, height);

    //         var maskY = ctx.createLinearGradient(0, 0, 0, height);
    //         maskY.addColorStop(0.0, "rgba(0, 0, 0, 0.0)");
    //         maskY.addColorStop(edgeFade / height, "rgba(0, 0, 0, 0.6)");
    //         maskY.addColorStop(1.0 - (edgeFade / height), "rgba(0, 0, 0, 0.6)");
    //         maskY.addColorStop(1.0, "rgba(0, 0, 0, 0.0)");
    //         ctx.fillStyle = maskY;
    //         ctx.fillRect(0, 0, width, height);
    //     }

    //     onWidthChanged: requestPaint()
    //     onHeightChanged: requestPaint()
    // }

    Text {
        id: fortuneText
        anchors.centerIn: parent
        text: fortuneService.fortuneText
        color: Colors.md3.primary
        font.pixelSize: 12
        font.family: Constants.fontFamily
    }

}