[Fixed Position] Fill available area with grid

Fill available space with background grid for fixed position
view, WTD-615.
This commit is contained in:
Victor Woeltjen 2015-01-15 18:53:59 -08:00
parent b2bfa2b09b
commit bd068f31c5
2 changed files with 17 additions and 3 deletions

View File

@ -1,7 +1,8 @@
<div style="width: 100%; height: 100%; position: absolute; left: 0px; top: 0px;" <div style="width: 100%; height: 100%; position: absolute; left: 0px; top: 0px;"
ng-controller="FixedController as controller"> ng-controller="FixedController as controller"
mct-resize="controller.setBounds(bounds)">
<!-- Background grid --> <!-- Background grid -->
<div ng-repeat="cell in controller.getCellStyles()" <div ng-repeat="cell in controller.getCellStyles()"

View File

@ -49,8 +49,8 @@ define(
cellStyles.push({ cellStyles.push({
left: x * gridSize[0] + 'px', left: x * gridSize[0] + 'px',
top: y * gridSize[1] + 'px', top: y * gridSize[1] + 'px',
width: gridSize[0] - 2 + 'px', width: gridSize[0] - 1 + 'px',
height: gridSize[1] - 2 + 'px' height: gridSize[1] - 1 + 'px'
}); });
} }
} }
@ -120,6 +120,19 @@ define(
getCellStyles: function () { getCellStyles: function () {
return cellStyles; return cellStyles;
}, },
/**
* Set the size of the viewable fixed position area.
* @memberof FixedController#
* @param bounds the width/height, as reported by mct-resize
*/
setBounds: function (bounds) {
var w = Math.ceil(bounds.width / gridSize[0]),
h = Math.ceil(bounds.height / gridSize[1]);
if (w !== gridExtent[0] || h !== gridExtent[1]) {
gridExtent = [w, h];
refreshCellStyles();
}
},
/** /**
* Get a style object for a frame with the specified domain * Get a style object for a frame with the specified domain
* object identifier, suitable for use in an `ng-style` * object identifier, suitable for use in an `ng-style`