diff --git a/static/css/styles(boris).css b/static/css/styles(boris).css index be86704..457bc8d 100644 --- a/static/css/styles(boris).css +++ b/static/css/styles(boris).css @@ -666,6 +666,30 @@ border-radius: 10px; } +/*file classes*/ + +.file_border_cont{ + padding: 5%; + width: 95%; + height: 100%; +} + +.left_part_file_w{ + width: 20%; + height: 100%; + float: left; +} + +.right_part_file_w{ + width: 80%; + height: 100%; + color: #FFFFFF; + font-size: 14px; + float: right; +} + +/*end*/ + .container_text_message.left{ border: 1px solid #FF613A; background: #FFFFFF; diff --git a/static/img/svg/download_file.svg b/static/img/svg/download_file.svg new file mode 100644 index 0000000..043f3b8 --- /dev/null +++ b/static/img/svg/download_file.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/js/user_profile(boris).js b/static/js/user_profile(boris).js index fb599c4..7094e83 100644 --- a/static/js/user_profile(boris).js +++ b/static/js/user_profile(boris).js @@ -117,23 +117,104 @@ function countLetters () { // // } -function attachFilemeassge (el,id_ticket=null,sender,receiver){ - let file = el.files[0]; - let reader = new FileReader(); +// function getBase64(file,el) { +// const reader = new FileReader() +// let file_new = null +// let file_new_p = new Promise(function () { +// reader.readAsDataURL(file) +// reader.onload = function () { +// file_new = JSON.stringify({ +// 'file': reader.result, +// 'file_type': el.type, +// 'file_name': el.name +// }) +// +// } +// +// }) +// file_new_p.then(function (){ +// return file_new +// }) +// } +// +// async function fileListToBase64(fileList) { +// const files_for_data = [] +// +// for (let i = 0; i < fileList.length; i++) { +// let el = fileList[i] +// files_for_data.push(getBase64(fileList[i],el)) +// } +// +// return await Promise.all(files_for_data) +// } +function getBase64(file,el) { + const reader = new FileReader() + return new Promise(resolve => { + reader.onload = ev => { + resolve(file_new = JSON.stringify({ + 'file': reader.result, + 'file_type': el.type, + 'file_name': el.name + }) + ) + } + reader.readAsDataURL(file) + }) +} + +async function fileListToBase64(fileList) { + // create function which return resolved promise + // with data:base64 string + + // here will be array of promisified functions + const promises = [] + // loop through fileList with for loop + for (let i = 0; i < fileList.length; i++) { + let el = fileList[i] + promises.push(getBase64(fileList[i],el)) + } + // array with base64 strings + return await Promise.all(promises) +} + +async function attachFilemeassge (el,id_ticket=null,sender,receiver){ + // let file = el.files[0]; + let fileList = el.files; + const files_for_data = await fileListToBase64(fileList) + let data = files_for_data + sendMessage(id_ticket,sender,receiver,data) + // let reader = new FileReader(); + // let mas_for_for_each = [] + + // for (let i = 0;i < el.files.length;i++){ + // let file_for_data_url_opert = el.files[i] + // + // reader.readAsDataURL(file_for_data_url_opert); + // reader.onload = function() { + // // console.log(reader.result); + // let file = JSON.stringify({ + // 'file': reader.result, + // 'file_type': el.files[i].type, + // 'file_name': el.files[i].name + // }) + // files_for_data.push(file) + // }; + // + // reader.onerror = function() { + // console.log(reader.error); + // }; + // + // } + + + + + - reader.readAsDataURL(file); - reader.onload = function() { - // console.log(reader.result); - let data = reader.result - sendMessage(id_ticket,sender,receiver,data,file) - }; - reader.onerror = function() { - console.log(reader.error); - }; } @@ -212,9 +293,9 @@ function selectedUserMessenger (ticket_id=null,user_id=null){ } -function sendMessage(id_ticket=null,sender,receiver,img_post=null,file=null){ +function sendMessage(id_ticket=null,sender,receiver,files=null){ // import {sendMessageSocket} from "./chat_sockets"; - if (!img_post){ + if (!files){ event.preventDefault() } let text = document.querySelector(".enter-message-inp").value @@ -222,7 +303,7 @@ function sendMessage(id_ticket=null,sender,receiver,img_post=null,file=null){ let img = document.querySelector(".attach-file-btn-message").dataset["file_img"] - if (img_post){ + if (files){ let data = {} if (id_ticket === null){ @@ -230,11 +311,7 @@ function sendMessage(id_ticket=null,sender,receiver,img_post=null,file=null){ 'sender': sender, 'receiver': receiver, 'text': '', - 'file': JSON.stringify({ - 'file': img_post, - 'file_type': file.type, - 'file_name': file.name - }) + 'files': files } } else { data = { @@ -242,11 +319,7 @@ function sendMessage(id_ticket=null,sender,receiver,img_post=null,file=null){ 'sender': sender, 'receiver': receiver, 'text': '', - 'file': JSON.stringify({ - 'file': img_post, - 'file_type': file.type, - 'file_name': file.name - }) + 'files': files } } diff --git a/templates/blocks/profile/b_chats.html b/templates/blocks/profile/b_chats.html index b8943ee..71ba611 100644 --- a/templates/blocks/profile/b_chats.html +++ b/templates/blocks/profile/b_chats.html @@ -62,7 +62,7 @@
{# #} - + {# #} diff --git a/templates/blocks/profile/b_messages_container.html b/templates/blocks/profile/b_messages_container.html index b7d5380..80ff672 100644 --- a/templates/blocks/profile/b_messages_container.html +++ b/templates/blocks/profile/b_messages_container.html @@ -1,7 +1,7 @@ {% load static %} - +{% include "widgets/w_file.html" %} {% if not messages and ticket %} {% include "widgets/w_message.html" %} {% else %} diff --git a/templates/widgets/w_file.html b/templates/widgets/w_file.html new file mode 100644 index 0000000..6e431ea --- /dev/null +++ b/templates/widgets/w_file.html @@ -0,0 +1,27 @@ +{% load static %} +{% load tt_chat %} + +
+
+
+ +
+
+
+
+
+ +
+
+
фывыфв
+
1234 кб
+
+
+
+
+
+ {% if msg %}{{ msg.modifiedDT }}{% else %}{{ ticket.modifiedDT }}{% endif %} +
+
+
+