[ Harmattan] start to implement pictures in articles list, as propose…

…d in issue #42
Huessenbergnetz · Jun 19, 2014 · 5402f83 · 5402f83
1 parent d86a43c
commit 5402f83
Show file tree

Hide file tree

Showing 6 changed files with 174 additions and 130 deletions.
diff --git a/engine/occonfiguration.cpp b/engine/occonfiguration.cpp
@@ -63,6 +63,7 @@ QVariantMap OcConfiguration::getConfig()
     config["fontsize"] = settings.value("display/fontsize", DEFAULT_FONT_SIZE).toInt();
     config["hidereadfeeds"] = settings.value("display/hidereadfeeds", false).toBool();
     config["showExcerpts"] = settings.value("display/excerpts", false).toBool();
+    config["showPicturesInList"] = settings.value("display/picturesInList", false).toBool();
     config["updatebehavior"] = settings.value("update/behavior", "0");
     config["updateinterval"] = settings.value("update/interval", "3600");
     config["eventfeeds"] = settings.value("event/feeds", "");
@@ -109,6 +110,7 @@ void OcConfiguration::saveConfig(const QVariantMap &config)
     settings.setValue("display/fontsize", config["fontsize"]);
     settings.setValue("display/hidereadfeeds", config["hidereadfeeds"]);
     settings.setValue("display/excerpts", config["showExcerpts"]);
+    settings.setValue("display/picturesInList", config["showPicturesInList"]);
     settings.setValue("update/behavior", config["updatebehavior"]);
     settings.setValue("update/interval", config["updateinterval"]);
     settings.setValue("event/feeds", config["eventfeeds"]);

diff --git a/reader/common/models/ocitemsmodelsql.cpp b/reader/common/models/ocitemsmodelsql.cpp
@@ -16,6 +16,7 @@ const char* OcItemsModelSql::COLUMN_NAMES[] = {
     "url",
     "guidHash",
     "excerpt",
+    "image",
     NULL
 };
 
@@ -104,9 +105,15 @@ void OcItemsModelSql::refresh(const QString &feedId, int handleRead, bool sortAs
                                  "it.guidHash, ");
 
     if (config.getSetting("display/excerpts", false).toBool()) {
-        queryString.append("it.body AS excerpt ");
+        queryString.append("it.body AS excerpt, ");
     } else {
-        queryString.append("'' AS excerpt ");
+        queryString.append("'' AS excerpt, ");
+    }
+
+    if (config.getSetting("display/picturesInList", false).toBool()) {
+        queryString.append("(SELECT DISTINCT path FROM images WHERE parentId = it.id AND height > 50 ORDER BY width, height LIMIT 1) AS image ");
+    } else {
+        queryString.append("'' AS image ");
     }
 
     queryString.append(QString("FROM items it WHERE feedId = %1").arg(feedId.toInt()));

diff --git a/reader/common/models/ocspecialitemsmodelsql.cpp b/reader/common/models/ocspecialitemsmodelsql.cpp
@@ -16,6 +16,7 @@ const char* OcSpecialItemsModelSql::COLUMN_NAMES[] = {
     "feedId",
     "feedName",
     "excerpt",
+    "image",
     NULL
 };
 
