import QtQuick 2.0
import Ubuntu.Components 0.1

/*!
    \brief MainView with Tabs element.
           First Tab has a single Label and
           second Tab has a single ToolbarAction.
*/

MainView {
    // objectName for functional testing purposes (autopilot-qt5)
    objectName: "mainView"
    // Note! applicationName needs to match the .desktop filename
    applicationName: "helloworldtabbed"

    width: units.gu(100)
    height: units.gu(75)

    Component {
        id: helloTab
        Page {
                        Column {
                            anchors.fill: parent
                            Label {
                                text: i18n.tr("Swipe from right to left to change tab.")
                            }
                       }
                    }
    }

    Tabs {
        id: tabs

        // First tab begins here
        Tab {
            objectName: "Tab1"

            title: i18n.tr("Hello..")

            // Tab content begins here
            page:
// Works if uncommenting these lines
//                Page {
//                                Column {
//                                    anchors.fill: parent
//                                    Label {
//                                        text: i18n.tr("Swipe from right to left to change tab.")
//                                    }
//                               }
//                            }

// And commenting away these lines
                Loader {
                    sourceComponent: helloTab
                }
        }

        // Second tab begins here
        Tab {
            objectName: "Tab2"

            title: i18n.tr("..Toolbar!")
            page: Page {
                tools: ToolbarActions {
                    Action {
                        objectName: "action"

                        iconSource: Qt.resolvedUrl("toolbarIcon.png")
                        text: i18n.tr("Tap me!")

                        onTriggered: {
                            label.text = i18n.tr("Toolbar tapped")
                        }
                    }
                }

                Column {
                    anchors.centerIn: parent
                    Label {
                        id: label
                        objectName: "label"

                        text: i18n.tr("Swipe from bottom to up to reveal the toolbar.")
                    }
                }
            }
        }
    }
}