source: trip-planner-front/node_modules/angular-material/modules/closure/content/content.js@ 6a3a178

Last change on this file since 6a3a178 was 6a3a178, checked in by Ema <ema_spirova@…>, 3 years ago

initial commit

  • Property mode set to 100644
File size: 3.2 KB
Line 
1/*!
2 * AngularJS Material Design
3 * https://github.com/angular/material
4 * @license MIT
5 * v1.2.3
6 */
7goog.provide('ngmaterial.components.content');
8goog.require('ngmaterial.core');
9/**
10 * @ngdoc module
11 * @name material.components.content
12 *
13 * @description
14 * Scrollable content
15 */
16mdContentDirective['$inject'] = ["$mdTheming"];
17angular.module('material.components.content', [
18 'material.core'
19])
20 .directive('mdContent', mdContentDirective);
21
22/**
23 * @ngdoc directive
24 * @name mdContent
25 * @module material.components.content
26 *
27 * @restrict E
28 *
29 * @description
30 *
31 * The `<md-content>` directive is a container element useful for scrollable content. It achieves
32 * this by setting the CSS `overflow` property to `auto` so that content can properly scroll.
33 *
34 * In general, `<md-content>` components are not designed to be nested inside one another. If
35 * possible, it is better to make them siblings. This often results in a better user experience as
36 * having nested scrollbars may confuse the user.
37 *
38 * ## Troubleshooting
39 *
40 * In some cases, you may wish to apply the `md-no-momentum` class to ensure that Safari's
41 * momentum scrolling is disabled. Momentum scrolling can cause flickering issues while scrolling
42 * SVG icons and some other components.
43 *
44 * Additionally, we now also offer the `md-no-flicker` class which can be applied to any element
45 * and uses a Webkit-specific filter of `blur(0px)` that forces GPU rendering of all elements
46 * inside (which eliminates the flicker on iOS devices).
47 *
48 * _<b>Note:</b> Forcing an element to render on the GPU can have unintended side-effects, especially
49 * related to the z-index of elements. Please use with caution and only on the elements needed._
50 *
51 * @usage
52 *
53 * Add the `[layout-padding]` attribute to make the content padded.
54 *
55 * <hljs lang="html">
56 * <md-content layout-padding>
57 * Lorem ipsum dolor sit amet, ne quod novum mei.
58 * </md-content>
59 * </hljs>
60 */
61
62function mdContentDirective($mdTheming) {
63 return {
64 restrict: 'E',
65 controller: ['$scope', '$element', ContentController],
66 link: function(scope, element) {
67 element.addClass('_md'); // private md component indicator for styling
68
69 $mdTheming(element);
70 scope.$broadcast('$mdContentLoaded', element);
71
72 iosScrollFix(element[0]);
73 }
74 };
75
76 function ContentController($scope, $element) {
77 this.$scope = $scope;
78 this.$element = $element;
79 }
80}
81
82function iosScrollFix(node) {
83 // IOS FIX:
84 // If we scroll where there is no more room for the webview to scroll,
85 // by default the webview itself will scroll up and down, this looks really
86 // bad. So if we are scrolling to the very top or bottom, add/subtract one
87 angular.element(node).on('$md.pressdown', function(ev) {
88 // Only touch events
89 if (ev.pointer.type !== 't') return;
90 // Don't let a child content's touchstart ruin it for us.
91 if (ev.$materialScrollFixed) return;
92 ev.$materialScrollFixed = true;
93
94 if (node.scrollTop === 0) {
95 node.scrollTop = 1;
96 } else if (node.scrollHeight === node.scrollTop + node.offsetHeight) {
97 node.scrollTop -= 1;
98 }
99 });
100}
101
102ngmaterial.components.content = angular.module("material.components.content");
Note: See TracBrowser for help on using the repository browser.