diff --git a/osinaweb/db.sqlite3 b/osinaweb/db.sqlite3 index b864a39c..33eb2928 100644 Binary files a/osinaweb/db.sqlite3 and b/osinaweb/db.sqlite3 differ diff --git a/osinaweb/osichat/__pycache__/consumers.cpython-310.pyc b/osinaweb/osichat/__pycache__/consumers.cpython-310.pyc index b66b1e0a..dfd9a270 100644 Binary files a/osinaweb/osichat/__pycache__/consumers.cpython-310.pyc and b/osinaweb/osichat/__pycache__/consumers.cpython-310.pyc differ diff --git a/osinaweb/osichat/consumers.py b/osinaweb/osichat/consumers.py index 5929236b..cd16fbd1 100644 --- a/osinaweb/osichat/consumers.py +++ b/osinaweb/osichat/consumers.py @@ -235,7 +235,7 @@ class OsitcomChatRoom(WebsocketConsumer): 'html': html, })) else: - if event.get('reconnecting') == 'False': + if event.get('reconnecting') == 'False': #Connecting for the first time html = render_to_string("chat-widget.html", context=context) else: if chat_room: diff --git a/osinaweb/osichat/templates/chat-room.html b/osinaweb/osichat/templates/chat-room.html index 6966c2a6..cf27f59d 100644 --- a/osinaweb/osichat/templates/chat-room.html +++ b/osinaweb/osichat/templates/chat-room.html @@ -2,13 +2,13 @@ -
+
+ class="w-[25px] h-[25px] rounded-full shadow-md text-white flex justify-center items-center bg-osiblue"> @@ -31,23 +31,22 @@
+ class="max-w-[80%] bg-gray-50 px-4 py-3 rounded-r-3xl rounded-tl-3xl text-secondosiblue text-sm leading-7 bg-opacity-50 shadow-md border border-gray-100">

{% if chat_room.chatroomguest.name %}Hello {{chat_room.chatroomguest.name}},{% else %}Hello,{% endif %} thank you for contacting us. Please bear with us while we connect you with the next available agent as soon as possible.

-
+
{% for message in chat_room_messages %} {% if message.member %} - {% if not message.chatmessageattachment %}
+ class="w-[25px] h-[25px] rounded-full shadow-md text-white flex justify-center items-center bg-osiblue uppercase text-xs"> {% if message.member.staffprofile.image %} @@ -56,72 +55,79 @@ {% endif %}
-
-

{{message.content}}

-
-
- {% else %} - {% if message.chatmessageattachment.is_image %} -
- -
- {% else %} -
-
-
- - - - - + {% if not message.chatmessageattachment %} +
+

{{message.content}}

+
+ {% else %} + {% if message.chatmessageattachment.is_image %} +
+
-
- {{message.chatmessageattachment.file_name}} + {% else %} +
+
+
+ + + + + +
+
+ {{message.chatmessageattachment.file_name}} +
+
-
-
- {% endif %} - {% endif %} + {% endif %} + {% endif %} +
+ {% else %} {% if not message.chatmessageattachment %}
-

{{message.content}}

+ class="max-w-[80%] px-4 py-3 rounded-l-3xl rounded-tr-3xl text-white shadow-md text-sm leading-6 bg-opacity-70 bg-osiblue"> +

{{message.content}}

{% else %} {% if message.chatmessageattachment.is_image %} -
- +
+
+
+
{% else %} -
+
+
- +
- {{message.chatmessageattachment.file_name}} + {{message.chatmessageattachment.file_name}}
+
{% endif %} {% endif %} {% endif %} {% endfor %}
- + -
-
+
diff --git a/osinaweb/osichat/templates/chat-widget.html b/osinaweb/osichat/templates/chat-widget.html index b83cfb75..a53914bb 100644 --- a/osinaweb/osichat/templates/chat-widget.html +++ b/osinaweb/osichat/templates/chat-widget.html @@ -39,6 +39,34 @@
+ + + + + + + +
{% if chat_room %} {% include 'chat-room.html' %} diff --git a/osinaweb/osichat/templates/partials/message-attachment.html b/osinaweb/osichat/templates/partials/message-attachment.html index e4316856..1a969319 100644 --- a/osinaweb/osichat/templates/partials/message-attachment.html +++ b/osinaweb/osichat/templates/partials/message-attachment.html @@ -1,42 +1,61 @@ {% if message_attachment.message.member %} - {% if file_type == 'image' %} -
- -
- {% else %} -
-
-
- - - - - -
-
- {{message_attachment.file_name}} -
+
+
+
+ {% if message_attachment.message.member.staffprofile.image %} + + {% else %} +

