Merge lp:~nik90/cliffhanger/design-fixes-lucas-1 into lp:~flashback-dev/cliffhanger/trunk

[Nekhelesh Ramananthan]

Design fixes proposed by Lucas Romero

Design fixes proposed by Lucas Romero

[lp:~nik90/cliffhanger/design-fixes-lucas-1]

47. By Nekhelesh Ramananthan on 2014-03-17

Merged trunk

48. By Nekhelesh Ramananthan on 2014-03-17

Replaced actors and production listview with expandables

49. By Nekhelesh Ramananthan on 2014-03-17

Added a placeholder text when biography is empty

50. By Nekhelesh Ramananthan on 2014-03-17

Added high res actors placeholder image by Andrea

=== modified file 'components/Carousel.qml'
--- components/Carousel.qml	2014-03-08 14:09:52 +0000
+++ components/Carousel.qml	2014-03-17 19:29:33 +0000
@@ -32,8 +32,8 @@
     // Carousel Data Model
     property alias dataModel: carouselList.model
 
-    // Carousel Thumbnail size
-    property int size: units.gu(12)
+    // Carousel Thumbnail size (On the phone, show 2 + 2/3 cover art always by dynamically adjusting the size)
+    property real size: parent.width < units.gu(50) ? (3 * (parent.width - 2*carouselList.spacing))/8 : units.gu(17)
 
     // Property to hold the watched status
     property bool showTraktUserStatus: false
@@ -55,7 +55,7 @@
         id: carouselList
 
         width: parent.width
-        height: carousel.size + units.gu(10)
+        height: 1.5*carousel.size + units.gu(5)
         orientation: Qt.Horizontal
         spacing: units.gu(2)
 
@@ -87,7 +87,7 @@
                 Thumbnail {
                     id: carouselThumb
                     width: carousel.size
-                    height: carousel.size + units.gu(5)
+                    height: 1.5*carousel.size
                     thumbSource: thumb_url
                 }
 

=== modified file 'components/DetailCarousel.qml'
--- components/DetailCarousel.qml	2014-03-08 14:09:52 +0000
+++ components/DetailCarousel.qml	2014-03-17 19:29:33 +0000
@@ -33,8 +33,8 @@
     // Carousel Data Model
     property alias dataModel: _carouselList.model
 
-    // Carousel Thumbnail size
-    property int size: units.gu(15)
+    // Carousel Thumbnail size (On the phone, show 2 + 2/3 cover art always by dynamically adjusting the size)
+    property int size: parent.width < units.gu(50) ? (3 * (parent.width - 2*_carouselList.spacing))/8 : units.gu(17)
 
     // Property to show/hide date
     property bool showDate: true
@@ -56,14 +56,14 @@
         id: _carouselList
 
         width: parent.width
