RecordBox: new design
GitLab: #1417 Change-Id: I892d140a4989e8cd6e96ca6f81abaa0cdaab2e54
3
resources/icons/check_circle_24dp.svg
Normal file
@@ -0,0 +1,3 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20">
|
||||
<path id="check_circle_FILL0_wght400_GRAD0_opsz24" d="M88.6-865.4l7.05-7.05-1.4-1.4L88.6-868.2l-2.85-2.85-1.4,1.4ZM90-860a9.738,9.738,0,0,1-3.9-.787,10.1,10.1,0,0,1-3.175-2.138,10.1,10.1,0,0,1-2.138-3.175A9.738,9.738,0,0,1,80-870a9.738,9.738,0,0,1,.787-3.9,10.1,10.1,0,0,1,2.138-3.175,10.1,10.1,0,0,1,3.175-2.138A9.738,9.738,0,0,1,90-880a9.738,9.738,0,0,1,3.9.787,10.1,10.1,0,0,1,3.175,2.138,10.1,10.1,0,0,1,2.138,3.175A9.738,9.738,0,0,1,100-870a9.738,9.738,0,0,1-.787,3.9,10.1,10.1,0,0,1-2.138,3.175,10.1,10.1,0,0,1-3.175,2.138A9.738,9.738,0,0,1,90-860Zm0-2a7.721,7.721,0,0,0,5.675-2.325A7.721,7.721,0,0,0,98-870a7.721,7.721,0,0,0-2.325-5.675A7.721,7.721,0,0,0,90-878a7.721,7.721,0,0,0-5.675,2.325A7.721,7.721,0,0,0,82-870a7.721,7.721,0,0,0,2.325,5.675A7.721,7.721,0,0,0,90-862ZM90-870Z" transform="translate(-80 880)" fill="#fff"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 927 B |
@@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="none" d="M24 24H0V0h24v24z"/><circle fill="#ff0000" cx="12" cy="12" r="8"/></svg>
|
||||
|
Before Width: | Height: | Size: 176 B |
@@ -1,11 +0,0 @@
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<!-- Generator: Adobe Illustrator 24.3.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
|
||||
viewBox="0 0 24 24" style="enable-background:new 0 0 24 24;" xml:space="preserve">
|
||||
<path d="M20.2,6.5c-1.4-2.2-3.6-3.7-6-4.2C9,1.1,3.9,4.2,2.7,9.3c0,0,0,0,0,0l0,0.1c-0.6,2.4-0.1,4.9,1.2,6.9c1.2,1.9,3,3.3,5.1,4
|
||||
l-0.4,0.3c-0.1,0-0.1,0.1-0.2,0.1C8,20.9,8,21.4,8.2,21.7C8.3,21.9,8.5,22,8.7,22c0,0,0.1,0,0.1,0c0.2,0,0.3-0.1,0.4-0.1l2-1.2
|
||||
c0.2-0.1,0.3-0.3,0.3-0.5s0-0.4-0.1-0.6l-1.3-2c-0.2-0.3-0.6-0.4-1-0.2c-0.4,0.2-0.5,0.7-0.3,1l0.2,0.4c-1.7-0.6-3.1-1.7-4.1-3.3
|
||||
c-1.1-1.7-1.4-3.8-1-5.9c0,0,0,0,0,0l0-0.1c1-4.2,5.3-6.8,9.7-5.9c2.1,0.5,3.9,1.8,5.1,3.6c1.1,1.7,1.4,3.8,1,5.9
|
||||
c-0.6,2.7-2.8,4.9-5.6,5.8c-0.4,0.1-0.6,0.5-0.5,0.9c0.1,0.4,0.5,0.6,0.9,0.5c3.3-1,5.9-3.7,6.7-6.9l0-0.1
|
||||
C21.9,11,21.5,8.5,20.2,6.5z"/>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 976 B |
9
resources/icons/record_round_black_24dp.svg
Normal file
@@ -0,0 +1,9 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20">
|
||||
<g id="Picture_FILLO" transform="translate(-378.5 -900)">
|
||||
<circle id="Oval" cx="7.222" cy="7.222" r="7.222" transform="translate(381.278 902.778)" fill="#fff"/>
|
||||
<g id="Oval-2" data-name="Oval" transform="translate(378.5 900)" fill="none" stroke="#fff" stroke-width="1">
|
||||
<circle cx="10" cy="10" r="10" stroke="none"/>
|
||||
<circle cx="10" cy="10" r="9.5" fill="none"/>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 492 B |
3
resources/icons/restart_black_24dp.svg
Normal file
@@ -0,0 +1,3 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20">
|
||||
<path id="refresh_FILL0_wght400_GRAD0_opsz24" d="M170-780a9.651,9.651,0,0,0,7.094-2.906A9.651,9.651,0,0,0,180-790a9.651,9.651,0,0,0-2.906-7.094A9.651,9.651,0,0,0,170-800a9.9,9.9,0,0,0-4.125.891,9.528,9.528,0,0,0-3.375,2.547V-800H160v8.75h8.75v-2.5H163.5a7.3,7.3,0,0,1,2.734-2.75,7.409,7.409,0,0,1,3.766-1,7.233,7.233,0,0,1,5.313,2.188A7.233,7.233,0,0,1,177.5-790a7.233,7.233,0,0,1-2.187,5.313A7.233,7.233,0,0,1,170-782.5a7.328,7.328,0,0,1-4.344-1.375,7.261,7.261,0,0,1-2.719-3.625h-2.625a9.87,9.87,0,0,0,3.563,5.406A9.7,9.7,0,0,0,170-780Z" transform="translate(-160 800)" fill="#fff"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 679 B |
@@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M0 0h24v24H0z" fill="none"/><path d="M6 6h12v12H6z" fill="#ff0000"/></svg>
|
||||
|
Before Width: | Height: | Size: 166 B |
6
resources/icons/stop_rectangle_24dp.svg
Normal file
@@ -0,0 +1,6 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="15" height="16" viewBox="0 0 15 16">
|
||||
<g id="Stop_FILLO" fill="none" stroke="#fff" stroke-width="1.5">
|
||||
<rect width="15" height="16" rx="5" stroke="none"/>
|
||||
<rect x="0.75" y="0.75" width="13.5" height="14.5" rx="4.25" fill="none"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 300 B |
@@ -64,7 +64,8 @@ BaseModalDialog {
|
||||
RecordBox {
|
||||
id: recordBox
|
||||
|
||||
anchors.centerIn: parent
|
||||
x: 100
|
||||
y: 100
|
||||
|
||||
isPhoto: true
|
||||
visible: false
|
||||
@@ -120,14 +121,6 @@ BaseModalDialog {
|
||||
|
||||
onClicked: {
|
||||
recordBox.parent = buttonsRowLayout
|
||||
|
||||
recordBox.x = Qt.binding(function() {
|
||||
var buttonCenterX = buttonsRowLayout.width / 2
|
||||
return buttonCenterX - recordBox.width / 2
|
||||
})
|
||||
recordBox.y = Qt.binding(function() {
|
||||
return - recordBox.height / 2
|
||||
})
|
||||
startBooth()
|
||||
}
|
||||
}
|
||||
|
||||
@@ -169,6 +169,12 @@ Item {
|
||||
property color spinboxBackgroundColor: darkTheme ? editBackgroundColor : selectedColor
|
||||
property color spinboxBorderColor: darkTheme ? "#1D5F70" : "#A3C2DA"
|
||||
|
||||
//RecordBox
|
||||
property color screenshotButtonColor: "#CC0022"
|
||||
property color recordBoxcloseButtonColor: "#8d8a87"
|
||||
property color recordBoxHoverColor: "#4D4D4D"
|
||||
property color recordBoxButtonColor: "#272727"
|
||||
|
||||
// Toast
|
||||
property color toastColor: darkTheme ? "#f0f0f0" : "#000000"
|
||||
property color toastRectColor: !darkTheme ? "#f0f0f0" : "#000000"
|
||||
|
||||
@@ -193,12 +193,14 @@ Rectangle {
|
||||
}
|
||||
|
||||
onVideoRecordMessageButtonClicked: {
|
||||
recordBox.y = -recordBox.height;
|
||||
recordBox.y = -recordBox.height - 200;
|
||||
recordBox.x = recordBox.width + 200
|
||||
recordBox.openRecorder(true);
|
||||
}
|
||||
|
||||
onAudioRecordMessageButtonClicked: {
|
||||
recordBox.y = -recordBox.height;
|
||||
recordBox.y = -recordBox.height - 150;
|
||||
recordBox.x = recordBox.width + 200;
|
||||
recordBox.openRecorder(false);
|
||||
}
|
||||
|
||||
|
||||
@@ -38,9 +38,10 @@ Popup {
|
||||
property int state: RecordBox.States.INIT
|
||||
property bool isVideo: false
|
||||
property bool isPhoto: false
|
||||
property bool isAudio: false
|
||||
property bool showVideo: (root.isVideo && VideoDevices.listSize !== 0)
|
||||
property int preferredWidth: 320
|
||||
property int preferredHeight: 240
|
||||
property int preferredHeight: 500
|
||||
property int btnSize: 40
|
||||
|
||||
property int offset: 3
|
||||
@@ -56,6 +57,7 @@ Popup {
|
||||
|
||||
function openRecorder(vid) {
|
||||
isVideo = vid;
|
||||
isAudio = !vid && !isPhoto;
|
||||
updateState(RecordBox.States.INIT);
|
||||
if (isVideo) {
|
||||
localVideo.startWithId(VideoDevices.getDefaultDevice());
|
||||
@@ -136,260 +138,315 @@ Popup {
|
||||
}
|
||||
}
|
||||
|
||||
background: Item {
|
||||
} // Computed by id: box, to do the layer on LocalVideo
|
||||
|
||||
width: preferredWidth
|
||||
height: isVideo ? previewWidget.height + 80 : preferredHeight
|
||||
Rectangle {
|
||||
id: box
|
||||
id: boxBackground
|
||||
radius: 5
|
||||
anchors.fill: parent
|
||||
color: JamiTheme.backgroundColor
|
||||
|
||||
PushButton {
|
||||
id: cancelBtn
|
||||
objectName: "cancelBtn"
|
||||
z: 1
|
||||
|
||||
normalColor: "transparent"
|
||||
hoveredColor: Qt.rgba(255, 255, 255, 0.2)
|
||||
imageColor: isVideo ? JamiTheme.whiteColor : JamiTheme.textColor
|
||||
|
||||
preferredSize: 12
|
||||
|
||||
source: JamiResources.round_close_24dp_svg
|
||||
toolTipText: JamiStrings.back
|
||||
|
||||
anchors.right: box.right
|
||||
anchors.top: box.top
|
||||
anchors.margins: 8
|
||||
|
||||
focusPolicy: Qt.TabFocus
|
||||
onClicked: {
|
||||
closeRecorder();
|
||||
updateState(RecordBox.States.INIT);
|
||||
}
|
||||
}
|
||||
|
||||
Item {
|
||||
// Else it will be resized by the layer effect
|
||||
id: photoMask
|
||||
visible: false
|
||||
anchors.fill: parent
|
||||
Rectangle {
|
||||
anchors.centerIn: parent
|
||||
height: parent.height
|
||||
width: parent.height
|
||||
radius: height / 2
|
||||
}
|
||||
}
|
||||
width: 300
|
||||
height: 300
|
||||
|
||||
Rectangle {
|
||||
id: rectBox
|
||||
visible: false
|
||||
anchors.fill: parent
|
||||
|
||||
radius: 5
|
||||
}
|
||||
id: previewWidget
|
||||
anchors.centerIn: parent
|
||||
height: root.isAudio ? 100 : 300
|
||||
width: 300
|
||||
color: root.isAudio ? JamiTheme.secondaryBackgroundColor : "transparent"
|
||||
|
||||
ColumnLayout {
|
||||
id: recordItem
|
||||
anchors.fill: parent
|
||||
spacing: 0
|
||||
Layout.alignment: Qt.AlignTop
|
||||
|
||||
// Video
|
||||
Image {
|
||||
id: screenshotImg
|
||||
visible: root.showVideo && root.isPhoto && btnSend.visible
|
||||
Layout.alignment: Qt.AlignHCenter | Qt.AlignTop
|
||||
|
||||
sourceSize.width: parent.width
|
||||
sourceSize.height: width * localVideo.invAspectRatio
|
||||
anchors.fill: parent
|
||||
fillMode: Image.PreserveAspectCrop // Ajuste l'image tout en préservant l'aspect
|
||||
|
||||
source: root.photo === "" ? "" : "data:image/png;base64," + root.photo
|
||||
}
|
||||
|
||||
// video Preview
|
||||
Rectangle {
|
||||
id: previewWidget
|
||||
LocalVideo {
|
||||
id: localVideo
|
||||
anchors.fill: parent
|
||||
visible: root.showVideo && !screenshotImg.visible
|
||||
|
||||
Layout.alignment: Qt.AlignHCenter | Qt.AlignTop
|
||||
height: localVideo.width * localVideo.invAspectRatio
|
||||
width: parent.width
|
||||
layer.enabled: true
|
||||
layer.effect: OpacityMask {
|
||||
maskSource: rectBox
|
||||
}
|
||||
|
||||
color: JamiTheme.primaryForegroundColor
|
||||
|
||||
LocalVideo {
|
||||
id: localVideo
|
||||
Rectangle {
|
||||
id: rectBox
|
||||
visible: false
|
||||
anchors.fill: parent
|
||||
radius: 5
|
||||
}
|
||||
}
|
||||
|
||||
layer.enabled: true
|
||||
layer.effect: OpacityMask {
|
||||
maskSource: rectBox
|
||||
}
|
||||
Rectangle {
|
||||
anchors.fill: parent
|
||||
color: "black"
|
||||
opacity: 0.6
|
||||
visible: root.isPhoto
|
||||
radius: 5
|
||||
|
||||
layer.enabled: true
|
||||
layer.effect: OpacityMask {
|
||||
anchors.centerIn: parent
|
||||
maskSource: photoMask
|
||||
invert: true
|
||||
}
|
||||
|
||||
Item {
|
||||
// Else it will be resized by the layer effect
|
||||
id: photoMask
|
||||
visible: false
|
||||
anchors.fill: parent
|
||||
Rectangle {
|
||||
anchors.fill: parent
|
||||
color: "black"
|
||||
opacity: 0.6
|
||||
visible: root.isPhoto
|
||||
|
||||
layer.enabled: true
|
||||
layer.effect: OpacityMask {
|
||||
anchors.centerIn: parent
|
||||
maskSource: photoMask
|
||||
invert: true
|
||||
}
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
anchors.top: parent.top
|
||||
anchors.topMargin: 20
|
||||
height: 200
|
||||
width: 200
|
||||
radius: height / 2
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
RowLayout {
|
||||
id: controls
|
||||
Layout.alignment: Qt.AlignCenter
|
||||
Layout.fillWidth: true
|
||||
spacing: 24
|
||||
Layout.bottomMargin: isVideo ? 8 : 0
|
||||
ColumnLayout{
|
||||
id: mainLayout
|
||||
|
||||
PushButton {
|
||||
id: recordButton
|
||||
objectName: "recordButton"
|
||||
Layout.alignment: Qt.AlignCenter
|
||||
anchors.fill: parent
|
||||
Component.onCompleted: print("mainLayout width: " + width + " height: " + height)
|
||||
|
||||
preferredSize: btnSize
|
||||
JamiPushButton {
|
||||
id: cancelBtn
|
||||
objectName: "cancelBtn"
|
||||
z: 1
|
||||
|
||||
normalColor: isVideo ? "transparent" : JamiTheme.backgroundColor
|
||||
hoveredColor: Qt.rgba(255, 255, 255, 0.2)
|
||||
Layout.alignment: Qt.AlignRight | Qt.AlignTop
|
||||
Layout.preferredHeight: 20
|
||||
Layout.preferredWidth: 20
|
||||
Layout.topMargin: 5
|
||||
Layout.rightMargin: 5
|
||||
|
||||
source: JamiResources.fiber_manual_record_24dp_svg
|
||||
imageColor: JamiTheme.recordIconColor
|
||||
imageColor: hovered ? JamiTheme.whiteColor : JamiTheme.recordBoxcloseButtonColor
|
||||
normalColor: "transparent"
|
||||
hoveredColor: JamiTheme.recordBoxHoverColor
|
||||
source: JamiResources.round_close_24dp_svg
|
||||
|
||||
toolTipText: JamiStrings.back
|
||||
focusPolicy: Qt.TabFocus
|
||||
|
||||
onClicked: {
|
||||
updateState(RecordBox.States.RECORDING);
|
||||
if (!root.isPhoto)
|
||||
startRecording();
|
||||
}
|
||||
}
|
||||
|
||||
PushButton {
|
||||
id: screenshotBtn
|
||||
objectName: "screenshotBtn"
|
||||
Layout.alignment: Qt.AlignCenter
|
||||
|
||||
preferredSize: btnSize
|
||||
|
||||
normalColor: isVideo ? "transparent" : JamiTheme.backgroundColor
|
||||
hoveredColor: Qt.rgba(255, 255, 255, 0.2)
|
||||
border.width: 1
|
||||
border.color: imageColor
|
||||
|
||||
source: JamiResources.fiber_manual_record_24dp_svg
|
||||
imageColor: UtilsAdapter.luma(JamiTheme.backgroundColor) ? "white" : JamiTheme.redColor
|
||||
|
||||
focusPolicy: Qt.TabFocus
|
||||
onClicked: {
|
||||
root.photo = videoProvider.captureVideoFrame(VideoDevices.getDefaultDevice());
|
||||
updateState(RecordBox.States.REC_SUCCESS);
|
||||
}
|
||||
}
|
||||
|
||||
PushButton {
|
||||
id: btnStop
|
||||
objectName: "btnStop"
|
||||
Layout.alignment: Qt.AlignCenter
|
||||
|
||||
preferredSize: btnSize
|
||||
|
||||
normalColor: isVideo ? "transparent" : JamiTheme.backgroundColor
|
||||
hoveredColor: Qt.rgba(255, 255, 255, 0.2)
|
||||
|
||||
source: JamiResources.stop_24dp_red_svg
|
||||
imageColor: UtilsAdapter.luma(JamiTheme.backgroundColor) ? "white" : JamiTheme.buttonTintedBlue
|
||||
border.width: 1
|
||||
border.color: imageColor
|
||||
|
||||
focusPolicy: Qt.TabFocus
|
||||
onClicked: {
|
||||
if (!root.isPhoto)
|
||||
stopRecording();
|
||||
updateState(RecordBox.States.REC_SUCCESS);
|
||||
}
|
||||
}
|
||||
|
||||
PushButton {
|
||||
id: btnRestart
|
||||
objectName: "btnRestart"
|
||||
Layout.alignment: Qt.AlignCenter
|
||||
|
||||
preferredSize: btnSize
|
||||
|
||||
normalColor: isVideo ? "transparent" : JamiTheme.backgroundColor
|
||||
|
||||
source: JamiResources.re_record_24dp_svg
|
||||
hoveredColor: Qt.rgba(255, 255, 255, 0.2)
|
||||
imageColor: UtilsAdapter.luma(JamiTheme.backgroundColor) ? "white" : JamiTheme.buttonTintedBlue
|
||||
border.width: 1
|
||||
border.color: imageColor
|
||||
|
||||
focusPolicy: Qt.TabFocus
|
||||
onClicked: {
|
||||
if (!root.isPhoto)
|
||||
stopRecording();
|
||||
updateState(RecordBox.States.INIT);
|
||||
}
|
||||
}
|
||||
|
||||
PushButton {
|
||||
id: btnSend
|
||||
objectName: "btnSend"
|
||||
Layout.alignment: Qt.AlignCenter
|
||||
|
||||
preferredSize: btnSize
|
||||
|
||||
normalColor: isVideo ? "transparent" : JamiTheme.backgroundColor
|
||||
|
||||
source: JamiResources.check_black_24dp_svg
|
||||
imageColor: UtilsAdapter.luma(JamiTheme.backgroundColor) ? "white" : JamiTheme.buttonTintedBlue
|
||||
border.width: 1
|
||||
border.color: imageColor
|
||||
|
||||
focusPolicy: Qt.TabFocus
|
||||
onClicked: {
|
||||
if (!root.isPhoto) {
|
||||
stopRecording();
|
||||
sendRecord();
|
||||
} else if (root.photo !== "") {
|
||||
root.validatePhoto(root.photo);
|
||||
}
|
||||
closeRecorder();
|
||||
updateState(RecordBox.States.INIT);
|
||||
}
|
||||
}
|
||||
|
||||
Timer {
|
||||
id: timer
|
||||
RowLayout {
|
||||
id: controls
|
||||
|
||||
interval: 1000
|
||||
running: false
|
||||
repeat: true
|
||||
Layout.alignment: Qt.AlignHCenter | Qt.AlignBottom
|
||||
Layout.fillWidth: true
|
||||
|
||||
onTriggered: updateTimer()
|
||||
spacing: 2
|
||||
Layout.bottomMargin: 20//isVideo ? 8 : 0
|
||||
Component.onCompleted: print("controls width: " + width + " height: " + height)
|
||||
|
||||
JamiPushButton {
|
||||
id: recordButton
|
||||
|
||||
objectName: "recordButton"
|
||||
Layout.alignment: Qt.AlignCenter
|
||||
preferredSize: btnSize
|
||||
|
||||
source: JamiResources.record_black_24dp_svg
|
||||
imageColor: JamiTheme.whiteColor
|
||||
imageContainerHeight: 20
|
||||
imageContainerWidth: 20
|
||||
|
||||
focusPolicy: Qt.TabFocus
|
||||
|
||||
background: RoundedBorderRectangle {
|
||||
opacity: recordButton.hovered ? 1 : 0.7
|
||||
fillColor: recordButton.hovered ? JamiTheme.recordBoxHoverColor : JamiTheme.recordBoxButtonColor
|
||||
radius: {
|
||||
"tl": 5,
|
||||
"tr": root.isAudio ? 0 : 5,
|
||||
"br": root.isAudio ? 0 : 5,
|
||||
"bl": 5
|
||||
}
|
||||
}
|
||||
|
||||
onClicked: {
|
||||
updateState(RecordBox.States.RECORDING);
|
||||
if (!root.isPhoto)
|
||||
startRecording();
|
||||
}
|
||||
}
|
||||
JamiPushButton {
|
||||
id: screenshotBtn
|
||||
objectName: "screenshotBtn"
|
||||
|
||||
Layout.alignment: Qt.AlignCenter
|
||||
preferredSize: btnSize
|
||||
|
||||
normalColor: JamiTheme.screenshotButtonColor
|
||||
hoveredColor: JamiTheme.screenshotButtonColor
|
||||
background.opacity: hovered ? 1 : 0.5
|
||||
|
||||
source: JamiResources.record_round_black_24dp_svg
|
||||
|
||||
imageColor: JamiTheme.whiteColor
|
||||
imageContainerHeight: 25
|
||||
imageContainerWidth: 25
|
||||
focusPolicy: Qt.TabFocus
|
||||
|
||||
onClicked: {
|
||||
root.photo = videoProvider.captureVideoFrame(VideoDevices.getDefaultDevice());
|
||||
updateState(RecordBox.States.REC_SUCCESS);
|
||||
}
|
||||
}
|
||||
|
||||
PushButton {
|
||||
id: btnStop
|
||||
objectName: "btnStop"
|
||||
|
||||
Layout.alignment: Qt.AlignCenter
|
||||
preferredSize: btnSize
|
||||
|
||||
source: JamiResources.stop_rectangle_24dp_svg
|
||||
|
||||
imageColor: JamiTheme.whiteColor
|
||||
imageContainerHeight: 20
|
||||
imageContainerWidth: 20
|
||||
|
||||
focusPolicy: Qt.TabFocus
|
||||
|
||||
background: RoundedBorderRectangle {
|
||||
opacity: btnStop.hovered ? 1 : 0.7
|
||||
fillColor: btnStop.hovered ? JamiTheme.recordBoxHoverColor : JamiTheme.recordBoxButtonColor
|
||||
radius: {
|
||||
"tl": 5,
|
||||
"tr": 0,
|
||||
"br": 0,
|
||||
"bl": 5
|
||||
}
|
||||
}
|
||||
|
||||
onClicked: {
|
||||
if (!root.isPhoto)
|
||||
stopRecording();
|
||||
updateState(RecordBox.States.REC_SUCCESS);
|
||||
}
|
||||
}
|
||||
|
||||
JamiPushButton {
|
||||
id: btnRestart
|
||||
|
||||
objectName: "btnRestart"
|
||||
Layout.alignment: Qt.AlignCenter
|
||||
preferredSize: btnSize
|
||||
|
||||
source: JamiResources.restart_black_24dp_svg
|
||||
|
||||
imageColor: JamiTheme.whiteColor
|
||||
imageContainerHeight: 25
|
||||
imageContainerWidth: 25
|
||||
|
||||
focusPolicy: Qt.TabFocus
|
||||
|
||||
background: RoundedBorderRectangle {
|
||||
opacity: btnRestart.hovered ? 1 : 0.7
|
||||
fillColor: btnRestart.hovered ? JamiTheme.recordBoxHoverColor : JamiTheme.recordBoxButtonColor
|
||||
radius: {
|
||||
"tl": 5,
|
||||
"tr": 0,
|
||||
"br": 0,
|
||||
"bl": 5
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
onClicked: {
|
||||
if (!root.isPhoto)
|
||||
stopRecording();
|
||||
updateState(RecordBox.States.INIT);
|
||||
}
|
||||
}
|
||||
|
||||
JamiPushButton {
|
||||
id: btnSend
|
||||
|
||||
objectName: "btnSend"
|
||||
Layout.alignment: Qt.AlignCenter
|
||||
preferredSize: btnSize
|
||||
|
||||
imageColor: JamiTheme.whiteColor
|
||||
imageContainerHeight: 25
|
||||
imageContainerWidth: 25
|
||||
|
||||
source: JamiResources.check_circle_24dp_svg
|
||||
|
||||
focusPolicy: Qt.TabFocus
|
||||
|
||||
background: RoundedBorderRectangle {
|
||||
opacity: btnSend.hovered ? 1 : 0.7
|
||||
fillColor: btnSend.hovered ? JamiTheme.recordBoxHoverColor : JamiTheme.recordBoxButtonColor
|
||||
radius: {
|
||||
"tl": 0,
|
||||
"tr": root.isPhoto ? 5 : 0,
|
||||
"br": root.isPhoto ? 5 : 0,
|
||||
"bl": 0
|
||||
}
|
||||
}
|
||||
|
||||
onClicked: {
|
||||
if (!root.isPhoto) {
|
||||
stopRecording();
|
||||
sendRecord();
|
||||
} else if (root.photo !== "") {
|
||||
root.validatePhoto(root.photo);
|
||||
}
|
||||
closeRecorder();
|
||||
updateState(RecordBox.States.INIT);
|
||||
}
|
||||
}
|
||||
Timer {
|
||||
id: timer
|
||||
|
||||
interval: 1000
|
||||
running: false
|
||||
repeat: true
|
||||
onTriggered: updateTimer()
|
||||
}
|
||||
|
||||
RoundedBorderRectangle {
|
||||
opacity: 0.7
|
||||
fillColor: JamiTheme.recordBoxButtonColor
|
||||
visible: (!recordButton.visible && !root.isPhoto) || root.isAudio
|
||||
|
||||
Layout.preferredHeight: btnSend.height
|
||||
Layout.preferredWidth: time.width + 20
|
||||
radius: {
|
||||
"tl": 0,
|
||||
"tr": 5,
|
||||
"br": 5,
|
||||
"bl": 0
|
||||
}
|
||||
|
||||
Text {
|
||||
id: time
|
||||
|
||||
anchors.centerIn: parent
|
||||
opacity: 1
|
||||
|
||||
text: "00:00"
|
||||
color: JamiTheme.whiteColor
|
||||
font.pointSize: (isVideo ? 12 : 20)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Text {
|
||||
id: time
|
||||
|
||||
Layout.alignment: Qt.AlignCenter
|
||||
|
||||
visible: !root.isPhoto
|
||||
text: "00:00"
|
||||
color: JamiTheme.textColor
|
||||
font.pointSize: (isVideo ? 12 : 20)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||