Warning, /network/neochat/src/qml/TypingPane.qml is written in an unsupported language. File is not indexed.
0001 /* SPDX-FileCopyrightText: 2020 Carl Schwan <carl@carlschwan.de>
0002 * SPDX-FileCopyrightText: 2020 Noah Davis <noahadvs@gmail.com>
0003 * SPDX-FileCopyrightText: 2021 Srevin Saju <srevinsaju@sugarlabs.org>
0004 * SPDX-License-Identifier: GPL-2.0-or-later
0005 */
0006
0007 import QtQuick
0008 import QtQuick.Layouts
0009 import QtQuick.Controls as QQC2
0010 import org.kde.kirigami as Kirigami
0011 import org.kde.neochat
0012
0013 Loader {
0014 id: root
0015 property string labelText: ""
0016
0017 active: visible
0018 sourceComponent: QQC2.Pane {
0019 id: typingPane
0020
0021 leftPadding: Kirigami.Units.largeSpacing
0022 rightPadding: Kirigami.Units.largeSpacing
0023 topPadding: Kirigami.Units.smallSpacing
0024 bottomPadding: Kirigami.Units.smallSpacing
0025 spacing: Kirigami.Units.largeSpacing
0026
0027 FontMetrics {
0028 id: fontMetrics
0029 }
0030
0031 Kirigami.Theme.colorSet: Kirigami.Theme.View
0032 Kirigami.Theme.inherit: false
0033
0034 contentItem: RowLayout {
0035 spacing: typingPane.spacing
0036 Row {
0037 id: dotRow
0038 property int duration: 400
0039 spacing: Kirigami.Units.smallSpacing
0040 Repeater {
0041 model: 3
0042 delegate: Rectangle {
0043 id: dot
0044 color: Kirigami.Theme.textColor
0045 radius: height / 2
0046 implicitWidth: fontMetrics.xHeight
0047 implicitHeight: fontMetrics.xHeight
0048 // rotating 45 degrees makes the dots look a bit smoother when scaled up
0049 rotation: 45
0050 opacity: 0.5
0051 scale: 1
0052 // FIXME: Sometimes the animation timings for each
0053 // dot drift slightly reletative to each other.
0054 // Not everyone can see this, but I'm pretty sure it's there.
0055 SequentialAnimation {
0056 running: true
0057 PauseAnimation {
0058 duration: dotRow.duration * index / 2
0059 }
0060 SequentialAnimation {
0061 loops: Animation.Infinite
0062 ParallelAnimation {
0063 // Animators unfortunately sync up instead of being
0064 // staggered, so I'm using NumberAnimations instead.
0065 NumberAnimation {
0066 target: dot
0067 property: "scale"
0068 from: 1
0069 to: 1.33
0070 duration: dotRow.duration
0071 }
0072 NumberAnimation {
0073 target: dot
0074 property: "opacity"
0075 from: 0.5
0076 to: 1
0077 duration: dotRow.duration
0078 }
0079 }
0080 ParallelAnimation {
0081 NumberAnimation {
0082 target: dot
0083 property: "scale"
0084 from: 1.33
0085 to: 1
0086 duration: dotRow.duration
0087 }
0088 NumberAnimation {
0089 target: dot
0090 property: "opacity"
0091 from: 1
0092 to: 0.5
0093 duration: dotRow.duration
0094 }
0095 }
0096 PauseAnimation {
0097 duration: dotRow.duration
0098 }
0099 }
0100 }
0101 }
0102 }
0103 }
0104 QQC2.Label {
0105 id: typingLabel
0106 elide: Text.ElideRight
0107 text: root.labelText
0108 textFormat: Text.PlainText
0109 }
0110 }
0111
0112 leftInset: !mirrored ? 0 : -background.radius
0113 rightInset: mirrored ? 0 : -background.radius
0114 bottomInset: -background.radius
0115 background: Rectangle {
0116 radius: 3
0117 color: Kirigami.Theme.backgroundColor
0118 border.color: Kirigami.ColorUtils.tintWithAlpha(Kirigami.Theme.backgroundColor, Kirigami.Theme.textColor, 0.2)
0119 border.width: 1
0120 }
0121 }
0122 }