New Blinds Raise Interval Selector Component for ListViews

Outsourced Styles for RadioButton and TextField

pokerth_qml-client.pro

@@ -17,11 +17,12 @@ RESOURCES += src/gui/qml/qml.qrc
 
 # Additional import path used to resolve QML modules in Qt Creator's code model
 QML_IMPORT_PATH = \
-    src/gui/qml/views/ \
     src/gui/qml/views/startview/ \
     src/gui/qml/views/createlocalgameview/ \
-    src/gui/qml/components \
+    src/gui/qml/views/ \
-    src/gui/qml/js
+    src/gui/qml/components/styles/ \
+    src/gui/qml/components/ \
+    src/gui/qml/js/
 
 # Default rules for deployment.
 include(src/gui/qml/deployment.pri)
@@ -52,7 +53,9 @@ HEADERS += \
     src/core/common/qttools/qttoolswrapper.h \
     src/core/common/qttoolsinterface.h \
     src/gui/qml/cpp/qmlwrapper.h \
-    src/gui/qml/cpp/qmlconfig.h
+    src/gui/qml/cpp/qmlconfig.h \
+    src/gui/qml/cpp/startviewimpl.h \
+    src/gui/qml/cpp/createlocalgameviewimpl.h
 
 
 SOURCES += \
@@ -62,7 +65,9 @@ SOURCES += \
     src/core/common/qttools/qttoolswrapper.cpp \
     src/core/common/qttoolsinterface.cpp \
     src/gui/qml/cpp/qmlwrapper.cpp \
-    src/gui/qml/cpp/qmlconfig.cpp
+    src/gui/qml/cpp/qmlconfig.cpp \
+    src/gui/qml/cpp/createlocalgameviewimpl.cpp \
+    src/gui/qml/cpp/startviewimpl.cpp
 
 LIBS += \
     -lpokerth_lib \

src/gui/qml/components/MyBlindsRaiseIntervalSelector.qml

@@ -3,6 +3,7 @@ import QtQuick.Layouts 1.1
 import QtQuick.Controls 1.2
 import QtQuick.Controls.Styles 1.2
 import "../js/colors.js" as GlobalColors
