import { Palette, VerticalBox, HorizontalBox, GroupBox } from "std-widgets.slint";
import { SystemToggleVert, SystemDropdown } from "common.slint";
import { PowerZones } from "../types/aura_types.slint";

export component AuraPowerGroup inherits Rectangle {
    min-width: row.min-width;
    border-radius: 20px;
    background: Palette.alternate-background;
    opacity: 0.9;
    in-out property <string> group-title;
    in-out property <bool> boot_checked;
    in-out property <bool> awake_checked;
    in-out property <bool> sleep_checked;
    in-out property <bool> shutdown_checked;
    callback boot_toggled(bool);
    callback awake_toggled(bool);
    callback sleep_toggled(bool);
    callback shutdown_toggled(bool);
    VerticalBox {
        spacing: 10px;
        Text {
            font-size: 18px;
            color: Palette.alternate-foreground;
            horizontal-alignment: TextHorizontalAlignment.center;
            text <=> root.group-title;
        }

        row := HorizontalBox {
            alignment: LayoutAlignment.center;
            SystemToggleVert {
                min-width: 96px;
                max-height: 42px;
                text: @tr("Boot");
                checked <=> root.boot_checked;
                toggled => {
                    root.boot_toggled(self.checked);
                }
            }

            SystemToggleVert {
                min-width: 96px;
                max-height: 42px;
                text: @tr("Awake");
                checked <=> root.awake_checked;
                toggled => {
                    root.awake_toggled(self.checked);
                }
            }

            SystemToggleVert {
                min-width: 96px;
                max-height: 42px;
                text: @tr("Sleep");
                checked <=> root.sleep_checked;
                toggled => {
                    root.sleep_toggled(self.checked);
                }
            }

            SystemToggleVert {
                min-width: 96px;
                max-height: 42px;
                text: @tr("Shutdown");
                checked <=> root.shutdown_checked;
                toggled => {
                    root.shutdown_toggled(self.checked);
                }
            }
        }
    }
}

export component AuraPowerGroupOld inherits Rectangle {
    min-width: row.min-width;
    border-radius: 20px;
    background: Palette.alternate-background;
    opacity: 0.9;
    in-out property <int> current_zone;
    in-out property <[int]> zones;
    in-out property <[string]> zone_strings;
    in-out property <string> group-title;
    in-out property <bool> boot_checked;
    in-out property <bool> awake_checked;
    in-out property <bool> sleep_checked;
    callback boot_toggled(bool);
    callback awake_toggled(bool);
    callback sleep_toggled(bool);
    callback selected_zone(int);
    VerticalBox {
        spacing: 10px;
        Text {
            font-size: 18px;
            color: Palette.alternate-foreground;
            horizontal-alignment: TextHorizontalAlignment.center;
            text <=> root.group-title;
        }

        row := HorizontalBox {
            alignment: LayoutAlignment.center;

            SystemDropdown {
                text: @tr("Zone Selection");
                current_index <=> root.current_zone;
                current_value: root.zone_strings[root.current_zone];
                model <=> root.zone_strings;
                selected => {
                    root.selected_zone(root.current_zone);
                }
            }

            SystemToggleVert {
                min-width: 96px;
                max-height: 42px;
                text: @tr("Boot");
                checked <=> root.boot_checked;
                toggled => {
                    root.boot_toggled(self.checked);
                }
            }

            SystemToggleVert {
                min-width: 96px;
                max-height: 42px;
                text: @tr("Awake");
                checked <=> root.awake_checked;
                toggled => {
                    root.awake_toggled(self.checked);
                }
            }

            SystemToggleVert {
                min-width: 96px;
                max-height: 42px;
                text: @tr("Sleep");
                checked <=> root.sleep_checked;
                toggled => {
                    root.sleep_toggled(self.checked);
                }
            }
        }
    }
}