rework StationCreator page2

make use of artistchartsmodel

data/qml/GridView.qml

@@ -1,6 +1,6 @@
 import QtQuick 1.1
 //import tomahawk 1.0
-//import "tomahawkimports"
+import "tomahawkimports"
 
 Rectangle {
     anchors.fill: parent

data/qml/StationCreatorPage1.qml

@@ -10,13 +10,12 @@ Item {
 
     signal itemClicked(int index)
 
-    Text {
+    HeaderLabel {
         text: "Listen to radio..."
-        color: "white"
         anchors {
             left: parent.left
             top: parent.top
-            margins: height * 2
+            margins: defaultFontHeight * 2
         }
     }
 

data/qml/StationCreatorPage2.qml

@@ -0,0 +1,44 @@
+import QtQuick 1.1
+import tomahawk 1.0
+import "tomahawkimports"
+
+Item {
+    id: root
+
+    property int margins: defaultFontHeight * 2
+
+    property alias content: contentLoader.source
+
+    signal back()
+    signal next()
+
+    Loader {
+        id: contentLoader
+        anchors {
+            left: parent.left
+            top: parent.top
+            right: parent.right
+            bottom: backButton.top
+            margins: root.margins
+        }
+    }
+
+    Connections {
+        target: contentLoader.item
+
+        onDone: root.next()
+    }
+
+    RoundedButton  {
+        id: backButton
+        text: "<"
+        height: defaultFontHeight * 4
+        anchors {
+            left:parent.left
+            bottom: parent.bottom
+            margins: root.margins
+        }
+
+        onClicked: root.back()
+    }
+}

data/qml/StationScene.qml

@@ -10,9 +10,9 @@ Rectangle {
 
     ListModel {
         id: modeModel
-        ListElement { label: "By Artist"; image: "../images/artist-placeholder-grid.png"; creatorState: "artist" }
-        ListElement { label: "By Genre"; image: "../images/album-placeholder-grid.png"; creatorState: "genre" }
-        ListElement { label: "By Year"; image: "image://albumart/foobar"; creatorState: "year" }
+        ListElement { label: "By Artist"; image: "../images/artist-placeholder-grid.png"; creatorContent: "stations/CreateByArtist.qml" }
+        ListElement { label: "By Genre"; image: "../images/album-placeholder-grid.png"; creatorContent: "genre" }
+        ListElement { label: "By Year"; image: "image://albumart/foobar"; creatorContent: "year" }
     }
 
     ListModel {
@@ -39,18 +39,6 @@ Rectangle {
         ListElement { modelData: "drum and base" }
     }
 
-    ListModel {
-        id: dummyArtistModel
-        ListElement { modelData: "Pink Floyd" }
-        ListElement { modelData: "Tool" }
-        ListElement { modelData: "Cake" }
-        ListElement { modelData: "Metallica" }
-        ListElement { modelData: "Red Hot Chili Peppers" }
-        ListElement { modelData: "Korn" }
-        ListElement { modelData: "Prodigy" }
-        ListElement { modelData: "Otto Waalkes" }
-    }
-
     VisualItemModel {
         id: stationVisualModel
 
@@ -60,12 +48,12 @@ Rectangle {
             model: modeModel
 
             onItemClicked: {
-                stationCreator.state = modeModel.get(index).creatorState
+                stationCreator.content = modeModel.get(index).creatorContent
                 stationListView.incrementCurrentIndex()
             }
         }
 
-        StationCreator {
+        StationCreatorPage2 {
             id: stationCreator
             height: scene.height
             width: scene.width

data/qml/stations/CreateByArtist.qml

@@ -0,0 +1,63 @@
+import QtQuick 1.1
+import tomahawk 1.0
+import "../tomahawkimports"
+
+Item {
+    id: root
+    anchors.fill: parent
+
+    signal done()
+
+    ListModel {
+        id: dummyArtistModel
+        ListElement { modelData: "Pink Floyd" }
+        ListElement { modelData: "Tool" }
+        ListElement { modelData: "Cake" }
+        ListElement { modelData: "Metallica" }
+        ListElement { modelData: "Red Hot Chili Peppers" }
+        ListElement { modelData: "Korn" }
+        ListElement { modelData: "Prodigy" }
+        ListElement { modelData: "Otto Waalkes" }
+    }
+
+    Column {
+        id: upperColumn
+        anchors.fill: parent
+        anchors.bottomMargin: defaultFontHeight
+        spacing: defaultFontHeight
+
+        HeaderLabel {
+            id: headerText
+            text: "Create station by artist..."
+        }
+
+        Row {
+            width: defaultFontHeight * 15
+            height: artistInputField.height
+            spacing: defaultFontHeight
+
+            InputField {
+                id: artistInputField
+                width: parent.width - createFromInputButton.width - parent.spacing
+            }
+
+            RoundedButton {
+                id: createFromInputButton
+                text: ">"
+                height: artistInputField.height
+            }
+        }
+
+        ArtistView {
+            height: parent.height - headerText.height - artistInputField.height
+            width: defaultFontHeight * 15
+            model: artistChartsModel
+            clip: true
+
+            onItemClicked: {
+                mainView.startStationFromArtist(artistChartsModel.itemFromIndex(index).artistName)
+                root.done()
+            }
+        }
+    }
+}

data/qml/tomahawkimports/ArtistView.qml

@@ -0,0 +1,44 @@
+import QtQuick 1.1
+import tomahawk 1.0
+
+ListView {
+    id: root
+
+    signal itemClicked(int index)
+
+    delegate: Item {
+        width: parent.width
+        height: defaultFontHeight * 3
+
+        Rectangle {
+            anchors.fill: parent
+            radius: defaultFontHeight / 2
+            gradient: Gradient {
+                GradientStop { position: 0.0; color: "#00FFFFFF" }
+                GradientStop { position: 1.0; color: "#55FFFFFF" }
+            }
+        }
+
+        Row {
+            anchors.fill: parent
+            spacing: defaultFontHeight
+
+            CoverImage {
+                height: parent.height
+                width: height
+                showLabels: false
+                artworkId: model.coverID
+            }
+            Text {
+                text: model.artistName
+                color: "white"
+                anchors.verticalCenter: parent.verticalCenter
+            }
+        }
+
+        MouseArea {
+            anchors.fill: parent
+            onClicked: root.itemClicked(index)
+        }
+    }
+}

data/qml/tomahawkimports/CoverImage.qml

@@ -171,7 +171,7 @@ Item {
     Image {
         id: playButton
         visible: showPlayButton ? (mouseArea.containsMouse || currentlyPlaying) : false
-        source: currentlyPlaying ? "../images/pause-rest.png" : "../images/play-rest.png"
+        source: currentlyPlaying ? "../../images/pause-rest.png" : "../../images/play-rest.png"
         anchors.centerIn: parent
         height: mirroredCover.height / 5
         width: height

data/qml/tomahawkimports/HeaderLabel.qml

@@ -0,0 +1,7 @@
+import QtQuick 1.1
+
+Text {
+    color: "white"
+    font.pointSize: defaultFontSize + 5
+    font.bold: true
+}

data/qml/tomahawkimports/RoundedButton.qml

@@ -7,6 +7,9 @@ Rectangle {
     radius: height / 2
     color: buttonMouseArea.containsMouse ? "#22ffffff" : "black"
 
+    height: defaultFontHeight * 2
+    width: height
+
     property string text
 
     signal clicked()