Allow individual UI element properties to be modified.

chrome/browser/resources/vr_shell/vr_shell_ui_api.js

 // Copyright 2016 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
 var api = {};
 
 /**
  * Enumeration of scene update commands.
  * @enum {number}
  * @const
@@ skipping 125 matching lines @@
 api.Fill = class {
   constructor(type) {
     this.properties = {};
     this.properties['fillType'] = type;
   }
 }
 
 api.Sprite = class extends api.Fill {
   constructor(pixelX, pixelY, pixelWidth, pixelHeight) {
     super(api.FillType.SPRITE);
-    this.properties.copyRect =
-        {x: pixelX, y: pixelY, width: pixelWidth, height: pixelHeight};
+    this.properties['copyRectX'] = pixelX;
+    this.properties['copyRectY'] = pixelY;
+    this.properties['copyRectWidth'] = pixelWidth;
+    this.properties['copyRectHeight'] = pixelHeight;
   }
 }
 
 api.OpaqueGradient = class extends api.Fill {
   constructor(edgeColor, centerColor) {
     super(api.FillType.OPAQUE_GRADIENT);
     this.properties.edgeColor = edgeColor;
     this.properties.centerColor = centerColor;
   }
 }
@@ skipping 42 matching lines @@
   setParentId(id) {
     this.properties['parentId'] = id;
   }
 
   /**
    * Specify the width and height (in meters) of an element.
    * @param {number} x
    * @param {number} y
    */
   setSize(x, y) {
-    this.properties['size'] = {x: x, y: y};
+    this.properties['sizeX'] = x;
+    this.properties['sizeY'] = y;
   }
 
   /**
    * Specify optional scaling of the element, and any children.
    * @param {number} x
    * @param {number} y
    * @param {number} z
    */
   setScale(x, y, z) {
-    this.properties['scale'] = {x: x, y: y, z: z};
+    this.properties['scaleX'] = x;
+    this.properties['scaleY'] = y;
+    this.properties['scaleZ'] = z;
   }
 
   /**
    * Specify rotation for the element. The rotation is specified in axis-angle
    * representation (rotate around unit vector [x, y, z] by 'a' radians).
    * @param {number} x
    * @param {number} y
    * @param {number} z
    * @param {number} a
    */
   setRotation(x, y, z, a) {
-    this.properties['rotation'] = {x: x, y: y, z: z, a: a};
+    this.properties['rotationX'] = x;
+    this.properties['rotationY'] = y;
+    this.properties['rotationZ'] = z;
+    this.properties['rotationAngle'] = a;
   }
 
   /**
    * Specify the translation of the element. If anchoring is specified, the
    * offset is applied to the anchoring position rather than the origin.
    * Translation is applied after scaling and rotation.
    * @param {number} x
    * @param {number} y
    * @param {number} z
    */
   setTranslation(x, y, z) {
-    this.properties['translation'] = {x: x, y: y, z: z};
+    this.properties['translationX'] = x;
+    this.properties['translationY'] = y;
+    this.properties['translationZ'] = z;
   }
 
   /**
    * Anchoring allows a rectangle to be positioned relative to the edge of
    * its parent, without being concerned about the size of the parent.
    * Values should be XAnchoring and YAnchoring elements.
    * Example: element.setAnchoring(XAnchoring.XNONE, YAnchoring.YBOTTOM);
    * @param {number} x
    * @param {number} y
    */
@@ skipping 389 matching lines @@
     if ('updateTab' in dict) {
       this.onUpdateTab(dict['updateTab']);
     }
     if ('removeTab' in dict) {
       this.onRemoveTab(dict['removeTab']);
     }
 
     this.onCommandHandlerFinished()
   }
 };