import QtQuick 2.0
import Sailfish.Silica 1.0
import QtGraphicalEffects 1.0
//import "../../helpers/jsFunctions.js" as JS

Column {
    property string stationImage: "" //stationImage
    property string stationLabel: ""   //imagelabel
    property bool flag: false
    property string flagimage: ""    //flagimage
    spacing: Theme.paddingMedium
    Rectangle {
        width: parent.width
        height: width
        color: Theme.overlayBackgroundColor
        border.color: Theme.rgba(Theme.highlightBackgroundColor, 0.8)
        anchors.horizontalCenter: parent.horizontalCenter
        //onWidthChanged: console.log(" *********** WIDTH: "+width)
  /*      BusyIndicator {
            z:99
            size: BusyIndicatorSize.Medium
            anchors.centerIn: stationimage
            running: stationimage.loading && stationImage !== ""//appActive && stationimage.status != Image.Ready
        } */
        Image {
            property bool loading: false
            id: stationimage
                width: parent.width - (Theme.paddingSmall * 2)
                height: width
                anchors.centerIn: parent
                fillMode: Image.PreserveAspectFit
                visible: false
                source: stationImage ? stationImage : ""// ? stationImage : stationimage.visible = false

         /*      BusyIndicator {
                    size: BusyIndicatorSize.Medium
                    anchors.centerIn: stationimage
                    running: stationimage.status != Image.Ready && stationimage.visible//appActive && stationimage.status != Image.Ready
                } */
               onStatusChanged:
                    switch(stationimage.status){
                    case Image.Null:
                        loading = false
                        visible = false
                        break;
                    case Image.Ready:
                        loading = false
                        visible = true
                        break;
                    case Image.Loading:
                        loading = true
                        break;
                    case Image.Error:
                        loading = false
                        visible = false
                        break;
                    default:
                        loading = false
                        visible = false
                    }
            }
        Label {
            id: stationlabel
            anchors.fill: stationimage
            anchors.margins: Theme.paddingMedium
            visible: !stationimage.visible
            horizontalAlignment: Text.AlignHCenter
            verticalAlignment: Text.AlignVCenter
            elide: Text.ElideRight
            width: parent.width - (parent.border.width * 2)
            height: width
            text: stationLabel ? stationLabel : "No Tag"//lastcheckok == "1" ? name : " [DOWN] "+name
            color: stationlabel === "1" ? Theme.lightPrimaryColor : Theme.secondaryColor
            wrapMode: Text.WordWrap
            maximumLineCount: 4
            //font.strikeout: lastcheckok == "1" ? false : true
            font.pixelSize: Theme.fontSizeHuge
            fontSizeMode: Text.Fit
            font.bold: false
            opacity: 0.5

        }
        Glow {
            id: stationglow
            visible: stationlabel.visible
            radius: Math.round((parent.width / Screen.width) * 10)
            samples: radius * 2
            spread: 0.7//parent.width / Screen.width

            transparentBorder: true
            color: Theme.secondaryHighlightColor//JS.getRandomColor()
            source: stationlabel
            anchors.fill: stationlabel
        }
        Image {
            id:countryImage
            visible: flag
            width: Theme.itemSizeSmall * 0.5
            anchors.top: stationimage.visible ? stationimage.top : parent.top
            anchors.right: stationimage.visible ? stationimage.right : parent.right
            anchors.margins: Theme.paddingMedium
            fillMode: Image.PreserveAspectFit
            source: flagimage
        }
    }
}