diff options
author | talasila <talasila@research.att.com> | 2017-02-07 15:03:57 -0500 |
---|---|---|
committer | talasila <talasila@research.att.com> | 2017-02-07 15:05:15 -0500 |
commit | 4ad39a5c96dd99acf819ce189b13fec946d7506b (patch) | |
tree | a1449286441947cc3d07a45227fa0d6f978e1a7d /ecomp-portal-FE/client/bower_components/angular-material/modules/closure/progressLinear/progressLinear.js | |
parent | 5500448cbd1f374d0ac743ee2fd636fe2d3c0027 (diff) |
Initial OpenECOMP Portal commit
Change-Id: I804b80e0830c092e307da1599bd9fbb5c3e2da77
Signed-off-by: talasila <talasila@research.att.com>
Diffstat (limited to 'ecomp-portal-FE/client/bower_components/angular-material/modules/closure/progressLinear/progressLinear.js')
-rw-r--r-- | ecomp-portal-FE/client/bower_components/angular-material/modules/closure/progressLinear/progressLinear.js | 126 |
1 files changed, 126 insertions, 0 deletions
diff --git a/ecomp-portal-FE/client/bower_components/angular-material/modules/closure/progressLinear/progressLinear.js b/ecomp-portal-FE/client/bower_components/angular-material/modules/closure/progressLinear/progressLinear.js new file mode 100644 index 00000000..2e7b4f0a --- /dev/null +++ b/ecomp-portal-FE/client/bower_components/angular-material/modules/closure/progressLinear/progressLinear.js @@ -0,0 +1,126 @@ +/*! + * Angular Material Design + * https://github.com/angular/material + * @license MIT + * v0.9.8 + */ +goog.provide('ng.material.components.progressLinear'); +goog.require('ng.material.core'); +/** + * @ngdoc module + * @name material.components.progressLinear + * @description Linear Progress module! + */ +angular.module('material.components.progressLinear', [ + 'material.core' +]) + .directive('mdProgressLinear', MdProgressLinearDirective); + +/** + * @ngdoc directive + * @name mdProgressLinear + * @module material.components.progressLinear + * @restrict E + * + * @description + * The linear progress directive is used to make loading content in your app as delightful and painless as possible by minimizing the amount of visual change a user sees before they can view and interact with content. Each operation should only be represented by one activity indicator—for example, one refresh operation should not display both a refresh bar and an activity circle. + * + * For operations where the percentage of the operation completed can be determined, use a determinate indicator. They give users a quick sense of how long an operation will take. + * + * For operations where the user is asked to wait a moment while something finishes up, and it’s not necessary to expose what's happening behind the scenes and how long it will take, use an indeterminate indicator. + * + * @param {string} md-mode Select from one of four modes: determinate, indeterminate, buffer or query. + * @param {number=} value In determinate and buffer modes, this number represents the percentage of the primary progress bar. Default: 0 + * @param {number=} md-buffer-value In the buffer mode, this number represents the precentage of the secondary progress bar. Default: 0 + * + * @usage + * <hljs lang="html"> + * <md-progress-linear md-mode="determinate" value="..."></md-progress-linear> + * + * <md-progress-linear md-mode="determinate" ng-value="..."></md-progress-linear> + * + * <md-progress-linear md-mode="indeterminate"></md-progress-linear> + * + * <md-progress-linear md-mode="buffer" value="..." md-buffer-value="..."></md-progress-linear> + * + * <md-progress-linear md-mode="query"></md-progress-linear> + * </hljs> + */ +function MdProgressLinearDirective($$rAF, $mdConstant, $mdTheming) { + + return { + restrict: 'E', + template: '<div class="md-container">' + + '<div class="md-dashed"></div>' + + '<div class="md-bar md-bar1"></div>' + + '<div class="md-bar md-bar2"></div>' + + '</div>', + compile: compile + }; + + function compile(tElement, tAttrs, transclude) { + tElement.attr('aria-valuemin', 0); + tElement.attr('aria-valuemax', 100); + tElement.attr('role', 'progressbar'); + + return postLink; + } + function postLink(scope, element, attr) { + $mdTheming(element); + var bar1Style = element[0].querySelector('.md-bar1').style, + bar2Style = element[0].querySelector('.md-bar2').style, + container = angular.element(element[0].querySelector('.md-container')); + + attr.$observe('value', function(value) { + if (attr.mdMode == 'query') { + return; + } + + var clamped = clamp(value); + element.attr('aria-valuenow', clamped); + bar2Style[$mdConstant.CSS.TRANSFORM] = transforms[clamped]; + }); + + attr.$observe('mdBufferValue', function(value) { + bar1Style[$mdConstant.CSS.TRANSFORM] = transforms[clamp(value)]; + }); + + $$rAF(function() { + container.addClass('md-ready'); + }); + } + + function clamp(value) { + if (value > 100) { + return 100; + } + + if (value < 0) { + return 0; + } + + return Math.ceil(value || 0); + } +} +MdProgressLinearDirective.$inject = ["$$rAF", "$mdConstant", "$mdTheming"]; + + +// ********************************************************** +// Private Methods +// ********************************************************** +var transforms = (function() { + var values = new Array(101); + for(var i = 0; i < 101; i++){ + values[i] = makeTransform(i); + } + + return values; + + function makeTransform(value){ + var scale = value/100; + var translateX = (value-100)/2; + return 'translateX(' + translateX.toString() + '%) scale(' + scale.toString() + ', 1)'; + } +})(); + +ng.material.components.progressLinear = angular.module("material.components.progressLinear");
\ No newline at end of file |