app/resources/qml/main.qml

447 lines
15 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.Controls 2.12
import QtGraphicalEffects 1.0
import QtQuick.Layouts 1.0
import "."
import "./components"
import "./ProfilesDialog"
import "./SettingsDialog"
import "./components/layout"
import "./MainPage"
//import QtQuick.Layouts 1.11
import de.itsblue.ScStw 2.0
import de.itsblue.ScStw.Styling 2.0
import de.itsblue.ScStw.Styling.Components 1.0
import de.itsblue.ScStwApp 2.0
ApplicationWindow {
visible: true
width: 540
height: 960
title: "ScStwApp"
Page {
id: app
anchors.fill: parent
//set default state to IDLE
state: ScStwRace.IDLE
Rectangle {
id: backgroundRect
anchors.fill: parent
color: appTheme.theme.colors.background
Behavior on color {
ColorAnimation {
duration: 200
}
}
}
ScStw {
id: scStw
}
SpeedBackend {
id: speedBackend
}
Connections {
target: speedBackend.race
onStateChanged: {
var stateString
console.log("race state changed to: " + speedBackend.race.state)
if(speedBackend.race.state != ScStwRace.IDLE) {
//settingsDialog.close()
}
app.state = speedBackend.race.state
}
}
ScStwAppThemeManager {
id: appTheme
property ScStwSetting setting: speedBackend.settings.getSetting(ScStwAppSettings.AppThemeSetting, ScStwAppSettings.KeyLevel)
themeName: setting.value
}
// ---------------
// - Main layout -
// ---------------
GridLayout {
id: mainLayout
anchors.fill: parent
columns: app.landscape() ? 3:1
rows: app.landscape() ? 1:3
TopToolBar {
id: topToolBar
state: app.state
sizeMode: "large"
}
CenterContent {
id: centerContent
state: app.state
Layout.fillWidth: true
Layout.fillHeight: true
}
BottomToolBar {
id: bottomToolBar
sizeMode: "tiny"
}
}
states: [
State {
name: ScStwRace.IDLE
PropertyChanges {
target: topToolBar
sizeMode: "small"
}
PropertyChanges {
target: bottomToolBar
sizeMode: "small"
}
},
State {
name: ScStwRace.PREPAIRING
PropertyChanges {
target: topToolBar
sizeMode: "medium"
}
PropertyChanges {
target: bottomToolBar
sizeMode: "tiny"
}
},
State {
name: ScStwRace.WAITING
PropertyChanges {
target: topToolBar
sizeMode: "medium"
}
PropertyChanges {
target: bottomToolBar
sizeMode: "tiny"
}
},
State {
name: ScStwRace.STARTING
PropertyChanges {
target: topToolBar
sizeMode: "medium"
}
PropertyChanges {
target: bottomToolBar
sizeMode: "tiny"
}
},
State {
name: ScStwRace.RUNNING
PropertyChanges {
target: topToolBar
sizeMode: "medium"
}
PropertyChanges {
target: bottomToolBar
sizeMode: "tiny"
}
},
State {
name: ScStwRace.STOPPED
PropertyChanges {
target: topToolBar
sizeMode: "large"
}
PropertyChanges {
target: bottomToolBar
sizeMode: "tiny"
}
},
State {
name: ScStwRace.INCIDENT
PropertyChanges {
target: topToolBar
sizeMode: "small"
}
PropertyChanges {
target: bottomToolBar
sizeMode: "tiny"
}
}
]
/*------
Popups
------*/
SettingsDialog{
id: settingsDialog
x: centerContent.x + (centerContent.width - width) * 0.5
y: centerContent.y + (centerContent.height - height) * 0.5
width: Math.min(centerContent.width * 0.9, centerContent.height * 0.9)
height: width
}
/*ProfilesDialog {
id: profilesDialog
property int margin: app.landscape() ? app.height * 0.05:app.width * 0.05
x: app.landscape() ? topContainerItm.width + margin:topContainerItm.x + margin
y: !app.landscape() ? topContainerItm.height + margin:topContainerItm.x + margin
width: app.landscape() ? app.width - topContainerItm.width - menu_container.width - margin * 2 : app.width - margin * 2
height: !app.landscape() ? app.height - topContainerItm.height - menu_container.height - margin * 2 : app.height - margin * 2
}*/
/*
states: [
State {
name: "IDLE"
//state for the start page
PropertyChanges {
target: topContainerItm;
anchors.bottomMargin: app.landscape() ? undefined:parent.height * 0.1;
anchors.rightMargin: app.landscape() ? parent.height * 0.05:0
}
PropertyChanges {
target: startButt;
enabled: true;
text: "start";
size: app.landscape() ? parent.width * 0.5:parent.height * 0.5
anchors.bottomMargin: parent.height * 0.5 - startButt.height * 0.5
anchors.rightMargin: parent.width * 0.5 - startButt.width * 0.5
}
PropertyChanges {
target: topLa
text: "click start to start"
}
},
State {
name: "PREPAIRING"
//state for the start sequence
PropertyChanges { target: startButt; enabled: false; text: "starting...";
anchors.rightMargin: app.landscape() ? parent.width * 0.05:parent.width * 0.5 - startButt.width * 0.5 //put the button more to the right to hide the menu (only in landscape mode)
anchors.bottomMargin: app.landscape() ? parent.height * 0.5 - startButt.height * 0.5:parent.height * 0.1 //put the button lower to hide the menu (only in portrait mode)
}
PropertyChanges { target: cancelButt; scale: 1}
PropertyChanges { target: menu_container; }
PropertyChanges {
target: topLa
text: "At your marks"
}
},
State {
name: "WAITING"
PropertyChanges {
target: startButt; enabled: false; text: "waiting...";
anchors.rightMargin: app.landscape() ? parent.width * 0.05:parent.width * 0.5 - startButt.width * 0.5 //put the button more to the right to hide the menu (only in landscape mode)
anchors.bottomMargin: app.landscape() ? parent.height * 0.5 - startButt.height * 0.5:parent.height * 0.1 //put the button lower to hide the menu (only in portrait mode)
}
PropertyChanges { target: cancelButt; scale: 0; enabled: false}
PropertyChanges { target: menu_container; }
PropertyChanges {
target: topLa
implicitText: "Ready"
}
},
State {
name: "STARTING"
//state for the start sequence
PropertyChanges { target: startButt; enabled: false; text: "starting...";
anchors.rightMargin: app.landscape() ? parent.width * 0.05:parent.width * 0.5 - startButt.width * 0.5 //put the button more to the right to hide the menu (only in landscape mode)
anchors.bottomMargin: app.landscape() ? parent.height * 0.5 - startButt.height * 0.5:parent.height * 0.1 //put the button lower to hide the menu (only in portrait mode)
}
PropertyChanges { target: cancelButt; scale: 1}
PropertyChanges { target: menu_container; }
PropertyChanges {
target: topLa
implicitText: "Starting"
}
},
State {
name: "RUNNING"
//state when the timer is running
PropertyChanges { target: startButt; enabled: true;
text: speedBackend.scStwClient.state === ScStwClient.CONNECTED ? "cancel":"stop"
anchors.rightMargin: app.landscape() ? parent.width * 0.05:parent.width * 0.5 - startButt.width * 0.5 //put the button more to the right to hide the menu (only in landscape mode)
anchors.bottomMargin: app.landscape() ? parent.height * 0.5 - startButt.height * 0.5:parent.height * 0.1 //put the button lower to hide the menu (only in portrait mode)
}
PropertyChanges {
target: topLa
implicitText: ""
}
},
State {
name: "STOPPED"
//state when the meassuring is over
PropertyChanges {
target: startButt;
enabled: true; text: "reset";
size: app.landscape() ? parent.height * 0.35:parent.height * 0.2;
anchors.bottomMargin: app.landscape() ? parent.height * 0.5 - startButt.height * 0.5:parent.height * 0.2 - startButt.height * 0.5
anchors.rightMargin: app.landscape() ? parent.height * 0.2 - startButt.height * 0.5:parent.width * 0.5 - startButt.width * 0.5
}
PropertyChanges {
target: topContainerItm;
anchors.rightMargin: app.landscape() ? 0-startButt.width/2:undefined
anchors.bottomMargin: app.landscape() ? undefined:0-startButt.height/2
}
PropertyChanges {
target: topLa
text: ""
}
},
State {
name: "INCIDENT"
//state when the meassuring is over
PropertyChanges {
target: startButt;
enabled: true; text: "reset";
size: app.landscape() ? parent.height * 0.35:parent.height * 0.2;
anchors.bottomMargin: app.landscape() ? parent.height * 0.5 - startButt.height * 0.5:parent.height * 0.2 - startButt.height * 0.5
anchors.rightMargin: app.landscape() ? parent.height * 0.2 - startButt.height * 0.5:parent.width * 0.5 - startButt.width * 0.5
}
PropertyChanges {
target: topContainerItm;
anchors.rightMargin: app.landscape() ? 0-startButt.width/2:undefined
anchors.bottomMargin: app.landscape() ? undefined:0-startButt.height/2
}
PropertyChanges {
target: topLa
text: ""
}
}
]
/*----------------------
Timer animations
----------------------*/
/*transitions: [
Transition {
NumberAnimation { properties: "size,rightMargin,height,width,bottomMargin,font.pixelSize,pixelSize"; easing.type: Easing.InOutQuad; duration: 700 }
},
Transition {
to: "STOPPED"
NumberAnimation { properties: "size,rightMargin,height,width,bottomMargin,font.pixelSize,pixelSize"; easing.type: Easing.InOutQuad; duration: 700 }
},
Transition {
to: "IDLE"
NumberAnimation { properties: "size,rightMargin,height,width,bottomMargin,font.pixelSize,pixelSize"; easing.type: Easing.InOutQuad; duration: 700 }
},
Transition {
from: "STARTING"
to: "RUNNING"
//disable transitions for the RUNNING state
},
Transition {
from: "RUNNING"
to: "WAITING"
//disable transitions for the RUNNING state
}
]*/
/*----------------------
Timer functions
----------------------*/
function landscape(){
return(app.height < app.width)
}
/*----Functions to control the stopwatch----*/
function start(){
var ret = speedBackend.race.start()
if(ret !== 200){
console.log("+ --- error starting race: " + ret)
}
}
function cancel() {
var ret = speedBackend.race.cancel()
if(ret !== 200){
console.log("+ --- error canellingr race: " + ret)
}
}
function stop(){
var ret = speedBackend.race.stop()
if(ret !== 200){
console.log("+ --- error stopping race: " + ret)
}
}
function reset(){
var ret = speedBackend.race.reset()
if(ret !== 200){
console.log("+ --- error resetting race: " + ret)
}
}
}
}