Magic-Mirror/gecko-dev
1
0
Fork 0
mirror of https://github.com/mozilla/gecko-dev.git synced 2024-10-21 09:15:35 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Bug 1205684 - Video Window height pushes down context and covers a part of it. r=mikedeboer

Browse Source
This commit is contained in:
Manuel Casas 2015-10-26 04:45:00 +01:00
parent 2bf986ee4e
commit 9d22ecef65
7 changed files with 61 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
browser/base/content/browser.css
View File

@ -936,8 +936,8 @@ chatbox[customSize] {
}
chatbox[customSize="loopChatEnabled"] {
/* 325px as defined per UX */
height: 325px;
/* 430px as defined per UX */
height: 430px;
}
#chat-window[customSize="loopChatEnabled"] {
@ -946,8 +946,13 @@ chatbox[customSize="loopChatEnabled"] {
}
chatbox[customSize="loopChatMessageAppended"] {
/* 400px as defined per UX */
height: 400px;
/* 430px as defined per UX */
height: 430px;
}
chatbox[customSize="loopChatDisabledMessageAppended"] {
/* 388px as defined per UX */
height: 388px;
}
#chat-window[customSize="loopChatMessageAppended"] {
@ -971,8 +976,8 @@ chatbar {
}
chatbar[customSize] > .chatbar-innerbox {
/* 425px to make room for the maximum custom-size chatbox; currently 'loopChatMessageAppended'. */
margin-top: -425px;
/* 450px to make room for the maximum custom-size chatbox; currently 'loopChatMessageAppended'. */
margin-top: -450px;
}
/* Apply crisp rendering for favicons at exactly 2dppx resolution */

22
browser/components/loop/content/shared/css/conversation.css
View File

@ -530,13 +530,13 @@ body[platform="win"] .share-service-dropdown.overflow > .dropdown-menu-item {
}
.context-url-view-wrapper {
padding: 12px;
margin-bottom: 0.5em;
padding: 14px 15px;
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: 70%;
height: 55%;
}
.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: 30%;
height: 45%;
}
.media-wrapper.receiving-screen-share > .screen {
@ -930,7 +930,12 @@ body[platform="win"] .share-service-dropdown.overflow > .dropdown-menu-item {
.media-wrapper > .focus-stream {
flex: 1 1 auto;
height: 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);
}
}
@ -960,6 +965,10 @@ 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 */
@ -1208,8 +1217,6 @@ 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;
@ -1220,7 +1227,6 @@ html[dir="rtl"] .text-chat-entry.received .text-chat-arrow {
.text-chat-entries {
flex: 1 1 auto;
max-height: 120px;
min-height: 60px;
}

6
browser/components/loop/content/shared/js/textChatStore.js
View File

@ -119,7 +119,11 @@ 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) {
window.dispatchEvent(new CustomEvent("LoopChatMessageAppended"));
if (this._storeState.textChatEnabled) {
window.dispatchEvent(new CustomEvent("LoopChatMessageAppended"));
} else {
window.dispatchEvent(new CustomEvent("LoopChatDisabledMessageAppended"));
}
}
},

2
browser/components/loop/modules/MozLoopService.jsm
View File

@ -963,6 +963,7 @@ var MozLoopServiceInternal = {
const kSizeMap = {
LoopChatEnabled: "loopChatEnabled",
LoopChatDisabledMessageAppended: "loopChatDisabledMessageAppended",
LoopChatMessageAppended: "loopChatMessageAppended"
};
@ -981,6 +982,7 @@ var MozLoopServiceInternal = {
window.addEventListener("LoopChatEnabled", onChatEvent);
window.addEventListener("LoopChatMessageAppended", onChatEvent);
window.addEventListener("LoopChatDisabledMessageAppended", onChatEvent);
injectLoopAPI(window);

19
browser/components/loop/test/shared/textChatStore_test.js
View File

@ -96,6 +96,7 @@ 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!"
@ -141,6 +142,7 @@ 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!"
@ -246,6 +248,23 @@ 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",
roomContextUrls: [{
description: "A wonderful event2",
location: "http://wonderful.invalid2",
thumbnail: "fake2"
}]
}));
sinon.assert.calledOnce(window.dispatchEvent);
sinon.assert.calledWithExactly(window.dispatchEvent,
new CustomEvent("LoopChatDisabledMessageAppended"));
});
it("should not dispatch a LoopChatMessageAppended event", function() {
store.updateRoomInfo(new sharedActions.UpdateRoomInfo({
roomName: "Let's share!",

10
browser/components/loop/ui/ui-showcase.js
View File

@ -898,7 +898,7 @@
),
React.createElement(Section, {name: "DesktopRoomConversationView"},
React.createElement(FramedExample, {height: 398,
React.createElement(FramedExample, {height: 448,
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: 398,
height: 448,
onContentsRendered: desktopRoomStoreLoading.activeRoomStore.forcedUpdate,
summary: "Desktop room conversation (loading)",
width: 348},
@ -952,7 +952,7 @@
),
React.createElement(FramedExample, {dashed: true,
height: 398,
height: 448,
onContentsRendered: roomStore.activeRoomStore.forcedUpdate,
summary: "Desktop room conversation",
width: 348},
@ -1006,7 +1006,7 @@
),
React.createElement(FramedExample, {dashed: true,
height: 398,
height: 448,
onContentsRendered: desktopLocalFaceMuteRoomStore.activeRoomStore.forcedUpdate,
summary: "Desktop room conversation local face-mute",
width: 348},
@ -1022,7 +1022,7 @@
),
React.createElement(FramedExample, {dashed: true,
height: 398,
height: 448,
onContentsRendered: desktopRemoteFaceMuteRoomStore.activeRoomStore.forcedUpdate,
summary: "Desktop room conversation remote face-mute",
width: 348},

10
browser/components/loop/ui/ui-showcase.jsx
View File

@ -898,7 +898,7 @@
</Section>
<Section name="DesktopRoomConversationView">
<FramedExample height={398}
<FramedExample height={448}
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 @@
</FramedExample>
<FramedExample dashed={true}
height={398}
height={448}
onContentsRendered={desktopRoomStoreLoading.activeRoomStore.forcedUpdate}
summary="Desktop room conversation (loading)"
width={348}>
@ -952,7 +952,7 @@
</FramedExample>
<FramedExample dashed={true}
height={398}
height={448}
onContentsRendered={roomStore.activeRoomStore.forcedUpdate}
summary="Desktop room conversation"
width={348}>
@ -1006,7 +1006,7 @@
</FramedExample>
<FramedExample dashed={true}
height={398}
height={448}
onContentsRendered={desktopLocalFaceMuteRoomStore.activeRoomStore.forcedUpdate}
summary="Desktop room conversation local face-mute"
width={348}>
@ -1022,7 +1022,7 @@
</FramedExample>
<FramedExample dashed={true}
height={398}
height={448}
onContentsRendered={desktopRemoteFaceMuteRoomStore.activeRoomStore.forcedUpdate}
summary="Desktop room conversation remote face-mute"
width={348} >