587 lines
17 KiB
QML
587 lines
17 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}
|
|
}
|
|
|
|
Connections {
|
|
target: root
|
|
onOpened: {
|
|
profiles_stack.openAthletes()
|
|
}
|
|
}
|
|
|
|
onCurrentItemChanged: {
|
|
currentItem.opened()
|
|
}
|
|
|
|
function openAthletes() {
|
|
var athsComp = profileListComp.createObject(null, {})
|
|
profiles_stack.push(athsComp)
|
|
}
|
|
|
|
function openResults( userName ){
|
|
var resComp = resultViewComp.createObject(null, {"userName": userName})
|
|
profiles_stack.push(resComp)
|
|
}
|
|
|
|
/*-----List of all profiles-----*/
|
|
Component {
|
|
id: profileListComp
|
|
|
|
RemoteDataListView {
|
|
id: profileList
|
|
|
|
property string title: "profiles"
|
|
property string secondButt: "add"
|
|
|
|
signal opened()
|
|
|
|
onOpened: {
|
|
loadData()
|
|
}
|
|
|
|
loadData: function () {
|
|
status = 905
|
|
listData = {}
|
|
listData = speedBackend.getAthletes()
|
|
status = listData.lenght !== false ? 200:0
|
|
}
|
|
|
|
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: {
|
|
profiles_stack.openResults(profileList.listData[index]["userName"])
|
|
}
|
|
|
|
background: Rectangle {
|
|
color: Qt.darker( pressed ? Qt.darker("white", 1.1):"white", swipeDelegate.active ? 1.1:0 )
|
|
}
|
|
|
|
CheckBox {
|
|
id: control
|
|
|
|
anchors {
|
|
verticalCenter: parent.verticalCenter
|
|
right: parent.right
|
|
}
|
|
|
|
height: parent.height * 0.6
|
|
|
|
checked: swipeDelegate.active
|
|
|
|
onCheckedChanged: {
|
|
if(checked && !swipeDelegate.active && speedBackend.selectAthlete(profileList.listData[index]["userName"])){
|
|
profileList.loadData()
|
|
}
|
|
}
|
|
|
|
indicator: Rectangle {
|
|
implicitWidth: 26
|
|
implicitHeight: 26
|
|
|
|
height: parent.height
|
|
width: height
|
|
|
|
x: control.leftPadding
|
|
y: parent.height / 2 - height / 2
|
|
|
|
radius: width * 0.2
|
|
border.color: control.down ? "#17a81a" : "#21be2b"
|
|
|
|
Rectangle {
|
|
width: parent.width * 0.65
|
|
height: width
|
|
anchors.centerIn: parent
|
|
radius: width * 0.2
|
|
color: control.down ? "#17a81a" : "#21be2b"
|
|
visible: control.checked
|
|
}
|
|
}
|
|
}
|
|
|
|
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: {
|
|
profileList.status = 905
|
|
if(speedBackend.deleteAthlete(profileList.listData[index]["userName"])){
|
|
profileList.loadData()
|
|
return
|
|
}
|
|
profileList.status = 200
|
|
}
|
|
|
|
background: Rectangle {
|
|
color: deleteLabel.SwipeDelegate.pressed ? Qt.darker("tomato", 1.1) : "tomato"
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
/*-----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.get(profiles_stack.depth - 2 ).loadData()
|
|
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: {
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
// --- Result View ---
|
|
Component {
|
|
id: resultViewComp
|
|
RemoteDataListView {
|
|
id: resultView
|
|
|
|
property string userName
|
|
property string title: userName
|
|
property string secondButt: "none"
|
|
|
|
signal opened()
|
|
|
|
onOpened: {
|
|
loadData()
|
|
}
|
|
|
|
loadData: function () {
|
|
status = 905
|
|
listData = {}
|
|
listData = speedBackend.getResults(userName)
|
|
status = listData.lenght !== false ? 200:0
|
|
}
|
|
|
|
delegate: ItemDelegate {
|
|
id: resultDel
|
|
|
|
width: parent.width
|
|
|
|
font.pixelSize: profiles_stack.text_pixelSize
|
|
|
|
text: "result: " + (listData[index]["result"] / 1000).toFixed(3) + " sec \nreaction time: " + listData[index]["reactionTime"].toFixed(0) + " ms"
|
|
|
|
Rectangle {
|
|
color: "grey"
|
|
height: 1
|
|
width: parent.width * 0.9
|
|
visible: index > 0
|
|
anchors {
|
|
horizontalCenter: parent.horizontalCenter
|
|
top: parent.top
|
|
}
|
|
}
|
|
|
|
Label {
|
|
anchors.top: parent.top
|
|
anchors.left: parent.left
|
|
|
|
font.pixelSize: 10
|
|
|
|
text: " " + getText()
|
|
|
|
function getText(){
|
|
var date = new Date(listData[index]["timestamp"]*1000).toLocaleDateString(Qt.locale("de_DE"))
|
|
return date
|
|
console.log(date)
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
/*-----Custom animations-----*/
|
|
pushEnter: Transition {
|
|
NumberAnimation {
|
|
property: "opacity"
|
|
from: 0
|
|
to: 1
|
|
duration: 300
|
|
easing.type: Easing.InOutQuad
|
|
}
|
|
|
|
NumberAnimation {
|
|
property: "x"
|
|
from: width * 0.1
|
|
to: 0
|
|
duration: 300
|
|
}
|
|
}
|
|
pushExit: Transition {
|
|
NumberAnimation {
|
|
property: "opacity"
|
|
from: 1
|
|
to: 0
|
|
duration: 300
|
|
easing.type: Easing.InOutQuad
|
|
}
|
|
|
|
NumberAnimation {
|
|
property: "x"
|
|
to: -width * 0.1
|
|
from: 0
|
|
duration: 300
|
|
}
|
|
}
|
|
|
|
popExit: Transition {
|
|
NumberAnimation {
|
|
property: "opacity"
|
|
from: 1
|
|
to: 0
|
|
duration: 300
|
|
easing.type: Easing.InOutQuad
|
|
}
|
|
NumberAnimation {
|
|
property: "x"
|
|
to: width * 0.1
|
|
from: 0
|
|
duration: 300
|
|
}
|
|
}
|
|
popEnter: Transition {
|
|
NumberAnimation {
|
|
property: "opacity"
|
|
from: 0
|
|
to: 1
|
|
duration: 300
|
|
easing.type: Easing.InOutQuad
|
|
}
|
|
NumberAnimation {
|
|
property: "x"
|
|
from: -width * 0.1
|
|
to: 0
|
|
duration: 300
|
|
}
|
|
}
|
|
}
|
|
|
|
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");
|
|
|
|
var topMargin = backgroundRect.radius
|
|
|
|
|
|
ctx.beginPath();
|
|
ctx.fillStyle = headerBackground.color
|
|
ctx.moveTo(width, topMargin);
|
|
//
|
|
//ctx.lineTo(width, topMargin);
|
|
ctx.lineTo(width, height);
|
|
ctx.lineTo(0, height);
|
|
ctx.lineTo(0, topMargin)
|
|
|
|
ctx.arc(topMargin, topMargin, topMargin, 1 * Math.PI, 1.5*Math.PI, false);
|
|
ctx.lineTo(width-topMargin, 0)
|
|
ctx.arc(width-topMargin, topMargin, topMargin, 1.5*Math.PI, 0, false)
|
|
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
|
|
|
|
opacity: profiles_stack.currentItem.secondButt !== "none" ? 1:0
|
|
|
|
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
|
|
}
|
|
}
|
|
}
|
|
|
|
}
|