From 69b0fa8e57ee65552144d246b8b894e0ceeaa334 Mon Sep 17 00:00:00 2001 From: Florian Scholz Date: Wed, 3 Mar 2021 11:42:38 +0100 Subject: [PATCH] Split pictureInPictureElement to avoid mixin page (#2653) * yarn content move Web/API/DocumentOrShadowRoot/pictureInPictureElement Web/API/Document/pictureInPictureElement * Update document.pictureInPictureElement * Add propety to document interface page * Fix various links * Add property to ShadowRoot page * Change HTMLVideoElement to Element (as per spec) * Add new page for ShadowRoot.pictureInPictureElement * copy edit * Address feedback * Manually update wrong redirect Co-authored-by: Chris Mills --- files/en-us/_redirects.txt | 3 +- files/en-us/_wikihistory.json | 16 ++--- .../document/exitpictureinpicture/index.html | 2 +- files/en-us/web/api/document/index.html | 6 +- .../pictureinpictureelement/index.html | 48 +++++++-------- .../pictureinpictureenabled/index.html | 2 +- .../requestpictureinpicture/index.html | 2 +- .../web/api/picture-in-picture_api/index.html | 12 ++-- files/en-us/web/api/shadowroot/index.html | 2 + .../pictureinpictureelement/index.html | 58 +++++++++++++++++++ .../css/_colon_picture-in-picture/index.html | 2 +- 11 files changed, 104 insertions(+), 49 deletions(-) rename files/en-us/web/api/{documentorshadowroot => document}/pictureinpictureelement/index.html (58%) create mode 100644 files/en-us/web/api/shadowroot/pictureinpictureelement/index.html diff --git a/files/en-us/_redirects.txt b/files/en-us/_redirects.txt index 0c2aa3033297df9..12a48b44674e4c5 100644 --- a/files/en-us/_redirects.txt +++ b/files/en-us/_redirects.txt @@ -7564,7 +7564,8 @@ /en-US/docs/Web/API/DocumentOrShadowRoot/fullscreenElement /en-US/docs/Web/API/Document/fullscreenElement /en-US/docs/Web/API/DocumentOrShadowRoot/nodeFromPoint /en-US/docs/Web/API/DocumentOrShadowRoot /en-US/docs/Web/API/DocumentOrShadowRoot/nodesFromPoint /en-US/docs/Web/API/DocumentOrShadowRoot -/en-US/docs/Web/API/DocumentOrShadowRoot/pictureInPictureEnabled /en-US/docs/Web/API/DocumentOrShadowRoot/pictureInPictureElement +/en-US/docs/Web/API/DocumentOrShadowRoot/pictureInPictureElement /en-US/docs/Web/API/Document/pictureInPictureElement +/en-US/docs/Web/API/DocumentOrShadowRoot/pictureInPictureEnabled /en-US/docs/Web/API/Document/pictureInPictureEnabled /en-US/docs/Web/API/DocumentTouch.createTouch /en-US/docs/Web/API/Document/createTouch /en-US/docs/Web/API/DocumentTouch.createTouchList /en-US/docs/Web/API/Document/createTouchList /en-US/docs/Web/API/DocumentTouch/createTouch /en-US/docs/Web/API/Document/createTouch diff --git a/files/en-us/_wikihistory.json b/files/en-us/_wikihistory.json index ef7dc0e00870ba4..d33059b3e1434ef 100644 --- a/files/en-us/_wikihistory.json +++ b/files/en-us/_wikihistory.json @@ -44381,13 +44381,6 @@ "mattwojo" ] }, - "Web/API/DocumentOrShadowRoot/pictureInPictureElement": { - "modified": "2020-10-25T11:04:35.581Z", - "contributors": [ - "chrisdavidmills", - "germain" - ] - }, "Web/API/DocumentOrShadowRoot/pointerLockElement": { "modified": "2020-10-15T21:25:15.470Z", "contributors": [ @@ -165819,5 +165812,12 @@ "ziyunfei", "ernestd" ] + }, + "Web/API/Document/pictureInPictureElement": { + "modified": "2020-10-25T11:04:35.581Z", + "contributors": [ + "chrisdavidmills", + "germain" + ] } -} \ No newline at end of file +} diff --git a/files/en-us/web/api/document/exitpictureinpicture/index.html b/files/en-us/web/api/document/exitpictureinpicture/index.html index 96a7b4bed82bd4f..0b0db0fa56be9a2 100644 --- a/files/en-us/web/api/document/exitpictureinpicture/index.html +++ b/files/en-us/web/api/document/exitpictureinpicture/index.html @@ -82,6 +82,6 @@

See also

  • {{DOMxRef("HTMLVideoElement.autoPictureInPicture")}}
  • {{DOMxRef("HTMLVideoElement.disablePictureInPicture")}}
  • {{DOMxRef("Document.pictureInPictureEnabled")}}
    • -
  • {{DOMxRef("DocumentOrShadowRoot.pictureInPictureElement")}}
    • +
  • {{DOMxRef("Document.pictureInPictureElement")}}
  • {{CSSxRef(":picture-in-picture")}}
    • diff --git a/files/en-us/web/api/document/index.html b/files/en-us/web/api/document/index.html index cdb0d11edc4c0cb..e2e42570672613d 100644 --- a/files/en-us/web/api/document/index.html +++ b/files/en-us/web/api/document/index.html @@ -64,8 +64,10 @@

    Properties

    Returns a list of all the hyperlinks in the document.
    {{DOMxRef("Document.mozSyntheticDocument")}} {{Non-standard_Inline}}
    Returns a {{JSxRef("Boolean")}} that is true only if this document is synthetic, such as a standalone image, video, audio file, or the like.
    -
    {{DOMxRef("Document.pictureInPictureEnabled")}}{{ReadOnlyInline}}
    -
    Returns true if the picture-in-picture feature is enabled
    +
    {{DOMxRef("Document.pictureInPictureElement")}} {{ReadOnlyInline}}
    +
    Returns the {{DOMxRef('Element')}} currently being presented in picture-in-picture mode in this document.
    +
    {{DOMxRef("Document.pictureInPictureEnabled")}} {{ReadOnlyInline}}
    +
    Returns true if the picture-in-picture feature is enabled.
    {{DOMxRef("Document.plugins")}}{{ReadOnlyInline}}
    Returns a list of the available plugins.
    {{DOMxRef("Document.featurePolicy")}} {{Experimental_Inline}}{{ReadOnlyInline}}
    diff --git a/files/en-us/web/api/documentorshadowroot/pictureinpictureelement/index.html b/files/en-us/web/api/document/pictureinpictureelement/index.html similarity index 58% rename from files/en-us/web/api/documentorshadowroot/pictureinpictureelement/index.html rename to files/en-us/web/api/document/pictureinpictureelement/index.html index cce0c2833873b42..740df9e18167ad7 100644 --- a/files/en-us/web/api/documentorshadowroot/pictureinpictureelement/index.html +++ b/files/en-us/web/api/document/pictureinpictureelement/index.html @@ -1,24 +1,23 @@ --- -title: DocumentOrShadowRoot.pictureInPictureElement -slug: Web/API/DocumentOrShadowRoot/pictureInPictureElement +title: Document.pictureInPictureElement +slug: Web/API/Document/pictureInPictureElement tags: -- API -- Document -- DocumentOrShadowRoot -- Graphics -- Picture-in-Picture -- Picture-in-Picture API -- Property -- Read-only -- Reference -- pictureInPictureElement -- pip + - API + - Document + - Graphics + - Picture-in-Picture + - Picture-in-Picture API + - Property + - Read-only + - Reference + - pictureInPictureElement + - pip ---
    {{ApiRef("Fullscreen API")}}

    The - DocumentOrShadowRoot.pictureInPictureElement read-only - property returns the {{ domxref("HTMLVideoElement") }} that is currently being + Document.pictureInPictureElement read-only + property returns the {{ domxref("Element") }} that is currently being presented in picture-in-picture mode in this document, or null if picture-in-picture mode is not currently in use.

    @@ -28,21 +27,20 @@

    Syntax

    var video = document.pictureInPictureElement;
    + class="brush: js">document.pictureInPictureElement;

    Return value

    -

    A reference to the {{domxref("HTMLVideoElement")}} object that's currently in +

    A reference to the {{domxref("Element")}} object that's currently in picture-in-picture mode; if picture-in-picture mode isn't currently in use by the document, the returned value is null.

    Examples

    -

    This example presents a function, - Document.exitPictureInPicture(), +

    This example presents a function, exitPictureInPicture(), which tests the value returned by pictureInPictureElement. If the document is in picture-in-picture mode (pictureInPictureElement isn't - null), exitPictureInPicture() is run to exit + null), Document.exitPictureInPicture() is run to exit picture-in-picture mode.

    function exitPictureInPicture() {
@@ -57,24 +55,18 @@ 
    Specifications
    
   
     
       Specification
-      Status
-      Comment
     
   
   
     
-      {{SpecName("Picture-in-Picture",
-        "#dom-documentorshadowroot-pictureinpictureelement",
-        "Document.pictureInPictureElement")}}
-      {{Spec2("Picture-in-Picture")}}
-      Initial definition
+      {{SpecName("Picture-in-Picture", "#dom-documentorshadowroot-pictureinpictureelement", "Document.pictureInPictureElement")}}
     
   
 
 
 
    Browser compatibility
    
 
-
    {{Compat("api.DocumentOrShadowRoot.pictureInPictureElement")}}
    
+
    {{Compat("api.Document.pictureInPictureElement")}}
    
 
 
    See also
    
 
diff --git a/files/en-us/web/api/document/pictureinpictureenabled/index.html b/files/en-us/web/api/document/pictureinpictureenabled/index.html
index bf1cda7d2945dea..ff72dac0167c7be 100644
--- a/files/en-us/web/api/document/pictureinpictureenabled/index.html
+++ b/files/en-us/web/api/document/pictureinpictureenabled/index.html
@@ -82,6 +82,6 @@ 
    See also
    
   
  • {{DOMxRef("HTMLVideoElement.autoPictureInPicture")}}
    • 
   
  • {{DOMxRef("HTMLVideoElement.disablePictureInPicture")}}
    • 
   
  • {{DOMxRef("Document.exitPictureInPicture()")}}
    • 
-  
  • {{DOMxRef("DocumentOrShadowRoot.pictureInPictureElement")}}
    • 
+  
  • {{DOMxRef("Document.pictureInPictureElement")}}
    • 
   
  • {{CSSxRef(":picture-in-picture")}}
    • 
 
diff --git a/files/en-us/web/api/htmlvideoelement/requestpictureinpicture/index.html b/files/en-us/web/api/htmlvideoelement/requestpictureinpicture/index.html
index 9f7b838ec34ca18..67af27e0b595fcd 100644
--- a/files/en-us/web/api/htmlvideoelement/requestpictureinpicture/index.html
+++ b/files/en-us/web/api/htmlvideoelement/requestpictureinpicture/index.html
@@ -77,6 +77,6 @@ 
    See also
    
   
  • {{DOMxRef("HTMLVideoElement.disablePictureInPicture")}}
    • 
   
  • {{DOMxRef("Document.pictureInPictureEnabled")}}
    • 
   
  • {{DOMxRef("Document.exitPictureInPicture()")}}
    • 
-  
  • {{DOMxRef("DocumentOrShadowRoot.pictureInPictureElement")}}
    • 
+  
  • {{DOMxRef("Document.pictureInPictureElement")}}
    • 
   
  • {{CSSxRef(":picture-in-picture")}}
    • 
 
diff --git a/files/en-us/web/api/picture-in-picture_api/index.html b/files/en-us/web/api/picture-in-picture_api/index.html
index 1f408f71e1a858f..c5a9d32af2d3e1a 100644
--- a/files/en-us/web/api/picture-in-picture_api/index.html
+++ b/files/en-us/web/api/picture-in-picture_api/index.html
@@ -63,11 +63,11 @@ 
    Properties on the Document interfa
  
    The pictureInPictureEnabled property tells you whether or not it is possible to engage picture-in-picture mode. This is false if picture-in-picture mode is not available for any reason (e.g. the "picture-in-picture" feature has been disallowed, or picture-in-picture mode is not supported).
    
 
 
-
    Properties on the DocumentOrShadowRoot interface
    
+
    Properties on the Document or ShadowRoot interfaces
    
 
 
    
- 
    {{DOMxRef("DocumentOrShadowRoot.pictureInPictureElement")}}
    
- 
    The pictureInPictureElement property tells you which {{DOMxRef("Element")}} is currently being displayed in the floating window. If this is null, the document has no node currently in picture-in-picture mode.
    
+ 
    {{DOMxRef("Document.pictureInPictureElement")}} / {{DOMxRef("ShadowRoot.pictureInPictureElement")}}
    
+ 
    The pictureInPictureElement property tells you which {{DOMxRef("Element")}} is currently being displayed in the floating window (or in the shadow DOM). If this is null, the document (or shadow DOM) has no node currently in picture-in-picture mode.
    
 
    
 
 
    Events
    
@@ -164,11 +164,11 @@ 
    Document.exitPictureInPicture{{Compat("api.Document.exitPictureInPicture")}}
    
 
-
    DocumentOrShadowRoot.pictureInPictureElement
    
+
    Document.pictureInPictureElement
    
 
 
 
-
    {{Compat("api.DocumentOrShadowRoot.pictureInPictureElement")}}
    
+
    {{Compat("api.Document.pictureInPictureElement")}}
    
 
 
    PictureInPictureWindow
    
 
@@ -184,6 +184,6 @@ 
    See also
    
  
  • {{DOMxRef("HTMLVideoElement.disablePictureInPicture")}}
    • 
  
  • {{DOMxRef("Document.pictureInPictureEnabled")}}
    • 
  
  • {{DOMxRef("Document.exitPictureInPicture()")}}
    • 
- 
  • {{DOMxRef("DocumentOrShadowRoot.pictureInPictureElement")}}
    • 
+ 
  • {{DOMxRef("Document.pictureInPictureElement")}}
    • 
  
  • {{CSSxRef(":picture-in-picture")}}
    • 
 
diff --git a/files/en-us/web/api/shadowroot/index.html b/files/en-us/web/api/shadowroot/index.html
index c7a9c53c832b225..8fe04f669ca79c6 100644
--- a/files/en-us/web/api/shadowroot/index.html
+++ b/files/en-us/web/api/shadowroot/index.html
@@ -30,6 +30,8 @@ 
    Properties
    
  
    Sets or returns a reference to the DOM tree inside the ShadowRoot.
    
  
    {{domxref("ShadowRoot.mode")}} {{readonlyinline}}
    
  
    The mode of the ShadowRoot — either open or closed. This defines whether or not the shadow root's internal features are accessible from JavaScript.
    
+ 
    {{DOMxRef("ShadowRoot.pictureInPictureElement")}} {{ReadOnlyInline}}
    
+ 
    Returns the {{DOMxRef('Element')}} within the shadow tree that is currently being presented in picture-in-picture mode.
    
 
 
 
    Properties included from DocumentOrShadowRoot
    
diff --git a/files/en-us/web/api/shadowroot/pictureinpictureelement/index.html b/files/en-us/web/api/shadowroot/pictureinpictureelement/index.html
new file mode 100644
index 000000000000000..1f182671f858b83
--- /dev/null
+++ b/files/en-us/web/api/shadowroot/pictureinpictureelement/index.html
@@ -0,0 +1,58 @@
+---
+title: ShadowRoot.pictureInPictureElement
+slug: Web/API/ShadowRoot/pictureInPictureElement
+tags:
+- API
+- Property
+- Reference
+- ShadowRoot
+- Web Components
+- shadow dom
+---
+
    {{APIRef("Shadow DOM")}}
    
+
+
    The pictureInPictureElement read-only property of the
+{{domxref("ShadowRoot")}} interface returns the {{domxref("Element")}} that is currently being
+presented in picture-in-picture mode in this shadow tree, or null if
+picture-in-picture mode is not currently in use.
    
+
+
    Syntax
    
+
+
    shadowRoot.pictureInPictureElement
    
+
+
    Value
    
+
+
    A reference to the {{domxref("Element")}} object that's currently in
+  picture-in-picture mode, or, if picture-in-picture mode isn't currently in use by the
+  shadow tree, the returned value is null.
    
+
+
    Examples
    
+
+
    let customElem = document.querySelector('my-shadow-dom-element');
+let shadow = customElem.shadowRoot;
+let pipElem = shadow.pictureInPictureElement;
    
+
+
    Specifications
    
+
+
+  
+    
+      
+    
+  
+  
+    
+      
+    
+  
+
    Specification
    {{SpecName('Picture-in-Picture','#dom-documentorshadowroot-pictureinpictureelement', 'pictureInPictureElement')}}
    
+
+
    Browser compatibility
    
+
+
    {{Compat("api.ShadowRoot.pictureInPictureElement")}}
    
+
+
    See also
    
+
+
      
+  
    • {{domxref("Document.pictureInPictureElement")}}
      • 
+
    
diff --git a/files/en-us/web/css/_colon_picture-in-picture/index.html b/files/en-us/web/css/_colon_picture-in-picture/index.html
index fdab2d0802759e6..54ca8b08e4067ec 100644
--- a/files/en-us/web/css/_colon_picture-in-picture/index.html
+++ b/files/en-us/web/css/_colon_picture-in-picture/index.html
@@ -81,5 +81,5 @@ 
    See also
    
  
  • {{DOMxRef("HTMLVideoElement.disablePictureInPicture")}}
    • 
  
  • {{DOMxRef("Document.pictureInPictureEnabled")}}
    • 
  
  • {{DOMxRef("Document.exitPictureInPicture()")}}
    • 
- 
  • {{DOMxRef("DocumentOrShadowRoot.pictureInPictureElement")}}
    • 
+ 
  • {{DOMxRef("Document.pictureInPictureElement")}}
    •