Skip to content
This repository has been archived by the owner on Apr 20, 2023. It is now read-only.

Commit

Permalink
Allow non-prefixed border-image and box-shadow CSS styles to be used,…
Browse files Browse the repository at this point in the history 
… when prefixed versions are not present.
  • Loading branch information
Jason Johnston committed Apr 24, 2010
1 parent 4268a77 commit 8881155
Show file tree
Hide file tree
Showing 7 changed files with 30 additions and 24 deletions.
4 changes: 2 additions & 2 deletions sources/BorderImageStyleInfo.js
View file
Expand Up @@ -9,8 +9,8 @@ PIE.BorderImageStyleInfo = (function() {
}
PIE.Util.merge( BorderImageStyleInfo.prototype, PIE.StyleBase, {

cssProperty: PIE.CSS_PREFIX + 'border-image',
styleProperty: PIE.STYLE_PREFIX + 'BorderImage',
cssProperty: 'border-image',
styleProperty: 'borderImage',

repeatIdents: { 'stretch':1, 'round':1, 'repeat':1, 'space':1 },

Expand Down
4 changes: 2 additions & 2 deletions sources/BoxShadowStyleInfo.js
View file
Expand Up @@ -9,8 +9,8 @@ PIE.BoxShadowStyleInfo = (function() {
}
PIE.Util.merge( BoxShadowStyleInfo.prototype, PIE.StyleBase, {

cssProperty: PIE.CSS_PREFIX + 'box-shadow',
styleProperty: PIE.STYLE_PREFIX + 'BoxShadow',
cssProperty: 'box-shadow',
styleProperty: 'boxShadow',

parseCss: function( css ) {
var p = null, m,
Expand Down
10 changes: 8 additions & 2 deletions sources/StyleBase.js
View file
Expand Up @@ -19,8 +19,14 @@ PIE.StyleBase = {
* @return {string}
*/
getCss: function() {
return this.element.style[ this.styleProperty ] ||
this.element.currentStyle.getAttribute( this.cssProperty );
var el = this.element,
s = el.style,
cs = el.currentStyle,
cssProp = this.cssProperty,
styleProp = this.styleProperty,
prefixedCssProp = this._prefixedCssProp || ( this._prefixedCssProp = PIE.CSS_PREFIX + cssProp ),
prefixedStyleProp = this._prefixedStyleProp || ( this._prefixedStyleProp = PIE.STYLE_PREFIX + styleProp.charAt(0).toUpperCase() + styleProp.substring(1) );
return s[ prefixedStyleProp ] || cs.getAttribute( prefixedCssProp ) || s[ styleProp ] || cs.getAttribute( cssProp );
},

/**
Expand Down
6 changes: 3 additions & 3 deletions tests/border-image-test.html
View file
Expand Up @@ -15,19 +15,19 @@

#test1 {
border-image: url(border.png) 27 fill stretch;
-pie-border-image: url(border.png) 27 fill stretch;
border-image: url(border.png) 27 fill stretch;
-moz-border-image: url(border.png) 27 stretch;
-webkit-border-image: url(border.png) 27 stretch;
}
#test2 {
border-image: url(border.png) 27 repeat;
-pie-border-image: url(border.png) 27 repeat;
border-image: url(border.png) 27 repeat;
-moz-border-image: url(border.png) 27 repeat;
-webkit-border-image: url(border.png) 27 repeat;
}
#test3 {
border-image: url(border.png) 27 round;
-pie-border-image: url(border.png) 27 round;
border-image: url(border.png) 27 round;
-moz-border-image: url(border.png) 27 round;
-webkit-border-image: url(border.png) 27 round;
}
Expand Down
26 changes: 13 additions & 13 deletions tests/misc-tests.html
View file
Expand Up @@ -65,22 +65,22 @@
margin: 10px;
}
#test1 {
-pie-box-shadow: #000 0 0 3px;
box-shadow: #000 0 0 3px;
-moz-box-shadow: #000 0 0 3px;
-webkit-box-shadow: #000 0 0 3px;
}
#test2 {
-pie-box-shadow: #000 0 0 5px;
box-shadow: #000 0 0 5px;
-moz-box-shadow: #000 0 0 5px;
-webkit-box-shadow: #000 0 0 5px;
}
#test3 {
-pie-box-shadow: #000 0 0 8px;
box-shadow: #000 0 0 8px;
-moz-box-shadow: #000 0 0 8px;
-webkit-box-shadow: #000 0 0 8px;
}
#test4 {
-pie-box-shadow: #000 0 0 10px;
box-shadow: #000 0 0 10px;
-moz-box-shadow: #000 0 0 10px;
-webkit-box-shadow: #000 0 0 10px;
}
Expand All @@ -90,7 +90,7 @@
-moz-border-radius: 20px 20px 30px / 10px 20px 30px 40px;
-webkit-border-radius: 20px 20px 30px / 10px 20px 30px 40px;
border-radius: 20px 20px 30px / 10px 20px 30px 40px;
-pie-box-shadow: #000 0 0 8px;
box-shadow: #000 0 0 8px;
-moz-box-shadow: #000 0 0 8px;
-webkit-box-shadow: #000 0 0 8px;
}
Expand All @@ -99,7 +99,7 @@
-moz-border-radius: 100%;
-webkit-border-radius: 100%;
border-radius: 100%;
-pie-box-shadow: #000 0 0 20px;
box-shadow: #000 0 0 20px;
-moz-box-shadow: #000 0 0 20px;
-webkit-box-shadow: #000 0 0 20px;
}
Expand All @@ -115,7 +115,7 @@
-moz-border-radius: 100%;
-webkit-border-radius: 100%;
border-radius: 100%;
-pie-box-shadow: #000 0 0 20px;
box-shadow: #000 0 0 20px;
-moz-box-shadow: #000 0 0 20px;
-webkit-box-shadow: #000 0 0 20px;
-pie-watch-ancestors: 2;
Expand All @@ -136,7 +136,7 @@
-moz-border-radius: 20px 40px;
-webkit-border-radius: 20px 40px;
border-radius: 20px 40px;
-pie-box-shadow: #000 0 0 5px;
box-shadow: #000 0 0 5px;
-moz-box-shadow: #000 0 0 5px;
-webkit-box-shadow: #000 0 0 5px;
}
Expand All @@ -153,7 +153,7 @@
-webkit-border-radius: 20px 40px;
border-radius: 20px 40px;
background: #EEE url(border.png) repeat 50% 50%;
-pie-box-shadow: #000 0 0 10px;
box-shadow: #000 0 0 10px;
-moz-box-shadow: #000 0 0 10px;
-webkit-box-shadow: #000 0 0 10px;
border: 1px dotted;
Expand All @@ -169,7 +169,7 @@
border-color: red green blue black;
border-style: dashed dotted solid double;
background: #EEE url(border.png);
-pie-box-shadow: #000 0 0 10px;
box-shadow: #000 0 0 10px;
-moz-box-shadow: #000 0 0 10px;
-webkit-box-shadow: #000 0 0 10px;
}
Expand All @@ -180,7 +180,7 @@
background: transparent;
border-width: 20px;
border-bottom-width: 30px;
-pie-border-image: url(border.png) 27 stretch;
border-image: url(border.png) 27 stretch;
-moz-border-image: url(border.png) 27 stretch;
-webkit-border-image: url(border.png) 27 stretch;
}
Expand All @@ -194,7 +194,7 @@
#test12 div {
behavior: url(../build/PIE.htc);
background: #EEE;
-pie-box-shadow: rgba(0,0,0,0.5) 10px 10px 0;
box-shadow: rgba(0,0,0,0.5) 10px 10px 0;
position: relative;
}

Expand All @@ -217,7 +217,7 @@
width: 50%;
box-shadow: blue 0 0 10px;
-moz-box-shadow: blue 0 0 10px;
-pie-box-shadow: blue 0 0 10px;
box-shadow: blue 0 0 10px;
}


Expand Down
2 changes: 1 addition & 1 deletion tests/stress-test.html
View file
Expand Up @@ -64,7 +64,7 @@
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
-pie-box-shadow: #000 5px 5px 8px;
box-shadow: #000 5px 5px 8px;
-moz-box-shadow: #000 5px 5px 8px;
-webkit-box-shadow: #000 5px 5px 8px;
}
Expand Down
2 changes: 1 addition & 1 deletion tests/z-index-tests.html
View file
Expand Up @@ -23,7 +23,7 @@
-moz-border-radius: 1em;
border-radius: 1em;
-moz-box-shadow: 0 0 10px;
-pie-box-shadow: 0 0 10px;
box-shadow: 0 0 10px;
white-space: nowrap;
}

Expand Down

0 comments on commit 8881155

Please sign in to comment.