import QtQuick 2.4
import QtQuick.Controls 1.3
import QtQuick.Window 2.2
import QtQuick.Dialogs 1.2

ApplicationWindow {
    width: pow2Width * 2 + 10
    height: 700
    visible: true

    property int baseWidth: 32
    property int bitWidth: 256 / baseWidth
    property int pow2Width: 256

    property int currentIndex: -1
    property bool prefixGetter: false
    property string memberName: "flags"
    property string format: "BASETYPE GETNAME() const { return (DATA & GETMASK) >> OFFSET; }\nvoid SETNAME(BASETYPE v) { DATA = (DATA & SETMASK) | (v << OFFSET); }\n\n"

    ListModel { id: myModel }

    Item {
        id: keyc
        Keys.onPressed: {
            if (currentIndex > -1) {
                var newIndex
                switch (event.key) {
                case Qt.Key_Up:
                case Qt.Key_Left:
                    if (currentIndex > 0) {
                        newIndex = currentIndex -1
                        myModel.move(currentIndex, newIndex, 1)
                        currentIndex = newIndex
                    }
                    break
                case Qt.Key_Down:
                case Qt.Key_Right:
                    if (currentIndex < myModel.count - 1) {
                        newIndex = currentIndex + 1
                        myModel.move(currentIndex, newIndex, 1)
                        currentIndex = newIndex
                    }
                    break
                }
            }
        }
        focus: true
    }

    onCurrentIndexChanged: keyc.focus = true

    function compile() {
        if (myModel.count > 0) {
            var code = "public:\n"
            var basetype
            switch (baseWidth) {
            case 8:
                basetype = "quint8"
                break
            case 16:
                basetype = "quint16"
                break
            case 32:
                basetype = "quint32"
                break
            case 64:
                basetype = "quint64"
                break
            }

            var len = flow.children[myModel.count - 1].y
            if (len) len /= 50
            len += 1
            for (var i = 0; i < myModel.count; ++i) {
                var offset = flow.children[i].x
                if (offset) offset /= bitWidth
                var c = format
                var name = myModel.get(i).name
                var capName = cap(name)
                c = c.replace(/BASETYPE/g, basetype)
                if (prefixGetter) c = c.replace(/GETNAME/g, "get" + capName)
                else c = c.replace(/GETNAME/g, name)
                var data = ""
                if (len > 1) {
                    var index = flow.children[i].y
                    if (index) index /= 50
                    data += memberName + "[" + index + "]"
                }
                else data += memberName
                c = c.replace(/DATA/g, data)
                c = c.replace(/GETMASK/g, getMask(myModel.get(i).size, offset))
                c = c.replace(/SETMASK/g, setMask(myModel.get(i).size, offset))
                c = c.replace(/OFFSET/g, offset)
                c = c.replace(/SETNAME/g, "set" + capName)
                if (!offset) {
                    var trim = ""
                    var begin = 0
                    var end = c.indexOf("(" + data)
                    trim += c.substring(begin, end)
                    begin = end + 1
                    end = c.indexOf(") >")
                    trim += c.substring(begin, end)
                    begin = c.indexOf(";")
                    end = c.lastIndexOf("(")
                    trim += c.substring(begin, end)
                    trim += "v"
                    begin = c.lastIndexOf(";")
                    trim += c.substring(begin)
                    c = trim
                }
                code += c
            }
            code += "private:\n"
            if (len > 1) code += basetype + " " + memberName + "[" + len + "];"
            else code += basetype + " " + memberName + ";"

            codeField.text = code
            codeD.visible = true
        }
    }


    function cap(string) {
        return string.charAt(0).toUpperCase() + string.slice(1)
    }

    function getMask(size, offset) {
        var bin = ""
        while (offset--) bin += '0'
        while (size--) bin += '1'
        while (bin.length != baseWidth) bin += '0'
        return parseInt(bin.split("").reverse().join(""), 2)
    }

    function setMask(size, offset) {
        var bin = ""
        while (offset--) bin += '1'
        while (size--) bin += '0'
        while (bin.length != baseWidth) bin += '1'
        return parseInt(bin.split("").reverse().join(""), 2)
    }

    Column {
        Row {
            anchors.horizontalCenter: parent.horizontalCenter
            spacing: 6
            Rectangle {
                width: 80
                height: 50
                color: "lightgray"
                Text {
                    anchors.centerIn: parent
                    text: "new field"
                }
                MouseArea {
                    anchors.fill: parent
                    onClicked: myModel.append({ "name": "newField" + myModel.count, "size": 1})
                }
            }

            Rectangle {
                width: 80
                height: 50
                color: "lightgray"
                opacity: currentIndex > 0 ? 1 : 0.3
                Text {
                    anchors.centerIn: parent
                    text: "move up"
                }
                MouseArea {
                    enabled: parent.opacity == 1
                    anchors.fill: parent
                    onClicked: {
                        var newIndex = currentIndex -1
                        myModel.move(currentIndex, newIndex, 1)
                        currentIndex = newIndex
                    }
                }
            }

            Rectangle {
                width: 80
                height: 50
                color: "lightgray"
                opacity: (currentIndex > -1) && (currentIndex < (myModel.count - 1)) ? 1 : 0.3
                Text {
                    anchors.centerIn: parent
                    text: "move down"
                }
                MouseArea {
                    enabled: parent.opacity == 1
                    anchors.fill: parent
                    onClicked: {
                        var newIndex = currentIndex + 1
                        myModel.move(currentIndex, newIndex, 1)
                        currentIndex = newIndex
                    }
                }
            }

            Rectangle {
                width: 80
                height: 50
                color: "lightgray"
                opacity: currentIndex > -1 ? 1 : 0.3
                Text {
                    anchors.centerIn: parent
                    text: "delete field"
                }
                MouseArea {
                    enabled: parent.opacity == 1
                    anchors.fill: parent
                    onClicked: {
                        myModel.remove(currentIndex)
                        currentIndex = -1
                    }
                }
            }

            Rectangle {
                width: 80
                height: 50
                color: "lightgray"
                opacity: myModel.count > 0 ? 1 : 0.3
                Text {
                    anchors.centerIn: parent
                    text: "compile"
                }
                MouseArea {
                    anchors.fill: parent
                    onClicked: compile()
                }
            }

            Rectangle {
                width: 80
                height: 50
                color: "lightgray"
                Text {
                    anchors.centerIn: parent
                    text: "settings"
                }
                MouseArea {
                    anchors.fill: parent
                    onClicked: settings.visible = !settings.visible
                }
            }
        }

        Row {
            spacing: 10
            Rectangle {
                width: pow2Width
                height: 650

                Flickable {
                    clip: true
                    anchors.fill: parent
                    contentHeight: flow.childrenRect.height
                    contentWidth: parent.width

                    Flow {
                        id: flow
                        width: parent.width

                        Repeater {
                            model: myModel

                            delegate: Item {
                                width: size * bitWidth
                                height: 50

                                Rectangle {
                                    anchors.fill: parent
                                    color: size > baseWidth ? "red" : "darkgray"
                                    border.color: "black"
                                    border.width: 1
                                }
                                Rectangle {
                                    anchors.fill: parent
                                    color: "white"
                                    opacity: currentIndex === index ? 0.5 : 0
                                }
                                MouseArea {
                                    anchors.fill: parent
                                    onClicked: currentIndex = currentIndex == index ? -1 : index
                                }
                            }
                        }
                    }
                }
            }

            Rectangle {
                width: pow2Width
                height: 650

                ListView {
                    id: list
                    clip: true
                    anchors.fill: parent
                    model: myModel

                    delegate: Item {
                        width: pow2Width
                        height: 50

                        Rectangle {
                            anchors.fill: parent
                            color: size > baseWidth ? "red" : "darkgray"
                            border.color: "black"
                            border.width: 1


                        }
                        Rectangle {
                            anchors.fill: parent
                            color: "white"
                            opacity: currentIndex === index ? 0.5 : 0
                        }
                        MouseArea {
                            anchors.fill: parent
                            onClicked: currentIndex = currentIndex == index ? -1 : index
                        }
                        Row {
                            anchors.verticalCenter: parent.verticalCenter
                            x: 10
                            spacing: 10
                            TextField {
                                text: size
                                width: 50
                                validator: IntValidator { bottom: 1; top: baseWidth }
                                onEditingFinished: {
                                    myModel.setProperty(index, "size", parseInt(text))
                                }
                            }

                            TextField {
                                text: name
                                width: 176
                                validator: RegExpValidator { regExp: /([A-Za-z][a-z0-9]+)+/ }
                                onEditingFinished: {
                                    myModel.setProperty(index, "name", text)
                                }
                            }
                        }
                    }
                }
            }
        }
    }

    Rectangle {
        id: settings
        anchors.fill: parent
        color: "black"
        opacity: 0.9
        visible: false

        MouseArea {
            anchors.fill: parent
            onClicked: parent.visible = false
        }

        Column {
            anchors.horizontalCenter: parent.horizontalCenter
            spacing: 10
            y: 100
            Row {
                anchors.horizontalCenter: parent.horizontalCenter
                spacing: 10
                Rectangle {
                    width: 100
                    height: 50
                    color: "lightgray"
                    Text {
                        anchors.centerIn: parent
                        text: "base size:"
                    }
                }

                Rectangle {
                    width: 45
                    height: 50
                    color: baseWidth == 8 ? "red" : "lightgray"
                    Text {
                        anchors.centerIn: parent
                        text: "8"
                    }
                    MouseArea {
                        anchors.fill: parent
                        onClicked: baseWidth = 8
                    }
                }

                Rectangle {
                    width: 45
                    height: 50
                    color: baseWidth == 16 ? "red" : "lightgray"
                    Text {
                        anchors.centerIn: parent
                        text: "16"
                    }
                    MouseArea {
                        anchors.fill: parent
                        onClicked: baseWidth = 16
                    }
                }

                Rectangle {
                    width: 45
                    height: 50
                    color: baseWidth == 32 ? "red" : "lightgray"
                    Text {
                        anchors.centerIn: parent
                        text: "32"
                    }
                    MouseArea {
                        anchors.fill: parent
                        onClicked: baseWidth = 32
                    }
                }

                Rectangle {
                    width: 45
                    height: 50
                    color: baseWidth == 64 ? "red" : "lightgray"
                    Text {
                        anchors.centerIn: parent
                        text: "64"
                    }
                    MouseArea {
                        anchors.fill: parent
                        onClicked: baseWidth = 64
                    }
                }
            }

            Row {
                spacing: 10
                anchors.horizontalCenter: parent.horizontalCenter
                Rectangle {
                    width: 100
                    height: 50
                    color: "lightgray"
                    Text {
                        anchors.centerIn: parent
                        text: "member name:"
                    }
                }

                Rectangle {
                    width: 210
                    height: 50
                    color: "lightgray"
                    TextField {
                        anchors.centerIn: parent
                        text: memberName
                        width: 180
                        validator: RegExpValidator { regExp: /([A-Za-z][a-z0-9]+)+/ }
                        onEditingFinished: {
                            memberName = text
                        }
                    }
                }
            }

            Row {
                spacing: 10
                anchors.horizontalCenter: parent.horizontalCenter
                Rectangle {
                    width: 100
                    height: 50
                    color: "lightgray"
                    Text {
                        anchors.centerIn: parent
                        text: "format:"
                    }
                }

                Rectangle {
                    width: 100
                    height: 50
                    color: "lightgray"
                    Text {
                        anchors.centerIn: parent
                        text: "set"
                    }
                    MouseArea {
                        anchors.fill: parent
                        onClicked: {
                            format = form.text
                        }
                    }
                }

                Rectangle {
                    width: 100
                    height: 50
                    color: "lightgray"
                    Text {
                        anchors.centerIn: parent
                        text: "reset"
                    }
                    MouseArea {
                        anchors.fill: parent
                        onClicked: {
                            format = "BASETYPE GETNAME() const { return (DATA & GETMASK) >> OFFSET; }\nvoid SETNAME(BASETYPE v) { DATA = (DATA & SETMASK) | (v << OFFSET); }\n\n"
                            form.text = format
                        }
                    }
                }
            }

            TextArea {
                id: form
                width: 400
                height: 200
                text: format
                font.pointSize: 8
            }

            Rectangle {
                width: 100
                height: 50
                anchors.horizontalCenter: parent.horizontalCenter
                color: prefixGetter ? "red" : "lightgray"
                Text {
                    anchors.centerIn: parent
                    text: "prefix getter"
                }
                MouseArea {
                    anchors.fill: parent
                    onClicked: prefixGetter = !prefixGetter
                }
            }
        }
    }

    Rectangle {
        id: codeD
        anchors.fill: parent
        color: "black"
        opacity: 0.9
        visible: false

        Column {
            spacing: 20
            y: 50
            anchors.horizontalCenter: parent.horizontalCenter
            TextArea {
                id: codeField
                width: 400
                height: 550
                readOnly: true
            }

            Row {
                spacing: 20
                anchors.horizontalCenter: parent.horizontalCenter
                Rectangle {
                    width: 100
                    height: 50
                    color: "lightgray"
                    Text {
                        anchors.centerIn: parent
                        text: "copy"
                    }

                    MouseArea {
                        anchors.fill: parent
                        onClicked: {
                            codeField.selectAll()
                            codeField.copy()
                        }
                    }
                }

                Rectangle {
                    width: 100
                    height: 50
                    color: "lightgray"
                    Text {
                        anchors.centerIn: parent
                        text: "close"
                    }

                    MouseArea {
                        anchors.fill: parent
                        onClicked: {
                            codeD.visible = false
                        }
                    }
                }
            }
        }
    }
}