{{message_attachment.message.member.first_name.0}}{{message_attachment.message.member.last_name.0}}

+ {% endif %}
- {% endif %} - + {% if file_type == 'image' %} +
+ +
+ {% else %} +
+
+
+ + + + + +
+
+ {{message_attachment.file_name}} +
+
+
+ {% endif %} +
+ {% else %} {% if file_type == 'image' %} -
- -
+
+
+ +
+
{% else %} -
-
-
- - - - - -
-
- {{message_attachment.file_name}} +
+
+
+
+ + + + + +
+
+ {{message_attachment.file_name}} +
diff --git a/osinaweb/osichat/templates/partials/message.html b/osinaweb/osichat/templates/partials/message.html index 6f0e18a1..2ba53375 100644 --- a/osinaweb/osichat/templates/partials/message.html +++ b/osinaweb/osichat/templates/partials/message.html @@ -1,36 +1,80 @@ {% if chat_message.member %} -
-
-
- {% if chat_message.member.staffprofile.image %} - +
+
+
+ {% if chat_message.member.staffprofile.image %} + + {% else %} +

{{chat_message.member.first_name.0}}{{chat_message.member.last_name.0}}

+ {% endif %} +
+
+ {% if not chat_message.chatmessageattachment %} +
+

{{chat_message.content}}

+
+ {% else %} + {% if chat_message.chatmessageattachment.is_image %} +
+ +
{% else %} -

{{chat_message.member.first_name.0}}{{chat_message.member.last_name.0}}

+
+
+
+ + + + + +
+
+ {{chat_message.chatmessageattachment.file_name}} +
+
+
{% endif %} -
-
-
-

{{chat_message.content}}

-
-
-{% else %} -
-
-

{{chat_message.content}}

+ {% endif %}
-
-{% endif %} - + +{% else %} + {% if not chat_message.chatmessageattachment %} +
+
+

{{chat_message.content}}