-        height: _detailCarousel.size + units.gu(12)
+        height: 1.5*_detailCarousel.size + units.gu(5)
         orientation: Qt.Horizontal
         spacing: units.gu(2)
 
         // Element consists of a Picture and a text label below it.
         delegate: Item {
             id: _carouselItem
-            width: _detailCarousel.size + units.gu(1)
+            width: _detailCarousel.size
             height: _thumbColumn.height
 
             Column {
@@ -74,8 +74,8 @@
                 Thumbnail {
                     id: _carouselThumb
                     radius: "medium"
-                    width: _carouselItem.width
-                    height: _detailCarousel.size + units.gu(7)
+                    width: _detailCarousel.size
+                    height: 1.5*_detailCarousel.size
                     thumbSource: thumb_url
 
                     Item {

=== added file 'components/ListViewExpandable.qml'
--- components/ListViewExpandable.qml	1970-01-01 00:00:00 +0000
+++ components/ListViewExpandable.qml	2014-03-17 19:29:33 +0000
@@ -0,0 +1,80 @@
+/*
+ * Flashback - Entertainment app for Ubuntu
+ * Copyright (C) 2014 Nekhelesh Ramananthan <[e-mail]>
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License version 3 as
+ * published by the Free Software Foundation.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program.  If not, see <http://www.gnu.org/licenses/>.
+ *
+ */
+
+import QtQuick 2.0
+import Ubuntu.Components 0.1
+import Ubuntu.Components.ListItems 0.1
+
+// Expandable List Element
+Expandable {
+    id: listviewExpandable
+
+    // Property to set the model of the search results listview
+    property alias model: _resultsList.model
+
+    // Property to set the label of the search category header
+    property alias header: _header.text
+
+    // Property to store the number of the search results
+    property int count
+
+    // Property to set the listitem delegate
+    property alias delegateItem: _resultsList.delegate
+
+    collapseOnClick: true
+    enabled: count !== 0
+    visible: count !== 0
+    onClicked: expanded = true
+    expandedHeight: _contentColumn.height + units.gu(1)
+
+    Column {
+        id: _contentColumn
+        anchors {
+            left: parent.left
+            right: parent.right
+        }
+
+        Item {
+            anchors {
+                left: parent.left
+                right: parent.right
+            }
+
+            height: listviewExpandable.collapsedHeight
+
+            Label {
+                id: _header
+                anchors {
+                    left: parent.left
+                    right: parent.right
+                    verticalCenter: parent.verticalCenter
+                }
+            }
+        }
+
+        ListView {
+            id: _resultsList
+            clip: true
+            height: count > 5 ? 5 * units.gu(6) : count * units.gu(6)
+            anchors {
+                left: parent.left
+                right: parent.right
+            }
+        }
+    }
+}

=== modified file 'components/RatingChooser.qml'
--- components/RatingChooser.qml	2014-03-08 14:09:52 +0000
+++ components/RatingChooser.qml	2014-03-17 19:29:33 +0000
@@ -51,11 +51,10 @@
     }
 
     color: "Black"
-    opacity: 0.85
     visible: false
     radius: units.gu(2)
     width: parent.width/1.6
-    height: parent.height/1.2    
+    height: parent.height/1.2
 
     TraktRatingModel { id: ratingListModel }
 

=== removed file 'components/SearchCategory.qml'
--- components/SearchCategory.qml	2014-03-14 09:06:47 +0000
+++ components/SearchCategory.qml	1970-01-01 00:00:00 +0000
@@ -1,85 +0,0 @@
-/*
- * Flashback - Entertainment app for Ubuntu
- * Copyright (C) 2014 Nekhelesh Ramananthan <[e-mail]>
- *
- * This program is free software: you can redistribute it and/or modify
- * it under the terms of the GNU General Public License version 3 as
- * published by the Free Software Foundation.
- *
- * This program is distributed in the hope that it will be useful,
- * but WITHOUT ANY WARRANTY; without even the implied warranty of
- * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
- * GNU General Public License for more details.
- *
- * You should have received a copy of the GNU General Public License
- * along with this program.  If not, see <http://www.gnu.org/licenses/>.
- *
- */
-
-import QtQuick 2.0
-import Ubuntu.Components 0.1
-import Ubuntu.Components.ListItems 0.1
-
-// Expandable Search Category Element
-Expandable {
-    id: searchExpandableCategory
-
-    // Property to set the model of the search results listview
-    property alias model: _searchResultsList.model
-
-    // Property to set the label of the search category header
-    property alias header: _header.text
-
-    // Property to store the number of the search results
-    property int count
-
-    signal resultClicked(var model)
-
-    collapseOnClick: true
-    enabled: count !== 0
-    visible: count !== 0
-    onClicked: expanded = true
-    expandedHeight: _contentColumn.height + units.gu(1)
-    
-    Column {
-        id: _contentColumn
-        anchors {
-            left: parent.left
-            right: parent.right
-        }
-        
-        Item {
-            anchors {
-                left: parent.left
-                right: parent.right
-            }
-
-            height: searchExpandableCategory.collapsedHeight
-
-            Label {
-                id: _header
-                anchors {
-                    left: parent.left
-                    right: parent.right
-                    verticalCenter: parent.verticalCenter
-                }
-            }
-        }
-        
-        ListView {
-            id: _searchResultsList
-            clip: true
-            height: count > 5 ? 5 * units.gu(6) : count * units.gu(6)
-            anchors {
-                left: parent.left
-                right: parent.right
-            }
-            
-            delegate: Standard {
-                text: name
-                iconSource: thumb_url
-                onClicked: searchExpandableCategory.resultClicked(model)
-            }
-        }
-    }
-}

=== modified file 'components/Thumbnail.qml'
--- components/Thumbnail.qml	2014-03-08 14:09:52 +0000
+++ components/Thumbnail.qml	2014-03-17 19:29:33 +0000
@@ -30,7 +30,7 @@
     
     image: Image {
         id: thumbPic
-        fillMode: Image.PreserveAspectFit
+        fillMode: Image.PreserveAspectCrop
         smooth: true
     }
     

=== modified file 'ui/PersonPage.qml'
--- ui/PersonPage.qml	2014-03-08 14:09:52 +0000
+++ ui/PersonPage.qml	2014-03-17 19:29:33 +0000
@@ -261,52 +261,40 @@
                 margins: units.gu(2)
             }
 
-            Header {
-                text: i18n.tr("Acting")
-                visible: personCast.count > 0
-            }
-
-            ListView {
-                id: personCastView
+            ListViewExpandable {
+                id: actingExpandable
                 model: personCast.model
-
-                anchors {
-                    left: parent.left
-                    right: parent.right
-                }
-
-                height: units.gu(20)
-                clip: true
-                delegate: Subtitled {
+                count: personCast.model.count
+                header: "Acting (%1)".arg(count)
+                delegateItem: Subtitled {
                     iconSource: thumb_url
                     text: title
                     subText: character
                     onClicked: mediaType == "movie" ? pageStack.push(Qt.resolvedUrl("MoviePage.qml"), {"movie_id": id}) : undefined
                 }
-            }
-
-            Header {
-                text: i18n.tr("Production")
-                visible: personCrew.count > 0
-            }
-
-            ListView {
-                id: personCrewView
+                anchors {
+                    left: parent.left
+                    right: parent.right
+                    margins: -detailsColumn.anchors.margins
+                }
+            }
+
+            ListViewExpandable {
+                id: productionExpandable
                 model: personCrew.model
-
-                anchors {
-                    left: parent.left
-                    right: parent.right
-                }
-
-                height: units.gu(20)
-                clip: true
-                delegate: Subtitled {
+                count: personCrew.model.count
+                header: "Production (%1)".arg(count)
+                delegateItem: Subtitled {
                     iconSource: thumb_url
                     text: title
                     subText: department
                     onClicked: mediaType == "movie" ? pageStack.push(Qt.resolvedUrl("MoviePage.qml"), {"movie_id": id}) : undefined
                 }
+                anchors {
+                    left: parent.left
+                    right: parent.right
+                    margins: -detailsColumn.anchors.margins
+                }
             }
         }
     }

=== modified file 'ui/SearchAll.qml'
--- ui/SearchAll.qml	2014-03-14 09:06:47 +0000
+++ ui/SearchAll.qml	2014-03-17 19:29:33 +0000
@@ -18,6 +18,7 @@
 
 import QtQuick 2.0
 import Ubuntu.Components 0.1
+import Ubuntu.Components.ListItems 0.1
 import "../backend/backend.js" as Backend
 import "../components"
 import "../models"
@@ -73,28 +74,40 @@
                 topMargin: units.gu(4)
             }
 
-            SearchCategory {
+            ListViewExpandable {
                 id: movieExpandable
                 model: movie_search_results.model
                 count: movie_search_results.model.count
                 header: "Movies (%1)".arg(count)
-                onResultClicked: pageStack.push(Qt.resolvedUrl("MoviePage.qml"), {"movie_id": model.id})
+                delegateItem: Standard {
+                    text: name
+                    iconSource: thumb_url
+                    onClicked: pageStack.push(Qt.resolvedUrl("MoviePage.qml"), {"movie_id": model.id})
+                }
             }
 
-            SearchCategory {
+            ListViewExpandable {
                 id: showExpandable
                 model: show_search_results.model
                 count: show_search_results.model.count
                 header: "TV Shows (%1)".arg(count)
-                onResultClicked: pageStack.push(Qt.resolvedUrl("TvPage.qml"), {"tv_id": model.id})
+                delegateItem: Standard {
+                    text: name
+                    iconSource: thumb_url
+                    onClicked: pageStack.push(Qt.resolvedUrl("TvPage.qml"), {"tv_id": model.id})
+                }
             }
 
-            SearchCategory {
+            ListViewExpandable {
                 id: personExpandable
                 model: person_search_results.model
                 count: person_search_results.model.count
                 header: "Celebs (%1)".arg(count)
-                onResultClicked: pageStack.push(Qt.resolvedUrl("PersonPage.qml"), {"person_id": model.id, "type": "person"})
+                delegateItem: Standard {
+                    text: name
+                    iconSource: thumb_url
+                    onClicked: pageStack.push(Qt.resolvedUrl("PersonPage.qml"), {"person_id": model.id, "type": "person"})
+                }
             }
         }
     }