1 files changed, 74 insertions, 70 deletions

diff --git a/src/mobile/qml/GridChooser.qml b/src/mobile/qml/GridChooser.qml
index b4d1612..b8cd198 100644
--- a/src/mobile/qml/GridChooser.qml
+++ b/src/mobile/qml/GridChooser.qml
@@ -1,4 +1,16 @@
-import QtQuick 2.1
+/*********
+*
+* In the name of the Father, and of the Son, and of the Holy Spirit.
+*
+* This file is part of BibleTime's source code, http://www.bibletime.info/.
+*
+* Copyright 1999-2016 by the BibleTime developers.
+* The BibleTime source code is licensed under the GNU General Public License
+* version 2.0.
+*
+**********/
+
+import QtQuick 2.2
 import BibleTime 1.0
 
 Rectangle {
@@ -8,30 +20,38 @@ Rectangle {
     property int rows: 5
     property int buttonWidth: 100
     property int buttonHeight: 30
-    property int topMargin: 10
-    property int leftMargin: 10
-    property int titleHeight: 20
-    property int space:5
+    property int space: 10
     property string selected: ""
     property string titleText: ""
     property int maxLength: 0
 
     signal accepted(string choosenText);
-    signal canceled();
+    signal backup();
 
-    onVisibleChanged: {
+    color: btStyle.toolbarColor
+    height: parent.height
+    width: parent.width
+
+    Keys.onReleased: {
+        if ((event.key == Qt.Key_Back || event.key == Qt.Key_Escape) && gridChooser.visible == true) {
+            event.accepted = true;
+            gridChooser.visible = false;
+            backup();
+        }
+    }
 
+    onVisibleChanged: {
+        if ( ! visible)
+            return;
         var count = gridChooserModel.length
         if (count < 36)
             count = 36;
 
         calculateColumns(count);
-
-        buttonWidth = (width-50)/columns;
-        buttonHeight = Math.floor((height-(rows*5))/rows);
-
-        topMargin = (height - rows*(buttonHeight+space) + space)/2 +titleHeight;
-        leftMargin = (width - columns*(buttonWidth+space) + space)/2;
+        buttonWidth = (width - ((columns +1) *space))/columns
+        var buttonH = Math.floor((height-(rows*space))/rows) ;
+        buttonHeight = Math.max(btStyle.pixelsPerMillimeterY*7.5, buttonH);
+        flick.contentY = 0;
     }
 
     function calculateColumns(count) {
@@ -46,71 +66,55 @@ Rectangle {
         gridChooser.accepted(value);
     }
 
-    Text {
-        id: title
-
-        text: titleText
-        font.pointSize: btStyle.uiFontPointSize
-        height: titleHeight
-        anchors.top: parent.top
-        anchors.horizontalCenter: parent.horizontalCenter
-    }
-
     BtStyle {
         id: btStyle
     }
 
-    MouseArea {
-        id: mouseArea
-
-        anchors.fill: parent
-        enabled: gridChooser.opacity
-    }
-
-    Rectangle {
-        anchors.fill: parent
-        color: btStyle.buttonBackground
-    }
-
-    Rectangle {
-        id: topSpace
+    TitleColorBar {
+        id: title
 
-        width: leftMargin
-        height: topMargin
-        color: btStyle.buttonBackground
+        title: qsTranslate("Choose Reference", titleText)
+        anchors.top: parent.top
+        anchors.horizontalCenter: parent.horizontalCenter
     }
 
-    Grid {
-        id: grid
-
-        anchors.top: topSpace.bottom
-        anchors.bottom: bottom.top
-        anchors.left: topSpace.right
-        anchors.right: parent.right
-        columns: gridChooser.columns
-        spacing: gridChooser.space
-
-        Repeater {
-            id: repeater
-
-            model: gridChooserModel
-
-            GridChooserButton {
-                id: buttonX
-
-                text: modelData
-                textHeight: btStyle.uiFontPointSize
-                buttonWidth: gridChooser.buttonWidth
-                buttonHeight: gridChooser.buttonHeight
-                textColor: {
-                    if (text == gridChooser.selected)
-                        return btStyle.buttonHighlightedText
-                    else
-                        return btStyle.buttonTextColor
+    Flickable {
+        id: flick
+
+        anchors.top: title.bottom
+        anchors.left: parent.left
+        anchors.leftMargin: space
+        width: parent.width
+        height: parent.height
+        contentHeight: (rows+1)*(buttonHeight+space);
+        contentWidth: width
+        clip: true
+
+        Grid {
+            id: grid
+
+            width: parent.width
+            height: parent.contentHeight
+            columns: gridChooser.columns
+            spacing: gridChooser.space
+
+            Repeater {
+                id: repeater
+
+                model: gridChooserModel
+
+                GridChooserButton {
+                    id: button
+
+                    text: modelData
+                    textHeight: btStyle.uiFontPointSize
+                    buttonWidth: gridChooser.buttonWidth
+                    buttonHeight: gridChooser.buttonHeight
+                    textColor: btStyle.buttonTextColor
+                    buttonColor: (text == gridChooser.selected) ? btStyle.buttonBackground : "white"
+                    activeButtonColor: btStyle.buttonTextColor
+                    onClicked: gridChooser.accept(text)
                 }
-                buttonColor: btStyle.buttonColor
-                activeButtonColor: btStyle.buttonTextColor
-                onClicked: gridChooser.accept(text)
             }
         }
     }