import { Button, VerticalBox , HorizontalBox, TabWidget, ListView, StandardListView, StandardTableView, CheckBox, ScrollView, LineEdit, SpinBox, ComboBox, TextEdit, Slider} from "std-widgets.slint";
import { Settings } from "settings.slint";
import { Callabler } from "callabler.slint";
import { GuiState } from "gui_state.slint";

// TODO use Spinbox instead LineEdit {} to be able to set only numbers

global SettingsSize {
    out property <length> item_height: 30px;
}

component TextComponent inherits HorizontalLayout {
    in-out property <string> model;
    in property <string> name;
    spacing: 5px;
    Text {
        horizontal-stretch: 0.0;
        vertical-alignment: TextVerticalAlignment.center;
        text: name;
    }
    LineEdit {
        horizontal-stretch: 1.0;
        height: SettingsSize.item_height;
        text <=> model;
    }
}

component CheckBoxComponent inherits HorizontalLayout {
    in-out property <bool> model;
    in property <string> name;
    spacing: 5px;
    CheckBox {
        horizontal-stretch: 1.0;
        height: SettingsSize.item_height;
        checked <=> model;
        text: name;
    }
    Rectangle {}
}

component ThreadSliderComponent inherits HorizontalLayout {
    in-out property <float> minimum_number;
    in-out property <float> maximum_number;
    in-out property <string> name;
    spacing: 5px;

    callback changed <=> slider.changed;
    
    Text {
        text <=> name;
        vertical-alignment: TextVerticalAlignment.center;
        height: SettingsSize.item_height;
    }
    slider := Slider {
        enabled: true;
        height: SettingsSize.item_height;
        minimum: minimum_number;
        maximum <=> maximum_number;
        value <=> Settings.thread_number;
    }
    Text {
        height: SettingsSize.item_height;
        vertical-alignment: TextVerticalAlignment.center;
        text: round(slider.value) == 0 ? ("All (" + GuiState.maximum_threads + "/" + GuiState.maximum_threads + ")") : (round(slider.value) + "/" + GuiState.maximum_threads);
    }
}

component MinMaxSizeComponent inherits HorizontalLayout {
    spacing: 20px;
    Text {
        horizontal-stretch: 0.0;
        text:"Items Size(Bytes)";
        vertical-alignment: TextVerticalAlignment.center;
    }
    HorizontalLayout {
        spacing: 5px;
        horizontal-stretch: 1.0;
        Text {
            text:"Min:";
            vertical-alignment: TextVerticalAlignment.center;
        }
        LineEdit {
            height: SettingsSize.item_height;
            text <=> Settings.minimum_file_size;
        }
        Text {
            text:"Max:";
            vertical-alignment: TextVerticalAlignment.center;
        }
        LineEdit {
            height: SettingsSize.item_height;
            text <=> Settings.maximum_file_size;
        }
    }
}

component Presets inherits Rectangle {
    property <bool> edit_name;
    property <string> current_index;
    if !edit_name: HorizontalLayout {
        spacing: 5px;
        Text {
            text : "Current Preset:";
            vertical-alignment: TextVerticalAlignment.center;
        }
        combo_box := ComboBox {
            current-index <=> Settings.settings_preset_idx;
            model: Settings.settings_presets;
            selected(item) => {
                Settings.settings_preset_idx = self.current_index;
                Callabler.changed_settings_preset();
            }
        }
        Button {
            text: "Edit name";
            clicked => {
                root.edit_name = !root.edit_name;
            }
        }
    }
    if edit_name : HorizontalLayout{
        spacing: 5px;
        Text {
            text: "Choose name for prefix " + (Settings.settings_preset_idx + 1);
            vertical-alignment: TextVerticalAlignment.center;
        }
        current_name := LineEdit {
            text: Settings.settings_presets[Settings.settings_preset_idx];
        }
        Button {
            text: "Save";
            clicked => {
                Settings.settings_presets[Settings.settings_preset_idx] = current_name.text;
                edit_name = false;
            }
        }
    }
}

// component Language inherits HorizontalLayout {
//     spacing: 5px;
//     Text {     
//         text: Callabler.translate("settings_language", []);
//         vertical-alignment: TextVerticalAlignment.center;
//     }
//     ComboBox {
//         model: ["English"];
//     }
// }
component HeaderText inherits Text {
    font-size: 15px;
    height: SettingsSize.item_height;
    horizontal-alignment: TextHorizontalAlignment.center;
    vertical-alignment: TextVerticalAlignment.center;
}

