pragma ComponentBehavior: Bound

import QtQuick
import QtQuick.Layouts
import ZShell.Components
import qs.Helpers
import qs.Components
import ZShell.Config
import qs.Modules.Settings
import qs.Modules.Settings.Common
import qs.Services

PageBase {
	id: root

	title: qsTr("Wallpaper & style")

	ColumnLayout {
		anchors.horizontalCenter: parent.horizontalCenter
		anchors.top: parent.top
		spacing: Tokens.spacing.largeIncreased
		width: root.cappedWidth

		Item {
			id: wallWrapper

			Layout.alignment: Qt.AlignHCenter
			implicitHeight: cropper.height
			implicitWidth: root.cappedWidth

			WallpaperCropper {
				id: cropper
			}
		}

		ButtonRow {
			Layout.alignment: Qt.AlignHCenter
			spacing: Tokens.spacing.small

			IconTextButton {

				property string settingAnchor: "style-wallpapers"

				enabled: Config.background.enabled
				horizontalPadding: Tokens.padding.extraLarge
				icon: "wallpaper"
				isRound: true
				shapeMorph: true
				text: qsTr("Wallpapers")
				type: IconTextButton.Tonal
				verticalPadding: Tokens.padding.small

				onClicked: root.sState.openSubPage(1) // Wallpaper page
			}

			IconTextButton {

				property string settingAnchor: "style-colors-fonts"

				enabled: Config.background.enabled
				horizontalPadding: Tokens.padding.extraLarge
				icon: "palette"
				isRound: true
				shapeMorph: true
				text: qsTr("Colors & font")
				type: IconTextButton.Tonal
				verticalPadding: Tokens.padding.small

				onClicked: root.sState.openSubPage(2) // Colors & font page
			}
		}

		ToggleRow {
			checked: Config.background.enabled
			first: true
			settingAnchor: "style-display-wallpaper"
			text: qsTr("Display wallpaper")

			onToggled: Config.background.enabled = checked
		}

		ToggleRow {
			Layout.topMargin: Tokens.spacing.extraSmall / 2 - parent.spacing
			checked: Colors.transparency.enabled
			settingAnchor: "style-transparency"
			subtext: qsTr("Base %1, layers %2").arg(Colors.transparency.base).arg(Colors.transparency.layers)
			text: qsTr("Transparency")

			onToggled: Config.appearance.transparency.enabled = checked
		}

		ToggleRow {
			Layout.topMargin: Tokens.spacing.extraSmall / 2 - parent.spacing
			checked: !Colors.light
			last: true
			settingAnchor: "style-dark-theme"
			text: qsTr("Dark theme")

			onToggled: Colors.setMode(checked ? "dark" : "light")
		}

		TimeDialogSelect {
			readonly property string endTime: {
				var d = new Date(0, 0, 0, 0, 0, 0, 0);
				d.setMinutes(Config.colors.scheduleDarkEnd);
				return Qt.formatTime(d, "hh:mm AP");
			}
			readonly property string startTime: {
				var d = new Date(0, 0, 0, 0, 0, 0, 0);
				d.setMinutes(Config.colors.scheduleDarkStart);
				return Qt.formatTime(d, "hh:mm AP");
			}

			rowButton.checked: Config.colors.scheduleDark
			rowButton.onToggled: Config.colors.scheduleDark = rowButton.checked
			start: Config.colors.scheduleDarkStart
			end: Config.colors.scheduleDarkEnd
			first: true
			last: true
			settingAnchor: "style-schedule-dark-mode"
			acceptLabel: qsTr("Apply")
			rootParent: root.flickable
			header: qsTr("Select time")
			subtext: qsTr("Dark mode will turn on at %1, and turn off at %2.").arg(startTime).arg(endTime)
			label: qsTr("Schedule dark mode")

			onOpenChanged: {
				root.sState.dimmed = open;
			}

			onAccepted: {
				Config.colors.scheduleDarkStart = startCurrent;
				Config.colors.scheduleDarkEnd = endCurrent;
				ModeScheduler.checkStartup();
			}
		}

		TimeDialogSelect {
			readonly property string endTime: {
				var d = new Date(0, 0, 0, 0, 0, 0, 0);
				d.setMinutes(Config.display.nightlight.scheduleEnd);
				return Qt.formatTime(d, "hh:mm AP");
			}
			readonly property string startTime: {
				var d = new Date(0, 0, 0, 0, 0, 0, 0);
				d.setMinutes(Config.display.nightlight.scheduleStart);
				return Qt.formatTime(d, "hh:mm AP");
			}

			rowButton.checked: Config.display.nightlight.schedule
			rowButton.onToggled: Config.display.nightlight.schedule = rowButton.checked
			start: Config.display.nightlight.scheduleStart
			end: Config.display.nightlight.scheduleEnd
			first: true
			settingAnchor: "style-schedule-nightlight"
			acceptLabel: qsTr("Apply")
			rootParent: root.flickable
			header: qsTr("Select time")
			subtext: qsTr("Nightlight will turn on at %1, and turn off at %2.").arg(startTime).arg(endTime)
			label: qsTr("Schedule nightlight")

			onOpenChanged: {
				root.sState.dimmed = open;
			}

			onAccepted: {
				Config.display.nightlight.scheduleStart = startCurrent;
				Config.display.nightlight.scheduleEnd = endCurrent;
				Hyprsunset.checkStartup();
			}
		}

		ToggleRow {
			Layout.topMargin: Tokens.spacing.extraSmall / 2 - parent.spacing

			checked: Config.display.nightlight.useNative
			settingAnchor: "display-nightlight-useNative"
			text: qsTr("Use native")
			subtext: qsTr("Use native shader nightlight for more features")

			onToggled: Config.display.nightlight.useNative = checked
		}

		SpinRow {
			Layout.topMargin: Tokens.spacing.extraSmall / 2 - parent.spacing

			from: 2000
			settingAnchor: "display-nightlight-temp"
			stepSize: 100
			subtext: qsTr("How warm/orange the screen will be. Lower is warmer (Kelvin)")
			text: qsTr("Temperature")
			to: 6500
			value: Config.display.nightlight.temp

			onMoved: v => Config.display.nightlight.temp = v
		}

		SpinRow {
			Layout.topMargin: Tokens.spacing.extraSmall / 2 - parent.spacing

			from: 0
			settingAnchor: "display-nightlight-fade-duration"
			enabled: Config.display.nightlight.useNative
			last: true
			stepSize: 1
			subtext: qsTr("How long it takes for the gradual nightlight to finish (s)")
			text: qsTr("Fade duration")
			to: 60 * 5
			value: Config.display.nightlight.fadeDuration / 1000

			onMoved: v => Config.display.nightlight.fadeDuration = v * 1000
		}
	}
}
