From 9ff9a2304ad584195e0e9a2ec5d14ddd84834b12 Mon Sep 17 00:00:00 2001 From: Paulo Diogo S Andrade Date: Mon, 15 Aug 2016 18:43:01 -0300 Subject: [PATCH 1/2] Implementing a way to switch to smallest or tallest size base --- angular-vertilize.js | 21 +++++++++++++++------ 1 file changed, 15 insertions(+), 6 deletions(-) diff --git a/angular-vertilize.js b/angular-vertilize.js index 6556218..36cecf6 100644 --- a/angular-vertilize.js +++ b/angular-vertilize.js @@ -15,8 +15,9 @@ return { restrict: 'EA', controller: [ - '$scope', '$window', - function($scope, $window){ + '$scope', '$window', '$attrs', + function($scope, $window, $attrs){ + // Alias this var _this = this; @@ -34,13 +35,21 @@ _this.childrenHeights[index] = height; }; - // API: Get tallest height + // API: Get smallest/tallest height _this.getTallestHeight = function(){ - var height = 0; + + var heights = []; + for (var i=0; i < _this.childrenHeights.length; i=i+1){ - height = Math.max(height, _this.childrenHeights[i]); + heights.push(_this.childrenHeights[i]); } - return height; + + if($attrs.vertilizeContainer && $attrs.vertilizeContainer.toLowerCase() == 'min'){ + return Math.min.apply(null, heights) || 0; + } else { + return Math.max.apply(null, heights) || 0; + } + }; // Add window resize to digest cycle From e6be0e87d4243421d09fcef45440b812f184356e Mon Sep 17 00:00:00 2001 From: Paulo Diogo S Andrade Date: Mon, 15 Aug 2016 18:59:07 -0300 Subject: [PATCH 2/2] Update README.md --- README.md | 10 +++++++++- 1 file changed, 9 insertions(+), 1 deletion(-) diff --git a/README.md b/README.md index 274cad3..0f77ee4 100644 --- a/README.md +++ b/README.md @@ -14,6 +14,14 @@ First, add `angular.vertilize` to your Angular application module dependencies. ``` +## Usage: smallest height +Is it possibel do set, intead watch for the tallest element as base height, use the smallest one. + +## Example: smallest height +```html +
...
+``` + ## How it works The `vertilize-container` directive groups and gives scope to it's child `vertilize` directives. The `vertilize` elements DO NOT need to be the immediate children of `vertilize-container` and can be on any kind of element, as long as its CSS `display` property is set to `block` or `inline-block`. When any of the `vertilize` elements' height changes to become the tallest sibling, either due to a window resize, element width change, or content being added or removed, all siblings set their height to match. @@ -24,4 +32,4 @@ Open the `index.html` file in your web browser or go to [http://sixthdim.github. angular-vertilize has been tested in all modern browsers, as well as IE8 and works well. Feel free to submit a pull request if you find a bug or have a better way of handling something in the module. ## License -MIT \ No newline at end of file +MIT