forked from lojjic/PIE
/
BorderStyleInfo.js
101 lines (85 loc) · 3.08 KB
/
BorderStyleInfo.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
/**
* Handles parsing, caching, and detecting changes to border CSS
* @constructor
* @param {Element} el the target element
*/
PIE.BorderStyleInfo = PIE.StyleInfoBase.newStyleInfo( {
sides: [ 'Top', 'Right', 'Bottom', 'Left' ],
namedWidths: {
'thin': '1px',
'medium': '3px',
'thick': '5px'
},
parseCss: function( css ) {
var w = {},
s = {},
c = {},
active = false,
colorsSame = true,
stylesSame = true,
widthsSame = true;
this.withActualBorder( function() {
var el = this.targetElement,
cs = el.currentStyle,
i = 0,
style, color, width, lastStyle, lastColor, lastWidth, side, ltr;
for( ; i < 4; i++ ) {
side = this.sides[ i ];
ltr = side.charAt(0).toLowerCase();
style = s[ ltr ] = cs[ 'border' + side + 'Style' ];
color = cs[ 'border' + side + 'Color' ];
width = cs[ 'border' + side + 'Width' ];
if( i > 0 ) {
if( style !== lastStyle ) { stylesSame = false; }
if( color !== lastColor ) { colorsSame = false; }
if( width !== lastWidth ) { widthsSame = false; }
}
lastStyle = style;
lastColor = color;
lastWidth = width;
c[ ltr ] = PIE.getColor( color );
width = w[ ltr ] = PIE.getLength( s[ ltr ] === 'none' ? '0' : ( this.namedWidths[ width ] || width ) );
if( width.pixels( this.targetElement ) > 0 ) {
active = true;
}
}
} );
return active ? {
widths: w,
styles: s,
colors: c,
widthsSame: widthsSame,
colorsSame: colorsSame,
stylesSame: stylesSame
} : null;
},
getCss: PIE.StyleInfoBase.cacheWhenLocked( function() {
var el = this.targetElement,
cs = el.currentStyle,
css;
// Don't redraw or hide borders for cells in border-collapse:collapse tables
if( !( el.tagName in PIE.tableCellTags && el.offsetParent.currentStyle.borderCollapse === 'collapse' ) ) {
this.withActualBorder( function() {
css = cs.borderWidth + '|' + cs.borderStyle + '|' + cs.borderColor;
} );
}
return css;
} ),
/**
* Execute a function with the actual border styles (not overridden with runtimeStyle
* properties set by the renderers) available via currentStyle.
* @param fn
*/
withActualBorder: function( fn ) {
var rs = this.targetElement.runtimeStyle,
rsWidth = rs.borderWidth,
rsColor = rs.borderColor,
ret;
if( rsWidth ) rs.borderWidth = '';
if( rsColor ) rs.borderColor = '';
ret = fn.call( this );
if( rsWidth ) rs.borderWidth = rsWidth;
if( rsColor ) rs.borderColor = rsColor;
return ret;
}
} );