diff --git a/src/components/fileUpload.vue b/src/components/fileUpload.vue
new file mode 100644
index 0000000..5c779c8
--- /dev/null
+++ b/src/components/fileUpload.vue
@@ -0,0 +1,62 @@
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/src/components/newMessage.vue b/src/components/newMessage.vue
index 530e172..93a8d6c 100644
--- a/src/components/newMessage.vue
+++ b/src/components/newMessage.vue
@@ -18,33 +18,14 @@
rows="1" placeholder="type a message ..."
/>
-
+
-
-
+
{
- this.recorder.init(stream);
- this.recorder.start().then(()=>this.isRecording=true);
- })
- .catch(err => console.log('unable to get stream', err));
- },
- stopRecording(){
- this.recorder.stop()
- .then(({blob}) => {
- this.isRecording=false;
- blob.name = `Recording-${new Date().toISOString()}.${blob.type.split('/')[1]}`;
- this.setAttachment({blob});
- });
- },
- setVoiceMeter(value){
- if (!this.$refs.stopRecord) return;
- this.$refs.voiceMeter.style.height = `calc(3rem + ${value/4}px`;
- this.$refs.voiceMeter.style.width = `calc(3rem + ${value/4}px`;
- },
- async readFile(file){
- return await new Promise(resolve => {
- let reader = new FileReader();
- reader.onerror = console.error;
- reader.onload = async event => {
- resolve(await (await fetch(event.target.result)).blob());
- }
- reader.readAsDataURL(file);
- });
+ getRecordingState(){
+ return this.$refs.recorder && this.$refs.recorder.isRecording
},
async setAttachment({blob, file = blob}){
this.attachment = {
msgtype: this.getMsgType(file.type),
mimetype: file.type,
url: window.URL.createObjectURL(file),
- blob: blob || await this.readFile(file),
filename: file.name,
+ blob,
file
};
this.event.content = {
@@ -196,7 +142,7 @@ export default {
if (!this.attachment) return;
window.URL.revokeObjectURL(this.attachment.file);
this.event.content = {
- body: this.attachment?this.event.content.body.replace(this.attachment.file.name, ''):'',
+ body: this.attachment?this.event.content.body.replace(this.attachment.filename, ''):'',
msgtype: 'm.text'
};
this.attachment = undefined;
@@ -225,11 +171,6 @@ export default {
},
showEmojiPicker: false,
waitForSendTyping: false,
- recorder: new Recorder(audioContext, {
- onAnalysed: data => this.setVoiceMeter(data.lineTo)
- }),
- isRecording: false,
- recBlob: undefined,
attachment: undefined,
eventProxyHandler: {
set: () => true,
@@ -320,48 +261,12 @@ export default {
width: 2.5rem;
box-shadow: none;
}
-.emojiToggle{
-}
-.recordBtn{
- position: absolute;
- right: 1rem;
- bottom: 0.25rem;
- background-color: #1d1d1d;
- border-radius: 50%;
-}
-.recordBtn.stop{
- right: 0;
- bottom: 0;
- background-color: #c63e3e;
- box-shadow: none;
-}
-.voiceMeter{
- position: absolute;
- background-color: #fff;
- top: 50%;
- left: 50%;
- transform: translate(-50%,-50%);
- border-radius: 50%;
- box-shadow: 3px 3px 10px #111;
-}
-.voiceMeterContainer{
- position: absolute;
- height: 3rem;
- width: 3rem;
- bottom: 0.25rem;
- right: 1rem;
-}
.recorder{
position: absolute;
height: 100%;
- width: 8rem;
bottom: 0;
right: 0;
border-radius: 0 1rem 0 0;
- overflow: hidden;
-}
-#fileInput{
- display: none;
}
.attachment{
top: 0.5rem;
diff --git a/src/components/soundRecorder.vue b/src/components/soundRecorder.vue
new file mode 100644
index 0000000..52bef27
--- /dev/null
+++ b/src/components/soundRecorder.vue
@@ -0,0 +1,114 @@
+
+
+
+
+
+
+
\ No newline at end of file