update components
This commit is contained in:
parent
25b5198fa7
commit
e5a4b3813f
21 changed files with 360 additions and 87 deletions
|
@ -16,12 +16,12 @@
|
||||||
},
|
},
|
||||||
"devDependencies": {},
|
"devDependencies": {},
|
||||||
"ignore": [],
|
"ignore": [],
|
||||||
"version": "1.2.58",
|
"version": "1.2.59",
|
||||||
"_release": "1.2.58",
|
"_release": "1.2.59",
|
||||||
"_resolution": {
|
"_resolution": {
|
||||||
"type": "version",
|
"type": "version",
|
||||||
"tag": "1.2.58",
|
"tag": "1.2.59",
|
||||||
"commit": "523cb074208c7350bb68554c6fcde613142117f4"
|
"commit": "2089ec993031b303b5c2163fbc5aff5b37056d1f"
|
||||||
},
|
},
|
||||||
"_source": "https://github.com/MediaBrowser/emby-webcomponents.git",
|
"_source": "https://github.com/MediaBrowser/emby-webcomponents.git",
|
||||||
"_target": "^1.2.0",
|
"_target": "^1.2.0",
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
{
|
{
|
||||||
"name": "iron-behaviors",
|
"name": "iron-behaviors",
|
||||||
"version": "1.0.14",
|
"version": "1.0.15",
|
||||||
"description": "Provides a set of behaviors for the iron elements",
|
"description": "Provides a set of behaviors for the iron elements",
|
||||||
"private": true,
|
"private": true,
|
||||||
"authors": [
|
"authors": [
|
||||||
|
@ -30,11 +30,11 @@
|
||||||
},
|
},
|
||||||
"ignore": [],
|
"ignore": [],
|
||||||
"homepage": "https://github.com/PolymerElements/iron-behaviors",
|
"homepage": "https://github.com/PolymerElements/iron-behaviors",
|
||||||
"_release": "1.0.14",
|
"_release": "1.0.15",
|
||||||
"_resolution": {
|
"_resolution": {
|
||||||
"type": "version",
|
"type": "version",
|
||||||
"tag": "v1.0.14",
|
"tag": "v1.0.15",
|
||||||
"commit": "c1d38a26219cf2e83b31a71a2bd8ae35ebee7ed7"
|
"commit": "f91583bfae24235401a21a1d67bde8cacce13030"
|
||||||
},
|
},
|
||||||
"_source": "git://github.com/PolymerElements/iron-behaviors.git",
|
"_source": "git://github.com/PolymerElements/iron-behaviors.git",
|
||||||
"_target": "^1.0.0",
|
"_target": "^1.0.0",
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
{
|
{
|
||||||
"name": "iron-behaviors",
|
"name": "iron-behaviors",
|
||||||
"version": "1.0.14",
|
"version": "1.0.15",
|
||||||
"description": "Provides a set of behaviors for the iron elements",
|
"description": "Provides a set of behaviors for the iron elements",
|
||||||
"private": true,
|
"private": true,
|
||||||
"authors": [
|
"authors": [
|
||||||
|
|
|
@ -73,7 +73,8 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
|
||||||
|
|
||||||
if (event.target === this) {
|
if (event.target === this) {
|
||||||
this._setFocused(event.type === 'focus');
|
this._setFocused(event.type === 'focus');
|
||||||
} else if (!this.shadowRoot && !this.isLightDescendant(event.target)) {
|
} else if (!this.shadowRoot &&
|
||||||
|
!this.isLightDescendant(Polymer.dom(event).localTarget)) {
|
||||||
this.fire(event.type, {sourceEvent: event}, {
|
this.fire(event.type, {sourceEvent: event}, {
|
||||||
node: this,
|
node: this,
|
||||||
bubbles: event.bubbles,
|
bubbles: event.bubbles,
|
||||||
|
|
|
@ -31,10 +31,11 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
|
||||||
</template>
|
</template>
|
||||||
</test-fixture>
|
</test-fixture>
|
||||||
|
|
||||||
<test-fixture id="LightDOM">
|
<test-fixture id="LightDOM">
|
||||||
<template>
|
<template>
|
||||||
<test-light-dom>
|
<test-light-dom>
|
||||||
<input id="input">
|
<input id="input">
|
||||||
|
<nested-focusable></nested-focusable>
|
||||||
</test-light-dom>
|
</test-light-dom>
|
||||||
</template>
|
</template>
|
||||||
</test-fixture>
|
</test-fixture>
|
||||||
|
@ -119,11 +120,13 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
|
||||||
|
|
||||||
|
|
||||||
suite('elements in the light dom', function() {
|
suite('elements in the light dom', function() {
|
||||||
var lightDOM, input;
|
var lightDOM, input, lightDescendantShadowInput;
|
||||||
|
|
||||||
setup(function() {
|
setup(function() {
|
||||||
lightDOM = fixture('LightDOM');
|
lightDOM = fixture('LightDOM');
|
||||||
input = document.querySelector('#input');
|
input = document.querySelector('#input');
|
||||||
|
lightDescendantShadowInput = Polymer.dom(lightDOM)
|
||||||
|
.querySelector('nested-focusable').$.input;
|
||||||
});
|
});
|
||||||
|
|
||||||
test('should not fire the focus event', function() {
|
test('should not fire the focus event', function() {
|
||||||
|
@ -138,6 +141,18 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
|
||||||
expect(nFocusEvents).to.be.equal(0);
|
expect(nFocusEvents).to.be.equal(0);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
test('should not fire the focus event from shadow descendants', function() {
|
||||||
|
var nFocusEvents = 0;
|
||||||
|
|
||||||
|
lightDOM.addEventListener('focus', function() {
|
||||||
|
nFocusEvents += 1;
|
||||||
|
});
|
||||||
|
|
||||||
|
MockInteractions.focus(lightDescendantShadowInput);
|
||||||
|
|
||||||
|
expect(nFocusEvents).to.be.equal(0);
|
||||||
|
});
|
||||||
|
|
||||||
});
|
});
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
{
|
{
|
||||||
"name": "iron-fit-behavior",
|
"name": "iron-fit-behavior",
|
||||||
"version": "1.1.0",
|
"version": "1.1.1",
|
||||||
"license": "http://polymer.github.io/LICENSE.txt",
|
"license": "http://polymer.github.io/LICENSE.txt",
|
||||||
"description": "Fits an element inside another element",
|
"description": "Fits an element inside another element",
|
||||||
"private": true,
|
"private": true,
|
||||||
|
@ -29,11 +29,11 @@
|
||||||
},
|
},
|
||||||
"ignore": [],
|
"ignore": [],
|
||||||
"homepage": "https://github.com/PolymerElements/iron-fit-behavior",
|
"homepage": "https://github.com/PolymerElements/iron-fit-behavior",
|
||||||
"_release": "1.1.0",
|
"_release": "1.1.1",
|
||||||
"_resolution": {
|
"_resolution": {
|
||||||
"type": "version",
|
"type": "version",
|
||||||
"tag": "v1.1.0",
|
"tag": "v1.1.1",
|
||||||
"commit": "6602a102f425f5ccc9e05e9cc15139a3ad259081"
|
"commit": "c87fd44553b9ce2c60f695146d667932a7be2f8f"
|
||||||
},
|
},
|
||||||
"_source": "git://github.com/PolymerElements/iron-fit-behavior.git",
|
"_source": "git://github.com/PolymerElements/iron-fit-behavior.git",
|
||||||
"_target": "^1.0.0",
|
"_target": "^1.0.0",
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
{
|
{
|
||||||
"name": "iron-fit-behavior",
|
"name": "iron-fit-behavior",
|
||||||
"version": "1.1.0",
|
"version": "1.1.1",
|
||||||
"license": "http://polymer.github.io/LICENSE.txt",
|
"license": "http://polymer.github.io/LICENSE.txt",
|
||||||
"description": "Fits an element inside another element",
|
"description": "Fits an element inside another element",
|
||||||
"private": true,
|
"private": true,
|
||||||
|
|
|
@ -105,18 +105,8 @@ Use `noOverlap` to position the element around another element without overlappi
|
||||||
},
|
},
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* A pixel value that will be added to the position calculated for the
|
* The same as setting margin-left and margin-right css properties.
|
||||||
* given `horizontalAlign`, in the direction of alignment. You can think
|
* @deprecated
|
||||||
* of it as increasing or decreasing the distance to the side of the
|
|
||||||
* screen given by `horizontalAlign`.
|
|
||||||
*
|
|
||||||
* If `horizontalAlign` is "left", this offset will increase or decrease
|
|
||||||
* the distance to the left side of the screen: a negative offset will
|
|
||||||
* move the element to the left; a positive one, to the right.
|
|
||||||
*
|
|
||||||
* Conversely if `horizontalAlign` is "right", this offset will increase
|
|
||||||
* or decrease the distance to the right side of the screen: a negative
|
|
||||||
* offset will move the element to the right; a positive one, to the left.
|
|
||||||
*/
|
*/
|
||||||
horizontalOffset: {
|
horizontalOffset: {
|
||||||
type: Number,
|
type: Number,
|
||||||
|
@ -125,18 +115,8 @@ Use `noOverlap` to position the element around another element without overlappi
|
||||||
},
|
},
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* A pixel value that will be added to the position calculated for the
|
* The same as setting margin-top and margin-bottom css properties.
|
||||||
* given `verticalAlign`, in the direction of alignment. You can think
|
* @deprecated
|
||||||
* of it as increasing or decreasing the distance to the side of the
|
|
||||||
* screen given by `verticalAlign`.
|
|
||||||
*
|
|
||||||
* If `verticalAlign` is "top", this offset will increase or decrease
|
|
||||||
* the distance to the top side of the screen: a negative offset will
|
|
||||||
* move the element upwards; a positive one, downwards.
|
|
||||||
*
|
|
||||||
* Conversely if `verticalAlign` is "bottom", this offset will increase
|
|
||||||
* or decrease the distance to the bottom side of the screen: a negative
|
|
||||||
* offset will move the element downwards; a positive one, upwards.
|
|
||||||
*/
|
*/
|
||||||
verticalOffset: {
|
verticalOffset: {
|
||||||
type: Number,
|
type: Number,
|
||||||
|
@ -205,7 +185,7 @@ Use `noOverlap` to position the element around another element without overlappi
|
||||||
get _defaultPositionTarget() {
|
get _defaultPositionTarget() {
|
||||||
var parent = Polymer.dom(this).parentNode;
|
var parent = Polymer.dom(this).parentNode;
|
||||||
|
|
||||||
if (parent.nodeType === Node.DOCUMENT_FRAGMENT_NODE) {
|
if (parent && parent.nodeType === Node.DOCUMENT_FRAGMENT_NODE) {
|
||||||
parent = parent.host;
|
parent = parent.host;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -262,6 +242,7 @@ Use `noOverlap` to position the element around another element without overlappi
|
||||||
}
|
}
|
||||||
var target = window.getComputedStyle(this);
|
var target = window.getComputedStyle(this);
|
||||||
var sizer = window.getComputedStyle(this.sizingTarget);
|
var sizer = window.getComputedStyle(this.sizingTarget);
|
||||||
|
|
||||||
this._fitInfo = {
|
this._fitInfo = {
|
||||||
inlineStyle: {
|
inlineStyle: {
|
||||||
top: this.style.top || '',
|
top: this.style.top || '',
|
||||||
|
@ -292,6 +273,20 @@ Use `noOverlap` to position the element around another element without overlappi
|
||||||
left: parseInt(target.marginLeft, 10) || 0
|
left: parseInt(target.marginLeft, 10) || 0
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
// Support these properties until they are removed.
|
||||||
|
if (this.verticalOffset) {
|
||||||
|
this._fitInfo.margin.top = this._fitInfo.margin.bottom = this.verticalOffset;
|
||||||
|
this._fitInfo.inlineStyle.marginTop = this.style.marginTop || '';
|
||||||
|
this._fitInfo.inlineStyle.marginBottom = this.style.marginBottom || '';
|
||||||
|
this.style.marginTop = this.style.marginBottom = this.verticalOffset + 'px';
|
||||||
|
}
|
||||||
|
if (this.horizontalOffset) {
|
||||||
|
this._fitInfo.margin.left = this._fitInfo.margin.right = this.horizontalOffset;
|
||||||
|
this._fitInfo.inlineStyle.marginLeft = this.style.marginLeft || '';
|
||||||
|
this._fitInfo.inlineStyle.marginRight = this.style.marginRight || '';
|
||||||
|
this.style.marginLeft = this.style.marginRight = this.horizontalOffset + 'px';
|
||||||
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
@ -340,11 +335,15 @@ Use `noOverlap` to position the element around another element without overlappi
|
||||||
var positionRect = this.__getNormalizedRect(this.positionTarget);
|
var positionRect = this.__getNormalizedRect(this.positionTarget);
|
||||||
var fitRect = this.__getNormalizedRect(this.fitInto);
|
var fitRect = this.__getNormalizedRect(this.fitInto);
|
||||||
|
|
||||||
var alignRight = this.__isAlignRight(this._localeHorizontalAlign, rect, positionRect, fitRect);
|
// Consider the margin as part of the size for position calculations.
|
||||||
var alignBottom = this.__isAlignBottom(this.verticalAlign, rect, positionRect, fitRect);
|
var width = rect.width + this._fitInfo.margin.left + this._fitInfo.margin.right;
|
||||||
|
var height = rect.height + this._fitInfo.margin.top + this._fitInfo.margin.bottom;
|
||||||
|
|
||||||
var top = alignBottom ? positionRect.bottom - rect.height - this.verticalOffset : positionRect.top + this.verticalOffset;
|
var alignRight = this.__isAlignRight(this._localeHorizontalAlign, width, positionRect, fitRect);
|
||||||
var left = alignRight ? positionRect.right - rect.width - this.horizontalOffset : positionRect.left + this.horizontalOffset;
|
var alignBottom = this.__isAlignBottom(this.verticalAlign, height, positionRect, fitRect);
|
||||||
|
|
||||||
|
var top = alignBottom ? positionRect.bottom - height : positionRect.top;
|
||||||
|
var left = alignRight ? positionRect.right - width : positionRect.left;
|
||||||
|
|
||||||
if (this.noOverlap) {
|
if (this.noOverlap) {
|
||||||
// We can overlap one of the dimensions, choose the one that minimizes the cropped area.
|
// We can overlap one of the dimensions, choose the one that minimizes the cropped area.
|
||||||
|
@ -353,30 +352,34 @@ Use `noOverlap` to position the element around another element without overlappi
|
||||||
var areaOverlapLeft = this.__getCroppedArea({
|
var areaOverlapLeft = this.__getCroppedArea({
|
||||||
top: noOverlapTop,
|
top: noOverlapTop,
|
||||||
left: left,
|
left: left,
|
||||||
width: rect.width,
|
width: width,
|
||||||
height: rect.height
|
height: height
|
||||||
}, fitRect);
|
}, fitRect);
|
||||||
var areaOverlapTop = this.__getCroppedArea({
|
var areaOverlapTop = this.__getCroppedArea({
|
||||||
top: top,
|
top: top,
|
||||||
left: noOverlapLeft,
|
left: noOverlapLeft,
|
||||||
width: rect.width,
|
width: width,
|
||||||
height: rect.height
|
height: height
|
||||||
}, fitRect);
|
}, fitRect);
|
||||||
if (areaOverlapLeft < areaOverlapTop) {
|
if (areaOverlapLeft >= areaOverlapTop) {
|
||||||
left = noOverlapLeft;
|
left = noOverlapLeft;
|
||||||
} else {
|
} else {
|
||||||
top = noOverlapTop;
|
top = noOverlapTop;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
left += this._fitInfo.margin.left;
|
||||||
|
top += this._fitInfo.margin.top;
|
||||||
|
|
||||||
|
// Use original size (without margin)
|
||||||
var right = left + rect.width;
|
var right = left + rect.width;
|
||||||
var bottom = top + rect.height;
|
var bottom = top + rect.height;
|
||||||
|
|
||||||
left = Math.max(left, 0);
|
left = Math.max(left, this._fitInfo.margin.left);
|
||||||
top = Math.max(top, 0);
|
top = Math.max(top, this._fitInfo.margin.top);
|
||||||
|
|
||||||
var maxWidth = Math.min(fitRect.right, right) - left;
|
var maxWidth = Math.min(fitRect.right - this._fitInfo.margin.right, right) - left;
|
||||||
var maxHeight = Math.min(fitRect.bottom, bottom) - top;
|
var maxHeight = Math.min(fitRect.bottom - this._fitInfo.margin.bottom, bottom) - top;
|
||||||
|
|
||||||
var minWidth = this._fitInfo.sizedBy.minWidth;
|
var minWidth = this._fitInfo.sizedBy.minWidth;
|
||||||
var minHeight = this._fitInfo.sizedBy.minHeight;
|
var minHeight = this._fitInfo.sizedBy.minHeight;
|
||||||
|
@ -503,24 +506,38 @@ Use `noOverlap` to position the element around another element without overlappi
|
||||||
return target.getBoundingClientRect();
|
return target.getBoundingClientRect();
|
||||||
},
|
},
|
||||||
|
|
||||||
__isAlignRight: function(hAlign, rect, positionRect, fitRect) {
|
__isAlignRight: function(hAlign, size, positionRect, fitRect) {
|
||||||
if (hAlign === 'right') {
|
if (hAlign === 'right') {
|
||||||
return true;
|
return true;
|
||||||
}
|
}
|
||||||
if (hAlign === 'auto') {
|
if (hAlign === 'auto') {
|
||||||
return positionRect.left + positionRect.width/2 > fitRect.left + fitRect.width/2 ||
|
// We should align on the right if positionTarget is on the right of fitInto,
|
||||||
(!this.noOverlap && positionRect.left < 0 && positionRect.right - rect.width > positionRect.left);
|
// or if we can overlap and aligning on the left would cause more cropping
|
||||||
|
// than aligning on the right.
|
||||||
|
var positionTargetCenter = positionRect.left + positionRect.width/2;
|
||||||
|
var fitIntoCenter = fitRect.left + fitRect.width/2;
|
||||||
|
var croppedLeft = Math.abs(Math.min(0, positionRect.left));
|
||||||
|
var croppedRight = Math.abs(Math.min(0, positionRect.right - size));
|
||||||
|
return positionTargetCenter > fitIntoCenter ||
|
||||||
|
(!this.noOverlap && croppedLeft > croppedRight);
|
||||||
}
|
}
|
||||||
return false;
|
return false;
|
||||||
},
|
},
|
||||||
|
|
||||||
__isAlignBottom: function(vAlign, rect, positionRect, fitRect) {
|
__isAlignBottom: function(vAlign, size, positionRect, fitRect) {
|
||||||
if (vAlign === 'bottom') {
|
if (vAlign === 'bottom') {
|
||||||
return true;
|
return true;
|
||||||
}
|
}
|
||||||
if (vAlign === 'auto') {
|
if (vAlign === 'auto') {
|
||||||
return positionRect.top + positionRect.height/2 > fitRect.top + fitRect.height/2 ||
|
// We should align on the bottom if positionTarget is on the bottom of fitInto,
|
||||||
(!this.noOverlap && positionRect.top < 0 && positionRect.bottom - rect.height > positionRect.top);
|
// or if we can overlap and aligning on the top would cause more cropping
|
||||||
|
// than aligning on the bottom.
|
||||||
|
var positionTargetCenter = positionRect.top + positionRect.height/2;
|
||||||
|
var fitIntoCenter = fitRect.top + fitRect.height/2;
|
||||||
|
var croppedTop = Math.abs(Math.min(0, positionRect.top));
|
||||||
|
var croppedBottom = Math.abs(Math.min(0, positionRect.bottom - size));
|
||||||
|
return positionTargetCenter > fitIntoCenter ||
|
||||||
|
(!this.noOverlap && croppedTop > croppedBottom);
|
||||||
}
|
}
|
||||||
return false;
|
return false;
|
||||||
},
|
},
|
||||||
|
@ -528,7 +545,7 @@ Use `noOverlap` to position the element around another element without overlappi
|
||||||
__getCroppedArea: function(rect, fitRect) {
|
__getCroppedArea: function(rect, fitRect) {
|
||||||
var verticalCrop = Math.min(0, rect.top) + Math.min(0, fitRect.bottom - (rect.top + rect.height));
|
var verticalCrop = Math.min(0, rect.top) + Math.min(0, fitRect.bottom - (rect.top + rect.height));
|
||||||
var horizontalCrop = Math.min(0, rect.left) + Math.min(0, fitRect.right - (rect.left + rect.width));
|
var horizontalCrop = Math.min(0, rect.left) + Math.min(0, fitRect.right - (rect.left + rect.width));
|
||||||
return verticalCrop * rect.width + horizontalCrop * rect.height;
|
return Math.abs(verticalCrop) * rect.width + Math.abs(horizontalCrop) * rect.height;
|
||||||
}
|
}
|
||||||
|
|
||||||
};
|
};
|
||||||
|
|
|
@ -453,6 +453,21 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
|
||||||
assert.equal(rect.height, elRect.height, 'no cropping');
|
assert.equal(rect.height, elRect.height, 'no cropping');
|
||||||
});
|
});
|
||||||
|
|
||||||
|
test('element margin is considered as offset', function() {
|
||||||
|
el.verticalAlign = 'top';
|
||||||
|
el.style.marginTop = '10px';
|
||||||
|
el.refit();
|
||||||
|
var rect = el.getBoundingClientRect();
|
||||||
|
assert.equal(rect.top, parentRect.top + 10, 'top ok');
|
||||||
|
assert.equal(rect.height, elRect.height, 'no cropping');
|
||||||
|
|
||||||
|
el.style.marginTop = '-10px';
|
||||||
|
el.refit();
|
||||||
|
rect = el.getBoundingClientRect();
|
||||||
|
assert.equal(rect.top, parentRect.top - 10, 'top ok');
|
||||||
|
assert.equal(rect.height, elRect.height, 'no cropping');
|
||||||
|
});
|
||||||
|
|
||||||
test('verticalOffset is applied', function() {
|
test('verticalOffset is applied', function() {
|
||||||
el.verticalAlign = 'top';
|
el.verticalAlign = 'top';
|
||||||
el.verticalOffset = 10;
|
el.verticalOffset = 10;
|
||||||
|
@ -499,6 +514,21 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
|
||||||
assert.equal(rect.height, elRect.height, 'no cropping');
|
assert.equal(rect.height, elRect.height, 'no cropping');
|
||||||
});
|
});
|
||||||
|
|
||||||
|
test('element margin is considered as offset', function() {
|
||||||
|
el.verticalAlign = 'bottom';
|
||||||
|
el.style.marginBottom = '10px';
|
||||||
|
el.refit();
|
||||||
|
var rect = el.getBoundingClientRect();
|
||||||
|
assert.equal(rect.bottom, parentRect.bottom - 10, 'bottom ok');
|
||||||
|
assert.equal(rect.height, elRect.height, 'no cropping');
|
||||||
|
|
||||||
|
el.style.marginBottom = '-10px';
|
||||||
|
el.refit();
|
||||||
|
rect = el.getBoundingClientRect();
|
||||||
|
assert.equal(rect.bottom, parentRect.bottom + 10, 'bottom ok');
|
||||||
|
assert.equal(rect.height, elRect.height, 'no cropping');
|
||||||
|
});
|
||||||
|
|
||||||
test('verticalOffset is applied', function() {
|
test('verticalOffset is applied', function() {
|
||||||
el.verticalAlign = 'bottom';
|
el.verticalAlign = 'bottom';
|
||||||
el.verticalOffset = 10;
|
el.verticalOffset = 10;
|
||||||
|
@ -596,6 +626,21 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
|
||||||
assert.equal(rect.width, elRect.width, 'no cropping');
|
assert.equal(rect.width, elRect.width, 'no cropping');
|
||||||
});
|
});
|
||||||
|
|
||||||
|
test('element margin is considered as offset', function() {
|
||||||
|
el.horizontalAlign = 'left';
|
||||||
|
el.style.marginLeft = '10px';
|
||||||
|
el.refit();
|
||||||
|
var rect = el.getBoundingClientRect();
|
||||||
|
assert.equal(rect.left, parentRect.left + 10, 'left ok');
|
||||||
|
assert.equal(rect.width, elRect.width, 'no cropping');
|
||||||
|
|
||||||
|
el.style.marginLeft = '-10px';
|
||||||
|
el.refit();
|
||||||
|
rect = el.getBoundingClientRect();
|
||||||
|
assert.equal(rect.left, parentRect.left - 10, 'left ok');
|
||||||
|
assert.equal(rect.width, elRect.width, 'no cropping');
|
||||||
|
});
|
||||||
|
|
||||||
test('horizontalOffset is applied', function() {
|
test('horizontalOffset is applied', function() {
|
||||||
el.horizontalAlign = 'left';
|
el.horizontalAlign = 'left';
|
||||||
el.horizontalOffset = 10;
|
el.horizontalOffset = 10;
|
||||||
|
@ -645,6 +690,21 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
|
||||||
assert.equal(rect.width, elRect.width, 'no cropping');
|
assert.equal(rect.width, elRect.width, 'no cropping');
|
||||||
});
|
});
|
||||||
|
|
||||||
|
test('element margin is considered as offset', function() {
|
||||||
|
el.horizontalAlign = 'right';
|
||||||
|
el.style.marginRight = '10px';
|
||||||
|
el.refit();
|
||||||
|
var rect = el.getBoundingClientRect();
|
||||||
|
assert.equal(rect.right, parentRect.right - 10, 'right ok');
|
||||||
|
assert.equal(rect.width, elRect.width, 'no cropping');
|
||||||
|
|
||||||
|
el.style.marginRight = '-10px';
|
||||||
|
el.refit();
|
||||||
|
rect = el.getBoundingClientRect();
|
||||||
|
assert.equal(rect.right, parentRect.right + 10, 'right ok');
|
||||||
|
assert.equal(rect.width, elRect.width, 'no cropping');
|
||||||
|
});
|
||||||
|
|
||||||
test('horizontalOffset is applied', function() {
|
test('horizontalOffset is applied', function() {
|
||||||
el.horizontalAlign = 'right';
|
el.horizontalAlign = 'right';
|
||||||
el.horizontalOffset = 10;
|
el.horizontalOffset = 10;
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
{
|
{
|
||||||
"name": "iron-overlay-behavior",
|
"name": "iron-overlay-behavior",
|
||||||
"version": "1.7.0",
|
"version": "1.7.1",
|
||||||
"license": "http://polymer.github.io/LICENSE.txt",
|
"license": "http://polymer.github.io/LICENSE.txt",
|
||||||
"description": "Provides a behavior for making an element an overlay",
|
"description": "Provides a behavior for making an element an overlay",
|
||||||
"private": true,
|
"private": true,
|
||||||
|
@ -35,11 +35,11 @@
|
||||||
},
|
},
|
||||||
"ignore": [],
|
"ignore": [],
|
||||||
"homepage": "https://github.com/polymerelements/iron-overlay-behavior",
|
"homepage": "https://github.com/polymerelements/iron-overlay-behavior",
|
||||||
"_release": "1.7.0",
|
"_release": "1.7.1",
|
||||||
"_resolution": {
|
"_resolution": {
|
||||||
"type": "version",
|
"type": "version",
|
||||||
"tag": "v1.7.0",
|
"tag": "v1.7.1",
|
||||||
"commit": "d61575162a40904914fa3528ba20bb531d098001"
|
"commit": "4655445cb91e19ef3cdae247ded2ffc9f50b46a8"
|
||||||
},
|
},
|
||||||
"_source": "git://github.com/polymerelements/iron-overlay-behavior.git",
|
"_source": "git://github.com/polymerelements/iron-overlay-behavior.git",
|
||||||
"_target": "^1.0.0",
|
"_target": "^1.0.0",
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
{
|
{
|
||||||
"name": "iron-overlay-behavior",
|
"name": "iron-overlay-behavior",
|
||||||
"version": "1.7.0",
|
"version": "1.7.1",
|
||||||
"license": "http://polymer.github.io/LICENSE.txt",
|
"license": "http://polymer.github.io/LICENSE.txt",
|
||||||
"description": "Provides a behavior for making an element an overlay",
|
"description": "Provides a behavior for making an element an overlay",
|
||||||
"private": true,
|
"private": true,
|
||||||
|
|
|
@ -128,8 +128,12 @@ Custom property | Description | Default
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
_openedChanged: function() {
|
/**
|
||||||
if (this.opened) {
|
* @param {boolean} opened
|
||||||
|
* @private
|
||||||
|
*/
|
||||||
|
_openedChanged: function(opened) {
|
||||||
|
if (opened) {
|
||||||
// Auto-attach.
|
// Auto-attach.
|
||||||
this.prepare();
|
this.prepare();
|
||||||
} else {
|
} else {
|
||||||
|
|
|
@ -36,7 +36,7 @@
|
||||||
"tag": "v1.5.0",
|
"tag": "v1.5.0",
|
||||||
"commit": "c7402274efa2e3b2a905ffa25d70c2ff3309dc59"
|
"commit": "c7402274efa2e3b2a905ffa25d70c2ff3309dc59"
|
||||||
},
|
},
|
||||||
"_source": "git://github.com/PolymerElements/iron-selector.git",
|
"_source": "git://github.com/polymerelements/iron-selector.git",
|
||||||
"_target": "^1.0.0",
|
"_target": "^1.0.0",
|
||||||
"_originalSource": "PolymerElements/iron-selector"
|
"_originalSource": "polymerelements/iron-selector"
|
||||||
}
|
}
|
|
@ -1,10 +1,13 @@
|
||||||
{
|
{
|
||||||
"name": "paper-icon-button",
|
"name": "paper-icon-button",
|
||||||
"private": true,
|
"private": true,
|
||||||
"version": "1.0.7",
|
"version": "1.1.0",
|
||||||
"license": "http://polymer.github.io/LICENSE.txt",
|
"license": "http://polymer.github.io/LICENSE.txt",
|
||||||
"description": "A material design icon button",
|
"description": "A material design icon button",
|
||||||
"main": "paper-icon-button.html",
|
"main": [
|
||||||
|
"paper-icon-button.html",
|
||||||
|
"paper-icon-button-light.html"
|
||||||
|
],
|
||||||
"author": [
|
"author": [
|
||||||
"The Polymer Authors"
|
"The Polymer Authors"
|
||||||
],
|
],
|
||||||
|
@ -35,11 +38,11 @@
|
||||||
},
|
},
|
||||||
"ignore": [],
|
"ignore": [],
|
||||||
"homepage": "https://github.com/PolymerElements/paper-icon-button",
|
"homepage": "https://github.com/PolymerElements/paper-icon-button",
|
||||||
"_release": "1.0.7",
|
"_release": "1.1.0",
|
||||||
"_resolution": {
|
"_resolution": {
|
||||||
"type": "version",
|
"type": "version",
|
||||||
"tag": "v1.0.7",
|
"tag": "v1.1.0",
|
||||||
"commit": "7623d73efeb6e2e88e2abdb5e4d00641d39e400f"
|
"commit": "1d57e0d3a76d001674cb0b86ed14244551577e7a"
|
||||||
},
|
},
|
||||||
"_source": "git://github.com/PolymerElements/paper-icon-button.git",
|
"_source": "git://github.com/PolymerElements/paper-icon-button.git",
|
||||||
"_target": "^1.0.0",
|
"_target": "^1.0.0",
|
||||||
|
|
33
dashboard-ui/bower_components/paper-icon-button/.github/ISSUE_TEMPLATE.md
vendored
Normal file
33
dashboard-ui/bower_components/paper-icon-button/.github/ISSUE_TEMPLATE.md
vendored
Normal file
|
@ -0,0 +1,33 @@
|
||||||
|
<!-- Instructions: https://github.com/PolymerElements/paper-icon-button/CONTRIBUTING.md#filing-issues -->
|
||||||
|
### Description
|
||||||
|
<!-- Example: The `paper-foo` element causes the page to turn pink when clicked. -->
|
||||||
|
|
||||||
|
### Expected outcome
|
||||||
|
|
||||||
|
<!-- Example: The page stays the same color. -->
|
||||||
|
|
||||||
|
### Actual outcome
|
||||||
|
|
||||||
|
<!-- Example: The page turns pink. -->
|
||||||
|
|
||||||
|
### Live Demo
|
||||||
|
<!-- Example: https://jsbin.com/cagaye/edit?html,output -->
|
||||||
|
|
||||||
|
### Steps to reproduce
|
||||||
|
|
||||||
|
<!-- Example
|
||||||
|
1. Put a `paper-foo` element in the page.
|
||||||
|
2. Open the page in a web browser.
|
||||||
|
3. Click the `paper-foo` element.
|
||||||
|
-->
|
||||||
|
|
||||||
|
### Browsers Affected
|
||||||
|
<!-- Check all that apply -->
|
||||||
|
- [ ] Chrome
|
||||||
|
- [ ] Firefox
|
||||||
|
- [ ] Safari 9
|
||||||
|
- [ ] Safari 8
|
||||||
|
- [ ] Safari 7
|
||||||
|
- [ ] Edge
|
||||||
|
- [ ] IE 11
|
||||||
|
- [ ] IE 10
|
|
@ -1,5 +1,5 @@
|
||||||
language: node_js
|
language: node_js
|
||||||
sudo: false
|
sudo: required
|
||||||
before_script:
|
before_script:
|
||||||
- npm install -g bower polylint web-component-tester
|
- npm install -g bower polylint web-component-tester
|
||||||
- bower install
|
- bower install
|
||||||
|
@ -8,18 +8,16 @@ env:
|
||||||
global:
|
global:
|
||||||
- secure: A+iEL5FUMQWkkaOduE26bo0jW49LYKxDwWGZOty9H9fCDpBNQSADOhIvLzScGtjE7Rr3jVmowVsDN0XfVSRpJneEIvj7+tHAXUFoVey8vDVklOmhlR25IH2OczEmCkOS+sAKRiSF54aptdPeJhmpbMH0FyZfuX+jJfhdonJ+YQg=
|
- secure: A+iEL5FUMQWkkaOduE26bo0jW49LYKxDwWGZOty9H9fCDpBNQSADOhIvLzScGtjE7Rr3jVmowVsDN0XfVSRpJneEIvj7+tHAXUFoVey8vDVklOmhlR25IH2OczEmCkOS+sAKRiSF54aptdPeJhmpbMH0FyZfuX+jJfhdonJ+YQg=
|
||||||
- secure: Ps1Hy0fzmYRYF/ur2Myg7ol43HpzpooCoDvqzpMbIBWkXjXcN0KlPoNc6lEFlhjSpjddMFavdajKYIO0j9adAjZA7HYlf+BglhxV45lz13o04+QlNbDSADNyAlKJLrIvFacn9DE3VXlvBwBu83m+ndHUN/uMyHyZo0VE1/ad9Iw=
|
- secure: Ps1Hy0fzmYRYF/ur2Myg7ol43HpzpooCoDvqzpMbIBWkXjXcN0KlPoNc6lEFlhjSpjddMFavdajKYIO0j9adAjZA7HYlf+BglhxV45lz13o04+QlNbDSADNyAlKJLrIvFacn9DE3VXlvBwBu83m+ndHUN/uMyHyZo0VE1/ad9Iw=
|
||||||
- CXX=g++-4.8
|
|
||||||
node_js: stable
|
node_js: stable
|
||||||
addons:
|
addons:
|
||||||
firefox: latest
|
firefox: latest
|
||||||
apt:
|
apt:
|
||||||
sources:
|
sources:
|
||||||
- google-chrome
|
- google-chrome
|
||||||
- ubuntu-toolchain-r-test
|
|
||||||
packages:
|
packages:
|
||||||
- google-chrome-stable
|
- google-chrome-stable
|
||||||
- g++-4.8
|
|
||||||
sauce_connect: true
|
sauce_connect: true
|
||||||
script:
|
script:
|
||||||
- xvfb-run wct
|
- xvfb-run wct
|
||||||
- "if [ \"${TRAVIS_PULL_REQUEST}\" = \"false\" ]; then wct -s 'default'; fi"
|
- "if [ \"${TRAVIS_PULL_REQUEST}\" = \"false\" ]; then wct -s 'default'; fi"
|
||||||
|
dist: trusty
|
||||||
|
|
|
@ -1,10 +1,13 @@
|
||||||
{
|
{
|
||||||
"name": "paper-icon-button",
|
"name": "paper-icon-button",
|
||||||
"private": true,
|
"private": true,
|
||||||
"version": "1.0.7",
|
"version": "1.1.0",
|
||||||
"license": "http://polymer.github.io/LICENSE.txt",
|
"license": "http://polymer.github.io/LICENSE.txt",
|
||||||
"description": "A material design icon button",
|
"description": "A material design icon button",
|
||||||
"main": "paper-icon-button.html",
|
"main": [
|
||||||
|
"paper-icon-button.html",
|
||||||
|
"paper-icon-button-light.html"
|
||||||
|
],
|
||||||
"author": [
|
"author": [
|
||||||
"The Polymer Authors"
|
"The Polymer Authors"
|
||||||
],
|
],
|
||||||
|
|
57
dashboard-ui/bower_components/paper-icon-button/demo/paper-icon-button-light.html
vendored
Normal file
57
dashboard-ui/bower_components/paper-icon-button/demo/paper-icon-button-light.html
vendored
Normal file
|
@ -0,0 +1,57 @@
|
||||||
|
<!doctype html>
|
||||||
|
<!--
|
||||||
|
@license
|
||||||
|
Copyright (c) 2016 The Polymer Project Authors. All rights reserved.
|
||||||
|
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
|
||||||
|
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
|
||||||
|
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
|
||||||
|
Code distributed by Google as part of the polymer project is also
|
||||||
|
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
|
||||||
|
-->
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<title>paper-icon-button-light demo</title>
|
||||||
|
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1, user-scalable=yes">
|
||||||
|
<script src="../../webcomponentsjs/webcomponents-lite.js"></script>
|
||||||
|
|
||||||
|
<link rel="import" href="../../iron-icons/iron-icons.html">
|
||||||
|
<link rel="import" href="../../paper-styles/color.html">
|
||||||
|
<link rel="import" href="../../iron-demo-helpers/demo-snippet.html">
|
||||||
|
<link rel="import" href="../../iron-demo-helpers/demo-pages-shared-styles.html">
|
||||||
|
<link rel="import" href="../paper-icon-button-light.html">
|
||||||
|
|
||||||
|
<style is="custom-style" include="demo-pages-shared-styles"></style>
|
||||||
|
</head>
|
||||||
|
<body unresolved>
|
||||||
|
<div class="vertical-section-container centered">
|
||||||
|
<h3>paper-icon-button-light can contain iron-icons or external images and can be disabled</h3>
|
||||||
|
<demo-snippet class="centered-demo">
|
||||||
|
<template>
|
||||||
|
<style is="custom-style">
|
||||||
|
button[is=paper-icon-button-light] {
|
||||||
|
width: 40px;
|
||||||
|
height: 40px;
|
||||||
|
padding: 8px;
|
||||||
|
margin: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
button[is=paper-icon-button-light] > img {
|
||||||
|
width: 24px;
|
||||||
|
height: 24px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
<button is="paper-icon-button-light" title="heart">
|
||||||
|
<iron-icon icon="favorite"></iron-icon>
|
||||||
|
</button>
|
||||||
|
<button is="paper-icon-button-light" title="octocat">
|
||||||
|
<img src="https://assets-cdn.github.com/images/modules/logos_page/Octocat.png" alt="octocat">
|
||||||
|
</button>
|
||||||
|
<button is="paper-icon-button-light" title="reply" disabled>
|
||||||
|
<iron-icon icon="reply"></iron-icon>
|
||||||
|
</button>
|
||||||
|
</template>
|
||||||
|
</demo-snippet>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
</html>
|
82
dashboard-ui/bower_components/paper-icon-button/paper-icon-button-light.html
vendored
Normal file
82
dashboard-ui/bower_components/paper-icon-button/paper-icon-button-light.html
vendored
Normal file
|
@ -0,0 +1,82 @@
|
||||||
|
<!--
|
||||||
|
@license
|
||||||
|
Copyright (c) 2016 The Polymer Project Authors. All rights reserved.
|
||||||
|
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
|
||||||
|
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
|
||||||
|
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
|
||||||
|
Code distributed by Google as part of the polymer project is also
|
||||||
|
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
|
||||||
|
-->
|
||||||
|
|
||||||
|
<link rel="import" href="../polymer/polymer.html">
|
||||||
|
<link rel="import" href="../paper-behaviors/paper-ripple-behavior.html">
|
||||||
|
|
||||||
|
<!--
|
||||||
|
@group Paper Elements
|
||||||
|
@element paper-icon-button-light
|
||||||
|
@demo demo/paper-icon-button-light.html
|
||||||
|
-->
|
||||||
|
<dom-module id="paper-icon-button-light">
|
||||||
|
<template strip-whitespace>
|
||||||
|
<style>
|
||||||
|
:host {
|
||||||
|
vertical-align: middle;
|
||||||
|
color: inherit;
|
||||||
|
outline: none;
|
||||||
|
width: 24px;
|
||||||
|
height: 24px;
|
||||||
|
background: none;
|
||||||
|
margin: 0;
|
||||||
|
border: none;
|
||||||
|
padding: 0;
|
||||||
|
|
||||||
|
position: relative;
|
||||||
|
cursor: pointer;
|
||||||
|
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
|
||||||
|
}
|
||||||
|
|
||||||
|
:host([disabled]) {
|
||||||
|
color: #9b9b9b;
|
||||||
|
pointer-events: none;
|
||||||
|
cursor: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
paper-ripple {
|
||||||
|
opacity: 0.6;
|
||||||
|
color: currentColor;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
<content></content>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
Polymer({
|
||||||
|
is: 'paper-icon-button-light',
|
||||||
|
extends: 'button',
|
||||||
|
|
||||||
|
behaviors: [
|
||||||
|
Polymer.PaperRippleBehavior
|
||||||
|
],
|
||||||
|
|
||||||
|
listeners: {
|
||||||
|
'down': '_rippleDown',
|
||||||
|
'up': '_rippleUp',
|
||||||
|
'focus': '_rippleDown',
|
||||||
|
'blur': '_rippleUp',
|
||||||
|
},
|
||||||
|
|
||||||
|
_rippleDown: function() {
|
||||||
|
this.getRipple().downAction();
|
||||||
|
},
|
||||||
|
|
||||||
|
_rippleUp: function() {
|
||||||
|
this.getRipple().upAction();
|
||||||
|
},
|
||||||
|
|
||||||
|
ensureRipple: function() {
|
||||||
|
Polymer.PaperRippleBehavior.ensureRipple.apply(this, arguments);
|
||||||
|
this._ripple.center = true;
|
||||||
|
this._ripple.classList.add('circle');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
</dom-module>
|
|
@ -54,7 +54,7 @@
|
||||||
"tag": "v1.1.11",
|
"tag": "v1.1.11",
|
||||||
"commit": "8cfe5c5bf8c2e40d243443d046a94b6fe371983c"
|
"commit": "8cfe5c5bf8c2e40d243443d046a94b6fe371983c"
|
||||||
},
|
},
|
||||||
"_source": "git://github.com/PolymerElements/paper-input.git",
|
"_source": "git://github.com/polymerelements/paper-input.git",
|
||||||
"_target": "^1.0.0",
|
"_target": "^1.0.9",
|
||||||
"_originalSource": "PolymerElements/paper-input"
|
"_originalSource": "polymerelements/paper-input"
|
||||||
}
|
}
|
|
@ -38,7 +38,7 @@
|
||||||
"tag": "v1.0.6",
|
"tag": "v1.0.6",
|
||||||
"commit": "6aef0896fcbc25f9f5bd1dd55f7679e6ab7f92ad"
|
"commit": "6aef0896fcbc25f9f5bd1dd55f7679e6ab7f92ad"
|
||||||
},
|
},
|
||||||
"_source": "git://github.com/PolymerElements/paper-material.git",
|
"_source": "git://github.com/polymerelements/paper-material.git",
|
||||||
"_target": "^1.0.0",
|
"_target": "^1.0.0",
|
||||||
"_originalSource": "PolymerElements/paper-material"
|
"_originalSource": "polymerelements/paper-material"
|
||||||
}
|
}
|
Loading…
Add table
Add a link
Reference in a new issue