[Fixed Position] Add element factory

Add element factory, which will take on responsibility
for populating initial states of elements and (if necessary)
prompting for user input. WTD-880.

platform/features/layout/bundle.json

@@ -83,7 +83,13 @@
             {
                 "key": "FixedController",
                 "implementation": "FixedController.js",
-                "depends": [ "$scope", "telemetrySubscriber", "telemetryFormatter" ]
+                "depends": [
+                    "$scope",
+                    "$q",
+                    "dialogService",
+                    "telemetrySubscriber",
+                    "telemetryFormatter"
+                ]
             }
         ],
         "templates": [

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

@@ -1 +1 @@
-<img ng-src="ngModel.url" style="width: 100%; height: 100%;"></img>
+<img ng-src="{{ngModel.element.url}}" style="width: 100%; height: 100%;"></img>

platform/features/layout/src/FixedController.js

@@ -17,7 +17,7 @@ define(
          * @constructor
          * @param {Scope} $scope the controller's Angular scope
          */
-        function FixedController($scope, telemetrySubscriber, telemetryFormatter) {
+        function FixedController($scope, $q, dialogService, telemetrySubscriber, telemetryFormatter) {
             var gridSize = DEFAULT_GRID_SIZE,
                 gridExtent = DEFAULT_GRID_EXTENT,
                 dragging,
@@ -190,7 +190,12 @@ define(
             if (Array.isArray($scope.selection)) {
                 selection = new LayoutSelection(
                     $scope.selection,
-                    new FixedProxy($scope.configuration)
+                    new FixedProxy(
+                        $scope.configuration,
+                        $q,
+                        dialogService,
+                        refreshElements
+                    )
                 );
             }
 

platform/features/layout/src/FixedProxy.js

@@ -1,29 +1,44 @@
 /*global define,window*/
 
 define(
-    [],
-    function () {
+    ['./elements/ElementFactory'],
+    function (ElementFactory) {
         "use strict";
 
         /**
          * Proxy for configuring a fixed position view via the toolbar.
          * @constructor
-         * @param configuration the view configuration object
+         * @param configuration the view configuration object to manage
          */
-        function FixedProxy(configuration) {
+        function FixedProxy(configuration, $q, dialogService, callback) {
+            var factory = new ElementFactory(dialogService);
+
             return {
                 /**
                  * Add a new visual element to this view.
                  */
                 add: function (type) {
-                    configuration.elements = configuration.elements || [];
-                    configuration.elements.push({
-                        x: configuration.elements.length,
-                        y: configuration.elements.length,
-                        width: 2,
-                        height: 1,
-                        type: type
-                    });
+                    // Place a configured element into the view configuration
+                    function addElement(element) {
+                        // Ensure that there is an Elements array
+                        configuration.elements = configuration.elements || [];
+
+                        // Configure common properties of the element
+                        element.x = element.x || 0;
+                        element.y = element.y || 0;
+                        element.width = element.width || 1;
+                        element.height = element.height || 1;
+                        element.type = type;
+
+                        // Finally, add it to the view's configuration
+                        configuration.elements.push(element);
+
+                        // Let the view know it needs to refresh
+                        callback();
+                    }
+
+                    // Defer creation to the factory
+                    $q.when(factory.createElement(type)).then(addElement);
                 }
             };
         }

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

@@ -0,0 +1,48 @@
+/*global define*/
+
+define(
+    [],
+    function () {
+        "use strict";
+
+        var INITIAL_STATES = {
+                "fixed.image": {
+                    url: "http://www.nasa.gov/sites/default/themes/NASAPortal/images/nasa-logo.gif"
+                }
+            },
+            DIALOGS = {
+
+            };
+
+        /**
+         * The ElementFactory creates new instances of elements for the
+         * fixed position view, prompting for user input where necessary.
+         * @param {DialogService} dialogService service to request user input
+         * @constructor
+         */
+        function ElementFactory(dialogService) {
+            return {
+                /**
+                 * Create a new element for the fixed position view.
+                 * @param {string} type the type of element to create
+                 * @returns {Promise|object} the created element, or a promise
+                 *          for that element
+                 */
+                createElement: function (type) {
+                    var initialState = INITIAL_STATES[type] || {};
+
+                    // Clone that state
+                    initialState = JSON.parse(JSON.stringify(initialState));
+
+                    // Show a dialog to configure initial state, if appropriate
+                    return DIALOGS[type] ? dialogService.getUserInput(
+                        DIALOGS[type],
+                        initialState
+                    ) : initialState;
+                }
+            };
+        }
+
+        return ElementFactory;
+    }
+);