From 5999c504dd51a052a09cdbe38f829df0db78b552 Mon Sep 17 00:00:00 2001
From: Andreas Traczyk <andreas.traczyk@savoirfairelinux.com>
Date: Wed, 23 Oct 2019 12:14:54 -0400
Subject: [PATCH] chatview: unify line endings and add windows css fix
Change-Id: Iaa21f50859456b2127103c7e80acfd9bfdf4edac
---
src/web-chatview/chatview-windows.css | 400 +++++++++++++-------------
src/web-chatview/chatview.css | 3 -
src/web-chatview/chatview.html | 12 +-
src/web-chatview/chatview.js | 6 -
4 files changed, 209 insertions(+), 212 deletions(-)
diff --git a/src/web-chatview/chatview-windows.css b/src/web-chatview/chatview-windows.css
index 566ca0d2..b186f456 100644
--- a/src/web-chatview/chatview-windows.css
+++ b/src/web-chatview/chatview-windows.css
@@ -1,198 +1,204 @@
-:root {
- /* color definitions */
- --jami-light-blue: rgba(59, 193, 211, 0.3);
- --jami-dark-blue: #004e86;
- --jami-green: #219d55;
- --jami-green-hover: #1f8b4c;
- --jami-red: #dc2719;
- --jami-red-hover: #b02e2c;
- /* main properties */
- --bg-color: #ffffff;
- /* navbar properties */
- --navbar-height: 40px;
- --navbar-padding-top: 8px;
- --navbar-padding-bottom: var(--navbar-padding-top);
- /* message bar properties */
- --textarea-max-height: 150px;
- --placeholder-text-color: #d3d3d3;
- /* button properties */
- --action-icon-color: #00;
- --deactivated-icon-color: #bebebe;
- --action-icon-hover-color: #ededed;
- --action-critical-icon-hover-color: rgba(211, 77, 59, 0.3); /* complementary color of jami light blue */
- --action-critical-icon-press-color: rgba(211, 77, 59, 0.5);
- --action-critical-icon-color: #4E1300;
- --non-action-icon-color: #212121;
- --action-icon-press-color: rgba(212, 212, 212, 1.0);
- --invite-hover-color: white;
- /* hairline properties */
- --hairline-color: #f0f0f0;
- --hairline-thickness: 2px;
-}
-
-#invite_contact_name {
- font-weight: 500;
-}
-
-
-.internal_mes_wrapper {
- margin: 0;
-}
-
-.message_wrapper {
- padding: 0.5em 1em 0.5em 1em;
-}
-
-.sender_image {
- margin: 0px 10px 0px 10px;
-}
-
-.message_in .message_wrapper {
- background-color: #cfebf5;
-}
-
-.message_in .sender_image,
-.message_out .sender_image {
- visibility: hidden;
-}
-
-.message_in.last_of_sequence .sender_image,
-.message_in.single_message .sender_image {
- visibility: visible;
-}
-
-.message_in.last_of_sequence .sender_image {
- margin-top: 2px;
-}
-
-.message_in.middle_of_sequence .sender_image {
- margin-top: 0px;
-}
-
-
-.generated_message.message_in .message_wrapper,
-.generated_message.message_out .message_wrapper {
- background-color: transparent !important;
- border-radius: 0px !important;
-}
-
-.single_message.message_in .message_wrapper,
-.single_message.message_out .message_wrapper {
- border-radius: 20px 20px 20px 20px !important;
-}
-
-.last_of_sequence.message_in .message_wrapper {
- border-radius: 4px 20px 20px 20px;
-}
-
-.first_of_sequence.message_in .message_wrapper {
- border-radius: 20px 20px 20px 4px;
-}
-
-.middle_of_sequence.message_in .message_wrapper {
- border-radius: 4px 20px 20px 5px;
-}
-
-.last_of_sequence.message_out .message_wrapper {
- border-radius: 20px 4px 20px 20px;
-}
-
-.first_of_sequence.message_out .message_wrapper {
- border-radius: 20px 20px 4px 20px;
-}
-
-.middle_of_sequence.message_out .message_wrapper {
- border-radius: 20px 5px 4px 20px;
-}
-
-.middle_of_sequence .internal_mes_wrapper,
-.last_of_sequence .internal_mes_wrapper,
-.last_message .internal_mes_wrapper {
- margin: 0px 0 0 0 !important;
-}
-
-.message_out .sender_image {
- margin: 8px;
-}
-
-.first_of_sequence.message_out .internal_mes_wrapper,
-.single_message.message_out .internal_mes_wrapper {
- margin: 0px 0 0 0 !important;
-}
-
-.sender_image_cell {
- vertical-align: bottom;
- min-width: 16px;
-}
-
-.message_in .sender_image_cell {
- min-width: 56px;
-}
-
-.dummy_cell {
- padding: 0;
-}
-
-.timestamp_cell {
- padding: 0;
- max-width: 0px;
- overflow: visible;
- white-space: nowrap;
-}
-
-.timestamp_cell_out {
- padding: 0;
- text-align: right;
- direction: rtl;
- max-width: 0px;
- overflow: visible;
- white-space: nowrap;
-}
-
-table {
- border-collapse: collapse;
- border-spacing: 0 0px;
- margin: 0;
- padding: 0;
-}
-
-.message_text {
- word-break: break-all;
- word-wrap: hyphenate;
-}
-
-pre {
- white-space: pre-wrap;
-}
-
-.message:hover:not(.message_type_contact) .menu_interaction {
- display: block;
- opacity: 1;
-}
-
-.menuoption {
- user-select: none;
- cursor: pointer;
-}
-
-.nav-button {
- width: 30px;
- height: 30px;
- margin: 8px;
- padding: 2px;
- display: flex;
- cursor: pointer;
- align-self: center;
- border-radius: 16px;
-}
-
-.nav-button.deactivated {
- width: 30px;
- height: 30px;
- margin: 8px;
- padding: 2px;
- align-self: center;
- display: flex;
- border-radius: 16px;
- cursor: auto;
+:root {
+ /* color definitions */
+ --jami-light-blue: rgba(59, 193, 211, 0.3);
+ --jami-dark-blue: #004e86;
+ --jami-green: #219d55;
+ --jami-green-hover: #1f8b4c;
+ --jami-red: #dc2719;
+ --jami-red-hover: #b02e2c;
+ /* main properties */
+ --bg-color: #ffffff;
+ /* navbar properties */
+ --navbar-height: 40px;
+ --navbar-padding-top: 8px;
+ --navbar-padding-bottom: var(--navbar-padding-top);
+ /* message bar properties */
+ --textarea-max-height: 150px;
+ --placeholder-text-color: #d3d3d3;
+ /* button properties */
+ --action-icon-color: #00;
+ --deactivated-icon-color: #bebebe;
+ --action-icon-hover-color: #ededed;
+ --action-critical-icon-hover-color: rgba(211, 77, 59, 0.3); /* complementary color of jami light blue */
+ --action-critical-icon-press-color: rgba(211, 77, 59, 0.5);
+ --action-critical-icon-color: #4E1300;
+ --non-action-icon-color: #212121;
+ --action-icon-press-color: rgba(212, 212, 212, 1.0);
+ --invite-hover-color: white;
+ /* hairline properties */
+ --hairline-color: #f0f0f0;
+ --hairline-thickness: 2px;
+}
+
+#invite_contact_name {
+ font-weight: 500;
+}
+
+.internal_mes_wrapper {
+ margin: 0;
+}
+
+.message_wrapper {
+ padding: 0.5em 1em 0.5em 1em;
+}
+
+.sender_image {
+ margin: 0px 10px 0px 10px;
+}
+
+.message_in .message_wrapper {
+ background-color: #cfebf5;
+}
+
+.message_in .sender_image,
+.message_out .sender_image {
+ visibility: hidden;
+}
+
+.message_in.last_of_sequence .sender_image,
+.message_in.single_message .sender_image {
+ visibility: visible;
+}
+
+.message_in.last_of_sequence .sender_image {
+ margin-top: 2px;
+}
+
+.message_in.middle_of_sequence .sender_image {
+ margin-top: 0px;
+}
+
+.generated_message.message_in .message_wrapper,
+.generated_message.message_out .message_wrapper {
+ background-color: transparent !important;
+ border-radius: 0px !important;
+}
+
+.single_message.message_in .message_wrapper,
+.single_message.message_out .message_wrapper {
+ border-radius: 20px 20px 20px 20px !important;
+}
+
+.last_of_sequence.message_in .message_wrapper {
+ border-radius: 4px 20px 20px 20px;
+}
+
+.first_of_sequence.message_in .message_wrapper {
+ border-radius: 20px 20px 20px 4px;
+}
+
+.middle_of_sequence.message_in .message_wrapper {
+ border-radius: 4px 20px 20px 5px;
+}
+
+.last_of_sequence.message_out .message_wrapper {
+ border-radius: 20px 4px 20px 20px;
+}
+
+.first_of_sequence.message_out .message_wrapper {
+ border-radius: 20px 20px 4px 20px;
+}
+
+.middle_of_sequence.message_out .message_wrapper {
+ border-radius: 20px 5px 4px 20px;
+}
+
+.middle_of_sequence .internal_mes_wrapper,
+.last_of_sequence .internal_mes_wrapper,
+.last_message .internal_mes_wrapper {
+ margin: 0px 0 0 0 !important;
+}
+
+.message_out .sender_image {
+ margin: 8px;
+}
+
+.first_of_sequence.message_out .internal_mes_wrapper,
+.single_message.message_out .internal_mes_wrapper {
+ margin: 0px 0 0 0 !important;
+}
+
+.sender_image_cell {
+ vertical-align: bottom;
+ min-width: 16px;
+}
+
+.message_in .sender_image_cell {
+ min-width: 56px;
+}
+
+.dummy_cell {
+ padding: 0;
+}
+
+.timestamp_cell {
+ padding: 0;
+ max-width: 0px;
+ overflow: visible;
+ white-space: nowrap;
+}
+
+.timestamp_cell_out {
+ padding: 0;
+ text-align: right;
+ direction: rtl;
+ max-width: 0px;
+ overflow: visible;
+ white-space: nowrap;
+}
+
+table {
+ border-collapse: collapse;
+ border-spacing: 0 0px;
+ margin: 0;
+ padding: 0;
+}
+
+.message_text {
+ word-break: break-all;
+ word-wrap: hyphenate;
+}
+
+pre {
+ white-space: pre-wrap;
+}
+
+.message:hover:not(.message_type_contact) .menu_interaction {
+ display: block;
+ opacity: 1;
+}
+
+.message_type_text .internal_mes_wrapper {
+ padding: 0;
+}
+
+.first_of_sequence .internal_mes_wrapper {
+ padding: 0.1em 0 0 0;
+}
+
+.menuoption {
+ user-select: none;
+ cursor: pointer;
+}
+
+.nav-button {
+ width: 30px;
+ height: 30px;
+ margin: 8px;
+ padding: 2px;
+ display: flex;
+ cursor: pointer;
+ align-self: center;
+ border-radius: 16px;
+}
+
+.nav-button.deactivated {
+ width: 30px;
+ height: 30px;
+ margin: 8px;
+ padding: 2px;
+ align-self: center;
+ display: flex;
+ border-radius: 16px;
+ cursor: auto;
}
\ No newline at end of file
diff --git a/src/web-chatview/chatview.css b/src/web-chatview/chatview.css
index 9466a5ee..44ab8dd0 100644
--- a/src/web-chatview/chatview.css
+++ b/src/web-chatview/chatview.css
@@ -83,7 +83,6 @@ body {
background-color: var(--bg-color);
}
-
/** Navbar */
.navbar-wrapper {
@@ -251,7 +250,6 @@ body {
-webkit-user-select: auto;
}
-
/** Messaging bar */
#sendMessage {
@@ -544,7 +542,6 @@ a:hover {
margin-top: 4px;
}
-
/* General messages */
.internal_mes_wrapper {
diff --git a/src/web-chatview/chatview.html b/src/web-chatview/chatview.html
index 3b8f16fa..4baae2af 100644
--- a/src/web-chatview/chatview.html
+++ b/src/web-chatview/chatview.html
@@ -1,4 +1,4 @@
-<html>
+<html>
<!-- Empty head might be needed for setSenderImage -->
<head>
@@ -84,11 +84,11 @@
</div>
</div>
</div>
- <div id="container">
- <div id="messages" onscroll="onScrolled()"></div>
- <div id="back_to_bottom_button_container">
- <div id="back_to_bottom_button" onclick="back_to_bottom()">Jump to latest ▼</div>
- </div>
+ <div id="container">
+ <div id="messages" onscroll="onScrolled()"></div>
+ <div id="back_to_bottom_button_container">
+ <div id="back_to_bottom_button" onclick="back_to_bottom()">Jump to latest ▼</div>
+ </div>
<div id="file_image_send_container"></div>
<div id="sendMessage">
<div id="sendFileButton" class="nav-button action-button" onclick="selectFileToSend()" title="select file to send">
diff --git a/src/web-chatview/chatview.js b/src/web-chatview/chatview.js
index 0519905b..630a507c 100644
--- a/src/web-chatview/chatview.js
+++ b/src/web-chatview/chatview.js
@@ -506,7 +506,6 @@ function formatDate(date) {
const seconds = Math.floor((new Date() - date) / 1000)
var interval = Math.floor(seconds / (3600 * 24))
-
if (use_qt) {
if (interval > 5) {
return date.toLocaleDateString()
@@ -883,7 +882,6 @@ function fileInteraction(message_id, message_direction) {
internal_mes_wrapper.appendChild(message_wrapper)
}
-
return internal_mes_wrapper
}
@@ -988,7 +986,6 @@ function updateFileInteraction(message_div, message_object, forceTypeToFile = fa
return
}
-
if (isAudio(message_text) && message_delivery_status === "finished" && displayLinksEnabled && !forceTypeToFile) {
// Replace the old wrapper by the downloaded audio
var old_wrapper = message_div.querySelector(".internal_mes_wrapper")
@@ -1498,7 +1495,6 @@ function buildNewMessage(message_object) {
}
}
-
// Build main content
if (message_type === "data_transfer") {
if (isImage(message_text) && delivery_status === "finished" && displayLinksEnabled) {
@@ -1584,7 +1580,6 @@ function addSenderImage(message_div, message_type, message_sender_contact_method
}
}
-
/**
* Build a timestamp for passed message object
* @param message_object to treat
@@ -2217,7 +2212,6 @@ function remove(e) {
}
}
-
// It's called in qt qwebengine
function pasteKeyDetected(e) {
e.preventDefault()
--
GitLab