import QtQuick 2.5
// import QtQuick.Window 2.2
// import "assets" as Assets
// import "assets/scripts/utils.js" as Utils

Rectangle {
  id: root
  visible: true
  width: 200
  height: 200
  // radius: width / 2
  state: "red"

  states: [
    State {
      name: "red"
      PropertyChanges {
        target: root
        color: "red"
      }
    },

    State {
      name: "green"
      PropertyChanges {
        target: root
        color: "green"
      }
    },

    State {
      name: "blue"
      PropertyChanges {
        target: root
        color: "blue"
      }
    }
  ]

  transitions: [
    Transition {
      ColorAnimation {
        duration: 500
      }
    }
  ]

  Timer {
    id: timer
    interval: 3000
    repeat: true
    property int index: 0

    onTriggered: {
      ++index
      if (index == root.states.length) {
        index = 0
      }
      root.state = root.states[index].name
    }
  }

  Component.onCompleted: {
    timer.start()
  }
}