This commit is contained in:
C0ffeeCode 2022-01-02 22:48:01 +01:00
parent 0f07692ccb
commit 22801c1b91
3 changed files with 15 additions and 17 deletions

@ -1 +0,0 @@
Subproject commit f30be878793407b02fad1e85676d4c1644a7c30c

View file

@ -2,12 +2,14 @@ import React from 'react';
import PropTypes from 'prop-types'; import PropTypes from 'prop-types';
import IconButton from '../../atoms/button/IconButton'; import IconButton from '../../atoms/button/IconButton';
import CirclePlusIC from '../../../../public/res/ic/outlined/circle-plus.svg'; import CirclePlusIC from '../../../../public/res/ic/outlined/circle-plus.svg';
import FileIC from '../../../../public/res/ic/outlined/file.svg';
import ContextMenu, { MenuHeader, MenuItem } from '../../atoms/context-menu/ContextMenu'; import ContextMenu, { MenuHeader, MenuItem } from '../../atoms/context-menu/ContextMenu';
const AttachmentTypes = { const AttachmentTypes = {
remove: 'remove', remove: 'remove',
file: 'file', file: 'file',
voice: 'voice', voice: 'voice',
currentLocation: 'currentLocation',
}; };
function AttachmentTypeSelector({ alreadyHasAttachment, actOnAttaching }) { function AttachmentTypeSelector({ alreadyHasAttachment, actOnAttaching }) {
@ -21,6 +23,7 @@ function AttachmentTypeSelector({ alreadyHasAttachment, actOnAttaching }) {
onClick={() => { onClick={() => {
toggleMenu(); actOnAttaching(AttachmentTypes.file); toggleMenu(); actOnAttaching(AttachmentTypes.file);
}} }}
iconSrc={FileIC}
> >
File File
</MenuItem> </MenuItem>
@ -42,7 +45,7 @@ function AttachmentTypeSelector({ alreadyHasAttachment, actOnAttaching }) {
actOnAttaching(AttachmentTypes.remove); actOnAttaching(AttachmentTypes.remove);
} }
}} }}
tooltip={alreadyHasAttachment ? 'Upload' : 'Cancel'} tooltip={alreadyHasAttachment ? 'Cancel' : 'Select attachment'}
src={CirclePlusIC} src={CirclePlusIC}
/> />
)} )}

View file

@ -8,7 +8,7 @@ import TextareaAutosize from 'react-autosize-textarea';
import initMatrix from '../../../client/initMatrix'; import initMatrix from '../../../client/initMatrix';
import cons from '../../../client/state/cons'; import cons from '../../../client/state/cons';
import settings from '../../../client/state/settings'; import settings from '../../../client/state/settings';
import { openAttachmentTypeSelector, openEmojiBoard } from '../../../client/action/navigation'; import { openEmojiBoard } from '../../../client/action/navigation';
import navigation from '../../../client/state/navigation'; import navigation from '../../../client/state/navigation';
import { bytesToSize, getEventCords } from '../../../util/common'; import { bytesToSize, getEventCords } from '../../../util/common';
import { getUsername } from '../../../util/matrixUtil'; import { getUsername } from '../../../util/matrixUtil';
@ -20,7 +20,6 @@ import IconButton from '../../atoms/button/IconButton';
import ScrollView from '../../atoms/scroll/ScrollView'; import ScrollView from '../../atoms/scroll/ScrollView';
import { MessageReply } from '../../molecules/message/Message'; import { MessageReply } from '../../molecules/message/Message';
import CirclePlusIC from '../../../../public/res/ic/outlined/circle-plus.svg';
import EmojiIC from '../../../../public/res/ic/outlined/emoji.svg'; import EmojiIC from '../../../../public/res/ic/outlined/emoji.svg';
import SendIC from '../../../../public/res/ic/outlined/send.svg'; import SendIC from '../../../../public/res/ic/outlined/send.svg';
import ShieldIC from '../../../../public/res/ic/outlined/shield.svg'; import ShieldIC from '../../../../public/res/ic/outlined/shield.svg';
@ -293,15 +292,15 @@ function RoomViewInput({
function uploadFileChange(e) { function uploadFileChange(e) {
const file = e.target.files.item(0); const file = e.target.files.item(0);
setAttachment(file); setAttachment(file);
console.log(file);
if (file !== null) roomsInput.setAttachment(roomId, file); if (file !== null) roomsInput.setAttachment(roomId, file);
} }
const recordVoice = () => { const recordVoice = () => {
navigator.getUserMedia = navigator.getUserMedia // TODO: Check if supported
|| navigator.webkitGetUserMedia // navigator.getUserMedia = navigator.getUserMedia
|| navigator.mozGetUserMedia // || navigator.webkitGetUserMedia
|| navigator.msGetUserMedia; // || navigator.mozGetUserMedia
// || navigator.msGetUserMedia;
navigator.mediaDevices.getUserMedia({ audio: true }) navigator.mediaDevices.getUserMedia({ audio: true })
.then((stream) => { .then((stream) => {
@ -317,20 +316,17 @@ function RoomViewInput({
const opts = { type: 'audio/webm' }; const opts = { type: 'audio/webm' };
const audioBlob = new Blob(audioChunks, opts); const audioBlob = new Blob(audioChunks, opts);
audioBlob.text() const audioFile = new File([audioBlob], 'voicemail.webm', opts);
.then(() => {
const a = new File([audioBlob], 'voicemail.webm', opts);
console.log(a); setAttachment(audioFile);
roomsInput.setAttachment(roomId, a); roomsInput.setAttachment(roomId, audioFile);
});
}); });
setTimeout(() => { setTimeout(() => {
mediaRecorder.stop(); mediaRecorder.stop();
}, 5000); // 1 hour 3600000 }, 5000); // 1 hour 3600000
}) })
.catch((e) => console.log(e)); .catch(console.log);
}; };
const handleAttachmentTypeSelectorReturn = (ret) => { const handleAttachmentTypeSelectorReturn = (ret) => {
@ -364,7 +360,6 @@ function RoomViewInput({
<div className={`room-input__option-container${attachment === null ? '' : ' room-attachment__option'}`}> <div className={`room-input__option-container${attachment === null ? '' : ' room-attachment__option'}`}>
<AttachmentTypeSelector <AttachmentTypeSelector
ref={uploadInputRef} ref={uploadInputRef}
tooltip={attachment === null ? 'Upload' : 'Cancel'}
actOnAttaching={handleAttachmentTypeSelectorReturn} actOnAttaching={handleAttachmentTypeSelectorReturn}
alreadyHasAttachment={attachment !== null} alreadyHasAttachment={attachment !== null}
/> />
@ -407,6 +402,7 @@ function RoomViewInput({
function attachFile() { function attachFile() {
const fileType = attachment.type.slice(0, attachment.type.indexOf('/')); const fileType = attachment.type.slice(0, attachment.type.indexOf('/'));
console.log(attachment.type);
return ( return (
<div className="room-attachment"> <div className="room-attachment">
<div className={`room-attachment__preview${fileType !== 'image' ? ' room-attachment__icon' : ''}`}> <div className={`room-attachment__preview${fileType !== 'image' ? ' room-attachment__icon' : ''}`}>