зеркало из https://github.com/mozilla/gecko-dev.git
Bug 1568320 - Add a context menu to the Picture-in-Picture toggle to allow for easy hiding. r=NeilDeakin,JSON_voorhees
Differential Revision: https://phabricator.services.mozilla.com/D40305 --HG-- extra : moz-landing-system : lando
This commit is contained in:
Родитель
1d62a12e08
Коммит
d64c589ac1
|
@ -48,6 +48,7 @@ XPCOMUtils.defineLazyModuleGetters(this, {
|
|||
PanelMultiView: "resource:///modules/PanelMultiView.jsm",
|
||||
PanelView: "resource:///modules/PanelMultiView.jsm",
|
||||
PermitUnloader: "resource://gre/actors/BrowserElementParent.jsm",
|
||||
PictureInPicture: "resource://gre/modules/PictureInPicture.jsm",
|
||||
PlacesUtils: "resource://gre/modules/PlacesUtils.jsm",
|
||||
PlacesUIUtils: "resource:///modules/PlacesUIUtils.jsm",
|
||||
PlacesTransactions: "resource://gre/modules/PlacesTransactions.jsm",
|
||||
|
|
|
@ -506,6 +506,12 @@
|
|||
#include browser-context.inc
|
||||
</menupopup>
|
||||
|
||||
<menupopup id="pictureInPictureToggleContextMenu">
|
||||
<menuitem label="&pictureInPictureHideToggle.label;"
|
||||
accesskey="&pictureInPictureHideToggle.accesskey;"
|
||||
oncommand="PictureInPicture.hideToggle();" />
|
||||
</menupopup>
|
||||
|
||||
#include ../../components/places/content/placesContextMenu.inc.xul
|
||||
|
||||
<panel id="ctrlTab-panel" hidden="true" norestorefocus="true" level="top">
|
||||
|
|
|
@ -653,6 +653,7 @@ const listeners = {
|
|||
"PictureInPicture:Close": ["PictureInPicture"],
|
||||
"PictureInPicture:Playing": ["PictureInPicture"],
|
||||
"PictureInPicture:Paused": ["PictureInPicture"],
|
||||
"PictureInPicture:OpenToggleContextMenu": ["PictureInPicture"],
|
||||
"Reader:FaviconRequest": ["ReaderParent"],
|
||||
"Reader:UpdateReaderButton": ["ReaderParent"],
|
||||
// PLEASE KEEP THIS LIST IN SYNC WITH THE MOBILE LISTENERS IN BrowserCLH.js
|
||||
|
|
|
@ -94,6 +94,9 @@ convenience of Safari and Chrome users on macOS. See bug 1398988. -->
|
|||
<!ENTITY fullScreenExit.label "Exit Full Screen Mode">
|
||||
<!ENTITY fullScreenExit.accesskey "F">
|
||||
|
||||
<!ENTITY pictureInPictureHideToggle.label "Hide Picture-in-Picture Toggle">
|
||||
<!ENTITY pictureInPictureHideToggle.accesskey "H">
|
||||
|
||||
<!-- LOCALIZATION NOTE (fxa.menu) Used to define the different labels
|
||||
for the Firefox Account toolbar menu screen. The `Signed in as` text is
|
||||
followed by the user's email. -->
|
||||
|
|
|
@ -138,13 +138,18 @@ class PictureInPictureToggleChild extends ActorChild {
|
|||
if (
|
||||
this.toggleEnabled &&
|
||||
event.target instanceof this.content.HTMLVideoElement &&
|
||||
!event.target.controls &&
|
||||
event.target.ownerDocument == this.content.document
|
||||
) {
|
||||
this.registerVideo(event.target);
|
||||
}
|
||||
break;
|
||||
}
|
||||
case "contextmenu": {
|
||||
if (this.toggleEnabled) {
|
||||
this.checkContextMenu(event);
|
||||
}
|
||||
break;
|
||||
}
|
||||
case "mousedown":
|
||||
case "pointerup":
|
||||
case "mouseup":
|
||||
|
@ -640,6 +645,39 @@ class PictureInPictureToggleChild extends ActorChild {
|
|||
);
|
||||
}
|
||||
|
||||
/**
|
||||
* Checks a contextmenu event to see if the mouse is currently over the
|
||||
* Picture-in-Picture toggle. If so, sends a message to the parent process
|
||||
* to open up the Picture-in-Picture toggle context menu.
|
||||
*
|
||||
* @param {MouseEvent} event A contextmenu event.
|
||||
*/
|
||||
checkContextMenu(event) {
|
||||
let state = this.docState;
|
||||
|
||||
let video = state.weakOverVideo && state.weakOverVideo.get();
|
||||
if (!video) {
|
||||
return;
|
||||
}
|
||||
|
||||
let shadowRoot = video.openOrClosedShadowRoot;
|
||||
if (!shadowRoot) {
|
||||
return;
|
||||
}
|
||||
|
||||
let toggle = shadowRoot.getElementById("pictureInPictureToggleButton");
|
||||
if (this.isMouseOverToggle(toggle, event)) {
|
||||
event.stopImmediatePropagation();
|
||||
event.preventDefault();
|
||||
|
||||
this.mm.sendAsyncMessage("PictureInPicture:OpenToggleContextMenu", {
|
||||
screenX: event.screenX,
|
||||
screenY: event.screenY,
|
||||
mozInputSource: event.mozInputSource,
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* This is a test-only function that returns true if a video is being tracked
|
||||
* for mouseover events after having intersected the viewport.
|
||||
|
|
|
@ -11,6 +11,8 @@ const { Services } = ChromeUtils.import("resource://gre/modules/Services.jsm");
|
|||
const PLAYER_URI = "chrome://global/content/pictureinpicture/player.xhtml";
|
||||
const PLAYER_FEATURES = `chrome,titlebar=no,alwaysontop,lockaspectratio,resizable`;
|
||||
const WINDOW_TYPE = "Toolkit:PictureInPicture";
|
||||
const TOGGLE_ENABLED_PREF =
|
||||
"media.videocontrols.picture-in-picture.video-toggle.enabled";
|
||||
|
||||
/**
|
||||
* If closing the Picture-in-Picture player window occurred for a reason that
|
||||
|
@ -64,6 +66,11 @@ var PictureInPicture = {
|
|||
}
|
||||
break;
|
||||
}
|
||||
case "PictureInPicture:OpenToggleContextMenu": {
|
||||
let win = browser.ownerGlobal;
|
||||
this.openToggleContextMenu(win, aMessage.data);
|
||||
break;
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
|
@ -297,4 +304,37 @@ var PictureInPicture = {
|
|||
);
|
||||
});
|
||||
},
|
||||
|
||||
openToggleContextMenu(window, data) {
|
||||
let document = window.document;
|
||||
let popup = document.getElementById("pictureInPictureToggleContextMenu");
|
||||
|
||||
// We synthesize a new MouseEvent to propagate the inputSource to the
|
||||
// subsequently triggered popupshowing event.
|
||||
let newEvent = document.createEvent("MouseEvent");
|
||||
newEvent.initNSMouseEvent(
|
||||
"contextmenu",
|
||||
true,
|
||||
true,
|
||||
null,
|
||||
0,
|
||||
data.screenX,
|
||||
data.screenY,
|
||||
0,
|
||||
0,
|
||||
false,
|
||||
false,
|
||||
false,
|
||||
false,
|
||||
0,
|
||||
null,
|
||||
0,
|
||||
data.mozInputSource
|
||||
);
|
||||
popup.openPopupAtScreen(newEvent.screenX, newEvent.screenY, true, newEvent);
|
||||
},
|
||||
|
||||
hideToggle() {
|
||||
Services.prefs.setBoolPref(TOGGLE_ENABLED_PREF, false);
|
||||
},
|
||||
};
|
||||
|
|
|
@ -309,6 +309,7 @@ let LEGACY_ACTORS = {
|
|||
module: "resource://gre/actors/PictureInPictureChild.jsm",
|
||||
events: {
|
||||
canplay: { capture: true, mozSystemGroup: true },
|
||||
contextmenu: { capture: true },
|
||||
},
|
||||
},
|
||||
},
|
||||
|
|
Загрузка…
Ссылка в новой задаче