polymer-core-rails 0.2.5 → 0.2.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +4 -4
- data/README.md +4 -3
- data/app/assets/components/context-free-parser/context-free-parser.js +27 -4
- data/app/assets/components/core-a11y-keys/core-a11y-keys.html +4 -4
- data/app/assets/components/core-ajax/core-ajax.html +38 -10
- data/app/assets/components/core-ajax/core-xhr.html +1 -1
- data/app/assets/components/core-animated-pages/core-animated-pages.html +25 -2
- data/app/assets/components/core-animation/web-animations.html +1 -1
- data/app/assets/components/core-collapse/core-collapse.html +1 -1
- data/app/assets/components/core-doc-viewer/elements/core-doc-page.css +26 -1
- data/app/assets/components/core-doc-viewer/elements/core-doc-page.html +39 -4
- data/app/assets/components/core-doc-viewer/elements/core-doc-toc.css +3 -3
- data/app/assets/components/core-drawer-panel/core-drawer-panel.css +14 -6
- data/app/assets/components/core-drawer-panel/core-drawer-panel.html +32 -8
- data/app/assets/components/core-dropdown/core-dropdown.html +8 -2
- data/app/assets/components/core-elements/core-elements.html +1 -0
- data/app/assets/components/core-icon/core-icon.html +0 -2
- data/app/assets/components/core-icons/av-icons.html +2 -9
- data/app/assets/components/core-icons/communication-icons.html +39 -42
- data/app/assets/components/core-icons/core-icons.html +231 -235
- data/app/assets/components/core-icons/device-icons.html +75 -90
- data/app/assets/components/core-icons/editor-icons.html +52 -52
- data/app/assets/components/core-icons/hardware-icons.html +40 -41
- data/app/assets/components/core-icons/image-icons.html +133 -137
- data/app/assets/components/core-icons/maps-icons.html +55 -57
- data/app/assets/components/core-icons/notification-icons.html +34 -34
- data/app/assets/components/core-icons/social-icons.html +23 -37
- data/app/assets/components/core-image/core-image.html +3 -3
- data/app/assets/components/core-list/core-list.html +50 -27
- data/app/assets/components/core-localstorage/core-localstorage.html +4 -5
- data/app/assets/components/core-menu/core-menu.html +8 -3
- data/app/assets/components/core-menu/core-submenu.html +2 -2
- data/app/assets/components/core-overlay/core-key-helper.html +3 -0
- data/app/assets/components/core-overlay/core-overlay-layer.html +3 -0
- data/app/assets/components/core-overlay/core-overlay.html +20 -4
- data/app/assets/components/core-resizable/core-resizable.html +248 -0
- data/app/assets/components/core-scroll-header-panel/core-scroll-header-panel.html +14 -3
- data/app/assets/components/core-scroll-threshold/core-scroll-threshold.html +222 -0
- data/app/assets/components/core-scroll-threshold/metadata.html +24 -0
- data/app/assets/components/core-selection/core-selection.html +1 -1
- data/app/assets/components/core-selector/core-selector.html +26 -26
- data/app/assets/components/core-splitter/core-splitter.html +17 -2
- data/app/assets/components/core-style/core-style.html +1 -1
- data/app/assets/components/core-toolbar/core-toolbar.html +1 -1
- data/app/assets/components/core-tooltip/core-tooltip.css +2 -2
- data/app/assets/components/core-tooltip/core-tooltip.html +16 -5
- data/app/assets/components/core-tooltip/metadata.html +1 -1
- data/app/assets/components/google-code-prettify/styles/doxy.css +1 -1
- data/app/assets/components/marked/lib/marked.js +11 -5
- data/app/assets/components/marked/marked.min.js +6 -0
- data/app/assets/components/paper-button/paper-button-base.html +56 -12
- data/app/assets/components/paper-button/paper-button.html +22 -5
- data/app/assets/components/paper-fab/paper-fab.html +2 -2
- data/app/assets/components/paper-ripple/paper-ripple.html +2 -1
- data/app/assets/components/paper-shadow/paper-shadow.css +10 -10
- data/app/assets/components/paper-shadow/paper-shadow.html +8 -1
- data/app/assets/components/sampler-scaffold/sampler-scaffold.css +1 -1
- data/app/assets/components/{web-animations-next → web-animations-js}/src/animation-constructor.js +10 -5
- data/app/assets/components/{web-animations-next → web-animations-js}/src/animation-node.js +1 -1
- data/app/assets/components/{web-animations-next → web-animations-js}/src/animation.js +2 -2
- data/app/assets/components/{web-animations-next → web-animations-js}/src/apply-preserving-inline-style.js +2 -3
- data/app/assets/components/{web-animations-next → web-animations-js}/src/apply.js +1 -1
- data/app/assets/components/{web-animations-next → web-animations-js}/src/box-handler.js +1 -1
- data/app/assets/components/{web-animations-next → web-animations-js}/src/color-handler.js +2 -2
- data/app/assets/components/{web-animations-next → web-animations-js}/src/deprecation.js +0 -0
- data/app/assets/components/{web-animations-next → web-animations-js}/src/dev.js +0 -0
- data/app/assets/components/{web-animations-next → web-animations-js}/src/dimension-handler.js +1 -1
- data/app/assets/components/{web-animations-next → web-animations-js}/src/effect-callback.js +2 -2
- data/app/assets/components/{web-animations-next → web-animations-js}/src/effect.js +1 -1
- data/app/assets/components/{web-animations-next → web-animations-js}/src/element-animatable.js +1 -1
- data/app/assets/components/{web-animations-next → web-animations-js}/src/font-weight-handler.js +1 -1
- data/app/assets/components/{web-animations-next → web-animations-js}/src/group-constructors.js +2 -1
- data/app/assets/components/{web-animations-next → web-animations-js}/src/handler-utils.js +1 -1
- data/app/assets/components/{web-animations-next → web-animations-js}/src/interpolation.js +1 -1
- data/app/assets/components/{web-animations-next → web-animations-js}/src/matrix-decomposition.js +1 -1
- data/app/assets/components/{web-animations-next → web-animations-js}/src/matrix-interpolation.js +1 -1
- data/app/assets/components/{web-animations-next → web-animations-js}/src/normalize-keyframes.js +1 -1
- data/app/assets/components/{web-animations-next → web-animations-js}/src/number-handler.js +1 -1
- data/app/assets/components/{web-animations-next → web-animations-js}/src/player.js +1 -1
- data/app/assets/components/{web-animations-next → web-animations-js}/src/position-handler.js +1 -1
- data/app/assets/components/{web-animations-next → web-animations-js}/src/property-interpolation.js +1 -1
- data/app/assets/components/{web-animations-next → web-animations-js}/src/property-names.js +1 -1
- data/app/assets/components/{web-animations-next → web-animations-js}/src/scope.js +2 -2
- data/app/assets/components/{web-animations-next → web-animations-js}/src/shadow-handler.js +1 -1
- data/app/assets/components/{web-animations-next → web-animations-js}/src/shape-handler.js +1 -1
- data/app/assets/components/{web-animations-next → web-animations-js}/src/tick.js +1 -1
- data/app/assets/components/{web-animations-next → web-animations-js}/src/timeline.js +7 -7
- data/app/assets/components/{web-animations-next → web-animations-js}/src/timing-utilities.js +0 -0
- data/app/assets/components/{web-animations-next → web-animations-js}/src/transform-handler.js +1 -1
- data/app/assets/components/{web-animations-next → web-animations-js}/src/visibility-handler.js +1 -1
- data/app/assets/components/{web-animations-next/src/maxifill-player.js → web-animations-js/src/web-animations-next-player.js} +1 -1
- data/app/assets/components/{web-animations-next → web-animations-js}/web-animations-next-lite.dev.html +1 -1
- data/app/assets/components/{web-animations-next → web-animations-js}/web-animations-next-lite.dev.js +0 -0
- data/app/assets/components/web-animations-js/web-animations-next-lite.min.js +17 -0
- data/app/assets/components/{web-animations-next → web-animations-js}/web-animations-next.dev.html +1 -1
- data/app/assets/components/{web-animations-next → web-animations-js}/web-animations-next.dev.js +0 -0
- data/app/assets/components/web-animations-js/web-animations-next.min.js +17 -0
- data/app/assets/components/{web-animations-next → web-animations-js}/web-animations.dev.html +0 -0
- data/app/assets/components/{web-animations-next → web-animations-js}/web-animations.dev.js +0 -0
- data/app/assets/components/{web-animations-next → web-animations-js}/web-animations.html +1 -3
- data/app/assets/components/web-animations-js/web-animations.min.js +17 -0
- data/app/assets/components/webcomponentsjs/CustomElements.js +634 -0
- data/app/assets/components/webcomponentsjs/CustomElements.min.js +11 -0
- data/app/assets/components/webcomponentsjs/HTMLImports.js +764 -0
- data/app/assets/components/webcomponentsjs/HTMLImports.min.js +11 -0
- data/app/assets/components/webcomponentsjs/ShadowDOM.js +4277 -0
- data/app/assets/components/webcomponentsjs/ShadowDOM.min.js +13 -0
- data/app/assets/components/webcomponentsjs/webcomponents-lite.js +1728 -0
- data/app/assets/components/webcomponentsjs/webcomponents-lite.min.js +11 -0
- data/app/assets/components/webcomponentsjs/webcomponents.js +6114 -0
- data/app/assets/components/webcomponentsjs/webcomponents.min.js +14 -0
- data/lib/polymer-core-rails/version.rb +1 -1
- metadata +60 -76
- data/app/assets/components/context-free-parser/package.json +0 -16
- data/app/assets/components/core-ajax/demo-progress.html +0 -65
- data/app/assets/components/core-dropdown/metadata.html +0 -62
- data/app/assets/components/core-icons/png-icons.html +0 -19
- data/app/assets/components/core-overlay/tests/html/core-overlay-basic.html +0 -127
- data/app/assets/components/core-overlay/tests/html/core-overlay-positioning-margin.html +0 -153
- data/app/assets/components/core-overlay/tests/html/core-overlay-positioning.html +0 -167
- data/app/assets/components/core-overlay/tests/html/core-overlay-scroll.html +0 -130
- data/app/assets/components/core-overlay/tests/js/htmltests.js +0 -6
- data/app/assets/components/core-overlay/tests/runner.html +0 -14
- data/app/assets/components/core-overlay/tests/tests.json +0 -6
- data/app/assets/components/core-popup-menu/core-popup-menu.css +0 -28
- data/app/assets/components/core-popup-menu/core-popup-menu.html +0 -198
- data/app/assets/components/core-popup-menu/core-popup-overlay.html +0 -111
- data/app/assets/components/core-popup-menu/metadata.html +0 -62
- data/app/assets/components/core-shared-lib/tests/html/core-shared-lib.html +0 -47
- data/app/assets/components/core-shared-lib/tests/js/htmltests.js +0 -3
- data/app/assets/components/core-shared-lib/tests/runner.html +0 -14
- data/app/assets/components/core-shared-lib/tests/tests.json +0 -6
- data/app/assets/components/marked/LICENSE +0 -19
- data/app/assets/components/marked/Makefile +0 -12
- data/app/assets/components/marked/package.json +0 -22
- data/app/assets/components/platform/platform.js +0 -16
- data/app/assets/components/web-animations-js/web-animations.js +0 -5529
- data/app/assets/components/web-animations-next/Gruntfile.js +0 -279
- data/app/assets/components/web-animations-next/History.md +0 -76
- data/app/assets/components/web-animations-next/package.json +0 -33
- data/app/assets/components/web-animations-next/target-config.js +0 -124
- data/app/assets/components/web-animations-next/target-loader.js +0 -13
- data/app/assets/components/web-animations-next/templates/boilerplate +0 -13
- data/app/assets/components/web-animations-next/templates/runner.html +0 -26
- data/app/assets/components/web-animations-next/templates/web-animations.html +0 -18
- data/app/assets/components/web-animations-next/templates/web-animations.js +0 -21
@@ -20,6 +20,14 @@ may be reused with a new model at any time. Particularly, any state that
|
|
20
20
|
may change as the result of a user interaction with the list item must be
|
21
21
|
bound to the model to avoid view state inconsistency.
|
22
22
|
|
23
|
+
IMPORTANT: `core-list` must ether be explicitly sized, or delegate scrolling to
|
24
|
+
an explicitly sized parent. By "explicitly sized", we mean it either has an
|
25
|
+
explicit CSS `height` property set via a class or inline style, or else is sized
|
26
|
+
by other layout means (e.g. `flex` or `fit`). Alternatively, `core-list` can
|
27
|
+
delegate scrolling to a scrollable element that contains the list by setting the
|
28
|
+
`scrollTarget` property, and the same explicit sizing requiremets will apply
|
29
|
+
to that element.
|
30
|
+
|
23
31
|
### Template model
|
24
32
|
|
25
33
|
List item templates should bind to template models of the following structure:
|
@@ -162,11 +170,13 @@ the following abstract API:
|
|
162
170
|
|
163
171
|
@group Polymer Core Elements
|
164
172
|
@element core-list
|
173
|
+
@mixins Polymer.CoreResizable https://github.com/polymer/core-resizable
|
165
174
|
-->
|
166
175
|
<link rel="import" href="../polymer/polymer.html">
|
167
176
|
<link rel="import" href="../core-selection/core-selection.html">
|
177
|
+
<link rel="import" href="../core-resizable/core-resizable.html">
|
168
178
|
|
169
|
-
<polymer-element name="core-list"
|
179
|
+
<polymer-element name="core-list" tabindex="-1">
|
170
180
|
<template>
|
171
181
|
<core-selection id="selection" multi="{{multi}}" on-core-select="{{selectedHandler}}"></core-selection>
|
172
182
|
<link rel="stylesheet" href="core-list.css">
|
@@ -178,7 +188,7 @@ the following abstract API:
|
|
178
188
|
var IOS = navigator.userAgent.match(/iP(?:hone|ad;(?: U;)? CPU) OS (\d+)/);
|
179
189
|
var IOS_TOUCH_SCROLLING = IOS && IOS[1] >= 8;
|
180
190
|
|
181
|
-
Polymer(
|
191
|
+
Polymer(Polymer.mixin({
|
182
192
|
|
183
193
|
publish: {
|
184
194
|
/**
|
@@ -328,11 +338,16 @@ the following abstract API:
|
|
328
338
|
|
329
339
|
},
|
330
340
|
|
341
|
+
eventDelegates: {
|
342
|
+
tap: 'tapHandler',
|
343
|
+
'core-resize': 'updateSize'
|
344
|
+
},
|
345
|
+
|
331
346
|
// Local cache of scrollTop
|
332
347
|
_scrollTop: 0,
|
333
348
|
|
334
349
|
observe: {
|
335
|
-
'data grid width template scrollTarget': 'initialize',
|
350
|
+
'isAttached data grid width template scrollTarget': 'initialize',
|
336
351
|
'multi selectionEnabled': '_resetSelection'
|
337
352
|
},
|
338
353
|
|
@@ -357,33 +372,36 @@ the following abstract API:
|
|
357
372
|
this._nestedGroups = false;
|
358
373
|
this._groupStart = 0;
|
359
374
|
this._groupStartIndex = 0;
|
360
|
-
|
361
|
-
this._boundResizeHandler = this.updateSize.bind(this);
|
362
|
-
window.addEventListener('resize', this._boundResizeHandler);
|
363
375
|
},
|
364
376
|
|
365
377
|
attached: function() {
|
378
|
+
this.isAttached = true;
|
366
379
|
this.template = this.querySelector('template');
|
367
380
|
if (!this.template.bindingDelegate) {
|
368
381
|
this.template.bindingDelegate = this.element.syntax;
|
369
382
|
}
|
383
|
+
this.resizableAttachedHandler();
|
370
384
|
},
|
371
385
|
|
372
386
|
detached: function() {
|
373
|
-
this.
|
374
|
-
|
387
|
+
this.isAttached = false;
|
388
|
+
if (this._target) {
|
389
|
+
this._target.removeEventListener('scroll', this._boundScrollHandler);
|
390
|
+
}
|
391
|
+
this.resizableDetachedHandler();
|
375
392
|
},
|
376
393
|
|
377
394
|
/**
|
378
|
-
* To be called by the user when the list is resized
|
379
|
-
* after being hidden.
|
380
|
-
* when the window is resized.
|
395
|
+
* To be called by the user when the list is manually resized
|
396
|
+
* or shown after being hidden.
|
381
397
|
*
|
382
398
|
* @method updateSize
|
383
399
|
*/
|
384
400
|
updateSize: function() {
|
385
|
-
this.
|
386
|
-
|
401
|
+
if (!this._positionPending && !this._needItemInit) {
|
402
|
+
this._resetIndex(this._getFirstVisibleIndex() || 0);
|
403
|
+
this.initialize();
|
404
|
+
}
|
387
405
|
},
|
388
406
|
|
389
407
|
_resetSelection: function() {
|
@@ -436,7 +454,7 @@ the following abstract API:
|
|
436
454
|
}
|
437
455
|
// Adjust offset/scroll position based on total number of items changed
|
438
456
|
if (this._virtualStart < this._physicalCount) {
|
439
|
-
this._resetIndex(this._getFirstVisibleIndex());
|
457
|
+
this._resetIndex(this._getFirstVisibleIndex() || 0);
|
440
458
|
} else {
|
441
459
|
totalDelta = Math.max((totalDelta / this._rowFactor) * this._physicalAverage, -this._physicalOffset);
|
442
460
|
this._physicalOffset += totalDelta;
|
@@ -456,13 +474,12 @@ the following abstract API:
|
|
456
474
|
|
457
475
|
groupsChanged: function() {
|
458
476
|
if (!!this.groups != this._grouped) {
|
459
|
-
this.
|
460
|
-
this._resetIndex(this._getFirstVisibleIndex() || this._virtualStart);
|
477
|
+
this.updateSize();
|
461
478
|
}
|
462
479
|
},
|
463
480
|
|
464
481
|
initialize: function() {
|
465
|
-
if (!this.template) {
|
482
|
+
if (!this.template || !this.isAttached) {
|
466
483
|
return;
|
467
484
|
}
|
468
485
|
|
@@ -530,6 +547,7 @@ the following abstract API:
|
|
530
547
|
if (getComputedStyle(this._target).position == 'static') {
|
531
548
|
this._target.style.position = 'relative';
|
532
549
|
}
|
550
|
+
this._target.style.boxSizing = this._target.style.mozBoxSizing = 'border-box';
|
533
551
|
this.style.overflowY = (target == this) ? 'auto' : null;
|
534
552
|
},
|
535
553
|
|
@@ -598,8 +616,10 @@ the following abstract API:
|
|
598
616
|
if (!this.width) {
|
599
617
|
throw 'Grid requires the `width` property to be set';
|
600
618
|
}
|
601
|
-
|
602
|
-
|
619
|
+
var cs = getComputedStyle(this._target);
|
620
|
+
var padding = parseInt(cs.paddingLeft || 0) + parseInt(cs.paddingRight || 0);
|
621
|
+
this._rowFactor = Math.floor((this._target.offsetWidth - padding) / this.width) || 1;
|
622
|
+
this._rowMargin = (this._target.offsetWidth - (this._rowFactor * this.width) - padding) / 2;
|
603
623
|
} else {
|
604
624
|
this._rowFactor = 1;
|
605
625
|
this._rowMargin = 0;
|
@@ -647,7 +667,11 @@ the following abstract API:
|
|
647
667
|
|
648
668
|
// Add physical items up to a max based on data length, viewport size, and extra item overhang
|
649
669
|
var currentCount = this._physicalCount || 0;
|
650
|
-
|
670
|
+
var height = this._target.offsetHeight;
|
671
|
+
if (!height && this._target.offsetParent) {
|
672
|
+
console.warn('core-list must either be sized or be inside an overflow:auto div that is sized');
|
673
|
+
}
|
674
|
+
this._physicalCount = Math.min(Math.ceil(height / (this._physicalAverage || this.height)) * this.runwayFactor * this._rowFactor, this._virtualCount);
|
651
675
|
this._physicalCount = Math.max(currentCount, this._physicalCount);
|
652
676
|
this._physicalData = this._physicalData || new Array(this._physicalCount);
|
653
677
|
var needItemInit = false;
|
@@ -779,10 +803,9 @@ the following abstract API:
|
|
779
803
|
|
780
804
|
// Measure content in scroller before virtualized items
|
781
805
|
if (this._target != this) {
|
782
|
-
|
783
|
-
this._aboveSize = el1 ? el1.offsetTop + el1.offsetHeight : 0;
|
806
|
+
this._aboveSize = this.offsetTop;
|
784
807
|
} else {
|
785
|
-
this._aboveSize =
|
808
|
+
this._aboveSize = parseInt(getComputedStyle(this._target).paddingTop);
|
786
809
|
}
|
787
810
|
|
788
811
|
// Calculate average height
|
@@ -1232,7 +1255,7 @@ the following abstract API:
|
|
1232
1255
|
var virtualIndex = this._virtualStart + i;
|
1233
1256
|
var physicalIndex = this._virtualToPhysical(virtualIndex);
|
1234
1257
|
var item = this._physicalItems[physicalIndex];
|
1235
|
-
if (item._translateY >= this._scrollTop) {
|
1258
|
+
if (!item.hidden && item._translateY >= this._scrollTop - this._aboveSize) {
|
1236
1259
|
return virtualIndex;
|
1237
1260
|
}
|
1238
1261
|
}
|
@@ -1242,8 +1265,8 @@ the following abstract API:
|
|
1242
1265
|
index = Math.min(index, this._virtualCount-1);
|
1243
1266
|
index = Math.max(index, 0);
|
1244
1267
|
this.changeStartIndex(index - this._virtualStart);
|
1245
|
-
this._scrollTop = this.setScrollTop((index / this._rowFactor) * this._physicalAverage);
|
1246
|
-
this._physicalOffset = this._scrollTop;
|
1268
|
+
this._scrollTop = this.setScrollTop(this._aboveSize + (index / this._rowFactor) * this._physicalAverage);
|
1269
|
+
this._physicalOffset = this._scrollTop - this._aboveSize;
|
1247
1270
|
this._dir = 0;
|
1248
1271
|
},
|
1249
1272
|
|
@@ -1286,7 +1309,7 @@ the following abstract API:
|
|
1286
1309
|
this.refresh();
|
1287
1310
|
}
|
1288
1311
|
|
1289
|
-
});
|
1312
|
+
}, Polymer.CoreResizable));
|
1290
1313
|
|
1291
1314
|
})();
|
1292
1315
|
</script>
|
@@ -72,16 +72,15 @@ triggered only when value is a different instance.
|
|
72
72
|
*/
|
73
73
|
autoSaveDisabled: false,
|
74
74
|
|
75
|
-
attached: function() {
|
76
|
-
// wait for bindings are all setup
|
77
|
-
this.async('load');
|
78
|
-
},
|
79
|
-
|
80
75
|
valueChanged: function() {
|
81
76
|
if (this.loaded && !this.autoSaveDisabled) {
|
82
77
|
this.save();
|
83
78
|
}
|
84
79
|
},
|
80
|
+
|
81
|
+
nameChanged: function() {
|
82
|
+
this.load();
|
83
|
+
},
|
85
84
|
|
86
85
|
load: function() {
|
87
86
|
var v = localStorage.getItem(this.name);
|
@@ -15,7 +15,7 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
|
|
15
15
|
<core-item icon="dialog" label="Dialog"></core-item>
|
16
16
|
<core-item icon="search" label="Search"></core-item>
|
17
17
|
</core-menu>
|
18
|
-
|
18
|
+
|
19
19
|
When an item is selected the `core-selected` class is added to it. The user can
|
20
20
|
use the class to add more stylings to the selected item.
|
21
21
|
|
@@ -56,13 +56,18 @@ The `core-select` event signals selection change.
|
|
56
56
|
-->
|
57
57
|
|
58
58
|
<link rel="import" href="../core-selector/core-selector.html">
|
59
|
+
<link rel="import" href="../core-a11y-keys/core-a11y-keys.html">
|
59
60
|
|
60
61
|
<polymer-element name="core-menu" extends="core-selector" noscript>
|
61
62
|
<template>
|
62
63
|
|
63
64
|
<link rel="stylesheet" href="core-menu.css">
|
64
|
-
|
65
|
+
|
66
|
+
<core-a11y-keys target="{{}}" keys="up" on-keys-pressed="{{ selectPrevious }}"></core-a11y-keys>
|
67
|
+
<core-a11y-keys target="{{}}" keys="down" on-keys-pressed="{{ selectNext }}"></core-a11y-keys>
|
68
|
+
<core-a11y-keys target="{{}}" keys="enter" on-keys-pressed="{{ validateSelected }}"></core-a11y-keys>
|
69
|
+
|
65
70
|
<shadow></shadow>
|
66
|
-
|
71
|
+
|
67
72
|
</template>
|
68
73
|
</polymer-element>
|
@@ -61,7 +61,7 @@ The above will style `Topic1` and `Topic2` to have font color red.
|
|
61
61
|
<link rel="import" href="../core-menu/core-menu.html">
|
62
62
|
<link rel="import" href="../core-collapse/core-collapse.html">
|
63
63
|
|
64
|
-
<polymer-element name="core-submenu" attributes="selected selectedItem label icon src valueattr">
|
64
|
+
<polymer-element name="core-submenu" attributes="selected selectedItem selectedAttribute label icon src valueattr">
|
65
65
|
<template>
|
66
66
|
|
67
67
|
<link rel="stylesheet" href="core-submenu.css">
|
@@ -70,7 +70,7 @@ The above will style `Topic1` and `Topic2` to have font color red.
|
|
70
70
|
<content select=".item-content"></content>
|
71
71
|
</core-item>
|
72
72
|
|
73
|
-
<core-menu id="submenu" selected="{{selected}}" selectedItem="{{selectedItem}}" valueattr="{{valueattr}}">
|
73
|
+
<core-menu id="submenu" selected="{{selected}}" selectedItem="{{selectedItem}}" selectedAttribute="{{selectedAttribute}}" valueattr="{{valueattr}}">
|
74
74
|
<content></content>
|
75
75
|
</core-menu>
|
76
76
|
|
@@ -9,6 +9,9 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
|
|
9
9
|
|
10
10
|
<link rel="import" href="../polymer/polymer.html">
|
11
11
|
|
12
|
+
<!--
|
13
|
+
@element core-key-helper
|
14
|
+
-->
|
12
15
|
<polymer-element name="core-key-helper">
|
13
16
|
<script>
|
14
17
|
Polymer('core-key-helper', {
|
@@ -9,6 +9,7 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
|
|
9
9
|
|
10
10
|
<link rel="import" href="../polymer/polymer.html">
|
11
11
|
<link rel="import" href="../core-transition/core-transition.html">
|
12
|
+
<link rel="import" href="../core-resizable/core-resizable.html">
|
12
13
|
<link rel="import" href="core-key-helper.html">
|
13
14
|
<link rel="import" href="core-overlay-layer.html">
|
14
15
|
|
@@ -61,6 +62,7 @@ that, for example, a drop shadow is always visible around the overlay.
|
|
61
62
|
|
62
63
|
@group Core Elements
|
63
64
|
@element core-overlay
|
65
|
+
@mixins Polymer.CoreResizer https://github.com/polymer/core-resizable
|
64
66
|
@homepage github.io
|
65
67
|
-->
|
66
68
|
<!--
|
@@ -115,7 +117,7 @@ object like this: `{v: 'top', h: 'right'}`.
|
|
115
117
|
<script>
|
116
118
|
(function() {
|
117
119
|
|
118
|
-
Polymer(
|
120
|
+
Polymer(Polymer.mixin({
|
119
121
|
|
120
122
|
publish: {
|
121
123
|
/**
|
@@ -236,7 +238,19 @@ object like this: `{v: 'top', h: 'right'}`.
|
|
236
238
|
'keydown': 'keydownHandler',
|
237
239
|
'core-transitionend': 'transitionend'
|
238
240
|
},
|
239
|
-
|
241
|
+
|
242
|
+
attached: function() {
|
243
|
+
this.resizerAttachedHandler();
|
244
|
+
},
|
245
|
+
|
246
|
+
detached: function() {
|
247
|
+
this.resizerDetachedHandler();
|
248
|
+
},
|
249
|
+
|
250
|
+
resizerShouldNotify: function() {
|
251
|
+
return this.opened;
|
252
|
+
},
|
253
|
+
|
240
254
|
registerCallback: function(element) {
|
241
255
|
this.layer = document.createElement('core-overlay-layer');
|
242
256
|
this.keyHelper = document.createElement('core-key-helper');
|
@@ -387,6 +401,7 @@ object like this: `{v: 'top', h: 'right'}`.
|
|
387
401
|
// tasks which cause the overlay to actually open; typically play an
|
388
402
|
// animation
|
389
403
|
renderOpened: function() {
|
404
|
+
this.notifyResize();
|
390
405
|
var transition = this.getTransition();
|
391
406
|
if (transition) {
|
392
407
|
transition.go(this.target, {opened: this.opened});
|
@@ -675,8 +690,9 @@ object like this: `{v: 'top', h: 'right'}`.
|
|
675
690
|
};
|
676
691
|
}
|
677
692
|
return this[bound];
|
678
|
-
}
|
679
|
-
|
693
|
+
}
|
694
|
+
|
695
|
+
}, Polymer.CoreResizer));
|
680
696
|
|
681
697
|
// TODO(sorvell): This should be an element with private state so it can
|
682
698
|
// be independent of overlay.
|
@@ -0,0 +1,248 @@
|
|
1
|
+
<!--
|
2
|
+
Copyright (c) 2014 The Polymer Project Authors. All rights reserved.
|
3
|
+
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
|
4
|
+
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
|
5
|
+
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
|
6
|
+
Code distributed by Google as part of the polymer project is also
|
7
|
+
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
|
8
|
+
-->
|
9
|
+
|
10
|
+
<!--
|
11
|
+
* @group Polymer Mixins
|
12
|
+
-->
|
13
|
+
|
14
|
+
<link rel="import" href="../polymer/polymer.html">
|
15
|
+
|
16
|
+
<script>
|
17
|
+
|
18
|
+
(function(scope) {
|
19
|
+
|
20
|
+
/**
|
21
|
+
`Polymer.CoreResizable` and `Polymer.CoreResizer` are a set of mixins that can be used
|
22
|
+
in Polymer elements to coordinate the flow of resize events between "resizers" (elements
|
23
|
+
that control the size or hidden state of their children) and "resizables" (elements that
|
24
|
+
need to be notified when they are resized or un-hidden by their parents in order to take
|
25
|
+
action on their new measurements).
|
26
|
+
|
27
|
+
Elements that perform measurement should add the `Core.Resizable` mixin to their
|
28
|
+
Polymer prototype definition and listen for the `core-resize` event on themselves.
|
29
|
+
This event will be fired when they become showing after having been hidden,
|
30
|
+
when they are resized explicitly by a `CoreResizer`, or when the window has been resized.
|
31
|
+
Note, the `core-resize` event is non-bubbling.
|
32
|
+
|
33
|
+
`CoreResizable`'s must manually call the `resizableAttachedHandler` from the element's
|
34
|
+
`attached` callback and `resizableDetachedHandler` from the element's `detached`
|
35
|
+
callback.
|
36
|
+
|
37
|
+
@element CoreResizable
|
38
|
+
@status beta
|
39
|
+
@homepage github.io
|
40
|
+
*/
|
41
|
+
|
42
|
+
scope.CoreResizable = {
|
43
|
+
|
44
|
+
/**
|
45
|
+
* User must call from `attached` callback
|
46
|
+
*
|
47
|
+
* @method resizableAttachedHandler
|
48
|
+
*/
|
49
|
+
resizableAttachedHandler: function(cb) {
|
50
|
+
cb = cb || this._notifyResizeSelf;
|
51
|
+
this.async(function() {
|
52
|
+
var detail = {callback: cb, hasParentResizer: false};
|
53
|
+
this.fire('core-request-resize', detail);
|
54
|
+
if (!detail.hasParentResizer) {
|
55
|
+
this._boundWindowResizeHandler = cb.bind(this);
|
56
|
+
// log('adding window resize handler', null, this);
|
57
|
+
window.addEventListener('resize', this._boundWindowResizeHandler);
|
58
|
+
}
|
59
|
+
}.bind(this));
|
60
|
+
},
|
61
|
+
|
62
|
+
/**
|
63
|
+
* User must call from `detached` callback
|
64
|
+
*
|
65
|
+
* @method resizableDetachedHandler
|
66
|
+
*/
|
67
|
+
resizableDetachedHandler: function() {
|
68
|
+
this.fire('core-request-resize-cancel', null, this, false);
|
69
|
+
if (this._boundWindowResizeHandler) {
|
70
|
+
window.removeEventListener('resize', this._boundWindowResizeHandler);
|
71
|
+
}
|
72
|
+
},
|
73
|
+
|
74
|
+
// Private: fire non-bubbling resize event to self; returns whether
|
75
|
+
// preventDefault was called, indicating that children should not
|
76
|
+
// be resized
|
77
|
+
_notifyResizeSelf: function() {
|
78
|
+
return this.fire('core-resize', null, this, false).defaultPrevented;
|
79
|
+
}
|
80
|
+
|
81
|
+
};
|
82
|
+
|
83
|
+
/**
|
84
|
+
`Polymer.CoreResizable` and `Polymer.CoreResizer` are a set of mixins that can be used
|
85
|
+
in Polymer elements to coordinate the flow of resize events between "resizers" (elements
|
86
|
+
that control the size or hidden state of their children) and "resizables" (elements that
|
87
|
+
need to be notified when they are resized or un-hidden by their parents in order to take
|
88
|
+
action on their new measurements).
|
89
|
+
|
90
|
+
Elements that cause their children to be resized (e.g. a splitter control) or hide/show
|
91
|
+
their children (e.g. overlay) should add the `Core.CoreResizer` mixin to their
|
92
|
+
Polymer prototype definition and then call `this.notifyResize()` any time the element
|
93
|
+
resizes or un-hides its children.
|
94
|
+
|
95
|
+
`CoreResizer`'s must manually call the `resizerAttachedHandler` from the element's
|
96
|
+
`attached` callback and `resizerDetachedHandler` from the element's `detached`
|
97
|
+
callback.
|
98
|
+
|
99
|
+
Note: `CoreResizer` extends `CoreResizable`, and can listen for the `core-resize` event
|
100
|
+
on itself if it needs to perform resize work on itself before notifying children.
|
101
|
+
In this case, returning `false` from the `core-resize` event handler (or calling
|
102
|
+
`preventDefault` on the event) will prevent notification of children if required.
|
103
|
+
|
104
|
+
@element CoreResizer
|
105
|
+
@extends CoreResizable
|
106
|
+
@status beta
|
107
|
+
@homepage github.io
|
108
|
+
*/
|
109
|
+
|
110
|
+
scope.CoreResizer = Polymer.mixin({
|
111
|
+
|
112
|
+
/**
|
113
|
+
* User must call from `attached` callback
|
114
|
+
*
|
115
|
+
* @method resizerAttachedHandler
|
116
|
+
*/
|
117
|
+
resizerAttachedHandler: function() {
|
118
|
+
this.resizableAttachedHandler(this.notifyResize);
|
119
|
+
this._boundResizeRequested = this._boundResizeRequested || this._handleResizeRequested.bind(this);
|
120
|
+
var listener;
|
121
|
+
if (this.resizerIsPeer) {
|
122
|
+
listener = this.parentElement || (this.parentNode && this.parentNode.host);
|
123
|
+
listener._resizerPeers = listener._resizerPeers || [];
|
124
|
+
listener._resizerPeers.push(this);
|
125
|
+
} else {
|
126
|
+
listener = this;
|
127
|
+
}
|
128
|
+
listener.addEventListener('core-request-resize', this._boundResizeRequested);
|
129
|
+
this._resizerListener = listener;
|
130
|
+
},
|
131
|
+
|
132
|
+
/**
|
133
|
+
* User must call from `detached` callback
|
134
|
+
*
|
135
|
+
* @method resizerDetachedHandler
|
136
|
+
*/
|
137
|
+
resizerDetachedHandler: function() {
|
138
|
+
this.resizableDetachedHandler();
|
139
|
+
this._resizerListener.removeEventListener('core-request-resize', this._boundResizeRequested);
|
140
|
+
},
|
141
|
+
|
142
|
+
/**
|
143
|
+
* User should call when resizing or un-hiding children
|
144
|
+
*
|
145
|
+
* @method notifyResize
|
146
|
+
*/
|
147
|
+
notifyResize: function() {
|
148
|
+
// Notify self
|
149
|
+
if (!this._notifyResizeSelf()) {
|
150
|
+
// Notify requestors if default was not prevented
|
151
|
+
var r = this.resizeRequestors;
|
152
|
+
if (r) {
|
153
|
+
for (var i=0; i<r.length; i++) {
|
154
|
+
var ri = r[i];
|
155
|
+
if (!this.resizerShouldNotify || this.resizerShouldNotify(ri.target)) {
|
156
|
+
// log('notifying resize', null, ri.target, true);
|
157
|
+
ri.callback.apply(ri.target);
|
158
|
+
// logEnd();
|
159
|
+
}
|
160
|
+
}
|
161
|
+
}
|
162
|
+
}
|
163
|
+
},
|
164
|
+
|
165
|
+
/**
|
166
|
+
* User should implement to introduce filtering when notifying children.
|
167
|
+
* Generally, children that are hidden by the CoreResizer (e.g. non-active
|
168
|
+
* pages) need not be notified during resize, since they will be notified
|
169
|
+
* again when becoming un-hidden.
|
170
|
+
*
|
171
|
+
* Return `true` if CoreResizable passed as argument should be notified of
|
172
|
+
* resize.
|
173
|
+
*
|
174
|
+
* @method resizeerShouldNotify
|
175
|
+
* @param {Element} el
|
176
|
+
*/
|
177
|
+
// resizeerShouldNotify: function(el) { } // User to implement if needed
|
178
|
+
|
179
|
+
/**
|
180
|
+
* Set to `true` if the resizer is actually a peer to the elements it
|
181
|
+
* resizes (e.g. splitter); in this case it will listen for resize requests
|
182
|
+
* events from its peers on its parent.
|
183
|
+
*
|
184
|
+
* @property resizerIsPeer
|
185
|
+
* @type Boolean
|
186
|
+
* @default false
|
187
|
+
*/
|
188
|
+
|
189
|
+
// Private: Handle requests for resize
|
190
|
+
_handleResizeRequested: function(e) {
|
191
|
+
var target = e.path[0];
|
192
|
+
if ((target == this) ||
|
193
|
+
(target == this._resizerListener) ||
|
194
|
+
(this._resizerPeers && this._resizerPeers.indexOf(target) < 0)) {
|
195
|
+
return;
|
196
|
+
}
|
197
|
+
// log('resize requested', target, this);
|
198
|
+
if (!this.resizeRequestors) {
|
199
|
+
this.resizeRequestors = [];
|
200
|
+
}
|
201
|
+
this.resizeRequestors.push({target: target, callback: e.detail.callback});
|
202
|
+
target.addEventListener('core-request-resize-cancel', this._cancelResizeRequested.bind(this));
|
203
|
+
e.detail.hasParentResizer = true;
|
204
|
+
e.stopPropagation();
|
205
|
+
},
|
206
|
+
|
207
|
+
// Private: Handle cancellation requests for resize
|
208
|
+
_cancelResizeRequested: function(e) {
|
209
|
+
// Exit early if we're already out of the DOM (resizeRequestors will already be null)
|
210
|
+
if (this.resizeRequestors) {
|
211
|
+
for (var i=0; i<this.resizeRequestors.length; i++) {
|
212
|
+
if (this.resizeRequestors[i].target == e.target) {
|
213
|
+
// log('resizeCanceled', e.target, this);
|
214
|
+
this.resizeRequestors.splice(i, 1);
|
215
|
+
break;
|
216
|
+
}
|
217
|
+
}
|
218
|
+
}
|
219
|
+
}
|
220
|
+
|
221
|
+
}, Polymer.CoreResizable);
|
222
|
+
|
223
|
+
// function prettyName(el) {
|
224
|
+
// return el.localName + (el.id ? '#' : '') + el.id;
|
225
|
+
// }
|
226
|
+
|
227
|
+
// function log(what, from, to, group) {
|
228
|
+
// var args = [what];
|
229
|
+
// if (from) {
|
230
|
+
// args.push('from ' + prettyName(from));
|
231
|
+
// }
|
232
|
+
// if (to) {
|
233
|
+
// args.push('to ' + prettyName(to));
|
234
|
+
// }
|
235
|
+
// if (group) {
|
236
|
+
// console.group.apply(console, args);
|
237
|
+
// } else {
|
238
|
+
// console.log.apply(console, args);
|
239
|
+
// }
|
240
|
+
// }
|
241
|
+
|
242
|
+
// function logEnd() {
|
243
|
+
// console.groupEnd();
|
244
|
+
// }
|
245
|
+
|
246
|
+
})(Polymer);
|
247
|
+
|
248
|
+
</script>
|
@@ -46,10 +46,12 @@ that represents a header by adding a `core-header` class to it.
|
|
46
46
|
|
47
47
|
@group Polymer Core Elements
|
48
48
|
@element core-scroll-header-panel
|
49
|
+
@mixins Polymer.CoreResizable https://github.com/polymer/core-resizable
|
49
50
|
@homepage github.io
|
50
51
|
-->
|
51
52
|
|
52
53
|
<link rel="import" href="../polymer/polymer.html">
|
54
|
+
<link rel="import" href="../core-resizable/core-resizable.html">
|
53
55
|
|
54
56
|
<polymer-element name="core-scroll-header-panel">
|
55
57
|
<template>
|
@@ -77,7 +79,7 @@ that represents a header by adding a `core-header` class to it.
|
|
77
79
|
<script>
|
78
80
|
(function() {
|
79
81
|
|
80
|
-
Polymer(
|
82
|
+
Polymer(Polymer.mixin({
|
81
83
|
|
82
84
|
/**
|
83
85
|
* Fired when the content has been scrolled.
|
@@ -184,7 +186,15 @@ that represents a header by adding a `core-header` class to it.
|
|
184
186
|
observe: {
|
185
187
|
'headerMargin fixed': 'setup'
|
186
188
|
},
|
187
|
-
|
189
|
+
|
190
|
+
eventDelegates: {
|
191
|
+
'core-resize': 'measureHeaderHeight'
|
192
|
+
},
|
193
|
+
|
194
|
+
attached: function() {
|
195
|
+
this.resizableAttachedHandler();
|
196
|
+
},
|
197
|
+
|
188
198
|
ready: function() {
|
189
199
|
this._scrollHandler = this.scroll.bind(this);
|
190
200
|
this.scroller.addEventListener('scroll', this._scrollHandler);
|
@@ -192,6 +202,7 @@ that represents a header by adding a `core-header` class to it.
|
|
192
202
|
|
193
203
|
detached: function() {
|
194
204
|
this.scroller.removeEventListener('scroll', this._scrollHandler);
|
205
|
+
this.resizableDetachedHandler();
|
195
206
|
},
|
196
207
|
|
197
208
|
domReady: function() {
|
@@ -330,7 +341,7 @@ that represents a header by adding a `core-header` class to it.
|
|
330
341
|
}
|
331
342
|
}
|
332
343
|
|
333
|
-
});
|
344
|
+
}, Polymer.CoreResizable));
|
334
345
|
|
335
346
|
//determine proper transform mechanizm
|
336
347
|
if (document.documentElement.style.transform !== undefined) {
|