Move the entry point of the API to the window.navigator interface.

darktears · darktears · commit a3272e6a64df · 2021-04-30T12:39:43.000-04:00
Closes #67
diff --git a/README.md b/README.md
@@ -40,9 +40,9 @@ Among the values that the device-posture query can take are:
 /*for a monitor scenario*/
 @media (device-posture: flat) and (orientation: portrait) { ... }
 ```
-### New JS object in `window.screen`: `posture`
+### New JS object in `window.navigator`: `devicePosture`
 
-The Window property screen returns a reference to the screen object associated with the window. It already houses a similar property [`orientation`](https://developer.mozilla.org/en-US/docs/Web/API/ScreenOrientation) that itself has a value for an [angle](https://w3c.github.io/screen-orientation/#idl-index).
+The Navigator property of Window [navigator](https://html.spec.whatwg.org/multipage/system-state.html#the-navigator-object) should host device capabilities and system states.
 
 #### Proposed Object
 ```javascript
diff --git a/index.html b/index.html
@@ -132,18 +132,18 @@ <h2>
         provide a different layout for it depending on the posture state in which the device is being used.
       </p>
     </section>
-    <section data-dfn-for="Screen">
+    <section data-dfn-for="Navigator">
       <h2>
-        Extensions to the `Screen` interface
+        Extensions to the `Navigator` interface
       </h2>
       <p>
-        The [[cssom-view]] specification defines the <dfn>Screen</dfn> interface,
+        The [[HTML]] specification defines the <dfn>Navigator</dfn> interface,
         which this specification extends:
       </p>
       <pre class="idl">
-        [SecureContext]
-        partial interface Screen {
-          [SameObject] readonly attribute DevicePosture posture;
+        [SecureContext, Exposed=(Window)]
+        partial interface Navigator {
+          [SameObject] readonly attribute DevicePosture devicePosture;
         };
       </pre>
     </section>
@@ -508,7 +508,7 @@ <h2>
               </li>
               <li>
                 <a>Fire an event</a> named `change` at |document|'s
-                {{Screen.posture}} object.
+                {{Window.navigator.devicePosture}} object.
               </li>
             </ol>
           </li>
@@ -535,14 +535,14 @@ <h2>
             <ol>
               <li>
                 <a>Fire an event</a> named `change` at the |document|'s
-                {{Screen.posture}} object.
+                {{Window.navigator.devicePosture}} object.
               </li>
             </ol>
           </li>
         </ol>
         <div class="note">
           <p>
-            Developers need to be aware that a {{Screen.posture}} object
+            Developers need to be aware that a {{Window.navigator.devicePosture}} object
             from a <a>document</a> that is not visible, as per
             [[PAGE-VISIBILITY]], will not receive an orientation change event.
             This is to prevent unnecessary changes to layout, etc. in the
@@ -640,8 +640,8 @@ <h2>
       <h3>Example 1: Posture data</h3>
       <p>This is a simple use case of the <a>posture</a> being printed on the console. </p>
       <pre class="example js" title="React to poster change">
-          screen.posture.addEventListener("change", () => {
-            console.log(`The current posture is: ${screen.posture.type}!`);
+          navigator.devicePosture.addEventListener("change", () => {
+            console.log(`The current posture is: ${navigator.devicePosture.type}!`);
           })
       </pre>
       <h3>Example 2: device-posture</h3>
