Add inline audio clip player (m.audio) (#143)

This commit is contained in:
Konstantinos Sideris 2017-12-01 15:39:50 +02:00
parent eae069ad93
commit 432a2e1354
16 changed files with 472 additions and 93 deletions

View File

@ -57,6 +57,7 @@ find_package(Qt5Widgets REQUIRED)
find_package(Qt5Network REQUIRED)
find_package(Qt5LinguistTools REQUIRED)
find_package(Qt5Concurrent REQUIRED)
find_package(Qt5Multimedia REQUIRED)
if (APPLE)
find_package(Qt5MacExtras REQUIRED)
@ -157,8 +158,10 @@ set(SRC_FILES
src/timeline/TimelineViewManager.cc
src/timeline/TimelineItem.cc
src/timeline/TimelineView.cc
src/timeline/widgets/AudioItem.cc
src/timeline/widgets/FileItem.cc
src/timeline/widgets/ImageItem.cc
src/timeline/widgets/VideoItem.cc
# UI components
src/ui/Avatar.cc
@ -260,8 +263,10 @@ qt5_wrap_cpp(MOC_HEADERS
include/timeline/TimelineItem.h
include/timeline/TimelineView.h
include/timeline/TimelineViewManager.h
include/timeline/widgets/AudioItem.h
include/timeline/widgets/FileItem.h
include/timeline/widgets/ImageItem.h
include/timeline/widgets/VideoItem.h
# UI components
include/ui/Avatar.h
@ -357,11 +362,11 @@ set (NHEKO_DEPS ${SRC_FILES} ${UI_HEADERS} ${MOC_HEADERS} ${QRC} ${LANG_QRC} ${Q
if(APPLE)
add_executable (nheko ${OS_BUNDLE} ${NHEKO_DEPS})
target_link_libraries (nheko ${NHEKO_LIBS} Qt5::MacExtras)
target_link_libraries (nheko ${NHEKO_LIBS} Qt5::MacExtras Qt5::Multimedia)
elseif(WIN32)
add_executable (nheko ${OS_BUNDLE} ${ICON_FILE} ${NHEKO_DEPS})
target_link_libraries (nheko ${NTDLIB} ${NHEKO_LIBS} Qt5::WinMain)
target_link_libraries (nheko ${NTDLIB} ${NHEKO_LIBS} Qt5::WinMain Qt5::Multimedia)
else()
add_executable (nheko ${OS_BUNDLE} ${NHEKO_DEPS})
target_link_libraries (nheko ${NHEKO_LIBS})
target_link_libraries (nheko ${NHEKO_LIBS} Qt5::Multimedia)
endif()

View File

@ -21,20 +21,24 @@
#include <QHBoxLayout>
#include <QLabel>
#include <QPainter>
#include <QSettings>
#include <QStyle>
#include <QStyleOption>
#include "AvatarProvider.h"
#include "Audio.h"
#include "Emote.h"
#include "File.h"
#include "Image.h"
#include "MessageEvent.h"
#include "Notice.h"
#include "RoomInfoListItem.h"
#include "Text.h"
#include "AvatarProvider.h"
#include "MessageEvent.h"
#include "RoomInfoListItem.h"
#include "TimelineViewManager.h"
class ImageItem;
class AudioItem;
class FileItem;
class Avatar;
@ -65,6 +69,7 @@ public:
// m.image
TimelineItem(ImageItem *item, const QString &userid, bool withSender, QWidget *parent = 0);
TimelineItem(FileItem *item, const QString &userid, bool withSender, QWidget *parent = 0);
TimelineItem(AudioItem *item, const QString &userid, bool withSender, QWidget *parent = 0);
TimelineItem(ImageItem *img,
const events::MessageEvent<msgs::Image> &e,
@ -74,6 +79,10 @@ public:
const events::MessageEvent<msgs::File> &e,
bool with_sender,
QWidget *parent);
TimelineItem(AudioItem *audio,
const events::MessageEvent<msgs::Audio> &e,
bool with_sender,
QWidget *parent);
void setUserAvatar(const QImage &pixmap);
DescInfo descriptionMessage() const { return descriptionMsg_; }
@ -93,6 +102,12 @@ private:
const QString &msgDescription,
bool withSender);
template<class Event, class Widget>
void setupWidgetLayout(Widget *widget,
const Event &event,
const QString &msgDescription,
bool withSender);
void generateBody(const QString &body);
void generateBody(const QString &userid, const QString &body);
void generateTimestamp(const QDateTime &time);
@ -153,3 +168,44 @@ TimelineItem::setupLocalWidgetLayout(Widget *widget,
mainLayout_->addLayout(widgetLayout);
}
template<class Event, class Widget>
void
TimelineItem::setupWidgetLayout(Widget *widget,
const Event &event,
const QString &msgDescription,
bool withSender)
{
init();
event_id_ = event.eventId();
auto timestamp = QDateTime::fromMSecsSinceEpoch(event.timestamp());
auto displayName = TimelineViewManager::displayName(event.sender());
QSettings settings;
descriptionMsg_ = {event.sender() == settings.value("auth/user_id") ? "You" : displayName,
event.sender(),
msgDescription,
descriptiveTime(QDateTime::fromMSecsSinceEpoch(event.timestamp()))};
generateTimestamp(timestamp);
auto widgetLayout = new QHBoxLayout();
widgetLayout->setContentsMargins(0, 5, 0, 0);
widgetLayout->addWidget(widget);
widgetLayout->addStretch(1);
if (withSender) {
generateBody(displayName, "");
setupAvatarLayout(displayName);
mainLayout_->addLayout(headerLayout_);
AvatarProvider::resolve(event.sender(), this);
} else {
setupSimpleLayout();
}
mainLayout_->addLayout(widgetLayout);
}

View File

@ -27,13 +27,16 @@
#include <QStyle>
#include <QStyleOption>
#include "Audio.h"
#include "Emote.h"
#include "File.h"
#include "Image.h"
#include "MatrixClient.h"
#include "MessageEvent.h"
#include "Notice.h"
#include "Text.h"
#include "Video.h"
#include "MatrixClient.h"
#include "MessageEvent.h"
#include "TimelineItem.h"
class FloatingButton;

View File

@ -0,0 +1,111 @@
/*
* nheko Copyright (C) 2017 Konstantinos Sideris <siderisk@auth.gr>
*
* This program is free software: you can redistribute it and/or modify
* it under the terms of the GNU General Public License as published by
* the Free Software Foundation, either version 3 of the License, or
* (at your option) any later version.
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU General Public License for more details.
*
* You should have received a copy of the GNU General Public License
* along with this program. If not, see <http://www.gnu.org/licenses/>.
*/
#pragma once
#include <QEvent>
#include <QIcon>
#include <QMediaPlayer>
#include <QMouseEvent>
#include <QSharedPointer>
#include <QWidget>
#include "Audio.h"
#include "MatrixClient.h"
#include "MessageEvent.h"
namespace events = matrix::events;
namespace msgs = matrix::events::messages;
class AudioItem : public QWidget
{
Q_OBJECT
Q_PROPERTY(QColor textColor WRITE setTextColor READ textColor)
Q_PROPERTY(QColor iconColor WRITE setIconColor READ iconColor)
Q_PROPERTY(QColor backgroundColor WRITE setBackgroundColor READ backgroundColor)
Q_PROPERTY(QColor durationBackgroundColor WRITE setDurationBackgroundColor READ
durationBackgroundColor)
Q_PROPERTY(QColor durationForegroundColor WRITE setDurationForegroundColor READ
durationForegroundColor)
public:
AudioItem(QSharedPointer<MatrixClient> client,
const events::MessageEvent<msgs::Audio> &event,
QWidget *parent = nullptr);
AudioItem(QSharedPointer<MatrixClient> client,
const QString &url,
const QString &filename,
QWidget *parent = nullptr);
QSize sizeHint() const override;
void setTextColor(const QColor &color) { textColor_ = color; }
void setIconColor(const QColor &color) { iconColor_ = color; }
void setBackgroundColor(const QColor &color) { backgroundColor_ = color; }
void setDurationBackgroundColor(const QColor &color) { durationBgColor_ = color; }
void setDurationForegroundColor(const QColor &color) { durationFgColor_ = color; }
QColor textColor() const { return textColor_; }
QColor iconColor() const { return iconColor_; }
QColor backgroundColor() const { return backgroundColor_; }
QColor durationBackgroundColor() const { return durationBgColor_; }
QColor durationForegroundColor() const { return durationFgColor_; }
protected:
void paintEvent(QPaintEvent *event) override;
void mousePressEvent(QMouseEvent *event) override;
private slots:
void fileDownloaded(const QString &event_id, const QByteArray &data);
private:
QString calculateFileSize(int nbytes) const;
void init();
enum class AudioState
{
Play,
Pause,
};
AudioState state_ = AudioState::Play;
QUrl url_;
QString text_;
QString readableFileSize_;
QString filenameToSave_;
events::MessageEvent<msgs::Audio> event_;
QSharedPointer<MatrixClient> client_;
QMediaPlayer *player_;
QIcon playIcon_;
QIcon pauseIcon_;
QColor textColor_ = QColor("white");
QColor iconColor_ = QColor("#38A3D8");
QColor backgroundColor_ = QColor("#333");
QColor durationBgColor_ = QColor("black");
QColor durationFgColor_ = QColor("blue");
};

View File

@ -30,18 +30,6 @@
namespace events = matrix::events;
namespace msgs = matrix::events::messages;
constexpr int MaxWidth = 400;
constexpr int Height = 70;
constexpr int IconRadius = 22;
constexpr int IconDiameter = IconRadius * 2;
constexpr int HorizontalPadding = 12;
constexpr int TextPadding = 15;
constexpr int DownloadIconRadius = IconRadius - 4;
constexpr double VerticalPadding = Height - 2 * IconRadius;
constexpr double IconYCenter = Height / 2;
constexpr double IconXCenter = HorizontalPadding + IconRadius;
class FileItem : public QWidget
{
Q_OBJECT

View File

Binary file not shown.

After

Width:  |  Height:  |  Size: 392 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 444 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 505 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 692 B

View File

@ -26,6 +26,10 @@
<file>icons/ui/angle-arrow-down@2x.png</file>
<file>icons/ui/arrow-pointing-down.png</file>
<file>icons/ui/arrow-pointing-down@2x.png</file>
<file>icons/ui/play-sign.png</file>
<file>icons/ui/play-sign@2x.png</file>
<file>icons/ui/pause-symbol.png</file>
<file>icons/ui/pause-symbol@2x.png</file>
<file>icons/emoji-categories/people.png</file>
<file>icons/emoji-categories/people@2x.png</file>

View File

@ -17,7 +17,6 @@
#include <QFontDatabase>
#include <QRegExp>
#include <QSettings>
#include <QTextEdit>
#include "Avatar.h"
@ -25,6 +24,7 @@
#include "Sync.h"
#include "timeline/TimelineItem.h"
#include "timeline/widgets/AudioItem.h"
#include "timeline/widgets/FileItem.h"
#include "timeline/widgets/ImageItem.h"
@ -128,47 +128,25 @@ TimelineItem::TimelineItem(FileItem *file, const QString &userid, bool withSende
setupLocalWidgetLayout<FileItem>(file, userid, "sent a file", withSender);
}
/*
* Used to display images. The avatar and the username are displayed.
*/
TimelineItem::TimelineItem(AudioItem *audio,
const QString &userid,
bool withSender,
QWidget *parent)
: QWidget{parent}
{
init();
setupLocalWidgetLayout<AudioItem>(audio, userid, "sent an audio clip", withSender);
}
TimelineItem::TimelineItem(ImageItem *image,
const events::MessageEvent<msgs::Image> &event,
bool with_sender,
QWidget *parent)
: QWidget(parent)
{
init();
event_id_ = event.eventId();
auto timestamp = QDateTime::fromMSecsSinceEpoch(event.timestamp());
auto displayName = TimelineViewManager::displayName(event.sender());
QSettings settings;
descriptionMsg_ = {event.sender() == settings.value("auth/user_id") ? "You" : displayName,
event.sender(),
" sent an image",
descriptiveTime(QDateTime::fromMSecsSinceEpoch(event.timestamp()))};
generateTimestamp(timestamp);
auto imageLayout = new QHBoxLayout();
imageLayout->setContentsMargins(0, 5, 0, 0);
imageLayout->addWidget(image);
imageLayout->addStretch(1);
if (with_sender) {
generateBody(displayName, "");
setupAvatarLayout(displayName);
mainLayout_->addLayout(headerLayout_);
AvatarProvider::resolve(event.sender(), this);
} else {
setupSimpleLayout();
}
mainLayout_->addLayout(imageLayout);
setupWidgetLayout<events::MessageEvent<msgs::Image>, ImageItem>(
image, event, " sent an image", with_sender);
}
TimelineItem::TimelineItem(FileItem *file,
@ -177,38 +155,18 @@ TimelineItem::TimelineItem(FileItem *file,
QWidget *parent)
: QWidget(parent)
{
init();
setupWidgetLayout<events::MessageEvent<msgs::File>, FileItem>(
file, event, " sent a file", with_sender);
}
event_id_ = event.eventId();
auto timestamp = QDateTime::fromMSecsSinceEpoch(event.timestamp());
auto displayName = TimelineViewManager::displayName(event.sender());
QSettings settings;
descriptionMsg_ = {event.sender() == settings.value("auth/user_id") ? "You" : displayName,
event.sender(),
" sent a file",
descriptiveTime(QDateTime::fromMSecsSinceEpoch(event.timestamp()))};
generateTimestamp(timestamp);
auto fileLayout = new QHBoxLayout();
fileLayout->setContentsMargins(0, 5, 0, 0);
fileLayout->addWidget(file);
fileLayout->addStretch(1);
if (with_sender) {
generateBody(displayName, "");
setupAvatarLayout(displayName);
mainLayout_->addLayout(headerLayout_);
AvatarProvider::resolve(event.sender(), this);
} else {
setupSimpleLayout();
}
mainLayout_->addLayout(fileLayout);
TimelineItem::TimelineItem(AudioItem *audio,
const events::MessageEvent<msgs::Audio> &event,
bool with_sender,
QWidget *parent)
: QWidget(parent)
{
setupWidgetLayout<events::MessageEvent<msgs::Audio>, AudioItem>(
audio, event, " sent an audio clip", with_sender);
}
/*

View File

@ -25,8 +25,10 @@
#include "Sync.h"
#include "timeline/TimelineView.h"
#include "timeline/widgets/AudioItem.h"
#include "timeline/widgets/FileItem.h"
#include "timeline/widgets/ImageItem.h"
#include "timeline/widgets/VideoItem.h"
namespace events = matrix::events;
namespace msgs = matrix::events::messages;
@ -229,22 +231,25 @@ TimelineView::parseMessageEvent(const QJsonObject &event, TimelineDirection dire
if (ty == events::EventType::RoomMessage) {
events::MessageEventType msg_type = events::extractMessageEventType(event);
using Audio = events::MessageEvent<msgs::Audio>;
using Emote = events::MessageEvent<msgs::Emote>;
using File = events::MessageEvent<msgs::File>;
using Image = events::MessageEvent<msgs::Image>;
using Notice = events::MessageEvent<msgs::Notice>;
using Text = events::MessageEvent<msgs::Text>;
if (msg_type == events::MessageEventType::Text) {
return processMessageEvent<Text>(event, direction);
} else if (msg_type == events::MessageEventType::Notice) {
return processMessageEvent<Notice>(event, direction);
} else if (msg_type == events::MessageEventType::Image) {
return processMessageEvent<Image, ImageItem>(event, direction);
if (msg_type == events::MessageEventType::Audio) {
return processMessageEvent<Audio, AudioItem>(event, direction);
} else if (msg_type == events::MessageEventType::Emote) {
return processMessageEvent<Emote>(event, direction);
} else if (msg_type == events::MessageEventType::File) {
return processMessageEvent<File, FileItem>(event, direction);
} else if (msg_type == events::MessageEventType::Image) {
return processMessageEvent<Image, ImageItem>(event, direction);
} else if (msg_type == events::MessageEventType::Notice) {
return processMessageEvent<Notice>(event, direction);
} else if (msg_type == events::MessageEventType::Text) {
return processMessageEvent<Text>(event, direction);
} else if (msg_type == events::MessageEventType::Unknown) {
// TODO Handle redacted messages.
// Silenced for now.

View File

@ -0,0 +1,237 @@
/*
* nheko Copyright (C) 2017 Konstantinos Sideris <siderisk@auth.gr>
*
* This program is free software: you can redistribute it and/or modify
* it under the terms of the GNU General Public License as published by
* the Free Software Foundation, either version 3 of the License, or
* (at your option) any later version.
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU General Public License for more details.
*
* You should have received a copy of the GNU General Public License
* along with this program. If not, see <http://www.gnu.org/licenses/>.
*/
#include <QBrush>
#include <QDebug>
#include <QDesktopServices>
#include <QFile>
#include <QFileDialog>
#include <QFileInfo>
#include <QPainter>
#include <QPixmap>
#include "timeline/widgets/AudioItem.h"
namespace events = matrix::events;
namespace msgs = matrix::events::messages;
constexpr int MaxWidth = 400;
constexpr int Height = 70;
constexpr int IconRadius = 22;
constexpr int IconDiameter = IconRadius * 2;
constexpr int HorizontalPadding = 12;
constexpr int TextPadding = 15;
constexpr int ActionIconRadius = IconRadius - 4;
constexpr double VerticalPadding = Height - 2 * IconRadius;
constexpr double IconYCenter = Height / 2;
constexpr double IconXCenter = HorizontalPadding + IconRadius;
void
AudioItem::init()
{
setMouseTracking(true);
setCursor(Qt::PointingHandCursor);
setAttribute(Qt::WA_Hover, true);
playIcon_.addFile(":/icons/icons/ui/play-sign.png");
pauseIcon_.addFile(":/icons/icons/ui/pause-symbol.png");
QList<QString> url_parts = url_.toString().split("mxc://");
if (url_parts.size() != 2) {
qDebug() << "Invalid format for image" << url_.toString();
return;
}
QString media_params = url_parts[1];
url_ = QString("%1/_matrix/media/r0/download/%2")
.arg(client_.data()->getHomeServer().toString(), media_params);
player_ = new QMediaPlayer;
player_->setMedia(QUrl(url_));
player_->setVolume(100);
player_->setNotifyInterval(1000);
connect(client_.data(), &MatrixClient::fileDownloaded, this, &AudioItem::fileDownloaded);
connect(player_, &QMediaPlayer::stateChanged, this, [=](QMediaPlayer::State state) {
if (state == QMediaPlayer::StoppedState) {
state_ = AudioState::Play;
player_->setMedia(QUrl(url_));
update();
}
});
}
AudioItem::AudioItem(QSharedPointer<MatrixClient> client,
const events::MessageEvent<msgs::Audio> &event,
QWidget *parent)
: QWidget(parent)
, url_{event.msgContent().url()}
, text_{event.content().body()}
, event_{event}
, client_{client}
{
readableFileSize_ = calculateFileSize(event.msgContent().info().size);
init();
}
AudioItem::AudioItem(QSharedPointer<MatrixClient> client,
const QString &url,
const QString &filename,
QWidget *parent)
: QWidget(parent)
, url_{url}
, text_{QFileInfo(filename).fileName()}
, client_{client}
{
readableFileSize_ = calculateFileSize(QFileInfo(filename).size());
init();
}
QString
AudioItem::calculateFileSize(int nbytes) const
{
if (nbytes < 1024)
return QString("%1 B").arg(nbytes);
if (nbytes < 1024 * 1024)
return QString("%1 KB").arg(nbytes / 1024);
return QString("%1 MB").arg(nbytes / 1024 / 1024);
}
QSize
AudioItem::sizeHint() const
{
return QSize(MaxWidth, Height);
}
void
AudioItem::mousePressEvent(QMouseEvent *event)
{
if (event->button() != Qt::LeftButton)
return;
auto point = event->pos();
// Click on the download icon.
if (QRect(HorizontalPadding, VerticalPadding / 2, IconDiameter, IconDiameter)
.contains(point)) {
if (state_ == AudioState::Play) {
state_ = AudioState::Pause;
player_->play();
} else {
state_ = AudioState::Play;
player_->pause();
}
update();
} else {
filenameToSave_ = QFileDialog::getSaveFileName(this, tr("Save File"), text_);
if (filenameToSave_.isEmpty())
return;
client_->downloadFile(event_.eventId(), url_);
}
}
void
AudioItem::fileDownloaded(const QString &event_id, const QByteArray &data)
{
if (event_id != event_.eventId())
return;
try {
QFile file(filenameToSave_);
if (!file.open(QIODevice::WriteOnly))
return;
file.write(data);
file.close();
} catch (const std::exception &ex) {
qDebug() << "Error while saving file to:" << ex.what();
}
}
void
AudioItem::paintEvent(QPaintEvent *event)
{
Q_UNUSED(event);
QPainter painter(this);
painter.setRenderHint(QPainter::Antialiasing);
QFont font("Open Sans");
font.setPixelSize(12);
font.setWeight(80);
QFontMetrics fm(font);
int computedWidth = std::min(
fm.width(text_) + 2 * IconRadius + VerticalPadding * 2 + TextPadding, (double)MaxWidth);
QPainterPath path;
path.addRoundedRect(QRectF(0, 0, computedWidth, Height), 10, 10);
painter.setPen(Qt::NoPen);
painter.fillPath(path, backgroundColor_);
painter.drawPath(path);
QPainterPath circle;
circle.addEllipse(QPoint(IconXCenter, IconYCenter), IconRadius, IconRadius);
painter.setPen(Qt::NoPen);
painter.fillPath(circle, iconColor_);
painter.drawPath(circle);
QIcon icon_;
if (state_ == AudioState::Play)
icon_ = playIcon_;
else
icon_ = pauseIcon_;
icon_.paint(&painter,
QRect(IconXCenter - ActionIconRadius / 2,
IconYCenter - ActionIconRadius / 2,
ActionIconRadius,
ActionIconRadius),
Qt::AlignCenter,
QIcon::Normal);
const int textStartX = HorizontalPadding + 2 * IconRadius + TextPadding;
const int textStartY = VerticalPadding + fm.ascent() / 2;
// Draw the filename.
QString elidedText =
fm.elidedText(text_,
Qt::ElideRight,
computedWidth - HorizontalPadding * 2 - TextPadding - 2 * IconRadius);
painter.setFont(font);
painter.setPen(QPen(textColor_));
painter.drawText(QPoint(textStartX, textStartY), elidedText);
// Draw the filesize.
font.setWeight(50);
painter.setFont(font);
painter.setPen(QPen(textColor_));
painter.drawText(QPoint(textStartX, textStartY + 1.5 * fm.ascent()), readableFileSize_);
}

View File

@ -29,6 +29,18 @@
namespace events = matrix::events;
namespace msgs = matrix::events::messages;
constexpr int MaxWidth = 400;
constexpr int Height = 70;
constexpr int IconRadius = 22;
constexpr int IconDiameter = IconRadius * 2;
constexpr int HorizontalPadding = 12;
constexpr int TextPadding = 15;
constexpr int DownloadIconRadius = IconRadius - 4;
constexpr double VerticalPadding = Height - 2 * IconRadius;
constexpr double IconYCenter = Height / 2;
constexpr double IconXCenter = HorizontalPadding + IconRadius;
void
FileItem::init()
{

View File