import QtQuick 2.12
import QtQuick.Controls 2.12
import QtQuick.Layouts 1.9
import QtQuick.Controls.Material 2.0

import de.itsblue.omobidisplayapp 1.0

Dialog {
    id: control

    property bool editing
    property var editingModel

    parent: Overlay.overlay

    x: (parent.width - width) / 2
    y: (parent.height - height) / 2

    width: parent.width * 0.9
    height: Math.min(parent.height * 0.9, control.implicitHeight)

    modal: true

    title: editing ? "Edit item" : "New item"

    onAccepted: {
        if(editing) {
            editingModel.active = activeSwitch.checked
            editingModel.text = textTextField.value
            editingModel.runtime = runtimeSpinBox.value
            editingModel.color = colorColorPicker.value
            editingModel.alignment = alignmentComboBox.currentIndex
            editingModel.scroll = scrollSwitch.checked
            editingModel.scrollSpeed = scrollSpeedSpinBox.value
            editingModel.scrollCount = scrollCountSpinBox.value
        }
        else {
            editingModel.append(textTextField.value,
                                 activeSwitch.checked,
                                 runtimeSpinBox.value,
                                 colorColorPicker.value,
                                 alignmentComboBox.currentText,
                                 scrollSwitch.checked,
                                 scrollSpeedSpinBox.value,
                                 scrollCountSpinBox.value
                                 )
        }
    }

    contentItem: Flickable {

        implicitHeight: dataFieldsGridLayout.height
        contentHeight: dataFieldsGridLayout.height

        clip: true
        boundsBehavior: Flickable.OvershootBounds

        ScrollBar.vertical: ScrollBar {
            interactive: false
        }

        ColumnLayout {
            id: dataFieldsGridLayout

            width: control.width * 0.9

            SwitchDelegate {
                id: activeSwitch
                Layout.fillWidth: true
                text: qsTr("Active")
            }

            TextInputDelegate {
                id: textTextField
                Layout.fillWidth: true
                required: true
                placeholderText: qsTr("Enter some text to be displayed")

                text: qsTr("Text")
            }

            SpinBoxDelegate {
                id: runtimeSpinBox
                Layout.fillWidth: true
                editable: true
                to: 3600
                text: qsTr("Runtime (in s)")
            }

            ColorPickerDelegate {
                id: colorColorPicker
                Layout.fillWidth: true
                text: qsTr("Color")
            }

            ComboBoxDelegate {
                id: alignmentComboBox
                Layout.fillWidth: true
                model: ["left", "center", "right"]
                text: qsTr("Alignment")
            }

            SwitchDelegate {
                id: scrollSwitch
                Layout.fillWidth: true
                text: qsTr("Scroll")
            }

            SpinBoxDelegate {
                id: scrollSpeedSpinBox
                Layout.fillWidth: true
                from: 1
                to: 10
                text: qsTr("Scroll speed")
            }

            SpinBoxDelegate {
                id: scrollCountSpinBox
                Layout.fillWidth: true
                from: 0
                editable: true
                text: qsTr("Scroll count")
            }
        }
    }

    footer: DialogButtonBox {

        //  alignment: Qt.AlignHCenter
        buttonLayout: DialogButtonBox.GnomeLayout

        Material.background: "transparent"

        Button {
            flat: true
            enabled: textTextField.value !== ""
            text: "save"
            DialogButtonBox.buttonRole: DialogButtonBox.AcceptRole
        }

        Button {
            flat: true
            text: "cancel"
            DialogButtonBox.buttonRole: DialogButtonBox.RejectRole
        }

        Button {
            visible: popup.editing
            Material.foreground: Material.Red
            flat: true
            text: "delete"
            DialogButtonBox.buttonRole: DialogButtonBox.DestructiveRole
        }
    }

    function edit(model) {
        editingModel = model
        editing = true

        reset()

        activeSwitch.checked = editingModel.active
        textTextField.value = editingModel.text
        runtimeSpinBox.value = editingModel.runtime
        colorColorPicker.value = editingModel.color
        alignmentComboBox.currentIndex = editingModel.alignment
        scrollSwitch.checked = editingModel.scroll
        scrollSpeedSpinBox.value = editingModel.scrollSpeed
        scrollCountSpinBox.value = editingModel.scrollCount

        open()
    }

    function add(model) {
        editingModel = model
        editing = false
        reset()
        open()
    }

    function reset() {
        activeSwitch.checked = true
        textTextField.value = ""
        runtimeSpinBox.value = 0
        colorColorPicker.value = ""
        alignmentComboBox.currentIndex = 0
        scrollSwitch.checked = false
        scrollSpeedSpinBox.value = 5
        scrollCountSpinBox.value = 0
    }
}