diff options
Diffstat (limited to 'ecomp-portal-FE/client/bower_components/angular-material/modules/js/sticky/sticky.js')
-rw-r--r-- | ecomp-portal-FE/client/bower_components/angular-material/modules/js/sticky/sticky.js | 315 |
1 files changed, 315 insertions, 0 deletions
diff --git a/ecomp-portal-FE/client/bower_components/angular-material/modules/js/sticky/sticky.js b/ecomp-portal-FE/client/bower_components/angular-material/modules/js/sticky/sticky.js new file mode 100644 index 00000000..7e0b9a32 --- /dev/null +++ b/ecomp-portal-FE/client/bower_components/angular-material/modules/js/sticky/sticky.js @@ -0,0 +1,315 @@ +/*! + * Angular Material Design + * https://github.com/angular/material + * @license MIT + * v0.9.8 + */ +(function( window, angular, undefined ){ +"use strict"; + +/* + * @ngdoc module + * @name material.components.sticky + * @description + * + * Sticky effects for md + */ + +angular.module('material.components.sticky', [ + 'material.core', + 'material.components.content' +]) + .factory('$mdSticky', MdSticky); + +/* + * @ngdoc service + * @name $mdSticky + * @module material.components.sticky + * + * @description + * The `$mdSticky`service provides a mixin to make elements sticky. + * + * @returns A `$mdSticky` function that takes three arguments: + * - `scope` + * - `element`: The element that will be 'sticky' + * - `elementClone`: A clone of the element, that will be shown + * when the user starts scrolling past the original element. + * If not provided, it will use the result of `element.clone()`. + */ + +function MdSticky($document, $mdConstant, $compile, $$rAF, $mdUtil) { + + var browserStickySupport = checkStickySupport(); + + /** + * Registers an element as sticky, used internally by directives to register themselves + */ + return function registerStickyElement(scope, element, stickyClone) { + var contentCtrl = element.controller('mdContent'); + if (!contentCtrl) return; + + if (browserStickySupport) { + element.css({ + position: browserStickySupport, + top: 0, + 'z-index': 2 + }); + } else { + var $$sticky = contentCtrl.$element.data('$$sticky'); + if (!$$sticky) { + $$sticky = setupSticky(contentCtrl); + contentCtrl.$element.data('$$sticky', $$sticky); + } + + var deregister = $$sticky.add(element, stickyClone || element.clone()); + scope.$on('$destroy', deregister); + } + }; + + function setupSticky(contentCtrl) { + var contentEl = contentCtrl.$element; + + // Refresh elements is very expensive, so we use the debounced + // version when possible. + var debouncedRefreshElements = $$rAF.throttle(refreshElements); + + // setupAugmentedScrollEvents gives us `$scrollstart` and `$scroll`, + // more reliable than `scroll` on android. + setupAugmentedScrollEvents(contentEl); + contentEl.on('$scrollstart', debouncedRefreshElements); + contentEl.on('$scroll', onScroll); + + var self; + var stickyBaseoffset = contentEl.prop('offsetTop'); + return self = { + prev: null, + current: null, //the currently stickied item + next: null, + items: [], + add: add, + refreshElements: refreshElements + }; + + /*************** + * Public + ***************/ + // Add an element and its sticky clone to this content's sticky collection + function add(element, stickyClone) { + stickyClone.addClass('md-sticky-clone'); + stickyClone.css('top', stickyBaseoffset + 'px'); + + var item = { + element: element, + clone: stickyClone + }; + self.items.push(item); + + contentEl.parent().prepend(item.clone); + + debouncedRefreshElements(); + + return function remove() { + self.items.forEach(function(item, index) { + if (item.element[0] === element[0]) { + self.items.splice(index, 1); + item.clone.remove(); + } + }); + debouncedRefreshElements(); + }; + } + + function refreshElements() { + // Sort our collection of elements by their current position in the DOM. + // We need to do this because our elements' order of being added may not + // be the same as their order of display. + self.items.forEach(refreshPosition); + self.items = self.items.sort(function(a, b) { + return a.top < b.top ? -1 : 1; + }); + + // Find which item in the list should be active, + // based upon the content's current scroll position + var item; + var currentScrollTop = contentEl.prop('scrollTop'); + for (var i = self.items.length - 1; i >= 0; i--) { + if (currentScrollTop > self.items[i].top) { + item = self.items[i]; + break; + } + } + setCurrentItem(item); + } + + + /*************** + * Private + ***************/ + + // Find the `top` of an item relative to the content element, + // and also the height. + function refreshPosition(item) { + // Find the top of an item by adding to the offsetHeight until we reach the + // content element. + var current = item.element[0]; + item.top = 0; + item.left = 0; + while (current && current !== contentEl[0]) { + item.top += current.offsetTop; + item.left += current.offsetLeft; + current = current.offsetParent; + } + item.height = item.element.prop('offsetHeight'); + item.clone.css('margin-left', item.left + 'px'); + if ($mdUtil.floatingScrollbars()) { + item.clone.css('margin-right', '0'); + } + } + + + // As we scroll, push in and select the correct sticky element. + function onScroll() { + var scrollTop = contentEl.prop('scrollTop'); + var isScrollingDown = scrollTop > (onScroll.prevScrollTop || 0); + onScroll.prevScrollTop = scrollTop; + + // At the top? + if (scrollTop === 0) { + setCurrentItem(null); + + // Going to next item? + } else if (isScrollingDown && self.next) { + if (self.next.top - scrollTop <= 0) { + // Sticky the next item if we've scrolled past its position. + setCurrentItem(self.next); + } else if (self.current) { + // Push the current item up when we're almost at the next item. + if (self.next.top - scrollTop <= self.next.height) { + translate(self.current, self.next.top - self.next.height - scrollTop); + } else { + translate(self.current, null); + } + } + + // Scrolling up with a current sticky item? + } else if (!isScrollingDown && self.current) { + if (scrollTop < self.current.top) { + // Sticky the previous item if we've scrolled up past + // the original position of the currently stickied item. + setCurrentItem(self.prev); + } + // Scrolling up, and just bumping into the item above (just set to current)? + // If we have a next item bumping into the current item, translate + // the current item up from the top as it scrolls into view. + if (self.current && self.next) { + if (scrollTop >= self.next.top - self.current.height) { + translate(self.current, self.next.top - scrollTop - self.current.height); + } else { + translate(self.current, null); + } + } + } + } + + function setCurrentItem(item) { + if (self.current === item) return; + // Deactivate currently active item + if (self.current) { + translate(self.current, null); + setStickyState(self.current, null); + } + + // Activate new item if given + if (item) { + setStickyState(item, 'active'); + } + + self.current = item; + var index = self.items.indexOf(item); + // If index === -1, index + 1 = 0. It works out. + self.next = self.items[index + 1]; + self.prev = self.items[index - 1]; + setStickyState(self.next, 'next'); + setStickyState(self.prev, 'prev'); + } + + function setStickyState(item, state) { + if (!item || item.state === state) return; + if (item.state) { + item.clone.attr('sticky-prev-state', item.state); + item.element.attr('sticky-prev-state', item.state); + } + item.clone.attr('sticky-state', state); + item.element.attr('sticky-state', state); + item.state = state; + } + + function translate(item, amount) { + if (!item) return; + if (amount === null || amount === undefined) { + if (item.translateY) { + item.translateY = null; + item.clone.css($mdConstant.CSS.TRANSFORM, ''); + } + } else { + item.translateY = amount; + item.clone.css( + $mdConstant.CSS.TRANSFORM, + 'translate3d(' + item.left + 'px,' + amount + 'px,0)' + ); + } + } + } + + // Function to check for browser sticky support + function checkStickySupport($el) { + var stickyProp; + var testEl = angular.element('<div>'); + $document[0].body.appendChild(testEl[0]); + + var stickyProps = ['sticky', '-webkit-sticky']; + for (var i = 0; i < stickyProps.length; ++i) { + testEl.css({position: stickyProps[i], top: 0, 'z-index': 2}); + if (testEl.css('position') == stickyProps[i]) { + stickyProp = stickyProps[i]; + break; + } + } + testEl.remove(); + return stickyProp; + } + + // Android 4.4 don't accurately give scroll events. + // To fix this problem, we setup a fake scroll event. We say: + // > If a scroll or touchmove event has happened in the last DELAY milliseconds, + // then send a `$scroll` event every animationFrame. + // Additionally, we add $scrollstart and $scrollend events. + function setupAugmentedScrollEvents(element) { + var SCROLL_END_DELAY = 200; + var isScrolling; + var lastScrollTime; + element.on('scroll touchmove', function() { + if (!isScrolling) { + isScrolling = true; + $$rAF(loopScrollEvent); + element.triggerHandler('$scrollstart'); + } + element.triggerHandler('$scroll'); + lastScrollTime = +$mdUtil.now(); + }); + + function loopScrollEvent() { + if (+$mdUtil.now() - lastScrollTime > SCROLL_END_DELAY) { + isScrolling = false; + element.triggerHandler('$scrollend'); + } else { + element.triggerHandler('$scroll'); + $$rAF(loopScrollEvent); + } + } + } + +} +MdSticky.$inject = ["$document", "$mdConstant", "$compile", "$$rAF", "$mdUtil"]; + +})(window, window.angular);
\ No newline at end of file |