diff --git a/touch/Confirmation.qml b/touch/Confirmation.qml index 1c15025..1785896 100644 --- a/touch/Confirmation.qml +++ b/touch/Confirmation.qml @@ -27,45 +27,77 @@ Dialog { id: confirmation property alias title: header.title - property alias icon: icon.icon + property alias description: description.text + property alias affirmativeAction: affirmativeButton.text + property alias negativeAction: negativeButton.text + + property string icon property alias color: header.color property var callback: undefined - contentHeight: icon.height + header.height + confirmLabel.height + 50 * pgst.scalef + contentHeight: contentColumn.height - SlidePageHeader { - id: header - color: Constants.colors.destructive - title: 'Confirmation' - } + Column { + id: contentColumn + width: parent.width - PIcon { - id: icon - size: 200 - anchors.centerIn: parent - color: header.color + SlidePageHeader { + id: header + color: Constants.colors.destructive + title: 'Confirmation' + } - MouseArea { - anchors.fill: parent - onClicked: { - if (confirmation.callback !== undefined) { - confirmation.callback(); + PLabel { + id: description + + width: parent.width - 30 * pgst.scalef + anchors.horizontalCenter: parent.horizontalCenter + wrapMode: Text.WordWrap + + visible: text + } + + Item { width: parent.width; height: 10 * pgst.scalef } + + Row { + width: parent.width - 30 * pgst.scalef + height: 80 * pgst.scalef + spacing: 30 * pgst.scalef + anchors.horizontalCenter: parent.horizontalCenter + + ConfirmationButton { + id: affirmativeButton + + width: (parent.width - parent.spacing) * 2 / 3 + height: parent.height + + text: 'Yes' + icon: confirmation.icon + contentColor: header.color + + onClicked: { + if (confirmation.callback !== undefined) { + confirmation.callback(); + confirmation.closePage(); + } + } + } + + ConfirmationButton { + id: negativeButton + + width: (parent.width - parent.spacing) * 1 / 3 + height: parent.height + + text: 'Cancel' + contentColor: Constants.colors.placeholder + + onClicked: { confirmation.closePage(); } } } - } - PLabel { - id: confirmLabel - - anchors { - horizontalCenter: parent.horizontalCenter - top: icon.bottom - margins: 30 * pgst.scalef - } - - text: 'Tap to confirm' - color: header.color + Item { width: parent.width; height: 30 * pgst.scalef } } } diff --git a/touch/ConfirmationButton.qml b/touch/ConfirmationButton.qml new file mode 100644 index 0000000..9cd778b --- /dev/null +++ b/touch/ConfirmationButton.qml @@ -0,0 +1,48 @@ + +/** + * + * gPodder QML UI Reference Implementation + * Copyright (c) 2014, Thomas Perl + * + * Permission to use, copy, modify, and/or distribute this software for any + * purpose with or without fee is hereby granted, provided that the above + * copyright notice and this permission notice appear in all copies. + * + * THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH + * REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY + * AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT, + * INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM + * LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR + * OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR + * PERFORMANCE OF THIS SOFTWARE. + * + */ + +import QtQuick 2.0 + +import 'common/constants.js' as Constants + +ButtonArea { + id: confirmationButton + + property alias text: label.text + property alias icon: icon.icon + property color contentColor: Constants.colors.highlight + + Row { + anchors.centerIn: parent + spacing: 5 * pgst.scalef + + PIcon { + id: icon + anchors.verticalCenter: parent.verticalCenter + color: confirmationButton.contentColor + } + + PLabel { + id: label + anchors.verticalCenter: parent.verticalCenter + color: confirmationButton.contentColor + } + } +} diff --git a/touch/Dialog.qml b/touch/Dialog.qml index 69ed3a1..65f929a 100644 --- a/touch/Dialog.qml +++ b/touch/Dialog.qml @@ -52,6 +52,11 @@ Rectangle { onClicked: page.closePage(); } + MouseArea { + // Tapping on the dialog contents should do nothing + anchors.fill: contents + } + Rectangle { id: contents property int border: parent.width * 0.1 diff --git a/touch/EpisodeItem.qml b/touch/EpisodeItem.qml index 2e17125..16e6fea 100644 --- a/touch/EpisodeItem.qml +++ b/touch/EpisodeItem.qml @@ -77,7 +77,7 @@ Item { enabled: downloadState != Constants.state.deleted onClicked: { var ctx = { py: py, id: id }; - pgst.showConfirmation('Delete episode', Icons.trash, function () { + pgst.showConfirmation('Delete episode', 'Delete', 'Cancel', 'Delete this episode?', Icons.trash, function () { ctx.py.call('main.delete_episode', [ctx.id]); }); } diff --git a/touch/EpisodesPage.qml b/touch/EpisodesPage.qml index 1dac9a6..f9161b8 100644 --- a/touch/EpisodesPage.qml +++ b/touch/EpisodesPage.qml @@ -51,7 +51,7 @@ SlidePage { label: 'Unsubscribe', callback: function () { var ctx = { py: py, id: episodesPage.podcast_id, page: episodesPage }; - pgst.showConfirmation('Unsubscribe', Icons.trash, function () { + pgst.showConfirmation('Unsubscribe', 'Unsubscribe', 'Cancel', 'Remove this podcast and all downloaded episodes?', Icons.trash, function () { ctx.py.call('main.unsubscribe', [ctx.id]); ctx.page.closePage(); }); diff --git a/touch/Main.qml b/touch/Main.qml index 7f0ea8c..1ca37d5 100644 --- a/touch/Main.qml +++ b/touch/Main.qml @@ -83,9 +83,12 @@ Item { } } - function showConfirmation(title, icon, callback) { + function showConfirmation(title, affirmative, negative, description, icon, callback) { loadPage('Confirmation.qml', { title: title, + affirmativeAction: affirmative, + negativeAction: negative, + description: description, icon: icon, callback: callback, }); diff --git a/touch/PodcastsPage.qml b/touch/PodcastsPage.qml index c26695a..016a889 100644 --- a/touch/PodcastsPage.qml +++ b/touch/PodcastsPage.qml @@ -95,7 +95,7 @@ SlidePage { label: 'Unsubscribe', callback: function () { var ctx = { py: py, id: id }; - pgst.showConfirmation('Unsubscribe', Icons.trash, function () { + pgst.showConfirmation('Unsubscribe', 'Unsubscribe', 'Cancel', 'Remove this podcast and all downloaded episodes?', Icons.trash, function () { ctx.py.call('main.unsubscribe', [ctx.id]); }); } },