// import QtQuick 1.0 // to target S60 5th Edition or Maemo 5
import QtQuick 1.0
import "../Shared"


Item{
    id: main
    anchors.fill: parent

    Rectangle {
        id: popularPage
        width: parent.width
        height: parent.height - navBar.height
        anchors.top: navBar.top

        Component {
            id: popularDelegate

            Item {
                width: popularView.width; height: 162
                clip: true

                MouseArea {
                anchors.fill: parent
                onClicked: {
                    clickMovie(id)
                    pageModel.pageRequested("MovieCard/MovieCard.qml")
                    showSpinner()

                }
                }

                Row {
                    anchors.verticalCenter: parent.verticalCenter
                    spacing: 20

                    Column {
                        Image {
                            source: img_path
                            width: 100
                            height: 152
                            fillMode: Image.PreserveAspectCrop
                            x: 7
                            onStatusChanged: {
                                if(status==Image.Ready)
                                    hideSpinner()
                                else if(status==Image.Error)
                                    hideSpinner()
                            }
                         }
                    }
                    Column {
                        Text {
                            text: title
                            color: "#e60040"
                            font.family: mainFont.name
                            font.pointSize: 6.0
                            font.weight: Font.Bold
                            anchors.left: parent.left
                            anchors.leftMargin: 0
                            width: main.width-150
                            wrapMode: Text.WordWrap
                        }

                        Text {
                            text: desc
                            color: "#000000"
                            font.family: mainFont.name
                            font.pointSize: 5.0
                            anchors.left: parent.left
                            anchors.leftMargin: 0
                        }
                        Text {
                            id: point_desc
                            text: country+", "+year
                            color: "#000000"
                            font.family: mainFont.name
                            font.pointSize: 5.0
                            anchors.left: parent.left
                            anchors.leftMargin: 0
                        }

                        Text {
                            id: point_ivi
                            opacity: vsblivi
                            text: "ivi.ru  "+ivi_rating
                            color: "#000000"
                            font.family: mainFont.name
                            font.pointSize: 5.0
                            anchors.left: parent.left
                            anchors.top: point_desc.top
                            anchors.topMargin: 25
                            anchors.leftMargin: 0
                        }
                        Rectangle{
                            id: star
                            opacity: vsblivi
                            anchors.left: point_ivi.right
                            anchors.top: point_ivi.top
                            anchors.topMargin: 2
                            anchors.leftMargin: 4
                            width: 73
                            height: 13
                            color: "#bcbcbc"
                            Rectangle{
                                width: ivi_rating*12+((ivi_ratingint-1)*3)
                                height: 12
                                color: "#e60040"
                            }
                            Image {
                                source: "./images/star4.png"
                                smooth: true
                            }
                        }

                        Text {
                            id: point_imdb
                            opacity: vsblimdb
                            text: "IMDb  "+imdb_rating+"/10"
                            color: "#000000"
                            font.family: mainFont.name
                            font.pointSize: 5.0
                            anchors.left: parent.left
                            anchors.top: point_ivi.top
                            anchors.topMargin: anchorsimdb
                            anchors.leftMargin: 0
                        }

                        Text {
                            text: "Кинопоиск.ру  "+kp_rating+"/10"
                            opacity: vsblkp
                            color: "#000000"
                            font.family: mainFont.name
                            font.pointSize: 5.0
                            anchors.left: parent.left
                            anchors.top: point_imdb.top
                            anchors.topMargin: anchorskp
                            anchors.leftMargin: 0
                        }

                     }
                }
                Image {
                    anchors.verticalCenter: parent.verticalCenter
                    anchors.right: parent.right
                    anchors.rightMargin: 9
                    source: "./images/pop_arrow.png"
                    smooth: true

                    MouseArea {
                    anchors.fill: parent
                    onClicked: {
                        clickMovie(id)
                        pageModel.pageRequested("MovieCard/MovieCard.qml")
                        showSpinner()
                    }
                    }
                }
                Rectangle {
                    width: main.width
                    height: 1
                    color: "#ededed"
                    anchors.top: parent.top
                    anchors.topMargin: 161
                }
           }

       }

       ListView {
            id: popularView
            anchors.fill: parent
            anchors.topMargin: navBar.height
            model: popularModel
            delegate: popularDelegate

            footer:
                Rectangle {
                id: more
                opacity: 1
                height: 60; width: parent.width

                OpacityButton{
                    id: moreButton
                    width: 65
                    height: 40
                    anchors.centerIn: parent
                    radiusOfButton: 8
                    textLabel: "Ещё"
                    textSize: 6
                    onClicked: {
                        showSpinner()
                        addPopular()
                    }
                }
            }
        }
    }

    NavBar{
    id: navBar
    navBarTitle: "Популярное"
    }
}