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 = colorComboBox.currentText
            editingModel.alignment = alignmentComboBox.currentText
            editingModel.scroll = scrollSwitch.checked
            editingModel.scrollSpeed = scrollSpeedSpinBox.value
            editingModel.scrollCount = scrollCountSpinBox.value
        }
        else {
            editingModel.append(textTextField.value,
                                 activeSwitch.checked,
                                 runtimeSpinBox.value,
                                 colorComboBox.currentText,
                                 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

            property double fontSizeMultiplier: 0.14
            property double labelWidthMultiplier: 0.4

            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
                text: qsTr("Runtime (in s)")
            }

            ComboBoxDelegate {
                id: colorComboBox
                Layout.fillWidth: true
                model: ["white", "blue", "red", "green"]
                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: 0
                to: 10
                text: qsTr("Scroll speed")
            }

            SpinBoxDelegate {
                id: scrollCountSpinBox
                Layout.fillWidth: true
                from: 0
                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
        colorComboBox.currentIndex = colorComboBox.model.indexOf(editingModel.color)
        alignmentComboBox.currentIndex = alignmentComboBox.model.indexOf(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
        colorComboBox.currentIndex = 0
        alignmentComboBox.currentIndex = 0
        scrollSwitch.checked = false
        scrollSpeedSpinBox.value = 5
        scrollCountSpinBox.value = 0
    }
}