+
+
+ {% else %} + {% if chat_message.chatmessageattachment.is_image %} +
+
+ +
+
+ {% else %} +
+
+
+
+ + + + + +
+
+ {{chat_message.chatmessageattachment.file_name}} +
+
+
+
+ {% endif %} + {% endif %} +{% endif %} \ No newline at end of file diff --git a/osinaweb/osichat/templates/partials/typing.html b/osinaweb/osichat/templates/partials/typing.html index 6053471c..be843fae 100644 --- a/osinaweb/osichat/templates/partials/typing.html +++ b/osinaweb/osichat/templates/partials/typing.html @@ -10,9 +10,9 @@
-
-
-
+
+
+
diff --git a/osinaweb/osichat/templates/start-chat.html b/osinaweb/osichat/templates/start-chat.html index 94228cb6..3ce60920 100644 --- a/osinaweb/osichat/templates/start-chat.html +++ b/osinaweb/osichat/templates/start-chat.html @@ -1,6 +1,6 @@ {% load static %} -
+
diff --git a/osinaweb/static/dist/output.css b/osinaweb/static/dist/output.css index 762d2151..cf970409 100644 --- a/osinaweb/static/dist/output.css +++ b/osinaweb/static/dist/output.css @@ -991,6 +991,14 @@ video { display: none; } +.h-1 { + height: 0.25rem; +} + +.h-1\.5 { + height: 0.375rem; +} + .h-10 { height: 2.5rem; } @@ -1180,10 +1188,6 @@ video { height: 100vh; } -.h-1 { - height: 0.25rem; -} - .max-h-\[200px\] { max-height: 200px; } @@ -1204,6 +1208,14 @@ video { min-height: 500px; } +.w-1 { + width: 0.25rem; +} + +.w-1\.5 { + width: 0.375rem; +} + .w-10 { width: 2.5rem; } @@ -1417,10 +1429,6 @@ video { width: 100%; } -.w-1 { - width: 0.25rem; -} - .min-w-full { min-width: 100%; } @@ -1433,6 +1441,10 @@ video { max-width: 48rem; } +.max-w-\[80\%\] { + max-width: 80%; +} + .max-w-full { max-width: 100%; } @@ -2178,6 +2190,10 @@ video { --tw-gradient-to: #fff var(--tw-gradient-to-position); } +.fill-blue-600 { + fill: #2563eb; +} + .fill-osiblue { fill: #20336b; } @@ -2186,10 +2202,6 @@ video { fill: #374a7a; } -.fill-blue-600 { - fill: #2563eb; -} - .object-cover { -o-object-fit: cover; object-fit: cover; @@ -3496,8 +3508,8 @@ video { display: none; } - .md\:h-\[500px\] { - height: 500px; + .md\:h-\[450px\] { + height: 450px; } .md\:h-fit { @@ -3505,14 +3517,6 @@ video { height: fit-content; } - .md\:h-\[50px\] { - height: 50px; - } - - .md\:h-\[550px\] { - height: 550px; - } - .md\:w-\[250px\] { width: 250px; } @@ -3550,16 +3554,16 @@ video { border-radius: 0.375rem; } - .md\:rounded-t-md { - border-top-left-radius: 0.375rem; - border-top-right-radius: 0.375rem; - } - .md\:rounded-b-md { border-bottom-right-radius: 0.375rem; border-bottom-left-radius: 0.375rem; } + .md\:rounded-t-md { + border-top-left-radius: 0.375rem; + border-top-right-radius: 0.375rem; + } + .md\:text-3xl { font-size: 1.875rem; line-height: 2.25rem; @@ -3635,6 +3639,10 @@ video { display: none; } + .lg\:h-\[550px\] { + height: 550px; + } + .lg\:w-\[480px\] { width: 480px; } diff --git a/osinaweb/static/images/uploaded_chat_files/Classic-Car-Database-by-Teoalida-SAMPLE.xlsx b/osinaweb/static/images/uploaded_chat_files/Classic-Car-Database-by-Teoalida-SAMPLE.xlsx new file mode 100644 index 00000000..90c5397a Binary files /dev/null and b/osinaweb/static/images/uploaded_chat_files/Classic-Car-Database-by-Teoalida-SAMPLE.xlsx differ diff --git a/osinaweb/static/images/uploaded_chat_files/IMG_3174.png b/osinaweb/static/images/uploaded_chat_files/IMG_3174.png new file mode 100644 index 00000000..8e86d3e9 Binary files /dev/null and b/osinaweb/static/images/uploaded_chat_files/IMG_3174.png differ diff --git a/osinaweb/static/images/uploaded_chat_files/Screenshot 2024-07-29 at 3.46.14 PM.png b/osinaweb/static/images/uploaded_chat_files/Screenshot 2024-07-29 at 3.46.14 PM.png new file mode 100644 index 00000000..dddc80d2 Binary files /dev/null and b/osinaweb/static/images/uploaded_chat_files/Screenshot 2024-07-29 at 3.46.14 PM.png differ diff --git a/osinaweb/static/images/uploaded_chat_files/Screenshot 2024-07-31 at 10.10.29 AM_4.png b/osinaweb/static/images/uploaded_chat_files/Screenshot 2024-07-31 at 10.10.29 AM_4.png new file mode 100644 index 00000000..38e88b88 Binary files /dev/null and b/osinaweb/static/images/uploaded_chat_files/Screenshot 2024-07-31 at 10.10.29 AM_4.png differ diff --git a/osinaweb/static/images/uploaded_chat_files/Screenshot 2024-07-31 at 10.10.29 AM_5.png b/osinaweb/static/images/uploaded_chat_files/Screenshot 2024-07-31 at 10.10.29 AM_5.png new file mode 100644 index 00000000..38e88b88 Binary files /dev/null and b/osinaweb/static/images/uploaded_chat_files/Screenshot 2024-07-31 at 10.10.29 AM_5.png differ diff --git a/osinaweb/static/images/uploaded_chat_files/Screenshot 2024-07-31 at 10.10.29 AM_6.png b/osinaweb/static/images/uploaded_chat_files/Screenshot 2024-07-31 at 10.10.29 AM_6.png new file mode 100644 index 00000000..38e88b88 Binary files /dev/null and b/osinaweb/static/images/uploaded_chat_files/Screenshot 2024-07-31 at 10.10.29 AM_6.png differ diff --git a/osinaweb/static/images/uploaded_chat_files/Screenshot 2024-07-31 at 12.54.43 PM_3.png b/osinaweb/static/images/uploaded_chat_files/Screenshot 2024-07-31 at 12.54.43 PM_3.png new file mode 100644 index 00000000..7c044759 Binary files /dev/null and b/osinaweb/static/images/uploaded_chat_files/Screenshot 2024-07-31 at 12.54.43 PM_3.png differ diff --git a/osinaweb/static/images/uploaded_chat_files/Screenshot 2024-07-31 at 12.54.43 PM_4.png b/osinaweb/static/images/uploaded_chat_files/Screenshot 2024-07-31 at 12.54.43 PM_4.png new file mode 100644 index 00000000..7c044759 Binary files /dev/null and b/osinaweb/static/images/uploaded_chat_files/Screenshot 2024-07-31 at 12.54.43 PM_4.png differ diff --git a/osinaweb/static/images/uploaded_chat_files/Screenshot 2024-07-31 at 12.54.43 PM_5.png b/osinaweb/static/images/uploaded_chat_files/Screenshot 2024-07-31 at 12.54.43 PM_5.png new file mode 100644 index 00000000..7c044759 Binary files /dev/null and b/osinaweb/static/images/uploaded_chat_files/Screenshot 2024-07-31 at 12.54.43 PM_5.png differ diff --git a/osinaweb/static/images/uploaded_chat_files/Screenshot 2024-07-31 at 12.54.43 PM_6.png b/osinaweb/static/images/uploaded_chat_files/Screenshot 2024-07-31 at 12.54.43 PM_6.png new file mode 100644 index 00000000..7c044759 Binary files /dev/null and b/osinaweb/static/images/uploaded_chat_files/Screenshot 2024-07-31 at 12.54.43 PM_6.png differ diff --git a/osinaweb/static/images/uploaded_chat_files/Screenshot 2024-07-31 at 12.54.43 PM_7.png b/osinaweb/static/images/uploaded_chat_files/Screenshot 2024-07-31 at 12.54.43 PM_7.png new file mode 100644 index 00000000..7c044759 Binary files /dev/null and b/osinaweb/static/images/uploaded_chat_files/Screenshot 2024-07-31 at 12.54.43 PM_7.png differ diff --git a/osinaweb/static/images/uploaded_chat_files/Screenshot 2024-08-01 at 3.28.50 PM.png b/osinaweb/static/images/uploaded_chat_files/Screenshot 2024-08-01 at 3.28.50 PM.png new file mode 100644 index 00000000..13a2626a Binary files /dev/null and b/osinaweb/static/images/uploaded_chat_files/Screenshot 2024-08-01 at 3.28.50 PM.png differ diff --git a/osinaweb/static/images/uploaded_chat_files/Screenshot 2024-08-01 at 3.28.59 PM.png b/osinaweb/static/images/uploaded_chat_files/Screenshot 2024-08-01 at 3.28.59 PM.png new file mode 100644 index 00000000..14497981 Binary files /dev/null and b/osinaweb/static/images/uploaded_chat_files/Screenshot 2024-08-01 at 3.28.59 PM.png differ diff --git a/osinaweb/static/images/uploaded_chat_files/daralothman-family-tree_4.docx b/osinaweb/static/images/uploaded_chat_files/daralothman-family-tree_4.docx new file mode 100644 index 00000000..62027f86 Binary files /dev/null and b/osinaweb/static/images/uploaded_chat_files/daralothman-family-tree_4.docx differ diff --git a/osinaweb/static/images/uploaded_chat_files/daralothman-family-tree_5.docx b/osinaweb/static/images/uploaded_chat_files/daralothman-family-tree_5.docx new file mode 100644 index 00000000..62027f86 Binary files /dev/null and b/osinaweb/static/images/uploaded_chat_files/daralothman-family-tree_5.docx differ diff --git a/osinaweb/static/images/uploaded_chat_files/daralothman-family-tree_6.docx b/osinaweb/static/images/uploaded_chat_files/daralothman-family-tree_6.docx new file mode 100644 index 00000000..62027f86 Binary files /dev/null and b/osinaweb/static/images/uploaded_chat_files/daralothman-family-tree_6.docx differ diff --git a/osinaweb/static/images/uploaded_chat_files/daralothman-family-tree_7.docx b/osinaweb/static/images/uploaded_chat_files/daralothman-family-tree_7.docx new file mode 100644 index 00000000..62027f86 Binary files /dev/null and b/osinaweb/static/images/uploaded_chat_files/daralothman-family-tree_7.docx differ diff --git a/osinaweb/static/images/uploaded_chat_files/daralothman-family-tree_8.docx b/osinaweb/static/images/uploaded_chat_files/daralothman-family-tree_8.docx new file mode 100644 index 00000000..62027f86 Binary files /dev/null and b/osinaweb/static/images/uploaded_chat_files/daralothman-family-tree_8.docx differ diff --git a/osinaweb/static/images/uploaded_chat_files/daralothman-family-tree_9.docx b/osinaweb/static/images/uploaded_chat_files/daralothman-family-tree_9.docx new file mode 100644 index 00000000..62027f86 Binary files /dev/null and b/osinaweb/static/images/uploaded_chat_files/daralothman-family-tree_9.docx differ diff --git a/osinaweb/static/images/uploaded_chat_files/image_picker_904A1F47-01E6-45A7-B92F-653F056E80C4-88858-00000094FBC3B8ED.jpg b/osinaweb/static/images/uploaded_chat_files/image_picker_904A1F47-01E6-45A7-B92F-653F056E80C4-88858-00000094FBC3B8ED.jpg new file mode 100644 index 00000000..699fa16e Binary files /dev/null and b/osinaweb/static/images/uploaded_chat_files/image_picker_904A1F47-01E6-45A7-B92F-653F056E80C4-88858-00000094FBC3B8ED.jpg differ diff --git a/osinaweb/static/images/uploaded_chat_files/image_picker_962BCFEF-6A5D-4986-994E-66B5AF874021-88858-000000990DFE88FF.jpg b/osinaweb/static/images/uploaded_chat_files/image_picker_962BCFEF-6A5D-4986-994E-66B5AF874021-88858-000000990DFE88FF.jpg new file mode 100644 index 00000000..1dbe779d Binary files /dev/null and b/osinaweb/static/images/uploaded_chat_files/image_picker_962BCFEF-6A5D-4986-994E-66B5AF874021-88858-000000990DFE88FF.jpg differ diff --git a/osinaweb/static/images/uploaded_chat_files/osichat-notification_3.mp3 b/osinaweb/static/images/uploaded_chat_files/osichat-notification_3.mp3 new file mode 100644 index 00000000..71d80c70 Binary files /dev/null and b/osinaweb/static/images/uploaded_chat_files/osichat-notification_3.mp3 differ diff --git a/osinaweb/static/js/osichat/upload-file.js b/osinaweb/static/js/osichat/upload-file.js index 39d56bb3..a618ce46 100644 --- a/osinaweb/static/js/osichat/upload-file.js +++ b/osinaweb/static/js/osichat/upload-file.js @@ -50,7 +50,7 @@ reader.onload = function (event) { let outerDiv = document.createElement('div'); outerDiv.id = 'uploading-' + file.name; - outerDiv.className = 'w-fit p-4 rounded-l-3xl rounded-tr-3xl text-white shadow-md text-sm leading-6 bg-opacity-70 bg-osiblue'; + outerDiv.className = 'max-w-[80%] p-4 rounded-l-3xl rounded-tr-3xl text-white shadow-md text-sm leading-6 bg-opacity-70 bg-osiblue'; let div = document.createElement('div'); let img = document.createElement('img'); @@ -70,7 +70,7 @@ function displayDocumentDuringUpload(file) { let outerDiv = document.createElement('div'); outerDiv.id = 'uploading-' + file.name; - outerDiv.className = 'w-full p-4 rounded-l-3xl rounded-tr-3xl text-white shadow-md text-sm leading-6 bg-opacity-70 bg-osiblue'; + outerDiv.className = 'max-w-[80%] p-4 rounded-l-3xl rounded-tr-3xl text-white shadow-md text-sm leading-6 bg-opacity-70 bg-osiblue'; let flexContainer = document.createElement('div'); flexContainer.className = 'w-full flex items-center gap-1';