diff --git a/browser/base/content/browser.css b/browser/base/content/browser.css index 5a88e3274a93..347b3c8733be 100644 --- a/browser/base/content/browser.css +++ b/browser/base/content/browser.css @@ -936,8 +936,8 @@ chatbox[customSize] { } chatbox[customSize="loopChatEnabled"] { - /* 430px as defined per UX */ - height: 430px; + /* 325px as defined per UX */ + height: 325px; } #chat-window[customSize="loopChatEnabled"] { @@ -946,13 +946,8 @@ chatbox[customSize="loopChatEnabled"] { } chatbox[customSize="loopChatMessageAppended"] { - /* 430px as defined per UX */ - height: 430px; -} - -chatbox[customSize="loopChatDisabledMessageAppended"] { - /* 388px as defined per UX */ - height: 388px; + /* 400px as defined per UX */ + height: 400px; } #chat-window[customSize="loopChatMessageAppended"] { @@ -976,8 +971,8 @@ chatbar { } chatbar[customSize] > .chatbar-innerbox { - /* 450px to make room for the maximum custom-size chatbox; currently 'loopChatMessageAppended'. */ - margin-top: -450px; + /* 425px to make room for the maximum custom-size chatbox; currently 'loopChatMessageAppended'. */ + margin-top: -425px; } /* Apply crisp rendering for favicons at exactly 2dppx resolution */ diff --git a/browser/components/loop/content/shared/css/conversation.css b/browser/components/loop/content/shared/css/conversation.css index 4f2a0a43976f..b1972c0a508b 100644 --- a/browser/components/loop/content/shared/css/conversation.css +++ b/browser/components/loop/content/shared/css/conversation.css @@ -530,13 +530,13 @@ body[platform="win"] .share-service-dropdown.overflow > .dropdown-menu-item { } .context-url-view-wrapper { - padding: 14px 15px; + padding: 12px; + margin-bottom: 0.5em; background-color: #dbf7ff; } .showing-room-name > .text-chat-entries > .text-chat-scroller > .context-url-view-wrapper { padding-top: 0; - margin-bottom: 0; } .room-context { @@ -755,7 +755,7 @@ body[platform="win"] .share-service-dropdown.overflow > .dropdown-menu-item { .media-wrapper > .focus-stream { width: 100%; /* A reasonable height */ - height: 55%; + height: 70%; } .media-wrapper.receiving-screen-share > .focus-stream { @@ -831,7 +831,7 @@ body[platform="win"] .share-service-dropdown.overflow > .dropdown-menu-item { .desktop-room-wrapper > .media-layout > .media-wrapper > .text-chat-view { /* This is temp, to echo the .media-wrapper > .text-chat-view above */ - height: 45%; + height: 30%; } .media-wrapper.receiving-screen-share > .screen { @@ -930,12 +930,7 @@ body[platform="win"] .share-service-dropdown.overflow > .dropdown-menu-item { .media-wrapper > .focus-stream { flex: 1 1 auto; - /* To keep the aspect ratio of video. Update accordingly with chatbox[customSize] width */ - height: 263px; - } - - .desktop-room-wrapper > .media-layout > .media-wrapper > .text-chat-view { - height: calc(100% - 263px); + height: auto; } } @@ -965,10 +960,6 @@ body[platform="win"] .share-service-dropdown.overflow > .dropdown-menu-item { text-align: start; } -.text-chat-scroller div:nth-child(2) { - margin-top: .5em; -} - /* Sent text chat entries should be on the right */ .text-chat-entry.sent { /* aligns paragraph to right side */ @@ -1217,6 +1208,8 @@ html[dir="rtl"] .text-chat-entry.received .text-chat-arrow { .text-chat-view { display: flex; flex-flow: column nowrap; + /* 120px max-height of .text-chat-entries plus 40px of .text-chat-box */ + max-height: 160px; /* 60px min-height of .text-chat-entries plus 40px of .text-chat-box */ min-height: 100px; height: auto; @@ -1227,6 +1220,7 @@ html[dir="rtl"] .text-chat-entry.received .text-chat-arrow { .text-chat-entries { flex: 1 1 auto; + max-height: 120px; min-height: 60px; } diff --git a/browser/components/loop/content/shared/js/textChatStore.js b/browser/components/loop/content/shared/js/textChatStore.js index 12a45c68bf21..a3bfedf64347 100644 --- a/browser/components/loop/content/shared/js/textChatStore.js +++ b/browser/components/loop/content/shared/js/textChatStore.js @@ -119,11 +119,7 @@ loop.store.TextChatStore = (function() { // Notify MozLoopService if appropriate that a message has been appended // and it should therefore check if we need a different sized window or not. if (message.contentType !== CHAT_CONTENT_TYPES.ROOM_NAME) { - if (this._storeState.textChatEnabled) { - window.dispatchEvent(new CustomEvent("LoopChatMessageAppended")); - } else { - window.dispatchEvent(new CustomEvent("LoopChatDisabledMessageAppended")); - } + window.dispatchEvent(new CustomEvent("LoopChatMessageAppended")); } }, diff --git a/browser/components/loop/modules/MozLoopService.jsm b/browser/components/loop/modules/MozLoopService.jsm index 9c99ea97afe2..3b99c1f0b0b3 100644 --- a/browser/components/loop/modules/MozLoopService.jsm +++ b/browser/components/loop/modules/MozLoopService.jsm @@ -963,7 +963,6 @@ var MozLoopServiceInternal = { const kSizeMap = { LoopChatEnabled: "loopChatEnabled", - LoopChatDisabledMessageAppended: "loopChatDisabledMessageAppended", LoopChatMessageAppended: "loopChatMessageAppended" }; @@ -982,7 +981,6 @@ var MozLoopServiceInternal = { window.addEventListener("LoopChatEnabled", onChatEvent); window.addEventListener("LoopChatMessageAppended", onChatEvent); - window.addEventListener("LoopChatDisabledMessageAppended", onChatEvent); injectLoopAPI(window); diff --git a/browser/components/loop/test/shared/textChatStore_test.js b/browser/components/loop/test/shared/textChatStore_test.js index e2e45a62c540..2f411094a5e1 100644 --- a/browser/components/loop/test/shared/textChatStore_test.js +++ b/browser/components/loop/test/shared/textChatStore_test.js @@ -96,7 +96,6 @@ describe("loop.store.TextChatStore", function() { }); it("should dispatch a LoopChatMessageAppended event", function() { - store.setStoreState({ textChatEnabled: true }); store.receivedTextChatMessage({ contentType: CHAT_CONTENT_TYPES.TEXT, message: "Hello!" @@ -142,7 +141,6 @@ describe("loop.store.TextChatStore", function() { }); it("should dipatch a LoopChatMessageAppended event", function() { - store.setStoreState({ textChatEnabled: true }); store.sendTextChatMessage({ contentType: CHAT_CONTENT_TYPES.TEXT, message: "Hello!" @@ -248,40 +246,6 @@ describe("loop.store.TextChatStore", function() { }]); }); - it("should dispatch a LoopChatDisabledMessageAppended event", function() { - store.setStoreState({ textChatEnabled: false }); - store.updateRoomInfo(new sharedActions.UpdateRoomInfo({ - roomName: "Let's share!", - roomUrl: "fake", - urls: [{ - description: "A wonderful event", - location: "http://wonderful.invalid", - thumbnail: "fake" - }] - })); - - expect(store.getStoreState("messageList")).eql([ - { - type: CHAT_MESSAGE_TYPES.SPECIAL, - contentType: CHAT_CONTENT_TYPES.ROOM_NAME, - message: "Let's share!", - extraData: undefined, - sentTimestamp: undefined, - receivedTimestamp: undefined - }, { - type: CHAT_MESSAGE_TYPES.SPECIAL, - contentType: CHAT_CONTENT_TYPES.CONTEXT, - message: "A wonderful event", - sentTimestamp: undefined, - receivedTimestamp: undefined, - extraData: { - location: "http://wonderful.invalid", - thumbnail: "fake" - } - } - ]); - }); - it("should not dispatch a LoopChatMessageAppended event", function() { store.updateRoomInfo(new sharedActions.UpdateRoomInfo({ roomName: "Let's share!", diff --git a/browser/components/loop/ui/ui-showcase.js b/browser/components/loop/ui/ui-showcase.js index d1c70c3c72e0..15fe3c249454 100644 --- a/browser/components/loop/ui/ui-showcase.js +++ b/browser/components/loop/ui/ui-showcase.js @@ -898,7 +898,7 @@ ), React.createElement(Section, {name: "DesktopRoomConversationView"}, - React.createElement(FramedExample, {height: 448, + React.createElement(FramedExample, {height: 398, onContentsRendered: invitationRoomStore.activeRoomStore.forcedUpdate, summary: "Desktop room conversation (invitation, text-chat inclusion/scrollbars don't happen in real client)", width: 348}, @@ -932,7 +932,7 @@ ), React.createElement(FramedExample, {dashed: true, - height: 448, + height: 398, onContentsRendered: desktopRoomStoreLoading.activeRoomStore.forcedUpdate, summary: "Desktop room conversation (loading)", width: 348}, @@ -952,7 +952,7 @@ ), React.createElement(FramedExample, {dashed: true, - height: 448, + height: 398, onContentsRendered: roomStore.activeRoomStore.forcedUpdate, summary: "Desktop room conversation", width: 348}, @@ -1006,7 +1006,7 @@ ), React.createElement(FramedExample, {dashed: true, - height: 448, + height: 398, onContentsRendered: desktopLocalFaceMuteRoomStore.activeRoomStore.forcedUpdate, summary: "Desktop room conversation local face-mute", width: 348}, @@ -1022,7 +1022,7 @@ ), React.createElement(FramedExample, {dashed: true, - height: 448, + height: 398, onContentsRendered: desktopRemoteFaceMuteRoomStore.activeRoomStore.forcedUpdate, summary: "Desktop room conversation remote face-mute", width: 348}, diff --git a/browser/components/loop/ui/ui-showcase.jsx b/browser/components/loop/ui/ui-showcase.jsx index 866ff04400e8..e51142f0ccd6 100644 --- a/browser/components/loop/ui/ui-showcase.jsx +++ b/browser/components/loop/ui/ui-showcase.jsx @@ -898,7 +898,7 @@
- @@ -932,7 +932,7 @@ @@ -952,7 +952,7 @@ @@ -1006,7 +1006,7 @@ @@ -1022,7 +1022,7 @@