import QtQuick
import Weave.Controls
import Weave.Templates as T

T.PanelWindow {
    id: windowId

    x: dockX - dock.leftInset
    y: dockY - dock.topInset
    width: dock.width
    height: dock.height

    resizeMargin: Theme.semantic.spacing.xxs/2

    opacity: dragging ? 0.6 : 1

    dock {
        leftInset: shadowId.radius
        rightInset: shadowId.radius
        topInset: shadowId.radius
        bottomInset: shadowId.radius

        width: Math.max(dock.minimumWidth, dockWidth) + dock.leftInset + dock.rightInset
        height: Math.max(dock.minimumHeight, dockHeight) + dock.topInset + dock.bottomInset

        minimumWidth: dock.contentItem ? dock.contentItem.TableLayout.minimumWidth : dock.implicitContentWidth
        minimumHeight: dock.contentItem ? dock.contentItem.TableLayout.minimumHeight : dock.implicitContentHeight
        preferredWidth: dock.contentItem ? dock.contentItem.TableLayout.preferredWidth : dock.implicitContentWidth
        preferredHeight: dock.contentItem ? dock.contentItem.TableLayout.preferredHeight : dock.implicitContentHeight

        contentItem: TableLayoutColumn {
            id: contentId

            horizontalItemFillMode: TableLayout.Preferred
            verticalItemFillMode: TableLayout.Maximum

            T.PanelDockHeader {
                implicitHeight: Theme.component.iconbutton.height
                visible: contentVisible
                dock: windowId.dock
                background: Rectangle {
                    id: headerBackgroundId

                    color: Theme.semantic.backgroundColor.header

                    Rectangle {
                        y: headerBackgroundId.height - height

                        width: headerBackgroundId.width
                        height: Theme.component.divider.borderWidth
                        color: Theme.component.divider.light.borderColor
                    }
                }
            }

            Flickable {
                id: flickableId

                contentWidth: rowId.width
                contentHeight: rowId.height

                clip: contentWidth > width || contentHeight > height || contentX !== originX || contentY !== originY

                TableLayout.minimumWidth: rowId.minimumColumnWidth
                TableLayout.minimumHeight: rowId.minimumHeight
                TableLayout.preferredWidth: rowId.preferredWidth
                TableLayout.preferredHeight: rowId.preferredHeight
                TableLayout.verticalFillMode: TableLayout.Preferred

                TableLayoutRow  {
                    id: rowId

                    width: Math.max(flickableId.width, minimumWidth)
                    height: Math.max(flickableId.height, minimumHeight)

                    horizontalItemFillMode: TableLayout.Preferred
                    verticalItemFillMode: TableLayout.Preferred

                    Repeater {
                        model: windowId.dock.contentModel
                    }
                }
            }
        }

        background: Rectangle {
            color: Theme.semantic.backgroundColor.surface._100
        }
    }

    contentItem.children: BoxShadow {
        id: shadowId
        z: -1
        width: windowId.width
        height: windowId.height

        source: Theme.semantic.shadow.high
    }

    data: T.CellBackground {
        parent: windowId.dock.dropTarget
        anchors.fill: parent

        borderColor: Theme.generic.color.blue._400._100
        borderWidth: Theme.generic.borderWidth._4

        leftBorderWidth: (windowId.dock.dropAlignment & Qt.AlignLeft) ? undefined : 0
        rightBorderWidth: (windowId.dock.dropAlignment & Qt.AlignRight) ? undefined : 0
        topBorderWidth: (windowId.dock.dropAlignment & Qt.AlignTop) ? undefined : 0
        bottomBorderWidth: (windowId.dock.dropAlignment & Qt.AlignBottom) ? undefined : 0

        TableLayout.exclude: true
    }
}