@@ -94,9 +95,15 @@ void OcSpecialItemsModelSql::refresh(const QString &type, const QString &folderI
     querystring.append("(SELECT title FROM feeds where id = it.feedId) as feedName, ");
 
     if (config.getSetting("display/excerpts", false).toBool()) {
-        querystring.append("it.body AS excerpt ");
+        querystring.append("it.body AS excerpt, ");
     } else {
-        querystring.append("'' AS excerpt ");
+        querystring.append("'' AS excerpt, ");
+    }
+
+    if (config.getSetting("display/picturesInList", false).toBool()) {
+        querystring.append("(SELECT DISTINCT path FROM images WHERE parentId = it.id AND height > 50 ORDER BY width, height LIMIT 1) AS image ");
+    } else {
+        querystring.append("'' AS image ");
     }
 
 

diff --git a/reader/harmattan/qml/ocNewsReader/Delegates/ItemListDelegate.qml b/reader/harmattan/qml/ocNewsReader/Delegates/ItemListDelegate.qml
@@ -45,69 +45,76 @@ Item {
     }
 
     Row {
-            spacing: UI.LIST_ITEM_SPACING
-            anchors { left: parent.left; leftMargin: 24; right: parent.right }
-
-            Column {
-                id: textCol
-                width: parent.width - iconCol.width
-
-                Label {
-                    id: mainText
-                    text: model.title
-                    width: itemListItem.width - 60
-                    font.family: itemListItem.titleFont
-                    font.weight: itemListItem.titleWeight
-                    font.pixelSize: itemListItem.titleSize
-                    color: mouseArea.pressed ? itemListItem.titleColorPressed : itemListItem.titleColor
-                    maximumLineCount: 2
-                    elide: Text.ElideRight
-                    textFormat: Text.PlainText
-                }
-
-                Label {
-                    id: excerptText
-                    text: model.excerpt
-                    width: itemListItem.width - 60
-                    font.family: itemListItem.subtitleFont
-                    font.weight: itemListItem.subtitleWeight
-                    font.pixelSize: itemListItem.titleSize
-                    color: itemListItem.subtitleColor
-                    maximumLineCount: 3
-                    elide: Text.ElideRight
-                    textFormat: Text.PlainText
-                    visible: text !== ""
-                }
-
-                Label {
-                    id:dateText
-                    text: model.pubDate
-                    font.family: itemListItem.subtitleFont
-                    font.weight: itemListItem.subtitleWeight
-                    font.pixelSize: itemListItem.subtitleSize
-                    color: model.unread == "true" ? "#f78500" : itemListItem.subtitleColor
-                    textFormat: Text.PlainText
-                }
+        spacing: UI.LIST_ITEM_SPACING
+        anchors { left: parent.left; leftMargin: 24; right: parent.right }
+
+        Column {
+            id: textCol
+            width: parent.width - iconCol.width
+
+            Label {
+                id: mainText
+                text: model.title
+                width: itemListItem.width - 60
+                font.family: itemListItem.titleFont
+                font.weight: itemListItem.titleWeight
+                font.pixelSize: itemListItem.titleSize
+                color: mouseArea.pressed ? itemListItem.titleColorPressed : itemListItem.titleColor
+                maximumLineCount: 2
+                elide: Text.ElideRight
+                textFormat: Text.PlainText
             }
 
-    }
-
-    Column {
-        id: iconCol
-        width: 32
+            Label {
+                id: excerptText
+                text: model.excerpt
+                width: itemListItem.width - 60
+                font.family: itemListItem.subtitleFont
+                font.weight: itemListItem.subtitleWeight
+                font.pixelSize: itemListItem.titleSize
+                color: itemListItem.subtitleColor
+                maximumLineCount: 3
+                elide: Text.ElideRight
+                textFormat: Text.PlainText
+                visible: text !== ""
+            }
 
-        Image {
-            visible: model.starred
-            width: 32
-            height: 32
-            source: "image://theme/icon-s-common-favorite-mark" + (theme.inverted? "-inverse" : "")
+            Label {
+                id:dateText
+                text: model.pubDate
+                font.family: itemListItem.subtitleFont
+                font.weight: itemListItem.subtitleWeight
+                font.pixelSize: itemListItem.subtitleSize
+                color: model.unread == "true" ? "#f78500" : itemListItem.subtitleColor
+                textFormat: Text.PlainText
+            }
         }
 
-        Image {
-            visible: model.enclosureLink != ""
-            width: 32
-            height: 32
-            source: "image://theme/icon-m-content-attachment" + (theme.inverted? "-inverse" : "")
+        Column {
+            id: iconCol
+            width: Math.max(articlePic.width, 32)
+
+            Image {
+                visible: model.starred
+                width: 32
+                height: 32
+                source: "image://theme/icon-s-common-favorite-mark" + (theme.inverted? "-inverse" : "")
+            }
+
+            Image {
+                visible: model.enclosureLink !== ""
+                width: 32
+                height: 32
+                source: "image://theme/icon-m-content-attachment" + (theme.inverted? "-inverse" : "")
+            }
+
+            Image {
+                id: articlePic
+                visible: model.image !== ""
+                source: model.image
+                width: visible ? 0 : 80
+                fillMode: Image.PreserveAspectCrop
+            }
         }
     }
 

diff --git a/reader/harmattan/qml/ocNewsReader/Delegates/SpecialItemListDelegate.qml b/reader/harmattan/qml/ocNewsReader/Delegates/SpecialItemListDelegate.qml
@@ -26,6 +26,8 @@ Item {
     height: Math.max(textCol.height, iconCol.height)
     width: parent.width
 
+    Component.onCompleted: console.log("IMAGE: " + model.image)
+
     BorderImage {
             id: background
             anchors { fill: parent; leftMargin: -UI.MARGIN_XLARGE; rightMargin: -UI.MARGIN_XLARGE }
@@ -42,82 +44,89 @@ Item {
     }
 
     Row {
-            anchors { left: parent.left; leftMargin: 24; right: parent.right }
-            spacing: UI.LIST_ITEM_SPACING
-
-            Column {
-                id: textCol
-                width: parent.width - iconCol.width
-
-                Label {
-                    id: mainText
-                    text: model.title
-                    width: specialItemListItem.width - 60
-                    font.family: specialItemListItem.titleFont
-                    font.weight: specialItemListItem.titleWeight
-                    font.pixelSize: specialItemListItem.titleSize
-                    color: mouseArea.pressed ? specialItemListItem.titleColorPressed : specialItemListItem.titleColor
-                    maximumLineCount: 2
-                    elide: Text.ElideRight
-                    textFormat: Text.PlainText
-                }
+        anchors { left: parent.left; leftMargin: 24; right: parent.right }
+        spacing: UI.LIST_ITEM_SPACING
+
+        Column {
+            id: textCol
+            width: parent.width - iconCol.width
+
+            Label {
+                id: mainText
+                text: model.title
+                width: specialItemListItem.width - 60
+                font.family: specialItemListItem.titleFont
+                font.weight: specialItemListItem.titleWeight
+                font.pixelSize: specialItemListItem.titleSize
+                color: mouseArea.pressed ? specialItemListItem.titleColorPressed : specialItemListItem.titleColor
+                maximumLineCount: 2
+                elide: Text.ElideRight
+                textFormat: Text.PlainText
+            }
 
-                Label {
-                    id: excerptText
-                    text: model.excerpt
-                    width: specialItemListItem.width - 60
-                    font.family: specialItemListItem.subtitleFont
-                    font.weight: specialItemListItem.subtitleWeight
-                    font.pixelSize: specialItemListItem.titleSize
-                    color: specialItemListItem.subtitleColor
-                    maximumLineCount: 3
-                    elide: Text.ElideRight
-                    textFormat: Text.PlainText
-                    visible: text !== ""
-                }
+            Label {
+                id: excerptText
+                text: model.excerpt
+                width: specialItemListItem.width - 60
+                font.family: specialItemListItem.subtitleFont
+                font.weight: specialItemListItem.subtitleWeight
+                font.pixelSize: specialItemListItem.titleSize
+                color: specialItemListItem.subtitleColor
+                maximumLineCount: 3
+                elide: Text.ElideRight
+                textFormat: Text.PlainText
+                visible: text !== ""
+            }
 
 
-                Label {
-                    id:feedNameText
-                    text: model.feedName
-                    font.family: specialItemListItem.subtitleFont
-                    font.weight: specialItemListItem.subtitleWeight
-                    font.pixelSize: 19
-                    color: specialItemListItem.subtitleColor
-                    width: parent.width
-                    elide: Text.ElideRight
-                    textFormat: Text.PlainText
+            Label {
+                id:feedNameText
+                text: model.feedName
+                font.family: specialItemListItem.subtitleFont
+                font.weight: specialItemListItem.subtitleWeight
+                font.pixelSize: 19
+                color: specialItemListItem.subtitleColor
+                width: parent.width
+                elide: Text.ElideRight
+                textFormat: Text.PlainText
                 }
 
-                Label {
-                    id:dateText
-                    text: model.pubDate
-                    font.family: specialItemListItem.subtitleFont
-                    font.weight: specialItemListItem.subtitleWeight
-                    font.pixelSize: specialItemListItem.subtitleSize
-                    color: model.unread == "true" ? "#f78500" : specialItemListItem.subtitleColor
-                    textFormat: Text.PlainText
-                }
+            Label {
+                id:dateText
+                text: model.pubDate
+                font.family: specialItemListItem.subtitleFont
+                font.weight: specialItemListItem.subtitleWeight
+                font.pixelSize: specialItemListItem.subtitleSize
+                color: model.unread == "true" ? "#f78500" : specialItemListItem.subtitleColor
+                textFormat: Text.PlainText
             }
+        }
 
-    }
+        Column {
+            id: iconCol
+            width: model.image ? 80 : 32
 
-    Column {
-        id: iconCol
-        width: 32
+            Image {
+                visible: model.starred
+                width: 32
+                height: 32
+                source: "image://theme/icon-s-common-favorite-mark" + (theme.inverted? "-inverse" : "")
+            }
 
-        Image {
-            visible: model.starred
-            width: 32
-            height: 32
-            source: "image://theme/icon-s-common-favorite-mark" + (theme.inverted? "-inverse" : "")
-        }
+            Image {
+                visible: model.enclosureLink != ""
+                width: 32
+                height: 32
+                source: "image://theme/icon-m-content-attachment" + (theme.inverted? "-inverse" : "")
+            }
 
-        Image {
-            visible: model.enclosureLink != ""
-            width: 32
-            height: 32
-            source: "image://theme/icon-m-content-attachment" + (theme.inverted? "-inverse" : "")
+            Image {
+                id: articlePic
+                visible: model.image !== ""
+                source: model.image
+                width: visible ? 0 : 80
+                fillMode: Image.PreserveAspectCrop
+            }
         }
     }