import { UiRadius } from "ui_radius.slint";
import { GalleryStrings } from "device_strings.slint";
import { SettingsGroup, SettingsRow, SettingsSelect } from "settings_controls.slint";

export component GallerySettings inherits Rectangle {
    in-out property <int> resolution-index: 0;
    in-out property <int> frame-rate-index: 0;
    in-out property <int> bandwidth-index: 3;
    in property <string> error;
    SettingsGroup {
        y: 0px; width: parent.width;
        title: GalleryStrings.tr("画面传输", "Video transmission", "Передача видео"); rows: 3;
        SettingsRow {
            label: GalleryStrings.tr("分辨率上限", "Resolution limit", "Разрешение");
            label-reserve: self.width - 112px;
            SettingsSelect {
                border-radius: UiRadius.control;
                x: 136px; y: 4px; width: parent.width - 150px;
                current-index <=> root.resolution-index;
                model: [GalleryStrings.tr("自动", "Auto", "Авто"),
                    "320 × 180", "640 × 360", "1280 × 720", "1920 × 1080", "2560 × 1440", "3840 × 2160",
                    GalleryStrings.tr("原始分辨率", "Original resolution", "Исходное разрешение")];
            }
        }
        SettingsRow {
            label: GalleryStrings.tr("帧率", "Frame rate", "Частота кадров");
            label-reserve: self.width - 112px;
            SettingsSelect {
                border-radius: UiRadius.control;
                x: 136px; y: 4px; width: parent.width - 150px;
                current-index <=> root.frame-rate-index;
                model: [GalleryStrings.tr("跟随设备设置", "Follow device settings", "Настройки устройства"), "15 FPS", "30 FPS", "60 FPS"];
            }
        }
        SettingsRow {
            label: GalleryStrings.tr("视频总带宽", "Video budget", "Бюджет видео");
            label-reserve: self.width - 112px; divider: false;
            SettingsSelect {
                border-radius: UiRadius.control;
                x: 136px; y: 4px; width: parent.width - 150px;
                current-index <=> root.bandwidth-index;
                model: ["2 Mbps", "5 Mbps", "10 Mbps", "20 Mbps", "50 Mbps", "100 Mbps"];
            }
        }
    }
    if root.error != "": Text {
        x: 2px; y: 144px; width: parent.width - 4px; height: 32px;
        text: root.error; color: #c53e3e; font-size: 11px; wrap: word-wrap;
    }
}