[Edit] Add toolbar representer

Add a representer to handle exposing toolbars for views in
edit mode. WTD-878.
This commit is contained in:
Victor Woeltjen 2015-02-17 14:31:02 -08:00
parent 5dc72b15c2
commit 023c12ec3b
2 changed files with 94 additions and 3 deletions

View File

@ -3,11 +3,15 @@
ng-model="representation">
</mct-representation>
<div class="holder edit-area outline abs">
<!-- edit toolbar goes here -->
<mct-toolbar name="mctToolbar"
structure="toolbar.structure"
ng-model="toolbar.state">
</mct-toolbar>
<div class='split-layout vertical contents abs work-area'>
<div class='abs pane left edit-main'>
<div class='holder abs object-holder'>
<mct-representation key="representation.selected.key"
toolbar="toolbar"
mct-object="domainObject">
</mct-representation>
</div>

View File

@ -1,8 +1,95 @@
/*global define*/
define(
[],
function () {
['./EditToolbar'],
function (EditToolbar) {
"use strict";
// No operation
function noop() {}
/**
* The EditToolbarRepresenter populates the toolbar in Edit mode
* based on a view's definition.
* @param {Scope} scope the Angular scope of the representation
* @constructor
*/
function EditToolbarRepresenter(scope, element, attrs) {
var definition,
unwatch,
toolbar,
toolbarObject = {};
// Handle changes to the current selection
function updateSelection(selection) {
// Make sure selection is array-like
selection = Array.isArray(selection) ?
selection :
(selection ? [selection] : []);
// Instantiate a new toolbar...
toolbar = new EditToolbar(definition, selection);
// ...and expose its structure/state
toolbarObject.structure = toolbar.getStructure();
toolbarObject.state = toolbar.getState();
}
// Update selection models to match changed toolbar state
function updateState(state) {
state.forEach(toolbar.updateState);
}
// Represent a domain object using this definition
function represent(representation) {
// Clear any existing selection
scope.selection = [];
// Get the newest toolbar definition from the view
definition = (representation || {}).toolbar || {};
// Initialize toolbar to an empty selection
updateSelection([]);
}
// Destroy; stop watching the parent for changes in
// toolbar state.
function destroy() {
if (unwatch) {
unwatch();
unwatch = undefined;
}
}
// If we have been asked to expose toolbar state...
if (attrs.toolbar) {
// Expose toolbar state under that name
scope.$parent[attrs.toolbar] = toolbarObject;
// Detect and handle changes to state from the toolbar
unwatch = scope.$parent.$watchCollection(
attrs.toolbar + ".state",
updateState
);
// Watch for changes in the current selection state
scope.$watchCollection("selection", updateSelection);
}
return {
/**
* Set the current representation in use, and the domain
* object being represented.
*
* @param {RepresentationDefinition} representation the
* definition of the representation in use
* @param {DomainObject} domainObject the domain object
* being represented
*/
represent: (attrs || {}).toolbar ? represent : noop,
/**
* Release any resources associated with this representer.
*/
destroy: (attrs || {}).toolbar ? destroy : noop
};
}
return EditToolbarRepresenter;
}
);