component ConfigCacheButtons inherits HorizontalLayout {
    spacing: 20px;
    Button {
        text: "Open config folder";
        clicked => {
            Callabler.open_config_folder();
        }
    }
    Button {
        text: "Open cache folder";
        clicked => {
            Callabler.open_cache_folder();
        }
    }
}

export component SettingsList inherits VerticalLayout {
    preferred-height: 300px;
    preferred-width: 400px;

    in-out property <bool> restart_required;

    Text {
        text: "Settings";
        height: SettingsSize.item_height;
        horizontal-alignment: TextHorizontalAlignment.center;
        font-size: 20px;
    }
    ScrollView {
        VerticalLayout {
            padding-right: 15px;
            padding-bottom: 10px;
            spacing: 5px;
            Presets{
                height: SettingsSize.item_height;
            }
            // TODO Maybe someday
            // Language {
            //     height: SettingsSize.item_height;
            // }
            HeaderText {
                text: "General settings";
            }
            TextComponent {
                name: "Excluded item:";
                model <=> Settings.excluded_items;
            }
            TextComponent {
                name: "Allowed extensions:";
                model <=> Settings.allowed_extensions;
            }
            MinMaxSizeComponent {

            }
            CheckBoxComponent {
                name: "Recursive";
                model <=> Settings.recursive_search;
            }
            CheckBoxComponent {
                name: "Use Cache";
                model <=> Settings.use_cache;
            }
            CheckBoxComponent {
                name: "Also save cache as JSON file";
                model <=> Settings.save_as_json;
            }
            CheckBoxComponent {
                name: "Move deleted files to trash";
                model <=> Settings.move_to_trash;
            }
            CheckBoxComponent {
                name: "Ignore other filesystems (only Linux)";
                model <=> Settings.ignore_other_filesystems;
            }
            ThreadSliderComponent {
                name: "Thread number";
                maximum_number <=> GuiState.maximum_threads;
                changed => {
                    restart_required = true;
                }
            }
            if restart_required: Text {
                text: "---You need to restart app to apply changes in thread number---";
                horizontal-alignment: TextHorizontalAlignment.center;
            }
            HeaderText {
                text: "Duplicate tool";
            }
            CheckBoxComponent {
                name: "Image preview";
                model <=> Settings.duplicate_image_preview;
            }
            CheckBoxComponent {
                name: "Hide hard links";
                model <=> Settings.duplicate_hide_hard_links;
            }
            TextComponent {
                name: "Minimal size of cached files - Hash (KB)";
                model <=> Settings.duplicate_minimal_hash_cache_size;
            }
            CheckBoxComponent {
                name: "Use prehash";
                model <=> Settings.duplicate_use_prehash;
            }
            TextComponent {
                name: "Minimal size of cached files - Prehash (KB)";
                model <=> Settings.duplicate_minimal_prehash_cache_size;
            }
            CheckBoxComponent {
                name: "Delete outdated entries";
                model <=> Settings.duplicate_delete_outdated_entries;
            }
            HeaderText {
                text: "Similar Images tool";
            }
            CheckBoxComponent {
                name: "Image preview";
                model <=> Settings.similar_images_show_image_preview;
            }
            CheckBoxComponent {
                name: "Delete outdated entries";
                model <=> Settings.similar_images_delete_outdated_entries;
            }
            HeaderText {
                text: "Similar Videos tool";
            }
            CheckBoxComponent {
                name: "Delete outdated entries";
                model <=> Settings.similar_videos_delete_outdated_entries;
            }
            HeaderText {
                text: "Similar Music tool";
            }
            CheckBoxComponent {
                name: "Delete outdated entries";
                model <=> Settings.similar_music_delete_outdated_entries;
            }
            ConfigCacheButtons {

            }
        }
    }
    HorizontalLayout {
        spacing: 5px;
        Button {
            text: "Save";
            clicked => {
                Callabler.save_current_preset();
            }
        }
        Button {
            text: "Load";
            clicked => {
                Callabler.load_current_preset();
            }
        }
        Button {
            text: "Reset";
            clicked => {
                Callabler.reset_current_preset();
            }
        }
    }
}