Skip to content
This repository has been archived by the owner on Sep 8, 2020. It is now read-only.

Commit

Permalink
feat(layout): add element and attribute support.
Browse files Browse the repository at this point in the history
you can now create a layout like :

```html
<div ui-layout="{ flow : 'row' }"></div>
or
<ui-layout options="{ flow : 'row' }"></ui-layout>
```
  • Loading branch information
douglasduteil committed Nov 20, 2013
1 parent 6da2196 commit 5298396
Show file tree
Hide file tree
Showing 2 changed files with 21 additions and 11 deletions.
4 changes: 2 additions & 2 deletions ui-layout.css
Original file line number Diff line number Diff line change
Expand Up @@ -20,12 +20,12 @@
z-index: 99999;
}

.ui-layout[flow="row"] > .ui-splitbar{
.ui-layout-row > .ui-splitbar{
top: 25%;
height: 8px; width: 100%;
cursor: row-resize;
}
.ui-layout[flow="column"] > .ui-splitbar{
.ui-layout-column > .ui-splitbar{
left: 25%;
width: 8px; height: 100%;
cursor: col-resize;
Expand Down
28 changes: 19 additions & 9 deletions ui-layout.js
Original file line number Diff line number Diff line change
Expand Up @@ -38,19 +38,26 @@
*/
angular.module('ui.layout', [])

.directive('uiLayout', function(){
.directive('uiLayout', ['$parse', function($parse){

var splitBarElem_htmlTemplate = '<div class="stretch ui-splitbar"></div>';

return {
restrict: 'C',
restrict: 'AE',
compile: function compile(tElement, tAttrs) {

var _i, _childens = tElement.children(), _child_len = _childens.length;
var isUsingColumnFlow = tAttrs.flow === 'column';
// Force the layout to fill the parent space
// fix no height layout...
tElement.addClass('stretch');

// Parse `ui-layout` or `options` attributes (with no scope...)
var opts = angular.extend({}, $parse(tAttrs.uiLayout)(), $parse(tAttrs.options)());
var isUsingColumnFlow = opts.flow === 'column';

tElement
// Force the layout to fill the parent space
// fix no height layout...
.addClass('stretch')
// set the layout css class
.addClass('ui-layout-' + opts.flow);

// Stretch all the children by default
for (_i = 0; _i < _child_len ; ++_i){
Expand Down Expand Up @@ -79,11 +86,14 @@ angular.module('ui.layout', [])
},
controller: ['$scope', '$attrs', '$element', function uiLayoutCtrl($scope, $attrs, $element){
// Gives to the children directives the access to the parent layout.
return { flow : $attrs.flow, element : $element};
return {
opts : angular.extend({}, $scope.$eval($attrs.uiLayout), $scope.$eval($attrs.options)),
element : $element
};
}]
};

})
}])


.directive('uiSplitbar', function(){
Expand All @@ -100,7 +110,7 @@ angular.module('ui.layout', [])
var _cache = {};

// Use relative mouse position
var isUsingColumnFlow = parentLayout.flow === 'column';
var isUsingColumnFlow = parentLayout.opts.flow === 'column';
var mouseProperty = ( isUsingColumnFlow ? 'x' : 'y');

// Use bounding box / css property names
Expand Down

0 comments on commit 5298396

Please # to comment.