Index: sources/gui/qml/pages/endtreatment/rinseback/EndTreatmentRinsebackComplete.qml
===================================================================
diff -u -r88563177f10f20ced98750b2e40036201728131d -r8a5dbf556a66524fbe4b60ac1573182a0bd27617
--- sources/gui/qml/pages/endtreatment/rinseback/EndTreatmentRinsebackComplete.qml	(.../EndTreatmentRinsebackComplete.qml)	(revision 88563177f10f20ced98750b2e40036201728131d)
+++ sources/gui/qml/pages/endtreatment/rinseback/EndTreatmentRinsebackComplete.qml	(.../EndTreatmentRinsebackComplete.qml)	(revision 8a5dbf556a66524fbe4b60ac1573182a0bd27617)
@@ -20,165 +20,51 @@
 //  Qml imports
 import "qrc:/globals"
 import "qrc:/components"
+import "qrc:/pages/endtreatment"
 
 /*!
  * \brief   the end treatment rinseback complete screen
  */
-ScreenItem { id: _root
+EndTreatmentBase { id: _root
     objectName: "_EndTreatmentRinsebackComplete"
 
-    property alias  reasonText  : _notification.text
     signal additionalClicked    ()
     signal treatmentBackClicked ()
-    signal confirmClicked       ()
     signal treatmentEndClicked  ()
 
-    QtObject { id: _private
-        property int    sectionSpace        : 30
-        property int    sectionWidth        : _root.width  * 2/3 - sectionSpace * 1.5
-        property int    sectionHeight       : _root.width  * 1/3 - sectionSpace * 1.5
-        property bool   treatmentIncomplete : vTreatmentTime.time_Total > 0
-    }
+    title.text              : qsTr("Rinseback Complete")
+    instructionBased        : true
+    header.confirmVisible   : vTreatmentTime        .time_IsLeft
+    hasTimeout              : vTreatmentRinseback   .timeoutTotal
+    timeoutValue            : vTreatmentRinseback   .timeoutCountDown * 60
 
-    Text { id: _title
-        anchors {
-            top: parent.top
-            topMargin: 65
-            horizontalCenter: parent.horizontalCenter
-        }
-        color: Colors.white
-        text: qsTr("Rinseback Complete")
-        font.pixelSize: Fonts.fontPixelTitle
+    footer {
+        width       : parent.width
+        height      : Variables.touchRectHeight
     }
 
-    TouchRect { id : _touchAdditional
-        width   : 155
-        height  : 50
-        text    {
-            text: qsTr("ADDITIONAL")
-            font.bold   : true
-            font.pixelSize: Fonts.fontPixelConfirm
-        }
-        anchors {
-            verticalCenter  : _title.verticalCenter
-            right           : parent.right
-            rightMargin     : 30
-        }
-        onClicked   : additionalClicked()
-    }
+    FooterStatic {
+        childrenWidth   : 300
+        anchors.fill    : footer
+        children        : [
+            TouchRect { id : _backTreatmentTouchRect
+                visible         : vTreatmentTime    .time_IsLeft
+                text.text       : qsTr("BACK TO TREATMENT")
+                onClicked       : treatmentBackClicked()
+            },
 
-    TimeText { id: timeout
-        visible         : vTreatmentRinseback.timeoutTotal
-        anchors {
-            horizontalCenter: parent.horizontalCenter
-            top             : _title.bottom
-            topMargin       : 15
-        }
-        textPixelSize   : 30
-        textWeight      : Font.Normal
-        // the TimeText component works with hour and minute mainly
-        // so changing the seconds to minuts was easier than changing the component
-        secondsVisible  : false
-        seconds         : vTreatmentRinseback.timeoutCountDown * 60
-    }
+            TouchRect { id : _endTreatmentTouchRect
+                visible         : true // after the rinseback complete user can always end the treatment, regardless of incomplete or compeleted treatment
+                text.text       : qsTr("END TREATMENT")
+                isDefault       : ! vTreatmentTime  .time_IsLeft
+                onClicked       : treatmentEndClicked()
+            },
 
-    Rectangle {
-        color   : Colors.backgroundDialog
-        width   : _private.sectionWidth
-        height  : _private.sectionHeight
-        border.width: 2
-        border.color: Colors.borderDisableButton
-        radius: 10
-        anchors {
-            verticalCenter: parent.verticalCenter
-            left: parent.left
-            leftMargin: _private.sectionSpace
-        }
-        Column {
-            spacing : 10
-            anchors.fill: parent
-            anchors.margins: _private.sectionSpace
-            Text { id: _titleSteps
-                anchors.left: parent.left
-                color: Colors.white
-                text: qsTr("Please Disconnet")
-                font.pixelSize: Fonts.fontPixelButton
+            TouchRect { id : _beginRinsebackTouchRect
+                visible         : true
+                text.text       : qsTr("ADDITIONAL")
+                onClicked       : additionalClicked()
             }
-
-            Text { id: _steps
-                anchors.left: parent.left
-                anchors.leftMargin: _private.sectionSpace
-                color: Colors.white
-                text: qsTr("First Step\nSecond Step\nThird Step\n")
-                font.pixelSize: Fonts.fontPixelButton
-            }
-        }
+        ]
     }
-
-    Rectangle {
-        color   : Colors.backgroundDialog
-        width   : _private.sectionHeight
-        height  : _private.sectionHeight
-        border.width: 2
-        border.color: Colors.borderDisableButton
-        radius: 10
-        anchors {
-            verticalCenter: parent.verticalCenter
-            right: parent.right
-            rightMargin: _private.sectionSpace
-        }
-        Text { id: _visualAID
-            anchors.centerIn: parent
-            color: Colors.white
-            text: qsTr("Visual AID\nplaceholder")
-            font.pixelSize: Fonts.fontPixelButton
-        }
-    }
-
-    Row { id: _buttonGroup
-        property int buttonsWidth   : 300
-        spacing: 75
-
-        anchors {
-            bottom          : parent.bottom
-            horizontalCenter: parent.horizontalCenter
-            rightMargin     : spacing
-            leftMargin      : spacing
-            bottomMargin    : spacing
-        }
-
-        TouchRect { id : _backTreatmentTouchRect
-            visible         : _private.treatmentIncomplete
-            text.text       : qsTr("BACK TO TREATMENT")
-            width           : _buttonGroup.buttonsWidth
-            onClicked       : treatmentBackClicked()
-        }
-
-        TouchRect { id : _beginRinsebackTouchRect
-            visible         : _private.treatmentIncomplete
-            text.text       : qsTr("CONFIRM")
-            width           : _buttonGroup.buttonsWidth
-            color           : borderColor
-            onClicked       : confirmClicked()
-        }
-
-        TouchRect { id : _endTreatmentTouchRect
-            visible         : true // after the rinseback complete user can always end the treatment, regardless of incomplete or compeleted treatment
-            text.text       : qsTr("END TREATMENT")
-            width           : _buttonGroup.buttonsWidth
-            color           : _private.treatmentIncomplete ? backgroundColor : borderColor
-            onClicked       : treatmentEndClicked()
-        }
-    }
-
-    NotificationBar { id: _notification
-        iconVisible: false
-    }
-
-    onVisibleChanged: {
-        _notification.text = ""
-        if (visible) {
-            _mainMenu.hidden = true
-        }
-    }
 }