import { VerticalBox, LineEdit, Button, DatePickerPopup, ComboBox, Slider } from "std-widgets.slint";
import { Timeline, TimelineState } from "timeline.slint";
import { Const } from "global.slint";

export component ReviewWidget inherits VerticalLayout {
    callback update-visible-time(string);
    callback fetch-log(int, int, int);

    property<int> current-year;
    property<int> current-month;
    property<int> current-day;
    in property<[string]> combo-spans: []; 
    in-out property<TimelineState> state;
    in-out property<bool> minimized;
    in-out property<bool> is-active;
    
    if is-active: VerticalLayout {
        spacing: 8px;
        Slider {
            minimum: state.visible-time;
            maximum: Const.max-offset;
            value: state.offset;
            changed(value) => {
                state.offset = value;
            }
        }
        if !minimized: GridLayout {
            spacing-horizontal: 16px;
            padding: 8px;
            Text {
                text: "Day: \{current-day}/\{current-month}/\{current-year}";
                font-size: 24px;
                horizontal-alignment: right;
            }
            Button {
                primary: true;
                text: "Select";
                clicked => {
                    date-picker.show()
                }
                col: 1;
            }
            Text {
                text: "Span: ";
                font-size: 24px;
                row: 1;
                horizontal-alignment: right;
            }
            ComboBox {
                model: combo-spans;
                current-index: 0;
                row: 1;
                col: 1;
                selected(current-value) => {
                    root.update-visible-time(current-value);
                }
            }
        }
    }
    date-picker := DatePickerPopup {
        x: (root.width - self.width) / 2;
        y: (root.height - self.height) / 2;
        title: "";
        accepted(date) => {
            current-year = date.year;
            current-month = date.month;
            current-day = date.day;
            root.fetch-log(current-year, current-month, current-day);
        }
    }
}