449 lines
13 KiB
QML
449 lines
13 KiB
QML
/*
|
|
Speed Climbing Stopwatch - Simple Stopwatch for Climbers
|
|
Copyright (C) 2018 Itsblue Development - Dorian Zeder
|
|
|
|
This program is free software: you can redistribute it and/or modify
|
|
it under the terms of the GNU Affero General Public License as published
|
|
by the Free Software Foundation, version 3 of the License.
|
|
|
|
This program is distributed in the hope that it will be useful,
|
|
but WITHOUT ANY WARRANTY; without even the implied warranty of
|
|
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
|
GNU Affero General Public License for more details.
|
|
|
|
You should have received a copy of the GNU Affero General Public License
|
|
along with this program. If not, see <https://www.gnu.org/licenses/>.
|
|
*/
|
|
|
|
import QtQuick 2.9
|
|
import QtMultimedia 5.8
|
|
import QtQuick.Window 2.2
|
|
import QtQuick.Controls 2.2
|
|
import QtQuick.Layouts 1.3
|
|
import QtGraphicalEffects 1.0
|
|
import com.itsblue.speedclimbingstopwatch 1.0
|
|
import "./components"
|
|
|
|
|
|
Popup {
|
|
id: root
|
|
|
|
modal: true
|
|
dim: false
|
|
|
|
opacity: 0
|
|
|
|
enter: Transition {
|
|
NumberAnimation { properties: "opacity"; to: 1; duration: 300; easing.type: Easing.InOutQuad }
|
|
NumberAnimation { properties: "scale"; from: 0.9; to: 1; duration: 300; easing.type: Easing.InOutQuad }
|
|
}
|
|
|
|
exit: Transition {
|
|
NumberAnimation { properties: "opacity"; to: 0; duration: 300; easing.type: Easing.InOutQuad }
|
|
NumberAnimation { properties: "scale"; from: 1; to: 0.9; duration: 300; easing.type: Easing.InOutQuad }
|
|
}
|
|
|
|
background: Item {
|
|
|
|
RectangularGlow {
|
|
id: backgroundEffect
|
|
glowRadius: 7
|
|
spread: 0.02
|
|
color: "black"
|
|
opacity: 0.18
|
|
anchors.fill: backgroundRect
|
|
cornerRadius: backgroundRect.radius
|
|
scale: 1
|
|
}
|
|
|
|
Rectangle {
|
|
id: backgroundRect
|
|
anchors.fill: parent
|
|
radius: width * 0.1
|
|
color: appTheme.style.viewColor
|
|
}
|
|
}
|
|
|
|
|
|
StackView {
|
|
id: profiles_stack
|
|
property int text_pixelSize: headlineUnderline.width * 0.08
|
|
initialItem: profileListComp
|
|
width: headlineUnderline.width
|
|
|
|
anchors {
|
|
top: topContainerItm.bottom
|
|
left: parent.left
|
|
leftMargin: ( parent.width - headlineUnderline.width ) / 2
|
|
//topMargin: headlineUnderline.anchors.topMargin * 1.2
|
|
bottom: parent.bottom
|
|
bottomMargin: topContainerItm.height
|
|
}
|
|
|
|
Behavior on opacity {
|
|
NumberAnimation {duration: 200}
|
|
}
|
|
|
|
/*-----List of all profiles-----*/
|
|
Component {
|
|
id: profileListComp
|
|
|
|
|
|
ListView {
|
|
id: profileList
|
|
|
|
property string title: "profiles"
|
|
property string secondButt: "add"
|
|
property var listData: speedBackend.getAthletes()
|
|
|
|
function loadData() {
|
|
profileList.enabled = false
|
|
listData = speedBackend.getAthletes()
|
|
profileList.enabled = true
|
|
}
|
|
|
|
model: listData.length
|
|
|
|
Connections {
|
|
target: root
|
|
onOpened: {
|
|
profileList.loadData()
|
|
}
|
|
}
|
|
|
|
Label {
|
|
opacity: profileList.count <= 0 ? 1:0
|
|
text: "add a profile by clicking +"
|
|
anchors.centerIn: parent
|
|
font.pixelSize: parent.width*0.06
|
|
Behavior on opacity {
|
|
NumberAnimation {
|
|
duration: 200
|
|
easing.type: Easing.InOutQuad
|
|
}
|
|
}
|
|
}
|
|
|
|
delegate: SwipeDelegate {
|
|
id: swipeDelegate
|
|
|
|
property bool active: profileList.listData[index]["active"]
|
|
|
|
text: profileList.listData[index]["fullName"]
|
|
width: profileList.width - (swipeDelegate.x)
|
|
|
|
|
|
|
|
font.pixelSize: profiles_stack.text_pixelSize
|
|
|
|
function remove() {
|
|
removeAnim.start()
|
|
}
|
|
|
|
onClicked: {
|
|
if(speedBackend.selectAthlete(profileList.listData[index]["userName"])){
|
|
profileList.loadData()
|
|
}
|
|
}
|
|
|
|
background: Rectangle {
|
|
color: Qt.darker( pressed ? Qt.darker("white", 1.1):"white", swipeDelegate.active ? 1.1:0 )
|
|
|
|
}
|
|
|
|
Rectangle {
|
|
color: "grey"
|
|
height: 1
|
|
width: parent.width * 0.9
|
|
visible: index > 0
|
|
anchors {
|
|
horizontalCenter: parent.horizontalCenter
|
|
top: parent.top
|
|
}
|
|
}
|
|
|
|
NumberAnimation {
|
|
id: removeAnim
|
|
target: swipeDelegate
|
|
property: "height"
|
|
to: 0
|
|
easing.type: Easing.InOutQuad
|
|
onStopped: profileModel.model.remove(index)
|
|
}
|
|
|
|
swipe.transition: Transition {
|
|
SmoothedAnimation { velocity: 3; easing.type: Easing.InOutCubic }
|
|
}
|
|
|
|
swipe.left: Row {
|
|
anchors.left: parent.left
|
|
height: parent.height
|
|
|
|
Label {
|
|
id: deleteLabel
|
|
text: qsTr("Delete")
|
|
color: "white"
|
|
verticalAlignment: Label.AlignVCenter
|
|
padding: 12
|
|
height: parent.height
|
|
|
|
SwipeDelegate.onClicked: {
|
|
if(speedBackend.deleteAthlete(profileList.listData[index]["userName"])){
|
|
profileList.loadData()
|
|
}
|
|
}
|
|
|
|
background: Rectangle {
|
|
color: deleteLabel.SwipeDelegate.pressed ? Qt.darker("tomato", 1.1) : "tomato"
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
ScrollIndicator.vertical: ScrollIndicator { }
|
|
}
|
|
|
|
}
|
|
|
|
/*-----Option to add a profile-----*/
|
|
Component {
|
|
id: addProfileComp
|
|
Column {
|
|
property string title: "add profile"
|
|
property string secondButt: "ok"
|
|
property string newProfileName: ""
|
|
|
|
Connections {
|
|
target: head_add
|
|
|
|
enabled: true
|
|
|
|
onClicked: {
|
|
if(speedBackend.createAthlete(userNameTf.text, fullNameTf.text)){
|
|
profiles_stack.pop()
|
|
}
|
|
}
|
|
}
|
|
|
|
TextField {
|
|
id: fullNameTf
|
|
width: parent.width
|
|
placeholderText: "full name"
|
|
onTextChanged: {
|
|
parent.newProfileName = text
|
|
}
|
|
Keys.onReturnPressed: {
|
|
}
|
|
}
|
|
TextField {
|
|
id: userNameTf
|
|
width: parent.width
|
|
placeholderText: "username"
|
|
onTextChanged: {
|
|
parent.newProfileName = text
|
|
}
|
|
Keys.onReturnPressed: {
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
/*-----Custom animations-----*/
|
|
|
|
pushEnter: Transition {
|
|
NumberAnimation {
|
|
property: "opacity"
|
|
from: 0
|
|
to: 1
|
|
duration: 200
|
|
easing.type: Easing.InOutQuad
|
|
}
|
|
}
|
|
pushExit: Transition {
|
|
NumberAnimation {
|
|
property: "opacity"
|
|
from: 1
|
|
to: 0
|
|
duration: 200
|
|
easing.type: Easing.InOutQuad
|
|
}
|
|
}
|
|
|
|
popExit: Transition {
|
|
NumberAnimation {
|
|
property: "opacity"
|
|
from: 1
|
|
to: 0
|
|
duration: 200
|
|
easing.type: Easing.InOutQuad
|
|
}
|
|
}
|
|
popEnter: Transition {
|
|
NumberAnimation {
|
|
property: "opacity"
|
|
from: 0
|
|
to: 1
|
|
duration: 200
|
|
easing.type: Easing.InOutQuad
|
|
}
|
|
}
|
|
}
|
|
|
|
Item {
|
|
id: topContainerItm
|
|
|
|
anchors {
|
|
top: parent.top
|
|
horizontalCenter: parent.horizontalCenter
|
|
}
|
|
|
|
height: parent.height * 0.15
|
|
width: backgroundRect.width
|
|
|
|
RectangularGlow {
|
|
id: headerUnderlineEffect
|
|
glowRadius: 7
|
|
spread: 0.02
|
|
color: "black"
|
|
opacity: 0.18
|
|
anchors.fill: headlineUnderline
|
|
scale: 1
|
|
}
|
|
|
|
Rectangle {
|
|
id: headlineUnderline
|
|
height: 1
|
|
width: parent.width
|
|
color: "grey"
|
|
anchors {
|
|
bottom: parent.bottom
|
|
left: parent.left
|
|
right: parent.right
|
|
}
|
|
}
|
|
|
|
Canvas {
|
|
|
|
id: headerBackground
|
|
|
|
anchors.fill: parent
|
|
|
|
property color color: appTheme.style.viewColor
|
|
|
|
onPaint: {
|
|
var ctx = getContext("2d");
|
|
|
|
ctx.beginPath();
|
|
ctx.fillStyle = headerBackground.color
|
|
ctx.moveTo(0, 0);
|
|
//ctx.arc(centreX, centreY, root.width / 2, 1 * Math.PI, 2*Math.PI, false);
|
|
ctx.lineTo(width, 0);
|
|
ctx.lineTo(width, height);
|
|
ctx.lineTo(0, height);
|
|
ctx.lineTo(0, 0);
|
|
ctx.fill();
|
|
}
|
|
}
|
|
|
|
Label {
|
|
id: head_text
|
|
|
|
anchors {
|
|
centerIn: parent
|
|
}
|
|
|
|
width: parent.width * 0.8
|
|
height: parent.height * 0.8
|
|
|
|
fontSizeMode: Text.Fit
|
|
font.pixelSize: headlineUnderline.width * 0.1
|
|
minimumPixelSize: 0
|
|
|
|
verticalAlignment: Text.AlignVCenter
|
|
horizontalAlignment: Text.AlignHCenter
|
|
|
|
text: profiles_stack.currentItem.title
|
|
|
|
}
|
|
|
|
}
|
|
|
|
FancyButton {
|
|
id: head_back
|
|
|
|
anchors {
|
|
left: parent.left
|
|
leftMargin: -parent.width * 0.03
|
|
top:parent.top
|
|
topMargin: -parent.height * 0.03
|
|
}
|
|
|
|
height: parent.height * 0.1
|
|
width: height
|
|
|
|
glowOpacity: Math.pow( root.opacity, 100 )
|
|
|
|
backgroundColor: appTheme.style.buttonColor
|
|
|
|
image: "qrc:/graphics/icons/back_black.png"
|
|
|
|
onClicked: profiles_stack.depth > 1 ? profiles_stack.pop():root.close()
|
|
|
|
Behavior on opacity {
|
|
NumberAnimation {
|
|
duration: 100
|
|
}
|
|
}
|
|
}
|
|
|
|
FancyButton {
|
|
id: head_add
|
|
|
|
anchors {
|
|
right: parent.right
|
|
rightMargin: -parent.width * 0.03
|
|
top:parent.top
|
|
topMargin: -parent.height * 0.03
|
|
}
|
|
height: parent.height * 0.1
|
|
width:height
|
|
|
|
glowOpacity: Math.pow( root.opacity, 100 )
|
|
|
|
backgroundColor: appTheme.style.buttonColor
|
|
|
|
image: "qrc:/graphics/icons/ok_black.png"
|
|
imageScale: profiles_stack.currentItem.secondButt === "ok" ? 1:0
|
|
|
|
Label {
|
|
anchors {
|
|
top: parent.top
|
|
topMargin: parent.height/2 - height*0.55
|
|
left: parent.left
|
|
leftMargin: parent.width/2 - width/2
|
|
}
|
|
opacity: profiles_stack.currentItem.secondButt === "add" ? 1:0
|
|
text: "+"
|
|
font.pixelSize: parent.height
|
|
}
|
|
|
|
onClicked: {
|
|
switch(profiles_stack.currentItem.secondButt){
|
|
case "add":
|
|
profiles_stack.push(addProfileComp)
|
|
break
|
|
case "ok":
|
|
//speedBackend.createAthlete(fullNameTf.text, userNameTf.text)
|
|
}
|
|
|
|
}
|
|
|
|
Behavior on opacity {
|
|
NumberAnimation {
|
|
duration: 100
|
|
}
|
|
}
|
|
}
|
|
|
|
}
|