socketioMEANseed/www/bower_components/angular-material/modules/closure/truncate/truncate.js
www/bower_components/angular-material/modules/closure/truncate/truncate.jsRaw
1/*!
2 * Angular Material Design
3 * https://github.com/angular/material
4 * @license MIT
5 * v1.1.3
6 */
7goog.provide('ngmaterial.components.truncate');
8goog.require('ngmaterial.core');
9/**
10 * @ngdoc module
11 * @name material.components.truncate
12 */
13MdTruncateController['$inject'] = ["$element"];
14angular.module('material.components.truncate', ['material.core'])
15 .directive('mdTruncate', MdTruncateDirective);
16
17/**
18 * @ngdoc directive
19 * @name mdTruncate
20 * @module material.components.truncate
21 * @restrict AE
22 * @description
23 *
24 * The `md-truncate` component displays a label that will automatically clip text which is wider
25 * than the component. By default, it displays an ellipsis, but you may apply the `md-clip` CSS
26 * class to override this default and use a standard "clipping" approach.
27 *
28 * <i><b>Note:</b> The `md-truncate` component does not automatically adjust it's width. You must
29 * provide the `flex` attribute, or some other CSS-based width management. See the
30 * <a ng-href="./demo/truncate">demos</a> for examples.</i>
31 *
32 * @usage
33 *
34 * ### As an Element
35 *
36 * <hljs lang="html">
37 * <div layout="row">
38 * <md-button>Back</md-button>
39 *
40 * <md-truncate flex>Chapter 1 - The Way of the Old West</md-truncate>
41 *
42 * <md-button>Forward</md-button>
43 * </div>
44 * </hljs>
45 *
46 * ### As an Attribute
47 *
48 * <hljs lang="html">
49 * <h2 md-truncate style="max-width: 100px;">Some Title With a Lot of Text</h2>
50 * </hljs>
51 *
52 * ## CSS & Styles
53 *
54 * `<md-truncate>` provides two CSS classes that you may use to control the type of clipping.
55 *
56 * <i><b>Note:</b> The `md-truncate` also applies a setting of `width: 0;` when used with the `flex`
57 * attribute to fix an issue with the flex element not shrinking properly.</i>
58 *
59 * <div>
60 * <docs-css-api-table>
61 *
62 * <docs-css-selector code=".md-ellipsis">
63 * Assigns the "ellipsis" behavior (default) which will cut off mid-word and append an ellipsis
64 * (…) to the end of the text.
65 * </docs-css-selector>
66 *
67 * <docs-css-selector code=".md-clip">
68 * Assigns the "clipping" behavior which will simply chop off the text. This may happen
69 * mid-word or even mid-character.
70 * </docs-css-selector>
71 *
72 * </docs-css-api-table>
73 * </div>
74 */
75function MdTruncateDirective() {
76 return {
77 restrict: 'AE',
78
79 controller: MdTruncateController,
80 controllerAs: '$ctrl',
81 bindToController: true
82 }
83}
84
85/**
86 * Controller for the <md-truncate> component.
87 *
88 * @param $element The md-truncate element.
89 *
90 * @constructor
91 * ngInject
92 */
93function MdTruncateController($element) {
94 $element.addClass('md-truncate');
95}
96
97ngmaterial.components.truncate = angular.module("material.components.truncate");