contents/ui/Piece.qml

0001 /*
0002  * SPDX-FileCopyrightText: 2014 Jeremy Whiting <jpwhiting@kde.org>
0003  *
0004  * SPDX-License-Identifier: GPL-2.0-or-later
0005  */
0006
0007 import QtQuick 2.15
0008 import QtQuick.Layouts 1.15
0009
0010 import org.kde.plasma.core as PlasmaCore
0011 import org.kde.kirigami 2.20 as Kirigami
0012 import org.kde.plasma.components 3.0 as PlasmaComponents3
0013 import org.kde.plasma.extras 2.0 as PlasmaExtras
0014 import org.kde.plasma.plasmoid 2.0
0015
0016 Rectangle {
0017     id: piece
0018     color: Plasmoid.configuration.boardColor
0019     border.color: "black"
0020     border.width: 1
0021     radius: 5
0022     visible: !empty
0023
0024     Layout.minimumWidth: 10
0025     Layout.preferredWidth: 30
0026
0027     Layout.minimumHeight: 10
0028     Layout.preferredHeight: 30
0029
0030     x: boardColumn * (width + margin) + margin / 2
0031     y: boardRow * (height + margin) + margin / 2
0032     width: pieceWidth
0033     height: pieceHeight
0034
0035     signal activated(int position)
0036
0037     readonly property int boardSize: Plasmoid.configuration.boardSize
0038     readonly property int margin: Kirigami.Units.smallSpacing
0039     readonly property int pieceWidth: (parent.width - (margin * boardSize)) / boardSize
0040     readonly property int pieceHeight: (parent.height - (margin * boardSize)) / boardSize
0041     readonly property int boardColumn: (position % boardSize)
0042     readonly property int boardRow: Math.floor(position / boardSize)
0043     readonly property bool empty: number === 0
0044
0045     property int number
0046     property int position
0047
0048     Keys.onPressed: {
0049         switch (event.key) {
0050         case Qt.Key_Space:
0051         case Qt.Key_Enter:
0052         case Qt.Key_Return:
0053         case Qt.Key_Select:
0054             piece.trigger();
0055             break;
0056         }
0057     }
0058     Accessible.name: pieceNumeral.text
0059     Accessible.role: Accessible.Button
0060
0061     function trigger() {
0062         piece.forceActiveFocus();
0063         piece.activated(position);
0064     }
0065
0066     Behavior on x {
0067         NumberAnimation {
0068             duration: Kirigami.Units.longDuration
0069             easing.type: Easing.InOutQuad
0070         }
0071     }
0072     Behavior on y {
0073         NumberAnimation {
0074             duration: Kirigami.Units.longDuration
0075             easing.type: Easing.InOutQuad
0076         }
0077     }
0078
0079     TapHandler {
0080         onTapped: piece.trigger()
0081     }
0082
0083     Loader {
0084         anchors.fill: parent
0085         active: parent.activeFocus
0086         asynchronous: true
0087         z: 0
0088
0089         sourceComponent: PlasmaExtras.Highlight {
0090             hovered: true
0091         }
0092     }
0093
0094     PlasmaComponents3.Label {
0095         id: pieceNumeral
0096         anchors.centerIn: parent
0097         text: piece.number
0098         textFormat: Text.PlainText
0099         color: Plasmoid.configuration.numberColor
0100         visible: Plasmoid.configuration.showNumerals
0101         z: 1
0102     }
0103
0104     Loader {
0105         anchors.fill: parent
0106
0107         active: Plasmoid.configuration.useImage
0108         asynchronous: true
0109         z: 0
0110
0111         sourceComponent: Image {
0112             id: pieceImage
0113             source: "image://fifteenpuzzle/" + boardSize + "-" + number + "-" + pieceWidth + "-" + pieceHeight + "-" + Plasmoid.configuration.imagePath
0114             cache: false
0115         }
0116     }
0117 }