[Fixed Position] Add fill properties

Add 'fill' properties, to allow specifying background
color in Fixed Position view. WTD-881.

platform/features/layout/res/templates/elements/telemetry.html

@@ -1,4 +1,5 @@
-<div style="background: #444;">
+<div ng-style="{ background: ngModel.element.fill }"
+     style="width: 100%; height: 100%;">
     <div style="position: absolute; left: 0px; top: 0px; bottom: 0px; width: 50%; overflow: hidden;">
         {{ngModel.name}}
     </div>

platform/features/layout/src/elements/BoxProxy.js

@@ -0,0 +1,40 @@
+/*global define*/
+
+define(
+    ['./ElementProxy', './AccessorMutator'],
+    function (ElementProxy, AccessorMutator) {
+        'use strict';
+
+        /**
+         * Selection proxy for Box elements in a fixed position view.
+         * Also serves as a superclass for Text elements, since those
+         * elements have a superset of Box properties.
+         *
+         * Note that arguments here are meant to match those expected
+         * by `Array.prototype.map`
+         *
+         * @constructor
+         * @param element the fixed position element, as stored in its
+         *        configuration
+         * @param index the element's index within its array
+         * @param {Array} elements the full array of elements
+         */
+        function BoxProxy(element, index, elements) {
+            var proxy = new ElementProxy(element, index, elements);
+
+            /**
+             * Get/set this element's fill color. (Omitting the
+             * argument makes this act as a getter.)
+             * @method
+             * @memberof BoxProxy
+             * @param {string} fill the new fill color
+             * @returns {string} the fill color
+             */
+            proxy.fill = new AccessorMutator(element, 'fill');
+
+            return proxy;
+        }
+
+        return BoxProxy;
+    }
+);

platform/features/layout/src/elements/TelemetryProxy.js

@@ -1,16 +1,26 @@
 /*global define*/
 
 define(
-    ['./ElementProxy'],
+    ['./TextProxy', './AccessorMutator'],
-    function (ElementProxy) {
+    function (TextProxy, AccessorMutator) {
         'use strict';
 
         /**
+         * Selection proxy for telemetry elements in a fixed position view.
          *
+         * Note that arguments here are meant to match those expected
+         * by `Array.prototype.map`
+         *
+         * @constructor
+         * @param element the fixed position element, as stored in its
+         *        configuration
+         * @param index the element's index within its array
+         * @param {Array} elements the full array of elements
          */
         function TelemetryProxy(element, index, elements) {
-            var proxy = new ElementProxy(element, index, elements);
+            var proxy = new TextProxy(element, index, elements);
 
+            // Expose the domain object identifier
             proxy.id = element.id;
 
             return proxy;

platform/features/layout/src/elements/TextProxy.js

@@ -0,0 +1,28 @@
+/*global define*/
+
+define(
+    ['./BoxProxy', './AccessorMutator'],
+    function (BoxProxy, AccessorMutator) {
+        'use strict';
+
+        /**
+         * Selection proxy for Text elements in a fixed position view.
+         *
+         * Note that arguments here are meant to match those expected
+         * by `Array.prototype.map`
+         *
+         * @constructor
+         * @param element the fixed position element, as stored in its
+         *        configuration
+         * @param index the element's index within its array
+         * @param {Array} elements the full array of elements
+         */
+        function TextProxy(element, index, elements) {
+            var proxy = new BoxProxy(element, index, elements);
+
+            return proxy;
+        }
+
+        return TextProxy;
+    }
+);

platform/features/layout/test/elements/BoxProxySpec.js

@@ -0,0 +1,36 @@
+/*global define,describe,it,expect,beforeEach,jasmine*/
+
+define(
+    ['../../src/elements/BoxProxy'],
+    function (BoxProxy) {
+        "use strict";
+
+        describe("A fixed position box proxy", function () {
+            var testElement,
+                testElements,
+                proxy;
+
+            beforeEach(function () {
+                testElement = {
+                    x: 1,
+                    y: 2,
+                    width: 42,
+                    height: 24,
+                    fill: "transparent"
+                };
+                testElements = [ {}, {}, testElement, {} ];
+                proxy = new BoxProxy(
+                    testElement,
+                    testElements.indexOf(testElement),
+                    testElements
+                );
+            });
+
+            it("provides getter/setter for fill color", function () {
+                expect(proxy.fill()).toEqual('transparent');
+                expect(proxy.fill('#FFF')).toEqual('#FFF');
+                expect(proxy.fill()).toEqual('#FFF');
+            });
+        });
+    }
+);

platform/features/layout/test/elements/TextProxySpec.js

@@ -0,0 +1,36 @@
+/*global define,describe,it,expect,beforeEach,jasmine*/
+
+define(
+    ['../../src/elements/TextProxy'],
+    function (TextProxy) {
+        "use strict";
+
+        describe("A fixed position text proxy", function () {
+            var testElement,
+                testElements,
+                proxy;
+
+            beforeEach(function () {
+                testElement = {
+                    x: 1,
+                    y: 2,
+                    width: 42,
+                    height: 24,
+                    fill: "transparent"
+                };
+                testElements = [ {}, {}, testElement, {} ];
+                proxy = new TextProxy(
+                    testElement,
+                    testElements.indexOf(testElement),
+                    testElements
+                );
+            });
+
+            it("provides getter/setter for fill color", function () {
+                expect(proxy.fill()).toEqual('transparent');
+                expect(proxy.fill('#FFF')).toEqual('#FFF');
+                expect(proxy.fill()).toEqual('#FFF');
+            });
+        });
+    }
+);

platform/features/layout/test/suite.json

@@ -5,9 +5,11 @@
     "LayoutDrag",
     "LayoutSelection",
     "elements/AccessorMutator",
+    "elements/BoxProxy",
     "elements/ElementFactory",
     "elements/ElementProxies",
     "elements/ElementProxy",
     "elements/LineProxy",
-    "elements/TelemetryProxy"
+    "elements/TelemetryProxy",
+    "elements/TextProxy"
 ]