vcs.maemo.org Git - feedingit/blob - psa_harmattan/feedingit/qml/Articles.qml

   1 import Qt 4.7
   2 import com.nokia.meego 1.0
   3 import QtWebKit 1.0
   4
   5 Item {
   6     id: articlePage
   7     property int buffer: 60
   8     property string mainArticleId: parent.mainArticleId;
   9     property string feedid: parent.feedid
  10     property bool zoomEnabled: false
  11     property bool vertPanningEnabled: true
  12     width: parent.width; height: parent.height;
  13     property int webviewFontSize: settings.webviewFontSize
  14
  15
  16
  17     Flipable {
  18         id: flipable
  19         front: flickableBack
  20         back: flickableFront
  21
  22         width: parent.width
  23         height: parent.height
  24
  25         property bool flipped: false
  26         property int targetAngle: 0
  27
  28         state: "back"
  29
  30         transform: Rotation {
  31             id: rotation
  32             origin.x: flipable.width/2
  33             origin.y: flipable.height/2
  34             axis.x: 0; axis.y: 1; axis.z: 0     // set axis.y to 1 to rotate around y-axis
  35             angle: 0    // the default angle
  36         }
  37
  38         states: [State {
  39             name: "back"
  40             PropertyChanges { target: rotation; angle: 180 }
  41             when: flipable.flipped
  42         }, State {
  43                 name: "front"
  44                 PropertyChanges { target: rotation; angle: 0 }
  45                 when: !flipable.flipped
  46         }]
  47
  48         transitions: Transition {
  49             NumberAnimation { target: rotation; property: "angle"; easing.type: Easing.InOutQuad; duration: 500 }
  50         }
  51
  52         function flipRight() {
  53             targetAngle = rotation.angle + 180
  54             flipable.flipped = !flipable.flipped
  55             //flipped = !flipped
  56         }
  57
  58         function flipLeft() {
  59             targetAngle = rotation.angle - 180
  60             flipable.flipped = !flipable.flipped
  61             //flipped = !flipped
  62         }
  63     }
  64
  65     Flickable {
  66         id: flickableFront
  67         //anchors.fill: screen;
  68         height: articlePage.height;
  69         width: articlePage.width;
  70         contentWidth: boundsRecFront.width
  71         contentHeight: boundsRecFront.height
  72         //contentWidth: childrenRect.width; contentHeight: childrenRect.height
  73         //interactive: parent.vertPanningEnabled;
  74
  75         flickDeceleration: 1500;
  76         //flickableDirection: Flickable.VerticalFlick
  77
  78         property bool contentIsReady: false
  79         Rectangle {
  80             id: boundsRecFront
  81             color: "white"
  82             width: webViewFront.width*webViewFront.scale + 2*buffer
  83             height: Math.max(articlePage.height,webViewFront.height*webViewFront.scale)
  84
  85             WebView {
  86                 id: webViewFront
  87                 anchors.horizontalCenter: parent.horizontalCenter
  88                 //url: flipItem.url;
  89                 html: controller.getArticle(articlePage.feedid, articlePage.mainArticleId);
  90                 preferredWidth: articlePage.width
  91                 //preferredHeight: articleView.height
  92                 //scale: 1.25;
  93                 transformOrigin: Item.TopLeft
  94                 //scale: slider.value;
  95                 settings.defaultFontSize: articlePage.webviewFontSize
  96
  97                 onLoadFinished: {
  98                     flickableFront.contentX = buffer //flickable.width/2
  99                     flickableFront.contentIsReady = true
 100                     flipable.flipRight();
 101                 }
 102
 103
 104             }
 105
 106     //        onFlickStarted: {
 107     //            console.log("start contentx"+contentX)
 108     //            console.log("start contenty"+contentY)
 109     //        }
 110         }
 111         Behavior on contentX {
 112             id: contentXBehavior
 113             enabled: flickableFront.contentIsReady
 114             NumberAnimation { duration: 200 }
 115         }
 116         onMovingHorizontallyChanged: {
 117             if (!movingHorizontally && (!atXBeginning || !atXEnd)) {
 118                 flickableFront.contentX = buffer //flickable.width/2
 119             }
 120         }
 121
 122         onAtXBeginningChanged: {
 123             if (atXBeginning && contentIsReady) {
 124                 flickableBack.contentIsReady = false
 125                 //console.log("previous")
 126                 articlePage.mainArticleId = controller.getNextId(articlePage.feedid,articlePage.mainArticleId)
 127 //                if (flipable.side == Flipable.Back) {
 128 //                    webViewFront.html = controller.getArticle(articlePage.feedid, articlePage.mainArticleId);
 129 //                } else {
 130                     webViewBack.html = controller.getArticle(articlePage.feedid, articlePage.mainArticleId);
 131 //                }
 132                 //flickableBack.contentY = 0
 133                 flickableFront.contentX = buffer
 134                 //flipable.flipped = !flipable.flipped
 135                 //flipable.flipLeft()
 136             }
 137         }
 138
 139         onAtXEndChanged: {
 140             if (atXEnd && contentIsReady) {
 141                 //console.log("next")
 142                 flickableBack.contentIsReady = false
 143                 articlePage.mainArticleId = controller.getPreviousId(articlePage.feedid,articlePage.mainArticleId)
 144 //                if (flipable.side == Flipable.Back) {
 145 //                    webViewFront.html = controller.getArticle(articlePage.feedid, articlePage.mainArticleId);
 146 //                } else {
 147                     webViewBack.html = controller.getArticle(articlePage.feedid, articlePage.mainArticleId);
 148 //                }
 149                 //flickableBack.contentY = 0
 150                 flickableFront.contentX = buffer
 151                 //flipable.flipped = !flipable.flipped
 152                 //flipable.flipRight();
 153             }
 154         }
 155     }
 156
 157
 158     Flickable {
 159         id: flickableBack
 160         //anchors.fill: screen;
 161         height: articlePage.height;
 162         width: articlePage.width;
 163         contentWidth: boundsRecBack.width
 164         contentHeight: boundsRecBack.height
 165         //contentWidth: childrenRect.width; contentHeight: childrenRect.height
 166         //interactive: parent.vertPanningEnabled;
 167
 168         flickDeceleration: 1500;
 169         //flickableDirection: Flickable.VerticalFlick
 170
 171         property bool contentIsReady: false
 172         Rectangle {
 173             id: boundsRecBack
 174             color: "white"
 175             width: webViewBack.width*webViewBack.scale + 2*buffer // flickable.width
 176             height: Math.max(articlePage.height,webViewBack.height*webViewBack.scale)
 177
 178             WebView {
 179                 id: webViewBack
 180                 anchors.horizontalCenter: parent.horizontalCenter
 181                 //url: flipItem.url;
 182                 preferredWidth: articlePage.width
 183                 //preferredHeight: articleView.height
 184                 //scale: 1.25;
 185                 transformOrigin: Item.TopLeft
 186                 //scale: slider.value;
 187                 settings.defaultFontSize: articlePage.webviewFontSize
 188
 189                 onLoadFinished: {
 190                     flickableBack.contentX = buffer //flickable.width/2
 191                     flickableBack.contentIsReady = true
 192                     flipable.flipRight();
 193                 }
 194
 195
 196             }
 197
 198     //        onFlickStarted: {
 199     //            console.log("start contentx"+contentX)
 200     //            console.log("start contenty"+contentY)
 201     //        }
 202         }
 203         Behavior on contentX {
 204             id: contentXBehaviorBack
 205             enabled: flickableBack.contentIsReady
 206             NumberAnimation { duration: 200 }
 207         }
 208         onMovingHorizontallyChanged: {
 209             if (!movingHorizontally && (!atXBeginning || !atXEnd)) {
 210                 flickableBack.contentX = buffer //flickable.width/2
 211             }
 212         }
 213
 214         onAtXBeginningChanged: {
 215             if (atXBeginning && contentIsReady) {
 216                 flickableFront.contentIsReady = false
 217                 //console.log("previous")
 218                 articlePage.mainArticleId = controller.getNextId(articlePage.feedid,articlePage.mainArticleId)
 219 //                if (flipable.side == Flipable.Back) {
 220                     webViewFront.html = controller.getArticle(articlePage.feedid, articlePage.mainArticleId);
 221 //                } else {
 222 //                    webViewBack.html = controller.getArticle(articlePage.feedid, articlePage.mainArticleId);
 223 //                }
 224                 //flickableFront.contentY = 0
 225                 //flickableBack.contentX = buffer
 226                 //flipable.flipped = !flipable.flipped
 227                 //flipable.flipLeft()
 228             }
 229         }
 230
 231         onAtXEndChanged: {
 232             if (atXEnd && contentIsReady) {
 233                 flickableFront.contentIsReady = false
 234                 //console.log("next")
 235                 articlePage.mainArticleId = controller.getPreviousId(articlePage.feedid,articlePage.mainArticleId)
 236 //                if (flipable.side == Flipable.Back) {
 237                     webViewFront.html = controller.getArticle(articlePage.feedid, articlePage.mainArticleId);
 238 //                } else {
 239 //                    webViewBack.html = controller.getArticle(articlePage.feedid, articlePage.mainArticleId);
 240 //                }
 241                 //flickableFront.contentY = 0
 242                 //flickableBack.contentX = buffer
 243                 //flipable.flipped = !flipable.flipped
 244                 //flipable.flipRight();
 245             }
 246         }
 247     }
 248
 249
 250
 251 //    ListView {
 252 //        id: articleView;
 253 //        model: articlesModel;
 254 //        delegate: viewer;
 255 //        property int webviewFontSize: settings.webviewFontSize
 256 //        orientation: ListView.Horizontal
 257 //        width: parent.width;
 258 //        height: updateBarArticles.visible? parent.height-updateBarArticles.height : parent.height;
 259 //        //onCurrentIndexChanged: articleView.positionViewAtIndex(currentIndex, ListView.Contain)
 260 //        highlightRangeMode: ListView.StrictlyEnforceRange; snapMode: ListView.SnapOneItem
 261 //        cacheBuffer: width;
 262 //        onMovementStarted: articlePage.vertPanningEnabled=false;
 263 //        onMovementEnded: articlePage.vertPanningEnabled=true;
 264 //        highlightMoveDuration: 300;
 265 //        clip: true
 266 //        boundsBehavior: Flickable.DragOverBounds
 267
 268 //        onCurrentIndexChanged: {
 269 //            if (currentIndex >= count-1) {
 270 //                articlesModel.append({articleid: controller.getNextId(feedid, articlesModel.get(currentIndex).articleid)})
 271 //            }
 272 //        }
 273
 274 //        onCountChanged: {
 275 //            if (count == 3) {
 276 //                articleView.currentIndex = 1
 277 //            }
 278 //        }
 279 //    }
 280
 281     ProgressBar {
 282         id: updateBarArticles
 283         minimumValue: 0
 284         maximumValue: 100
 285         value: window.updateProgressValue
 286         visible: window.isUpdateInProgress
 287         width: parent.width
 288         anchors.bottom: parent.bottom
 289     }
 290
 291     ListModel {
 292         id: articlesModel
 293
 294
 295
 296     }
 297
 298     Component {
 299         id: viewer
 300         Item {
 301             id: flipItem;
 302             width: articleDisplay.width;
 303             height: articleView.height;
 304
 305             //property string url: (articleView.visible && Math.abs(articleView.currentIndex-index)<2) ? path: "";
 306             property string html: controller.getArticle(articlePage.feedid, articleid)
 307             ArticleDisplay {
 308                 id: articleDisplay
 309                 zoomEnabled: articlePage.zoomEnabled;
 310                 property bool vertPanningEnabled: articlePage.vertPanningEnabled;
 311
 312                 states: [ State {
 313                         name: 'articleIsRead';
 314                     when: articleView.currentIndex == index;
 315                     StateChangeScript {
 316                         name: "myScript"
 317                         script: {
 318                             //flipItem.url=path;
 319                             controller.setEntryRead(articlePage.feedid, articleid)
 320 //                            if (articlesModel.count==1) {
 321 //                                timer.start()
 322 //                            }
 323                         }
 324                     }
 325                     }
 326                 ]
 327             }
 328         }
 329     }
 330
 331     Component.onCompleted: {
 332         articlesModel.append({articleid: mainArticleId})
 333         //articlesModel.append({articleid: controller.getPreviousId(feedid, mainArticleId)})
 334
 335         //articleView.currentIndex = 1
 336     }
 337
 338 //    Timer {
 339 //        id: timer
 340 //        interval: 500; running: false; repeat: false
 341 //        onTriggered: {
 342 //            articlesModel.insert(0,{articleid: controller.getNextId(feedid, mainArticleId)})
 343 //            articlesModel.append({articleid: controller.getPreviousId(feedid, mainArticleId)})
 344 //        }
 345 //    }
 346
 347 }