Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(73)

Side by Side Diff: ui/webui/resources/cr_elements/cr_collapse/cr_collapse.js

Issue 1215543002: Remove Polymer 0.5. (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: fix unit test Created 5 years, 5 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
OLDNEW
(Empty)
1 // Copyright 2015 The Chromium Authors. All rights reserved.
2 // Use of this source code is governed by a BSD-style license that can be
3 // found in the LICENSE file.
4
5 /**
6 * @fileoverview
7 * `cr-collapse` creates a collapsible block of content. By default, the content
8 * will be collapsed. Use `opened` or `toggle()` to show/hide the content.
9 * `cr-collapse` adjusts the height/width of the collapsible element to
10 * show/hide the content. So avoid putting padding/margin/border on the
11 * collapsible directly, and instead put a `div` inside and style that.
12 *
13 * When a `cr-collapse` is toggled, its `opened` field changes immediately, but
14 * its show/hide animation finishes some time afterward. To determine if the
15 * element is actually shown in the UI, check for the `cr-collapse-closed` CSS
16 * class.
17 *
18 * Example:
19 * <style>
20 * #collapse-content {
21 * padding: 15px;
22 * }
23 * </style>
24 * <button on-click="{{toggle}}">toggle collapse</button>
25 * <cr-collapse id="collapse">
26 * <div id="collapse-content">
27 * Content goes here...
28 * </div>
29 * </cr-collapse>
30 *
31 * ...
32 *
33 * toggle: function() {
34 * this.$.collapse.toggle();
35 * }
36 *
37 * @element cr-collapse
38 */
39 Polymer({
40 publish: {
41 /**
42 * Set opened to `true` to show the collapse element and to `false` to hide
43 * it.
44 *
45 * @attribute opened
46 * @type boolean
47 * @default false
48 */
49 opened: {value: false, reflect: true},
50 },
51
52 handleResize_: function() {
53 this.classList.toggle('cr-collapse-closed', !this.opened);
54 },
55
56 toggle: function() {
57 this.$.collapse.toggle();
58 },
59
60 ready: function() {
61 this.$.collapse.addEventListener(
62 'core-resize', this.handleResize_.bind(this));
63 this.handleResize_();
64 },
65 });
OLDNEW
« no previous file with comments | « ui/webui/resources/cr_elements/cr_collapse/cr_collapse.html ('k') | ui/webui/resources/cr_elements/cr_events/cr_events.html » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698