import Qt 4.7
import com.nokia.meego 1.0
+import QtWebKit 1.0
Item {
id: articlePage
+ property int buffer: 60
property string mainArticleId: parent.mainArticleId;
property string feedid: parent.feedid
property bool zoomEnabled: false
property bool vertPanningEnabled: true
width: parent.width; height: parent.height;
+ property int webviewFontSize: settings.webviewFontSize
- ListView {
- id: articleView;
- model: articlesModel;
- delegate: viewer;
- property int webviewFontSize: settings.webviewFontSize
- orientation: ListView.Horizontal
- width: parent.width;
- height: updateBarArticles.visible? parent.height-updateBarArticles.height : parent.height;
- //onCurrentIndexChanged: articleView.positionViewAtIndex(currentIndex, ListView.Contain)
- highlightRangeMode: ListView.StrictlyEnforceRange; snapMode: ListView.SnapOneItem
- cacheBuffer: width;
- onMovementStarted: articlePage.vertPanningEnabled=false;
- onMovementEnded: articlePage.vertPanningEnabled=true;
- highlightMoveDuration: 300;
- clip: true
- boundsBehavior: Flickable.DragOverBounds
-
- onCurrentIndexChanged: {
- if (currentIndex >= count-1) {
- articlesModel.append({articleid: controller.getNextId(feedid, articlesModel.get(currentIndex).articleid)})
+
+
+ Flipable {
+ id: flipable
+ front: flickableBack
+ back: flickableFront
+
+ width: parent.width
+ height: parent.height
+
+ property bool flipped: false
+ property int targetAngle: 0
+
+ state: "back"
+
+ transform: Rotation {
+ id: rotation
+ origin.x: flipable.width/2
+ origin.y: flipable.height/2
+ axis.x: 0; axis.y: 1; axis.z: 0 // set axis.y to 1 to rotate around y-axis
+ angle: 0 // the default angle
+ }
+
+ states: [State {
+ name: "back"
+ PropertyChanges { target: rotation; angle: 180 }
+ when: flipable.flipped
+ }, State {
+ name: "front"
+ PropertyChanges { target: rotation; angle: 0 }
+ when: !flipable.flipped
+ }]
+
+ transitions: Transition {
+ NumberAnimation { target: rotation; property: "angle"; easing.type: Easing.InOutQuad; duration: 500 }
+ }
+
+ function flipRight() {
+ targetAngle = rotation.angle + 180
+ flipable.flipped = !flipable.flipped
+ //flipped = !flipped
+ }
+
+ function flipLeft() {
+ targetAngle = rotation.angle - 180
+ flipable.flipped = !flipable.flipped
+ //flipped = !flipped
+ }
+ }
+
+ Flickable {
+ id: flickableFront
+ //anchors.fill: screen;
+ height: articlePage.height;
+ width: articlePage.width;
+ contentWidth: boundsRecFront.width
+ contentHeight: boundsRecFront.height
+ //contentWidth: childrenRect.width; contentHeight: childrenRect.height
+ //interactive: parent.vertPanningEnabled;
+
+ flickDeceleration: 1500;
+ //flickableDirection: Flickable.VerticalFlick
+
+ property bool contentIsReady: false
+ Rectangle {
+ id: boundsRecFront
+ color: "white"
+ width: webViewFront.width*webViewFront.scale + 2*buffer
+ height: Math.max(articlePage.height,webViewFront.height*webViewFront.scale)
+
+ WebView {
+ id: webViewFront
+ anchors.horizontalCenter: parent.horizontalCenter
+ //url: flipItem.url;
+ html: controller.getArticle(articlePage.feedid, articlePage.mainArticleId);
+ preferredWidth: articlePage.width
+ //preferredHeight: articleView.height
+ //scale: 1.25;
+ transformOrigin: Item.TopLeft
+ //scale: slider.value;
+ settings.defaultFontSize: articlePage.webviewFontSize
+
+ onLoadFinished: {
+ flickableFront.contentX = buffer //flickable.width/2
+ flickableFront.contentIsReady = true
+ flipable.flipRight();
+ }
+
+
+ }
+
+ // onFlickStarted: {
+ // console.log("start contentx"+contentX)
+ // console.log("start contenty"+contentY)
+ // }
+ }
+ Behavior on contentX {
+ id: contentXBehavior
+ enabled: flickableFront.contentIsReady
+ NumberAnimation { duration: 200 }
+ }
+ onMovingHorizontallyChanged: {
+ if (!movingHorizontally && (!atXBeginning || !atXEnd)) {
+ flickableFront.contentX = buffer //flickable.width/2
+ }
+ }
+
+ onAtXBeginningChanged: {
+ if (atXBeginning && contentIsReady) {
+ flickableBack.contentIsReady = false
+ //console.log("previous")
+ articlePage.mainArticleId = controller.getNextId(articlePage.feedid,articlePage.mainArticleId)
+// if (flipable.side == Flipable.Back) {
+// webViewFront.html = controller.getArticle(articlePage.feedid, articlePage.mainArticleId);
+// } else {
+ webViewBack.html = controller.getArticle(articlePage.feedid, articlePage.mainArticleId);
+// }
+ //flickableBack.contentY = 0
+ flickableFront.contentX = buffer
+ //flipable.flipped = !flipable.flipped
+ //flipable.flipLeft()
}
}
+ onAtXEndChanged: {
+ if (atXEnd && contentIsReady) {
+ //console.log("next")
+ flickableBack.contentIsReady = false
+ articlePage.mainArticleId = controller.getPreviousId(articlePage.feedid,articlePage.mainArticleId)
+// if (flipable.side == Flipable.Back) {
+// webViewFront.html = controller.getArticle(articlePage.feedid, articlePage.mainArticleId);
+// } else {
+ webViewBack.html = controller.getArticle(articlePage.feedid, articlePage.mainArticleId);
+// }
+ //flickableBack.contentY = 0
+ flickableFront.contentX = buffer
+ //flipable.flipped = !flipable.flipped
+ //flipable.flipRight();
+ }
+ }
+ }
+
+
+ Flickable {
+ id: flickableBack
+ //anchors.fill: screen;
+ height: articlePage.height;
+ width: articlePage.width;
+ contentWidth: boundsRecBack.width
+ contentHeight: boundsRecBack.height
+ //contentWidth: childrenRect.width; contentHeight: childrenRect.height
+ //interactive: parent.vertPanningEnabled;
+
+ flickDeceleration: 1500;
+ //flickableDirection: Flickable.VerticalFlick
+
+ property bool contentIsReady: false
+ Rectangle {
+ id: boundsRecBack
+ color: "white"
+ width: webViewBack.width*webViewBack.scale + 2*buffer // flickable.width
+ height: Math.max(articlePage.height,webViewBack.height*webViewBack.scale)
+
+ WebView {
+ id: webViewBack
+ anchors.horizontalCenter: parent.horizontalCenter
+ //url: flipItem.url;
+ preferredWidth: articlePage.width
+ //preferredHeight: articleView.height
+ //scale: 1.25;
+ transformOrigin: Item.TopLeft
+ //scale: slider.value;
+ settings.defaultFontSize: articlePage.webviewFontSize
+
+ onLoadFinished: {
+ flickableBack.contentX = buffer //flickable.width/2
+ flickableBack.contentIsReady = true
+ flipable.flipRight();
+ }
+
+
+ }
+
+ // onFlickStarted: {
+ // console.log("start contentx"+contentX)
+ // console.log("start contenty"+contentY)
+ // }
+ }
+ Behavior on contentX {
+ id: contentXBehaviorBack
+ enabled: flickableBack.contentIsReady
+ NumberAnimation { duration: 200 }
+ }
+ onMovingHorizontallyChanged: {
+ if (!movingHorizontally && (!atXBeginning || !atXEnd)) {
+ flickableBack.contentX = buffer //flickable.width/2
+ }
+ }
+
+ onAtXBeginningChanged: {
+ if (atXBeginning && contentIsReady) {
+ flickableFront.contentIsReady = false
+ //console.log("previous")
+ articlePage.mainArticleId = controller.getNextId(articlePage.feedid,articlePage.mainArticleId)
+// if (flipable.side == Flipable.Back) {
+ webViewFront.html = controller.getArticle(articlePage.feedid, articlePage.mainArticleId);
+// } else {
+// webViewBack.html = controller.getArticle(articlePage.feedid, articlePage.mainArticleId);
+// }
+ //flickableFront.contentY = 0
+ //flickableBack.contentX = buffer
+ //flipable.flipped = !flipable.flipped
+ //flipable.flipLeft()
+ }
+ }
+
+ onAtXEndChanged: {
+ if (atXEnd && contentIsReady) {
+ flickableFront.contentIsReady = false
+ //console.log("next")
+ articlePage.mainArticleId = controller.getPreviousId(articlePage.feedid,articlePage.mainArticleId)
+// if (flipable.side == Flipable.Back) {
+ webViewFront.html = controller.getArticle(articlePage.feedid, articlePage.mainArticleId);
+// } else {
+// webViewBack.html = controller.getArticle(articlePage.feedid, articlePage.mainArticleId);
+// }
+ //flickableFront.contentY = 0
+ //flickableBack.contentX = buffer
+ //flipable.flipped = !flipable.flipped
+ //flipable.flipRight();
+ }
+ }
+ }
+
+
+
+// ListView {
+// id: articleView;
+// model: articlesModel;
+// delegate: viewer;
+// property int webviewFontSize: settings.webviewFontSize
+// orientation: ListView.Horizontal
+// width: parent.width;
+// height: updateBarArticles.visible? parent.height-updateBarArticles.height : parent.height;
+// //onCurrentIndexChanged: articleView.positionViewAtIndex(currentIndex, ListView.Contain)
+// highlightRangeMode: ListView.StrictlyEnforceRange; snapMode: ListView.SnapOneItem
+// cacheBuffer: width;
+// onMovementStarted: articlePage.vertPanningEnabled=false;
+// onMovementEnded: articlePage.vertPanningEnabled=true;
+// highlightMoveDuration: 300;
+// clip: true
+// boundsBehavior: Flickable.DragOverBounds
+
+// onCurrentIndexChanged: {
+// if (currentIndex >= count-1) {
+// articlesModel.append({articleid: controller.getNextId(feedid, articlesModel.get(currentIndex).articleid)})
+// }
+// }
+
// onCountChanged: {
// if (count == 3) {
// articleView.currentIndex = 1
// }
// }
- }
+// }
ProgressBar {
id: updateBarArticles