+import "styles/"
 
 Rectangle {
     id: selector
@@ -11,22 +12,19 @@ Rectangle {
     anchors.fill: parent
     color: "#88000000" //dark transparent background
 
-    property string titleString
+    property string titleString: ""
-    property string prefix
+    property string raiseOnHandsType: ""
-    property int minValue
+    property string raiseOnHandsInterval: ""
-    property int maxValue
+    property string raiseOnMinutesInterval: ""
-    property string returnValue
+    property int raiseOnHandsMinimum: 1
-    property int initialTextFieldValue
+    property int raiseOnHandsMaximum: 99
-    property int initialSliderValue
+    property int raiseOnMinutesMinimum: 1
+    property int raiseOnMinutesMaximum: 99
 
-    function show(title, min, max, value, pref) {
+    function show(type, hands, minutes) {
-        titleString = title;
+        raiseOnHandsType = type;
-        initialTextFieldValue = parseInt(value);
+        raiseOnHandsInterval = hands;
-        initialSliderValue = parseInt(value)
+        raiseOnMinutesInterval = minutes;
-        minValue = min;
-        maxValue = max;
-        prefix = pref;
-        returnValue = value; // <-- initial the returnValue with the preselection to prevent a NULL return when pressing Cancel
         visible = true;
     }
 
@@ -34,8 +32,10 @@ Rectangle {
         visible = false;
     }
 
-    function selected(newSelection) {
+    function selected(handsType, handsInterval, minutesInterval) {
-        returnValue = newSelection;
+        raiseOnHandsType = handsType;
+        raiseOnHandsInterval = handsInterval;
+        raiseOnMinutesInterval = minutesInterval;
         visible = false;
     }
 
@@ -54,165 +54,159 @@ Rectangle {
         y: Math.round(parent.height*0.5 - height*0.5)
         radius: Math.round(parent.height*0.01)
 
-        ColumnLayout {
+        Rectangle {
-            id: content
+            id: selectionBoxcontent
             anchors.fill: parent
-            spacing: Math.round(selectionBox.height*0.06)
+            anchors.margins: Math.round(appWindow.height*0.05)
-            Text {
-                id: titleText
-                font.pixelSize: Math.round(selectionBox.height*0.10)
-                font.bold: true
-                text: titleString
-                anchors.left: parent.left
-                anchors.top: parent.top
-                anchors.leftMargin: 30
-                anchors.topMargin: 10
-                Layout.preferredHeight: contentHeight
-            }
-            TextField{
-                id: textField
-                anchors.left: parent.left
-                anchors.right: parent.right
-                anchors.rightMargin: 50
-                //make space for the prefix
-                property int prefixIndent: Math.round(selectionBox.height*0.03)
-                anchors.leftMargin: 50 + prefixIndent
-//                validator: IntValidator{bottom: minValue; top: maxValue;} TODO: test validator in later QtVersions > 5.5.0
-                focus: true
-                text: initialTextFieldValue
-                function correctValue() {
-                    if(text > maxValue) text = maxValue
-                    else if(text < minValue) text = minValue
-                    else {
-                        //remove leading "0000"
-                        var temp = parseInt(text)
-                        text = temp
-                    }
-                }
-                onFocusChanged: correctValue()
-                onEditingFinished: correctValue()
 
-                style: TextFieldStyle {
+            ColumnLayout {
-                    textColor: "black"
+                id: content
-                    font.pixelSize: Math.round(selectionBox.height*0.10)
+                anchors.fill: parent
-                    background: Item { //bottom line with colored focus indicator
+                spacing: appWindow.columnLayoutSpacing
-                        implicitHeight: Math.round(selectionBox.height*0.12)
+                Text {
-                        implicitWidth: parent.width
+                    id: titleText
-                        Text { //prefix
+                    font.pixelSize: appWindow.selectorTitleFontSize
-                            color: "black"
+                    font.bold: true
-                            font.pixelSize: Math.round(selectionBox.height*0.10)
+                    text: qsTr("Raise blinds")
-                            text: prefix
+                    anchors.left: parent.left
-                            anchors.left: parent.left
+                    anchors.top: parent.top
-                            anchors.leftMargin: -textField.prefixIndent
+                    anchors.topMargin: -Math.round(appWindow.height*0.035)
-                            anchors.bottom: parent.bottom
+                    Layout.preferredHeight: contentHeight
-                            anchors.bottomMargin: Math.round(selectionBox.height*0.008)
+                }
+                ExclusiveGroup { id: raiseTypeGroup }
 
+                RowLayout { //Hands interval section
+                    spacing: appWindow.rowLayoutSpacing
+
+                    RadioButton {
+                        id: radioBtnRaiseOnHands
+                        checked: raiseOnHandsType ? true : false
+                        exclusiveGroup: raiseTypeGroup
+                        style: MyRadioButtonStyle {
+                            myRadioBtn: radioBtnRaiseOnHands;
+                            labelString: "Every"
                         }
-                        Rectangle {
+                        onCheckedChanged: checked ? textFieldHandsInterval.focus = true : textFieldHandsInterval.focus = false
-                            color: GlobalColors.accentColor
+                    }
-                            opacity: textField.activeFocus ? 0.8 : 0
+
-                            anchors.bottom: parent.bottom
+                    TextField {
-                            anchors.left: parent.left
+                        id: textFieldHandsInterval
-                            anchors.leftMargin: -textField.prefixIndent
+                        width: appWindow.textFieldFontSize*2
-                            width: parent.width + textField.prefixIndent
+                        //                validator: IntValidator{bottom: minValue; top: maxValue;} TODO: test validator in later QtVersions > 5.5.0
-                            height: Math.round(selectionBox.height*0.005)
+                        text: raiseOnHandsInterval
+                        focus: raiseOnHandsType ? true : false
+                        function correctValue() {
+                            if(text != "") {
+                                if(parseInt(text) > raiseOnHandsMaximum) text = raiseOnHandsMaximum
+                                else if(parseInt(text) < raiseOnHandsMinimum) text = raiseOnHandsMinimum
+                                else {
+                                    //remove leading "0000"
+                                    var temp = parseInt(text)
+                                    text = temp
+                                }
+                            }
                         }
-                        Rectangle {
+                        onFocusChanged: {
-                            color: "black"
+                            correctValue()
-                            opacity: textField.activeFocus ? 0.6 : 0.4
+                            focus ? radioBtnRaiseOnHands.checked = true : radioBtnRaiseOnHands.checked = false
-                            anchors.bottom: parent.bottom
+                        }
-                            anchors.bottomMargin: Math.round(selectionBox.height*0.005)
+                        onEditingFinished: correctValue()
-                            anchors.left: parent.left
+
-                            anchors.leftMargin: - textField.prefixIndent
+                        style: MyTextFieldStyle {
-                            width: parent.width + textField.prefixIndent
+                            myTextField: textFieldHandsInterval
-                            height: Math.round(selectionBox.height*0.005)
                         }
                     }
-                }
+                    Text {
-            }
+                        id: onHandsString
-            Slider {
+                        font.pixelSize: appWindow.selectorValueFontSize
-                id: slider
+                        text: qsTr("hands")
-                width: parent.width
-                anchors.left: parent.left
-                anchors.right: parent.right
-                anchors.rightMargin: 50
-                anchors.leftMargin: 50
-                maximumValue: maxValue
-                minimumValue: minValue
-                //don't initialize the slider value to avoid the stepSize kills the preselection Value
-                //because of the binding to the TextField value
-                stepSize: minimumValue * 10
-                on__HandlePosChanged: {
-                    if (slider.value > minimumValue && slider.value < maximumValue)
-                        textField.text = slider.value - minimumValue
-                    else
-                        textField.text = slider.value
-                }
-                style: SliderStyle {
-                    handle: Rectangle {
-                        width: Math.round(selectionBox.height*0.12)
-                        height: width
-                        radius: width
-                        antialiasing: true
-                        color: Qt.lighter(GlobalColors.accentColor, 1.2)
                     }
-                    groove: Item {
+                }
-                        implicitHeight: Math.round(selectionBox.height*0.04)
+                RowLayout { //Minutes interval section
-                        implicitWidth: slider.width
+                    spacing: appWindow.rowLayoutSpacing
-                        Rectangle {
+                    RadioButton {
-                            height: Math.round(selectionBox.height*0.03)
+                        id: radioBtnRaiseOnMinutes
-                            width: slider.width
+                        checked: raiseOnHandsType ? false : true
-                            anchors.verticalCenter: parent.verticalCenter
+                        exclusiveGroup: raiseTypeGroup
-                            color: "#666"
+                        style: MyRadioButtonStyle {
-                            Rectangle {
+                            myRadioBtn: radioBtnRaiseOnMinutes;
-                                antialiasing: true
+                            labelString: "Every"
-                                radius: 1
+                        }
-                                color: GlobalColors.accentColor
+                        onCheckedChanged: checked ? textFieldMinutesInterval.focus = true : textFieldMinutesInterval.focus = false
-                                height: parent.height
+                    }
-                                width: parent.width * control.value / control.maximumValue
+
+                    TextField {
+                        id: textFieldMinutesInterval
+      //                validator: IntValidator{bottom: minValue; top: maxValue;} TODO: test validator in later QtVersions > 5.5.0
+                        text: raiseOnMinutesInterval
+                        width: appWindow.textFieldFontSize*2
+                        focus: raiseOnHandsType ? false : true
+                        function correctValue() {
+                            if(text != "") {
+                                if(parseInt(text) > raiseOnMinutesMaximum) text = raiseOnMinutesMaximum
+                                else if(parseInt(text) < raiseOnMinutesMinimum) text = raiseOnMinutesMinimum
+                                else {
+                                    //remove leading "0000"
+                                    var temp = parseInt(text)
+                                    text = temp
+                                }
+                            }
+                        }
+                        onFocusChanged: {
+                            correctValue();
+                            focus ? radioBtnRaiseOnMinutes.checked = true : radioBtnRaiseOnMinutes.checked = false
+                        }
+                        onEditingFinished: correctValue()
+
+                        style: MyTextFieldStyle {
+                            myTextField: textFieldMinutesInterval
+                        }
+                    }
+                    Text {
+                        id: onMinutesString
+                        font.pixelSize: appWindow.selectorValueFontSize
+                        text: qsTr("minutes")
+                    }
+                }
+
+                RowLayout { //bottom button line
+                    width: parent.width
+                    anchors.right: parent.right
+                    anchors.bottom: parent.bottom
+                    anchors.bottomMargin: -Math.round(appWindow.height*0.017)
+                    spacing: okButton.contentWidth
+                    Layout.preferredHeight: cancelButton.contentHeight
+
+                    Text {
+                        id: cancelButton
+                        font.pixelSize: appWindow.selectorButtonFontSize
+                        font.bold: true
+                        text: qsTr("CANCEL")
+                        Layout.preferredHeight: contentHeight
+                        MouseArea {
+                            id: cancelMouse
+                            anchors.fill: parent
+                            onClicked: {
+                                reject()
                             }
                         }
                     }
-                }
+                    Text {
-
+                        id: okButton
-            }
+                        font.pixelSize: appWindow.selectorButtonFontSize
-
+                        font.bold: true
-            RowLayout { //bottom button line
+                        color: GlobalColors.accentColor
-                width: parent.width
+                        text: qsTr("OK")
-                anchors.right: parent.right
+                        Layout.preferredHeight: contentHeight
-                anchors.bottom: parent.bottom
+                        MouseArea {
-                anchors.rightMargin: 30
+                            id: okMouse
-                anchors.bottomMargin: 20
+                            anchors.fill: parent
-                spacing: okButton.contentWidth
+                            onClicked: {
-                Layout.preferredHeight: cancelButton.contentHeight
+                                textFieldHandsInterval.correctValue();
-
+                                textFieldMinutesInterval.correctValue();
-                Text {
+                                //return values
-                    id: cancelButton
+                                selected(radioBtnRaiseOnHands.checked ? "1": "0", textFieldHandsInterval.text, textFieldMinutesInterval.text);
-                    font.pixelSize: Math.round(selectionBox.height*0.07)
+                            }
-                    font.bold: true
-                    text: qsTr("CANCEL")
-                    Layout.preferredHeight: contentHeight
-                    MouseArea {
-                        id: cancelMouse
-                        anchors.fill: parent
-                        onClicked: {
-                            reject()
-                        }
-                    }
-                }
-                Text {
-                    id: okButton
-                    font.pixelSize: Math.round(selectionBox.height*0.07)
-                    font.bold: true
-                    color: GlobalColors.accentColor
-                    text: qsTr("OK")
-                    Layout.preferredHeight: contentHeight
-                    MouseArea {
-                        id: okMouse
-                        anchors.fill: parent
-                        onClicked: {
-                            textField.correctValue();
-                            selected(textField.text);
                         }
                     }
                 }
@@ -220,4 +214,3 @@ Rectangle {
         }
     }
 }
-

src/gui/qml/components/MyComboBoxSelector.qml

@@ -3,6 +3,7 @@ import QtQuick.Layouts 1.1
 import QtQuick.Controls 1.2
 import QtQuick.Controls.Styles 1.2
 import "../js/colors.js" as GlobalColors
+import "styles"
 
 Rectangle {
     id: selector
@@ -20,6 +21,7 @@ Rectangle {
     function show(title, list, vl, valueIndex) {
         titleString = title;
         valueFromParent = vl;
+        returnValue = vl; // <-- initial the returnValue with the preselection to prevent a NULL return when pressing Cancel
         valueIsIndex = valueIndex;
         //fill the model
         selectionModel.clear();
@@ -64,7 +66,7 @@ Rectangle {
             spacing: Math.round(selectionBox.height*0.06)
             Text {
                 id: titleText
-                font.pixelSize: Math.round(selectionBox.height*0.10)
+                font.pixelSize: appWindow.selectorTitleFontSize
                 font.bold: true
                 text: titleString
                 anchors.left: parent.left
@@ -81,7 +83,7 @@ Rectangle {
                 Layout.fillHeight: true
                 ListView {
                     anchors.fill: parent
-                    spacing: Math.round(selectionBox.height*0.05)
+                    spacing: Math.round(appWindow.height*0.05)
                     model: selectionModel
                     delegate: RadioButton {
                         id: radioBtn
@@ -90,38 +92,16 @@ Rectangle {
                         onClicked: {
                             selector.selected(valueString, index)
                         }
-                        style: RadioButtonStyle {
+                        style: MyRadioButtonStyle {
-                            indicator: Rectangle {
+                            myRadioBtn: radioBtn
-                                implicitWidth: Math.round(selectionBox.height*0.05)
+                            labelString: valueString
-                                implicitHeight: Math.round(selectionBox.height*0.05)
-                                radius: Math.round(selectionBox.height*0.03)
-                                border.color: radioBtn.checked ? GlobalColors.accentColor : "grey"
-                                border.width: Math.round(selectionBox.height*0.005)
-                                Rectangle {
-                                    anchors.fill: parent
-                                    visible: control.checked
-                                    color: radioBtn.checked ? GlobalColors.accentColor : "grey"
-                                    radius: Math.round(selectionBox.height*0.03)
-                                    anchors.margins: Math.round(selectionBox.height*0.01)
-                                }
-                            }
-                            label: Text {
-                                anchors.left: parent.left
-                                anchors.leftMargin: 10
-                                font.pixelSize: Math.round(selectionBox.height*0.05)
-                                text: valueString
-                                MouseArea {
-                                    anchors.fill: parent
-                                    onClicked: radioBtn.clicked()
-                                }
-                            }
                         }
                     }
                 }
             }
             Text {
                 id: cancelButton
-                font.pixelSize: Math.round(selectionBox.height*0.07)
+                font.pixelSize: appWindow.selectorButtonFontSize
                 font.bold: true
                 text: qsTr("CANCEL")
                 anchors.right: parent.right

src/gui/qml/components/MyListViewDelegateFactory.qml

@@ -11,9 +11,11 @@ Item {
     property int myListViewsWidth: 0
     property var myListViewRoot
     property var myListViewModel
+
     property var componentMap: {
         "ComboBox": myComboBox,
-        "SpinBox": mySpinBox
+        "SpinBox": mySpinBox,
+        "BlindsRaiseInterval": myBlindsRaiseInterval
     }
     width: myListViewsWidth
 
@@ -22,7 +24,6 @@ Item {
         function setSourceComponent(comp) {
             sourceComponent = comp;
         }
-
     }
 
     // ComboBox
@@ -31,7 +32,7 @@ Item {
         Rectangle {
             MyComboBoxSelector {
                 id: myComboBoxSelector
-                parent: myListViewRoot
+                parent: myListViewRoot // this needs to be parent to display the selector over the whole ListView
             }
 
             id: myComboBoxContent
@@ -45,7 +46,7 @@ Item {
                 anchors.margins: 30
                 y: myValue != "" ? Math.round(parent.height*0.5 - contentHeight*0.9) : Math.round(parent.height*0.5 - contentHeight*0.5)
                 color: "black"
-                font.pixelSize: Math.round(myListViewsHeight*0.06)
+                font.pixelSize: appWindow.listViewTitleFontSize
                 text: myTitle
             }
             Text {
@@ -54,7 +55,7 @@ Item {
                 anchors.margins: 30
                 y: Math.round(parent.height*0.5 + contentHeight*0.15)
                 color: "grey"
-                font.pixelSize: myValue != "" ? Math.round(myListViewsHeight*0.05) : 0
+                font.pixelSize: myValue != "" ? appWindow.listViewValueFontSize : 0
                 //setup value from Index if necessary
                 text: myValueIsIndex ? myValuesList.get(parseInt(myValue)).value : myValue
             }
@@ -96,7 +97,7 @@ Item {
         Rectangle {
             MySpinBoxSelector {
                 id: mySpinBoxSelector
-                parent: myListViewRoot
+                parent: myListViewRoot // this needs to be parent to display the selector over the whole ListView
             }
 
             id: mySpinBoxContent
@@ -110,7 +111,7 @@ Item {
                 anchors.margins: 30
                 y: myValue != "" ? Math.round(parent.height*0.5 - contentHeight*0.9) : Math.round(parent.height*0.5 - contentHeight*0.5)
                 color: "black"
-                font.pixelSize: Math.round(myListViewsHeight*0.06)
+                font.pixelSize: appWindow.listViewTitleFontSize
                 text: myTitle
             }
             Text {
@@ -119,8 +120,8 @@ Item {
                 anchors.margins: 30
                 y: Math.round(parent.height*0.5 + contentHeight*0.15)
                 color: "grey"
-                font.pixelSize: myValue != "" ? Math.round(myListViewsHeight*0.05) : 0
+                font.pixelSize: myValue != "" ? appWindow.listViewValueFontSize : 0
-                text: myValue
+                text: myPrefix+myValue
             }
             Rectangle {
                 anchors.horizontalCenter: parent.horizontalCenter
@@ -154,6 +155,84 @@ Item {
         }
     }
 
+    // BlindsRaiseInterval
+    Component {
+        id: myBlindsRaiseInterval
+        Rectangle {
+            MyBlindsRaiseIntervalSelector {
+                id: myBlindsRaiseIntervalSelector
+                parent: myListViewRoot // this needs to be parent to display the selector over the whole ListView
+            }
+
+            id: myBlindsRaiseIntervalContent
+            property int modelIndex: model.index
+            color: mouse.pressed ? "#11000000" : "white"
+            width: root.width
+            height: Math.round(blindsRaiseIntevalTitle.contentHeight*2.1 + blindsRaiseIntevalValue.contentHeight*1.0)
+            Text {
+                id: blindsRaiseIntevalTitle
+                anchors.left: parent.left
+                anchors.margins: 30
+                y: myValue != "" ? Math.round(parent.height*0.5 - contentHeight*0.9) : Math.round(parent.height*0.5 - contentHeight*0.5)
+                color: "black"
+                font.pixelSize: appWindow.listViewTitleFontSize
+                text: myTitle
+            }
+            Text {
+                id: blindsRaiseIntevalValue
+                anchors.left: parent.left
+                anchors.margins: 30
+                y: Math.round(parent.height*0.5 + contentHeight*0.15)
+                color: "grey"
+                font.pixelSize: myValue != "" ? appWindow.listViewValueFontSize : 0
+                text: ""
+
+                function buildTextString() {
+                    if(myRaiseOnHandsType == "1") text = qsTr("Raise blinds every")+" "+myRaiseOnHandsInterval+" "+qsTr("hands");
+                    else text = qsTr("Raise blinds every")+" "+myRaiseOnMinutesInterval+" "+qsTr("minutes");
+                }
+
+                Component.onCompleted: {
+                    buildTextString();
+                }
+            }
+            Rectangle {
+                anchors.horizontalCenter: parent.horizontalCenter
+                anchors.bottom: parent.bottom
+                width: parent.width - 30
+                height: 1
+                color: "lightgrey"
+            }
+            MouseArea {
+                id: mouse
+                anchors.fill: parent
+                onClicked: {
+                    //call selector overlay and set inital values
+                    myBlindsRaiseIntervalSelector.show(myRaiseOnHandsType, myRaiseOnHandsInterval, myRaiseOnMinutesInterval)
+                }
+                Connections {
+                    target: myBlindsRaiseIntervalSelector
+                    onVisibleChanged: {
+                        if(!myBlindsRaiseIntervalSelector.visible) {
+                            //call update the currentItem with selection from the comboBox selector
+                            myListViewModel.setProperty(myBlindsRaiseIntervalContent.modelIndex, "myRaiseOnHandsType", myBlindsRaiseIntervalSelector.raiseOnHandsType);
+                            myListViewModel.setProperty(myBlindsRaiseIntervalContent.modelIndex, "myRaiseOnHandsInterval", myBlindsRaiseIntervalSelector.raiseOnHandsInterval);
+                            myListViewModel.setProperty(myBlindsRaiseIntervalContent.modelIndex, "myRaiseOnMinutesInterval", myBlindsRaiseIntervalSelector.raiseOnMinutesInterval);
+                            //here we also need to trigger the textStringBuild from the model again
+                            blindsRaiseIntevalValue.buildTextString();
+                        }
+                    }
+                }
+            }
+
+            Component.onCompleted: {
+                //after building the delegate content set the final height to the root item
+                root.height = Qt.binding(function() { return height })
+            }
+        }
+    }
+
+
     Component.onCompleted: {
         listViewFactoryLoader.setSourceComponent(componentMap[myType])
     }

src/gui/qml/components/MySpinBoxSelector.qml

@@ -3,6 +3,7 @@ import QtQuick.Layouts 1.1
 import QtQuick.Controls 1.2
 import QtQuick.Controls.Styles 1.2
 import "../js/colors.js" as GlobalColors
+import "styles/"
 
 Rectangle {
     id: selector
@@ -11,21 +12,22 @@ Rectangle {
     anchors.fill: parent
     color: "#88000000" //dark transparent background
 
-    property string titleString
+    property string titleString: ""
-    property string prefix
+    property string prefix: ""
-    property int minValue
+    property int minValue: 0
-    property int maxValue
+    property int maxValue: 0
-    property string returnValue
+    property string returnValue: ""
-    property int initialTextFieldValue
+    property int initialTextFieldValue: 0
-    property int initialSliderValue
+    property int initialSliderValue: 0
 
     function show(title, min, max, value, pref) {
         titleString = title;
         initialTextFieldValue = parseInt(value);
-        initialSliderValue = parseInt(value)
+        initialSliderValue = parseInt(value);
         minValue = min;
         maxValue = max;
-        prefix = pref
+        prefix = pref;
+        returnValue = value; // <-- initial the returnValue with the preselection to prevent a NULL return when pressing Cancel
         visible = true;
     }
 
@@ -59,7 +61,7 @@ Rectangle {
             spacing: Math.round(selectionBox.height*0.06)
             Text {
                 id: titleText
-                font.pixelSize: Math.round(selectionBox.height*0.10)
+                font.pixelSize: appWindow.fontSizeH1
                 font.bold: true
                 text: titleString
                 anchors.left: parent.left
@@ -68,65 +70,33 @@ Rectangle {
                 anchors.topMargin: 10
                 Layout.preferredHeight: contentHeight
             }
-            TextField{
+            TextField {
                 id: textField
                 anchors.left: parent.left
                 anchors.right: parent.right
                 anchors.rightMargin: 50
                 //make space for the prefix
-                property int prefixIndent: Math.round(selectionBox.height*0.04)
+                anchors.leftMargin: 50 + Math.round(appWindow.height*0.03)
-                anchors.leftMargin: 50 + prefixIndent
 //                validator: IntValidator{bottom: minValue; top: maxValue;} TODO: test validator in later QtVersions > 5.5.0
-                focus: true
                 text: initialTextFieldValue
+                focus: true
                 function correctValue() {
-                    if(text > maxValue) text = maxValue
+                     if(text != "") {
-                    else if(text < minValue) text = minValue
+                        if(parseInt(text) > maxValue) text = maxValue
-                    else {
+                        else if(parseInt(text) < minValue) text = minValue
-                        //remove leading "0000"
+                        else {
-                        var temp = parseInt(text)
+                            //remove leading "0000"
-                        text = temp
+                            var temp = parseInt(text)
+                            text = temp
+                        }
                     }
                 }
                 onFocusChanged: correctValue()
                 onEditingFinished: correctValue()
 
-                style: TextFieldStyle {
+                style: MyTextFieldStyle {
-                    textColor: "black"
+                    prefix: selector.prefix
-                    font.pixelSize: Math.round(selectionBox.height*0.10)
+                    myTextField: textField
-                    background: Item { //bottom line with colored focus indicator
-                        implicitHeight: Math.round(selectionBox.height*0.12)
-                        implicitWidth: parent.width
-                        Text { //prefix
-                            color: "black"
-                            font.pixelSize: Math.round(selectionBox.height*0.10)
-                            text: prefix
-                            anchors.left: parent.left
-                            anchors.leftMargin: -textField.prefixIndent
-                            anchors.bottom: parent.bottom
-                            anchors.bottomMargin: Math.round(selectionBox.height*0.005)
-
-                        }
-                        Rectangle {
-                            color: GlobalColors.accentColor
-                            opacity: textField.activeFocus ? 0.8 : 0
-                            anchors.bottom: parent.bottom
-                            anchors.left: parent.left
-                            anchors.leftMargin: -textField.prefixIndent
-                            width: parent.width + textField.prefixIndent
-                            height: Math.round(selectionBox.height*0.005)
-                        }
-                        Rectangle {
-                            color: "black"
-                            opacity: textField.activeFocus ? 0.6 : 0.4
-                            anchors.bottom: parent.bottom
-                            anchors.bottomMargin: Math.round(selectionBox.height*0.005)
-                            anchors.left: parent.left
-                            anchors.leftMargin: - textField.prefixIndent
-                            width: parent.width + textField.prefixIndent
-                            height: Math.round(selectionBox.height*0.005)
-                        }
-                    }
                 }
             }
             Slider {
@@ -138,7 +108,8 @@ Rectangle {
                 anchors.leftMargin: 50
                 maximumValue: maxValue
                 minimumValue: minValue
-                value: initialSliderValue
+                //don't initialize the slider value to avoid the stepSize kills the preselection Value
+                //because of the binding to the TextField value
                 stepSize: minimumValue * 10
                 on__HandlePosChanged: {
                     if (slider.value > minimumValue && slider.value < maximumValue)
@@ -186,7 +157,7 @@ Rectangle {
 
                 Text {
                     id: cancelButton
-                    font.pixelSize: Math.round(selectionBox.height*0.07)
+                    font.pixelSize: appWindow.selectorButtonFontSize
                     font.bold: true
                     text: qsTr("CANCEL")
                     Layout.preferredHeight: contentHeight
@@ -200,7 +171,7 @@ Rectangle {
                 }
                 Text {
                     id: okButton
-                    font.pixelSize: Math.round(selectionBox.height*0.07)
+                    font.pixelSize: appWindow.selectorButtonFontSize
                     font.bold: true
                     color: GlobalColors.accentColor
                     text: qsTr("OK")

src/gui/qml/components/MyTextFieldStyle.qml

@@ -1,46 +0,0 @@
-import QtQuick 2.4
-import QtQuick.Controls.Styles 1.2
-Component {
-    id: myTextFieldStyle
-    property string prefix: ""
-    property int prefixIndent: Math.round(appWindow.height*0.03)
-
-    TextFieldStyle {
-        textColor: "black"
-        font.pixelSize: Math.round(appWindow.height*0.10)
-        background: Item { //bottom line with colored focus indicator
-            implicitHeight: Math.round(appWindow.height*0.12)
-            implicitWidth: parent.width
-            Text { //prefix
-                visible: prefix != "" ? true : false
-                color: "black"
-                font.pixelSize: Math.round(appWindow.height*0.10)
-                text: prefix
-                anchors.left: parent.left
-                anchors.leftMargin: -prefixIndent
-                anchors.bottom: parent.bottom
-                anchors.bottomMargin: Math.round(appWindow.height*0.008)
-
-            }
-            Rectangle {
-                color: GlobalColors.accentColor
-                opacity: parent.activeFocus ? 0.8 : 0
-                anchors.bottom: parent.bottom
-                anchors.left: parent.left
-                anchors.leftMargin: prefixIndent
-                width: parent.width + prefixIndent
-                height: Math.round(appWindow.height*0.005)
-            }
-            Rectangle {
-                color: "black"
-                opacity: parent.activeFocus ? 0.6 : 0.4
-                anchors.bottom: parent.bottom
-                anchors.bottomMargin: Math.round(appWindow.height*0.005)
-                anchors.left: parent.left
-                anchors.leftMargin: - prefixIndent
-                width: parent.width + prefixIndent
-                height: Math.round(appWindow.height*0.005)
-            }
-        }
-    }
-}

src/gui/qml/components/styles/MyRadioButtonStyle.qml

@@ -4,6 +4,7 @@ import "../../js/colors.js" as GlobalColors
 
 RadioButtonStyle {
     property var myRadioBtn
+    property string labelString: ""
     indicator: Rectangle {
         implicitWidth: Math.round(appWindow.height*0.05)
         implicitHeight: Math.round(appWindow.height*0.05)
@@ -21,12 +22,12 @@ RadioButtonStyle {
     label: Text {
         anchors.left: parent.left
         anchors.leftMargin: 10
-        font.pixelSize: Math.round(appWindow.height*0.05)
+        font.pixelSize: appWindow.radioButtonLabelFontSize
-        text: valueString
+        text: labelString
 
         MouseArea {
             anchors.fill: parent
-            onClicked: radioBtn.clicked()
+            onClicked: myRadioBtn.clicked()
         }
     }
 }

src/gui/qml/components/styles/MyTextFieldStyle.qml

@@ -1,7 +1,46 @@
-import QtQuick 2.0
+import QtQuick 2.4
+import QtQuick.Controls.Styles 1.2
+import "../../js/colors.js" as GlobalColors
 
-Rectangle {
+TextFieldStyle {
-    width: 100
+    property string prefix: ""
-    height: 62
+    property int prefixIndent: prefix != "" ? appWindow.textFieldFontSize*0.33 : 0
+    property var myTextField
+
+    textColor: "black"
+    font.pixelSize: appWindow.textFieldFontSize
+    background: Item { //bottom line with colored focus indicator
+        implicitHeight: appWindow.textFieldFontSize + appWindow.textFieldFontSize*0.25
+        implicitWidth: myTextField.width
+        Text { //prefix
+            visible: prefix != "" ? true : false
+            color: "black"
+            font.pixelSize: appWindow.textFieldFontSize
+            text: prefix
+            anchors.left: parent.left
+            anchors.leftMargin: -prefixIndent
+            anchors.bottom: parent.bottom
+            anchors.bottomMargin: Math.round(appWindow.height*0.008)
+
+        }
+        Rectangle {
+            color: GlobalColors.accentColor
+            opacity: myTextField.activeFocus ? 0.8 : 0
+            anchors.bottom: parent.bottom
+            anchors.left: parent.left
+            anchors.leftMargin: - prefixIndent
+            width: myTextField.width + prefixIndent
+            height: Math.round(appWindow.height*0.005)
+        }
+        Rectangle {
+            color: "black"
+            opacity: myTextField.activeFocus ? 0.6 : 0.4
+            anchors.bottom: parent.bottom
+            anchors.bottomMargin: Math.round(appWindow.height*0.005)
+            anchors.left: parent.left
+            anchors.leftMargin: - prefixIndent
+            width: myTextField.width + prefixIndent
+            height: Math.round(appWindow.height*0.005)
+        }
+    }
 }
-

src/gui/qml/cpp/createlocalgameviewimpl.cpp

@@ -1,6 +1,6 @@
-#include "createlocalgameimpl.h"
+#include "createlocalgameviewimpl.h"
 
-CreateLocalGameImpl::CreateLocalGameImpl(QObject *parent) : QObject(parent)
+CreateLocalGameViewImpl::CreateLocalGameViewImpl(QObject *parent) : QObject(parent)
 {
 
 }

src/gui/qml/cpp/createlocalgameviewimpl.h

@@ -1,16 +1,16 @@
-#ifndef CREATELOCALGAMEIMPL_H
+#ifndef CREATELOCALGAMEVIEWIMPL_H
-#define CREATELOCALGAMEIMPL_H
+#define CREATELOCALGAMEVIEWIMPL_H
+#include <QtCore>
 
-
+class CreateLocalGameViewImpl : public QObject
-class CreateLocalGameImpl : public QObject
 {
     Q_OBJECT
 public:
-    explicit CreateLocalGameImpl(QObject *parent = 0);
+    explicit CreateLocalGameViewImpl(QObject *parent = 0);
 
 signals:
 
 public slots:
 };
 
-#endif // CREATELOCALGAMEIMPL_H
+#endif // CREATELOCALGAMEVIEWIMPL_H

src/gui/qml/cpp/qmlwrapper.cpp

@@ -6,6 +6,8 @@
 
 #include "qmlconfig.h"
 #include "qmlwrapper.h"
+#include "startviewimpl.h"
+#include "createlocalgameviewimpl.h"
 
 QmlWrapper::QmlWrapper(boost::shared_ptr<ConfigFile> c)
     :QObject(), myConfig(c)
@@ -13,8 +15,14 @@ QmlWrapper::QmlWrapper(boost::shared_ptr<ConfigFile> c)
     myEngine.reset(new QQmlApplicationEngine);
     myQmlConfig = new QmlConfig(myConfig); //need to be a default pointer because QML doesnt support shared_ptr()
 
-//    Add c++ content here
+    //TODO create Session and Log here
+
+    myStartViewImpl = new StartViewImpl(this);
+    myCreateLocalGameViewImpl = new CreateLocalGameViewImpl(this);
+
+    //Add c++ content to QML here
     myEngine->rootContext()->setContextProperty("Config", myQmlConfig);
+    myEngine->rootContext()->setContextProperty("StartViewImpl", myStartViewImpl);
 
     myEngine->load(QUrl(QStringLiteral("qrc:/main.qml")));
 }
@@ -29,3 +37,5 @@ QmlWrapper::QmlWrapper(const QmlWrapper&)
 {
 
 }
+
+

src/gui/qml/cpp/qmlwrapper.h

@@ -3,9 +3,11 @@
 #include <QtCore>
 #include <boost/shared_ptr.hpp>
 
+class QQmlApplicationEngine;
 class ConfigFile;
 class QmlConfig;
-class QQmlApplicationEngine;
+class CreateLocalGameViewImpl;
+class StartViewImpl;
 
 class QmlWrapper: public QObject
 {
@@ -21,6 +23,8 @@ private:
     boost::shared_ptr<QQmlApplicationEngine> myEngine;
     boost::shared_ptr<ConfigFile> myConfig;
     QmlConfig *myQmlConfig;
+    CreateLocalGameViewImpl *myCreateLocalGameViewImpl;
+    StartViewImpl *myStartViewImpl;
 };
 
 #endif // QMLWRAPPER_H

src/gui/qml/cpp/startviewimpl.cpp

@@ -1,7 +1,12 @@
-#include "startimpl.h"
+#include "startviewimpl.h"
 
-StartImpl::StartImpl(QObject *parent) : QObject(parent)
+StartViewImpl::StartViewImpl(QObject *parent) : QObject(parent)
 {
 
 }
 
+void StartViewImpl::startLocalGame()
+{
+    qDebug("startLocalGame im c++");
+}
+

src/gui/qml/cpp/startviewimpl.h

@@ -1,16 +1,18 @@
-#ifndef STARTIMPL_H
+#ifndef STARTVIEWIMPL_H
-#define STARTIMPL_H
+#define STARTVIEWIMPL_H
+#include <QtCore>
 
-
+class StartViewImpl : public QObject
-class StartImpl : public QObject
 {
     Q_OBJECT
 public:
-    explicit StartImpl(QObject *parent = 0);
+    explicit StartViewImpl(QObject *parent = 0);
 
 signals:
 
 public slots:
+    Q_INVOKABLE void startLocalGame();
+
 };
 
-#endif // STARTIMPL_H
+#endif // STARTVIEWIMPL_H

src/gui/qml/main.qml

@@ -15,6 +15,25 @@ ApplicationWindow {
     minimumHeight: 240
     visible: true
 
+    property int fontSizeH1: Math.round(height*0.10)
+    property int fontSizeH2: Math.round(height*0.09)
+    property int fontSizeH3: Math.round(height*0.08)
+    property int fontSizeH4: Math.round(height*0.07)
+    property int fontSizeH5: Math.round(height*0.06)
+    property int fontSizeH6: Math.round(height*0.05)
+
+    property int listViewTitleFontSize: fontSizeH5
+    property int listViewValueFontSize: fontSizeH6
+    property int selectorTitleFontSize: fontSizeH2
+    property int selectorValueFontSize: fontSizeH5
+    property int selectorButtonFontSize: fontSizeH6
+    property int radioButtonLabelFontSize: fontSizeH5
+    property int textFieldFontSize: fontSizeH2
+
+    property int rowLayoutSpacing: Math.round(appWindow.height*0.06)
+    property int columnLayoutSpacing: Math.round(appWindow.height*0.06)
+
+
     toolBar: Rectangle {
         id: toolbar
         opacity: 1
@@ -40,9 +59,11 @@ ApplicationWindow {
             height: parent.height
             width: parent.height
             radius: 4
-            color: leftMouse.pressed ? Qt.rgba(0,0,0,0.3) : "transparent"
+            color: toolBarLeftButtonMouse.pressed ? Qt.rgba(0,0,0,0.3) : "transparent"
             property string myIconName: ""
             property string myIconPath: ""
+            signal clicked();
+
             function setIconPath(name) {
                 switch(name) {
                     case "PokerTH": myIconPath = "images/pokerth-logo.svg"
@@ -53,7 +74,7 @@ ApplicationWindow {
                 }
             }
             onMyIconNameChanged: setIconPath(myIconName)
-
+            onClicked: stackView.pop()
 
             Image {
                 sourceSize.height: parent.height*0.8
@@ -62,10 +83,10 @@ ApplicationWindow {
                 source: parent.myIconPath
             }
             MouseArea {
-                id: leftMouse
+                id: toolBarLeftButtonMouse
                 anchors.fill: parent
                 anchors.margins: -10
-                onClicked: stackView.pop()
+                onClicked: parent.clicked()
             }
         }
 
@@ -87,10 +108,11 @@ ApplicationWindow {
             height: parent.height
             width: parent.height
             radius: 4
-            color: rightMouse.pressed ? Qt.rgba(0,0,0,0.3) : "transparent"
+            color: toolBarRightButtonMouse.pressed ? Qt.rgba(0,0,0,0.3) : "transparent"
-
             property string myIconName: ""
             property string myIconPath: ""
+            signal clicked();
+
             function setIconPath(name) {
                 switch(name) {
                     case "accept": myIconPath = "images/check.svg"
@@ -109,10 +131,10 @@ ApplicationWindow {
                 source: parent.myIconPath
             }
             MouseArea {
-                id: rightMouse
+                id: toolBarRightButtonMouse
                 anchors.fill: parent
                 anchors.margins: -10
-                onClicked: stackView.pop()
+                onClicked: parent.clicked();
             }
         }
     }

src/gui/qml/qml.qrc

@@ -15,5 +15,9 @@
         <file>components/MyComboBoxSelector.qml</file>
         <file>js/colors.js</file>
         <file>components/MySpinBoxSelector.qml</file>
+        <file>views/gametableview/GameTableView.qml</file>
+        <file>components/MyBlindsRaiseIntervalSelector.qml</file>
+        <file>components/styles/MyTextFieldStyle.qml</file>
+        <file>components/styles/MyRadioButtonStyle.qml</file>
     </qresource>
 </RCC>

src/gui/qml/views/createlocalgameview/CreateLocalGameView.qml

@@ -47,35 +47,21 @@ Rectangle {
                     myValue: ""
                 }
                 ListElement {
-                    myId: "comboBox_Blinds"
+                    myId: "spinBox_StartBlind"
-                    myTitle: qsTr("Blinds")
+                    myTitle: qsTr("Start blind")
-                    myType: "ComboBox"
+                    myType: "SpinBox"
-                    myValuesList: [
+                    myMaxValue: 20000
-                        ListElement { value: qsTr("Use saved blinds settings") },
+                    myMinValue: 5
-                        ListElement { value: qsTr("Change blinds settings ...") }
+                    myPrefix: "$"
-                    ]
                     myValue: ""
-                    myValueIsIndex: true
+                }                
-                }
                 ListElement {
-                    myId: "comboBox_GameSpeed"
+                    myId: "comboBox_BlindsRaiseInterval"
-                    myTitle: qsTr("Game speed")
+                    myTitle: qsTr("Blinds raise interval")
-                    myType: "ComboBox"
+                    myType: "BlindsRaiseInterval"
-                    myValuesList: [
+                    myRaiseOnHandsType: "" //if false it is raise on minutes type
-                        ListElement { value: "11" },
+                    myRaiseOnHandsInterval: ""
-                        ListElement { value: "10" },
+                    myRaiseOnMinutesInterval: ""
-                        ListElement { value: "9" },
-                        ListElement { value: "8" },
-                        ListElement { value: "7" },
-                        ListElement { value: "6" },
-                        ListElement { value: "5" },
-                        ListElement { value: "4" },
-                        ListElement { value: "3" },
-                        ListElement { value: "2" },
-                        ListElement { value: "1" }
-                    ]
-                    myValue: ""
-                    myValueIsIndex: false
                 }
                 ListElement {
                     myId: "comboBox_GameSpeed"
@@ -99,10 +85,13 @@ Rectangle {
                 }
 
                 Component.onCompleted: {
+                    //set Config Values from config file
                     createLocalGameViewModel.setProperty(0, "myValue", Config.readConfigInt("NumberOfPlayers"));
                     createLocalGameViewModel.setProperty(1, "myValue", Config.readConfigInt("StartCash"));
-                    createLocalGameViewModel.setProperty(2, "myValue", "0");
+                    createLocalGameViewModel.setProperty(2, "myValue", Config.readConfigInt("FirstSmallBlind"));
-                    createLocalGameViewModel.setProperty(3, "myValue", Config.readConfigInt("GameSpeed"));
+                    createLocalGameViewModel.setProperty(3, "myRaiseOnHandsType", Config.readConfigInt("RaiseBlindsAtHands"));
+                    createLocalGameViewModel.setProperty(3, "myRaiseOnHandsInterval", Config.readConfigInt("RaiseSmallBlindEveryHands"));
+                    createLocalGameViewModel.setProperty(3, "myRaiseOnMinutesInterval", Config.readConfigInt("RaiseSmallBlindEveryMinutes"));
                     createLocalGameViewModel.setProperty(4, "myValue", Config.readConfigInt("GameSpeed"));
                 }
             }
@@ -111,20 +100,41 @@ Rectangle {
                 myListViewsWidth: createLocalGameViewList.width
                 myListViewRoot: createLocalGameViewRoot
                 myListViewModel: createLocalGameViewModel
+
+//                TODO --> Blindsfelder immer mit anzeigen spezialfeld manual blinds settings direkt hier inline implementieren
+
+
+            }
+        }
+    }
+
+    function getListElementValueString(elementName) {
+        //read model and check for the elementName
+        for (var i = 0; i < createLocalGameViewModel.count; i++ ) {
+            if(createLocalGameViewModel.get(i).myId == elementName) {
+                return createLocalGameViewModel.get(i).myValue;
             }
         }
     }
 
     function setupToolBar() {
+        toolbar.visible = true;
         toolBarRightButton.myIconName = "accept";
         toolBarLeftButton.myIconName = "back";
+        //send start signal to the session
+        toolBarRightButton.clicked.connect(StartViewImpl.startLocalGame);
+    }
+
+    function clearToolBar() {
+        toolBarRightButton.clicked.disconnect(StartViewImpl.startLocalGame);
     }
 
     Component.onCompleted: {
         setupToolBar();
     }
     onVisibleChanged: {
-        if(visible) setupToolBar()
+        if(visible) setupToolBar();
+        else clearToolBar();
     }
 
 }

src/gui/qml/views/gametableview/GameTableView.qml

@@ -1,7 +1,22 @@
-import QtQuick 2.0
+import QtQuick 2.4
+import QtQuick.Controls 1.2
+import QtQuick.Controls.Styles 1.2
+import QtQuick.Layouts 1.1
+import "../../components"
 
 Rectangle {
-    width: 100
+    id: gameTableViewRoot
-    height: 62
+    width: parent.width
-}
+    height: parent.height
 
+    function setupToolBar() {
+        toolbar.visible = false;
+    }
+
+    Component.onCompleted: {
+        setupToolBar();
+    }
+    onVisibleChanged: {
+        if(visible) setupToolBar()
+    }
+}

src/gui/qml/views/startview/StartButton.qml

@@ -7,7 +7,6 @@ Button {
 
     width: parent.width*0.50
     height: parent.height/7
-    onClicked: stackView.push(Qt.resolvedUrl(page))
     anchors.horizontalCenter: parent.horizontalCenter
 
     Component {

src/gui/qml/views/startview/StartView.qml

@@ -3,6 +3,7 @@ import QtQuick.Controls 1.2
 import QtQuick.Layouts 1.1
 
 Item {
+    id: startView
     Image {
         id: background
         source: "../../images/startViewBackground.png"
@@ -14,6 +15,8 @@ Item {
         StartButton {
             text: qsTr("Local game")
             page: "../createlocalgameview/CreateLocalGameView.qml"
+            onClicked: stackView.push(Qt.resolvedUrl(page))
+            //TODO ^^ --> gleich GameTable anzeigen wenn "ShowGameSettingsDialogOnNewGame" == true
         }
 
         StartButton {
@@ -28,6 +31,7 @@ Item {
     }
 
     function setupToolBar() {
+        toolbar.visible = true;
         toolBarRightButton.myIconName = "more";
         toolBarLeftButton.myIconName = "PokerTH";
     }