initial commit

3 files changed, 363 insertions, 0 deletions

diff --git a/files/ru/web/api/vrdisplay/index.html b/files/ru/web/api/vrdisplay/index.html
new file mode 100644
index 0000000000..9bec0eb481
--- /dev/null
+++ b/files/ru/web/api/vrdisplay/index.html
@@ -0,0 +1,129 @@
+---
+title: VRDisplay
+slug: Web/API/VRDisplay
+tags:
+  - API
+  - DOM
+  - Experimental
+  - Interface
+  - Media
+  - NeedsTranslation
+  - Reference
+  - TopicStub
+  - VR
+  - VRDisplay
+  - Virtual Reality
+  - WebVR
+translation_of: Web/API/VRDisplay
+---
+<div>{{APIRef("WebVR API")}}{{SeeCompatTable}}</div>
+
+<p>The <strong><code>VRDisplay</code></strong> interface of the <a href="/en-US/docs/Web/API/WebVR_API">WebVR API</a> represents any VR device supported by this API. It includes generic information such as device IDs and descriptions, as well as methods for starting to present a VR scene, retrieving eye parameters and display capabilities, and other important functionality.</p>
+
+<p>An array of all connected VR Devices can be returned by invoking the {{domxref("Navigator.getVRDisplays()")}} method.</p>
+
+<h2 id="Properties">Properties</h2>
+
+<dl>
+ <dt>{{domxref("VRDisplay.capabilities")}} {{readonlyInline}}</dt>
+ <dd>Returns a {{domxref("VRDisplayCapabilities")}} object that indicates the various capabilities of the <code>VRDisplay</code>.</dd>
+ <dt>{{domxref("VRDisplay.depthFar")}}</dt>
+ <dd>Gets and sets the z-depth defining the far plane of the <a href="https://en.wikipedia.org/wiki/Viewing_frustum">eye view frustum</a>, i.e. the furthest viewable boundary of the scene.</dd>
+ <dt>{{domxref("VRDisplay.depthNear")}}</dt>
+ <dd>Gets and sets the z-depth defining the near plane of the <a href="https://en.wikipedia.org/wiki/Viewing_frustum">eye view frustum</a>, i.e. the nearest viewable boundary of the scene.</dd>
+ <dt>{{domxref("VRDisplay.displayId")}} {{readonlyInline}}</dt>
+ <dd>Returns an identifier for this particular VRDisplay, which is also used as an association point in the <a href="/en-US/docs/Web/API/Gamepad_API">Gamepad API</a> (see {{domxref("Gamepad.displayId")}}).</dd>
+ <dt>{{domxref("VRDisplay.displayName")}} {{readonlyInline}}</dt>
+ <dd>Returns a human-readable name to identify the <code>VRDisplay</code>.</dd>
+ <dt>{{domxref("VRDisplay.isConnected")}} {{readonlyInline}}</dt>
+ <dd>Returns a {{domxref("Boolean")}} indicating whether the <code>VRDisplay</code> is connected to the computer.</dd>
+ <dt>{{domxref("VRDisplay.isPresenting")}} {{readonlyInline}}</dt>
+ <dd>Returns a {{domxref("Boolean")}} indicating whether the <code>VRDisplay</code> is currently having content presented through it.</dd>
+ <dt>{{domxref("VRDisplay.stageParameters")}} {{readonlyInline}}</dt>
+ <dd>Returns a {{domxref("VRStageParameters")}} object containing room-scale parameters, if the <code>VRDisplay</code> is capable of supporting room-scale experiences.</dd>
+</dl>
+
+<h2 id="Methods">Methods</h2>
+
+<dl>
+ <dt>{{domxref("VRDisplay.getEyeParameters()")}}</dt>
+ <dd>Returns the {{domxref("VREyeParameters")}} object containing the eye parameters for the specified eye.</dd>
+ <dt>{{domxref("VRDisplay.getFrameData()")}}</dt>
+ <dd>Accepts a {{domxref("VRFrameData")}} object and populates it with the information required to render the current frame.</dd>
+ <dt>{{domxref("VRDisplay.getLayers()")}}</dt>
+ <dd>Returns the layers currently being presented by the <code>VRDisplay</code>.</dd>
+ <dt>{{domxref("VRDisplay.resetPose()")}}</dt>
+ <dd>Resets the pose for this <code>VRDisplay</code>, treating its current {{domxref("VRPose.position")}} and {{domxref("VRPose.orientation")}} as the "origin/zero" values.</dd>
+ <dt>{{domxref("VRDisplay.cancelAnimationFrame()")}}</dt>
+ <dd>A special implementation of {{domxref("Window.cancelAnimationFrame")}} that allows callbacks registered with {{domxref("VRDisplay.requestAnimationFrame()")}} to be unregistered.</dd>
+ <dt>{{domxref("VRDisplay.requestAnimationFrame()")}}</dt>
+ <dd>A special implementation of {{domxref("Window.requestAnimationFrame")}} containing a callback function that will be called every time a new frame of the <code>VRDisplay</code> presentation is rendered.</dd>
+ <dt>{{domxref("VRDisplay.requestPresent()")}}</dt>
+ <dd>Starts the <code>VRDisplay</code> presenting a scene.</dd>
+ <dt>{{domxref("VRDisplay.exitPresent()")}}</dt>
+ <dd>Stops the <code>VRDisplay</code> presenting a scene.</dd>
+ <dt>{{domxref("VRDisplay.submitFrame()")}}</dt>
+ <dd>Captures the current state of the {{domxref("VRLayer")}} currently being presented and displays it on the <code>VRDisplay</code>.</dd>
+</dl>
+
+<h3 id="Deprecated_methods">Deprecated methods</h3>
+
+<dl>
+ <dt>{{domxref("VRDisplay.getPose()")}} {{deprecated_inline}}</dt>
+ <dd>Returns a {{domxref("VRPose")}} object defining the future predicted pose of the <code>VRDisplay</code> as it will be when the current frame is actually presented. <strong>This method is deprecated — instead, you should use {{domxref("VRDisplay.getFrameData()")}}, which also provides a {{domxref("VRPose")}} object.</strong></dd>
+</dl>
+
+<h3 id="Obsolete_methods">Obsolete methods</h3>
+
+<dl>
+ <dt>{{domxref("VRDisplay.getImmediatePose()")}} {{obsolete_inline}}</dt>
+ <dd>Returns a {{domxref("VRPose")}} object defining the current pose of the <code>VRDisplay</code>, with no prediction applied. This is no longer needed, and has been removed from the spec.</dd>
+ <dt>{{domxref("VRDisplay.hardwareUnitId")}} {{obsolete_inline}}</dt>
+ <dd>Returns a {{domxref("DOMString")}} defining the shared ID of the display, and any other devices that are part of that hardware set (e.g. controllers). This is no longer needed, and has been removed from the spec. Displays now use {{domxref("VRDisplay.displayId")}}, and corresponsing controllers will now return the same ID under {{domxref("Gamepad.displayId")}}.</dd>
+</dl>
+
+<h2 id="Examples">Examples</h2>
+
+<pre class="brush: js">if(navigator.getVRDisplays) {
+  console.log('WebVR 1.1 supported');
+  // Then get the displays attached to the computer
+  navigator.getVRDisplays().then(function(displays) {
+    // If a display is available, use it to present the scene
+    if(displays.length &gt; 0) {
+      vrDisplay = displays[0];
+      // Now we have our VRDisplay object and can do what we want with it
+    }
+  });
+}</pre>
+
+<div class="note">
+<p><strong>Note</strong>: You can see this complete code at <a href="https://github.com/mdn/webvr-tests/blob/master/raw-webgl-example/webgl-demo.js">raw-webgl-example</a>.</p>
+</div>
+
+<h2 id="Specifications">Specifications</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('WebVR 1.1', '#interface-vrdisplay', 'VRDisplay')}}</td>
+   <td>{{Spec2('WebVR 1.1')}}</td>
+   <td>Initial definition</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+<p>{{Compat("api.VRDisplay")}}</p>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/API/WebVR_API">WebVR API homepage</a></li>
+ <li><a href="http://mozvr.com/">MozVr.com</a> — demos, downloads, and other resources from the Mozilla VR team.</li>
+</ul>
diff --git a/files/ru/web/api/vrdisplay/requestanimationframe/index.html b/files/ru/web/api/vrdisplay/requestanimationframe/index.html
new file mode 100644
index 0000000000..51d83bcea3
--- /dev/null
+++ b/files/ru/web/api/vrdisplay/requestanimationframe/index.html
@@ -0,0 +1,122 @@
+---
+title: VRDisplay.requestAnimationFrame()
+slug: Web/API/VRDisplay/requestAnimationFrame
+translation_of: Web/API/VRDisplay/requestAnimationFrame
+---
+<div>{{APIRef("WebVR API")}}{{SeeCompatTable}}</div>
+
+<p>Метод <code><strong>requestAnimationFrame()</strong></code> интерфейса {{domxref("VRDisplay")}} является специфичной реализацией метода {{domxref("Window.requestAnimationFrame")}} и принимает в качестве аргумента функцию обратного вызова (callback-функция). Эта функция будет вызвана, когда объект типа <code>VRDisplay</code> будет готов отобразить новый кадр сцены:</p>
+
+<ul>
+ <li>Если в этот момент объект типа <code>VRDisplay</code> не находится в процессе отображения сцены, то вызов этой функции эквивалентен вызову {{domxref("Window.requestAnimationFrame")}}.</li>
+ <li>Если объект типа <code>VRDisplay</code> находится в состоянии отображения сцены, вызов callback-функции происходит с собственной частотой обновления устройства, представленного этим объектом.</li>
+</ul>
+
+<h2 id="Синтаксис">Синтаксис</h2>
+
+<pre class="brush: js">var handle = vrDisplayInstance.requestAnimationFrame(<em>callback</em>);
+</pre>
+
+<h3 id="Параметры">Параметры</h3>
+
+<dl>
+ <dt>callback</dt>
+ <dd>callback-функция, которая будет вызвана когда объект типа <code>VRDisplay</code> будет готов отобразить новый кадр сцены.</dd>
+</dl>
+
+<h3 id="Возвращаемое_значение">Возвращаемое значение</h3>
+
+<p>A long representing the handle of the <code>requestAnimationFrame()</code> call. This can then be passed to a {{domxref("VRDisplay.cancelAnimationFrame()")}} call to unregister the callback.</p>
+
+<h2 id="Examples">Examples</h2>
+
+<pre class="brush: js">var frameData = new VRFrameData();
+var vrDisplay;
+
+navigator.getVRDisplays().then(function(displays) {
+  vrDisplay = displays[0];
+  console.log('Display found');
+  // Starting the presentation when the button is clicked: It can only be called in response to a user gesture
+  btn.addEventListener('click', function() {
+    vrDisplay.requestPresent([{ source: canvas }]).then(function() {
+      drawVRScene();
+    });
+  });
+});
+
+// WebVR: Draw the scene for the WebVR display.
+function drawVRScene() {
+  // WebVR: Request the next frame of the animation
+  vrSceneFrame = vrDisplay.requestAnimationFrame(drawVRScene);
+
+  // Populate frameData with the data of the next frame to display
+  vrDisplay.getFrameData(frameData);
+
+  // You can get the position, orientation, etc. of the display from the current frame's pose
+  var curFramePose = frameData.pose;
+  var curPos = curFramePose.position;
+  var curOrient = curFramePose.orientation;
+
+  // Clear the canvas before we start drawing on it.
+
+  gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);
+
+  // WebVR: Create the required projection and view matrix locations needed
+  // for passing into the uniformMatrix4fv methods below
+
+  var projectionMatrixLocation = gl.getUniformLocation(shaderProgram, "projMatrix");
+  var viewMatrixLocation = gl.getUniformLocation(shaderProgram, "viewMatrix");
+
+  // WebVR: Render the left eye’s view to the left half of the canvas
+  gl.viewport(0, 0, canvas.width * 0.5, canvas.height);
+  gl.uniformMatrix4fv(projectionMatrixLocation, false, frameData.leftProjectionMatrix);
+  gl.uniformMatrix4fv(viewMatrixLocation, false, frameData.leftViewMatrix);
+  drawGeometry();
+
+  // WebVR: Render the right eye’s view to the right half of the canvas
+  gl.viewport(canvas.width * 0.5, 0, canvas.width * 0.5, canvas.height);
+  gl.uniformMatrix4fv(projectionMatrixLocation, false, frameData.rightProjectionMatrix);
+  gl.uniformMatrix4fv(viewMatrixLocation, false, frameData.rightViewMatrix);
+  drawGeometry();
+
+  function drawGeometry() {
+    // draw the view for each eye
+  }
+
+    ...
+
+  // WebVR: Indicate that we are ready to present the rendered frame to the VR display
+  vrDisplay.submitFrame();
+}</pre>
+
+<div class="note">
+<p><strong>Note</strong>: You can see this complete code at <a href="https://github.com/mdn/webvr-tests/blob/master/raw-webgl-example/webgl-demo.js">raw-webgl-example</a>.</p>
+</div>
+
+<h2 id="Specifications">Specifications</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('WebVR 1.1', '#dom-vrdisplay-requestanimationframe', 'requestAnimationFrame()')}}</td>
+   <td>{{Spec2('WebVR 1.1')}}</td>
+   <td>Initial definition</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+<p>{{Compat("api.VRDisplay.requestAnimationFrame")}}</p>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/API/WebVR_API">WebVR API homepage</a></li>
+ <li><a href="http://mozvr.com/">MozVr.com</a> — demos, downloads, and other resources from the Mozilla VR team.</li>
+</ul>
diff --git a/files/ru/web/api/vrdisplay/requestpresent/index.html b/files/ru/web/api/vrdisplay/requestpresent/index.html
new file mode 100644
index 0000000000..9537b94035
--- /dev/null
+++ b/files/ru/web/api/vrdisplay/requestpresent/index.html
@@ -0,0 +1,112 @@
+---
+title: VRDisplay.requestPresent()
+slug: Web/API/VRDisplay/requestPresent
+translation_of: Web/API/VRDisplay/requestPresent
+---
+<div>{{APIRef("WebVR API")}}{{SeeCompatTable}}</div>
+
+<p>Метод <code><strong>requestPresent()</strong></code> объекта реализующего интерфейс {{domxref("VRDisplay")}} отвечает за начало отображения сцены на VR устройстве, которое представлено этим объектом.</p>
+
+<h2 id="Синтаксис">Синтаксис</h2>
+
+<pre class="brush: js">vrDisplayInstance.requestPresent(<em>layers</em>).then(function() {
+  //Действия после начала отображения сцены
+});
+</pre>
+
+<h3 id="Параметры">Параметры</h3>
+
+<dl>
+ <dt>layers</dt>
+ <dd>Массив объектов типа {{domxref("VRLayerInit")}}, представляющих собой сцену, которую Вы хотите отобразить. На данный момент может быть минимум 0 элементов, максимум - 1.</dd>
+</dl>
+
+<h3 id="Возвращаемое_значение">Возвращаемое значение</h3>
+
+<p>Объект типа <a href="/ru/docs/Web/JavaScript/Reference/Global_Objects/Promise">Promise</a>, переходящий в состояние "выполнено" в момент начала отображения сцены. Существует ряд правил, касающийся перехода Promise в состояние "выполнено" и в состояние "отклонено":</p>
+
+<div>
+<ul>
+ <li>Если {{domxref("VRDisplayCapabilities.canPresent")}} ложно или если массив объектов VRLayer содержит более чем {{domxref("VRDisplayCapabilities.maxLayers")}} слоев, произойдёт переход в состояние "отклонено".</li>
+ <li>Если объект {{domxref("VRDisplay")}} уже отображает сцену, то вызов его метода <code>requestPresent()</code> обновит массив отображаемых <code>VRLayer</code> объектов.</li>
+ <li>Если объект <code>VRDisplay</code> уже отображает сцену, а вызов метода <code>requestPresent()</code> приведет к возврату Promise в состоянии "отклонено", то отображение сцены прекратится.</li>
+ <li>If <code>requestPresent()</code> is called outside of an engagement gesture the promise will be rejected unless the <code>VRDisplay</code> was already presenting. This engagement gesture is also sufficient to allow <code><a href="/en-US/docs/Web/API/Element/requestPointerLock">requestPointerLock()</a></code> calls until presentation has ended.</li>
+</ul>
+</div>
+
+<h2 id="Examples">Examples</h2>
+
+<pre class="brush: js">if(navigator.getVRDisplays) {
+  console.log('WebVR 1.1 supported');
+  // Then get the displays attached to the computer
+  navigator.getVRDisplays().then(function(displays) {
+    // If a display is available, use it to present the scene
+    if(displays.length &gt; 0) {
+      vrDisplay = displays[0];
+      console.log('Display found');
+      // Starting the presentation when the button is clicked: It can only be called in response to a user gesture
+      btn.addEventListener('click', function() {
+        if(btn.textContent === 'Start VR display') {
+          vrDisplay.requestPresent([{ source: canvas }]).then(function() {
+            console.log('Presenting to WebVR display');
+
+            // Set the canvas size to the size of the vrDisplay viewport
+
+            var leftEye = vrDisplay.getEyeParameters('left');
+            var rightEye = vrDisplay.getEyeParameters('right');
+
+            canvas.width = Math.max(leftEye.renderWidth, rightEye.renderWidth) * 2;
+            canvas.height = Math.max(leftEye.renderHeight, rightEye.renderHeight);
+
+            // stop the normal presentation, and start the vr presentation
+            window.cancelAnimationFrame(normalSceneFrame);
+            drawVRScene();
+
+            btn.textContent = 'Exit VR display';
+          });
+        } else {
+          vrDisplay.exitPresent();
+          console.log('Stopped presenting to WebVR display');
+
+          btn.textContent = 'Start VR display';
+
+          // Stop the VR presentation, and start the normal presentation
+          vrDisplay.cancelAnimationFrame(vrSceneFrame);
+          drawScene();
+        }
+      });
+    }
+  });
+}</pre>
+
+<div class="note">
+<p><strong>Note</strong>: You can see this complete code at <a href="https://github.com/mdn/webvr-tests/blob/master/raw-webgl-example/webgl-demo.js">raw-webgl-example</a>.</p>
+</div>
+
+<h2 id="Specifications">Specifications</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('WebVR 1.1', '#dom-vrdisplay-requestpresent', 'requestPresent()')}}</td>
+   <td>{{Spec2('WebVR 1.1')}}</td>
+   <td>Initial definition</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+<p>{{Compat("api.VRDisplay.requestPresent")}}</p>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/API/WebVR_API">WebVR API homepage</a></li>
+ <li><a href="http://mozvr.com/">MozVr.com</a> — demos, downloads, and other resources from the Mozilla VR team.</li>
+</ul>