mirror of
https://github.com/celesrenata/end-4-flakes.git
synced 2026-06-06 02:39:27 -05:00
Celes Renata
470 lines
20 KiB
QML
470 lines
20 KiB
QML
import QtQuick
|
|
import QtQuick.Controls
|
|
import QtQuick.Layouts
|
|
import Quickshell
|
|
|
|
// Transparency and Blur UI Controls
|
|
// Replicates the AGS configuration UI from configure.js
|
|
|
|
Rectangle {
|
|
id: transparencyUI
|
|
|
|
property alias transparencySettings: settingsLoader.item
|
|
|
|
width: 400
|
|
height: 600
|
|
color: "#1e1e2e"
|
|
radius: 12
|
|
border.color: "#45475a"
|
|
border.width: 1
|
|
|
|
// Load the settings module
|
|
Loader {
|
|
id: settingsLoader
|
|
source: "TransparencySettings.qml"
|
|
}
|
|
|
|
ScrollView {
|
|
anchors.fill: parent
|
|
anchors.margins: 20
|
|
|
|
ColumnLayout {
|
|
width: parent.width
|
|
spacing: 20
|
|
|
|
// Header
|
|
Text {
|
|
text: "Effects Configuration"
|
|
color: "#cdd6f4"
|
|
font.pixelSize: 18
|
|
font.bold: true
|
|
Layout.fillWidth: true
|
|
}
|
|
|
|
// Global Transparency Section
|
|
Rectangle {
|
|
Layout.fillWidth: true
|
|
Layout.preferredHeight: transparencySection.height + 20
|
|
color: "#313244"
|
|
radius: 8
|
|
|
|
ColumnLayout {
|
|
id: transparencySection
|
|
anchors.fill: parent
|
|
anchors.margins: 15
|
|
spacing: 15
|
|
|
|
// Transparency Toggle
|
|
RowLayout {
|
|
Layout.fillWidth: true
|
|
|
|
Rectangle {
|
|
width: 24
|
|
height: 24
|
|
color: "#89b4fa"
|
|
radius: 4
|
|
|
|
Text {
|
|
anchors.centerIn: parent
|
|
text: "◫"
|
|
color: "white"
|
|
font.pixelSize: 14
|
|
}
|
|
}
|
|
|
|
ColumnLayout {
|
|
Layout.fillWidth: true
|
|
spacing: 2
|
|
|
|
Text {
|
|
text: "Transparency"
|
|
color: "#cdd6f4"
|
|
font.pixelSize: 14
|
|
font.bold: true
|
|
}
|
|
|
|
Text {
|
|
text: "Make shell elements transparent\nBlur is also recommended if you enable this"
|
|
color: "#a6adc8"
|
|
font.pixelSize: 11
|
|
wrapMode: Text.WordWrap
|
|
Layout.fillWidth: true
|
|
}
|
|
}
|
|
|
|
Switch {
|
|
id: transparencySwitch
|
|
checked: transparencySettings ? transparencySettings.globalTransparency : false
|
|
|
|
onToggled: {
|
|
if (transparencySettings) {
|
|
transparencySettings.setGlobalTransparency(checked)
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
// Terminal Opacity Slider (subcategory)
|
|
Rectangle {
|
|
Layout.fillWidth: true
|
|
Layout.preferredHeight: terminalOpacitySection.height + 10
|
|
color: "#45475a"
|
|
radius: 6
|
|
Layout.leftMargin: 20
|
|
|
|
ColumnLayout {
|
|
id: terminalOpacitySection
|
|
anchors.fill: parent
|
|
anchors.margins: 10
|
|
spacing: 10
|
|
|
|
RowLayout {
|
|
Layout.fillWidth: true
|
|
|
|
Rectangle {
|
|
width: 20
|
|
height: 20
|
|
color: "#f9e2af"
|
|
radius: 3
|
|
|
|
Text {
|
|
anchors.centerIn: parent
|
|
text: "○"
|
|
color: "black"
|
|
font.pixelSize: 12
|
|
}
|
|
}
|
|
|
|
ColumnLayout {
|
|
Layout.fillWidth: true
|
|
spacing: 2
|
|
|
|
Text {
|
|
text: "Terminal Opacity"
|
|
color: "#cdd6f4"
|
|
font.pixelSize: 13
|
|
font.bold: true
|
|
}
|
|
|
|
Text {
|
|
text: "Changes the opacity of the foot terminal"
|
|
color: "#a6adc8"
|
|
font.pixelSize: 10
|
|
wrapMode: Text.WordWrap
|
|
Layout.fillWidth: true
|
|
}
|
|
}
|
|
|
|
Text {
|
|
text: (transparencySettings ? transparencySettings.terminalOpacity : 100) + "%"
|
|
color: "#cdd6f4"
|
|
font.pixelSize: 12
|
|
Layout.preferredWidth: 40
|
|
}
|
|
}
|
|
|
|
Slider {
|
|
id: terminalOpacitySlider
|
|
Layout.fillWidth: true
|
|
from: 0
|
|
to: 100
|
|
stepSize: 1
|
|
value: transparencySettings ? transparencySettings.terminalOpacity : 100
|
|
|
|
onValueChanged: {
|
|
if (transparencySettings && Math.abs(value - transparencySettings.terminalOpacity) > 0.5) {
|
|
transparencySettings.setTerminalOpacity(Math.round(value))
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
// Blur Section
|
|
Rectangle {
|
|
Layout.fillWidth: true
|
|
Layout.preferredHeight: blurSection.height + 20
|
|
color: "#313244"
|
|
radius: 8
|
|
|
|
ColumnLayout {
|
|
id: blurSection
|
|
anchors.fill: parent
|
|
anchors.margins: 15
|
|
spacing: 15
|
|
|
|
// Blur Toggle
|
|
RowLayout {
|
|
Layout.fillWidth: true
|
|
|
|
Rectangle {
|
|
width: 24
|
|
height: 24
|
|
color: "#94e2d5"
|
|
radius: 4
|
|
|
|
Text {
|
|
anchors.centerIn: parent
|
|
text: "◐"
|
|
color: "black"
|
|
font.pixelSize: 14
|
|
}
|
|
}
|
|
|
|
ColumnLayout {
|
|
Layout.fillWidth: true
|
|
spacing: 2
|
|
|
|
Text {
|
|
text: "Blur"
|
|
color: "#cdd6f4"
|
|
font.pixelSize: 14
|
|
font.bold: true
|
|
}
|
|
|
|
Text {
|
|
text: "Enable blur on transparent elements\nDoesn't affect performance/power consumption unless you have transparent windows."
|
|
color: "#a6adc8"
|
|
font.pixelSize: 11
|
|
wrapMode: Text.WordWrap
|
|
Layout.fillWidth: true
|
|
}
|
|
}
|
|
|
|
Switch {
|
|
id: blurSwitch
|
|
checked: transparencySettings ? transparencySettings.blurEnabled : false
|
|
|
|
onToggled: {
|
|
if (transparencySettings) {
|
|
transparencySettings.setBlurEnabled(checked)
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
// Blur Subcategory
|
|
Rectangle {
|
|
Layout.fillWidth: true
|
|
Layout.preferredHeight: blurSubcategory.height + 10
|
|
color: "#45475a"
|
|
radius: 6
|
|
Layout.leftMargin: 20
|
|
visible: transparencySettings ? transparencySettings.blurEnabled : false
|
|
|
|
ColumnLayout {
|
|
id: blurSubcategory
|
|
anchors.fill: parent
|
|
anchors.margins: 10
|
|
spacing: 15
|
|
|
|
// X-ray Toggle
|
|
RowLayout {
|
|
Layout.fillWidth: true
|
|
|
|
Rectangle {
|
|
width: 20
|
|
height: 20
|
|
color: "#f38ba8"
|
|
radius: 3
|
|
|
|
Text {
|
|
anchors.centerIn: parent
|
|
text: "⚡"
|
|
color: "white"
|
|
font.pixelSize: 10
|
|
}
|
|
}
|
|
|
|
ColumnLayout {
|
|
Layout.fillWidth: true
|
|
spacing: 2
|
|
|
|
Text {
|
|
text: "X-ray"
|
|
color: "#cdd6f4"
|
|
font.pixelSize: 13
|
|
font.bold: true
|
|
}
|
|
|
|
Text {
|
|
text: "Make everything behind a window/layer except the wallpaper not rendered on its blurred surface\nRecommended to improve performance (if you don't abuse transparency/blur)"
|
|
color: "#a6adc8"
|
|
font.pixelSize: 10
|
|
wrapMode: Text.WordWrap
|
|
Layout.fillWidth: true
|
|
}
|
|
}
|
|
|
|
Switch {
|
|
checked: transparencySettings ? transparencySettings.blurXray : true
|
|
|
|
onToggled: {
|
|
if (transparencySettings) {
|
|
transparencySettings.setBlurXray(checked)
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
// Blur Size
|
|
RowLayout {
|
|
Layout.fillWidth: true
|
|
|
|
Rectangle {
|
|
width: 20
|
|
height: 20
|
|
color: "#a6e3a1"
|
|
radius: 3
|
|
|
|
Text {
|
|
anchors.centerIn: parent
|
|
text: "◎"
|
|
color: "black"
|
|
font.pixelSize: 10
|
|
}
|
|
}
|
|
|
|
ColumnLayout {
|
|
Layout.fillWidth: true
|
|
spacing: 2
|
|
|
|
Text {
|
|
text: "Size"
|
|
color: "#cdd6f4"
|
|
font.pixelSize: 13
|
|
font.bold: true
|
|
}
|
|
|
|
Text {
|
|
text: "Adjust the blur radius. Generally doesn't affect performance\nHigher = more color spread"
|
|
color: "#a6adc8"
|
|
font.pixelSize: 10
|
|
wrapMode: Text.WordWrap
|
|
Layout.fillWidth: true
|
|
}
|
|
}
|
|
|
|
SpinBox {
|
|
from: 1
|
|
to: 1000
|
|
value: transparencySettings ? transparencySettings.blurSize : 8
|
|
|
|
onValueChanged: {
|
|
if (transparencySettings && value !== transparencySettings.blurSize) {
|
|
transparencySettings.setBlurSize(value)
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
// Blur Passes
|
|
RowLayout {
|
|
Layout.fillWidth: true
|
|
|
|
Rectangle {
|
|
width: 20
|
|
height: 20
|
|
color: "#cba6f7"
|
|
radius: 3
|
|
|
|
Text {
|
|
anchors.centerIn: parent
|
|
text: "↻"
|
|
color: "white"
|
|
font.pixelSize: 10
|
|
}
|
|
}
|
|
|
|
ColumnLayout {
|
|
Layout.fillWidth: true
|
|
spacing: 2
|
|
|
|
Text {
|
|
text: "Passes"
|
|
color: "#cdd6f4"
|
|
font.pixelSize: 13
|
|
font.bold: true
|
|
}
|
|
|
|
Text {
|
|
text: "Adjust the number of runs of the blur algorithm\nMore passes = more spread and power consumption\n4 is recommended\n2- would look weird and 6+ would look lame."
|
|
color: "#a6adc8"
|
|
font.pixelSize: 10
|
|
wrapMode: Text.WordWrap
|
|
Layout.fillWidth: true
|
|
}
|
|
}
|
|
|
|
SpinBox {
|
|
from: 1
|
|
to: 10
|
|
value: transparencySettings ? transparencySettings.blurPasses : 4
|
|
|
|
onValueChanged: {
|
|
if (transparencySettings && value !== transparencySettings.blurPasses) {
|
|
transparencySettings.setBlurPasses(value)
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
// Apply/Reset buttons
|
|
RowLayout {
|
|
Layout.fillWidth: true
|
|
Layout.topMargin: 20
|
|
|
|
Button {
|
|
text: "Reset to Defaults"
|
|
Layout.fillWidth: true
|
|
|
|
onClicked: {
|
|
if (transparencySettings) {
|
|
transparencySettings.setGlobalTransparency(false)
|
|
transparencySettings.setTerminalOpacity(100)
|
|
transparencySettings.setBlurEnabled(false)
|
|
transparencySettings.setBlurXray(true)
|
|
transparencySettings.setBlurSize(8)
|
|
transparencySettings.setBlurPasses(4)
|
|
}
|
|
}
|
|
}
|
|
|
|
Button {
|
|
text: "Reload Settings"
|
|
Layout.fillWidth: true
|
|
|
|
onClicked: {
|
|
if (transparencySettings) {
|
|
transparencySettings.loadSettings()
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
// IPC Handler for external control
|
|
IpcHandler {
|
|
target: "transparencyUI"
|
|
|
|
function show() {
|
|
transparencyUI.visible = true
|
|
}
|
|
|
|
function hide() {
|
|
transparencyUI.visible = false
|
|
}
|
|
|
|
function toggle() {
|
|
transparencyUI.visible = !transparencyUI.visible
|
|
}
|
|
}
|
|
}
|