import QtQuick 2.15 import QtQuick.Controls 2.15 import QtQuick.Layouts 1.15 import StatusQ.Core 0.1 import StatusQ.Core.Theme 0.1 import StatusQ.Components 0.1 import StatusQ.Controls 0.1 import AppLayouts.Communities.panels 1.0 import AppLayouts.Wallet.controls 1.0 import utils 1.0 Control { id: root objectName: "collectibleViewControl" property string title: "" property string unknownTitle: "..." property string subTitle: "" property alias subTitleColor: subTitleItem.customColor property string backgroundColor: "transparent" property url mediaUrl : "" property string mediaType: "" property url fallbackImageUrl : "" property bool isLoading: false property bool navigationIconVisible: false property bool isMetadataValid: false property string communityId: "" property string communityName property string communityImage property int balance: 1 // Special Owner and TMaster token properties readonly property bool isCommunityCollectible: communityId !== "" property int privilegesLevel: Constants.TokenPrivilegesLevel.Community readonly property bool isPrivilegedToken: (privilegesLevel === Constants.TokenPrivilegesLevel.Owner) || (privilegesLevel === Constants.TokenPrivilegesLevel.TMaster) property color ornamentColor // Relevant color for these special tokens (community color) QtObject { id: d readonly property bool unknownCommunityName: root.communityName.startsWith("0x") && root.communityId === root.communityName } signal clicked signal rightClicked signal switchToCommunityRequested(string communityId) background: Rectangle { radius: Style.current.radius color: Theme.palette.baseColor2 visible: !root.isLoading && root.hovered TapHandler { acceptedButtons: Qt.LeftButton enabled: !root.isLoading onTapped: root.clicked() } TapHandler { acceptedButtons: Qt.RightButton enabled: !root.isLoading onTapped: root.rightClicked() } } HoverHandler { cursorShape: !root.isLoading ? Qt.PointingHandCursor : undefined } property Component balanceTag: Component { CollectibleBalanceTag { visible: !root.isLoading && (root.balance > 1) balance: root.balance } } contentItem: ColumnLayout { spacing: 0 CollectibleMedia { id: image Layout.alignment: Qt.AlignHCenter Layout.margins: Style.current.halfPadding Layout.fillWidth: true Layout.preferredHeight: width backgroundColor: root.isLoading ? "transparent" : root.backgroundColor visible: !specialCollectible.visible isMetadataValid: root.isMetadataValid mediaUrl: root.mediaUrl mediaType: root.mediaType fallbackImageUrl: root.fallbackImageUrl showLoadingIndicator: true isCollectibleLoading: root.isLoading fillMode: Image.PreserveAspectCrop Loader { anchors.top: parent.top anchors.left: parent.left anchors.margins: Style.current.halfPadding sourceComponent: root.balanceTag } } PrivilegedTokenArtworkPanel { id: specialCollectible Layout.alignment: Qt.AlignHCenter Layout.margins: Style.current.halfPadding Layout.fillWidth: true Layout.preferredHeight: width visible: root.isCommunityCollectible && root.isPrivilegedToken size: PrivilegedTokenArtworkPanel.Size.Medium artwork: visible ? root.fallbackImageUrl : "" color: root.ornamentColor fillMode: Image.PreserveAspectCrop isOwner: root.privilegesLevel === Constants.TokenPrivilegesLevel.Owner Loader { anchors.fill: parent active: root.isLoading sourceComponent: LoadingComponent {radius: image.radius} } Loader { anchors.top: parent.top anchors.left: parent.left anchors.margins: Style.current.halfPadding sourceComponent: root.balanceTag } } RowLayout { Layout.leftMargin: Style.current.halfPadding Layout.rightMargin: Layout.leftMargin Layout.fillWidth: !root.isLoading Layout.preferredWidth: root.isLoading ? 134 : width StatusTextWithLoadingState { Layout.fillWidth: true horizontalAlignment: Text.AlignLeft verticalAlignment: Text.AlignVCenter customColor: Theme.palette.directColor1 font.weight: Font.DemiBold elide: Text.ElideRight text: root.isLoading ? Constants.dummyText : root.title || root.unknownTitle loading: root.isLoading } StatusIcon { visible: root.navigationIconVisible icon: "next" color: Theme.palette.baseColor1 } } StatusTextWithLoadingState { id: subTitleItem Layout.topMargin: 4 Layout.leftMargin: Style.current.halfPadding Layout.rightMargin: Layout.leftMargin Layout.fillWidth: !root.isLoading Layout.preferredWidth: root.isLoading ? 88 : width horizontalAlignment: Text.AlignLeft verticalAlignment: Text.AlignVCenter font.pixelSize: 13 customColor: Theme.palette.baseColor1 elide: Text.ElideRight text: root.isLoading ? Constants.dummyText : root.subTitle loading: root.isLoading visible: text && !root.communityName } ManageTokensCommunityTag { Layout.topMargin: Style.current.halfPadding Layout.leftMargin: Style.current.halfPadding Layout.rightMargin: Style.current.halfPadding Layout.maximumWidth: parent.width - Layout.leftMargin - Layout.rightMargin communityName: root.communityName communityId: root.communityId communityImage: root.communityImage visible: root.isCommunityCollectible enabled: !root.isLoading TapHandler { enabled: !d.unknownCommunityName acceptedButtons: Qt.LeftButton onSingleTapped: root.switchToCommunityRequested(root.communityId) } } // Filler Item { Layout.fillHeight: true } } }