diff options
author | Martin Jones <martin.jones@nokia.com> | 2009-04-30 03:26:05 (GMT) |
---|---|---|
committer | Martin Jones <martin.jones@nokia.com> | 2009-04-30 03:26:05 (GMT) |
commit | 0ee6bf1226f3069f117d0b0b75df14ddf38e75de (patch) | |
tree | 01a63f8585790624e1746ba1b43cd91731699e42 /examples | |
parent | 0a4b78de06b60a5fc0a9182687ded099968c4055 (diff) | |
parent | 0282ea19722c247157c652ef9122379f0e715497 (diff) | |
download | Qt-0ee6bf1226f3069f117d0b0b75df14ddf38e75de.zip Qt-0ee6bf1226f3069f117d0b0b75df14ddf38e75de.tar.gz Qt-0ee6bf1226f3069f117d0b0b75df14ddf38e75de.tar.bz2 |
Merge branch 'kinetic-declarativeui' of git@scm.dev.nokia.troll.no:qt/kinetic into kinetic-declarativeui
Diffstat (limited to 'examples')
101 files changed, 4172 insertions, 1432 deletions
diff --git a/examples/declarative/contacts/contacts.qml b/examples/declarative/contacts/contacts.qml index fa50010..f9901ed 100644 --- a/examples/declarative/contacts/contacts.qml +++ b/examples/declarative/contacts/contacts.qml @@ -24,7 +24,7 @@ Rect { } Image { id: portraitPic - src: portrait + source: portrait x: 10 y: 10 } diff --git a/examples/declarative/dial/DialLibrary/Dial.qml b/examples/declarative/dial/DialLibrary/Dial.qml index 8336a70..fe8528d 100644 --- a/examples/declarative/dial/DialLibrary/Dial.qml +++ b/examples/declarative/dial/DialLibrary/Dial.qml @@ -8,14 +8,14 @@ Item { } Image { id: Background - src: "background.svg" + source: "background.svg" } Item { x: 104 y: 102 rotation: Needle.rotation Image { - src: "needle_shadow.svg" + source: "needle_shadow.svg" x: -104 y: -102 } @@ -31,12 +31,12 @@ Item { source: Math.min(Math.max(-130, value*2.2 - 130), 133) } Image { - src: "needle.svg" + source: "needle.svg" x: -102 y: -98 } } Image { - src: "overlay.svg" + source: "overlay.svg" } } diff --git a/examples/declarative/listview/content/MediaButton.qml b/examples/declarative/listview/content/MediaButton.qml index c92305a..6c672ea 100644 --- a/examples/declarative/listview/content/MediaButton.qml +++ b/examples/declarative/listview/content/MediaButton.qml @@ -7,8 +7,8 @@ <Property name="text"/> </properties> - <Image id="Image" src="pics/button.png"/> - <Image id="Pressed" src="pics/button-pressed.png" opacity="0"/> + <Image id="Image" source="pics/button.png"/> + <Image id="Pressed" source="pics/button-pressed.png" opacity="0"/> <MouseRegion id="MouseRegion" anchors.fill="{Image}" onClicked="Container.clicked.emit();"/> <Text font.bold="true" color="white" anchors.centeredIn="{Image}" text="{Container.text}"/> <width>{Image.width}</width> diff --git a/examples/declarative/listview/recipes.qml b/examples/declarative/listview/recipes.qml index 0f6324f..db8604e 100644 --- a/examples/declarative/listview/recipes.qml +++ b/examples/declarative/listview/recipes.qml @@ -54,7 +54,7 @@ Rect { width: parent.width Image { id: recipePic - src: picture + source: picture width: 48 height: 48 } @@ -115,13 +115,13 @@ Rect { Image { anchors.right: flick.right anchors.top: flick.top - src: "content/pics/moreUp.png" + source: "content/pics/moreUp.png" opacity: flick.atYBeginning ? 0 : 1 } Image { anchors.right: flick.right anchors.bottom: flick.bottom - src: "content/pics/moreDown.png" + source: "content/pics/moreDown.png" opacity: flick.atYEnd ? 0 : 1 } } diff --git a/examples/declarative/minehunt/Explosion.qml b/examples/declarative/minehunt/Explosion.qml index 1e4f03d..8d868bc 100644 --- a/examples/declarative/minehunt/Explosion.qml +++ b/examples/declarative/minehunt/Explosion.qml @@ -9,7 +9,7 @@ Item { height: 21 lifeSpan: 3600000 lifeSpanDeviation: 0 - src: "pics/star.png" + source: "pics/star.png" count: 200 angle: 270 angleDeviation: 360 diff --git a/examples/declarative/minehunt/minehunt.qml b/examples/declarative/minehunt/minehunt.qml index 20c3874..fb65fa3 100644 --- a/examples/declarative/minehunt/minehunt.qml +++ b/examples/declarative/minehunt/minehunt.qml @@ -6,14 +6,14 @@ <resources> <Component id="tile"> <Flipable id="flipable" width="40" height="40"> - <transform> - <AxisRotation id="axis" axis.startX="20" axis.endX="20" axis.startY="20" axis.endY="0" /> - </transform> + <axis> + <Axis startX="20" startY="20" endX="20" endY="0" /> + </axis> <front> - <Image src="pics/front.png" width="40" height="40"> + <Image source="pics/front.png" width="40" height="40"> <Image anchors.horizontalCenter="{parent.horizontalCenter}" anchors.verticalCenter="{parent.verticalCenter}" - src="pics/flag.png" opacity="{modelData.hasFlag}"> + source="pics/flag.png" opacity="{modelData.hasFlag}"> <opacity> <Behaviour> <NumericAnimation property="opacity" duration="250"/> @@ -23,34 +23,34 @@ </Image> </front> <back> - <Image src="pics/back.png" width="40" height="40"> + <Image source="pics/back.png" width="40" height="40"> <Text anchors.horizontalCenter="{parent.horizontalCenter}" anchors.verticalCenter="{parent.verticalCenter}" text="{modelData.hint}" color="white" font.bold="true" opacity="{modelData.hasMine == false && modelData.hint > 0}"/> <Image anchors.horizontalCenter="{parent.horizontalCenter}" anchors.verticalCenter="{parent.verticalCenter}" - src="pics/bomb.png" opacity="{modelData.hasMine}"/> + source="pics/bomb.png" opacity="{modelData.hasMine}"/> <Explosion anchors.horizontalCenter="{parent.horizontalCenter}" anchors.verticalCenter="{parent.verticalCenter}" explode="{modelData.hasMine==true && modelData.flipped==true}"/> </Image> </back> <states> <State name="back" when="{modelData.flipped == true}"> - <SetProperty target="{axis}" property="angle" value="180" /> + <SetProperty target="{flipable}" property="rotation" value="180" /> </State> </states> <transitions> <Transition> <SequentialAnimation> <PauseAnimation duration="{var ret = Math.abs(flipable.parent.x-field.clickx) + Math.abs(flipable.parent.y-field.clicky); if (ret > 0) {if(modelData.hasMine==true && modelData.flipped==true){ret*3;}else{ret;}} else {0}}"/> - <NumericAnimation easing="easeInOutQuad" properties="angle"/> + <NumericAnimation easing="easeInOutQuad" properties="rotation"/> </SequentialAnimation> </Transition> </transitions> <MouseRegion anchors.fill="{parent}" - onClicked="field.clickx = flipable.parent.x; field.clicky = flipable.parent.y; row = Math.floor(index/9); col = index - (Math.floor(index/9) * 9); if(mouseButton==undefined || mouseButton=='Right'){flag(row,col);}else{flip(row,col);}" /> + onClicked="field.clickx = flipable.parent.x; field.clicky = flipable.parent.y; row = Math.floor(index/9); col = index - (Math.floor(index/9) * 9); if(mouse.button==undefined || mouse.button==Qt.RightButton){flag(row,col);}else{flip(row,col);}" /> </Flipable> </Component> </resources> - <Image src="pics/No-Ones-Laughing-3.jpg" tile="true"/> + <Image source="pics/No-Ones-Laughing-3.jpg" tile="true"/> <Description text="Use the 'minehunt' executable to run this demo!" width="300" opacity="{tiles?0:1}" anchors.horizontalCenter="{parent.horizontalCenter}" anchors.verticalCenter="{parent.verticalCenter}"/> <Repeater dataSource="{tiles}" x="1" y="1"> <Component> @@ -61,12 +61,12 @@ </Repeater> <Item id="gamedata" width="370" height="100" y="380"> <Text color="white" font.size="18" x="20" y="20">In play:</Text> - <Image x="100" y="20" src="pics/bomb-color.png"/> + <Image x="100" y="20" source="pics/bomb-color.png"/> <Text x="100" y="60" color="white" text="{numMines}"/> - <Image x="140" y="20" src="pics/flag-color.png"/> + <Image x="140" y="20" source="pics/flag-color.png"/> <Text x="140" y="60" color="white" text="{numFlags}"/> - <Image x="240" y="0" src="{if(isPlaying==true){'pics/smile.png'}else{if(hasWon==true){'pics/glee.png'}else{'pics/frown.png'}}}"> + <Image x="240" y="0" source="{if(isPlaying==true){'pics/smile.png'}else{if(hasWon==true){'pics/glee.png'}else{'pics/frown.png'}}}"> <MouseRegion anchors.fill="{parent}" onClicked="reset()"/> </Image> </Item> diff --git a/examples/declarative/namespaces/lib/Chronos/Clock.qml b/examples/declarative/namespaces/lib/Chronos/Clock.qml index 088a45c..959d193 100644 --- a/examples/declarative/namespaces/lib/Chronos/Clock.qml +++ b/examples/declarative/namespaces/lib/Chronos/Clock.qml @@ -1,6 +1,6 @@ <?qtfx namespacepath:http://nokia.com/qml/Chronos=. ?> -<Image id="clock" src="pics/clockface.png" xmlns:This="http://nokia.com/qml/Chronos"> +<Image id="clock" source="pics/clockface.png" xmlns:This="http://nokia.com/qml/Chronos"> <properties> <Property name="hours" value="0"/> <Property name="minutes" value="0"/> diff --git a/examples/declarative/scrollbar/display.qml b/examples/declarative/scrollbar/display.qml index 4412d7f..42e8f25 100644 --- a/examples/declarative/scrollbar/display.qml +++ b/examples/declarative/scrollbar/display.qml @@ -7,7 +7,7 @@ Rect { anchors.fill: parent Image { id: Picture - src: "pics/niagara_falls.jpg" + source: "pics/niagara_falls.jpg" } viewportWidth: Picture.width viewportHeight: Picture.height diff --git a/examples/declarative/slideswitch/Switch.qml b/examples/declarative/slideswitch/Switch.qml index f62e4b6..a3f75e8 100644 --- a/examples/declarative/slideswitch/Switch.qml +++ b/examples/declarative/slideswitch/Switch.qml @@ -31,7 +31,7 @@ Item { } Image { id: Groove - src: "background.svg" + source: "background.svg" } MouseRegion { anchors.fill: Groove @@ -39,7 +39,7 @@ Item { } Image { id: Knob - src: "knob.svg" + source: "knob.svg" x: 1 y: 2 } diff --git a/examples/declarative/tutorials/contacts/1_Drawing_and_Animation/1/Removebutton.qml b/examples/declarative/tutorials/contacts/1_Drawing_and_Animation/1/Removebutton.qml new file mode 100644 index 0000000..bbe9f55 --- /dev/null +++ b/examples/declarative/tutorials/contacts/1_Drawing_and_Animation/1/Removebutton.qml @@ -0,0 +1,9 @@ +//! [0] +Rect { + id: removeButton + width: 30 + height: 30 + color: "red" + radius: 5 +} +//! [0] diff --git a/examples/declarative/tutorials/contacts/1_Drawing_and_Animation/1_Drawing_and_animation.qml b/examples/declarative/tutorials/contacts/1_Drawing_and_Animation/1_Drawing_and_animation.qml index 4ea77f3..cc5ebae 100644 --- a/examples/declarative/tutorials/contacts/1_Drawing_and_Animation/1_Drawing_and_animation.qml +++ b/examples/declarative/tutorials/contacts/1_Drawing_and_Animation/1_Drawing_and_animation.qml @@ -1,9 +1,34 @@ -<Rect id="page" width="{layout.width}" height="{layout.height}" color='white'> - <VerticalLayout id="layout" width="{contents.width}" margin="5" spacing="5"> - <GroupBox contents="RemoveButton1.qml" label="Rectangle Component"/> - <GroupBox contents="RemoveButton2.qml" label="Closed Remove Item Button"/> - <GroupBox contents="RemoveButton3.qml" label="Open Remove Item Button"/> - <GroupBox contents="RemoveButton4.qml" label="State Based Button"/> - <GroupBox contents="RemoveButton5.qml" label="Animated Button"/> - </VerticalLayout> -</Rect> +Rect { + id: page + width: layout.width + height: layout.height + color: "white" + VerticalLayout { + id: layout + width: contents.width + GroupBox { + contents: "1/RemoveButton.qml" + label: "Rectangle Component" + } + GroupBox { + contents: "2/RemoveButton.qml" + label: "Closed Remove Item Button" + } + GroupBox { + contents: "2a/RemoveButton.qml" + label: "Alternative Closed Button" + } + GroupBox { + contents: "3/RemoveButton.qml" + label: "Open Remove Item Button" + } + GroupBox { + contents: "4/RemoveButton.qml" + label: "State Based Button" + } + GroupBox { + contents: "5/RemoveButton.qml" + label: "Animated Button" + } + } +} diff --git a/examples/declarative/tutorials/contacts/1_Drawing_and_Animation/2/RemoveButton.qml b/examples/declarative/tutorials/contacts/1_Drawing_and_Animation/2/RemoveButton.qml new file mode 100644 index 0000000..247e38b --- /dev/null +++ b/examples/declarative/tutorials/contacts/1_Drawing_and_Animation/2/RemoveButton.qml @@ -0,0 +1,18 @@ +//! [0] +Rect { + id: removeButton + width: 30 + height: 30 + color: "red" + radius: 5 + Image { + id: trashIcon + width: 22 + height: 22 + anchors.right: parent.right + anchors.rightMargin: 4 + anchors.verticalCenter: parent.verticalCenter + source: "../../shared/pics/trash.png" + } +} +//! [0] diff --git a/examples/declarative/tutorials/contacts/1_Drawing_and_Animation/2a/RemoveButton.qml b/examples/declarative/tutorials/contacts/1_Drawing_and_Animation/2a/RemoveButton.qml new file mode 100644 index 0000000..6c6a949 --- /dev/null +++ b/examples/declarative/tutorials/contacts/1_Drawing_and_Animation/2a/RemoveButton.qml @@ -0,0 +1,20 @@ +//! [0] +Rect { + id: removeButton + width: 30 + height: 30 + color: "red" + radius: 5 + children: [ + Image { + id: trashIcon + width: 22 + height: 22 + anchors.right: parent.right + anchors.rightMargin: 4 + anchors.verticalCenter: parent.verticalCenter + source: "../../shared/pics/trash.png" + } + ] +} +//! [0] diff --git a/examples/declarative/tutorials/contacts/1_Drawing_and_Animation/3/RemoveButton.qml b/examples/declarative/tutorials/contacts/1_Drawing_and_Animation/3/RemoveButton.qml new file mode 100644 index 0000000..964975f --- /dev/null +++ b/examples/declarative/tutorials/contacts/1_Drawing_and_Animation/3/RemoveButton.qml @@ -0,0 +1,39 @@ +//! [0] +Rect { + id: removeButton + width: 230 + height: 30 + color: "red" + radius: 5 + Image { + id: cancelIcon + width: 22 + height: 22 + anchors.right: parent.right + anchors.rightMargin: 4 + anchors.verticalCenter: parent.verticalCenter + source: "../../shared/pics/cancel.png" + } + Image { + id: confirmIcon + width: 22 + height: 22 + anchors.left: parent.left + anchors.leftMargin: 4 + anchors.verticalCenter: parent.verticalCenter + source: "../../shared/pics/ok.png" + } + Text { + id: text + anchors.verticalCenter: parent.verticalCenter + anchors.left: confirmIcon.right + anchors.leftMargin: 4 + anchors.right: cancelIcon.left + anchors.rightMargin: 4 + font.bold: true + color: "white" + hAlign: AlignHCenter + text: "Remove" + } +} +//! [0] diff --git a/examples/declarative/tutorials/contacts/1_Drawing_and_Animation/4/RemoveButton.qml b/examples/declarative/tutorials/contacts/1_Drawing_and_Animation/4/RemoveButton.qml new file mode 100644 index 0000000..79aae7a --- /dev/null +++ b/examples/declarative/tutorials/contacts/1_Drawing_and_Animation/4/RemoveButton.qml @@ -0,0 +1,110 @@ +Rect { + id: removeButton + width: 30 + height: 30 + color: "red" + radius: 5 +//! [script] + resources: [ + Script { + function toggle() { + if (removeButton.state == 'opened') { + removeButton.state = ''; + } else { + removeButton.state = 'opened'; + } + } + + } + ] +//! [script] +//! [mouse region] + Image { + id: trashIcon + width: 22 + height: 22 + anchors.right: parent.right + anchors.rightMargin: 4 + anchors.verticalCenter: parent.verticalCenter + source: "../../shared/pics/trash.png" + opacity: 1 + MouseRegion { + anchors.fill: parent + onClicked: { toggle() } + } + } +//! [mouse region] + Image { + id: cancelIcon + width: 22 + height: 22 + anchors.right: parent.right + anchors.rightMargin: 4 + anchors.verticalCenter: parent.verticalCenter + source: "../../shared/pics/cancel.png" + opacity: 0 + MouseRegion { + anchors.fill: parent + onClicked: { toggle() } + } + } + Image { + id: confirmIcon + width: 22 + height: 22 + anchors.left: parent.left + anchors.leftMargin: 4 + anchors.verticalCenter: parent.verticalCenter + source: "../../shared/pics/ok.png" + opacity: 0 + MouseRegion { + anchors.fill: parent + onClicked: { toggle() } + } + } + Text { + id: text + anchors.verticalCenter: parent.verticalCenter + anchors.left: confirmIcon.right + anchors.leftMargin: 4 + anchors.right: cancelIcon.left + anchors.rightMargin: 4 + font.bold: true + color: "white" + hAlign: AlignHCenter + text: "Remove" + opacity: 0 + } +//! [states] + states: [ + State { + name: "opened" + SetProperty { + target: removeButton + property: "width" + value: 230 + } + SetProperty { + target: text + property: "opacity" + value: 1 + } + SetProperty { + target: confirmIcon + property: "opacity" + value: 1 + } + SetProperty { + target: cancelIcon + property: "opacity" + value: 1 + } + SetProperty { + target: trashIcon + property: "opacity" + value: 0 + } + } + ] +//! [states] +} diff --git a/examples/declarative/tutorials/contacts/1_Drawing_and_Animation/5/RemoveButton.qml b/examples/declarative/tutorials/contacts/1_Drawing_and_Animation/5/RemoveButton.qml new file mode 100644 index 0000000..6c9078a --- /dev/null +++ b/examples/declarative/tutorials/contacts/1_Drawing_and_Animation/5/RemoveButton.qml @@ -0,0 +1,117 @@ +Rect { + id: removeButton + width: 30 + height: 30 + color: "red" + radius: 5 + resources: [ + Script { + function toggle() { + if (removeButton.state == 'opened') { + removeButton.state = ''; + } else { + removeButton.state = 'opened'; + } + } + + } + ] + Image { + id: trashIcon + width: 22 + height: 22 + anchors.right: parent.right + anchors.rightMargin: 4 + anchors.verticalCenter: parent.verticalCenter + source: "../../shared/pics/trash.png" + opacity: 1 + MouseRegion { + anchors.fill: parent + onClicked: { toggle() } + } + } + Image { + id: cancelIcon + width: 22 + height: 22 + anchors.right: parent.right + anchors.rightMargin: 4 + anchors.verticalCenter: parent.verticalCenter + source: "../../shared/pics/cancel.png" + opacity: 0 + MouseRegion { + anchors.fill: parent + onClicked: { toggle() } + } + } + Image { + id: confirmIcon + width: 22 + height: 22 + anchors.left: parent.left + anchors.leftMargin: 4 + anchors.verticalCenter: parent.verticalCenter + source: "../../shared/pics/ok.png" + opacity: 0 + MouseRegion { + anchors.fill: parent + onClicked: { toggle() } + } + } + Text { + id: text + anchors.verticalCenter: parent.verticalCenter + anchors.left: confirmIcon.right + anchors.leftMargin: 4 + anchors.right: cancelIcon.left + anchors.rightMargin: 4 + font.bold: true + color: "white" + hAlign: AlignHCenter + text: "Remove" + opacity: 0 + } + states: [ + State { + name: "opened" + SetProperty { + target: removeButton + property: "width" + value: 230 + } + SetProperty { + target: text + property: "opacity" + value: 1 + } + SetProperty { + target: confirmIcon + property: "opacity" + value: 1 + } + SetProperty { + target: cancelIcon + property: "opacity" + value: 1 + } + SetProperty { + target: trashIcon + property: "opacity" + value: 0 + } + } + ] +//! [transition] + transitions: [ + Transition { + fromState: "*" + toState: "opened" + reversible: true + NumericAnimation { + properties: "opacity,x,width" + duration: 200 + } + } + ] +//! [transition] +} diff --git a/examples/declarative/tutorials/contacts/1_Drawing_and_Animation/GroupBox.qml b/examples/declarative/tutorials/contacts/1_Drawing_and_Animation/GroupBox.qml index 01f26ee..665c072 100644 --- a/examples/declarative/tutorials/contacts/1_Drawing_and_Animation/GroupBox.qml +++ b/examples/declarative/tutorials/contacts/1_Drawing_and_Animation/GroupBox.qml @@ -1,17 +1,59 @@ -<Item id="groupBox" width="{Math.max(270, subItem.width+40)}" height="{Math.max(70, subItem.height+40)}"> - <properties> - <Property name="contents"/> - <Property name="label"/> - </properties> - <Rect id="wrapper" x="5" y="10" radius="10" - width="{groupBox.width-20}" height="{groupBox.height-20}" - color="white" pen.color="black"> - <Item id="subItem" qml="{groupBox.contents}" - anchors.top="{parent.top}" anchors.topMargin="10" - anchors.right="{parent.right}" anchors.rightMargin="10" - width="{qmlItem.width}" height="{qmlItem.height}"/> - </Rect> - <Rect x="20" y="0" height="{text.height}" width="{text.width+10}" color="white"> - <Text x="5" id="text" text="{label}" font.bold="true"/> - </Rect> -</Item> +FocusRealm { + id: groupBox + width: Math.max(270, subItem.width+40) + height: Math.max(70, subItem.height+40) + properties: Property { + name: "contents" + } + properties: Property { + name: "label" + } + Rect { + id: wrapper + x: 5 + y: 10 + radius: 10 + width: groupBox.width-20 + height: groupBox.height-20 + color: "white" + pen.color: "black" + Item { + id: subItem + qml: groupBox.contents + anchors.top: parent.top + anchors.topMargin: 10 + anchors.right: parent.right + anchors.rightMargin: 10 + width: qmlItem.width + height: qmlItem.height + } + } + Rect { + x: 20 + y: 0 + height: text.height + width: text.width+10 + color: "white" + Text { + x: 5 + id: text + text: label + font.bold: true + } + } + Rect { + color: "black" + anchors.fill: parent + opacity: parent.focus ? 0 : 0.3 + MouseRegion { + anchors.fill: parent + onClicked: { parent.parent.focus=true } + } + opacity: Behaviour { + NumericAnimation { + property: "opacity" + duration: 250 + } + } + } +} diff --git a/examples/declarative/tutorials/contacts/1_Drawing_and_Animation/RemoveButton1.qml b/examples/declarative/tutorials/contacts/1_Drawing_and_Animation/RemoveButton1.qml deleted file mode 100644 index dc3f505..0000000 --- a/examples/declarative/tutorials/contacts/1_Drawing_and_Animation/RemoveButton1.qml +++ /dev/null @@ -1,4 +0,0 @@ -<Rect id="removeButton" - width="30" height="30" - color="red" - radius="5"/> diff --git a/examples/declarative/tutorials/contacts/1_Drawing_and_Animation/RemoveButton2.qml b/examples/declarative/tutorials/contacts/1_Drawing_and_Animation/RemoveButton2.qml deleted file mode 100644 index 2ba488d..0000000 --- a/examples/declarative/tutorials/contacts/1_Drawing_and_Animation/RemoveButton2.qml +++ /dev/null @@ -1,10 +0,0 @@ -<Rect id="removeButton" - width="30" height="30" - color="red" - radius="5"> - <Image id="trashIcon" - width="22" height="22" - anchors.right="{parent.right}" anchors.rightMargin="4" - anchors.verticalCenter="{parent.verticalCenter}" - src="../shared/pics/trash.png"/> -</Rect> diff --git a/examples/declarative/tutorials/contacts/1_Drawing_and_Animation/RemoveButton3.qml b/examples/declarative/tutorials/contacts/1_Drawing_and_Animation/RemoveButton3.qml deleted file mode 100644 index 9a364c5..0000000 --- a/examples/declarative/tutorials/contacts/1_Drawing_and_Animation/RemoveButton3.qml +++ /dev/null @@ -1,23 +0,0 @@ -<Rect id="removeButton" - width="230" height="30" - color="red" - radius="5"> - <Image id="cancelIcon" - width="22" height="22" - anchors.right="{parent.right}" anchors.rightMargin="4" - anchors.verticalCenter="{parent.verticalCenter}" - src="../shared/pics/cancel.png"/> - <Image id="confirmIcon" - width="22" height="22" - anchors.left="{parent.left}" anchors.leftMargin="4" - anchors.verticalCenter="{parent.verticalCenter}" - src="../shared/pics/ok.png"/> - <Text id="text" - anchors.verticalCenter="{parent.verticalCenter}" - anchors.left="{confirmIcon.right}" anchors.leftMargin="4" - anchors.right="{cancelIcon.left}" anchors.rightMargin="4" - font.bold="true" - color="white" - hAlign="AlignHCenter" - text="Remove"/> -</Rect> diff --git a/examples/declarative/tutorials/contacts/1_Drawing_and_Animation/RemoveButton4.qml b/examples/declarative/tutorials/contacts/1_Drawing_and_Animation/RemoveButton4.qml deleted file mode 100644 index 45ca19d..0000000 --- a/examples/declarative/tutorials/contacts/1_Drawing_and_Animation/RemoveButton4.qml +++ /dev/null @@ -1,65 +0,0 @@ -<Rect id="removeButton" - width="30" height="30" - color="red" - radius="5"> - <resources> - <Script> - function toggle() { - print('removeButton.toggle()'); - if (removeButton.state == 'opened') { - removeButton.state = ''; - } else { - removeButton.state = 'opened'; - } - } - </Script> - </resources> - <Image id="trashIcon" - width="22" height="22" - anchors.right="{parent.right}" anchors.rightMargin="4" - anchors.verticalCenter="{parent.verticalCenter}" - src="../shared/pics/trash.png" - opacity="1"> - <MouseRegion - anchors.fill="{parent}" - onClicked="toggle()"/> - </Image> - <Image id="cancelIcon" - width="22" height="22" - anchors.right="{parent.right}" anchors.rightMargin="4" - anchors.verticalCenter="{parent.verticalCenter}" - src="../shared/pics/cancel.png" - opacity="0"> - <MouseRegion - anchors.fill="{parent}" - onClicked="toggle()"/> - </Image> - <Image id="confirmIcon" - width="22" height="22" - anchors.left="{parent.left}" anchors.leftMargin="4" - anchors.verticalCenter="{parent.verticalCenter}" - src="../shared/pics/ok.png" - opacity="0"> - <MouseRegion - anchors.fill="{parent}" - onClicked="toggle()"/> - </Image> - <Text id="text" - anchors.verticalCenter="{parent.verticalCenter}" - anchors.left="{confirmIcon.right}" anchors.leftMargin="4" - anchors.right="{cancelIcon.left}" anchors.rightMargin="4" - font.bold="true" - color="white" - hAlign="AlignHCenter" - text="Remove" - opacity="0"/> - <states> - <State name="opened"> - <SetProperty target="{removeButton}" property="width" value="230"/> - <SetProperty target="{text}" property="opacity" value="1"/> - <SetProperty target="{confirmIcon}" property="opacity" value="1"/> - <SetProperty target="{cancelIcon}" property="opacity" value="1"/> - <SetProperty target="{trashIcon}" property="opacity" value="0"/> - </State> - </states> -</Rect> diff --git a/examples/declarative/tutorials/contacts/1_Drawing_and_Animation/RemoveButton5.qml b/examples/declarative/tutorials/contacts/1_Drawing_and_Animation/RemoveButton5.qml deleted file mode 100644 index 68c1838..0000000 --- a/examples/declarative/tutorials/contacts/1_Drawing_and_Animation/RemoveButton5.qml +++ /dev/null @@ -1,70 +0,0 @@ -<Rect id="removeButton" - width="30" height="30" - color="red" - radius="5"> - <resources> - <Script> - function toggle() { - print('removeButton.toggle()'); - if (removeButton.state == 'opened') { - removeButton.state = ''; - } else { - removeButton.state = 'opened'; - } - } - </Script> - </resources> - <Image id="trashIcon" - width="22" height="22" - anchors.right="{parent.right}" anchors.rightMargin="4" - anchors.verticalCenter="{parent.verticalCenter}" - src="../shared/pics/trash.png" - opacity="1"> - <MouseRegion - anchors.fill="{parent}" - onClicked="toggle()"/> - </Image> - <Image id="cancelIcon" - width="22" height="22" - anchors.right="{parent.right}" anchors.rightMargin="4" - anchors.verticalCenter="{parent.verticalCenter}" - src="../shared/pics/cancel.png" - opacity="0"> - <MouseRegion - anchors.fill="{parent}" - onClicked="toggle()"/> - </Image> - <Image id="confirmIcon" - width="22" height="22" - anchors.left="{parent.left}" anchors.leftMargin="4" - anchors.verticalCenter="{parent.verticalCenter}" - src="../shared/pics/ok.png" - opacity="0"> - <MouseRegion - anchors.fill="{parent}" - onClicked="toggle()"/> - </Image> - <Text id="text" - anchors.verticalCenter="{parent.verticalCenter}" - anchors.left="{confirmIcon.right}" anchors.leftMargin="4" - anchors.right="{cancelIcon.left}" anchors.rightMargin="4" - font.bold="true" - color="white" - hAlign="AlignHCenter" - text="Remove" - opacity="0"/> - <states> - <State name="opened"> - <SetProperty target="{removeButton}" property="width" value="230"/> - <SetProperty target="{text}" property="opacity" value="1"/> - <SetProperty target="{confirmIcon}" property="opacity" value="1"/> - <SetProperty target="{cancelIcon}" property="opacity" value="1"/> - <SetProperty target="{trashIcon}" property="opacity" value="0"/> - </State> - </states> - <transitions> - <Transition fromState="*" toState="opened" reversible="true"> - <NumericAnimation properties="opacity,x,width" duration="200"/> - </Transition> - </transitions> -</Rect> diff --git a/examples/declarative/tutorials/contacts/2_Reuse/1/ContactField.qml b/examples/declarative/tutorials/contacts/2_Reuse/1/ContactField.qml new file mode 100644 index 0000000..0218c3d --- /dev/null +++ b/examples/declarative/tutorials/contacts/2_Reuse/1/ContactField.qml @@ -0,0 +1,30 @@ +//! [load] +Item { + id: contactField + clip: true + width: 230 + height: 30 + RemoveButton { + id: removeButton + anchors.right: parent.right + anchors.top: parent.top + anchors.bottom: parent.bottom + } +//! [load] + Text { + id: fieldText + width: contactField.width-80 + anchors.right: removeButton.left + anchors.rightMargin: 10 + anchors.verticalCenter: parent.verticalCenter + font.bold: true + color: "black" + text: 123123 + } + Image { + source: "../../shared/pics/phone.png" + anchors.right: fieldText.left + anchors.rightMargin: 10 + anchors.verticalCenter: parent.verticalCenter + } +} diff --git a/examples/declarative/tutorials/contacts/2_Reuse/1/RemoveButton.qml b/examples/declarative/tutorials/contacts/2_Reuse/1/RemoveButton.qml new file mode 100644 index 0000000..3142c45 --- /dev/null +++ b/examples/declarative/tutorials/contacts/2_Reuse/1/RemoveButton.qml @@ -0,0 +1,115 @@ +Rect { + id: removeButton + width: 30 + height: 30 + color: "red" + radius: 5 + resources: [ + Script { + function toggle() { + if (removeButton.state == 'opened') { + removeButton.state = ''; + } else { + removeButton.state = 'opened'; + } + } + + } + ] + Image { + id: trashIcon + width: 22 + height: 22 + anchors.right: parent.right + anchors.rightMargin: 4 + anchors.verticalCenter: parent.verticalCenter + source: "../../shared/pics/trash.png" + opacity: 1 + MouseRegion { + anchors.fill: parent + onClicked: { toggle() } + } + } + Image { + id: cancelIcon + width: 22 + height: 22 + anchors.right: parent.right + anchors.rightMargin: 4 + anchors.verticalCenter: parent.verticalCenter + source: "../../shared/pics/cancel.png" + opacity: 0 + MouseRegion { + anchors.fill: parent + onClicked: { toggle() } + } + } + Image { + id: confirmIcon + width: 22 + height: 22 + anchors.left: parent.left + anchors.leftMargin: 4 + anchors.verticalCenter: parent.verticalCenter + source: "../../shared/pics/ok.png" + opacity: 0 + MouseRegion { + anchors.fill: parent + onClicked: { toggle() } + } + } + Text { + id: text + anchors.verticalCenter: parent.verticalCenter + anchors.left: confirmIcon.right + anchors.leftMargin: 4 + anchors.right: cancelIcon.left + anchors.rightMargin: 4 + font.bold: true + color: "white" + hAlign: "AlignHCenter" + text: "Remove" + opacity: 0 + } + states: [ + State { + name: "opened" + SetProperty { + target: removeButton + property: "width" + value: 230 + } + SetProperty { + target: text + property: "opacity" + value: 1 + } + SetProperty { + target: confirmIcon + property: "opacity" + value: 1 + } + SetProperty { + target: cancelIcon + property: "opacity" + value: 1 + } + SetProperty { + target: trashIcon + property: "opacity" + value: 0 + } + } + ] + transitions: [ + Transition { + fromState: "*" + toState: "opened" + reversible: true + NumericAnimation { + properties: "opacity,x,width" + duration: 200 + } + } + ] +} diff --git a/examples/declarative/tutorials/contacts/2_Reuse/1a/ContactField.qml b/examples/declarative/tutorials/contacts/2_Reuse/1a/ContactField.qml new file mode 100644 index 0000000..62089b8 --- /dev/null +++ b/examples/declarative/tutorials/contacts/2_Reuse/1a/ContactField.qml @@ -0,0 +1,33 @@ +//! [load] +Item { + id: contactField + clip: true + width: 230 + height: 30 + Item { + id: removeButton + qml: "RemoveButton.qml" + width: qmlItem.width + height: qmlItem.height + anchors.right: parent.right + anchors.top: parent.top + anchors.bottom: parent.bottom + } +//! [load] + Text { + id: fieldText + width: contactField.width-80 + anchors.right: removeButton.left + anchors.rightMargin: 10 + anchors.verticalCenter: parent.verticalCenter + font.bold: true + color: "black" + text: 123123 + } + Image { + source: "../../shared/pics/phone.png" + anchors.right: fieldText.left + anchors.rightMargin: 10 + anchors.verticalCenter: parent.verticalCenter + } +} diff --git a/examples/declarative/tutorials/contacts/2_Reuse/1a/RemoveButton.qml b/examples/declarative/tutorials/contacts/2_Reuse/1a/RemoveButton.qml new file mode 100644 index 0000000..3142c45 --- /dev/null +++ b/examples/declarative/tutorials/contacts/2_Reuse/1a/RemoveButton.qml @@ -0,0 +1,115 @@ +Rect { + id: removeButton + width: 30 + height: 30 + color: "red" + radius: 5 + resources: [ + Script { + function toggle() { + if (removeButton.state == 'opened') { + removeButton.state = ''; + } else { + removeButton.state = 'opened'; + } + } + + } + ] + Image { + id: trashIcon + width: 22 + height: 22 + anchors.right: parent.right + anchors.rightMargin: 4 + anchors.verticalCenter: parent.verticalCenter + source: "../../shared/pics/trash.png" + opacity: 1 + MouseRegion { + anchors.fill: parent + onClicked: { toggle() } + } + } + Image { + id: cancelIcon + width: 22 + height: 22 + anchors.right: parent.right + anchors.rightMargin: 4 + anchors.verticalCenter: parent.verticalCenter + source: "../../shared/pics/cancel.png" + opacity: 0 + MouseRegion { + anchors.fill: parent + onClicked: { toggle() } + } + } + Image { + id: confirmIcon + width: 22 + height: 22 + anchors.left: parent.left + anchors.leftMargin: 4 + anchors.verticalCenter: parent.verticalCenter + source: "../../shared/pics/ok.png" + opacity: 0 + MouseRegion { + anchors.fill: parent + onClicked: { toggle() } + } + } + Text { + id: text + anchors.verticalCenter: parent.verticalCenter + anchors.left: confirmIcon.right + anchors.leftMargin: 4 + anchors.right: cancelIcon.left + anchors.rightMargin: 4 + font.bold: true + color: "white" + hAlign: "AlignHCenter" + text: "Remove" + opacity: 0 + } + states: [ + State { + name: "opened" + SetProperty { + target: removeButton + property: "width" + value: 230 + } + SetProperty { + target: text + property: "opacity" + value: 1 + } + SetProperty { + target: confirmIcon + property: "opacity" + value: 1 + } + SetProperty { + target: cancelIcon + property: "opacity" + value: 1 + } + SetProperty { + target: trashIcon + property: "opacity" + value: 0 + } + } + ] + transitions: [ + Transition { + fromState: "*" + toState: "opened" + reversible: true + NumericAnimation { + properties: "opacity,x,width" + duration: 200 + } + } + ] +} diff --git a/examples/declarative/tutorials/contacts/2_Reuse/1b/ContactField.qml b/examples/declarative/tutorials/contacts/2_Reuse/1b/ContactField.qml new file mode 100644 index 0000000..1366548 --- /dev/null +++ b/examples/declarative/tutorials/contacts/2_Reuse/1b/ContactField.qml @@ -0,0 +1,29 @@ +import "lib" +Item { + id: contactField + clip: true + width: 230 + height: 30 + RemoveButton { + id: removeButton + anchors.right: parent.right + anchors.top: parent.top + anchors.bottom: parent.bottom + } + Text { + id: fieldText + width: contactField.width-80 + anchors.right: removeButton.left + anchors.rightMargin: 10 + anchors.verticalCenter: parent.verticalCenter + font.bold: true + color: "black" + text: 123123 + } + Image { + source: "../../shared/pics/phone.png" + anchors.right: fieldText.left + anchors.rightMargin: 10 + anchors.verticalCenter: parent.verticalCenter + } +} diff --git a/examples/declarative/tutorials/contacts/2_Reuse/1b/lib/RemoveButton.qml b/examples/declarative/tutorials/contacts/2_Reuse/1b/lib/RemoveButton.qml new file mode 100644 index 0000000..a358b21 --- /dev/null +++ b/examples/declarative/tutorials/contacts/2_Reuse/1b/lib/RemoveButton.qml @@ -0,0 +1,117 @@ +Rect { + id: removeButton + width: 30 + height: 30 + color: "red" + radius: 5 + resources: [ + Script { + + function toggle() { + print('removeButton.toggle()'); + if (removeButton.state == 'opened') { + removeButton.state = ''; + } else { + removeButton.state = 'opened'; + } + } + + } + ] + Image { + id: trashIcon + width: 22 + height: 22 + anchors.right: parent.right + anchors.rightMargin: 4 + anchors.verticalCenter: parent.verticalCenter + source: "../../../shared/pics/trash.png" + opacity: 1 + MouseRegion { + anchors.fill: parent + onClicked: { toggle() } + } + } + Image { + id: cancelIcon + width: 22 + height: 22 + anchors.right: parent.right + anchors.rightMargin: 4 + anchors.verticalCenter: parent.verticalCenter + source: "../../../shared/pics/cancel.png" + opacity: 0 + MouseRegion { + anchors.fill: parent + onClicked: { toggle() } + } + } + Image { + id: confirmIcon + width: 22 + height: 22 + anchors.left: parent.left + anchors.leftMargin: 4 + anchors.verticalCenter: parent.verticalCenter + source: "../../../shared/pics/ok.png" + opacity: 0 + MouseRegion { + anchors.fill: parent + onClicked: { toggle() } + } + } + Text { + id: text + anchors.verticalCenter: parent.verticalCenter + anchors.left: confirmIcon.right + anchors.leftMargin: 4 + anchors.right: cancelIcon.left + anchors.rightMargin: 4 + font.bold: true + color: "white" + hAlign: AlignHCenter + text: "Remove" + opacity: 0 + } + states: [ + State { + name: "opened" + SetProperty { + target: removeButton + property: "width" + value: 230 + } + SetProperty { + target: text + property: "opacity" + value: 1 + } + SetProperty { + target: confirmIcon + property: "opacity" + value: 1 + } + SetProperty { + target: cancelIcon + property: "opacity" + value: 1 + } + SetProperty { + target: trashIcon + property: "opacity" + value: 0 + } + } + ] + transitions: [ + Transition { + fromState: "*" + toState: "opened" + reversible: true + NumericAnimation { + properties: "opacity,x,width" + duration: 200 + } + } + ] +} diff --git a/examples/declarative/tutorials/contacts/2_Reuse/2/ContactField.qml b/examples/declarative/tutorials/contacts/2_Reuse/2/ContactField.qml new file mode 100644 index 0000000..2542c1c --- /dev/null +++ b/examples/declarative/tutorials/contacts/2_Reuse/2/ContactField.qml @@ -0,0 +1,32 @@ +Item { + id: contactField + clip: true + width: 230 + height: 30 +//! [use properties and signals] + RemoveButton { + id: removeButton + anchors.right: parent.right + anchors.top: parent.top + anchors.bottom: parent.bottom + expandedWidth: contactField.width + onConfirmed: { fieldText.text='' } + } +//! [use properties and signals] + Text { + id: fieldText + width: contactField.width-80 + anchors.right: removeButton.left + anchors.rightMargin: 10 + anchors.verticalCenter: parent.verticalCenter + font.bold: true + color: "black" + text: 123123 + } + Image { + source: "../../shared/pics/phone.png" + anchors.right: fieldText.left + anchors.rightMargin: 10 + anchors.verticalCenter: parent.verticalCenter + } +} diff --git a/examples/declarative/tutorials/contacts/2_Reuse/2/RemoveButton.qml b/examples/declarative/tutorials/contacts/2_Reuse/2/RemoveButton.qml new file mode 100644 index 0000000..45b1899 --- /dev/null +++ b/examples/declarative/tutorials/contacts/2_Reuse/2/RemoveButton.qml @@ -0,0 +1,124 @@ +//! [define properties and signals] +Rect { + id: removeButton + width: 30 + height: 30 + color: "red" + radius: 5 + properties: Property { + name: "expandedWidth" + value: 230 + } + signals: Signal { + name: "confirmed" + } +//! [define properties and signals] + resources: [ + Script { + function toggle() { + if (removeButton.state == 'opened') { + removeButton.state = ''; + } else { + removeButton.state = 'opened'; + } + } + + } + ] + Image { + id: trashIcon + width: 22 + height: 22 + anchors.right: parent.right + anchors.rightMargin: 4 + anchors.verticalCenter: parent.verticalCenter + source: "../../shared/pics/trash.png" + opacity: 1 + MouseRegion { + anchors.fill: parent + onClicked: { toggle() } + } + } + Image { + id: cancelIcon + width: 22 + height: 22 + anchors.right: parent.right + anchors.rightMargin: 4 + anchors.verticalCenter: parent.verticalCenter + source: "../../shared/pics/cancel.png" + opacity: 0 + MouseRegion { + anchors.fill: parent + onClicked: { toggle() } + } + } + Image { + id: confirmIcon + width: 22 + height: 22 + anchors.left: parent.left + anchors.leftMargin: 4 + anchors.verticalCenter: parent.verticalCenter + source: "../../shared/pics/ok.png" + opacity: 0 + MouseRegion { + anchors.fill: parent + onClicked: { toggle(); removeButton.confirmed.emit() } + } + } + Text { + id: text + anchors.verticalCenter: parent.verticalCenter + anchors.left: confirmIcon.right + anchors.leftMargin: 4 + anchors.right: cancelIcon.left + anchors.rightMargin: 4 + font.bold: true + color: "white" + hAlign: "AlignHCenter" + text: "Remove" + opacity: 0 + } + states: [ + State { + name: "opened" + SetProperty { + target: removeButton + property: "width" + value: removeButton.expandedWidth + } + SetProperty { + target: text + property: "opacity" + value: 1 + } + SetProperty { + target: confirmIcon + property: "opacity" + value: 1 + } + SetProperty { + target: cancelIcon + property: "opacity" + value: 1 + } + SetProperty { + target: trashIcon + property: "opacity" + value: 0 + } + } + ] + transitions: [ + Transition { + fromState: "*" + toState: "opened" + reversible: true + NumericAnimation { + properties: "opacity,x,width" + duration: 200 + } + } + ] +} diff --git a/examples/declarative/tutorials/contacts/2_Reuse/2_Reuse.qml b/examples/declarative/tutorials/contacts/2_Reuse/2_Reuse.qml index 13bc209..4d95424 100644 --- a/examples/declarative/tutorials/contacts/2_Reuse/2_Reuse.qml +++ b/examples/declarative/tutorials/contacts/2_Reuse/2_Reuse.qml @@ -1,12 +1,47 @@ -<Rect id="page" width="{layout.width}" height="{layout.height}" color='white'> - <properties> - <Property name="mouseGrabbed" value="false"/> - </properties> - <VerticalLayout id="layout" width="{contents.width}" margin="5" spacing="5"> - <GroupBox contents="ContactField1.qml" label="Loading Component"/> - <GroupBox contents="ContactField2.qml" label="Using properties"/> - <GroupBox contents="ContactField3.qml" label="Defining signals"/> - <GroupBox contents="Contact3.qml" label="Multiple Items"/> - <GroupBox contents="Contact4.qml" label="Mouse Grabbing"/> - </VerticalLayout> -</Rect> +Rect { + id: page + width: layout.width + height: layout.height + color: "white" + GridLayout { + id: layout + columns: 2 + rows: 4 + width: contents.width + GroupBox { + contents: "1/ContactField.qml" + label: "Loading: simple" + } + GroupBox { + contents: "1a/ContactField.qml" + label: "Loading: qml property" + } + GroupBox { + contents: "1b/ContactField.qml" + label: "Loading: added path" + } + GroupBox { + contents: "2/ContactField.qml" + label: "Using properties" + } + GroupBox { + id: prev + contents: "3/ContactField.qml" + label: "Defining signals" + } + Rect { + color: "black" + opacity: 0.3 + width: prev.width + height: prev.height + } + GroupBox { + contents: "3/Contact.qml" + label: "Multiple Items" + } + GroupBox { + contents: "4/Contact.qml" + label: "Mouse Grabbing" + } + } +} diff --git a/examples/declarative/tutorials/contacts/2_Reuse/3/Contact.qml b/examples/declarative/tutorials/contacts/2_Reuse/3/Contact.qml new file mode 100644 index 0000000..33ac627 --- /dev/null +++ b/examples/declarative/tutorials/contacts/2_Reuse/3/Contact.qml @@ -0,0 +1,53 @@ +Item { + id: contactDetails + width: 230 + height: layout.height + properties: Property { + name: "contactid" + value: "" + } + properties: Property { + name: "label" + onValueChanged: { labelField.value = label } + } + properties: Property { + name: "phone" + onValueChanged: { phoneField.value = phone } + } + properties: Property { + name: "email" + onValueChanged: { emailField.value = email } + } + VerticalLayout { + id: layout + anchors.fill: parent + spacing: 5 + margin: 5 + ContactField { + id: labelField + anchors.left: layout.left + anchors.leftMargin: 5 + anchors.right: layout.right + anchors.rightMargin: 5 + label: "Name" + } + ContactField { + id: phoneField + anchors.left: layout.left + anchors.leftMargin: 5 + anchors.right: layout.right + anchors.rightMargin: 5 + icon: "../../shared/pics/phone.png" + label: "Phone" + } + ContactField { + id: emailField + anchors.left: layout.left + anchors.leftMargin: 5 + anchors.right: layout.right + anchors.rightMargin: 5 + icon: "../../shared/pics/email.png" + label: "Email" + } + } +} diff --git a/examples/declarative/tutorials/contacts/2_Reuse/3/ContactField.qml b/examples/declarative/tutorials/contacts/2_Reuse/3/ContactField.qml new file mode 100644 index 0000000..2d3d58a --- /dev/null +++ b/examples/declarative/tutorials/contacts/2_Reuse/3/ContactField.qml @@ -0,0 +1,69 @@ +//! [all] +Item { + id: contactField + clip: true + width: 230 + height: 30 + properties: Property { + name: "label" + value: "Name" + } + properties: Property { + name: "icon" + value: "../../shared/pics/phone.png" + } + properties: Property { + name: "value" + } + RemoveButton { + id: removeButton + anchors.right: parent.right + anchors.top: parent.top + anchors.bottom: parent.bottom + expandedWidth: contactField.width + onConfirmed: { fieldText.text='' } + } + FieldText { + id: fieldText + width: contactField.width-70 + anchors.right: removeButton.left + anchors.rightMargin: 5 + anchors.verticalCenter: parent.verticalCenter + label: contactField.label + text: contactField.value + } + Image { + anchors.right: fieldText.left + anchors.rightMargin: 5 + anchors.verticalCenter: parent.verticalCenter + source: contactField.icon + } + states: [ + State { + name: "editingText" + when: fieldText.state == 'editing' + SetProperty { + target: removeButton.anchors + property: "rightMargin" + value: -35 + } + SetProperty { + target: fieldText + property: "width" + value: contactField.width + } + } + ] + transitions: [ + Transition { + fromState: "" + toState: "*" + reversible: true + NumericAnimation { + properties: "width,rightMargin" + duration: 200 + } + } + ] +} +//! [all] diff --git a/examples/declarative/tutorials/contacts/2_Reuse/3/FieldText.qml b/examples/declarative/tutorials/contacts/2_Reuse/3/FieldText.qml new file mode 100644 index 0000000..cf654cf --- /dev/null +++ b/examples/declarative/tutorials/contacts/2_Reuse/3/FieldText.qml @@ -0,0 +1,156 @@ +//! [value change] +Rect { + id: fieldText + height: 30 + radius: 5 + color: "white" + properties: Property { + name: "text" + value: "" + onValueChanged: { reset() } + } +//! [value change] + properties: Property { + name: "label" + value: "" + } + signals: Signal { + name: "confirmed" + } + resources: [ + Script { + + function edit() { + fieldText.state='editing'; + } + function confirm() { + fieldText.text = textEdit.text; + fieldText.state=''; + fieldText.confirmed.emit(); + } + function reset() { + textEdit.text = fieldText.text; + fieldText.state=''; + } + + } + ] + Image { + id: cancelIcon + width: 22 + height: 22 + anchors.right: parent.right + anchors.rightMargin: 4 + anchors.verticalCenter: parent.verticalCenter + source: "../../shared/pics/cancel.png" + opacity: 0 + } + Image { + id: confirmIcon + width: 22 + height: 22 + anchors.left: parent.left + anchors.leftMargin: 4 + anchors.verticalCenter: parent.verticalCenter + source: "../../shared/pics/ok.png" + opacity: 0 + } + TextEdit { + id: textEdit + anchors.left: parent.left + anchors.leftMargin: 5 + anchors.right: parent.right + anchors.rightMargin: 5 + anchors.verticalCenter: parent.verticalCenter + color: "black" + font.bold: true + readOnly: true + wrap: false + } +//! [behavior] + Text { + id: textLabel + x: 5 + width: parent.width-10 + anchors.verticalCenter: parent.verticalCenter + hAlign: "AlignHCenter" + color: "#505050" + font.italic: true + text: fieldText.label + opacity: textEdit.text == '' ? 1 : 0 + opacity: Behaviour { + NumericAnimation { + property: "opacity" + duration: 250 + } + } + } +//! [behavior] + MouseRegion { + anchors.fill: cancelIcon + onClicked: { reset() } + } + MouseRegion { + anchors.fill: confirmIcon + onClicked: { confirm() } + } + MouseRegion { + id: editRegion + anchors.fill: textEdit + onClicked: { edit() } + } + states: [ + State { + name: "editing" + SetProperty { + target: confirmIcon + property: "opacity" + value: 1 + } + SetProperty { + target: cancelIcon + property: "opacity" + value: 1 + } + SetProperty { + target: textEdit + property: "readOnly" + value: false + } + SetProperty { + target: textEdit + property: "focus" + value: true + } + SetProperty { + target: editRegion + property: "opacity" + value: 0 + } + SetProperty { + target: textEdit.anchors + property: "leftMargin" + value: 39 + } + SetProperty { + target: textEdit.anchors + property: "rightMargin" + value: 39 + } + } + ] + transitions: [ + Transition { + fromState: "" + toState: "*" + reversible: true + NumericAnimation { + properties: "opacity,leftMargin,rightMargin" + duration: 200 + } + ColorAnimation { + duration: 150 + } + } + ] +} diff --git a/examples/declarative/tutorials/contacts/2_Reuse/3/RemoveButton.qml b/examples/declarative/tutorials/contacts/2_Reuse/3/RemoveButton.qml new file mode 100644 index 0000000..309ee5a --- /dev/null +++ b/examples/declarative/tutorials/contacts/2_Reuse/3/RemoveButton.qml @@ -0,0 +1,122 @@ +Rect { + id: removeButton + width: 30 + height: 30 + color: "red" + radius: 5 + properties: Property { + name: "expandedWidth" + value: 230 + } + signals: Signal { + name: "confirmed" + } + resources: [ + Script { + function toggle() { + if (removeButton.state == 'opened') { + removeButton.state = ''; + } else { + removeButton.state = 'opened'; + } + } + + } + ] + Image { + id: trashIcon + width: 22 + height: 22 + anchors.right: parent.right + anchors.rightMargin: 4 + anchors.verticalCenter: parent.verticalCenter + source: "../../shared/pics/trash.png" + opacity: 1 + MouseRegion { + anchors.fill: parent + onClicked: { toggle() } + } + } + Image { + id: cancelIcon + width: 22 + height: 22 + anchors.right: parent.right + anchors.rightMargin: 4 + anchors.verticalCenter: parent.verticalCenter + source: "../../shared/pics/cancel.png" + opacity: 0 + MouseRegion { + anchors.fill: parent + onClicked: { toggle() } + } + } + Image { + id: confirmIcon + width: 22 + height: 22 + anchors.left: parent.left + anchors.leftMargin: 4 + anchors.verticalCenter: parent.verticalCenter + source: "../../shared/pics/ok.png" + opacity: 0 + MouseRegion { + anchors.fill: parent + onClicked: { toggle(); removeButton.confirmed.emit() } + } + } + Text { + id: text + anchors.verticalCenter: parent.verticalCenter + anchors.left: confirmIcon.right + anchors.leftMargin: 4 + anchors.right: cancelIcon.left + anchors.rightMargin: 4 + font.bold: true + color: "white" + hAlign: "AlignHCenter" + text: "Remove" + opacity: 0 + } + states: [ + State { + name: "opened" + SetProperty { + target: removeButton + property: "width" + value: removeButton.expandedWidth + } + SetProperty { + target: text + property: "opacity" + value: 1 + } + SetProperty { + target: confirmIcon + property: "opacity" + value: 1 + } + SetProperty { + target: cancelIcon + property: "opacity" + value: 1 + } + SetProperty { + target: trashIcon + property: "opacity" + value: 0 + } + } + ] + transitions: [ + Transition { + fromState: "*" + toState: "opened" + reversible: true + NumericAnimation { + properties: "opacity,x,width" + duration: 200 + } + } + ] +} diff --git a/examples/declarative/tutorials/contacts/2_Reuse/4/Contact.qml b/examples/declarative/tutorials/contacts/2_Reuse/4/Contact.qml new file mode 100644 index 0000000..0587a51 --- /dev/null +++ b/examples/declarative/tutorials/contacts/2_Reuse/4/Contact.qml @@ -0,0 +1,59 @@ +//! [grab property] +Item { + id: contactDetails + width: 230 + height: layout.height + properties: Property { + name: "mouseGrabbed" + value: false + } +//! [grab property] + properties: Property { + name: "contactid" + value: "" + } + properties: Property { + name: "label" + onValueChanged: { labelField.value = label } + } + properties: Property { + name: "phone" + onValueChanged: { phoneField.value = phone } + } + properties: Property { + name: "email" + onValueChanged: { emailField.value = email } + } + VerticalLayout { + id: layout + anchors.fill: parent + spacing: 5 + margin: 5 + ContactField { + id: labelField + anchors.left: layout.left + anchors.leftMargin: 5 + anchors.right: layout.right + anchors.rightMargin: 5 + label: "Name" + } + ContactField { + id: phoneField + anchors.left: layout.left + anchors.leftMargin: 5 + anchors.right: layout.right + anchors.rightMargin: 5 + icon: "../../shared/pics/phone.png" + label: "Phone" + } + ContactField { + id: emailField + anchors.left: layout.left + anchors.leftMargin: 5 + anchors.right: layout.right + anchors.rightMargin: 5 + icon: "../../shared/pics/email.png" + label: "Email" + } + } +} diff --git a/examples/declarative/tutorials/contacts/2_Reuse/4/ContactField.qml b/examples/declarative/tutorials/contacts/2_Reuse/4/ContactField.qml new file mode 100644 index 0000000..0c422b7 --- /dev/null +++ b/examples/declarative/tutorials/contacts/2_Reuse/4/ContactField.qml @@ -0,0 +1,64 @@ +Item { + id: contactField + clip: true + height: 30 + properties: Property { + name: "label" + } + properties: Property { + name: "icon" + } + properties: Property { + name: "value" + } + RemoveButton { + id: removeButton + anchors.right: parent.right + anchors.top: parent.top + anchors.bottom: parent.bottom + expandedWidth: contactField.width + onConfirmed: { fieldText.text='' } + } + FieldText { + id: fieldText + width: contactField.width-70 + anchors.right: removeButton.left + anchors.rightMargin: 5 + anchors.verticalCenter: parent.verticalCenter + label: contactField.label + text: contactField.value + } + Image { + anchors.right: fieldText.left + anchors.rightMargin: 5 + anchors.verticalCenter: parent.verticalCenter + source: contactField.icon + } + states: [ + State { + name: "editingText" + when: fieldText.state == 'editing' + SetProperty { + target: removeButton.anchors + property: "rightMargin" + value: -35 + } + SetProperty { + target: fieldText + property: "width" + value: contactField.width + } + } + ] + transitions: [ + Transition { + fromState: "" + toState: "*" + reversible: true + NumericAnimation { + properties: "width,rightMargin" + duration: 200 + } + } + ] +} diff --git a/examples/declarative/tutorials/contacts/2_Reuse/4/FieldText.qml b/examples/declarative/tutorials/contacts/2_Reuse/4/FieldText.qml new file mode 100644 index 0000000..6bb4e0a --- /dev/null +++ b/examples/declarative/tutorials/contacts/2_Reuse/4/FieldText.qml @@ -0,0 +1,157 @@ +Rect { + id: fieldText + height: 30 + radius: 5 + color: "white" + properties: Property { + name: "text" + value: "" + onValueChanged: { reset() } + } + properties: Property { + name: "label" + value: "" + } + signals: Signal { + name: "confirmed" + } + resources: [ + Script { + + function edit() { + if (!contactDetails.mouseGrabbed) { + fieldText.state='editing'; + contactDetails.mouseGrabbed=true; + } + } + function confirm() { + fieldText.text = textEdit.text; + fieldText.state=''; + contactDetails.mouseGrabbed=false; + fieldText.confirmed.emit(); + } + function reset() { + textEdit.text = fieldText.text; + fieldText.state=''; + contactDetails.mouseGrabbed=false; + } + + } + ] + Image { + id: cancelIcon + width: 22 + height: 22 + anchors.right: parent.right + anchors.rightMargin: 4 + anchors.verticalCenter: parent.verticalCenter + source: "../../shared/pics/cancel.png" + opacity: 0 + } + Image { + id: confirmIcon + width: 22 + height: 22 + anchors.left: parent.left + anchors.leftMargin: 4 + anchors.verticalCenter: parent.verticalCenter + source: "../../shared/pics/ok.png" + opacity: 0 + } + TextEdit { + id: textEdit + anchors.left: parent.left + anchors.leftMargin: 5 + anchors.right: parent.right + anchors.rightMargin: 5 + anchors.verticalCenter: parent.verticalCenter + color: "black" + font.bold: true + readOnly: true + wrap: false + } + Text { + id: textLabel + x: 5 + width: parent.width-10 + anchors.verticalCenter: parent.verticalCenter + hAlign: "AlignHCenter" + color: "#505050" + font.italic: true + text: fieldText.label + opacity: textEdit.text == '' ? 1 : 0 + opacity: Behaviour { + NumericAnimation { + property: "opacity" + duration: 250 + } + } + } + MouseRegion { + anchors.fill: cancelIcon + onClicked: { reset() } + } + MouseRegion { + anchors.fill: confirmIcon + onClicked: { confirm() } + } + MouseRegion { + id: editRegion + anchors.fill: textEdit + onClicked: { edit() } + } + states: [ + State { + name: "editing" + SetProperty { + target: confirmIcon + property: "opacity" + value: 1 + } + SetProperty { + target: cancelIcon + property: "opacity" + value: 1 + } + SetProperty { + target: textEdit + property: "readOnly" + value: false + } + SetProperty { + target: textEdit + property: "focus" + value: true + } + SetProperty { + target: editRegion + property: "opacity" + value: 0 + } + SetProperty { + target: textEdit.anchors + property: "leftMargin" + value: 39 + } + SetProperty { + target: textEdit.anchors + property: "rightMargin" + value: 39 + } + } + ] + transitions: [ + Transition { + fromState: "" + toState: "*" + reversible: true + NumericAnimation { + properties: "opacity,leftMargin,rightMargin" + duration: 200 + } + ColorAnimation { + duration: 150 + } + } + ] +} diff --git a/examples/declarative/tutorials/contacts/2_Reuse/4/RemoveButton.qml b/examples/declarative/tutorials/contacts/2_Reuse/4/RemoveButton.qml new file mode 100644 index 0000000..b57a95b --- /dev/null +++ b/examples/declarative/tutorials/contacts/2_Reuse/4/RemoveButton.qml @@ -0,0 +1,128 @@ +Rect { + id: removeButton + width: 30 + height: 30 + color: "red" + radius: 5 + properties: Property { + name: "expandedWidth" + value: 230 + } + signals: Signal { + name: "confirmed" + } + resources: [ +//! [grab] + Script { + function toggle() { + if (removeButton.state == 'opened') { + removeButton.state = ''; + contactDetails.mouseGrabbed=false; + } else { + if (!contactDetails.mouseGrabbed) { + removeButton.state = 'opened'; + contactDetails.mouseGrabbed=true; + } + } + } + + } +//! [grab] + ] + Image { + id: trashIcon + width: 22 + height: 22 + anchors.right: parent.right + anchors.rightMargin: 4 + anchors.verticalCenter: parent.verticalCenter + source: "../../shared/pics/trash.png" + opacity: 1 + MouseRegion { + anchors.fill: parent + onClicked: { toggle() } + } + } + Image { + id: cancelIcon + width: 22 + height: 22 + anchors.right: parent.right + anchors.rightMargin: 4 + anchors.verticalCenter: parent.verticalCenter + source: "../../shared/pics/cancel.png" + opacity: 0 + MouseRegion { + anchors.fill: parent + onClicked: { toggle() } + } + } + Image { + id: confirmIcon + width: 22 + height: 22 + anchors.left: parent.left + anchors.leftMargin: 4 + anchors.verticalCenter: parent.verticalCenter + source: "../../shared/pics/ok.png" + opacity: 0 + MouseRegion { + anchors.fill: parent + onClicked: { toggle(); removeButton.confirmed.emit() } + } + } + Text { + id: text + anchors.verticalCenter: parent.verticalCenter + anchors.left: confirmIcon.right + anchors.leftMargin: 4 + anchors.right: cancelIcon.left + anchors.rightMargin: 4 + font.bold: true + color: "white" + hAlign: "AlignHCenter" + text: "Remove" + opacity: 0 + } + states: [ + State { + name: "opened" + SetProperty { + target: removeButton + property: "width" + value: removeButton.expandedWidth + } + SetProperty { + target: text + property: "opacity" + value: 1 + } + SetProperty { + target: confirmIcon + property: "opacity" + value: 1 + } + SetProperty { + target: cancelIcon + property: "opacity" + value: 1 + } + SetProperty { + target: trashIcon + property: "opacity" + value: 0 + } + } + ] + transitions: [ + Transition { + fromState: "*" + toState: "opened" + reversible: true + NumericAnimation { + properties: "opacity,x,width" + duration: 200 + } + } + ] +} diff --git a/examples/declarative/tutorials/contacts/2_Reuse/Contact3.qml b/examples/declarative/tutorials/contacts/2_Reuse/Contact3.qml deleted file mode 100644 index 2933437..0000000 --- a/examples/declarative/tutorials/contacts/2_Reuse/Contact3.qml +++ /dev/null @@ -1,29 +0,0 @@ -<Item id="contactDetails" - width="230" - height="{layout.height}"> - <properties> - <Property name="contactid" value=""/> - <Property name="label" onValueChanged="labelField.value = label"/> - <Property name="phone" onValueChanged="phoneField.value = phone"/> - <Property name="email" onValueChanged="emailField.value = email"/> - </properties> - <VerticalLayout id="layout" - anchors.fill="{parent}" - spacing="5" - margin="5"> - <ContactField3 id="labelField" - anchors.left="{layout.left}" anchors.leftMargin="5" - anchors.right="{layout.right}" anchors.rightMargin="5" - label="Name"/> - <ContactField3 id="phoneField" - anchors.left="{layout.left}" anchors.leftMargin="5" - anchors.right="{layout.right}" anchors.rightMargin="5" - icon="../shared/pics/phone.png" - label="Phone"/> - <ContactField3 id="emailField" - anchors.left="{layout.left}" anchors.leftMargin="5" - anchors.right="{layout.right}" anchors.rightMargin="5" - icon="../shared/pics/email.png" - label="Email"/> - </VerticalLayout> -</Item> diff --git a/examples/declarative/tutorials/contacts/2_Reuse/Contact4.qml b/examples/declarative/tutorials/contacts/2_Reuse/Contact4.qml deleted file mode 100644 index 9e988c0..0000000 --- a/examples/declarative/tutorials/contacts/2_Reuse/Contact4.qml +++ /dev/null @@ -1,29 +0,0 @@ -<Item id="contactDetails" - width="230" - height="{layout.height}"> - <properties> - <Property name="contactid" value=""/> - <Property name="label" onValueChanged="labelField.value = label"/> - <Property name="phone" onValueChanged="phoneField.value = phone"/> - <Property name="email" onValueChanged="emailField.value = email"/> - </properties> - <VerticalLayout id="layout" - anchors.fill="{parent}" - spacing="5" - margin="5"> - <ContactField4 id="labelField" - anchors.left="{layout.left}" anchors.leftMargin="5" - anchors.right="{layout.right}" anchors.rightMargin="5" - label="Name"/> - <ContactField4 id="phoneField" - anchors.left="{layout.left}" anchors.leftMargin="5" - anchors.right="{layout.right}" anchors.rightMargin="5" - icon="../shared/pics/phone.png" - label="Phone"/> - <ContactField4 id="emailField" - anchors.left="{layout.left}" anchors.leftMargin="5" - anchors.right="{layout.right}" anchors.rightMargin="5" - icon="../shared/pics/email.png" - label="Email"/> - </VerticalLayout> -</Item> diff --git a/examples/declarative/tutorials/contacts/2_Reuse/ContactField1.qml b/examples/declarative/tutorials/contacts/2_Reuse/ContactField1.qml deleted file mode 100644 index 7bfdd28..0000000 --- a/examples/declarative/tutorials/contacts/2_Reuse/ContactField1.qml +++ /dev/null @@ -1,18 +0,0 @@ -<Item id="contactField" - clip="true" - width="230" - height="30"> - <RemoveButton1 id="removeButton" - anchors.right="{parent.right}" - anchors.top="{parent.top}" anchors.bottom="{parent.bottom}"/> - <Text id="fieldText" - width="{contactField.width-80}" - anchors.right="{removeButton.left}" anchors.rightMargin="10" - anchors.verticalCenter="{parent.verticalCenter}" - font.bold="true" - color="black" - text="123123"/> - <Image src="../shared/pics/phone.png" - anchors.right="{fieldText.left}" anchors.rightMargin="10" - anchors.verticalCenter="{parent.verticalCenter}"/> -</Item> diff --git a/examples/declarative/tutorials/contacts/2_Reuse/ContactField2.qml b/examples/declarative/tutorials/contacts/2_Reuse/ContactField2.qml deleted file mode 100644 index 7ec3e4d..0000000 --- a/examples/declarative/tutorials/contacts/2_Reuse/ContactField2.qml +++ /dev/null @@ -1,20 +0,0 @@ -<Item id="contactField" - clip="true" - width="230" - height="30"> - <RemoveButton2 id="removeButton" - anchors.right="{parent.right}" - anchors.top="{parent.top}" anchors.bottom="{parent.bottom}" - expandedWidth="{contactField.width}" - onConfirmed="print('Clear field text'); fieldText.text=''"/> - <Text id="fieldText" - width="{contactField.width-80}" - anchors.right="{removeButton.left}" anchors.rightMargin="10" - anchors.verticalCenter="{parent.verticalCenter}" - font.bold="true" - color="black" - text="123123"/> - <Image src="../shared/pics/phone.png" - anchors.right="{fieldText.left}" anchors.rightMargin="10" - anchors.verticalCenter="{parent.verticalCenter}"/> -</Item> diff --git a/examples/declarative/tutorials/contacts/2_Reuse/ContactField3.qml b/examples/declarative/tutorials/contacts/2_Reuse/ContactField3.qml deleted file mode 100644 index cef25ce..0000000 --- a/examples/declarative/tutorials/contacts/2_Reuse/ContactField3.qml +++ /dev/null @@ -1,36 +0,0 @@ -<Item id="contactField" - clip="true" - width="230" - height="30"> - <properties> - <Property name="label" value="Name"/> - <Property name="icon" value="../shared/pics/phone.png"/> - <Property name="value"/> - </properties> - <RemoveButton3 id="removeButton" - anchors.right="{parent.right}" - anchors.top="{parent.top}" anchors.bottom="{parent.bottom}" - expandedWidth="{contactField.width}" - onConfirmed="print('Clear field text'); fieldText.text=''"/> - <FieldText3 id="fieldText" - width="{contactField.width-70}" - anchors.right="{removeButton.left}" anchors.rightMargin="5" - anchors.verticalCenter="{parent.verticalCenter}" - label="{contactField.label}" - text="{contactField.value}"/> - <Image - anchors.right="{fieldText.left}" anchors.rightMargin="5" - anchors.verticalCenter="{parent.verticalCenter}" - src="{contactField.icon}"/> - <states> - <State name="editingText" when="{fieldText.state == 'editing'}"> - <SetProperty target="{removeButton.anchors}" property="rightMargin" value="-35"/> - <SetProperty target="{fieldText}" property="width" value="{contactField.width}"/> - </State> - </states> - <transitions> - <Transition fromState='' toState="*" reversible="true"> - <NumericAnimation properties="width,rightMargin" duration="200"/> - </Transition> - </transitions> -</Item> diff --git a/examples/declarative/tutorials/contacts/2_Reuse/ContactField4.qml b/examples/declarative/tutorials/contacts/2_Reuse/ContactField4.qml deleted file mode 100644 index 13ccbc0..0000000 --- a/examples/declarative/tutorials/contacts/2_Reuse/ContactField4.qml +++ /dev/null @@ -1,35 +0,0 @@ -<Item id="contactField" - clip="true" - height="30"> - <properties> - <Property name="label"/> - <Property name="icon"/> - <Property name="value"/> - </properties> - <RemoveButton4 id="removeButton" - anchors.right="{parent.right}" - anchors.top="{parent.top}" anchors.bottom="{parent.bottom}" - expandedWidth="{contactField.width}" - onConfirmed="print('Clear field text'); fieldText.text=''"/> - <FieldText4 id="fieldText" - width="{contactField.width-70}" - anchors.right="{removeButton.left}" anchors.rightMargin="5" - anchors.verticalCenter="{parent.verticalCenter}" - label="{contactField.label}" - text="{contactField.value}"/> - <Image - anchors.right="{fieldText.left}" anchors.rightMargin="5" - anchors.verticalCenter="{parent.verticalCenter}" - src="{contactField.icon}"/> - <states> - <State name="editingText" when="{fieldText.state == 'editing'}"> - <SetProperty target="{removeButton.anchors}" property="rightMargin" value="-35"/> - <SetProperty target="{fieldText}" property="width" value="{contactField.width}"/> - </State> - </states> - <transitions> - <Transition fromState='' toState="*" reversible="true"> - <NumericAnimation properties="width,rightMargin" duration="200"/> - </Transition> - </transitions> -</Item> diff --git a/examples/declarative/tutorials/contacts/2_Reuse/FieldText3.qml b/examples/declarative/tutorials/contacts/2_Reuse/FieldText3.qml deleted file mode 100644 index 97c0772..0000000 --- a/examples/declarative/tutorials/contacts/2_Reuse/FieldText3.qml +++ /dev/null @@ -1,91 +0,0 @@ -<Rect id="fieldText" - height="30" - radius="5" - color="white"> - <properties> - <Property - name="text" - value="" - onValueChanged="reset()"/> - <Property - name="label" - value=""/> - </properties> - <signals> - <Signal name="confirmed"/> - </signals> - <resources> - <Script> - function edit() { - fieldText.state='editing'; - } - function confirm() { - fieldText.text = textEdit.text; - fieldText.state=''; - fieldText.confirmed.emit(); - } - function reset() { - textEdit.text = fieldText.text; - fieldText.state=''; - } - </Script> - </resources> - <Image id="cancelIcon" - width="22" height="22" - anchors.right="{parent.right}" anchors.rightMargin="4" - anchors.verticalCenter="{parent.verticalCenter}" - src="../shared/pics/cancel.png" - opacity="0"/> - <Image id="confirmIcon" - width="22" height="22" - anchors.left="{parent.left}" anchors.leftMargin="4" - anchors.verticalCenter="{parent.verticalCenter}" - src="../shared/pics/ok.png" - opacity="0"/> - <TextEdit id="textEdit" - anchors.left="{parent.left}" anchors.leftMargin="5" - anchors.right="{parent.right}" anchors.rightMargin="5" - anchors.verticalCenter="{parent.verticalCenter}" - color="black" - font.bold="true" - readOnly="true" - wrap="false" - /> - <Text id="textLabel" - x="5" width="{parent.width-10}" - anchors.verticalCenter="{parent.verticalCenter}" - hAlign="AlignHCenter" - color="#505050" - font.italic="true" - text="{fieldText.label}" - opacity="{textEdit.text != '' ? 0 : 1}"> - <opacity> - <Behaviour> - <NumericAnimation property="opacity" duration="250"/> - </Behaviour> - </opacity> - </Text> - <MouseRegion anchors.fill="{cancelIcon}" onClicked="reset()"/> - <MouseRegion anchors.fill="{confirmIcon}" onClicked="confirm()"/> - <MouseRegion - id="editRegion" - anchors.fill="{textEdit}" - onClicked="edit()"/> - <states> - <State name="editing"> - <SetProperty target="{confirmIcon}" property="opacity" value="1"/> - <SetProperty target="{cancelIcon}" property="opacity" value="1"/> - <SetProperty target="{textEdit}" property="readOnly" value="false"/> - <SetProperty target="{textEdit}" property="focus" value="true"/> - <SetProperty target="{editRegion}" property="opacity" value="0"/> - <SetProperty target="{textEdit.anchors}" property="leftMargin" value="39"/> - <SetProperty target="{textEdit.anchors}" property="rightMargin" value="39"/> - </State> - </states> - <transitions> - <Transition fromState='' toState="*" reversible="true"> - <NumericAnimation properties="opacity,leftMargin,rightMargin" duration="200"/> - <ColorAnimation duration="150"/> - </Transition> - </transitions> -</Rect> diff --git a/examples/declarative/tutorials/contacts/2_Reuse/FieldText4.qml b/examples/declarative/tutorials/contacts/2_Reuse/FieldText4.qml deleted file mode 100644 index 45bb18d..0000000 --- a/examples/declarative/tutorials/contacts/2_Reuse/FieldText4.qml +++ /dev/null @@ -1,96 +0,0 @@ -<Rect id="fieldText" - height="30" - radius="5" - color="white"> - <properties> - <Property - name="text" - value="" - onValueChanged="reset()"/> - <Property - name="label" - value=""/> - </properties> - <signals> - <Signal name="confirmed"/> - </signals> - <resources> - <Script> - function edit() { - if (!page.mouseGrabbed) { - fieldText.state='editing'; - page.mouseGrabbed=true; - } - } - function confirm() { - fieldText.text = textEdit.text; - fieldText.state=''; - page.mouseGrabbed=false; - fieldText.confirmed.emit(); - } - function reset() { - textEdit.text = fieldText.text; - fieldText.state=''; - page.mouseGrabbed=false; - } - </Script> - </resources> - <Image id="cancelIcon" - width="22" height="22" - anchors.right="{parent.right}" anchors.rightMargin="4" - anchors.verticalCenter="{parent.verticalCenter}" - src="../shared/pics/cancel.png" - opacity="0"/> - <Image id="confirmIcon" - width="22" height="22" - anchors.left="{parent.left}" anchors.leftMargin="4" - anchors.verticalCenter="{parent.verticalCenter}" - src="../shared/pics/ok.png" - opacity="0"/> - <TextEdit id="textEdit" - anchors.left="{parent.left}" anchors.leftMargin="5" - anchors.right="{parent.right}" anchors.rightMargin="5" - anchors.verticalCenter="{parent.verticalCenter}" - color="black" - font.bold="true" - readOnly="true" - wrap="false" - /> - <Text id="textLabel" - x="5" width="{parent.width-10}" - anchors.verticalCenter="{parent.verticalCenter}" - hAlign="AlignHCenter" - color="#505050" - font.italic="true" - text="{fieldText.label}" - opacity="{textEdit.text != '' ? 0 : 1}"> - <opacity> - <Behaviour> - <NumericAnimation property="opacity" duration="250"/> - </Behaviour> - </opacity> - </Text> - <MouseRegion anchors.fill="{cancelIcon}" onClicked="reset()"/> - <MouseRegion anchors.fill="{confirmIcon}" onClicked="confirm()"/> - <MouseRegion - id="editRegion" - anchors.fill="{textEdit}" - onClicked="edit()"/> - <states> - <State name="editing"> - <SetProperty target="{confirmIcon}" property="opacity" value="1"/> - <SetProperty target="{cancelIcon}" property="opacity" value="1"/> - <SetProperty target="{textEdit}" property="readOnly" value="false"/> - <SetProperty target="{textEdit}" property="focus" value="true"/> - <SetProperty target="{editRegion}" property="opacity" value="0"/> - <SetProperty target="{textEdit.anchors}" property="leftMargin" value="39"/> - <SetProperty target="{textEdit.anchors}" property="rightMargin" value="39"/> - </State> - </states> - <transitions> - <Transition fromState='' toState="*" reversible="true"> - <NumericAnimation properties="opacity,leftMargin,rightMargin" duration="200"/> - <ColorAnimation duration="150"/> - </Transition> - </transitions> -</Rect> diff --git a/examples/declarative/tutorials/contacts/2_Reuse/GroupBox.qml b/examples/declarative/tutorials/contacts/2_Reuse/GroupBox.qml index 01f26ee..665c072 100644 --- a/examples/declarative/tutorials/contacts/2_Reuse/GroupBox.qml +++ b/examples/declarative/tutorials/contacts/2_Reuse/GroupBox.qml @@ -1,17 +1,59 @@ -<Item id="groupBox" width="{Math.max(270, subItem.width+40)}" height="{Math.max(70, subItem.height+40)}"> - <properties> - <Property name="contents"/> - <Property name="label"/> - </properties> - <Rect id="wrapper" x="5" y="10" radius="10" - width="{groupBox.width-20}" height="{groupBox.height-20}" - color="white" pen.color="black"> - <Item id="subItem" qml="{groupBox.contents}" - anchors.top="{parent.top}" anchors.topMargin="10" - anchors.right="{parent.right}" anchors.rightMargin="10" - width="{qmlItem.width}" height="{qmlItem.height}"/> - </Rect> - <Rect x="20" y="0" height="{text.height}" width="{text.width+10}" color="white"> - <Text x="5" id="text" text="{label}" font.bold="true"/> - </Rect> -</Item> +FocusRealm { + id: groupBox + width: Math.max(270, subItem.width+40) + height: Math.max(70, subItem.height+40) + properties: Property { + name: "contents" + } + properties: Property { + name: "label" + } + Rect { + id: wrapper + x: 5 + y: 10 + radius: 10 + width: groupBox.width-20 + height: groupBox.height-20 + color: "white" + pen.color: "black" + Item { + id: subItem + qml: groupBox.contents + anchors.top: parent.top + anchors.topMargin: 10 + anchors.right: parent.right + anchors.rightMargin: 10 + width: qmlItem.width + height: qmlItem.height + } + } + Rect { + x: 20 + y: 0 + height: text.height + width: text.width+10 + color: "white" + Text { + x: 5 + id: text + text: label + font.bold: true + } + } + Rect { + color: "black" + anchors.fill: parent + opacity: parent.focus ? 0 : 0.3 + MouseRegion { + anchors.fill: parent + onClicked: { parent.parent.focus=true } + } + opacity: Behaviour { + NumericAnimation { + property: "opacity" + duration: 250 + } + } + } +} diff --git a/examples/declarative/tutorials/contacts/2_Reuse/RemoveButton1.qml b/examples/declarative/tutorials/contacts/2_Reuse/RemoveButton1.qml deleted file mode 100644 index 68c1838..0000000 --- a/examples/declarative/tutorials/contacts/2_Reuse/RemoveButton1.qml +++ /dev/null @@ -1,70 +0,0 @@ -<Rect id="removeButton" - width="30" height="30" - color="red" - radius="5"> - <resources> - <Script> - function toggle() { - print('removeButton.toggle()'); - if (removeButton.state == 'opened') { - removeButton.state = ''; - } else { - removeButton.state = 'opened'; - } - } - </Script> - </resources> - <Image id="trashIcon" - width="22" height="22" - anchors.right="{parent.right}" anchors.rightMargin="4" - anchors.verticalCenter="{parent.verticalCenter}" - src="../shared/pics/trash.png" - opacity="1"> - <MouseRegion - anchors.fill="{parent}" - onClicked="toggle()"/> - </Image> - <Image id="cancelIcon" - width="22" height="22" - anchors.right="{parent.right}" anchors.rightMargin="4" - anchors.verticalCenter="{parent.verticalCenter}" - src="../shared/pics/cancel.png" - opacity="0"> - <MouseRegion - anchors.fill="{parent}" - onClicked="toggle()"/> - </Image> - <Image id="confirmIcon" - width="22" height="22" - anchors.left="{parent.left}" anchors.leftMargin="4" - anchors.verticalCenter="{parent.verticalCenter}" - src="../shared/pics/ok.png" - opacity="0"> - <MouseRegion - anchors.fill="{parent}" - onClicked="toggle()"/> - </Image> - <Text id="text" - anchors.verticalCenter="{parent.verticalCenter}" - anchors.left="{confirmIcon.right}" anchors.leftMargin="4" - anchors.right="{cancelIcon.left}" anchors.rightMargin="4" - font.bold="true" - color="white" - hAlign="AlignHCenter" - text="Remove" - opacity="0"/> - <states> - <State name="opened"> - <SetProperty target="{removeButton}" property="width" value="230"/> - <SetProperty target="{text}" property="opacity" value="1"/> - <SetProperty target="{confirmIcon}" property="opacity" value="1"/> - <SetProperty target="{cancelIcon}" property="opacity" value="1"/> - <SetProperty target="{trashIcon}" property="opacity" value="0"/> - </State> - </states> - <transitions> - <Transition fromState="*" toState="opened" reversible="true"> - <NumericAnimation properties="opacity,x,width" duration="200"/> - </Transition> - </transitions> -</Rect> diff --git a/examples/declarative/tutorials/contacts/2_Reuse/RemoveButton2.qml b/examples/declarative/tutorials/contacts/2_Reuse/RemoveButton2.qml deleted file mode 100644 index d9ff4c5..0000000 --- a/examples/declarative/tutorials/contacts/2_Reuse/RemoveButton2.qml +++ /dev/null @@ -1,76 +0,0 @@ -<Rect id="removeButton" - width="30" height="30" - color="red" - radius="5"> - <properties> - <Property name="expandedWidth" value="230"/> - </properties> - <signals> - <Signal name="confirmed"/> - </signals> - <resources> - <Script> - function toggle() { - print('removeButton.toggle()'); - if (removeButton.state == 'opened') { - removeButton.state = ''; - } else { - removeButton.state = 'opened'; - } - } - </Script> - </resources> - <Image id="trashIcon" - width="22" height="22" - anchors.right="{parent.right}" anchors.rightMargin="4" - anchors.verticalCenter="{parent.verticalCenter}" - src="../shared/pics/trash.png" - opacity="1"> - <MouseRegion - anchors.fill="{parent}" - onClicked="toggle()"/> - </Image> - <Image id="cancelIcon" - width="22" height="22" - anchors.right="{parent.right}" anchors.rightMargin="4" - anchors.verticalCenter="{parent.verticalCenter}" - src="../shared/pics/cancel.png" - opacity="0"> - <MouseRegion - anchors.fill="{parent}" - onClicked="toggle()"/> - </Image> - <Image id="confirmIcon" - width="22" height="22" - anchors.left="{parent.left}" anchors.leftMargin="4" - anchors.verticalCenter="{parent.verticalCenter}" - src="../shared/pics/ok.png" - opacity="0"> - <MouseRegion - anchors.fill="{parent}" - onClicked="toggle(); removeButton.confirmed.emit()"/> - </Image> - <Text id="text" - anchors.verticalCenter="{parent.verticalCenter}" - anchors.left="{confirmIcon.right}" anchors.leftMargin="4" - anchors.right="{cancelIcon.left}" anchors.rightMargin="4" - font.bold="true" - color="white" - hAlign="AlignHCenter" - text="Remove" - opacity="0"/> - <states> - <State name="opened"> - <SetProperty target="{removeButton}" property="width" value="{removeButton.expandedWidth}"/> - <SetProperty target="{text}" property="opacity" value="1"/> - <SetProperty target="{confirmIcon}" property="opacity" value="1"/> - <SetProperty target="{cancelIcon}" property="opacity" value="1"/> - <SetProperty target="{trashIcon}" property="opacity" value="0"/> - </State> - </states> - <transitions> - <Transition fromState="*" toState="opened" reversible="true"> - <NumericAnimation properties="opacity,x,width" duration="200"/> - </Transition> - </transitions> -</Rect> diff --git a/examples/declarative/tutorials/contacts/2_Reuse/RemoveButton3.qml b/examples/declarative/tutorials/contacts/2_Reuse/RemoveButton3.qml deleted file mode 100644 index d9ff4c5..0000000 --- a/examples/declarative/tutorials/contacts/2_Reuse/RemoveButton3.qml +++ /dev/null @@ -1,76 +0,0 @@ -<Rect id="removeButton" - width="30" height="30" - color="red" - radius="5"> - <properties> - <Property name="expandedWidth" value="230"/> - </properties> - <signals> - <Signal name="confirmed"/> - </signals> - <resources> - <Script> - function toggle() { - print('removeButton.toggle()'); - if (removeButton.state == 'opened') { - removeButton.state = ''; - } else { - removeButton.state = 'opened'; - } - } - </Script> - </resources> - <Image id="trashIcon" - width="22" height="22" - anchors.right="{parent.right}" anchors.rightMargin="4" - anchors.verticalCenter="{parent.verticalCenter}" - src="../shared/pics/trash.png" - opacity="1"> - <MouseRegion - anchors.fill="{parent}" - onClicked="toggle()"/> - </Image> - <Image id="cancelIcon" - width="22" height="22" - anchors.right="{parent.right}" anchors.rightMargin="4" - anchors.verticalCenter="{parent.verticalCenter}" - src="../shared/pics/cancel.png" - opacity="0"> - <MouseRegion - anchors.fill="{parent}" - onClicked="toggle()"/> - </Image> - <Image id="confirmIcon" - width="22" height="22" - anchors.left="{parent.left}" anchors.leftMargin="4" - anchors.verticalCenter="{parent.verticalCenter}" - src="../shared/pics/ok.png" - opacity="0"> - <MouseRegion - anchors.fill="{parent}" - onClicked="toggle(); removeButton.confirmed.emit()"/> - </Image> - <Text id="text" - anchors.verticalCenter="{parent.verticalCenter}" - anchors.left="{confirmIcon.right}" anchors.leftMargin="4" - anchors.right="{cancelIcon.left}" anchors.rightMargin="4" - font.bold="true" - color="white" - hAlign="AlignHCenter" - text="Remove" - opacity="0"/> - <states> - <State name="opened"> - <SetProperty target="{removeButton}" property="width" value="{removeButton.expandedWidth}"/> - <SetProperty target="{text}" property="opacity" value="1"/> - <SetProperty target="{confirmIcon}" property="opacity" value="1"/> - <SetProperty target="{cancelIcon}" property="opacity" value="1"/> - <SetProperty target="{trashIcon}" property="opacity" value="0"/> - </State> - </states> - <transitions> - <Transition fromState="*" toState="opened" reversible="true"> - <NumericAnimation properties="opacity,x,width" duration="200"/> - </Transition> - </transitions> -</Rect> diff --git a/examples/declarative/tutorials/contacts/2_Reuse/RemoveButton4.qml b/examples/declarative/tutorials/contacts/2_Reuse/RemoveButton4.qml deleted file mode 100644 index a489e95..0000000 --- a/examples/declarative/tutorials/contacts/2_Reuse/RemoveButton4.qml +++ /dev/null @@ -1,80 +0,0 @@ -<Rect id="removeButton" - width="30" height="30" - color="red" - radius="5"> - <properties> - <Property name="expandedWidth" value="230"/> - </properties> - <signals> - <Signal name="confirmed"/> - </signals> - <resources> - <Script> - function toggle() { - print('removeButton.toggle()'); - if (removeButton.state == 'opened') { - removeButton.state = ''; - page.mouseGrabbed=false; - } else { - if (!page.mouseGrabbed) { - removeButton.state = 'opened'; - page.mouseGrabbed=true; - } - } - } - </Script> - </resources> - <Image id="trashIcon" - width="22" height="22" - anchors.right="{parent.right}" anchors.rightMargin="4" - anchors.verticalCenter="{parent.verticalCenter}" - src="../shared/pics/trash.png" - opacity="1"> - <MouseRegion - anchors.fill="{parent}" - onClicked="toggle()"/> - </Image> - <Image id="cancelIcon" - width="22" height="22" - anchors.right="{parent.right}" anchors.rightMargin="4" - anchors.verticalCenter="{parent.verticalCenter}" - src="../shared/pics/cancel.png" - opacity="0"> - <MouseRegion - anchors.fill="{parent}" - onClicked="toggle()"/> - </Image> - <Image id="confirmIcon" - width="22" height="22" - anchors.left="{parent.left}" anchors.leftMargin="4" - anchors.verticalCenter="{parent.verticalCenter}" - src="../shared/pics/ok.png" - opacity="0"> - <MouseRegion - anchors.fill="{parent}" - onClicked="toggle(); removeButton.confirmed.emit()"/> - </Image> - <Text id="text" - anchors.verticalCenter="{parent.verticalCenter}" - anchors.left="{confirmIcon.right}" anchors.leftMargin="4" - anchors.right="{cancelIcon.left}" anchors.rightMargin="4" - font.bold="true" - color="white" - hAlign="AlignHCenter" - text="Remove" - opacity="0"/> - <states> - <State name="opened"> - <SetProperty target="{removeButton}" property="width" value="{removeButton.expandedWidth}"/> - <SetProperty target="{text}" property="opacity" value="1"/> - <SetProperty target="{confirmIcon}" property="opacity" value="1"/> - <SetProperty target="{cancelIcon}" property="opacity" value="1"/> - <SetProperty target="{trashIcon}" property="opacity" value="0"/> - </State> - </states> - <transitions> - <Transition fromState="*" toState="opened" reversible="true"> - <NumericAnimation properties="opacity,x,width" duration="200"/> - </Transition> - </transitions> -</Rect> diff --git a/examples/declarative/tutorials/contacts/3_Collections/1/ContactView.qml b/examples/declarative/tutorials/contacts/3_Collections/1/ContactView.qml new file mode 100644 index 0000000..ce338e2 --- /dev/null +++ b/examples/declarative/tutorials/contacts/3_Collections/1/ContactView.qml @@ -0,0 +1,47 @@ +import "../lib" +Item { + id: contacts + width: 240 + height: 230 + properties: Property { + name: "mouseGrabbed" + value: false + } + resources: [ +//! [model] + SqlConnection { + id: contactDatabase + name: "qmlConnection" + driver: "QSQLITE" + databaseName: "../../shared/contacts.sqlite" + }, + SqlQuery { + id: contactList + connection: contactDatabase + query: "SELECT recid, label, email, phone FROM contacts ORDER BY label, recid" + } +//! [model] + ] +//! [view] + ListView { + id: contactListView + anchors.fill: parent + clip: true + model: contactList + focus: true +//! [delegate] + delegate: [ + Text { + x: 45 + y: 12 + width: contactListView.width-45 + height: 30 + color: "black" + font.bold: true + text: model.label + } + ] +//! [delegate] + } +//! [view] +} diff --git a/examples/declarative/tutorials/contacts/3_Collections/2/ContactView.qml b/examples/declarative/tutorials/contacts/3_Collections/2/ContactView.qml new file mode 100644 index 0000000..b6b3c31 --- /dev/null +++ b/examples/declarative/tutorials/contacts/3_Collections/2/ContactView.qml @@ -0,0 +1,129 @@ +import "../lib" +Item { + id: contacts + width: 240 + height: 230 + properties: Property { + name: "mouseGrabbed" + value: false + } + resources: [ + SqlConnection { + id: contactDatabase + name: "qmlConnection" + driver: "QSQLITE" + databaseName: "../../shared/contacts.sqlite" + }, + SqlQuery { + id: contactList + connection: contactDatabase + query: "SELECT recid, label, email, phone FROM contacts ORDER BY label, recid" + } + ] +//! [button] + Button { + id: cancelEditButton + anchors.top: parent.top + anchors.topMargin: 5 + anchors.right: parent.right + anchors.rightMargin: 5 + icon: "../../shared/pics/cancel.png" + opacity: mouseGrabbed ? 0 : 1 + } +//! [button] + ListView { + id: contactListView + anchors.left: parent.left + anchors.right: parent.right + anchors.top: cancelEditButton.bottom + anchors.bottom: parent.bottom + clip: true + model: contactList + focus: true + delegate: [ +//! [components] + Item { + id: wrapper + x: 0 + width: ListView.view.width + height: 34 + Text { + id: label + x: 45 + y: 12 + width: parent.width-45 + color: "black" + font.bold: true + text: model.label + } + MouseRegion { + anchors.fill: label + onClicked: { wrapper.state='opened' } + } + Contact { + id: details + anchors.fill: parent + contactid: model.recid + label: model.label + email: model.email + phone: model.phone + opacity: 0 + } +//! [components] +//! [states] + states: [ + State { + name: "opened" + SetProperty { + target: wrapper + property: "height" + value: contactListView.height + } + SetProperty { + target: contactListView + property: "yPosition" + value: wrapper.y + } + SetProperty { + target: contactListView + property: "locked" + value: 1 + } + SetProperty { + target: label + property: "opacity" + value: 0 + } + SetProperty { + target: details + property: "opacity" + value: 1 + } + } + ] +//! [states] +//! [transitions] + transitions: [ + Transition { + NumericAnimation { + duration: 500 + properties: "yPosition,height,opacity" + } + } + ] +//! [transitions] +//! [connections] + Connection { + sender: cancelEditButton + signal: "clicked()" + script: { + if (wrapper.state == 'opened') { + wrapper.state = ''; + } + } + } +//! [connections] + } + ] + } +} diff --git a/examples/declarative/tutorials/contacts/3_Collections/3/ContactView.qml b/examples/declarative/tutorials/contacts/3_Collections/3/ContactView.qml new file mode 100644 index 0000000..f0b55db --- /dev/null +++ b/examples/declarative/tutorials/contacts/3_Collections/3/ContactView.qml @@ -0,0 +1,142 @@ +import "../lib" +Item { + id: contacts + width: 240 + height: 230 + properties: Property { + name: "mouseGrabbed" + value: false + } + resources: [ + SqlConnection { + id: contactDatabase + name: "qmlConnection" + driver: "QSQLITE" + databaseName: "../../shared/contacts.sqlite" + }, + SqlQuery { + id: contactList + connection: contactDatabase + query: "SELECT recid AS contactid, label, email, phone FROM contacts ORDER BY label, recid" + } + ] + Button { + id: cancelEditButton + anchors.top: parent.top + anchors.topMargin: 5 + anchors.right: parent.right + anchors.rightMargin: 5 + icon: "../../shared/pics/cancel.png" + opacity: mouseGrabbed ? 0 : 1 + } + ListView { + id: contactListView + anchors.left: parent.left + anchors.right: parent.right + anchors.top: cancelEditButton.bottom + anchors.bottom: parent.bottom + clip: true + model: contactList + focus: true + delegate: [ + Item { + id: wrapper + x: 0 + width: ListView.view.width + height: 34 + Text { + id: label + x: 45 + y: 12 + width: parent.width-45 + text: model.label + color: "black" + font.bold: true + } +//! [setting qml] + MouseRegion { + anchors.fill: label + onClicked: { + Details.qml = 'Contact.qml'; + wrapper.state='opened'; + } + } + Item { + id: Details + anchors.fill: wrapper + opacity: 0 +//! [setting qml] +//! [binding] + Bind { + target: Details.qmlItem + property: "contactid" + value: model.contactid + } + Bind { + target: Details.qmlItem + property: "label" + value: model.label + } + Bind { + target: Details.qmlItem + property: "phone" + value: model.phone + } + Bind { + target: Details.qmlItem + property: "email" + value: model.email + } +//! [binding] + } + states: [ + State { + name: "opened" + SetProperty { + target: wrapper + property: "height" + value: contactListView.height + } + SetProperty { + target: contactListView + property: "yPosition" + value: wrapper.y + } + SetProperty { + target: contactListView + property: "locked" + value: 1 + } + SetProperty { + target: label + property: "opacity" + value: 0 + } + SetProperty { + target: Details + property: "opacity" + value: 1 + } + } + ] + transitions: [ + Transition { + NumericAnimation { + duration: 500 + properties: "yPosition,height,opacity" + } + } + ] + Connection { + sender: cancelEditButton + signal: "clicked()" + script: { + if (wrapper.state == 'opened') { + wrapper.state = ''; + } + } + } + } + ] + } +} diff --git a/examples/declarative/tutorials/contacts/3_Collections/3_Collections.qml b/examples/declarative/tutorials/contacts/3_Collections/3_Collections.qml index 6907676..e8d9a19 100644 --- a/examples/declarative/tutorials/contacts/3_Collections/3_Collections.qml +++ b/examples/declarative/tutorials/contacts/3_Collections/3_Collections.qml @@ -1,37 +1,29 @@ -<Rect id="page" width="{layout.width}" height="{layout.height}" color='white'> - <GridLayout id="layout" width="{contents.width}" height="{contents.height}"> - <FocusRealm id="realm1" focus="false" width="280" height="320"> - <GroupBox contents="ContactView1.qml" label="something" anchors.fill="{parent}"/> - <Rect id="box1" color="black" anchors.fill="{parent}" opacity="0.3"> - <MouseRegion anchors.fill="{parent}" onClicked="print('1'); realm1.focus=true; realm2.focus=false; realm3.focus=false; box1.opacity='0'; box2.opacity='0.3'; box3.opacity='0.3'" onPressed="" onPositionChanged=""/> - <opacity> - <Behaviour> - <NumericAnimation property="opacity" duration="250"/> - </Behaviour> - </opacity> - </Rect> - </FocusRealm> - <FocusRealm id="realm2" focus="false" width="280" height="320"> - <GroupBox contents="ContactView2.qml" label="something" anchors.fill="{parent}"/> - <Rect id="box2" color="black" anchors.fill="{parent}" opacity="0.3"> - <MouseRegion anchors.fill="{parent}" onClicked="realm1.focus=false; realm2.focus=true; realm3.focus=false; box1.opacity='0.3'; box2.opacity='0'; box3.opacity='0.3'" onPressed="" onPositionChanged=""/> - <opacity> - <Behaviour> - <NumericAnimation property="opacity" duration="250"/> - </Behaviour> - </opacity> - </Rect> - </FocusRealm> - <FocusRealm id="realm3" focus="true" width="280" height="320"> - <GroupBox contents="ContactView3.qml" label="something" anchors.fill="{parent}"/> - <Rect id="box3" color="black" anchors.fill="{parent}" opacity="0.3"> - <MouseRegion anchors.fill="{parent}" onClicked="realm1.focus=false; realm2.focus=false; realm3.focus=true; box1.opacity='0.3'; box2.opacity='0.3'; box3.opacity='0'" onPressed="" onPositionChanged=""/> - <opacity> - <Behaviour> - <NumericAnimation property="opacity" duration="250"/> - </Behaviour> - </opacity> - </Rect> - </FocusRealm> - </GridLayout> -</Rect> +Rect { + id: page + width: layout.width + height: layout.height + color: "white" + Bind { + id: currentItem + value: true + } + // relies on the current focus behavior whereby setting focus=true on a + // component removes focus from any previous element + GridLayout { + id: layout + width: contents.width + height: contents.height + GroupBox { + contents: "1/ContactView.qml" + label: "something" + } + GroupBox { + contents: "2/ContactView.qml" + label: "something" + } + GroupBox { + contents: "3/ContactView.qml" + label: "something" + } + } +} diff --git a/examples/declarative/tutorials/contacts/3_Collections/Button.qml b/examples/declarative/tutorials/contacts/3_Collections/Button.qml deleted file mode 100644 index 8290d35..0000000 --- a/examples/declarative/tutorials/contacts/3_Collections/Button.qml +++ /dev/null @@ -1,38 +0,0 @@ -<Item id="button" width="30" height="30"> - <properties> - <Property name="icon"/> - </properties> - <signals> - <Signal name="clicked"/> - </signals> - <Rect id="buttonRect" - anchors.fill="{parent}" - color="lightgreen" - radius="5"> - <Image id="iconImage" - src="{button.icon}" - anchors.horizontalCenter="{buttonRect.horizontalCenter}" - anchors.verticalCenter="{buttonRect.verticalCenter}"/> - <MouseRegion id="buttonMouseRegion" - anchors.fill="{buttonRect}" - onClicked="button.clicked.emit()"/> - <states> - <State name="pressed" when="{buttonMouseRegion.pressed == true}"> - <SetProperty target="{buttonRect}" property="color" value="green"/> - </State> - </states> - <transitions> - <Transition fromState="*" toState="pressed"> - <ColorAnimation duration="200"/> - </Transition> - <Transition fromState="pressed" toState="*"> - <ColorAnimation duration="1000"/> - </Transition> - </transitions> - </Rect> - <opacity> - <Behaviour> - <NumericAnimation property="opacity" duration="250"/> - </Behaviour> - </opacity> -</Item> diff --git a/examples/declarative/tutorials/contacts/3_Collections/Contact.qml b/examples/declarative/tutorials/contacts/3_Collections/Contact.qml deleted file mode 100644 index f620c25..0000000 --- a/examples/declarative/tutorials/contacts/3_Collections/Contact.qml +++ /dev/null @@ -1,28 +0,0 @@ -<Item id="contactDetails" - anchors.fill="{parent}"> - <properties> - <Property name="contactid" value=""/> - <Property name="label" onValueChanged="labelField.value = label"/> - <Property name="phone" onValueChanged="phoneField.value = phone"/> - <Property name="email" onValueChanged="emailField.value = email"/> - </properties> - <VerticalLayout id="layout" - anchors.fill="{parent}" - spacing="5" - margin="5"> - <ContactField id="labelField" - anchors.left="{layout.left}" anchors.leftMargin="5" - anchors.right="{layout.right}" anchors.rightMargin="5" - label="Name"/> - <ContactField id="phoneField" - anchors.left="{layout.left}" anchors.leftMargin="5" - anchors.right="{layout.right}" anchors.rightMargin="5" - icon="../shared/pics/phone.png" - label="Phone"/> - <ContactField id="emailField" - anchors.left="{layout.left}" anchors.leftMargin="5" - anchors.right="{layout.right}" anchors.rightMargin="5" - icon="../shared/pics/email.png" - label="Email"/> - </VerticalLayout> -</Item> diff --git a/examples/declarative/tutorials/contacts/3_Collections/ContactField.qml b/examples/declarative/tutorials/contacts/3_Collections/ContactField.qml deleted file mode 100644 index 819914c..0000000 --- a/examples/declarative/tutorials/contacts/3_Collections/ContactField.qml +++ /dev/null @@ -1,35 +0,0 @@ -<Item id="contactField" - clip="true" - height="30"> - <properties> - <Property name="label"/> - <Property name="icon"/> - <Property name="value"/> - </properties> - <RemoveButton id="removeButton" - anchors.right="{parent.right}" - anchors.top="{parent.top}" anchors.bottom="{parent.bottom}" - expandedWidth="{contactField.width}" - onConfirmed="print('Clear field text'); fieldText.text=''"/> - <FieldText id="fieldText" - width="{contactField.width-70}" - anchors.right="{removeButton.left}" anchors.rightMargin="5" - anchors.verticalCenter="{parent.verticalCenter}" - label="{contactField.label}" - text="{contactField.value}"/> - <Image - anchors.right="{fieldText.left}" anchors.rightMargin="5" - anchors.verticalCenter="{parent.verticalCenter}" - src="{contactField.icon}"/> - <states> - <State name="editingText" when="{fieldText.state == 'editing'}"> - <SetProperty target="{removeButton.anchors}" property="rightMargin" value="-35"/> - <SetProperty target="{fieldText}" property="width" value="{contactField.width}"/> - </State> - </states> - <transitions> - <Transition fromState='' toState="*" reversible="true"> - <NumericAnimation properties="width,rightMargin" duration="200"/> - </Transition> - </transitions> -</Item> diff --git a/examples/declarative/tutorials/contacts/3_Collections/ContactView1.qml b/examples/declarative/tutorials/contacts/3_Collections/ContactView1.qml deleted file mode 100644 index 6606094..0000000 --- a/examples/declarative/tutorials/contacts/3_Collections/ContactView1.qml +++ /dev/null @@ -1,28 +0,0 @@ -<Item id="contacts" - width="240" - height="230"> - <properties> - <Property name="mouseGrabbed" value="false"/> - </properties> - <resources> - <SqlConnection id="contactDatabase" name="qmlConnection" driver="QSQLITE" databaseName="../shared/contacts.sqlite"/> - <SqlQuery id="contactList" connection="{contactDatabase}"> - <query>SELECT recid, label, email, phone FROM contacts ORDER BY label, recid</query> - </SqlQuery> - <Component id="contactDelegate"> - <Text - x="45" y="12" - width="{contactListView.width-45}" - height="30" - color="black" - font.bold="true" - text="{model.label}"/> - </Component> - </resources> - <ListView id="contactListView" - anchors.fill="{parent}" - clip="true" - model="{contactList}" - delegate="{contactDelegate}" - focus="true"/> -</Item> diff --git a/examples/declarative/tutorials/contacts/3_Collections/ContactView2.qml b/examples/declarative/tutorials/contacts/3_Collections/ContactView2.qml deleted file mode 100644 index 97868e3..0000000 --- a/examples/declarative/tutorials/contacts/3_Collections/ContactView2.qml +++ /dev/null @@ -1,68 +0,0 @@ -<Item id="contacts" - width="240" - height="230"> - <properties> - <Property name="mouseGrabbed" value="false"/> - </properties> - <resources> - <SqlConnection id="contactDatabase" name="qmlConnection" driver="QSQLITE" databaseName="../shared/contacts.sqlite"/> - <SqlQuery id="contactList" connection="{contactDatabase}"> - <query>SELECT recid AS contactid, label, email, phone FROM contacts ORDER BY label, recid</query> - </SqlQuery> - <Component id="contactDelegate"> - <Item id="wrapper" - x="0" - width="{ListView.view.width}" height="34"> - <Text id="label" - x="45" y="12" - width="{parent.width-45}" - text="{model.label}" - color="black" - font.bold="true"> - </Text> - <MouseRegion - anchors.fill="{label}" - onClicked="wrapper.state='opened'"/> - <Contact id="details" - anchors.fill="{parent}" - contactid="{model.contactid}" - label="{model.label}" - email="{model.email}" - phone="{model.phone}" - opacity="0"/> - <states> - <State name='opened'> - <SetProperty target="{wrapper}" property="height" value="{contactListView.height}"/> - <SetProperty target="{contactListView}" property="yPosition" value="{wrapper.y}"/> - <SetProperty target="{contactListView}" property="locked" value="1"/> - <SetProperty target="{label}" property="opacity" value="0"/> - <SetProperty target="{details}" property="opacity" value="1"/> - </State> - </states> - <transitions> - <Transition> - <NumericAnimation duration="500" properties="yPosition,height,opacity"/> - </Transition> - </transitions> - <Connection sender="{cancelEditButton}" signal="clicked()"> - if (wrapper.state == 'opened') { - wrapper.state = ''; - } - </Connection> - </Item> - </Component> - </resources> - <Button id="cancelEditButton" - anchors.top="{parent.top}" anchors.topMargin="5" - anchors.right="{parent.right}" anchors.rightMargin="5" - icon="../shared/pics/cancel.png"/> - <ListView id="contactListView" - anchors.left="{parent.left}" - anchors.right="{parent.right}" - anchors.top="{cancelEditButton.bottom}" - anchors.bottom="{parent.bottom}" - clip="true" - model="{contactList}" - delegate="{contactDelegate}" - focus="true"/> -</Item> diff --git a/examples/declarative/tutorials/contacts/3_Collections/ContactView3.qml b/examples/declarative/tutorials/contacts/3_Collections/ContactView3.qml deleted file mode 100644 index c15ece2..0000000 --- a/examples/declarative/tutorials/contacts/3_Collections/ContactView3.qml +++ /dev/null @@ -1,73 +0,0 @@ -<Item id="contacts" - width="240" - height="230"> - <properties> - <Property name="mouseGrabbed" value="false"/> - </properties> - <resources> - <SqlConnection id="contactDatabase" name="qmlConnection" driver="QSQLITE" databaseName="../shared/contacts.sqlite"/> - <SqlQuery id="contactList" connection="{contactDatabase}"> - <query>SELECT recid AS contactid, label, email, phone FROM contacts ORDER BY label, recid</query> - </SqlQuery> - <Component id="contactDelegate"> - <Item id="wrapper" - x="0" - width="{ListView.view.width}" height="34"> - <Text id="label" - x="45" y="12" - width="{parent.width-45}" - text="{model.label}" - color="black" - font.bold="true"> - </Text> - <MouseRegion - anchors.fill="{label}"> - <onClicked> - Details.qml = 'Contact.qml'; - wrapper.state='opened'; - </onClicked> - </MouseRegion> - <Item id="Details" - anchors.fill="{wrapper}" - opacity="0"> - <Bind target="{Details.qmlItem}" property="contactid" value="{model.contactid}"/> - <Bind target="{Details.qmlItem}" property="label" value="{model.label}"/> - <Bind target="{Details.qmlItem}" property="phone" value="{model.phone}"/> - <Bind target="{Details.qmlItem}" property="email" value="{model.email}"/> - </Item> - <states> - <State name='opened'> - <SetProperty target="{wrapper}" property="height" value="{contactListView.height}"/> - <SetProperty target="{contactListView}" property="yPosition" value="{wrapper.y}"/> - <SetProperty target="{contactListView}" property="locked" value="1"/> - <SetProperty target="{label}" property="opacity" value="0"/> - <SetProperty target="{Details}" property="opacity" value="1"/> - </State> - </states> - <transitions> - <Transition> - <NumericAnimation duration="500" properties="yPosition,height,opacity"/> - </Transition> - </transitions> - <Connection sender="{cancelEditButton}" signal="clicked()"> - if (wrapper.state == 'opened') { - wrapper.state = ''; - } - </Connection> - </Item> - </Component> - </resources> - <Button id="cancelEditButton" - anchors.top="{parent.top}" anchors.topMargin="5" - anchors.right="{parent.right}" anchors.rightMargin="5" - icon="../shared/pics/cancel.png"/> - <ListView id="contactListView" - anchors.left="{parent.left}" - anchors.right="{parent.right}" - anchors.top="{cancelEditButton.bottom}" - anchors.bottom="{parent.bottom}" - clip="true" - model="{contactList}" - delegate="{contactDelegate}" - focus="true"/> -</Item> diff --git a/examples/declarative/tutorials/contacts/3_Collections/FieldText.qml b/examples/declarative/tutorials/contacts/3_Collections/FieldText.qml deleted file mode 100644 index 583c73e..0000000 --- a/examples/declarative/tutorials/contacts/3_Collections/FieldText.qml +++ /dev/null @@ -1,96 +0,0 @@ -<Rect id="fieldText" - height="30" - radius="5" - color="white"> - <properties> - <Property - name="text" - value="" - onValueChanged="reset()"/> - <Property - name="label" - value=""/> - </properties> - <signals> - <Signal name="confirmed"/> - </signals> - <resources> - <Script> - function edit() { - if (!contacts.mouseGrabbed) { - fieldText.state='editing'; - contacts.mouseGrabbed=true; - } - } - function confirm() { - fieldText.text = textEdit.text; - fieldText.state=''; - contacts.mouseGrabbed=false; - fieldText.confirmed.emit(); - } - function reset() { - textEdit.text = fieldText.text; - fieldText.state=''; - contacts.mouseGrabbed=false; - } - </Script> - </resources> - <Image id="cancelIcon" - width="22" height="22" - anchors.right="{parent.right}" anchors.rightMargin="4" - anchors.verticalCenter="{parent.verticalCenter}" - src="../shared/pics/cancel.png" - opacity="0"/> - <Image id="confirmIcon" - width="22" height="22" - anchors.left="{parent.left}" anchors.leftMargin="4" - anchors.verticalCenter="{parent.verticalCenter}" - src="../shared/pics/ok.png" - opacity="0"/> - <TextEdit id="textEdit" - anchors.left="{parent.left}" anchors.leftMargin="5" - anchors.right="{parent.right}" anchors.rightMargin="5" - anchors.verticalCenter="{parent.verticalCenter}" - color="black" - font.bold="true" - readOnly="true" - wrap="false" - /> - <Text id="textLabel" - x="5" width="{parent.width-10}" - anchors.verticalCenter="{parent.verticalCenter}" - hAlign="AlignHCenter" - color="#505050" - font.italic="true" - text="{fieldText.label}" - opacity="{textEdit.text != '' ? 0 : 1}"> - <opacity> - <Behaviour> - <NumericAnimation property="opacity" duration="250"/> - </Behaviour> - </opacity> - </Text> - <MouseRegion anchors.fill="{cancelIcon}" onClicked="reset()"/> - <MouseRegion anchors.fill="{confirmIcon}" onClicked="confirm()"/> - <MouseRegion - id="editRegion" - anchors.fill="{textEdit}" - onClicked="edit()"/> - <states> - <State name="editing"> - <SetProperty target="{confirmIcon}" property="opacity" value="1"/> - <SetProperty target="{cancelIcon}" property="opacity" value="1"/> - <SetProperty target="{textEdit}" property="readOnly" value="false"/> - <SetProperty target="{textEdit}" property="focus" value="true"/> - <SetProperty target="{editRegion}" property="opacity" value="0"/> - <SetProperty target="{textEdit.anchors}" property="leftMargin" value="39"/> - <SetProperty target="{textEdit.anchors}" property="rightMargin" value="39"/> - </State> - </states> - <transitions> - <Transition fromState='' toState="*" reversible="true"> - <NumericAnimation properties="opacity,leftMargin,rightMargin" duration="200"/> - <ColorAnimation duration="150"/> - </Transition> - </transitions> -</Rect> diff --git a/examples/declarative/tutorials/contacts/3_Collections/GroupBox.qml b/examples/declarative/tutorials/contacts/3_Collections/GroupBox.qml index 01f26ee..665c072 100644 --- a/examples/declarative/tutorials/contacts/3_Collections/GroupBox.qml +++ b/examples/declarative/tutorials/contacts/3_Collections/GroupBox.qml @@ -1,17 +1,59 @@ -<Item id="groupBox" width="{Math.max(270, subItem.width+40)}" height="{Math.max(70, subItem.height+40)}"> - <properties> - <Property name="contents"/> - <Property name="label"/> - </properties> - <Rect id="wrapper" x="5" y="10" radius="10" - width="{groupBox.width-20}" height="{groupBox.height-20}" - color="white" pen.color="black"> - <Item id="subItem" qml="{groupBox.contents}" - anchors.top="{parent.top}" anchors.topMargin="10" - anchors.right="{parent.right}" anchors.rightMargin="10" - width="{qmlItem.width}" height="{qmlItem.height}"/> - </Rect> - <Rect x="20" y="0" height="{text.height}" width="{text.width+10}" color="white"> - <Text x="5" id="text" text="{label}" font.bold="true"/> - </Rect> -</Item> +FocusRealm { + id: groupBox + width: Math.max(270, subItem.width+40) + height: Math.max(70, subItem.height+40) + properties: Property { + name: "contents" + } + properties: Property { + name: "label" + } + Rect { + id: wrapper + x: 5 + y: 10 + radius: 10 + width: groupBox.width-20 + height: groupBox.height-20 + color: "white" + pen.color: "black" + Item { + id: subItem + qml: groupBox.contents + anchors.top: parent.top + anchors.topMargin: 10 + anchors.right: parent.right + anchors.rightMargin: 10 + width: qmlItem.width + height: qmlItem.height + } + } + Rect { + x: 20 + y: 0 + height: text.height + width: text.width+10 + color: "white" + Text { + x: 5 + id: text + text: label + font.bold: true + } + } + Rect { + color: "black" + anchors.fill: parent + opacity: parent.focus ? 0 : 0.3 + MouseRegion { + anchors.fill: parent + onClicked: { parent.parent.focus=true } + } + opacity: Behaviour { + NumericAnimation { + property: "opacity" + duration: 250 + } + } + } +} diff --git a/examples/declarative/tutorials/contacts/3_Collections/RemoveButton.qml b/examples/declarative/tutorials/contacts/3_Collections/RemoveButton.qml deleted file mode 100644 index 493ab7a..0000000 --- a/examples/declarative/tutorials/contacts/3_Collections/RemoveButton.qml +++ /dev/null @@ -1,80 +0,0 @@ -<Rect id="removeButton" - width="30" height="30" - color="red" - radius="5"> - <properties> - <Property name="expandedWidth" value="230"/> - </properties> - <signals> - <Signal name="confirmed"/> - </signals> - <resources> - <Script> - function toggle() { - print('removeButton.toggle()'); - if (removeButton.state == 'opened') { - removeButton.state = ''; - contacts.mouseGrabbed=false; - } else { - if (!contacts.mouseGrabbed) { - removeButton.state = 'opened'; - contacts.mouseGrabbed=true; - } - } - } - </Script> - </resources> - <Image id="trashIcon" - width="22" height="22" - anchors.right="{parent.right}" anchors.rightMargin="4" - anchors.verticalCenter="{parent.verticalCenter}" - src="../shared/pics/trash.png" - opacity="1"> - <MouseRegion - anchors.fill="{parent}" - onClicked="toggle()"/> - </Image> - <Image id="cancelIcon" - width="22" height="22" - anchors.right="{parent.right}" anchors.rightMargin="4" - anchors.verticalCenter="{parent.verticalCenter}" - src="../shared/pics/cancel.png" - opacity="0"> - <MouseRegion - anchors.fill="{parent}" - onClicked="toggle()"/> - </Image> - <Image id="confirmIcon" - width="22" height="22" - anchors.left="{parent.left}" anchors.leftMargin="4" - anchors.verticalCenter="{parent.verticalCenter}" - src="../shared/pics/ok.png" - opacity="0"> - <MouseRegion - anchors.fill="{parent}" - onClicked="toggle(); removeButton.confirmed.emit()"/> - </Image> - <Text id="text" - anchors.verticalCenter="{parent.verticalCenter}" - anchors.left="{confirmIcon.right}" anchors.leftMargin="4" - anchors.right="{cancelIcon.left}" anchors.rightMargin="4" - font.bold="true" - color="white" - hAlign="AlignHCenter" - text="Remove" - opacity="0"/> - <states> - <State name="opened"> - <SetProperty target="{removeButton}" property="width" value="{removeButton.expandedWidth}"/> - <SetProperty target="{text}" property="opacity" value="1"/> - <SetProperty target="{confirmIcon}" property="opacity" value="1"/> - <SetProperty target="{cancelIcon}" property="opacity" value="1"/> - <SetProperty target="{trashIcon}" property="opacity" value="0"/> - </State> - </states> - <transitions> - <Transition fromState="*" toState="opened" reversible="true"> - <NumericAnimation properties="opacity,x,width" duration="200"/> - </Transition> - </transitions> -</Rect> diff --git a/examples/declarative/tutorials/contacts/3_Collections/lib/Button.qml b/examples/declarative/tutorials/contacts/3_Collections/lib/Button.qml new file mode 100644 index 0000000..57267f8 --- /dev/null +++ b/examples/declarative/tutorials/contacts/3_Collections/lib/Button.qml @@ -0,0 +1,61 @@ +Item { + id: button + width: 30 + height: 30 + properties: Property { + name: "icon" + } + signals: Signal { + name: "clicked" + } + Rect { + id: buttonRect + anchors.fill: parent + color: "lightgreen" + radius: 5 + Image { + id: iconImage + source: button.icon + anchors.horizontalCenter: buttonRect.horizontalCenter + anchors.verticalCenter: buttonRect.verticalCenter + } + MouseRegion { + id: buttonMouseRegion + anchors.fill: buttonRect + onClicked: { button.clicked.emit() } + } + states: [ + State { + name: "pressed" + when: buttonMouseRegion.pressed == true + SetProperty { + target: buttonRect + property: "color" + value: "green" + } + } + ] + transitions: [ + Transition { + fromState: "*" + toState: "pressed" + ColorAnimation { + duration: 200 + } + }, + Transition { + fromState: "pressed" + toState: "*" + ColorAnimation { + duration: 1000 + } + } + ] + } + opacity: Behaviour { + NumericAnimation { + property: "opacity" + duration: 250 + } + } +} diff --git a/examples/declarative/tutorials/contacts/3_Collections/lib/Contact.qml b/examples/declarative/tutorials/contacts/3_Collections/lib/Contact.qml new file mode 100644 index 0000000..a7e78dc --- /dev/null +++ b/examples/declarative/tutorials/contacts/3_Collections/lib/Contact.qml @@ -0,0 +1,52 @@ +Item { + id: contactDetails + anchors.fill: parent + properties: Property { + name: "contactid" + value: "" + } + properties: Property { + name: "label" + onValueChanged: { labelField.value = label } + } + properties: Property { + name: "phone" + onValueChanged: { phoneField.value = phone } + } + properties: Property { + name: "email" + onValueChanged: { emailField.value = email } + } + VerticalLayout { + id: layout + anchors.fill: parent + spacing: 5 + margin: 5 + ContactField { + id: labelField + anchors.left: layout.left + anchors.leftMargin: 5 + anchors.right: layout.right + anchors.rightMargin: 5 + label: "Name" + } + ContactField { + id: phoneField + anchors.left: layout.left + anchors.leftMargin: 5 + anchors.right: layout.right + anchors.rightMargin: 5 + icon: "../../shared/pics/phone.png" + label: "Phone" + } + ContactField { + id: emailField + anchors.left: layout.left + anchors.leftMargin: 5 + anchors.right: layout.right + anchors.rightMargin: 5 + icon: "../../shared/pics/email.png" + label: "Email" + } + } +} diff --git a/examples/declarative/tutorials/contacts/3_Collections/lib/ContactField.qml b/examples/declarative/tutorials/contacts/3_Collections/lib/ContactField.qml new file mode 100644 index 0000000..0c422b7 --- /dev/null +++ b/examples/declarative/tutorials/contacts/3_Collections/lib/ContactField.qml @@ -0,0 +1,64 @@ +Item { + id: contactField + clip: true + height: 30 + properties: Property { + name: "label" + } + properties: Property { + name: "icon" + } + properties: Property { + name: "value" + } + RemoveButton { + id: removeButton + anchors.right: parent.right + anchors.top: parent.top + anchors.bottom: parent.bottom + expandedWidth: contactField.width + onConfirmed: { fieldText.text='' } + } + FieldText { + id: fieldText + width: contactField.width-70 + anchors.right: removeButton.left + anchors.rightMargin: 5 + anchors.verticalCenter: parent.verticalCenter + label: contactField.label + text: contactField.value + } + Image { + anchors.right: fieldText.left + anchors.rightMargin: 5 + anchors.verticalCenter: parent.verticalCenter + source: contactField.icon + } + states: [ + State { + name: "editingText" + when: fieldText.state == 'editing' + SetProperty { + target: removeButton.anchors + property: "rightMargin" + value: -35 + } + SetProperty { + target: fieldText + property: "width" + value: contactField.width + } + } + ] + transitions: [ + Transition { + fromState: "" + toState: "*" + reversible: true + NumericAnimation { + properties: "width,rightMargin" + duration: 200 + } + } + ] +} diff --git a/examples/declarative/tutorials/contacts/3_Collections/lib/FieldText.qml b/examples/declarative/tutorials/contacts/3_Collections/lib/FieldText.qml new file mode 100644 index 0000000..8ba01da --- /dev/null +++ b/examples/declarative/tutorials/contacts/3_Collections/lib/FieldText.qml @@ -0,0 +1,157 @@ +Rect { + id: fieldText + height: 30 + radius: 5 + color: "white" + properties: Property { + name: "text" + value: "" + onValueChanged: { reset() } + } + properties: Property { + name: "label" + value: "" + } + signals: Signal { + name: "confirmed" + } + resources: [ + Script { + + function edit() { + if (!contacts.mouseGrabbed) { + fieldText.state='editing'; + contacts.mouseGrabbed=true; + } + } + function confirm() { + fieldText.text = textEdit.text; + fieldText.state=''; + contacts.mouseGrabbed=false; + fieldText.confirmed.emit(); + } + function reset() { + textEdit.text = fieldText.text; + fieldText.state=''; + contacts.mouseGrabbed=false; + } + + } + ] + Image { + id: cancelIcon + width: 22 + height: 22 + anchors.right: parent.right + anchors.rightMargin: 4 + anchors.verticalCenter: parent.verticalCenter + source: "../../shared/pics/cancel.png" + opacity: 0 + } + Image { + id: confirmIcon + width: 22 + height: 22 + anchors.left: parent.left + anchors.leftMargin: 4 + anchors.verticalCenter: parent.verticalCenter + source: "../../shared/pics/ok.png" + opacity: 0 + } + TextEdit { + id: textEdit + anchors.left: parent.left + anchors.leftMargin: 5 + anchors.right: parent.right + anchors.rightMargin: 5 + anchors.verticalCenter: parent.verticalCenter + color: "black" + font.bold: true + readOnly: true + wrap: false + } + Text { + id: textLabel + x: 5 + width: parent.width-10 + anchors.verticalCenter: parent.verticalCenter + hAlign: "AlignHCenter" + color: "#505050" + font.italic: true + text: fieldText.label + opacity: textEdit.text == '' ? 1 : 0 + opacity: Behaviour { + NumericAnimation { + property: "opacity" + duration: 250 + } + } + } + MouseRegion { + anchors.fill: cancelIcon + onClicked: { reset() } + } + MouseRegion { + anchors.fill: confirmIcon + onClicked: { confirm() } + } + MouseRegion { + id: editRegion + anchors.fill: textEdit + onClicked: { edit() } + } + states: [ + State { + name: "editing" + SetProperty { + target: confirmIcon + property: "opacity" + value: 1 + } + SetProperty { + target: cancelIcon + property: "opacity" + value: 1 + } + SetProperty { + target: textEdit + property: "readOnly" + value: false + } + SetProperty { + target: textEdit + property: "focus" + value: true + } + SetProperty { + target: editRegion + property: "opacity" + value: 0 + } + SetProperty { + target: textEdit.anchors + property: "leftMargin" + value: 39 + } + SetProperty { + target: textEdit.anchors + property: "rightMargin" + value: 39 + } + } + ] + transitions: [ + Transition { + fromState: "" + toState: "*" + reversible: true + NumericAnimation { + properties: "opacity,leftMargin,rightMargin" + duration: 200 + } + ColorAnimation { + duration: 150 + } + } + ] +} diff --git a/examples/declarative/tutorials/contacts/3_Collections/lib/RemoveButton.qml b/examples/declarative/tutorials/contacts/3_Collections/lib/RemoveButton.qml new file mode 100644 index 0000000..0b90e48 --- /dev/null +++ b/examples/declarative/tutorials/contacts/3_Collections/lib/RemoveButton.qml @@ -0,0 +1,126 @@ +Rect { + id: removeButton + width: 30 + height: 30 + color: "red" + radius: 5 + properties: Property { + name: "expandedWidth" + value: 230 + } + signals: Signal { + name: "confirmed" + } + resources: [ + Script { + function toggle() { + if (removeButton.state == 'opened') { + removeButton.state = ''; + contacts.mouseGrabbed=false; + } else { + if (!contacts.mouseGrabbed) { + removeButton.state = 'opened'; + contacts.mouseGrabbed=true; + } + } + } + + } + ] + Image { + id: trashIcon + width: 22 + height: 22 + anchors.right: parent.right + anchors.rightMargin: 4 + anchors.verticalCenter: parent.verticalCenter + source: "../../shared/pics/trash.png" + opacity: 1 + MouseRegion { + anchors.fill: parent + onClicked: { toggle() } + } + } + Image { + id: cancelIcon + width: 22 + height: 22 + anchors.right: parent.right + anchors.rightMargin: 4 + anchors.verticalCenter: parent.verticalCenter + source: "../../shared/pics/cancel.png" + opacity: 0 + MouseRegion { + anchors.fill: parent + onClicked: { toggle() } + } + } + Image { + id: confirmIcon + width: 22 + height: 22 + anchors.left: parent.left + anchors.leftMargin: 4 + anchors.verticalCenter: parent.verticalCenter + source: "../../shared/pics/ok.png" + opacity: 0 + MouseRegion { + anchors.fill: parent + onClicked: { toggle(); removeButton.confirmed.emit() } + } + } + Text { + id: text + anchors.verticalCenter: parent.verticalCenter + anchors.left: confirmIcon.right + anchors.leftMargin: 4 + anchors.right: cancelIcon.left + anchors.rightMargin: 4 + font.bold: true + color: "white" + hAlign: "AlignHCenter" + text: "Remove" + opacity: 0 + } + states: [ + State { + name: "opened" + SetProperty { + target: removeButton + property: "width" + value: removeButton.expandedWidth + } + SetProperty { + target: text + property: "opacity" + value: 1 + } + SetProperty { + target: confirmIcon + property: "opacity" + value: 1 + } + SetProperty { + target: cancelIcon + property: "opacity" + value: 1 + } + SetProperty { + target: trashIcon + property: "opacity" + value: 0 + } + } + ] + transitions: [ + Transition { + fromState: "*" + toState: "opened" + reversible: true + NumericAnimation { + properties: "opacity,x,width" + duration: 200 + } + } + ] +} diff --git a/examples/declarative/tutorials/contacts/Final/Button.qml b/examples/declarative/tutorials/contacts/Final/Button.qml index 8290d35..14965b5 100644 --- a/examples/declarative/tutorials/contacts/Final/Button.qml +++ b/examples/declarative/tutorials/contacts/Final/Button.qml @@ -10,7 +10,7 @@ color="lightgreen" radius="5"> <Image id="iconImage" - src="{button.icon}" + source="{button.icon}" anchors.horizontalCenter="{buttonRect.horizontalCenter}" anchors.verticalCenter="{buttonRect.verticalCenter}"/> <MouseRegion id="buttonMouseRegion" diff --git a/examples/declarative/tutorials/contacts/Final/ContactField.qml b/examples/declarative/tutorials/contacts/Final/ContactField.qml index fe9329a..80ffd30 100644 --- a/examples/declarative/tutorials/contacts/Final/ContactField.qml +++ b/examples/declarative/tutorials/contacts/Final/ContactField.qml @@ -21,7 +21,7 @@ <Image anchors.right="{fieldText.left}" anchors.rightMargin="5" anchors.verticalCenter="{parent.verticalCenter}" - src="{contactField.icon}"/> + source="{contactField.icon}"/> <states> <State name="editingText" when="{fieldText.state == 'editing'}"> <SetProperty target="{removeButton.anchors}" property="rightMargin" value="-35"/> diff --git a/examples/declarative/tutorials/contacts/Final/FieldText.qml b/examples/declarative/tutorials/contacts/Final/FieldText.qml index a82cecd..ad7669d 100644 --- a/examples/declarative/tutorials/contacts/Final/FieldText.qml +++ b/examples/declarative/tutorials/contacts/Final/FieldText.qml @@ -39,13 +39,13 @@ width="22" height="22" anchors.right="{parent.right}" anchors.rightMargin="4" anchors.verticalCenter="{parent.verticalCenter}" - src="../shared/pics/cancel.png" + source="../shared/pics/cancel.png" opacity="0"/> <Image id="confirmIcon" width="22" height="22" anchors.left="{parent.left}" anchors.leftMargin="4" anchors.verticalCenter="{parent.verticalCenter}" - src="../shared/pics/ok.png" + source="../shared/pics/ok.png" opacity="0"/> <TextEdit id="textEdit" anchors.left="{parent.left}" anchors.leftMargin="0" @@ -63,7 +63,7 @@ color="#505050" font.italic="true" text="{fieldText.label}" - opacity="{textEdit.text != '' ? 0 : 1}"> + opacity="{textEdit.text == '' ? 1 : 0}"> <opacity> <Behaviour> <NumericAnimation property="opacity" duration="250"/> diff --git a/examples/declarative/tutorials/contacts/Final/RemoveButton.qml b/examples/declarative/tutorials/contacts/Final/RemoveButton.qml index 493ab7a..b096bca 100644 --- a/examples/declarative/tutorials/contacts/Final/RemoveButton.qml +++ b/examples/declarative/tutorials/contacts/Final/RemoveButton.qml @@ -28,7 +28,7 @@ width="22" height="22" anchors.right="{parent.right}" anchors.rightMargin="4" anchors.verticalCenter="{parent.verticalCenter}" - src="../shared/pics/trash.png" + source="../shared/pics/trash.png" opacity="1"> <MouseRegion anchors.fill="{parent}" @@ -38,7 +38,7 @@ width="22" height="22" anchors.right="{parent.right}" anchors.rightMargin="4" anchors.verticalCenter="{parent.verticalCenter}" - src="../shared/pics/cancel.png" + source="../shared/pics/cancel.png" opacity="0"> <MouseRegion anchors.fill="{parent}" @@ -48,7 +48,7 @@ width="22" height="22" anchors.left="{parent.left}" anchors.leftMargin="4" anchors.verticalCenter="{parent.verticalCenter}" - src="../shared/pics/ok.png" + source="../shared/pics/ok.png" opacity="0"> <MouseRegion anchors.fill="{parent}" diff --git a/examples/declarative/tutorials/contacts/Final/SearchBar.qml b/examples/declarative/tutorials/contacts/Final/SearchBar.qml index aea5a5d..3965e39 100644 --- a/examples/declarative/tutorials/contacts/Final/SearchBar.qml +++ b/examples/declarative/tutorials/contacts/Final/SearchBar.qml @@ -6,7 +6,7 @@ <Image id="searchIcon" anchors.left="{parent.left}" anchors.leftMargin="5" anchors.verticalCenter="{parent.verticalCenter}" - src="../shared/pics/search.png"/> + source="../shared/pics/search.png"/> <TextEdit id="searchEdit" anchors.left="{searchIcon.right}" anchors.right="{parent.right}" anchors.leftMargin="5" anchors.rightMargin="5" diff --git a/examples/declarative/tutorials/contacts/shared/contacts.sqlite b/examples/declarative/tutorials/contacts/shared/contacts.sqlite Binary files differindex 7347adc..6918878 100644 --- a/examples/declarative/tutorials/contacts/shared/contacts.sqlite +++ b/examples/declarative/tutorials/contacts/shared/contacts.sqlite diff --git a/examples/declarative/velocity/Day.qml b/examples/declarative/velocity/Day.qml index 3441648..b65f2bc 100644 --- a/examples/declarative/velocity/Day.qml +++ b/examples/declarative/velocity/Day.qml @@ -4,7 +4,7 @@ <Property name="stickies" /> </properties> - <Image x="10" y="10" src="cork.jpg" opaque="true"/> + <Image x="10" y="10" source="cork.jpg" opaque="true"/> <Text x="20" y="20" height="40" font.size="14" font.bold="true" width="370" text="{day}" style="Outline" styleColor="#dedede"/> <Repeater dataSource="{Page.stickies}"> @@ -13,13 +13,13 @@ <Follow source="{-Flick.xVelocity / 100}" spring="2.0" damping="0.1"/> </rotation> <Item id="Sticky" scale="0.5"> - <Image id="StickyImage" src="sticky.png" smooth="true" y="-20" x="{8 + -width * 0.6 / 2}" scale="0.6" /> + <Image id="StickyImage" source="sticky.png" smooth="true" y="-20" x="{8 + -width * 0.6 / 2}" scale="0.6" /> <TextEdit id="MyText" smooth="true" font.size="28" readOnly="false" x="-104" y="36" wrap="true" rotation="-8" text="{noteText}" width="195" height="172" /> <Item y="-20" x="{StickyImage.x}" width="{StickyImage.width * StickyImage.scale}" height="{StickyImage.height * StickyImage.scale}" > <MouseRegion id="Mouse" onClicked="MyText.focus = true" anchors.fill="{parent}" drag.target="{StickyPage}" drag.axis="xy" drag.ymin="0" drag.ymax="500" drag.xmin="0" drag.xmax="400"/> </Item> </Item> - <Image src="tack.png" x="{-width / 2}" y="{-height * 0.7 / 2}" scale="0.7" /> + <Image source="tack.png" x="{-width / 2}" y="{-height * 0.7 / 2}" scale="0.7" /> <states> <State name="pressed" when="{Mouse.pressed}"> diff --git a/examples/declarative/webview/qml-in-html.qml b/examples/declarative/webview/qml-in-html.qml index 2715788..8c1c06f 100644 --- a/examples/declarative/webview/qml-in-html.qml +++ b/examples/declarative/webview/qml-in-html.qml @@ -1,7 +1,7 @@ <!-- The WebView supports QML data through the HTML OBJECT tag --> <Flickable width="{250*.75}" height="240" viewportWidth="{Web.width*Web.scale}" viewportHeight="{Web.height*Web.scale}"> -<WebView id="Web" width="250" height="420" scale="0.75"> +<WebView id="Web" width="250" height="420" scale="0.75" settings.pluginsEnabled="true"> <html><![CDATA[ <html> <body bgcolor=white> diff --git a/examples/declarative/xmldata/daringfireball.qml b/examples/declarative/xmldata/daringfireball.qml index cfd0a98..5e98d1b 100644 --- a/examples/declarative/xmldata/daringfireball.qml +++ b/examples/declarative/xmldata/daringfireball.qml @@ -1,6 +1,6 @@ <Rect color="white" width="600" height="600"> <resources> - <XmlListModel id="feedModel" src="http://daringfireball.net/index.xml" + <XmlListModel id="feedModel" source="http://daringfireball.net/index.xml" query="doc($src)/feed/entry"> <namespaceDeclarations> declare default element namespace 'http://www.w3.org/2005/Atom'; diff --git a/examples/declarative/xmldata/yahoonews.qml b/examples/declarative/xmldata/yahoonews.qml index 80ace18..32a706e 100644 --- a/examples/declarative/xmldata/yahoonews.qml +++ b/examples/declarative/xmldata/yahoonews.qml @@ -1,6 +1,6 @@ <Rect color="black" gradientColor="#AAAAAA" width="600" height="600"> <resources> - <XmlListModel id="feedModel" src="http://rss.news.yahoo.com/rss/oceania" query="doc($src)/rss/channel/item"> + <XmlListModel id="feedModel" source="http://rss.news.yahoo.com/rss/oceania" query="doc($src)/rss/channel/item"> <Role name="title" query="title/string()"/> <Role name="link" query="link/string()"/> <Role name="description" query="description/string()" isCData="true"/> diff --git a/examples/graphicsview/elasticnodes/edge.cpp b/examples/graphicsview/elasticnodes/edge.cpp index e32a35a..eb02143 100644 --- a/examples/graphicsview/elasticnodes/edge.cpp +++ b/examples/graphicsview/elasticnodes/edge.cpp @@ -96,7 +96,7 @@ void Edge::adjust() prepareGeometryChange(); - if (!qFuzzyCompare(length, qreal(0.0))) { + if (length > qreal(20.)) { QPointF edgeOffset((line.dx() * 10) / length, (line.dy() * 10) / length); sourcePoint = line.p1() + edgeOffset; destPoint = line.p2() - edgeOffset; @@ -124,12 +124,15 @@ void Edge::paint(QPainter *painter, const QStyleOptionGraphicsItem *, QWidget *) if (!source || !dest) return; - // Draw the line itself QLineF line(sourcePoint, destPoint); + if (qFuzzyCompare(line.length(), qreal(0.))) + return; + + // Draw the line itself painter->setPen(QPen(Qt::black, 1, Qt::SolidLine, Qt::RoundCap, Qt::RoundJoin)); painter->drawLine(line); - // Draw the arrows if there's enough room + // Draw the arrows double angle = ::acos(line.dx() / line.length()); if (line.dy() >= 0) angle = TwoPi - angle; diff --git a/examples/itemviews/chart/pieview.cpp b/examples/itemviews/chart/pieview.cpp index 6b62f25..48f4073 100644 --- a/examples/itemviews/chart/pieview.cpp +++ b/examples/itemviews/chart/pieview.cpp @@ -254,7 +254,7 @@ void PieView::mousePressEvent(QMouseEvent *event) QAbstractItemView::mousePressEvent(event); origin = event->pos(); if (!rubberBand) - rubberBand = new QRubberBand(QRubberBand::Rectangle, this); + rubberBand = new QRubberBand(QRubberBand::Rectangle, viewport()); rubberBand->setGeometry(QRect(origin, QSize())); rubberBand->show(); } diff --git a/examples/network/googlesuggest/googlesuggest.cpp b/examples/network/googlesuggest/googlesuggest.cpp new file mode 100644 index 0000000..285a018 --- /dev/null +++ b/examples/network/googlesuggest/googlesuggest.cpp @@ -0,0 +1,223 @@ +/**************************************************************************** +** +** Copyright (C) 2009 Nokia Corporation and/or its subsidiary(-ies). +** Contact: Qt Software Information (qt-info@nokia.com) +** +** This file is part of the examples of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:LGPL$ +** No Commercial Usage +** This file contains pre-release code and may not be distributed. +** You may use this file in accordance with the terms and conditions +** contained in the either Technology Preview License Agreement or the +** Beta Release License Agreement. +** +** GNU Lesser General Public License Usage +** Alternatively, this file may be used under the terms of the GNU Lesser +** General Public License version 2.1 as published by the Free Software +** Foundation and appearing in the file LICENSE.LGPL included in the +** packaging of this file. Please review the following information to +** ensure the GNU Lesser General Public License version 2.1 requirements +** will be met: http://www.gnu.org/licenses/old-licenses/lgpl-2.1.html. +** +** In addition, as a special exception, Nokia gives you certain +** additional rights. These rights are described in the Nokia Qt LGPL +** Exception version 1.0, included in the file LGPL_EXCEPTION.txt in this +** package. +** +** GNU General Public License Usage +** Alternatively, this file may be used under the terms of the GNU +** General Public License version 3.0 as published by the Free Software +** Foundation and appearing in the file LICENSE.GPL included in the +** packaging of this file. Please review the following information to +** ensure the GNU General Public License version 3.0 requirements will be +** met: http://www.gnu.org/copyleft/gpl.html. +** +** If you are unsure which license is appropriate for your use, please +** contact the sales department at qt-sales@nokia.com. +** $QT_END_LICENSE$ +** +****************************************************************************/ + +#include <QtCore> +#include <QtGui> +#include <QtNetwork> + +#include "googlesuggest.h" + +#define GSUGGEST_URL "http://google.com/complete/search?output=toolbar&q=%1" + +GSuggestCompletion::GSuggestCompletion(QLineEdit *parent): QObject(parent), editor(parent) +{ + popup = new QTreeWidget; + popup->setColumnCount(2); + popup->setUniformRowHeights(true); + popup->setRootIsDecorated(false); + popup->setEditTriggers(QTreeWidget::NoEditTriggers); + popup->setSelectionBehavior(QTreeWidget::SelectRows); + popup->setFrameStyle(QFrame::Box | QFrame::Plain); + popup->setHorizontalScrollBarPolicy(Qt::ScrollBarAlwaysOff); + + popup->header()->hide(); + popup->installEventFilter(this); + popup->setMouseTracking(true); + + connect(popup, SIGNAL(itemClicked(QTreeWidgetItem*, int)), + SLOT(doneCompletion())); + + popup->setWindowFlags(Qt::Popup); + popup->setFocusPolicy(Qt::NoFocus); + popup->setFocusProxy(parent); + + timer = new QTimer(this); + timer->setSingleShot(true); + timer->setInterval(500); + connect(timer, SIGNAL(timeout()), SLOT(autoSuggest())); + connect(editor, SIGNAL(textEdited(QString)), timer, SLOT(start())); + + connect(&networkManager, SIGNAL(finished(QNetworkReply*)), + this, SLOT(handleNetworkData(QNetworkReply*))); + +} + +GSuggestCompletion::~GSuggestCompletion() +{ + delete popup; +} + +bool GSuggestCompletion::eventFilter(QObject *obj, QEvent *ev) +{ + if (obj != popup) + return false; + + if (ev->type() == QEvent::MouseButtonPress) { + popup->hide(); + editor->setFocus(); + return true; + } + + if (ev->type() == QEvent::KeyPress) { + + bool consumed = false; + int key = static_cast<QKeyEvent*>(ev)->key(); + switch (key) { + case Qt::Key_Enter: + case Qt::Key_Return: + doneCompletion(); + consumed = true; + + case Qt::Key_Escape: + editor->setFocus(); + popup->hide(); + consumed = true; + + case Qt::Key_Up: + case Qt::Key_Down: + case Qt::Key_Home: + case Qt::Key_End: + case Qt::Key_PageUp: + case Qt::Key_PageDown: + break; + + default: + editor->setFocus(); + editor->event(ev); + popup->hide(); + break; + } + + return consumed; + } + + return false; +} + +void GSuggestCompletion::showCompletion(const QStringList &choices, const QStringList &hits) +{ + + if (choices.isEmpty() || choices.count() != hits.count()) + return; + + const QPalette &pal = editor->palette(); + QColor color = pal.color(QPalette::Disabled, QPalette::WindowText); + + popup->setUpdatesEnabled(false); + popup->clear(); + for (int i = 0; i < choices.count(); ++i) { + QTreeWidgetItem * item; + item = new QTreeWidgetItem(popup); + item->setText(0, choices[i]); + item->setText(1, hits[i]); + item->setTextAlignment(1, Qt::AlignRight); + item->setTextColor(1, color); + } + popup->setCurrentItem(popup->topLevelItem(0)); + popup->resizeColumnToContents(0); + popup->resizeColumnToContents(1); + popup->adjustSize(); + popup->setUpdatesEnabled(true); + + int h = popup->sizeHintForRow(0) * qMin(7, choices.count()) + 3; + popup->resize(popup->width(), h); + + popup->move(editor->mapToGlobal(QPoint(0, editor->height()))); + popup->setFocus(); + popup->show(); +} + +void GSuggestCompletion::doneCompletion() +{ + timer->stop(); + popup->hide(); + editor->setFocus(); + QTreeWidgetItem *item = popup->currentItem(); + if (item) { + editor->setText(item->text(0)); + QKeyEvent *e; + e = new QKeyEvent(QEvent::KeyPress, Qt::Key_Enter, Qt::NoModifier); + QApplication::postEvent(editor, e); + e = new QKeyEvent(QEvent::KeyRelease, Qt::Key_Enter, Qt::NoModifier); + QApplication::postEvent(editor, e); + } +} + +void GSuggestCompletion::preventSuggest() +{ + timer->stop(); +} + +void GSuggestCompletion::autoSuggest() +{ + QString str = editor->text(); + QString url = QString(GSUGGEST_URL).arg(str); + networkManager.get(QNetworkRequest(QString(url))); +} + +void GSuggestCompletion::handleNetworkData(QNetworkReply *networkReply) +{ + QUrl url = networkReply->url(); + if (!networkReply->error()) { + QStringList choices; + QStringList hits; + + QString response(networkReply->readAll()); + QXmlStreamReader xml(response); + while (!xml.atEnd()) { + xml.readNext(); + if (xml.tokenType() == QXmlStreamReader::StartElement) + if (xml.name() == "suggestion") { + QStringRef str = xml.attributes().value("data"); + choices << str.toString(); + } + if (xml.tokenType() == QXmlStreamReader::StartElement) + if (xml.name() == "num_queries") { + QStringRef str = xml.attributes().value("int"); + hits << str.toString(); + } + } + + showCompletion(choices, hits); + } + + networkReply->deleteLater(); +} diff --git a/examples/network/googlesuggest/googlesuggest.h b/examples/network/googlesuggest/googlesuggest.h new file mode 100644 index 0000000..0267709 --- /dev/null +++ b/examples/network/googlesuggest/googlesuggest.h @@ -0,0 +1,80 @@ +/**************************************************************************** +** +** Copyright (C) 2009 Nokia Corporation and/or its subsidiary(-ies). +** Contact: Qt Software Information (qt-info@nokia.com) +** +** This file is part of the examples of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:LGPL$ +** No Commercial Usage +** This file contains pre-release code and may not be distributed. +** You may use this file in accordance with the terms and conditions +** contained in the either Technology Preview License Agreement or the +** Beta Release License Agreement. +** +** GNU Lesser General Public License Usage +** Alternatively, this file may be used under the terms of the GNU Lesser +** General Public License version 2.1 as published by the Free Software +** Foundation and appearing in the file LICENSE.LGPL included in the +** packaging of this file. Please review the following information to +** ensure the GNU Lesser General Public License version 2.1 requirements +** will be met: http://www.gnu.org/licenses/old-licenses/lgpl-2.1.html. +** +** In addition, as a special exception, Nokia gives you certain +** additional rights. These rights are described in the Nokia Qt LGPL +** Exception version 1.0, included in the file LGPL_EXCEPTION.txt in this +** package. +** +** GNU General Public License Usage +** Alternatively, this file may be used under the terms of the GNU +** General Public License version 3.0 as published by the Free Software +** Foundation and appearing in the file LICENSE.GPL included in the +** packaging of this file. Please review the following information to +** ensure the GNU General Public License version 3.0 requirements will be +** met: http://www.gnu.org/copyleft/gpl.html. +** +** If you are unsure which license is appropriate for your use, please +** contact the sales department at qt-sales@nokia.com. +** $QT_END_LICENSE$ +** +****************************************************************************/ + +#ifndef GOOGLESUGGEST_H +#define GOOGLESUGGEST_H + +#include <QObject> +#include <QNetworkAccessManager> + +QT_BEGIN_NAMESPACE +class QLineEdit; +class QNetworkReply; +class QTimer; +class QTreeWidget; +QT_END_NAMESPACE + +class GSuggestCompletion : public QObject +{ + Q_OBJECT + +public: + GSuggestCompletion(QLineEdit *parent = 0); + ~GSuggestCompletion(); + bool eventFilter(QObject *obj, QEvent *ev); + void showCompletion(const QStringList &choices, const QStringList &hits); + +public slots: + + void doneCompletion(); + void preventSuggest(); + void autoSuggest(); + void handleNetworkData(QNetworkReply *networkReply); + +private: + QLineEdit *editor; + QTreeWidget *popup; + QTimer *timer; + QNetworkAccessManager networkManager; +}; + +#endif // GOOGLESUGGEST_H + diff --git a/examples/network/googlesuggest/googlesuggest.pro b/examples/network/googlesuggest/googlesuggest.pro new file mode 100644 index 0000000..afd600f --- /dev/null +++ b/examples/network/googlesuggest/googlesuggest.pro @@ -0,0 +1,9 @@ +QT += network +SOURCES = main.cpp searchbox.cpp googlesuggest.cpp +HEADERS = searchbox.h googlesuggest.h + +# install +target.path = $$[QT_INSTALL_EXAMPLES]/webkit/googlesuggest +sources.files = $$SOURCES $$HEADERS *.pro +sources.path = $$[QT_INSTALL_EXAMPLES]/webkit/googlesuggest +INSTALLS += target sources diff --git a/examples/network/googlesuggest/main.cpp b/examples/network/googlesuggest/main.cpp new file mode 100644 index 0000000..f8d9bc5 --- /dev/null +++ b/examples/network/googlesuggest/main.cpp @@ -0,0 +1,52 @@ +/**************************************************************************** +** +** Copyright (C) 2009 Nokia Corporation and/or its subsidiary(-ies). +** Contact: Qt Software Information (qt-info@nokia.com) +** +** This file is part of the examples of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:LGPL$ +** No Commercial Usage +** This file contains pre-release code and may not be distributed. +** You may use this file in accordance with the terms and conditions +** contained in the either Technology Preview License Agreement or the +** Beta Release License Agreement. +** +** GNU Lesser General Public License Usage +** Alternatively, this file may be used under the terms of the GNU Lesser +** General Public License version 2.1 as published by the Free Software +** Foundation and appearing in the file LICENSE.LGPL included in the +** packaging of this file. Please review the following information to +** ensure the GNU Lesser General Public License version 2.1 requirements +** will be met: http://www.gnu.org/licenses/old-licenses/lgpl-2.1.html. +** +** In addition, as a special exception, Nokia gives you certain +** additional rights. These rights are described in the Nokia Qt LGPL +** Exception version 1.0, included in the file LGPL_EXCEPTION.txt in this +** package. +** +** GNU General Public License Usage +** Alternatively, this file may be used under the terms of the GNU +** General Public License version 3.0 as published by the Free Software +** Foundation and appearing in the file LICENSE.GPL included in the +** packaging of this file. Please review the following information to +** ensure the GNU General Public License version 3.0 requirements will be +** met: http://www.gnu.org/copyleft/gpl.html. +** +** If you are unsure which license is appropriate for your use, please +** contact the sales department at qt-sales@nokia.com. +** $QT_END_LICENSE$ +** +****************************************************************************/ + +#include <QApplication> + +#include "searchbox.h" + +int main(int argc, char * argv[]) +{ + QApplication app(argc, argv); + SearchBox *searchEdit = new SearchBox; + searchEdit->show(); + return app.exec(); +} diff --git a/examples/network/googlesuggest/searchbox.cpp b/examples/network/googlesuggest/searchbox.cpp new file mode 100644 index 0000000..cd7b122 --- /dev/null +++ b/examples/network/googlesuggest/searchbox.cpp @@ -0,0 +1,69 @@ +/**************************************************************************** +** +** Copyright (C) 2009 Nokia Corporation and/or its subsidiary(-ies). +** Contact: Qt Software Information (qt-info@nokia.com) +** +** This file is part of the examples of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:LGPL$ +** No Commercial Usage +** This file contains pre-release code and may not be distributed. +** You may use this file in accordance with the terms and conditions +** contained in the either Technology Preview License Agreement or the +** Beta Release License Agreement. +** +** GNU Lesser General Public License Usage +** Alternatively, this file may be used under the terms of the GNU Lesser +** General Public License version 2.1 as published by the Free Software +** Foundation and appearing in the file LICENSE.LGPL included in the +** packaging of this file. Please review the following information to +** ensure the GNU Lesser General Public License version 2.1 requirements +** will be met: http://www.gnu.org/licenses/old-licenses/lgpl-2.1.html. +** +** In addition, as a special exception, Nokia gives you certain +** additional rights. These rights are described in the Nokia Qt LGPL +** Exception version 1.0, included in the file LGPL_EXCEPTION.txt in this +** package. +** +** GNU General Public License Usage +** Alternatively, this file may be used under the terms of the GNU +** General Public License version 3.0 as published by the Free Software +** Foundation and appearing in the file LICENSE.GPL included in the +** packaging of this file. Please review the following information to +** ensure the GNU General Public License version 3.0 requirements will be +** met: http://www.gnu.org/copyleft/gpl.html. +** +** If you are unsure which license is appropriate for your use, please +** contact the sales department at qt-sales@nokia.com. +** $QT_END_LICENSE$ +** +****************************************************************************/ + +#include <QDesktopServices> +#include <QUrl> + +#include "searchbox.h" +#include "googlesuggest.h" + +#define GSEARCH_URL "http://www.google.com/search?q=%1" + + +SearchBox::SearchBox(QWidget *parent): QLineEdit(parent) +{ + completer = new GSuggestCompletion(this); + + connect(this, SIGNAL(returnPressed()), SLOT(doSearch())); + + setWindowTitle("Search with Google"); + + adjustSize(); + resize(400, height()); + setFocus(); +} + +void SearchBox::doSearch() +{ + completer->preventSuggest(); + QString url = QString(GSEARCH_URL).arg(text()); + QDesktopServices::openUrl(QUrl(url)); +} diff --git a/examples/network/googlesuggest/searchbox.h b/examples/network/googlesuggest/searchbox.h new file mode 100644 index 0000000..75ceffd --- /dev/null +++ b/examples/network/googlesuggest/searchbox.h @@ -0,0 +1,64 @@ +/**************************************************************************** +** +** Copyright (C) 2009 Nokia Corporation and/or its subsidiary(-ies). +** Contact: Qt Software Information (qt-info@nokia.com) +** +** This file is part of the examples of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:LGPL$ +** No Commercial Usage +** This file contains pre-release code and may not be distributed. +** You may use this file in accordance with the terms and conditions +** contained in the either Technology Preview License Agreement or the +** Beta Release License Agreement. +** +** GNU Lesser General Public License Usage +** Alternatively, this file may be used under the terms of the GNU Lesser +** General Public License version 2.1 as published by the Free Software +** Foundation and appearing in the file LICENSE.LGPL included in the +** packaging of this file. Please review the following information to +** ensure the GNU Lesser General Public License version 2.1 requirements +** will be met: http://www.gnu.org/licenses/old-licenses/lgpl-2.1.html. +** +** In addition, as a special exception, Nokia gives you certain +** additional rights. These rights are described in the Nokia Qt LGPL +** Exception version 1.0, included in the file LGPL_EXCEPTION.txt in this +** package. +** +** GNU General Public License Usage +** Alternatively, this file may be used under the terms of the GNU +** General Public License version 3.0 as published by the Free Software +** Foundation and appearing in the file LICENSE.GPL included in the +** packaging of this file. Please review the following information to +** ensure the GNU General Public License version 3.0 requirements will be +** met: http://www.gnu.org/copyleft/gpl.html. +** +** If you are unsure which license is appropriate for your use, please +** contact the sales department at qt-sales@nokia.com. +** $QT_END_LICENSE$ +** +****************************************************************************/ + +#ifndef SEARCHBOX_H +#define SEARCHBOX_H + +#include <QLineEdit> + +class GSuggestCompletion; + +class SearchBox: public QLineEdit +{ + Q_OBJECT + +public: + SearchBox(QWidget *parent = 0); + +protected slots: + void doSearch(); + +private: + GSuggestCompletion *completer; +}; + + +#endif // SEARCHBOX_H diff --git a/examples/network/network.pro b/examples/network/network.pro index 13b3116..8c45745 100644 --- a/examples/network/network.pro +++ b/examples/network/network.pro @@ -11,6 +11,7 @@ SUBDIRS = blockingfortuneclient \ http \ loopback \ threadedfortuneserver \ + googlesuggest \ torrent contains(QT_CONFIG, openssl):SUBDIRS += securesocketclient diff --git a/examples/webkit/fancybrowser/fancybrowser.pro b/examples/webkit/fancybrowser/fancybrowser.pro new file mode 100644 index 0000000..3de3036 --- /dev/null +++ b/examples/webkit/fancybrowser/fancybrowser.pro @@ -0,0 +1,11 @@ +QT += webkit +HEADERS = mainwindow.h +SOURCES = main.cpp \ + mainwindow.cpp +RESOURCES = jquery.qrc + +# install +target.path = $$[QT_INSTALL_EXAMPLES]/webkit/fancybrowser +sources.files = $$SOURCES $$HEADERS $$RESOURCES *.pro +sources.path = $$[QT_INSTALL_EXAMPLES]/webkit/fancybrowser +INSTALLS += target sources diff --git a/examples/webkit/fancybrowser/jquery.min.js b/examples/webkit/fancybrowser/jquery.min.js new file mode 100644 index 0000000..b1ae21d --- /dev/null +++ b/examples/webkit/fancybrowser/jquery.min.js @@ -0,0 +1,19 @@ +/* + * jQuery JavaScript Library v1.3.2 + * http://jquery.com/ + * + * Copyright (c) 2009 John Resig + * Dual licensed under the MIT and GPL licenses. + * http://docs.jquery.com/License + * + * Date: 2009-02-19 17:34:21 -0500 (Thu, 19 Feb 2009) + * Revision: 6246 + */ +(function(){var l=this,g,y=l.jQuery,p=l.$,o=l.jQuery=l.$=function(E,F){return new o.fn.init(E,F)},D=/^[^<]*(<(.|\s)+>)[^>]*$|^#([\w-]+)$/,f=/^.[^:#\[\.,]*$/;o.fn=o.prototype={init:function(E,H){E=E||document;if(E.nodeType){this[0]=E;this.length=1;this.context=E;return this}if(typeof E==="string"){var G=D.exec(E);if(G&&(G[1]||!H)){if(G[1]){E=o.clean([G[1]],H)}else{var I=document.getElementById(G[3]);if(I&&I.id!=G[3]){return o().find(E)}var F=o(I||[]);F.context=document;F.selector=E;return F}}else{return o(H).find(E)}}else{if(o.isFunction(E)){return o(document).ready(E)}}if(E.selector&&E.context){this.selector=E.selector;this.context=E.context}return this.setArray(o.isArray(E)?E:o.makeArray(E))},selector:"",jquery:"1.3.2",size:function(){return this.length},get:function(E){return E===g?Array.prototype.slice.call(this):this[E]},pushStack:function(F,H,E){var G=o(F);G.prevObject=this;G.context=this.context;if(H==="find"){G.selector=this.selector+(this.selector?" ":"")+E}else{if(H){G.selector=this.selector+"."+H+"("+E+")"}}return G},setArray:function(E){this.length=0;Array.prototype.push.apply(this,E);return this},each:function(F,E){return o.each(this,F,E)},index:function(E){return o.inArray(E&&E.jquery?E[0]:E,this)},attr:function(F,H,G){var E=F;if(typeof F==="string"){if(H===g){return this[0]&&o[G||"attr"](this[0],F)}else{E={};E[F]=H}}return this.each(function(I){for(F in E){o.attr(G?this.style:this,F,o.prop(this,E[F],G,I,F))}})},css:function(E,F){if((E=="width"||E=="height")&&parseFloat(F)<0){F=g}return this.attr(E,F,"curCSS")},text:function(F){if(typeof F!=="object"&&F!=null){return this.empty().append((this[0]&&this[0].ownerDocument||document).createTextNode(F))}var E="";o.each(F||this,function(){o.each(this.childNodes,function(){if(this.nodeType!=8){E+=this.nodeType!=1?this.nodeValue:o.fn.text([this])}})});return E},wrapAll:function(E){if(this[0]){var F=o(E,this[0].ownerDocument).clone();if(this[0].parentNode){F.insertBefore(this[0])}F.map(function(){var G=this;while(G.firstChild){G=G.firstChild}return G}).append(this)}return this},wrapInner:function(E){return this.each(function(){o(this).contents().wrapAll(E)})},wrap:function(E){return this.each(function(){o(this).wrapAll(E)})},append:function(){return this.domManip(arguments,true,function(E){if(this.nodeType==1){this.appendChild(E)}})},prepend:function(){return this.domManip(arguments,true,function(E){if(this.nodeType==1){this.insertBefore(E,this.firstChild)}})},before:function(){return this.domManip(arguments,false,function(E){this.parentNode.insertBefore(E,this)})},after:function(){return this.domManip(arguments,false,function(E){this.parentNode.insertBefore(E,this.nextSibling)})},end:function(){return this.prevObject||o([])},push:[].push,sort:[].sort,splice:[].splice,find:function(E){if(this.length===1){var F=this.pushStack([],"find",E);F.length=0;o.find(E,this[0],F);return F}else{return this.pushStack(o.unique(o.map(this,function(G){return o.find(E,G)})),"find",E)}},clone:function(G){var E=this.map(function(){if(!o.support.noCloneEvent&&!o.isXMLDoc(this)){var I=this.outerHTML;if(!I){var J=this.ownerDocument.createElement("div");J.appendChild(this.cloneNode(true));I=J.innerHTML}return o.clean([I.replace(/ jQuery\d+="(?:\d+|null)"/g,"").replace(/^\s*/,"")])[0]}else{return this.cloneNode(true)}});if(G===true){var H=this.find("*").andSelf(),F=0;E.find("*").andSelf().each(function(){if(this.nodeName!==H[F].nodeName){return}var I=o.data(H[F],"events");for(var K in I){for(var J in I[K]){o.event.add(this,K,I[K][J],I[K][J].data)}}F++})}return E},filter:function(E){return this.pushStack(o.isFunction(E)&&o.grep(this,function(G,F){return E.call(G,F)})||o.multiFilter(E,o.grep(this,function(F){return F.nodeType===1})),"filter",E)},closest:function(E){var G=o.expr.match.POS.test(E)?o(E):null,F=0;return this.map(function(){var H=this;while(H&&H.ownerDocument){if(G?G.index(H)>-1:o(H).is(E)){o.data(H,"closest",F);return H}H=H.parentNode;F++}})},not:function(E){if(typeof E==="string"){if(f.test(E)){return this.pushStack(o.multiFilter(E,this,true),"not",E)}else{E=o.multiFilter(E,this)}}var F=E.length&&E[E.length-1]!==g&&!E.nodeType;return this.filter(function(){return F?o.inArray(this,E)<0:this!=E})},add:function(E){return this.pushStack(o.unique(o.merge(this.get(),typeof E==="string"?o(E):o.makeArray(E))))},is:function(E){return !!E&&o.multiFilter(E,this).length>0},hasClass:function(E){return !!E&&this.is("."+E)},val:function(K){if(K===g){var E=this[0];if(E){if(o.nodeName(E,"option")){return(E.attributes.value||{}).specified?E.value:E.text}if(o.nodeName(E,"select")){var I=E.selectedIndex,L=[],M=E.options,H=E.type=="select-one";if(I<0){return null}for(var F=H?I:0,J=H?I+1:M.length;F<J;F++){var G=M[F];if(G.selected){K=o(G).val();if(H){return K}L.push(K)}}return L}return(E.value||"").replace(/\r/g,"")}return g}if(typeof K==="number"){K+=""}return this.each(function(){if(this.nodeType!=1){return}if(o.isArray(K)&&/radio|checkbox/.test(this.type)){this.checked=(o.inArray(this.value,K)>=0||o.inArray(this.name,K)>=0)}else{if(o.nodeName(this,"select")){var N=o.makeArray(K);o("option",this).each(function(){this.selected=(o.inArray(this.value,N)>=0||o.inArray(this.text,N)>=0)});if(!N.length){this.selectedIndex=-1}}else{this.value=K}}})},html:function(E){return E===g?(this[0]?this[0].innerHTML.replace(/ jQuery\d+="(?:\d+|null)"/g,""):null):this.empty().append(E)},replaceWith:function(E){return this.after(E).remove()},eq:function(E){return this.slice(E,+E+1)},slice:function(){return this.pushStack(Array.prototype.slice.apply(this,arguments),"slice",Array.prototype.slice.call(arguments).join(","))},map:function(E){return this.pushStack(o.map(this,function(G,F){return E.call(G,F,G)}))},andSelf:function(){return this.add(this.prevObject)},domManip:function(J,M,L){if(this[0]){var I=(this[0].ownerDocument||this[0]).createDocumentFragment(),F=o.clean(J,(this[0].ownerDocument||this[0]),I),H=I.firstChild;if(H){for(var G=0,E=this.length;G<E;G++){L.call(K(this[G],H),this.length>1||G>0?I.cloneNode(true):I)}}if(F){o.each(F,z)}}return this;function K(N,O){return M&&o.nodeName(N,"table")&&o.nodeName(O,"tr")?(N.getElementsByTagName("tbody")[0]||N.appendChild(N.ownerDocument.createElement("tbody"))):N}}};o.fn.init.prototype=o.fn;function z(E,F){if(F.src){o.ajax({url:F.src,async:false,dataType:"script"})}else{o.globalEval(F.text||F.textContent||F.innerHTML||"")}if(F.parentNode){F.parentNode.removeChild(F)}}function e(){return +new Date}o.extend=o.fn.extend=function(){var J=arguments[0]||{},H=1,I=arguments.length,E=false,G;if(typeof J==="boolean"){E=J;J=arguments[1]||{};H=2}if(typeof J!=="object"&&!o.isFunction(J)){J={}}if(I==H){J=this;--H}for(;H<I;H++){if((G=arguments[H])!=null){for(var F in G){var K=J[F],L=G[F];if(J===L){continue}if(E&&L&&typeof L==="object"&&!L.nodeType){J[F]=o.extend(E,K||(L.length!=null?[]:{}),L)}else{if(L!==g){J[F]=L}}}}}return J};var b=/z-?index|font-?weight|opacity|zoom|line-?height/i,q=document.defaultView||{},s=Object.prototype.toString;o.extend({noConflict:function(E){l.$=p;if(E){l.jQuery=y}return o},isFunction:function(E){return s.call(E)==="[object Function]"},isArray:function(E){return s.call(E)==="[object Array]"},isXMLDoc:function(E){return E.nodeType===9&&E.documentElement.nodeName!=="HTML"||!!E.ownerDocument&&o.isXMLDoc(E.ownerDocument)},globalEval:function(G){if(G&&/\S/.test(G)){var F=document.getElementsByTagName("head")[0]||document.documentElement,E=document.createElement("script");E.type="text/javascript";if(o.support.scriptEval){E.appendChild(document.createTextNode(G))}else{E.text=G}F.insertBefore(E,F.firstChild);F.removeChild(E)}},nodeName:function(F,E){return F.nodeName&&F.nodeName.toUpperCase()==E.toUpperCase()},each:function(G,K,F){var E,H=0,I=G.length;if(F){if(I===g){for(E in G){if(K.apply(G[E],F)===false){break}}}else{for(;H<I;){if(K.apply(G[H++],F)===false){break}}}}else{if(I===g){for(E in G){if(K.call(G[E],E,G[E])===false){break}}}else{for(var J=G[0];H<I&&K.call(J,H,J)!==false;J=G[++H]){}}}return G},prop:function(H,I,G,F,E){if(o.isFunction(I)){I=I.call(H,F)}return typeof I==="number"&&G=="curCSS"&&!b.test(E)?I+"px":I},className:{add:function(E,F){o.each((F||"").split(/\s+/),function(G,H){if(E.nodeType==1&&!o.className.has(E.className,H)){E.className+=(E.className?" ":"")+H}})},remove:function(E,F){if(E.nodeType==1){E.className=F!==g?o.grep(E.className.split(/\s+/),function(G){return !o.className.has(F,G)}).join(" "):""}},has:function(F,E){return F&&o.inArray(E,(F.className||F).toString().split(/\s+/))>-1}},swap:function(H,G,I){var E={};for(var F in G){E[F]=H.style[F];H.style[F]=G[F]}I.call(H);for(var F in G){H.style[F]=E[F]}},css:function(H,F,J,E){if(F=="width"||F=="height"){var L,G={position:"absolute",visibility:"hidden",display:"block"},K=F=="width"?["Left","Right"]:["Top","Bottom"];function I(){L=F=="width"?H.offsetWidth:H.offsetHeight;if(E==="border"){return}o.each(K,function(){if(!E){L-=parseFloat(o.curCSS(H,"padding"+this,true))||0}if(E==="margin"){L+=parseFloat(o.curCSS(H,"margin"+this,true))||0}else{L-=parseFloat(o.curCSS(H,"border"+this+"Width",true))||0}})}if(H.offsetWidth!==0){I()}else{o.swap(H,G,I)}return Math.max(0,Math.round(L))}return o.curCSS(H,F,J)},curCSS:function(I,F,G){var L,E=I.style;if(F=="opacity"&&!o.support.opacity){L=o.attr(E,"opacity");return L==""?"1":L}if(F.match(/float/i)){F=w}if(!G&&E&&E[F]){L=E[F]}else{if(q.getComputedStyle){if(F.match(/float/i)){F="float"}F=F.replace(/([A-Z])/g,"-$1").toLowerCase();var M=q.getComputedStyle(I,null);if(M){L=M.getPropertyValue(F)}if(F=="opacity"&&L==""){L="1"}}else{if(I.currentStyle){var J=F.replace(/\-(\w)/g,function(N,O){return O.toUpperCase()});L=I.currentStyle[F]||I.currentStyle[J];if(!/^\d+(px)?$/i.test(L)&&/^\d/.test(L)){var H=E.left,K=I.runtimeStyle.left;I.runtimeStyle.left=I.currentStyle.left;E.left=L||0;L=E.pixelLeft+"px";E.left=H;I.runtimeStyle.left=K}}}}return L},clean:function(F,K,I){K=K||document;if(typeof K.createElement==="undefined"){K=K.ownerDocument||K[0]&&K[0].ownerDocument||document}if(!I&&F.length===1&&typeof F[0]==="string"){var H=/^<(\w+)\s*\/?>$/.exec(F[0]);if(H){return[K.createElement(H[1])]}}var G=[],E=[],L=K.createElement("div");o.each(F,function(P,S){if(typeof S==="number"){S+=""}if(!S){return}if(typeof S==="string"){S=S.replace(/(<(\w+)[^>]*?)\/>/g,function(U,V,T){return T.match(/^(abbr|br|col|img|input|link|meta|param|hr|area|embed)$/i)?U:V+"></"+T+">"});var O=S.replace(/^\s+/,"").substring(0,10).toLowerCase();var Q=!O.indexOf("<opt")&&[1,"<select multiple='multiple'>","</select>"]||!O.indexOf("<leg")&&[1,"<fieldset>","</fieldset>"]||O.match(/^<(thead|tbody|tfoot|colg|cap)/)&&[1,"<table>","</table>"]||!O.indexOf("<tr")&&[2,"<table><tbody>","</tbody></table>"]||(!O.indexOf("<td")||!O.indexOf("<th"))&&[3,"<table><tbody><tr>","</tr></tbody></table>"]||!O.indexOf("<col")&&[2,"<table><tbody></tbody><colgroup>","</colgroup></table>"]||!o.support.htmlSerialize&&[1,"div<div>","</div>"]||[0,"",""];L.innerHTML=Q[1]+S+Q[2];while(Q[0]--){L=L.lastChild}if(!o.support.tbody){var R=/<tbody/i.test(S),N=!O.indexOf("<table")&&!R?L.firstChild&&L.firstChild.childNodes:Q[1]=="<table>"&&!R?L.childNodes:[];for(var M=N.length-1;M>=0;--M){if(o.nodeName(N[M],"tbody")&&!N[M].childNodes.length){N[M].parentNode.removeChild(N[M])}}}if(!o.support.leadingWhitespace&&/^\s/.test(S)){L.insertBefore(K.createTextNode(S.match(/^\s*/)[0]),L.firstChild)}S=o.makeArray(L.childNodes)}if(S.nodeType){G.push(S)}else{G=o.merge(G,S)}});if(I){for(var J=0;G[J];J++){if(o.nodeName(G[J],"script")&&(!G[J].type||G[J].type.toLowerCase()==="text/javascript")){E.push(G[J].parentNode?G[J].parentNode.removeChild(G[J]):G[J])}else{if(G[J].nodeType===1){G.splice.apply(G,[J+1,0].concat(o.makeArray(G[J].getElementsByTagName("script"))))}I.appendChild(G[J])}}return E}return G},attr:function(J,G,K){if(!J||J.nodeType==3||J.nodeType==8){return g}var H=!o.isXMLDoc(J),L=K!==g;G=H&&o.props[G]||G;if(J.tagName){var F=/href|src|style/.test(G);if(G=="selected"&&J.parentNode){J.parentNode.selectedIndex}if(G in J&&H&&!F){if(L){if(G=="type"&&o.nodeName(J,"input")&&J.parentNode){throw"type property can't be changed"}J[G]=K}if(o.nodeName(J,"form")&&J.getAttributeNode(G)){return J.getAttributeNode(G).nodeValue}if(G=="tabIndex"){var I=J.getAttributeNode("tabIndex");return I&&I.specified?I.value:J.nodeName.match(/(button|input|object|select|textarea)/i)?0:J.nodeName.match(/^(a|area)$/i)&&J.href?0:g}return J[G]}if(!o.support.style&&H&&G=="style"){return o.attr(J.style,"cssText",K)}if(L){J.setAttribute(G,""+K)}var E=!o.support.hrefNormalized&&H&&F?J.getAttribute(G,2):J.getAttribute(G);return E===null?g:E}if(!o.support.opacity&&G=="opacity"){if(L){J.zoom=1;J.filter=(J.filter||"").replace(/alpha\([^)]*\)/,"")+(parseInt(K)+""=="NaN"?"":"alpha(opacity="+K*100+")")}return J.filter&&J.filter.indexOf("opacity=")>=0?(parseFloat(J.filter.match(/opacity=([^)]*)/)[1])/100)+"":""}G=G.replace(/-([a-z])/ig,function(M,N){return N.toUpperCase()});if(L){J[G]=K}return J[G]},trim:function(E){return(E||"").replace(/^\s+|\s+$/g,"")},makeArray:function(G){var E=[];if(G!=null){var F=G.length;if(F==null||typeof G==="string"||o.isFunction(G)||G.setInterval){E[0]=G}else{while(F){E[--F]=G[F]}}}return E},inArray:function(G,H){for(var E=0,F=H.length;E<F;E++){if(H[E]===G){return E}}return -1},merge:function(H,E){var F=0,G,I=H.length;if(!o.support.getAll){while((G=E[F++])!=null){if(G.nodeType!=8){H[I++]=G}}}else{while((G=E[F++])!=null){H[I++]=G}}return H},unique:function(K){var F=[],E={};try{for(var G=0,H=K.length;G<H;G++){var J=o.data(K[G]);if(!E[J]){E[J]=true;F.push(K[G])}}}catch(I){F=K}return F},grep:function(F,J,E){var G=[];for(var H=0,I=F.length;H<I;H++){if(!E!=!J(F[H],H)){G.push(F[H])}}return G},map:function(E,J){var F=[];for(var G=0,H=E.length;G<H;G++){var I=J(E[G],G);if(I!=null){F[F.length]=I}}return F.concat.apply([],F)}});var C=navigator.userAgent.toLowerCase();o.browser={version:(C.match(/.+(?:rv|it|ra|ie)[\/: ]([\d.]+)/)||[0,"0"])[1],safari:/webkit/.test(C),opera:/opera/.test(C),msie:/msie/.test(C)&&!/opera/.test(C),mozilla:/mozilla/.test(C)&&!/(compatible|webkit)/.test(C)};o.each({parent:function(E){return E.parentNode},parents:function(E){return o.dir(E,"parentNode")},next:function(E){return o.nth(E,2,"nextSibling")},prev:function(E){return o.nth(E,2,"previousSibling")},nextAll:function(E){return o.dir(E,"nextSibling")},prevAll:function(E){return o.dir(E,"previousSibling")},siblings:function(E){return o.sibling(E.parentNode.firstChild,E)},children:function(E){return o.sibling(E.firstChild)},contents:function(E){return o.nodeName(E,"iframe")?E.contentDocument||E.contentWindow.document:o.makeArray(E.childNodes)}},function(E,F){o.fn[E]=function(G){var H=o.map(this,F);if(G&&typeof G=="string"){H=o.multiFilter(G,H)}return this.pushStack(o.unique(H),E,G)}});o.each({appendTo:"append",prependTo:"prepend",insertBefore:"before",insertAfter:"after",replaceAll:"replaceWith"},function(E,F){o.fn[E]=function(G){var J=[],L=o(G);for(var K=0,H=L.length;K<H;K++){var I=(K>0?this.clone(true):this).get();o.fn[F].apply(o(L[K]),I);J=J.concat(I)}return this.pushStack(J,E,G)}});o.each({removeAttr:function(E){o.attr(this,E,"");if(this.nodeType==1){this.removeAttribute(E)}},addClass:function(E){o.className.add(this,E)},removeClass:function(E){o.className.remove(this,E)},toggleClass:function(F,E){if(typeof E!=="boolean"){E=!o.className.has(this,F)}o.className[E?"add":"remove"](this,F)},remove:function(E){if(!E||o.filter(E,[this]).length){o("*",this).add([this]).each(function(){o.event.remove(this);o.removeData(this)});if(this.parentNode){this.parentNode.removeChild(this)}}},empty:function(){o(this).children().remove();while(this.firstChild){this.removeChild(this.firstChild)}}},function(E,F){o.fn[E]=function(){return this.each(F,arguments)}});function j(E,F){return E[0]&&parseInt(o.curCSS(E[0],F,true),10)||0}var h="jQuery"+e(),v=0,A={};o.extend({cache:{},data:function(F,E,G){F=F==l?A:F;var H=F[h];if(!H){H=F[h]=++v}if(E&&!o.cache[H]){o.cache[H]={}}if(G!==g){o.cache[H][E]=G}return E?o.cache[H][E]:H},removeData:function(F,E){F=F==l?A:F;var H=F[h];if(E){if(o.cache[H]){delete o.cache[H][E];E="";for(E in o.cache[H]){break}if(!E){o.removeData(F)}}}else{try{delete F[h]}catch(G){if(F.removeAttribute){F.removeAttribute(h)}}delete o.cache[H]}},queue:function(F,E,H){if(F){E=(E||"fx")+"queue";var G=o.data(F,E);if(!G||o.isArray(H)){G=o.data(F,E,o.makeArray(H))}else{if(H){G.push(H)}}}return G},dequeue:function(H,G){var E=o.queue(H,G),F=E.shift();if(!G||G==="fx"){F=E[0]}if(F!==g){F.call(H)}}});o.fn.extend({data:function(E,G){var H=E.split(".");H[1]=H[1]?"."+H[1]:"";if(G===g){var F=this.triggerHandler("getData"+H[1]+"!",[H[0]]);if(F===g&&this.length){F=o.data(this[0],E)}return F===g&&H[1]?this.data(H[0]):F}else{return this.trigger("setData"+H[1]+"!",[H[0],G]).each(function(){o.data(this,E,G)})}},removeData:function(E){return this.each(function(){o.removeData(this,E)})},queue:function(E,F){if(typeof E!=="string"){F=E;E="fx"}if(F===g){return o.queue(this[0],E)}return this.each(function(){var G=o.queue(this,E,F);if(E=="fx"&&G.length==1){G[0].call(this)}})},dequeue:function(E){return this.each(function(){o.dequeue(this,E)})}}); +/* + * Sizzle CSS Selector Engine - v0.9.3 + * Copyright 2009, The Dojo Foundation + * Released under the MIT, BSD, and GPL Licenses. + * More information: http://sizzlejs.com/ + */ +(function(){var R=/((?:\((?:\([^()]+\)|[^()]+)+\)|\[(?:\[[^[\]]*\]|['"][^'"]*['"]|[^[\]'"]+)+\]|\\.|[^ >+~,(\[\\]+)+|[>+~])(\s*,\s*)?/g,L=0,H=Object.prototype.toString;var F=function(Y,U,ab,ac){ab=ab||[];U=U||document;if(U.nodeType!==1&&U.nodeType!==9){return[]}if(!Y||typeof Y!=="string"){return ab}var Z=[],W,af,ai,T,ad,V,X=true;R.lastIndex=0;while((W=R.exec(Y))!==null){Z.push(W[1]);if(W[2]){V=RegExp.rightContext;break}}if(Z.length>1&&M.exec(Y)){if(Z.length===2&&I.relative[Z[0]]){af=J(Z[0]+Z[1],U)}else{af=I.relative[Z[0]]?[U]:F(Z.shift(),U);while(Z.length){Y=Z.shift();if(I.relative[Y]){Y+=Z.shift()}af=J(Y,af)}}}else{var ae=ac?{expr:Z.pop(),set:E(ac)}:F.find(Z.pop(),Z.length===1&&U.parentNode?U.parentNode:U,Q(U));af=F.filter(ae.expr,ae.set);if(Z.length>0){ai=E(af)}else{X=false}while(Z.length){var ah=Z.pop(),ag=ah;if(!I.relative[ah]){ah=""}else{ag=Z.pop()}if(ag==null){ag=U}I.relative[ah](ai,ag,Q(U))}}if(!ai){ai=af}if(!ai){throw"Syntax error, unrecognized expression: "+(ah||Y)}if(H.call(ai)==="[object Array]"){if(!X){ab.push.apply(ab,ai)}else{if(U.nodeType===1){for(var aa=0;ai[aa]!=null;aa++){if(ai[aa]&&(ai[aa]===true||ai[aa].nodeType===1&&K(U,ai[aa]))){ab.push(af[aa])}}}else{for(var aa=0;ai[aa]!=null;aa++){if(ai[aa]&&ai[aa].nodeType===1){ab.push(af[aa])}}}}}else{E(ai,ab)}if(V){F(V,U,ab,ac);if(G){hasDuplicate=false;ab.sort(G);if(hasDuplicate){for(var aa=1;aa<ab.length;aa++){if(ab[aa]===ab[aa-1]){ab.splice(aa--,1)}}}}}return ab};F.matches=function(T,U){return F(T,null,null,U)};F.find=function(aa,T,ab){var Z,X;if(!aa){return[]}for(var W=0,V=I.order.length;W<V;W++){var Y=I.order[W],X;if((X=I.match[Y].exec(aa))){var U=RegExp.leftContext;if(U.substr(U.length-1)!=="\\"){X[1]=(X[1]||"").replace(/\\/g,"");Z=I.find[Y](X,T,ab);if(Z!=null){aa=aa.replace(I.match[Y],"");break}}}}if(!Z){Z=T.getElementsByTagName("*")}return{set:Z,expr:aa}};F.filter=function(ad,ac,ag,W){var V=ad,ai=[],aa=ac,Y,T,Z=ac&&ac[0]&&Q(ac[0]);while(ad&&ac.length){for(var ab in I.filter){if((Y=I.match[ab].exec(ad))!=null){var U=I.filter[ab],ah,af;T=false;if(aa==ai){ai=[]}if(I.preFilter[ab]){Y=I.preFilter[ab](Y,aa,ag,ai,W,Z);if(!Y){T=ah=true}else{if(Y===true){continue}}}if(Y){for(var X=0;(af=aa[X])!=null;X++){if(af){ah=U(af,Y,X,aa);var ae=W^!!ah;if(ag&&ah!=null){if(ae){T=true}else{aa[X]=false}}else{if(ae){ai.push(af);T=true}}}}}if(ah!==g){if(!ag){aa=ai}ad=ad.replace(I.match[ab],"");if(!T){return[]}break}}}if(ad==V){if(T==null){throw"Syntax error, unrecognized expression: "+ad}else{break}}V=ad}return aa};var I=F.selectors={order:["ID","NAME","TAG"],match:{ID:/#((?:[\w\u00c0-\uFFFF_-]|\\.)+)/,CLASS:/\.((?:[\w\u00c0-\uFFFF_-]|\\.)+)/,NAME:/\[name=['"]*((?:[\w\u00c0-\uFFFF_-]|\\.)+)['"]*\]/,ATTR:/\[\s*((?:[\w\u00c0-\uFFFF_-]|\\.)+)\s*(?:(\S?=)\s*(['"]*)(.*?)\3|)\s*\]/,TAG:/^((?:[\w\u00c0-\uFFFF\*_-]|\\.)+)/,CHILD:/:(only|nth|last|first)-child(?:\((even|odd|[\dn+-]*)\))?/,POS:/:(nth|eq|gt|lt|first|last|even|odd)(?:\((\d*)\))?(?=[^-]|$)/,PSEUDO:/:((?:[\w\u00c0-\uFFFF_-]|\\.)+)(?:\((['"]*)((?:\([^\)]+\)|[^\2\(\)]*)+)\2\))?/},attrMap:{"class":"className","for":"htmlFor"},attrHandle:{href:function(T){return T.getAttribute("href")}},relative:{"+":function(aa,T,Z){var X=typeof T==="string",ab=X&&!/\W/.test(T),Y=X&&!ab;if(ab&&!Z){T=T.toUpperCase()}for(var W=0,V=aa.length,U;W<V;W++){if((U=aa[W])){while((U=U.previousSibling)&&U.nodeType!==1){}aa[W]=Y||U&&U.nodeName===T?U||false:U===T}}if(Y){F.filter(T,aa,true)}},">":function(Z,U,aa){var X=typeof U==="string";if(X&&!/\W/.test(U)){U=aa?U:U.toUpperCase();for(var V=0,T=Z.length;V<T;V++){var Y=Z[V];if(Y){var W=Y.parentNode;Z[V]=W.nodeName===U?W:false}}}else{for(var V=0,T=Z.length;V<T;V++){var Y=Z[V];if(Y){Z[V]=X?Y.parentNode:Y.parentNode===U}}if(X){F.filter(U,Z,true)}}},"":function(W,U,Y){var V=L++,T=S;if(!U.match(/\W/)){var X=U=Y?U:U.toUpperCase();T=P}T("parentNode",U,V,W,X,Y)},"~":function(W,U,Y){var V=L++,T=S;if(typeof U==="string"&&!U.match(/\W/)){var X=U=Y?U:U.toUpperCase();T=P}T("previousSibling",U,V,W,X,Y)}},find:{ID:function(U,V,W){if(typeof V.getElementById!=="undefined"&&!W){var T=V.getElementById(U[1]);return T?[T]:[]}},NAME:function(V,Y,Z){if(typeof Y.getElementsByName!=="undefined"){var U=[],X=Y.getElementsByName(V[1]);for(var W=0,T=X.length;W<T;W++){if(X[W].getAttribute("name")===V[1]){U.push(X[W])}}return U.length===0?null:U}},TAG:function(T,U){return U.getElementsByTagName(T[1])}},preFilter:{CLASS:function(W,U,V,T,Z,aa){W=" "+W[1].replace(/\\/g,"")+" ";if(aa){return W}for(var X=0,Y;(Y=U[X])!=null;X++){if(Y){if(Z^(Y.className&&(" "+Y.className+" ").indexOf(W)>=0)){if(!V){T.push(Y)}}else{if(V){U[X]=false}}}}return false},ID:function(T){return T[1].replace(/\\/g,"")},TAG:function(U,T){for(var V=0;T[V]===false;V++){}return T[V]&&Q(T[V])?U[1]:U[1].toUpperCase()},CHILD:function(T){if(T[1]=="nth"){var U=/(-?)(\d*)n((?:\+|-)?\d*)/.exec(T[2]=="even"&&"2n"||T[2]=="odd"&&"2n+1"||!/\D/.test(T[2])&&"0n+"+T[2]||T[2]);T[2]=(U[1]+(U[2]||1))-0;T[3]=U[3]-0}T[0]=L++;return T},ATTR:function(X,U,V,T,Y,Z){var W=X[1].replace(/\\/g,"");if(!Z&&I.attrMap[W]){X[1]=I.attrMap[W]}if(X[2]==="~="){X[4]=" "+X[4]+" "}return X},PSEUDO:function(X,U,V,T,Y){if(X[1]==="not"){if(X[3].match(R).length>1||/^\w/.test(X[3])){X[3]=F(X[3],null,null,U)}else{var W=F.filter(X[3],U,V,true^Y);if(!V){T.push.apply(T,W)}return false}}else{if(I.match.POS.test(X[0])||I.match.CHILD.test(X[0])){return true}}return X},POS:function(T){T.unshift(true);return T}},filters:{enabled:function(T){return T.disabled===false&&T.type!=="hidden"},disabled:function(T){return T.disabled===true},checked:function(T){return T.checked===true},selected:function(T){T.parentNode.selectedIndex;return T.selected===true},parent:function(T){return !!T.firstChild},empty:function(T){return !T.firstChild},has:function(V,U,T){return !!F(T[3],V).length},header:function(T){return/h\d/i.test(T.nodeName)},text:function(T){return"text"===T.type},radio:function(T){return"radio"===T.type},checkbox:function(T){return"checkbox"===T.type},file:function(T){return"file"===T.type},password:function(T){return"password"===T.type},submit:function(T){return"submit"===T.type},image:function(T){return"image"===T.type},reset:function(T){return"reset"===T.type},button:function(T){return"button"===T.type||T.nodeName.toUpperCase()==="BUTTON"},input:function(T){return/input|select|textarea|button/i.test(T.nodeName)}},setFilters:{first:function(U,T){return T===0},last:function(V,U,T,W){return U===W.length-1},even:function(U,T){return T%2===0},odd:function(U,T){return T%2===1},lt:function(V,U,T){return U<T[3]-0},gt:function(V,U,T){return U>T[3]-0},nth:function(V,U,T){return T[3]-0==U},eq:function(V,U,T){return T[3]-0==U}},filter:{PSEUDO:function(Z,V,W,aa){var U=V[1],X=I.filters[U];if(X){return X(Z,W,V,aa)}else{if(U==="contains"){return(Z.textContent||Z.innerText||"").indexOf(V[3])>=0}else{if(U==="not"){var Y=V[3];for(var W=0,T=Y.length;W<T;W++){if(Y[W]===Z){return false}}return true}}}},CHILD:function(T,W){var Z=W[1],U=T;switch(Z){case"only":case"first":while(U=U.previousSibling){if(U.nodeType===1){return false}}if(Z=="first"){return true}U=T;case"last":while(U=U.nextSibling){if(U.nodeType===1){return false}}return true;case"nth":var V=W[2],ac=W[3];if(V==1&&ac==0){return true}var Y=W[0],ab=T.parentNode;if(ab&&(ab.sizcache!==Y||!T.nodeIndex)){var X=0;for(U=ab.firstChild;U;U=U.nextSibling){if(U.nodeType===1){U.nodeIndex=++X}}ab.sizcache=Y}var aa=T.nodeIndex-ac;if(V==0){return aa==0}else{return(aa%V==0&&aa/V>=0)}}},ID:function(U,T){return U.nodeType===1&&U.getAttribute("id")===T},TAG:function(U,T){return(T==="*"&&U.nodeType===1)||U.nodeName===T},CLASS:function(U,T){return(" "+(U.className||U.getAttribute("class"))+" ").indexOf(T)>-1},ATTR:function(Y,W){var V=W[1],T=I.attrHandle[V]?I.attrHandle[V](Y):Y[V]!=null?Y[V]:Y.getAttribute(V),Z=T+"",X=W[2],U=W[4];return T==null?X==="!=":X==="="?Z===U:X==="*="?Z.indexOf(U)>=0:X==="~="?(" "+Z+" ").indexOf(U)>=0:!U?Z&&T!==false:X==="!="?Z!=U:X==="^="?Z.indexOf(U)===0:X==="$="?Z.substr(Z.length-U.length)===U:X==="|="?Z===U||Z.substr(0,U.length+1)===U+"-":false},POS:function(X,U,V,Y){var T=U[2],W=I.setFilters[T];if(W){return W(X,V,U,Y)}}}};var M=I.match.POS;for(var O in I.match){I.match[O]=RegExp(I.match[O].source+/(?![^\[]*\])(?![^\(]*\))/.source)}var E=function(U,T){U=Array.prototype.slice.call(U);if(T){T.push.apply(T,U);return T}return U};try{Array.prototype.slice.call(document.documentElement.childNodes)}catch(N){E=function(X,W){var U=W||[];if(H.call(X)==="[object Array]"){Array.prototype.push.apply(U,X)}else{if(typeof X.length==="number"){for(var V=0,T=X.length;V<T;V++){U.push(X[V])}}else{for(var V=0;X[V];V++){U.push(X[V])}}}return U}}var G;if(document.documentElement.compareDocumentPosition){G=function(U,T){var V=U.compareDocumentPosition(T)&4?-1:U===T?0:1;if(V===0){hasDuplicate=true}return V}}else{if("sourceIndex" in document.documentElement){G=function(U,T){var V=U.sourceIndex-T.sourceIndex;if(V===0){hasDuplicate=true}return V}}else{if(document.createRange){G=function(W,U){var V=W.ownerDocument.createRange(),T=U.ownerDocument.createRange();V.selectNode(W);V.collapse(true);T.selectNode(U);T.collapse(true);var X=V.compareBoundaryPoints(Range.START_TO_END,T);if(X===0){hasDuplicate=true}return X}}}}(function(){var U=document.createElement("form"),V="script"+(new Date).getTime();U.innerHTML="<input name='"+V+"'/>";var T=document.documentElement;T.insertBefore(U,T.firstChild);if(!!document.getElementById(V)){I.find.ID=function(X,Y,Z){if(typeof Y.getElementById!=="undefined"&&!Z){var W=Y.getElementById(X[1]);return W?W.id===X[1]||typeof W.getAttributeNode!=="undefined"&&W.getAttributeNode("id").nodeValue===X[1]?[W]:g:[]}};I.filter.ID=function(Y,W){var X=typeof Y.getAttributeNode!=="undefined"&&Y.getAttributeNode("id");return Y.nodeType===1&&X&&X.nodeValue===W}}T.removeChild(U)})();(function(){var T=document.createElement("div");T.appendChild(document.createComment(""));if(T.getElementsByTagName("*").length>0){I.find.TAG=function(U,Y){var X=Y.getElementsByTagName(U[1]);if(U[1]==="*"){var W=[];for(var V=0;X[V];V++){if(X[V].nodeType===1){W.push(X[V])}}X=W}return X}}T.innerHTML="<a href='#'></a>";if(T.firstChild&&typeof T.firstChild.getAttribute!=="undefined"&&T.firstChild.getAttribute("href")!=="#"){I.attrHandle.href=function(U){return U.getAttribute("href",2)}}})();if(document.querySelectorAll){(function(){var T=F,U=document.createElement("div");U.innerHTML="<p class='TEST'></p>";if(U.querySelectorAll&&U.querySelectorAll(".TEST").length===0){return}F=function(Y,X,V,W){X=X||document;if(!W&&X.nodeType===9&&!Q(X)){try{return E(X.querySelectorAll(Y),V)}catch(Z){}}return T(Y,X,V,W)};F.find=T.find;F.filter=T.filter;F.selectors=T.selectors;F.matches=T.matches})()}if(document.getElementsByClassName&&document.documentElement.getElementsByClassName){(function(){var T=document.createElement("div");T.innerHTML="<div class='test e'></div><div class='test'></div>";if(T.getElementsByClassName("e").length===0){return}T.lastChild.className="e";if(T.getElementsByClassName("e").length===1){return}I.order.splice(1,0,"CLASS");I.find.CLASS=function(U,V,W){if(typeof V.getElementsByClassName!=="undefined"&&!W){return V.getElementsByClassName(U[1])}}})()}function P(U,Z,Y,ad,aa,ac){var ab=U=="previousSibling"&&!ac;for(var W=0,V=ad.length;W<V;W++){var T=ad[W];if(T){if(ab&&T.nodeType===1){T.sizcache=Y;T.sizset=W}T=T[U];var X=false;while(T){if(T.sizcache===Y){X=ad[T.sizset];break}if(T.nodeType===1&&!ac){T.sizcache=Y;T.sizset=W}if(T.nodeName===Z){X=T;break}T=T[U]}ad[W]=X}}}function S(U,Z,Y,ad,aa,ac){var ab=U=="previousSibling"&&!ac;for(var W=0,V=ad.length;W<V;W++){var T=ad[W];if(T){if(ab&&T.nodeType===1){T.sizcache=Y;T.sizset=W}T=T[U];var X=false;while(T){if(T.sizcache===Y){X=ad[T.sizset];break}if(T.nodeType===1){if(!ac){T.sizcache=Y;T.sizset=W}if(typeof Z!=="string"){if(T===Z){X=true;break}}else{if(F.filter(Z,[T]).length>0){X=T;break}}}T=T[U]}ad[W]=X}}}var K=document.compareDocumentPosition?function(U,T){return U.compareDocumentPosition(T)&16}:function(U,T){return U!==T&&(U.contains?U.contains(T):true)};var Q=function(T){return T.nodeType===9&&T.documentElement.nodeName!=="HTML"||!!T.ownerDocument&&Q(T.ownerDocument)};var J=function(T,aa){var W=[],X="",Y,V=aa.nodeType?[aa]:aa;while((Y=I.match.PSEUDO.exec(T))){X+=Y[0];T=T.replace(I.match.PSEUDO,"")}T=I.relative[T]?T+"*":T;for(var Z=0,U=V.length;Z<U;Z++){F(T,V[Z],W)}return F.filter(X,W)};o.find=F;o.filter=F.filter;o.expr=F.selectors;o.expr[":"]=o.expr.filters;F.selectors.filters.hidden=function(T){return T.offsetWidth===0||T.offsetHeight===0};F.selectors.filters.visible=function(T){return T.offsetWidth>0||T.offsetHeight>0};F.selectors.filters.animated=function(T){return o.grep(o.timers,function(U){return T===U.elem}).length};o.multiFilter=function(V,T,U){if(U){V=":not("+V+")"}return F.matches(V,T)};o.dir=function(V,U){var T=[],W=V[U];while(W&&W!=document){if(W.nodeType==1){T.push(W)}W=W[U]}return T};o.nth=function(X,T,V,W){T=T||1;var U=0;for(;X;X=X[V]){if(X.nodeType==1&&++U==T){break}}return X};o.sibling=function(V,U){var T=[];for(;V;V=V.nextSibling){if(V.nodeType==1&&V!=U){T.push(V)}}return T};return;l.Sizzle=F})();o.event={add:function(I,F,H,K){if(I.nodeType==3||I.nodeType==8){return}if(I.setInterval&&I!=l){I=l}if(!H.guid){H.guid=this.guid++}if(K!==g){var G=H;H=this.proxy(G);H.data=K}var E=o.data(I,"events")||o.data(I,"events",{}),J=o.data(I,"handle")||o.data(I,"handle",function(){return typeof o!=="undefined"&&!o.event.triggered?o.event.handle.apply(arguments.callee.elem,arguments):g});J.elem=I;o.each(F.split(/\s+/),function(M,N){var O=N.split(".");N=O.shift();H.type=O.slice().sort().join(".");var L=E[N];if(o.event.specialAll[N]){o.event.specialAll[N].setup.call(I,K,O)}if(!L){L=E[N]={};if(!o.event.special[N]||o.event.special[N].setup.call(I,K,O)===false){if(I.addEventListener){I.addEventListener(N,J,false)}else{if(I.attachEvent){I.attachEvent("on"+N,J)}}}}L[H.guid]=H;o.event.global[N]=true});I=null},guid:1,global:{},remove:function(K,H,J){if(K.nodeType==3||K.nodeType==8){return}var G=o.data(K,"events"),F,E;if(G){if(H===g||(typeof H==="string"&&H.charAt(0)==".")){for(var I in G){this.remove(K,I+(H||""))}}else{if(H.type){J=H.handler;H=H.type}o.each(H.split(/\s+/),function(M,O){var Q=O.split(".");O=Q.shift();var N=RegExp("(^|\\.)"+Q.slice().sort().join(".*\\.")+"(\\.|$)");if(G[O]){if(J){delete G[O][J.guid]}else{for(var P in G[O]){if(N.test(G[O][P].type)){delete G[O][P]}}}if(o.event.specialAll[O]){o.event.specialAll[O].teardown.call(K,Q)}for(F in G[O]){break}if(!F){if(!o.event.special[O]||o.event.special[O].teardown.call(K,Q)===false){if(K.removeEventListener){K.removeEventListener(O,o.data(K,"handle"),false)}else{if(K.detachEvent){K.detachEvent("on"+O,o.data(K,"handle"))}}}F=null;delete G[O]}}})}for(F in G){break}if(!F){var L=o.data(K,"handle");if(L){L.elem=null}o.removeData(K,"events");o.removeData(K,"handle")}}},trigger:function(I,K,H,E){var G=I.type||I;if(!E){I=typeof I==="object"?I[h]?I:o.extend(o.Event(G),I):o.Event(G);if(G.indexOf("!")>=0){I.type=G=G.slice(0,-1);I.exclusive=true}if(!H){I.stopPropagation();if(this.global[G]){o.each(o.cache,function(){if(this.events&&this.events[G]){o.event.trigger(I,K,this.handle.elem)}})}}if(!H||H.nodeType==3||H.nodeType==8){return g}I.result=g;I.target=H;K=o.makeArray(K);K.unshift(I)}I.currentTarget=H;var J=o.data(H,"handle");if(J){J.apply(H,K)}if((!H[G]||(o.nodeName(H,"a")&&G=="click"))&&H["on"+G]&&H["on"+G].apply(H,K)===false){I.result=false}if(!E&&H[G]&&!I.isDefaultPrevented()&&!(o.nodeName(H,"a")&&G=="click")){this.triggered=true;try{H[G]()}catch(L){}}this.triggered=false;if(!I.isPropagationStopped()){var F=H.parentNode||H.ownerDocument;if(F){o.event.trigger(I,K,F,true)}}},handle:function(K){var J,E;K=arguments[0]=o.event.fix(K||l.event);K.currentTarget=this;var L=K.type.split(".");K.type=L.shift();J=!L.length&&!K.exclusive;var I=RegExp("(^|\\.)"+L.slice().sort().join(".*\\.")+"(\\.|$)");E=(o.data(this,"events")||{})[K.type];for(var G in E){var H=E[G];if(J||I.test(H.type)){K.handler=H;K.data=H.data;var F=H.apply(this,arguments);if(F!==g){K.result=F;if(F===false){K.preventDefault();K.stopPropagation()}}if(K.isImmediatePropagationStopped()){break}}}},props:"altKey attrChange attrName bubbles button cancelable charCode clientX clientY ctrlKey currentTarget data detail eventPhase fromElement handler keyCode metaKey newValue originalTarget pageX pageY prevValue relatedNode relatedTarget screenX screenY shiftKey srcElement target toElement view wheelDelta which".split(" "),fix:function(H){if(H[h]){return H}var F=H;H=o.Event(F);for(var G=this.props.length,J;G;){J=this.props[--G];H[J]=F[J]}if(!H.target){H.target=H.srcElement||document}if(H.target.nodeType==3){H.target=H.target.parentNode}if(!H.relatedTarget&&H.fromElement){H.relatedTarget=H.fromElement==H.target?H.toElement:H.fromElement}if(H.pageX==null&&H.clientX!=null){var I=document.documentElement,E=document.body;H.pageX=H.clientX+(I&&I.scrollLeft||E&&E.scrollLeft||0)-(I.clientLeft||0);H.pageY=H.clientY+(I&&I.scrollTop||E&&E.scrollTop||0)-(I.clientTop||0)}if(!H.which&&((H.charCode||H.charCode===0)?H.charCode:H.keyCode)){H.which=H.charCode||H.keyCode}if(!H.metaKey&&H.ctrlKey){H.metaKey=H.ctrlKey}if(!H.which&&H.button){H.which=(H.button&1?1:(H.button&2?3:(H.button&4?2:0)))}return H},proxy:function(F,E){E=E||function(){return F.apply(this,arguments)};E.guid=F.guid=F.guid||E.guid||this.guid++;return E},special:{ready:{setup:B,teardown:function(){}}},specialAll:{live:{setup:function(E,F){o.event.add(this,F[0],c)},teardown:function(G){if(G.length){var E=0,F=RegExp("(^|\\.)"+G[0]+"(\\.|$)");o.each((o.data(this,"events").live||{}),function(){if(F.test(this.type)){E++}});if(E<1){o.event.remove(this,G[0],c)}}}}}};o.Event=function(E){if(!this.preventDefault){return new o.Event(E)}if(E&&E.type){this.originalEvent=E;this.type=E.type}else{this.type=E}this.timeStamp=e();this[h]=true};function k(){return false}function u(){return true}o.Event.prototype={preventDefault:function(){this.isDefaultPrevented=u;var E=this.originalEvent;if(!E){return}if(E.preventDefault){E.preventDefault()}E.returnValue=false},stopPropagation:function(){this.isPropagationStopped=u;var E=this.originalEvent;if(!E){return}if(E.stopPropagation){E.stopPropagation()}E.cancelBubble=true},stopImmediatePropagation:function(){this.isImmediatePropagationStopped=u;this.stopPropagation()},isDefaultPrevented:k,isPropagationStopped:k,isImmediatePropagationStopped:k};var a=function(F){var E=F.relatedTarget;while(E&&E!=this){try{E=E.parentNode}catch(G){E=this}}if(E!=this){F.type=F.data;o.event.handle.apply(this,arguments)}};o.each({mouseover:"mouseenter",mouseout:"mouseleave"},function(F,E){o.event.special[E]={setup:function(){o.event.add(this,F,a,E)},teardown:function(){o.event.remove(this,F,a)}}});o.fn.extend({bind:function(F,G,E){return F=="unload"?this.one(F,G,E):this.each(function(){o.event.add(this,F,E||G,E&&G)})},one:function(G,H,F){var E=o.event.proxy(F||H,function(I){o(this).unbind(I,E);return(F||H).apply(this,arguments)});return this.each(function(){o.event.add(this,G,E,F&&H)})},unbind:function(F,E){return this.each(function(){o.event.remove(this,F,E)})},trigger:function(E,F){return this.each(function(){o.event.trigger(E,F,this)})},triggerHandler:function(E,G){if(this[0]){var F=o.Event(E);F.preventDefault();F.stopPropagation();o.event.trigger(F,G,this[0]);return F.result}},toggle:function(G){var E=arguments,F=1;while(F<E.length){o.event.proxy(G,E[F++])}return this.click(o.event.proxy(G,function(H){this.lastToggle=(this.lastToggle||0)%F;H.preventDefault();return E[this.lastToggle++].apply(this,arguments)||false}))},hover:function(E,F){return this.mouseenter(E).mouseleave(F)},ready:function(E){B();if(o.isReady){E.call(document,o)}else{o.readyList.push(E)}return this},live:function(G,F){var E=o.event.proxy(F);E.guid+=this.selector+G;o(document).bind(i(G,this.selector),this.selector,E);return this},die:function(F,E){o(document).unbind(i(F,this.selector),E?{guid:E.guid+this.selector+F}:null);return this}});function c(H){var E=RegExp("(^|\\.)"+H.type+"(\\.|$)"),G=true,F=[];o.each(o.data(this,"events").live||[],function(I,J){if(E.test(J.type)){var K=o(H.target).closest(J.data)[0];if(K){F.push({elem:K,fn:J})}}});F.sort(function(J,I){return o.data(J.elem,"closest")-o.data(I.elem,"closest")});o.each(F,function(){if(this.fn.call(this.elem,H,this.fn.data)===false){return(G=false)}});return G}function i(F,E){return["live",F,E.replace(/\./g,"`").replace(/ /g,"|")].join(".")}o.extend({isReady:false,readyList:[],ready:function(){if(!o.isReady){o.isReady=true;if(o.readyList){o.each(o.readyList,function(){this.call(document,o)});o.readyList=null}o(document).triggerHandler("ready")}}});var x=false;function B(){if(x){return}x=true;if(document.addEventListener){document.addEventListener("DOMContentLoaded",function(){document.removeEventListener("DOMContentLoaded",arguments.callee,false);o.ready()},false)}else{if(document.attachEvent){document.attachEvent("onreadystatechange",function(){if(document.readyState==="complete"){document.detachEvent("onreadystatechange",arguments.callee);o.ready()}});if(document.documentElement.doScroll&&l==l.top){(function(){if(o.isReady){return}try{document.documentElement.doScroll("left")}catch(E){setTimeout(arguments.callee,0);return}o.ready()})()}}}o.event.add(l,"load",o.ready)}o.each(("blur,focus,load,resize,scroll,unload,click,dblclick,mousedown,mouseup,mousemove,mouseover,mouseout,mouseenter,mouseleave,change,select,submit,keydown,keypress,keyup,error").split(","),function(F,E){o.fn[E]=function(G){return G?this.bind(E,G):this.trigger(E)}});o(l).bind("unload",function(){for(var E in o.cache){if(E!=1&&o.cache[E].handle){o.event.remove(o.cache[E].handle.elem)}}});(function(){o.support={};var F=document.documentElement,G=document.createElement("script"),K=document.createElement("div"),J="script"+(new Date).getTime();K.style.display="none";K.innerHTML=' <link/><table></table><a href="/a" style="color:red;float:left;opacity:.5;">a</a><select><option>text</option></select><object><param/></object>';var H=K.getElementsByTagName("*"),E=K.getElementsByTagName("a")[0];if(!H||!H.length||!E){return}o.support={leadingWhitespace:K.firstChild.nodeType==3,tbody:!K.getElementsByTagName("tbody").length,objectAll:!!K.getElementsByTagName("object")[0].getElementsByTagName("*").length,htmlSerialize:!!K.getElementsByTagName("link").length,style:/red/.test(E.getAttribute("style")),hrefNormalized:E.getAttribute("href")==="/a",opacity:E.style.opacity==="0.5",cssFloat:!!E.style.cssFloat,scriptEval:false,noCloneEvent:true,boxModel:null};G.type="text/javascript";try{G.appendChild(document.createTextNode("window."+J+"=1;"))}catch(I){}F.insertBefore(G,F.firstChild);if(l[J]){o.support.scriptEval=true;delete l[J]}F.removeChild(G);if(K.attachEvent&&K.fireEvent){K.attachEvent("onclick",function(){o.support.noCloneEvent=false;K.detachEvent("onclick",arguments.callee)});K.cloneNode(true).fireEvent("onclick")}o(function(){var L=document.createElement("div");L.style.width=L.style.paddingLeft="1px";document.body.appendChild(L);o.boxModel=o.support.boxModel=L.offsetWidth===2;document.body.removeChild(L).style.display="none"})})();var w=o.support.cssFloat?"cssFloat":"styleFloat";o.props={"for":"htmlFor","class":"className","float":w,cssFloat:w,styleFloat:w,readonly:"readOnly",maxlength:"maxLength",cellspacing:"cellSpacing",rowspan:"rowSpan",tabindex:"tabIndex"};o.fn.extend({_load:o.fn.load,load:function(G,J,K){if(typeof G!=="string"){return this._load(G)}var I=G.indexOf(" ");if(I>=0){var E=G.slice(I,G.length);G=G.slice(0,I)}var H="GET";if(J){if(o.isFunction(J)){K=J;J=null}else{if(typeof J==="object"){J=o.param(J);H="POST"}}}var F=this;o.ajax({url:G,type:H,dataType:"html",data:J,complete:function(M,L){if(L=="success"||L=="notmodified"){F.html(E?o("<div/>").append(M.responseText.replace(/<script(.|\s)*?\/script>/g,"")).find(E):M.responseText)}if(K){F.each(K,[M.responseText,L,M])}}});return this},serialize:function(){return o.param(this.serializeArray())},serializeArray:function(){return this.map(function(){return this.elements?o.makeArray(this.elements):this}).filter(function(){return this.name&&!this.disabled&&(this.checked||/select|textarea/i.test(this.nodeName)||/text|hidden|password|search/i.test(this.type))}).map(function(E,F){var G=o(this).val();return G==null?null:o.isArray(G)?o.map(G,function(I,H){return{name:F.name,value:I}}):{name:F.name,value:G}}).get()}});o.each("ajaxStart,ajaxStop,ajaxComplete,ajaxError,ajaxSuccess,ajaxSend".split(","),function(E,F){o.fn[F]=function(G){return this.bind(F,G)}});var r=e();o.extend({get:function(E,G,H,F){if(o.isFunction(G)){H=G;G=null}return o.ajax({type:"GET",url:E,data:G,success:H,dataType:F})},getScript:function(E,F){return o.get(E,null,F,"script")},getJSON:function(E,F,G){return o.get(E,F,G,"json")},post:function(E,G,H,F){if(o.isFunction(G)){H=G;G={}}return o.ajax({type:"POST",url:E,data:G,success:H,dataType:F})},ajaxSetup:function(E){o.extend(o.ajaxSettings,E)},ajaxSettings:{url:location.href,global:true,type:"GET",contentType:"application/x-www-form-urlencoded",processData:true,async:true,xhr:function(){return l.ActiveXObject?new ActiveXObject("Microsoft.XMLHTTP"):new XMLHttpRequest()},accepts:{xml:"application/xml, text/xml",html:"text/html",script:"text/javascript, application/javascript",json:"application/json, text/javascript",text:"text/plain",_default:"*/*"}},lastModified:{},ajax:function(M){M=o.extend(true,M,o.extend(true,{},o.ajaxSettings,M));var W,F=/=\?(&|$)/g,R,V,G=M.type.toUpperCase();if(M.data&&M.processData&&typeof M.data!=="string"){M.data=o.param(M.data)}if(M.dataType=="jsonp"){if(G=="GET"){if(!M.url.match(F)){M.url+=(M.url.match(/\?/)?"&":"?")+(M.jsonp||"callback")+"=?"}}else{if(!M.data||!M.data.match(F)){M.data=(M.data?M.data+"&":"")+(M.jsonp||"callback")+"=?"}}M.dataType="json"}if(M.dataType=="json"&&(M.data&&M.data.match(F)||M.url.match(F))){W="jsonp"+r++;if(M.data){M.data=(M.data+"").replace(F,"="+W+"$1")}M.url=M.url.replace(F,"="+W+"$1");M.dataType="script";l[W]=function(X){V=X;I();L();l[W]=g;try{delete l[W]}catch(Y){}if(H){H.removeChild(T)}}}if(M.dataType=="script"&&M.cache==null){M.cache=false}if(M.cache===false&&G=="GET"){var E=e();var U=M.url.replace(/(\?|&)_=.*?(&|$)/,"$1_="+E+"$2");M.url=U+((U==M.url)?(M.url.match(/\?/)?"&":"?")+"_="+E:"")}if(M.data&&G=="GET"){M.url+=(M.url.match(/\?/)?"&":"?")+M.data;M.data=null}if(M.global&&!o.active++){o.event.trigger("ajaxStart")}var Q=/^(\w+:)?\/\/([^\/?#]+)/.exec(M.url);if(M.dataType=="script"&&G=="GET"&&Q&&(Q[1]&&Q[1]!=location.protocol||Q[2]!=location.host)){var H=document.getElementsByTagName("head")[0];var T=document.createElement("script");T.src=M.url;if(M.scriptCharset){T.charset=M.scriptCharset}if(!W){var O=false;T.onload=T.onreadystatechange=function(){if(!O&&(!this.readyState||this.readyState=="loaded"||this.readyState=="complete")){O=true;I();L();T.onload=T.onreadystatechange=null;H.removeChild(T)}}}H.appendChild(T);return g}var K=false;var J=M.xhr();if(M.username){J.open(G,M.url,M.async,M.username,M.password)}else{J.open(G,M.url,M.async)}try{if(M.data){J.setRequestHeader("Content-Type",M.contentType)}if(M.ifModified){J.setRequestHeader("If-Modified-Since",o.lastModified[M.url]||"Thu, 01 Jan 1970 00:00:00 GMT")}J.setRequestHeader("X-Requested-With","XMLHttpRequest");J.setRequestHeader("Accept",M.dataType&&M.accepts[M.dataType]?M.accepts[M.dataType]+", */*":M.accepts._default)}catch(S){}if(M.beforeSend&&M.beforeSend(J,M)===false){if(M.global&&!--o.active){o.event.trigger("ajaxStop")}J.abort();return false}if(M.global){o.event.trigger("ajaxSend",[J,M])}var N=function(X){if(J.readyState==0){if(P){clearInterval(P);P=null;if(M.global&&!--o.active){o.event.trigger("ajaxStop")}}}else{if(!K&&J&&(J.readyState==4||X=="timeout")){K=true;if(P){clearInterval(P);P=null}R=X=="timeout"?"timeout":!o.httpSuccess(J)?"error":M.ifModified&&o.httpNotModified(J,M.url)?"notmodified":"success";if(R=="success"){try{V=o.httpData(J,M.dataType,M)}catch(Z){R="parsererror"}}if(R=="success"){var Y;try{Y=J.getResponseHeader("Last-Modified")}catch(Z){}if(M.ifModified&&Y){o.lastModified[M.url]=Y}if(!W){I()}}else{o.handleError(M,J,R)}L();if(X){J.abort()}if(M.async){J=null}}}};if(M.async){var P=setInterval(N,13);if(M.timeout>0){setTimeout(function(){if(J&&!K){N("timeout")}},M.timeout)}}try{J.send(M.data)}catch(S){o.handleError(M,J,null,S)}if(!M.async){N()}function I(){if(M.success){M.success(V,R)}if(M.global){o.event.trigger("ajaxSuccess",[J,M])}}function L(){if(M.complete){M.complete(J,R)}if(M.global){o.event.trigger("ajaxComplete",[J,M])}if(M.global&&!--o.active){o.event.trigger("ajaxStop")}}return J},handleError:function(F,H,E,G){if(F.error){F.error(H,E,G)}if(F.global){o.event.trigger("ajaxError",[H,F,G])}},active:0,httpSuccess:function(F){try{return !F.status&&location.protocol=="file:"||(F.status>=200&&F.status<300)||F.status==304||F.status==1223}catch(E){}return false},httpNotModified:function(G,E){try{var H=G.getResponseHeader("Last-Modified");return G.status==304||H==o.lastModified[E]}catch(F){}return false},httpData:function(J,H,G){var F=J.getResponseHeader("content-type"),E=H=="xml"||!H&&F&&F.indexOf("xml")>=0,I=E?J.responseXML:J.responseText;if(E&&I.documentElement.tagName=="parsererror"){throw"parsererror"}if(G&&G.dataFilter){I=G.dataFilter(I,H)}if(typeof I==="string"){if(H=="script"){o.globalEval(I)}if(H=="json"){I=l["eval"]("("+I+")")}}return I},param:function(E){var G=[];function H(I,J){G[G.length]=encodeURIComponent(I)+"="+encodeURIComponent(J)}if(o.isArray(E)||E.jquery){o.each(E,function(){H(this.name,this.value)})}else{for(var F in E){if(o.isArray(E[F])){o.each(E[F],function(){H(F,this)})}else{H(F,o.isFunction(E[F])?E[F]():E[F])}}}return G.join("&").replace(/%20/g,"+")}});var m={},n,d=[["height","marginTop","marginBottom","paddingTop","paddingBottom"],["width","marginLeft","marginRight","paddingLeft","paddingRight"],["opacity"]];function t(F,E){var G={};o.each(d.concat.apply([],d.slice(0,E)),function(){G[this]=F});return G}o.fn.extend({show:function(J,L){if(J){return this.animate(t("show",3),J,L)}else{for(var H=0,F=this.length;H<F;H++){var E=o.data(this[H],"olddisplay");this[H].style.display=E||"";if(o.css(this[H],"display")==="none"){var G=this[H].tagName,K;if(m[G]){K=m[G]}else{var I=o("<"+G+" />").appendTo("body");K=I.css("display");if(K==="none"){K="block"}I.remove();m[G]=K}o.data(this[H],"olddisplay",K)}}for(var H=0,F=this.length;H<F;H++){this[H].style.display=o.data(this[H],"olddisplay")||""}return this}},hide:function(H,I){if(H){return this.animate(t("hide",3),H,I)}else{for(var G=0,F=this.length;G<F;G++){var E=o.data(this[G],"olddisplay");if(!E&&E!=="none"){o.data(this[G],"olddisplay",o.css(this[G],"display"))}}for(var G=0,F=this.length;G<F;G++){this[G].style.display="none"}return this}},_toggle:o.fn.toggle,toggle:function(G,F){var E=typeof G==="boolean";return o.isFunction(G)&&o.isFunction(F)?this._toggle.apply(this,arguments):G==null||E?this.each(function(){var H=E?G:o(this).is(":hidden");o(this)[H?"show":"hide"]()}):this.animate(t("toggle",3),G,F)},fadeTo:function(E,G,F){return this.animate({opacity:G},E,F)},animate:function(I,F,H,G){var E=o.speed(F,H,G);return this[E.queue===false?"each":"queue"](function(){var K=o.extend({},E),M,L=this.nodeType==1&&o(this).is(":hidden"),J=this;for(M in I){if(I[M]=="hide"&&L||I[M]=="show"&&!L){return K.complete.call(this)}if((M=="height"||M=="width")&&this.style){K.display=o.css(this,"display");K.overflow=this.style.overflow}}if(K.overflow!=null){this.style.overflow="hidden"}K.curAnim=o.extend({},I);o.each(I,function(O,S){var R=new o.fx(J,K,O);if(/toggle|show|hide/.test(S)){R[S=="toggle"?L?"show":"hide":S](I)}else{var Q=S.toString().match(/^([+-]=)?([\d+-.]+)(.*)$/),T=R.cur(true)||0;if(Q){var N=parseFloat(Q[2]),P=Q[3]||"px";if(P!="px"){J.style[O]=(N||1)+P;T=((N||1)/R.cur(true))*T;J.style[O]=T+P}if(Q[1]){N=((Q[1]=="-="?-1:1)*N)+T}R.custom(T,N,P)}else{R.custom(T,S,"")}}});return true})},stop:function(F,E){var G=o.timers;if(F){this.queue([])}this.each(function(){for(var H=G.length-1;H>=0;H--){if(G[H].elem==this){if(E){G[H](true)}G.splice(H,1)}}});if(!E){this.dequeue()}return this}});o.each({slideDown:t("show",1),slideUp:t("hide",1),slideToggle:t("toggle",1),fadeIn:{opacity:"show"},fadeOut:{opacity:"hide"}},function(E,F){o.fn[E]=function(G,H){return this.animate(F,G,H)}});o.extend({speed:function(G,H,F){var E=typeof G==="object"?G:{complete:F||!F&&H||o.isFunction(G)&&G,duration:G,easing:F&&H||H&&!o.isFunction(H)&&H};E.duration=o.fx.off?0:typeof E.duration==="number"?E.duration:o.fx.speeds[E.duration]||o.fx.speeds._default;E.old=E.complete;E.complete=function(){if(E.queue!==false){o(this).dequeue()}if(o.isFunction(E.old)){E.old.call(this)}};return E},easing:{linear:function(G,H,E,F){return E+F*G},swing:function(G,H,E,F){return((-Math.cos(G*Math.PI)/2)+0.5)*F+E}},timers:[],fx:function(F,E,G){this.options=E;this.elem=F;this.prop=G;if(!E.orig){E.orig={}}}});o.fx.prototype={update:function(){if(this.options.step){this.options.step.call(this.elem,this.now,this)}(o.fx.step[this.prop]||o.fx.step._default)(this);if((this.prop=="height"||this.prop=="width")&&this.elem.style){this.elem.style.display="block"}},cur:function(F){if(this.elem[this.prop]!=null&&(!this.elem.style||this.elem.style[this.prop]==null)){return this.elem[this.prop]}var E=parseFloat(o.css(this.elem,this.prop,F));return E&&E>-10000?E:parseFloat(o.curCSS(this.elem,this.prop))||0},custom:function(I,H,G){this.startTime=e();this.start=I;this.end=H;this.unit=G||this.unit||"px";this.now=this.start;this.pos=this.state=0;var E=this;function F(J){return E.step(J)}F.elem=this.elem;if(F()&&o.timers.push(F)&&!n){n=setInterval(function(){var K=o.timers;for(var J=0;J<K.length;J++){if(!K[J]()){K.splice(J--,1)}}if(!K.length){clearInterval(n);n=g}},13)}},show:function(){this.options.orig[this.prop]=o.attr(this.elem.style,this.prop);this.options.show=true;this.custom(this.prop=="width"||this.prop=="height"?1:0,this.cur());o(this.elem).show()},hide:function(){this.options.orig[this.prop]=o.attr(this.elem.style,this.prop);this.options.hide=true;this.custom(this.cur(),0)},step:function(H){var G=e();if(H||G>=this.options.duration+this.startTime){this.now=this.end;this.pos=this.state=1;this.update();this.options.curAnim[this.prop]=true;var E=true;for(var F in this.options.curAnim){if(this.options.curAnim[F]!==true){E=false}}if(E){if(this.options.display!=null){this.elem.style.overflow=this.options.overflow;this.elem.style.display=this.options.display;if(o.css(this.elem,"display")=="none"){this.elem.style.display="block"}}if(this.options.hide){o(this.elem).hide()}if(this.options.hide||this.options.show){for(var I in this.options.curAnim){o.attr(this.elem.style,I,this.options.orig[I])}}this.options.complete.call(this.elem)}return false}else{var J=G-this.startTime;this.state=J/this.options.duration;this.pos=o.easing[this.options.easing||(o.easing.swing?"swing":"linear")](this.state,J,0,1,this.options.duration);this.now=this.start+((this.end-this.start)*this.pos);this.update()}return true}};o.extend(o.fx,{speeds:{slow:600,fast:200,_default:400},step:{opacity:function(E){o.attr(E.elem.style,"opacity",E.now)},_default:function(E){if(E.elem.style&&E.elem.style[E.prop]!=null){E.elem.style[E.prop]=E.now+E.unit}else{E.elem[E.prop]=E.now}}}});if(document.documentElement.getBoundingClientRect){o.fn.offset=function(){if(!this[0]){return{top:0,left:0}}if(this[0]===this[0].ownerDocument.body){return o.offset.bodyOffset(this[0])}var G=this[0].getBoundingClientRect(),J=this[0].ownerDocument,F=J.body,E=J.documentElement,L=E.clientTop||F.clientTop||0,K=E.clientLeft||F.clientLeft||0,I=G.top+(self.pageYOffset||o.boxModel&&E.scrollTop||F.scrollTop)-L,H=G.left+(self.pageXOffset||o.boxModel&&E.scrollLeft||F.scrollLeft)-K;return{top:I,left:H}}}else{o.fn.offset=function(){if(!this[0]){return{top:0,left:0}}if(this[0]===this[0].ownerDocument.body){return o.offset.bodyOffset(this[0])}o.offset.initialized||o.offset.initialize();var J=this[0],G=J.offsetParent,F=J,O=J.ownerDocument,M,H=O.documentElement,K=O.body,L=O.defaultView,E=L.getComputedStyle(J,null),N=J.offsetTop,I=J.offsetLeft;while((J=J.parentNode)&&J!==K&&J!==H){M=L.getComputedStyle(J,null);N-=J.scrollTop,I-=J.scrollLeft;if(J===G){N+=J.offsetTop,I+=J.offsetLeft;if(o.offset.doesNotAddBorder&&!(o.offset.doesAddBorderForTableAndCells&&/^t(able|d|h)$/i.test(J.tagName))){N+=parseInt(M.borderTopWidth,10)||0,I+=parseInt(M.borderLeftWidth,10)||0}F=G,G=J.offsetParent}if(o.offset.subtractsBorderForOverflowNotVisible&&M.overflow!=="visible"){N+=parseInt(M.borderTopWidth,10)||0,I+=parseInt(M.borderLeftWidth,10)||0}E=M}if(E.position==="relative"||E.position==="static"){N+=K.offsetTop,I+=K.offsetLeft}if(E.position==="fixed"){N+=Math.max(H.scrollTop,K.scrollTop),I+=Math.max(H.scrollLeft,K.scrollLeft)}return{top:N,left:I}}}o.offset={initialize:function(){if(this.initialized){return}var L=document.body,F=document.createElement("div"),H,G,N,I,M,E,J=L.style.marginTop,K='<div style="position:absolute;top:0;left:0;margin:0;border:5px solid #000;padding:0;width:1px;height:1px;"><div></div></div><table style="position:absolute;top:0;left:0;margin:0;border:5px solid #000;padding:0;width:1px;height:1px;" cellpadding="0" cellspacing="0"><tr><td></td></tr></table>';M={position:"absolute",top:0,left:0,margin:0,border:0,width:"1px",height:"1px",visibility:"hidden"};for(E in M){F.style[E]=M[E]}F.innerHTML=K;L.insertBefore(F,L.firstChild);H=F.firstChild,G=H.firstChild,I=H.nextSibling.firstChild.firstChild;this.doesNotAddBorder=(G.offsetTop!==5);this.doesAddBorderForTableAndCells=(I.offsetTop===5);H.style.overflow="hidden",H.style.position="relative";this.subtractsBorderForOverflowNotVisible=(G.offsetTop===-5);L.style.marginTop="1px";this.doesNotIncludeMarginInBodyOffset=(L.offsetTop===0);L.style.marginTop=J;L.removeChild(F);this.initialized=true},bodyOffset:function(E){o.offset.initialized||o.offset.initialize();var G=E.offsetTop,F=E.offsetLeft;if(o.offset.doesNotIncludeMarginInBodyOffset){G+=parseInt(o.curCSS(E,"marginTop",true),10)||0,F+=parseInt(o.curCSS(E,"marginLeft",true),10)||0}return{top:G,left:F}}};o.fn.extend({position:function(){var I=0,H=0,F;if(this[0]){var G=this.offsetParent(),J=this.offset(),E=/^body|html$/i.test(G[0].tagName)?{top:0,left:0}:G.offset();J.top-=j(this,"marginTop");J.left-=j(this,"marginLeft");E.top+=j(G,"borderTopWidth");E.left+=j(G,"borderLeftWidth");F={top:J.top-E.top,left:J.left-E.left}}return F},offsetParent:function(){var E=this[0].offsetParent||document.body;while(E&&(!/^body|html$/i.test(E.tagName)&&o.css(E,"position")=="static")){E=E.offsetParent}return o(E)}});o.each(["Left","Top"],function(F,E){var G="scroll"+E;o.fn[G]=function(H){if(!this[0]){return null}return H!==g?this.each(function(){this==l||this==document?l.scrollTo(!F?H:o(l).scrollLeft(),F?H:o(l).scrollTop()):this[G]=H}):this[0]==l||this[0]==document?self[F?"pageYOffset":"pageXOffset"]||o.boxModel&&document.documentElement[G]||document.body[G]:this[0][G]}});o.each(["Height","Width"],function(I,G){var E=I?"Left":"Top",H=I?"Right":"Bottom",F=G.toLowerCase();o.fn["inner"+G]=function(){return this[0]?o.css(this[0],F,false,"padding"):null};o.fn["outer"+G]=function(K){return this[0]?o.css(this[0],F,false,K?"margin":"border"):null};var J=G.toLowerCase();o.fn[J]=function(K){return this[0]==l?document.compatMode=="CSS1Compat"&&document.documentElement["client"+G]||document.body["client"+G]:this[0]==document?Math.max(document.documentElement["client"+G],document.body["scroll"+G],document.documentElement["scroll"+G],document.body["offset"+G],document.documentElement["offset"+G]):K===g?(this.length?o.css(this[0],J):null):this.css(J,typeof K==="string"?K:K+"px")}})})();
\ No newline at end of file diff --git a/examples/webkit/fancybrowser/jquery.qrc b/examples/webkit/fancybrowser/jquery.qrc new file mode 100644 index 0000000..1022d68 --- /dev/null +++ b/examples/webkit/fancybrowser/jquery.qrc @@ -0,0 +1,5 @@ +<RCC> + <qresource prefix="/" > + <file>jquery.min.js</file> + </qresource> +</RCC> diff --git a/examples/webkit/fancybrowser/main.cpp b/examples/webkit/fancybrowser/main.cpp new file mode 100644 index 0000000..5936469 --- /dev/null +++ b/examples/webkit/fancybrowser/main.cpp @@ -0,0 +1,51 @@ +/**************************************************************************** +** +** Copyright (C) 2009 Nokia Corporation and/or its subsidiary(-ies). +** Contact: Qt Software Information (qt-info@nokia.com) +** +** This file is part of the examples of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:LGPL$ +** No Commercial Usage +** This file contains pre-release code and may not be distributed. +** You may use this file in accordance with the terms and conditions +** contained in the either Technology Preview License Agreement or the +** Beta Release License Agreement. +** +** GNU Lesser General Public License Usage +** Alternatively, this file may be used under the terms of the GNU Lesser +** General Public License version 2.1 as published by the Free Software +** Foundation and appearing in the file LICENSE.LGPL included in the +** packaging of this file. Please review the following information to +** ensure the GNU Lesser General Public License version 2.1 requirements +** will be met: http://www.gnu.org/licenses/old-licenses/lgpl-2.1.html. +** +** In addition, as a special exception, Nokia gives you certain +** additional rights. These rights are described in the Nokia Qt LGPL +** Exception version 1.0, included in the file LGPL_EXCEPTION.txt in this +** package. +** +** GNU General Public License Usage +** Alternatively, this file may be used under the terms of the GNU +** General Public License version 3.0 as published by the Free Software +** Foundation and appearing in the file LICENSE.GPL included in the +** packaging of this file. Please review the following information to +** ensure the GNU General Public License version 3.0 requirements will be +** met: http://www.gnu.org/copyleft/gpl.html. +** +** If you are unsure which license is appropriate for your use, please +** contact the sales department at qt-sales@nokia.com. +** $QT_END_LICENSE$ +** +****************************************************************************/ + +#include <QtGui> +#include "mainwindow.h" + +int main(int argc, char * argv[]) +{ + QApplication app(argc, argv); + MainWindow *browser = new MainWindow; + browser->show(); + return app.exec(); +} diff --git a/examples/webkit/fancybrowser/mainwindow.cpp b/examples/webkit/fancybrowser/mainwindow.cpp new file mode 100644 index 0000000..bf61f9c --- /dev/null +++ b/examples/webkit/fancybrowser/mainwindow.cpp @@ -0,0 +1,167 @@ +/**************************************************************************** +** +** Copyright (C) 2009 Nokia Corporation and/or its subsidiary(-ies). +** Contact: Qt Software Information (qt-info@nokia.com) +** +** This file is part of the examples of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:LGPL$ +** No Commercial Usage +** This file contains pre-release code and may not be distributed. +** You may use this file in accordance with the terms and conditions +** contained in the either Technology Preview License Agreement or the +** Beta Release License Agreement. +** +** GNU Lesser General Public License Usage +** Alternatively, this file may be used under the terms of the GNU Lesser +** General Public License version 2.1 as published by the Free Software +** Foundation and appearing in the file LICENSE.LGPL included in the +** packaging of this file. Please review the following information to +** ensure the GNU Lesser General Public License version 2.1 requirements +** will be met: http://www.gnu.org/licenses/old-licenses/lgpl-2.1.html. +** +** In addition, as a special exception, Nokia gives you certain +** additional rights. These rights are described in the Nokia Qt LGPL +** Exception version 1.0, included in the file LGPL_EXCEPTION.txt in this +** package. +** +** GNU General Public License Usage +** Alternatively, this file may be used under the terms of the GNU +** General Public License version 3.0 as published by the Free Software +** Foundation and appearing in the file LICENSE.GPL included in the +** packaging of this file. Please review the following information to +** ensure the GNU General Public License version 3.0 requirements will be +** met: http://www.gnu.org/copyleft/gpl.html. +** +** If you are unsure which license is appropriate for your use, please +** contact the sales department at qt-sales@nokia.com. +** $QT_END_LICENSE$ +** +****************************************************************************/ + +#include <QtGui> +#include <QtWebKit> +#include "mainwindow.h" + +MainWindow::MainWindow() +{ + progress = 0; + + QFile file; + file.setFileName(":/jquery.min.js"); + file.open(QIODevice::ReadOnly); + jQuery = file.readAll(); + file.close(); + + view = new QWebView(this); + view->load(QUrl("http://www.google.com/ncr")); + connect(view, SIGNAL(loadFinished(bool)), SLOT(adjustLocation())); + connect(view, SIGNAL(titleChanged(const QString&)), SLOT(adjustTitle())); + connect(view, SIGNAL(loadProgress(int)), SLOT(setProgress(int))); + connect(view, SIGNAL(loadFinished(bool)), SLOT(finishLoading(bool))); + + locationEdit = new QLineEdit(this); + locationEdit->setSizePolicy(QSizePolicy::Expanding, locationEdit->sizePolicy().verticalPolicy()); + connect(locationEdit, SIGNAL(returnPressed()), SLOT(changeLocation())); + + QToolBar *toolBar = addToolBar(tr("Navigation")); + toolBar->addAction(view->pageAction(QWebPage::Back)); + toolBar->addAction(view->pageAction(QWebPage::Forward)); + toolBar->addAction(view->pageAction(QWebPage::Reload)); + toolBar->addAction(view->pageAction(QWebPage::Stop)); + toolBar->addWidget(locationEdit); + + QMenu *effectMenu = menuBar()->addMenu(tr("&Effect")); + effectMenu->addAction("Highlight all links", this, SLOT(highlightAllLinks())); + + QAction *rotateAction = new QAction(this); + rotateAction->setIcon(style()->standardIcon(QStyle::SP_FileDialogDetailedView)); + rotateAction->setCheckable(true); + rotateAction->setText(tr("Turn images upside down")); + connect(rotateAction, SIGNAL(toggled(bool)), this, SLOT(rotateImages(bool))); + effectMenu->addAction(rotateAction); + + QMenu *toolsMenu = menuBar()->addMenu(tr("&Tools")); + toolsMenu->addAction(tr("Remove GIF images"), this, SLOT(removeGifImages())); + toolsMenu->addAction(tr("Remove all inline frames"), this, SLOT(removeInlineFrames())); + toolsMenu->addAction(tr("Remove all object elements"), this, SLOT(removeObjectElements())); + toolsMenu->addAction(tr("Remove all embedded elements"), this, SLOT(removeEmbeddedElements())); + + setCentralWidget(view); +} + +void MainWindow::adjustLocation() +{ + locationEdit->setText(view->url().toString()); +} + +void MainWindow::changeLocation() +{ + QUrl url = QUrl(locationEdit->text()); + locationEdit->setText(url.toString()); + view->load(url); + view->setFocus(); +} + +void MainWindow::adjustTitle() +{ + if (progress <= 0 || progress >= 100) + setWindowTitle(view->title()); + else + setWindowTitle(QString("%1 (%2%)").arg(view->title()).arg(progress)); +} + +void MainWindow::setProgress(int p) +{ + progress = p; + adjustTitle(); +} + +void MainWindow::finishLoading(bool) +{ + progress = 100; + adjustTitle(); + view->page()->mainFrame()->evaluateJavaScript(jQuery); +} + +void MainWindow::highlightAllLinks() +{ + QString code = "$('a').each( function () { $(this).css('background-color', 'yellow') } )"; + view->page()->mainFrame()->evaluateJavaScript(code); +} + +void MainWindow::rotateImages(bool toggle) +{ + QString code = "$('img').each( function () { $(this).css('-webkit-transition', '-webkit-transform 2s') } )"; + view->page()->mainFrame()->evaluateJavaScript(code); + if (toggle) + code = "$('img').each( function () { $(this).css('-webkit-transform', 'rotate(180deg)') } )"; + else + code = "$('img').each( function () { $(this).css('-webkit-transform', 'rotate(0deg)') } )"; + view->page()->mainFrame()->evaluateJavaScript(code); +} + +void MainWindow::removeGifImages() +{ + QString code = "$('[src*=gif]').remove()"; + view->page()->mainFrame()->evaluateJavaScript(code); +} + +void MainWindow::removeInlineFrames() +{ + QString code = "$('iframe').remove()"; + view->page()->mainFrame()->evaluateJavaScript(code); +} + +void MainWindow::removeObjectElements() +{ + QString code = "$('object').remove()"; + view->page()->mainFrame()->evaluateJavaScript(code); +} + +void MainWindow::removeEmbeddedElements() +{ + QString code = "$('embed').remove()"; + view->page()->mainFrame()->evaluateJavaScript(code); +} + diff --git a/examples/webkit/fancybrowser/mainwindow.h b/examples/webkit/fancybrowser/mainwindow.h new file mode 100644 index 0000000..9362ca7 --- /dev/null +++ b/examples/webkit/fancybrowser/mainwindow.h @@ -0,0 +1,76 @@ +/**************************************************************************** +** +** Copyright (C) 2009 Nokia Corporation and/or its subsidiary(-ies). +** Contact: Qt Software Information (qt-info@nokia.com) +** +** This file is part of the examples of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:LGPL$ +** No Commercial Usage +** This file contains pre-release code and may not be distributed. +** You may use this file in accordance with the terms and conditions +** contained in the either Technology Preview License Agreement or the +** Beta Release License Agreement. +** +** GNU Lesser General Public License Usage +** Alternatively, this file may be used under the terms of the GNU Lesser +** General Public License version 2.1 as published by the Free Software +** Foundation and appearing in the file LICENSE.LGPL included in the +** packaging of this file. Please review the following information to +** ensure the GNU Lesser General Public License version 2.1 requirements +** will be met: http://www.gnu.org/licenses/old-licenses/lgpl-2.1.html. +** +** In addition, as a special exception, Nokia gives you certain +** additional rights. These rights are described in the Nokia Qt LGPL +** Exception version 1.0, included in the file LGPL_EXCEPTION.txt in this +** package. +** +** GNU General Public License Usage +** Alternatively, this file may be used under the terms of the GNU +** General Public License version 3.0 as published by the Free Software +** Foundation and appearing in the file LICENSE.GPL included in the +** packaging of this file. Please review the following information to +** ensure the GNU General Public License version 3.0 requirements will be +** met: http://www.gnu.org/copyleft/gpl.html. +** +** If you are unsure which license is appropriate for your use, please +** contact the sales department at qt-sales@nokia.com. +** $QT_END_LICENSE$ +** +****************************************************************************/ + +#include <QMainWindow> + +QT_BEGIN_NAMESPACE +class QWebView; +class QLineEdit; +QT_END_NAMESPACE + +class MainWindow : public QMainWindow +{ + Q_OBJECT + +public: + MainWindow(); + +protected slots: + + void adjustLocation(); + void changeLocation(); + void adjustTitle(); + void setProgress(int p); + void finishLoading(bool); + + void highlightAllLinks(); + void rotateImages(bool toggle); + void removeGifImages(); + void removeInlineFrames(); + void removeObjectElements(); + void removeEmbeddedElements(); + +private: + QString jQuery; + QWebView *view; + QLineEdit *locationEdit; + int progress; +}; diff --git a/examples/webkit/googlechat/form.ui b/examples/webkit/googlechat/form.ui new file mode 100644 index 0000000..3b9fb82 --- /dev/null +++ b/examples/webkit/googlechat/form.ui @@ -0,0 +1,214 @@ +<?xml version="1.0" encoding="UTF-8"?> +<ui version="4.0"> + <class>Form</class> + <widget class="QWidget" name="Form"> + <property name="geometry"> + <rect> + <x>0</x> + <y>0</y> + <width>286</width> + <height>413</height> + </rect> + </property> + <property name="windowTitle"> + <string>Google Talk Client</string> + </property> + <layout class="QVBoxLayout" name="verticalLayout"> + <property name="spacing"> + <number>0</number> + </property> + <property name="margin"> + <number>0</number> + </property> + <item> + <widget class="QStackedWidget" name="stackedWidget"> + <property name="currentIndex"> + <number>1</number> + </property> + <widget class="QWidget" name="page_3"> + <layout class="QVBoxLayout" name="verticalLayout_4"> + <item> + <spacer name="verticalSpacer_4"> + <property name="orientation"> + <enum>Qt::Vertical</enum> + </property> + <property name="sizeHint" stdset="0"> + <size> + <width>20</width> + <height>170</height> + </size> + </property> + </spacer> + </item> + <item> + <widget class="QLabel" name="statusLabel"> + <property name="text"> + <string>TextLabel</string> + </property> + <property name="alignment"> + <set>Qt::AlignCenter</set> + </property> + </widget> + </item> + <item> + <widget class="QProgressBar" name="progressBar"> + <property name="value"> + <number>24</number> + </property> + </widget> + </item> + <item> + <spacer name="verticalSpacer_5"> + <property name="orientation"> + <enum>Qt::Vertical</enum> + </property> + <property name="sizeHint" stdset="0"> + <size> + <width>20</width> + <height>169</height> + </size> + </property> + </spacer> + </item> + </layout> + </widget> + <widget class="QWidget" name="page"> + <layout class="QVBoxLayout" name="verticalLayout_2"> + <item> + <spacer name="verticalSpacer_3"> + <property name="orientation"> + <enum>Qt::Vertical</enum> + </property> + <property name="sizeHint" stdset="0"> + <size> + <width>20</width> + <height>119</height> + </size> + </property> + </spacer> + </item> + <item> + <widget class="QLabel" name="userNameLabel"> + <property name="text"> + <string>Google username:</string> + </property> + </widget> + </item> + <item> + <widget class="QLineEdit" name="userNameEdit"/> + </item> + <item> + <spacer name="verticalSpacer_2"> + <property name="orientation"> + <enum>Qt::Vertical</enum> + </property> + <property name="sizeType"> + <enum>QSizePolicy::Fixed</enum> + </property> + <property name="sizeHint" stdset="0"> + <size> + <width>20</width> + <height>17</height> + </size> + </property> + </spacer> + </item> + <item> + <widget class="QLabel" name="passwordLabel"> + <property name="text"> + <string>Password:</string> + </property> + </widget> + </item> + <item> + <widget class="QLineEdit" name="passwordEdit"> + <property name="echoMode"> + <enum>QLineEdit::Password</enum> + </property> + </widget> + </item> + <item> + <spacer name="verticalSpacer"> + <property name="orientation"> + <enum>Qt::Vertical</enum> + </property> + <property name="sizeHint" stdset="0"> + <size> + <width>20</width> + <height>118</height> + </size> + </property> + </spacer> + </item> + <item> + <layout class="QHBoxLayout" name="horizontalLayout"> + <item> + <spacer name="horizontalSpacer"> + <property name="orientation"> + <enum>Qt::Horizontal</enum> + </property> + <property name="sizeHint" stdset="0"> + <size> + <width>40</width> + <height>20</height> + </size> + </property> + </spacer> + </item> + <item> + <widget class="QPushButton" name="loginButton"> + <property name="text"> + <string>Login</string> + </property> + </widget> + </item> + <item> + <spacer name="horizontalSpacer_2"> + <property name="orientation"> + <enum>Qt::Horizontal</enum> + </property> + <property name="sizeHint" stdset="0"> + <size> + <width>40</width> + <height>20</height> + </size> + </property> + </spacer> + </item> + </layout> + </item> + </layout> + </widget> + <widget class="QWidget" name="page_2"> + <layout class="QVBoxLayout" name="verticalLayout_3"> + <property name="spacing"> + <number>0</number> + </property> + <property name="margin"> + <number>0</number> + </property> + <item> + <widget class="QWebView" name="webView"> + <property name="url"> + <url> + <string>about:blank</string> + </url> + </property> + </widget> + </item> + </layout> + </widget> + </widget> + </item> + </layout> + </widget> + <customwidgets> + <customwidget> + <class>QWebView</class> + <extends>QWidget</extends> + <header>QtWebKit/QWebView</header> + </customwidget> + </customwidgets> + <resources/> + <connections/> +</ui> diff --git a/examples/webkit/googlechat/googlechat.cpp b/examples/webkit/googlechat/googlechat.cpp new file mode 100644 index 0000000..9ac2cd2 --- /dev/null +++ b/examples/webkit/googlechat/googlechat.cpp @@ -0,0 +1,163 @@ +/**************************************************************************** +** +** Copyright (C) 2009 Nokia Corporation and/or its subsidiary(-ies). +** Contact: Qt Software Information (qt-info@nokia.com) +** +** This file is part of the examples of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:LGPL$ +** No Commercial Usage +** This file contains pre-release code and may not be distributed. +** You may use this file in accordance with the terms and conditions +** contained in the either Technology Preview License Agreement or the +** Beta Release License Agreement. +** +** GNU Lesser General Public License Usage +** Alternatively, this file may be used under the terms of the GNU Lesser +** General Public License version 2.1 as published by the Free Software +** Foundation and appearing in the file LICENSE.LGPL included in the +** packaging of this file. Please review the following information to +** ensure the GNU Lesser General Public License version 2.1 requirements +** will be met: http://www.gnu.org/licenses/old-licenses/lgpl-2.1.html. +** +** In addition, as a special exception, Nokia gives you certain +** additional rights. These rights are described in the Nokia Qt LGPL +** Exception version 1.0, included in the file LGPL_EXCEPTION.txt in this +** package. +** +** GNU General Public License Usage +** Alternatively, this file may be used under the terms of the GNU +** General Public License version 3.0 as published by the Free Software +** Foundation and appearing in the file LICENSE.GPL included in the +** packaging of this file. Please review the following information to +** ensure the GNU General Public License version 3.0 requirements will be +** met: http://www.gnu.org/copyleft/gpl.html. +** +** If you are unsure which license is appropriate for your use, please +** contact the sales department at qt-sales@nokia.com. +** $QT_END_LICENSE$ +** +****************************************************************************/ + +#include <QtGui> +#include <QtWebKit> + +#include "googlechat.h" + +#define GOOGLECHAT_URL "http://talkgadget.google.com/talkgadget/m" + +GoogleChat::GoogleChat(): QWidget() { + form.setupUi(this); + setFixedSize(320, 480); + + form.userNameEdit->setFocus(); + connect(form.userNameEdit, SIGNAL(textChanged(QString)), SLOT(adjustLoginButton())); + connect(form.userNameEdit, SIGNAL(returnPressed()), SLOT(inputPassword())); + + connect(form.passwordEdit, SIGNAL(textChanged(QString)), SLOT(adjustLoginButton())); + connect(form.passwordEdit, SIGNAL(returnPressed()), SLOT(doLogin())); + + form.loginButton->setEnabled(false); + connect(form.loginButton, SIGNAL(clicked()), SLOT(doLogin())); + + connect(form.webView, SIGNAL(loadFinished(bool)), SLOT(initialPage(bool))); + connect(form.webView, SIGNAL(loadProgress(int)), + form.progressBar, SLOT(setValue(int))); + form.webView->setUrl((QUrl(GOOGLECHAT_URL))); + form.webView->setContextMenuPolicy(Qt::PreventContextMenu); + + showStatus("Wait..."); +} + +void GoogleChat::showStatus(const QString &msg) { + form.statusLabel->setText(msg); + form.stackedWidget->setCurrentIndex(0); +} + +void GoogleChat::showError(const QString &msg) { + form.progressBar->hide(); + showStatus(QString("Error: %1").arg(msg)); +} + +QString GoogleChat::evalJS(const QString &js) { + QWebFrame *frame = form.webView->page()->mainFrame(); + return frame->evaluateJavaScript(js).toString(); +} + +void GoogleChat::adjustLoginButton() { + userName = form.userNameEdit->text(); + password = form.passwordEdit->text(); + bool ok = !userName.isEmpty() && !password.isEmpty(); + form.loginButton->setEnabled(ok); +} + +void GoogleChat::inputPassword() { + if (!form.userNameEdit->text().isEmpty()) + form.passwordEdit->setFocus(); +} + +void GoogleChat::doLogin() { + userName = form.userNameEdit->text(); + password = form.passwordEdit->text(); + bool ok = !userName.isEmpty() && !password.isEmpty(); + if (!ok) + return; + + form.progressBar->setValue(0); + form.progressBar->show(); + connect(form.webView, SIGNAL(loadFinished(bool)), SLOT(loginPage(bool))); + connect(form.webView, SIGNAL(loadProgress(int)), + form.progressBar, SLOT(setValue(int))); + showStatus("Logging in..."); + + QString userEmail = userName + "@gmail.com"; + evalJS(QString("document.getElementById('Email').value = \"%1\";").arg(userEmail)); + evalJS(QString("document.getElementById('Passwd').value = \"%1\";").arg(password)); + evalJS("document.getElementById('gaia_loginform').submit();"); +} + +void GoogleChat::initialPage(bool ok) { + if (ok) { + QString s1 = evalJS("document.getElementById('Email').name"); + QString s2 = evalJS("document.getElementById('Passwd').name"); + QString s3 = evalJS("document.getElementById('gaia_loginform').id"); + if (s1 == "Email" && s2 == "Passwd" && s3 == "gaia_loginform") { + form.stackedWidget->setCurrentIndex(1); + form.webView->disconnect(); + return; + } + } + + showError("SERVICE unavailable."); +} + +void GoogleChat::hideElements() +{ + evalJS("var e = document.getElementsByClassName('footer-footer')[0]; e.parentElement.removeChild(e)"); + evalJS("var e = document.getElementsByClassName('title-bar-bg title-bar')[0]; e.parentElement.removeChild(e)"); + QTimer::singleShot(2000, this, SLOT(hideElements())); +} + +void GoogleChat::loginPage(bool ok) { + QString location = form.webView->url().toString(); + if (!ok) { + if (location.indexOf("CheckCookie")) + return; + showError("Service unavailable"); + } else { + // check for any error message + QString c = evalJS("document.getElementsByClassName('errormsg').length"); + if (c == "0") { + form.stackedWidget->setCurrentIndex(2); + QTimer::singleShot(500, this, SLOT(hideElements())); + return; + } + + QString err = "Unknown login failure."; + if (c == "1") { + err = evalJS("document.getElementsByClassName('errormsg')[0].textContent"); + err = err.simplified(); + } + showError(err); + } +} diff --git a/examples/webkit/googlechat/googlechat.h b/examples/webkit/googlechat/googlechat.h new file mode 100644 index 0000000..c92632c --- /dev/null +++ b/examples/webkit/googlechat/googlechat.h @@ -0,0 +1,71 @@ +/**************************************************************************** +** +** Copyright (C) 2009 Nokia Corporation and/or its subsidiary(-ies). +** Contact: Qt Software Information (qt-info@nokia.com) +** +** This file is part of the examples of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:LGPL$ +** No Commercial Usage +** This file contains pre-release code and may not be distributed. +** You may use this file in accordance with the terms and conditions +** contained in the either Technology Preview License Agreement or the +** Beta Release License Agreement. +** +** GNU Lesser General Public License Usage +** Alternatively, this file may be used under the terms of the GNU Lesser +** General Public License version 2.1 as published by the Free Software +** Foundation and appearing in the file LICENSE.LGPL included in the +** packaging of this file. Please review the following information to +** ensure the GNU Lesser General Public License version 2.1 requirements +** will be met: http://www.gnu.org/licenses/old-licenses/lgpl-2.1.html. +** +** In addition, as a special exception, Nokia gives you certain +** additional rights. These rights are described in the Nokia Qt LGPL +** Exception version 1.0, included in the file LGPL_EXCEPTION.txt in this +** package. +** +** GNU General Public License Usage +** Alternatively, this file may be used under the terms of the GNU +** General Public License version 3.0 as published by the Free Software +** Foundation and appearing in the file LICENSE.GPL included in the +** packaging of this file. Please review the following information to +** ensure the GNU General Public License version 3.0 requirements will be +** met: http://www.gnu.org/copyleft/gpl.html. +** +** If you are unsure which license is appropriate for your use, please +** contact the sales department at qt-sales@nokia.com. +** $QT_END_LICENSE$ +** +****************************************************************************/ + +#include <QWidget> + +#include "ui_form.h" + +class GoogleChat: public QWidget +{ + Q_OBJECT + +public: + GoogleChat(); + +protected: + void showStatus(const QString &msg); + void showError(const QString &msg); + QString evalJS(const QString &js); + +private slots: + + void adjustLoginButton(); + void inputPassword(); + void doLogin(); + void initialPage(bool ok); + void loginPage(bool ok); + void hideElements(); + +private: + Ui::Form form; + QString userName; + QString password; +}; diff --git a/examples/webkit/googlechat/googlechat.pro b/examples/webkit/googlechat/googlechat.pro new file mode 100644 index 0000000..14b7085 --- /dev/null +++ b/examples/webkit/googlechat/googlechat.pro @@ -0,0 +1,11 @@ +QT += webkit +HEADERS = googlechat.h +SOURCES = main.cpp \ + googlechat.cpp +FORMS = form.ui + +# install +target.path = $$[QT_INSTALL_EXAMPLES]/webkit/googlechat +sources.files = $$SOURCES $$HEADERS $$FORMS *.pro +sources.path = $$[QT_INSTALL_EXAMPLES]/webkit/googlechat +INSTALLS += target sources diff --git a/examples/webkit/googlechat/main.cpp b/examples/webkit/googlechat/main.cpp new file mode 100644 index 0000000..26feeea --- /dev/null +++ b/examples/webkit/googlechat/main.cpp @@ -0,0 +1,51 @@ +/**************************************************************************** +** +** Copyright (C) 2009 Nokia Corporation and/or its subsidiary(-ies). +** Contact: Qt Software Information (qt-info@nokia.com) +** +** This file is part of the examples of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:LGPL$ +** No Commercial Usage +** This file contains pre-release code and may not be distributed. +** You may use this file in accordance with the terms and conditions +** contained in the either Technology Preview License Agreement or the +** Beta Release License Agreement. +** +** GNU Lesser General Public License Usage +** Alternatively, this file may be used under the terms of the GNU Lesser +** General Public License version 2.1 as published by the Free Software +** Foundation and appearing in the file LICENSE.LGPL included in the +** packaging of this file. Please review the following information to +** ensure the GNU Lesser General Public License version 2.1 requirements +** will be met: http://www.gnu.org/licenses/old-licenses/lgpl-2.1.html. +** +** In addition, as a special exception, Nokia gives you certain +** additional rights. These rights are described in the Nokia Qt LGPL +** Exception version 1.0, included in the file LGPL_EXCEPTION.txt in this +** package. +** +** GNU General Public License Usage +** Alternatively, this file may be used under the terms of the GNU +** General Public License version 3.0 as published by the Free Software +** Foundation and appearing in the file LICENSE.GPL included in the +** packaging of this file. Please review the following information to +** ensure the GNU General Public License version 3.0 requirements will be +** met: http://www.gnu.org/copyleft/gpl.html. +** +** If you are unsure which license is appropriate for your use, please +** contact the sales department at qt-sales@nokia.com. +** $QT_END_LICENSE$ +** +****************************************************************************/ + +#include <QtGui> +#include "googlechat.h" + +int main(int argc, char * argv[]) +{ + QApplication app(argc, argv); + GoogleChat *chat = new GoogleChat; + chat->show(); + return app.exec(); +} diff --git a/examples/webkit/webkit.pro b/examples/webkit/webkit.pro index 3777eec..225816a 100644 --- a/examples/webkit/webkit.pro +++ b/examples/webkit/webkit.pro @@ -1,6 +1,8 @@ TEMPLATE = subdirs SUBDIRS += formextractor \ - previewer + previewer \ + fancybrowser \ + googlechat # install target.path = $$[QT_INSTALL_EXAMPLES]/webkit |