1 |
/*
|
1 |
/*
|
2 |
Copyright (c) 2004-2006, The Dojo Foundation
|
2 |
Copyright (c) 2004-2006, The Dojo Foundation
|
3 |
All Rights Reserved.
|
3 |
All Rights Reserved.
|
4 |
|
4 |
|
5 |
Licensed under the Academic Free License version 2.1 or above OR the
|
5 |
Licensed under the Academic Free License version 2.1 or above OR the
|
6 |
modified BSD license. For more information on Dojo licensing, see:
|
6 |
modified BSD license. For more information on Dojo licensing, see:
|
7 |
|
7 |
|
8 |
http://dojotoolkit.org/community/licensing.shtml
|
8 |
http://dojotoolkit.org/community/licensing.shtml
|
9 |
*/
|
9 |
*/
|
- |
|
10 |
|
- |
|
11 |
|
10 |
|
12 |
|
11 |
dojo.provide("dojo.lfx.rounded");
|
13 |
dojo.provide("dojo.lfx.rounded");
|
12 |
dojo.require("dojo.lang.common");
|
14 |
dojo.require("dojo.lang.common");
|
13 |
dojo.require("dojo.html.common");
|
15 |
dojo.require("dojo.html.common");
|
14 |
dojo.require("dojo.html.style");
|
16 |
dojo.require("dojo.html.style");
|
15 |
dojo.require("dojo.html.display");
|
17 |
dojo.require("dojo.html.display");
|
16 |
dojo.require("dojo.html.layout");
|
18 |
dojo.require("dojo.html.layout");
|
17 |
dojo.lfx.rounded = function (settings) {
|
19 |
dojo.lfx.rounded = function (settings) {
|
18 |
var options = {validTags:settings.validTags || ["div"], autoPad:settings.autoPad != null ? settings.autoPad : true, antiAlias:settings.antiAlias != null ? settings.antiAlias : true, radii:{tl:(settings.tl && settings.tl.radius != null) ? settings.tl.radius : 5, tr:(settings.tr && settings.tr.radius != null) ? settings.tr.radius : 5, bl:(settings.bl && settings.bl.radius != null) ? settings.bl.radius : 5, br:(settings.br && settings.br.radius != null) ? settings.br.radius : 5}};
|
20 |
var options = {validTags:settings.validTags || ["div"], autoPad:settings.autoPad != null ? settings.autoPad : true, antiAlias:settings.antiAlias != null ? settings.antiAlias : true, radii:{tl:(settings.tl && settings.tl.radius != null) ? settings.tl.radius : 5, tr:(settings.tr && settings.tr.radius != null) ? settings.tr.radius : 5, bl:(settings.bl && settings.bl.radius != null) ? settings.bl.radius : 5, br:(settings.br && settings.br.radius != null) ? settings.br.radius : 5}};
|
19 |
var nodes;
|
21 |
var nodes;
|
20 |
if (typeof (arguments[1]) == "string") {
|
22 |
if (typeof (arguments[1]) == "string") {
|
21 |
nodes = dojo.html.getElementsByClass(arguments[1]);
|
23 |
nodes = dojo.html.getElementsByClass(arguments[1]);
|
22 |
} else {
|
24 |
} else {
|
23 |
if (dojo.lang.isArrayLike(arguments[1])) {
|
25 |
if (dojo.lang.isArrayLike(arguments[1])) {
|
24 |
nodes = arguments[1];
|
26 |
nodes = arguments[1];
|
25 |
for (var i = 0; i < nodes.length; i++) {
|
27 |
for (var i = 0; i < nodes.length; i++) {
|
26 |
nodes[i] = dojo.byId(nodes[i]);
|
28 |
nodes[i] = dojo.byId(nodes[i]);
|
27 |
}
|
29 |
}
|
28 |
}
|
30 |
}
|
29 |
}
|
31 |
}
|
30 |
if (nodes.length == 0) {
|
32 |
if (nodes.length == 0) {
|
31 |
return;
|
33 |
return;
|
32 |
}
|
34 |
}
|
33 |
for (var i = 0; i < nodes.length; i++) {
|
35 |
for (var i = 0; i < nodes.length; i++) {
|
34 |
dojo.lfx.rounded.applyCorners(options, nodes[i]);
|
36 |
dojo.lfx.rounded.applyCorners(options, nodes[i]);
|
35 |
}
|
37 |
}
|
36 |
};
|
38 |
};
|
37 |
dojo.lfx.rounded.applyCorners = function (options, node) {
|
39 |
dojo.lfx.rounded.applyCorners = function (options, node) {
|
38 |
var top = null;
|
40 |
var top = null;
|
39 |
var bottom = null;
|
41 |
var bottom = null;
|
40 |
var contentNode = null;
|
42 |
var contentNode = null;
|
41 |
var fns = dojo.lfx.rounded._fns;
|
43 |
var fns = dojo.lfx.rounded._fns;
|
42 |
var width = node.offsetWidth;
|
44 |
var width = node.offsetWidth;
|
43 |
var height = node.offsetHeight;
|
45 |
var height = node.offsetHeight;
|
44 |
var borderWidth = parseInt(dojo.html.getComputedStyle(node, "border-top-width"));
|
46 |
var borderWidth = parseInt(dojo.html.getComputedStyle(node, "border-top-width"));
|
45 |
var borderColor = dojo.html.getComputedStyle(node, "border-top-color");
|
47 |
var borderColor = dojo.html.getComputedStyle(node, "border-top-color");
|
46 |
var color = dojo.html.getComputedStyle(node, "background-color");
|
48 |
var color = dojo.html.getComputedStyle(node, "background-color");
|
47 |
var bgImage = dojo.html.getComputedStyle(node, "background-image");
|
49 |
var bgImage = dojo.html.getComputedStyle(node, "background-image");
|
48 |
var position = dojo.html.getComputedStyle(node, "position");
|
50 |
var position = dojo.html.getComputedStyle(node, "position");
|
49 |
var padding = parseInt(dojo.html.getComputedStyle(node, "padding-top"));
|
51 |
var padding = parseInt(dojo.html.getComputedStyle(node, "padding-top"));
|
50 |
var format = {height:height, width:width, borderWidth:borderWidth, color:fns.getRGB(color), padding:padding, borderColor:fns.getRGB(borderColor), borderString:borderWidth + "px" + " solid " + fns.getRGB(borderColor), bgImage:((bgImage != "none") ? bgImage : ""), content:node.innerHTML};
|
52 |
var format = {height:height, width:width, borderWidth:borderWidth, color:fns.getRGB(color), padding:padding, borderColor:fns.getRGB(borderColor), borderString:borderWidth + "px" + " solid " + fns.getRGB(borderColor), bgImage:((bgImage != "none") ? bgImage : ""), content:node.innerHTML};
|
51 |
if (!dojo.html.isPositionAbsolute(node)) {
|
53 |
if (!dojo.html.isPositionAbsolute(node)) {
|
52 |
node.style.position = "relative";
|
54 |
node.style.position = "relative";
|
53 |
}
|
55 |
}
|
54 |
node.style.padding = "0px";
|
56 |
node.style.padding = "0px";
|
55 |
if (dojo.render.html.ie && width == "auto" && height == "auto") {
|
57 |
if (dojo.render.html.ie && width == "auto" && height == "auto") {
|
56 |
node.style.width = "100%";
|
58 |
node.style.width = "100%";
|
57 |
}
|
59 |
}
|
58 |
if (options.autoPad && format.padding > 0) {
|
60 |
if (options.autoPad && format.padding > 0) {
|
59 |
node.innerHTML = "";
|
61 |
node.innerHTML = "";
|
60 |
}
|
62 |
}
|
61 |
var topHeight = Math.max(options.radii.tl, options.radii.tr);
|
63 |
var topHeight = Math.max(options.radii.tl, options.radii.tr);
|
62 |
var bottomHeight = Math.max(options.radii.bl, options.radii.br);
|
64 |
var bottomHeight = Math.max(options.radii.bl, options.radii.br);
|
63 |
if (options.radii.tl || options.radii.tr) {
|
65 |
if (options.radii.tl || options.radii.tr) {
|
64 |
top = document.createElement("div");
|
66 |
top = document.createElement("div");
|
65 |
top.style.width = "100%";
|
67 |
top.style.width = "100%";
|
66 |
top.style.fontSize = "1px";
|
68 |
top.style.fontSize = "1px";
|
67 |
top.style.overflow = "hidden";
|
69 |
top.style.overflow = "hidden";
|
68 |
top.style.position = "absolute";
|
70 |
top.style.position = "absolute";
|
69 |
top.style.paddingLeft = format.borderWidth + "px";
|
71 |
top.style.paddingLeft = format.borderWidth + "px";
|
70 |
top.style.paddingRight = format.borderWidth + "px";
|
72 |
top.style.paddingRight = format.borderWidth + "px";
|
71 |
top.style.height = topHeight + "px";
|
73 |
top.style.height = topHeight + "px";
|
72 |
top.style.top = (0 - topHeight) + "px";
|
74 |
top.style.top = (0 - topHeight) + "px";
|
73 |
top.style.left = (0 - format.borderWidth) + "px";
|
75 |
top.style.left = (0 - format.borderWidth) + "px";
|
74 |
node.appendChild(top);
|
76 |
node.appendChild(top);
|
75 |
}
|
77 |
}
|
76 |
if (options.radii.bl || options.radii.br) {
|
78 |
if (options.radii.bl || options.radii.br) {
|
77 |
bottom = document.createElement("div");
|
79 |
bottom = document.createElement("div");
|
78 |
bottom.style.width = "100%";
|
80 |
bottom.style.width = "100%";
|
79 |
bottom.style.fontSize = "1px";
|
81 |
bottom.style.fontSize = "1px";
|
80 |
bottom.style.overflow = "hidden";
|
82 |
bottom.style.overflow = "hidden";
|
81 |
bottom.style.position = "absolute";
|
83 |
bottom.style.position = "absolute";
|
82 |
bottom.style.paddingLeft = format.borderWidth + "px";
|
84 |
bottom.style.paddingLeft = format.borderWidth + "px";
|
83 |
bottom.style.paddingRight = format.borderWidth + "px";
|
85 |
bottom.style.paddingRight = format.borderWidth + "px";
|
84 |
bottom.style.height = bottomHeight + "px";
|
86 |
bottom.style.height = bottomHeight + "px";
|
85 |
bottom.style.bottom = (0 - bottomHeight) + "px";
|
87 |
bottom.style.bottom = (0 - bottomHeight) + "px";
|
86 |
bottom.style.left = (0 - format.borderWidth) + "px";
|
88 |
bottom.style.left = (0 - format.borderWidth) + "px";
|
87 |
node.appendChild(bottom);
|
89 |
node.appendChild(bottom);
|
88 |
}
|
90 |
}
|
89 |
if (top) {
|
91 |
if (top) {
|
90 |
node.style.borderTopWidth = "0px";
|
92 |
node.style.borderTopWidth = "0px";
|
91 |
}
|
93 |
}
|
92 |
if (bottom) {
|
94 |
if (bottom) {
|
93 |
node.style.borderBottomWidth = "0px";
|
95 |
node.style.borderBottomWidth = "0px";
|
94 |
}
|
96 |
}
|
95 |
var corners = ["tr", "tl", "br", "bl"];
|
97 |
var corners = ["tr", "tl", "br", "bl"];
|
96 |
for (var i = 0; i < corners.length; i++) {
|
98 |
for (var i = 0; i < corners.length; i++) {
|
97 |
var cc = corners[i];
|
99 |
var cc = corners[i];
|
98 |
if (options.radii[cc] == 0) {
|
100 |
if (options.radii[cc] == 0) {
|
99 |
if ((cc.charAt(0) == "t" && top) || (cc.charAt(0) == "b" && bottom)) {
|
101 |
if ((cc.charAt(0) == "t" && top) || (cc.charAt(0) == "b" && bottom)) {
|
100 |
var corner = document.createElement("div");
|
102 |
var corner = document.createElement("div");
|
101 |
corner.style.position = "relative";
|
103 |
corner.style.position = "relative";
|
102 |
corner.style.fontSize = "1px;";
|
104 |
corner.style.fontSize = "1px;";
|
103 |
corner.style.overflow = "hidden";
|
105 |
corner.style.overflow = "hidden";
|
104 |
if (format.bgImage == "") {
|
106 |
if (format.bgImage == "") {
|
105 |
corner.style.backgroundColor = format.color;
|
107 |
corner.style.backgroundColor = format.color;
|
106 |
} else {
|
108 |
} else {
|
107 |
corner.style.backgroundImage = format.bgImage;
|
109 |
corner.style.backgroundImage = format.bgImage;
|
108 |
}
|
110 |
}
|
109 |
switch (cc) {
|
111 |
switch (cc) {
|
110 |
case "tl":
|
112 |
case "tl":
|
111 |
corner.style.height = topHeight - format.borderWidth + "px";
|
113 |
corner.style.height = topHeight - format.borderWidth + "px";
|
112 |
corner.style.marginRight = options.radii[cc] - (format.borderWidth * 2) + "px";
|
114 |
corner.style.marginRight = options.radii[cc] - (format.borderWidth * 2) + "px";
|
113 |
corner.style.borderLeft = format.borderString;
|
115 |
corner.style.borderLeft = format.borderString;
|
114 |
corner.style.borderTop = format.borderString;
|
116 |
corner.style.borderTop = format.borderString;
|
115 |
corner.style.left = -format.borderWidth + "px";
|
117 |
corner.style.left = -format.borderWidth + "px";
|
116 |
break;
|
118 |
break;
|
117 |
case "tr":
|
119 |
case "tr":
|
118 |
corner.style.height = topHeight - format.borderWidth + "px";
|
120 |
corner.style.height = topHeight - format.borderWidth + "px";
|
119 |
corner.style.marginLeft = options.radii[cc] - (format.borderWidth * 2) + "px";
|
121 |
corner.style.marginLeft = options.radii[cc] - (format.borderWidth * 2) + "px";
|
120 |
corner.style.borderRight = format.borderString;
|
122 |
corner.style.borderRight = format.borderString;
|
121 |
corner.style.borderTop = format.borderString;
|
123 |
corner.style.borderTop = format.borderString;
|
122 |
corner.style.backgroundPosition = "-" + (topHeight - format.borderWidth) + "px 0px";
|
124 |
corner.style.backgroundPosition = "-" + (topHeight - format.borderWidth) + "px 0px";
|
123 |
corner.style.left = format.borderWidth + "px";
|
125 |
corner.style.left = format.borderWidth + "px";
|
124 |
break;
|
126 |
break;
|
125 |
case "bl":
|
127 |
case "bl":
|
126 |
corner.style.height = bottomHeight - format.borderWidth + "px";
|
128 |
corner.style.height = bottomHeight - format.borderWidth + "px";
|
127 |
corner.style.marginRight = options.radii[cc] - (format.borderWidth * 2) + "px";
|
129 |
corner.style.marginRight = options.radii[cc] - (format.borderWidth * 2) + "px";
|
128 |
corner.style.borderLeft = format.borderString;
|
130 |
corner.style.borderLeft = format.borderString;
|
129 |
corner.style.borderBottom = format.borderString;
|
131 |
corner.style.borderBottom = format.borderString;
|
130 |
corner.style.left = format.borderWidth + "px";
|
132 |
corner.style.left = format.borderWidth + "px";
|
131 |
corner.style.backgroundPosition = "-" + format.borderWidth + "px -" + (format.height + (bottomHeight + format.borderWidth)) + "px";
|
133 |
corner.style.backgroundPosition = "-" + format.borderWidth + "px -" + (format.height + (bottomHeight + format.borderWidth)) + "px";
|
132 |
break;
|
134 |
break;
|
133 |
case "br":
|
135 |
case "br":
|
134 |
corner.style.height = bottomHeight - format.borderWidth + "px";
|
136 |
corner.style.height = bottomHeight - format.borderWidth + "px";
|
135 |
corner.style.marginLeft = options.radii[cc] - (format.borderWidth * 2) + "px";
|
137 |
corner.style.marginLeft = options.radii[cc] - (format.borderWidth * 2) + "px";
|
136 |
corner.style.borderRight = format.borderString;
|
138 |
corner.style.borderRight = format.borderString;
|
137 |
corner.style.borderBottom = format.borderString;
|
139 |
corner.style.borderBottom = format.borderString;
|
138 |
corner.style.left = format.borderWidth + "px";
|
140 |
corner.style.left = format.borderWidth + "px";
|
139 |
corner.style.backgroundPosition = "-" + (bottomHeight + format.borderWidth) + "px -" + (format.height + (bottomHeight + format.borderWidth)) + "px";
|
141 |
corner.style.backgroundPosition = "-" + (bottomHeight + format.borderWidth) + "px -" + (format.height + (bottomHeight + format.borderWidth)) + "px";
|
140 |
break;
|
142 |
break;
|
141 |
}
|
143 |
}
|
142 |
}
|
144 |
}
|
143 |
} else {
|
145 |
} else {
|
144 |
var corner = document.createElement("div");
|
146 |
var corner = document.createElement("div");
|
145 |
corner.style.height = options.radii[cc] + "px";
|
147 |
corner.style.height = options.radii[cc] + "px";
|
146 |
corner.style.width = options.radii[cc] + "px";
|
148 |
corner.style.width = options.radii[cc] + "px";
|
147 |
corner.style.position = "absolute";
|
149 |
corner.style.position = "absolute";
|
148 |
corner.style.fontSize = "1px";
|
150 |
corner.style.fontSize = "1px";
|
149 |
corner.style.overflow = "hidden";
|
151 |
corner.style.overflow = "hidden";
|
150 |
var borderRadius = Math.floor(options.radii[cc] - format.borderWidth);
|
152 |
var borderRadius = Math.floor(options.radii[cc] - format.borderWidth);
|
151 |
for (var x = 0, j = options.radii[cc]; x < j; x++) {
|
153 |
for (var x = 0, j = options.radii[cc]; x < j; x++) {
|
152 |
var y1 = Math.floor(Math.sqrt(Math.pow(borderRadius, 2) - Math.pow((x + 1), 2))) - 1;
|
154 |
var y1 = Math.floor(Math.sqrt(Math.pow(borderRadius, 2) - Math.pow((x + 1), 2))) - 1;
|
153 |
if ((x + 1) >= borderRadius) {
|
155 |
if ((x + 1) >= borderRadius) {
|
154 |
var y1 = -1;
|
156 |
var y1 = -1;
|
155 |
}
|
157 |
}
|
156 |
var y2 = Math.ceil(Math.sqrt(Math.pow(borderRadius, 2) - Math.pow(x, 2)));
|
158 |
var y2 = Math.ceil(Math.sqrt(Math.pow(borderRadius, 2) - Math.pow(x, 2)));
|
157 |
if (x >= borderRadius) {
|
159 |
if (x >= borderRadius) {
|
158 |
y2 = -1;
|
160 |
y2 = -1;
|
159 |
}
|
161 |
}
|
160 |
var y3 = Math.floor(Math.sqrt(Math.pow(j, 2) - Math.pow((x + 1), 2))) - 1;
|
162 |
var y3 = Math.floor(Math.sqrt(Math.pow(j, 2) - Math.pow((x + 1), 2))) - 1;
|
161 |
if ((x + 1) >= j) {
|
163 |
if ((x + 1) >= j) {
|
162 |
y3 = -1;
|
164 |
y3 = -1;
|
163 |
}
|
165 |
}
|
164 |
var y4 = Math.ceil(Math.sqrt(Math.pow(j, 2) - Math.pow(x, 2)));
|
166 |
var y4 = Math.ceil(Math.sqrt(Math.pow(j, 2) - Math.pow(x, 2)));
|
165 |
if (x >= j) {
|
167 |
if (x >= j) {
|
166 |
y4 = -1;
|
168 |
y4 = -1;
|
167 |
}
|
169 |
}
|
168 |
if (y1 > -1) {
|
170 |
if (y1 > -1) {
|
169 |
fns.draw(x, 0, format.color, 100, (y1 + 1), corner, -1, j, topHeight, format);
|
171 |
fns.draw(x, 0, format.color, 100, (y1 + 1), corner, -1, j, topHeight, format);
|
170 |
}
|
172 |
}
|
171 |
for (var y = (y1 + 1); y < y2; y++) {
|
173 |
for (var y = (y1 + 1); y < y2; y++) {
|
172 |
if (options.antiAlias) {
|
174 |
if (options.antiAlias) {
|
173 |
if (format.bgImage != "") {
|
175 |
if (format.bgImage != "") {
|
174 |
var fract = fns.fraction(x, y, borderRadius) * 100;
|
176 |
var fract = fns.fraction(x, y, borderRadius) * 100;
|
175 |
if (fract < 30) {
|
177 |
if (fract < 30) {
|
176 |
fns.draw(x, y, format.borderColor, 100, 1, corner, 0, options.radii[cc], topHeight, format);
|
178 |
fns.draw(x, y, format.borderColor, 100, 1, corner, 0, options.radii[cc], topHeight, format);
|
177 |
} else {
|
179 |
} else {
|
178 |
fns.draw(x, y, format.borderColor, 100, 1, corner, -1, options.radii[cc], topHeight, format);
|
180 |
fns.draw(x, y, format.borderColor, 100, 1, corner, -1, options.radii[cc], topHeight, format);
|
179 |
}
|
181 |
}
|
180 |
} else {
|
182 |
} else {
|
181 |
var clr = fns.blend(format.color, format.borderColor, fns.fraction(x, y, borderRadius));
|
183 |
var clr = fns.blend(format.color, format.borderColor, fns.fraction(x, y, borderRadius));
|
182 |
fns.draw(x, y, clr, 100, 1, corner, 0, options.radii[cc], topHeight, format);
|
184 |
fns.draw(x, y, clr, 100, 1, corner, 0, options.radii[cc], topHeight, format);
|
183 |
}
|
185 |
}
|
184 |
}
|
186 |
}
|
185 |
}
|
187 |
}
|
186 |
if (options.antiAlias) {
|
188 |
if (options.antiAlias) {
|
187 |
if (y3 >= y2) {
|
189 |
if (y3 >= y2) {
|
188 |
if (y2 == -1) {
|
190 |
if (y2 == -1) {
|
189 |
y2 = 0;
|
191 |
y2 = 0;
|
190 |
}
|
192 |
}
|
191 |
fns.draw(x, y2, format.borderColor, 100, (y3 - y2 + 1), corner, 0, 0, topHeight, format);
|
193 |
fns.draw(x, y2, format.borderColor, 100, (y3 - y2 + 1), corner, 0, 0, topHeight, format);
|
192 |
} else {
|
194 |
} else {
|
193 |
if (y3 >= y1) {
|
195 |
if (y3 >= y1) {
|
194 |
fns.draw(x, (y1 + 1), format.borderColor, 100, (y3 - y1), corner, 0, 0, topHeight, format);
|
196 |
fns.draw(x, (y1 + 1), format.borderColor, 100, (y3 - y1), corner, 0, 0, topHeight, format);
|
195 |
}
|
197 |
}
|
196 |
}
|
198 |
}
|
197 |
for (var y = (y3 + 1); y < y4; y++) {
|
199 |
for (var y = (y3 + 1); y < y4; y++) {
|
198 |
fns.draw(x, y, format.borderColor, (fns.fraction(x, y, j) * 100), 1, corner, (format.borderWidth > 0 ? 0 : -1), options.radii[cc], topHeight, format);
|
200 |
fns.draw(x, y, format.borderColor, (fns.fraction(x, y, j) * 100), 1, corner, (format.borderWidth > 0 ? 0 : -1), options.radii[cc], topHeight, format);
|
199 |
}
|
201 |
}
|
200 |
} else {
|
202 |
} else {
|
201 |
y3 = y1;
|
203 |
y3 = y1;
|
202 |
}
|
204 |
}
|
203 |
}
|
205 |
}
|
204 |
if (cc != "br") {
|
206 |
if (cc != "br") {
|
205 |
for (var t = 0, k = corner.childNodes.length; t < k; t++) {
|
207 |
for (var t = 0, k = corner.childNodes.length; t < k; t++) {
|
206 |
var bar = corner.childNodes[t];
|
208 |
var bar = corner.childNodes[t];
|
207 |
var barTop = parseInt(dojo.html.getComputedStyle(bar, "top"));
|
209 |
var barTop = parseInt(dojo.html.getComputedStyle(bar, "top"));
|
208 |
var barLeft = parseInt(dojo.html.getComputedStyle(bar, "left"));
|
210 |
var barLeft = parseInt(dojo.html.getComputedStyle(bar, "left"));
|
209 |
var barHeight = parseInt(dojo.html.getComputedStyle(bar, "height"));
|
211 |
var barHeight = parseInt(dojo.html.getComputedStyle(bar, "height"));
|
210 |
if (cc.charAt(1) == "l") {
|
212 |
if (cc.charAt(1) == "l") {
|
211 |
bar.style.left = (options.radii[cc] - barLeft - 1) + "px";
|
213 |
bar.style.left = (options.radii[cc] - barLeft - 1) + "px";
|
212 |
}
|
214 |
}
|
213 |
if (cc == "tr") {
|
215 |
if (cc == "tr") {
|
214 |
bar.style.top = (options.radii[cc] - barHeight - barTop) + "px";
|
216 |
bar.style.top = (options.radii[cc] - barHeight - barTop) + "px";
|
215 |
bar.style.backgroundPosition = "-" + Math.abs((format.width - options.radii[cc] + format.borderWidth) + barLeft) + "px -" + Math.abs(options.radii[cc] - barHeight - barTop - format.borderWidth) + "px";
|
217 |
bar.style.backgroundPosition = "-" + Math.abs((format.width - options.radii[cc] + format.borderWidth) + barLeft) + "px -" + Math.abs(options.radii[cc] - barHeight - barTop - format.borderWidth) + "px";
|
216 |
} else {
|
218 |
} else {
|
217 |
if (cc == "tl") {
|
219 |
if (cc == "tl") {
|
218 |
bar.style.top = (options.radii[cc] - barHeight - barTop) + "px";
|
220 |
bar.style.top = (options.radii[cc] - barHeight - barTop) + "px";
|
219 |
bar.style.backgroundPosition = "-" + Math.abs((options.radii[cc] - barLeft - 1) - format.borderWidth) + "px -" + Math.abs(options.radii[cc] - barHeight - barTop - format.borderWidth) + "px";
|
221 |
bar.style.backgroundPosition = "-" + Math.abs((options.radii[cc] - barLeft - 1) - format.borderWidth) + "px -" + Math.abs(options.radii[cc] - barHeight - barTop - format.borderWidth) + "px";
|
220 |
} else {
|
222 |
} else {
|
221 |
bar.style.backgroundPosition = "-" + Math.abs((options.radii[cc] + barLeft) + format.borderWidth) + "px -" + Math.abs((format.height + options.radii[cc] + barTop) - format.borderWidth) + "px";
|
223 |
bar.style.backgroundPosition = "-" + Math.abs((options.radii[cc] + barLeft) + format.borderWidth) + "px -" + Math.abs((format.height + options.radii[cc] + barTop) - format.borderWidth) + "px";
|
222 |
}
|
224 |
}
|
223 |
}
|
225 |
}
|
224 |
}
|
226 |
}
|
225 |
}
|
227 |
}
|
226 |
}
|
228 |
}
|
227 |
if (corner) {
|
229 |
if (corner) {
|
228 |
var psn = [];
|
230 |
var psn = [];
|
229 |
if (cc.charAt(0) == "t") {
|
231 |
if (cc.charAt(0) == "t") {
|
230 |
psn.push("top");
|
232 |
psn.push("top");
|
231 |
} else {
|
233 |
} else {
|
232 |
psn.push("bottom");
|
234 |
psn.push("bottom");
|
233 |
}
|
235 |
}
|
234 |
if (cc.charAt(1) == "l") {
|
236 |
if (cc.charAt(1) == "l") {
|
235 |
psn.push("left");
|
237 |
psn.push("left");
|
236 |
} else {
|
238 |
} else {
|
237 |
psn.push("right");
|
239 |
psn.push("right");
|
238 |
}
|
240 |
}
|
239 |
if (corner.style.position == "absolute") {
|
241 |
if (corner.style.position == "absolute") {
|
240 |
for (var z = 0; z < psn.length; z++) {
|
242 |
for (var z = 0; z < psn.length; z++) {
|
241 |
corner.style[psn[z]] = "0px";
|
243 |
corner.style[psn[z]] = "0px";
|
242 |
}
|
244 |
}
|
243 |
}
|
245 |
}
|
244 |
if (psn[0] == "top") {
|
246 |
if (psn[0] == "top") {
|
245 |
if (top) {
|
247 |
if (top) {
|
246 |
top.appendChild(corner);
|
248 |
top.appendChild(corner);
|
247 |
}
|
249 |
}
|
248 |
} else {
|
250 |
} else {
|
249 |
if (bottom) {
|
251 |
if (bottom) {
|
250 |
bottom.appendChild(corner);
|
252 |
bottom.appendChild(corner);
|
251 |
}
|
253 |
}
|
252 |
}
|
254 |
}
|
253 |
}
|
255 |
}
|
254 |
}
|
256 |
}
|
255 |
var diff = {t:Math.abs(options.radii.tl - options.radii.tr), b:Math.abs(options.radii.bl - options.radii.br)};
|
257 |
var diff = {t:Math.abs(options.radii.tl - options.radii.tr), b:Math.abs(options.radii.bl - options.radii.br)};
|
256 |
for (var z in diff) {
|
258 |
for (var z in diff) {
|
257 |
var smaller = (options.radii[z + "l"] < options.radii[z + "r"] ? z + "l" : z + "r");
|
259 |
var smaller = (options.radii[z + "l"] < options.radii[z + "r"] ? z + "l" : z + "r");
|
258 |
var filler = document.createElement("div");
|
260 |
var filler = document.createElement("div");
|
259 |
filler.style.height = diff[z] + "px";
|
261 |
filler.style.height = diff[z] + "px";
|
260 |
filler.style.width = options.radii[smaller] + "px";
|
262 |
filler.style.width = options.radii[smaller] + "px";
|
261 |
filler.style.position = "absolute";
|
263 |
filler.style.position = "absolute";
|
262 |
filler.style.fontSize = "1px";
|
264 |
filler.style.fontSize = "1px";
|
263 |
filler.style.overflow = "hidden";
|
265 |
filler.style.overflow = "hidden";
|
264 |
filler.style.backgroundColor = format.color;
|
266 |
filler.style.backgroundColor = format.color;
|
265 |
switch (smaller) {
|
267 |
switch (smaller) {
|
266 |
case "tl":
|
268 |
case "tl":
|
267 |
filler.style.bottom = "0px";
|
269 |
filler.style.bottom = "0px";
|
268 |
filler.style.left = "0px";
|
270 |
filler.style.left = "0px";
|
269 |
filler.style.borderLeft = format.borderString;
|
271 |
filler.style.borderLeft = format.borderString;
|
270 |
top.appendChild(filler);
|
272 |
top.appendChild(filler);
|
271 |
break;
|
273 |
break;
|
272 |
case "tr":
|
274 |
case "tr":
|
273 |
filler.style.bottom = "0px";
|
275 |
filler.style.bottom = "0px";
|
274 |
filler.style.right = "0px";
|
276 |
filler.style.right = "0px";
|
275 |
filler.style.borderRight = format.borderString;
|
277 |
filler.style.borderRight = format.borderString;
|
276 |
top.appendChild(filler);
|
278 |
top.appendChild(filler);
|
277 |
break;
|
279 |
break;
|
278 |
case "bl":
|
280 |
case "bl":
|
279 |
filler.style.top = "0px";
|
281 |
filler.style.top = "0px";
|
280 |
filler.style.left = "0px";
|
282 |
filler.style.left = "0px";
|
281 |
filler.style.borderLeft = format.borderString;
|
283 |
filler.style.borderLeft = format.borderString;
|
282 |
bottom.appendChild(filler);
|
284 |
bottom.appendChild(filler);
|
283 |
break;
|
285 |
break;
|
284 |
case "br":
|
286 |
case "br":
|
285 |
filler.style.top = "0px";
|
287 |
filler.style.top = "0px";
|
286 |
filler.style.right = "0px";
|
288 |
filler.style.right = "0px";
|
287 |
filler.style.borderRight = format.borderString;
|
289 |
filler.style.borderRight = format.borderString;
|
288 |
bottom.appendChild(filler);
|
290 |
bottom.appendChild(filler);
|
289 |
break;
|
291 |
break;
|
290 |
}
|
292 |
}
|
291 |
var fillBar = document.createElement("div");
|
293 |
var fillBar = document.createElement("div");
|
292 |
fillBar.style.position = "relative";
|
294 |
fillBar.style.position = "relative";
|
293 |
fillBar.style.fontSize = "1px";
|
295 |
fillBar.style.fontSize = "1px";
|
294 |
fillBar.style.overflow = "hidden";
|
296 |
fillBar.style.overflow = "hidden";
|
295 |
fillBar.style.backgroundColor = format.color;
|
297 |
fillBar.style.backgroundColor = format.color;
|
296 |
fillBar.style.backgroundImage = format.bgImage;
|
298 |
fillBar.style.backgroundImage = format.bgImage;
|
297 |
if (z == "t") {
|
299 |
if (z == "t") {
|
298 |
if (top) {
|
300 |
if (top) {
|
299 |
if (options.radii.tl && options.radii.tr) {
|
301 |
if (options.radii.tl && options.radii.tr) {
|
300 |
fillBar.style.height = (topHeight - format.borderWidth) + "px";
|
302 |
fillBar.style.height = (topHeight - format.borderWidth) + "px";
|
301 |
fillBar.style.marginLeft = (options.radii.tl - format.borderWidth) + "px";
|
303 |
fillBar.style.marginLeft = (options.radii.tl - format.borderWidth) + "px";
|
302 |
fillBar.style.marginRight = (options.radii.tr - format.borderWidth) + "px";
|
304 |
fillBar.style.marginRight = (options.radii.tr - format.borderWidth) + "px";
|
303 |
fillBar.style.borderTop = format.borderString;
|
305 |
fillBar.style.borderTop = format.borderString;
|
304 |
if (format.bgImage != "") {
|
306 |
if (format.bgImage != "") {
|
305 |
fillBar.style.backgroundPosition = "-" + (topHeight + format.borderWidth) + "px 0px";
|
307 |
fillBar.style.backgroundPosition = "-" + (topHeight + format.borderWidth) + "px 0px";
|
306 |
}
|
308 |
}
|
307 |
}
|
309 |
}
|
308 |
top.appendChild(fillBar);
|
310 |
top.appendChild(fillBar);
|
309 |
}
|
311 |
}
|
310 |
} else {
|
312 |
} else {
|
311 |
if (bottom) {
|
313 |
if (bottom) {
|
312 |
if (options.radii.bl && options.radii.br) {
|
314 |
if (options.radii.bl && options.radii.br) {
|
313 |
fillBar.style.height = (bottomHeight - format.borderWidth) + "px";
|
315 |
fillBar.style.height = (bottomHeight - format.borderWidth) + "px";
|
314 |
fillBar.style.marginLeft = (options.radii.bl - format.borderWidth) + "px";
|
316 |
fillBar.style.marginLeft = (options.radii.bl - format.borderWidth) + "px";
|
315 |
fillBar.style.marginRight = (options.radii.br - format.borderWidth) + "px";
|
317 |
fillBar.style.marginRight = (options.radii.br - format.borderWidth) + "px";
|
316 |
fillBar.style.borderBottom = format.borderString;
|
318 |
fillBar.style.borderBottom = format.borderString;
|
317 |
if (format.bgImage != "") {
|
319 |
if (format.bgImage != "") {
|
318 |
fillBar.style.backgroundPosition = "-" + (bottomHeight + format.borderWidth) + "px -" + (format.height + (topHeight + format.borderWidth)) + "px";
|
320 |
fillBar.style.backgroundPosition = "-" + (bottomHeight + format.borderWidth) + "px -" + (format.height + (topHeight + format.borderWidth)) + "px";
|
319 |
}
|
321 |
}
|
320 |
}
|
322 |
}
|
321 |
bottom.appendChild(fillBar);
|
323 |
bottom.appendChild(fillBar);
|
322 |
}
|
324 |
}
|
323 |
}
|
325 |
}
|
324 |
}
|
326 |
}
|
325 |
if (options.autoPad && format.padding > 0) {
|
327 |
if (options.autoPad && format.padding > 0) {
|
326 |
var content = document.createElement("div");
|
328 |
var content = document.createElement("div");
|
327 |
content.style.position = "relative";
|
329 |
content.style.position = "relative";
|
328 |
content.innerHTML = format.content;
|
330 |
content.innerHTML = format.content;
|
329 |
content.className = "autoPadDiv";
|
331 |
content.className = "autoPadDiv";
|
330 |
if (topHeight < format.padding) {
|
332 |
if (topHeight < format.padding) {
|
331 |
content.style.paddingTop = Math.abs(topHeight - format.padding) + "px";
|
333 |
content.style.paddingTop = Math.abs(topHeight - format.padding) + "px";
|
332 |
}
|
334 |
}
|
333 |
if (bottomHeight < format.padding) {
|
335 |
if (bottomHeight < format.padding) {
|
334 |
content.style.paddingBottom = Math.abs(bottomHeight - format.padding) + "px";
|
336 |
content.style.paddingBottom = Math.abs(bottomHeight - format.padding) + "px";
|
335 |
}
|
337 |
}
|
336 |
content.style.paddingLeft = format.padding + "px";
|
338 |
content.style.paddingLeft = format.padding + "px";
|
337 |
content.style.paddingRight = format.padding + "px";
|
339 |
content.style.paddingRight = format.padding + "px";
|
338 |
node.appendChild(content);
|
340 |
node.appendChild(content);
|
339 |
}
|
341 |
}
|
340 |
};
|
342 |
};
|
341 |
var count = 0;
|
343 |
var count = 0;
|
342 |
dojo.lfx.rounded._fns = {blend:function (clr1, clr2, frac) {
|
344 |
dojo.lfx.rounded._fns = {blend:function (clr1, clr2, frac) {
|
343 |
var c1 = {r:parseInt(clr1.substr(1, 2), 16), g:parseInt(clr1.substr(3, 2), 16), b:parseInt(clr1.substr(5, 2), 16)};
|
345 |
var c1 = {r:parseInt(clr1.substr(1, 2), 16), g:parseInt(clr1.substr(3, 2), 16), b:parseInt(clr1.substr(5, 2), 16)};
|
344 |
var c2 = {r:parseInt(clr2.substr(1, 2), 16), g:parseInt(clr2.substr(3, 2), 16), b:parseInt(clr2.substr(5, 2), 16)};
|
346 |
var c2 = {r:parseInt(clr2.substr(1, 2), 16), g:parseInt(clr2.substr(3, 2), 16), b:parseInt(clr2.substr(5, 2), 16)};
|
345 |
if (frac > 1 || frac < 0) {
|
347 |
if (frac > 1 || frac < 0) {
|
346 |
frac = 1;
|
348 |
frac = 1;
|
347 |
}
|
349 |
}
|
348 |
var ret = [Math.min(Math.max(Math.round((c1.r * frac) + (c2.r * (1 - frac))), 0), 255), Math.min(Math.max(Math.round((c1.g * frac) + (c2.g * (1 - frac))), 0), 255), Math.min(Math.max(Math.round((c1.b * frac) + (c2.b * (1 - frac))), 0), 255)];
|
350 |
var ret = [Math.min(Math.max(Math.round((c1.r * frac) + (c2.r * (1 - frac))), 0), 255), Math.min(Math.max(Math.round((c1.g * frac) + (c2.g * (1 - frac))), 0), 255), Math.min(Math.max(Math.round((c1.b * frac) + (c2.b * (1 - frac))), 0), 255)];
|
349 |
for (var i = 0; i < ret.length; i++) {
|
351 |
for (var i = 0; i < ret.length; i++) {
|
350 |
var n = ret[i].toString(16);
|
352 |
var n = ret[i].toString(16);
|
351 |
if (n.length < 2) {
|
353 |
if (n.length < 2) {
|
352 |
n = "0" + n;
|
354 |
n = "0" + n;
|
353 |
}
|
355 |
}
|
354 |
ret[i] = n;
|
356 |
ret[i] = n;
|
355 |
}
|
357 |
}
|
356 |
return "#" + ret.join("");
|
358 |
return "#" + ret.join("");
|
357 |
}, fraction:function (x, y, r) {
|
359 |
}, fraction:function (x, y, r) {
|
358 |
var frac = 0;
|
360 |
var frac = 0;
|
359 |
var xval = [];
|
361 |
var xval = [];
|
360 |
var yval = [];
|
362 |
var yval = [];
|
361 |
var point = 0;
|
363 |
var point = 0;
|
362 |
var whatsides = "";
|
364 |
var whatsides = "";
|
363 |
var intersect = Math.sqrt((Math.pow(r, 2) - Math.pow(x, 2)));
|
365 |
var intersect = Math.sqrt((Math.pow(r, 2) - Math.pow(x, 2)));
|
364 |
if (intersect >= y && intersect < (y + 1)) {
|
366 |
if (intersect >= y && intersect < (y + 1)) {
|
365 |
whatsides = "Left";
|
367 |
whatsides = "Left";
|
366 |
xval[point] = 0;
|
368 |
xval[point] = 0;
|
367 |
yval[point++] = intersect - y;
|
369 |
yval[point++] = intersect - y;
|
368 |
}
|
370 |
}
|
369 |
intersect = Math.sqrt((Math.pow(r, 2) - Math.pow(y + 1, 2)));
|
371 |
intersect = Math.sqrt((Math.pow(r, 2) - Math.pow(y + 1, 2)));
|
370 |
if (intersect >= x && intersect < (x + 1)) {
|
372 |
if (intersect >= x && intersect < (x + 1)) {
|
371 |
whatsides += "Top";
|
373 |
whatsides += "Top";
|
372 |
xval[point] = intersect - x;
|
374 |
xval[point] = intersect - x;
|
373 |
yval[point++] = 1;
|
375 |
yval[point++] = 1;
|
374 |
}
|
376 |
}
|
375 |
intersect = Math.sqrt((Math.pow(r, 2) - Math.pow(x + 1, 2)));
|
377 |
intersect = Math.sqrt((Math.pow(r, 2) - Math.pow(x + 1, 2)));
|
376 |
if (intersect >= y && intersect < (y + 1)) {
|
378 |
if (intersect >= y && intersect < (y + 1)) {
|
377 |
whatsides += "Right";
|
379 |
whatsides += "Right";
|
378 |
xval[point] = 1;
|
380 |
xval[point] = 1;
|
379 |
yval[point++] = intersect - y;
|
381 |
yval[point++] = intersect - y;
|
380 |
}
|
382 |
}
|
381 |
intersect = Math.sqrt((Math.pow(r, 2) - Math.pow(y, 2)));
|
383 |
intersect = Math.sqrt((Math.pow(r, 2) - Math.pow(y, 2)));
|
382 |
if (intersect >= x && intersect < (x + 1)) {
|
384 |
if (intersect >= x && intersect < (x + 1)) {
|
383 |
whatsides += "Bottom";
|
385 |
whatsides += "Bottom";
|
384 |
xval[point] = intersect - x;
|
386 |
xval[point] = intersect - x;
|
385 |
yval[point] = 1;
|
387 |
yval[point] = 1;
|
386 |
}
|
388 |
}
|
387 |
switch (whatsides) {
|
389 |
switch (whatsides) {
|
388 |
case "LeftRight":
|
390 |
case "LeftRight":
|
389 |
return Math.min(yval[0], yval[1]) + ((Math.max(yval[0], yval[1]) - Math.min(yval[0], yval[1])) / 2);
|
391 |
return Math.min(yval[0], yval[1]) + ((Math.max(yval[0], yval[1]) - Math.min(yval[0], yval[1])) / 2);
|
390 |
case "TopRight":
|
392 |
case "TopRight":
|
391 |
return 1 - (((1 - xval[0]) * (1 - yval[1])) / 2);
|
393 |
return 1 - (((1 - xval[0]) * (1 - yval[1])) / 2);
|
392 |
case "TopBottom":
|
394 |
case "TopBottom":
|
393 |
return Math.min(xval[0], xval[1]) + ((Math.max(xval[0], xval[1]) - Math.min(xval[0], xval[1])) / 2);
|
395 |
return Math.min(xval[0], xval[1]) + ((Math.max(xval[0], xval[1]) - Math.min(xval[0], xval[1])) / 2);
|
394 |
case "LeftBottom":
|
396 |
case "LeftBottom":
|
395 |
return (yval[0] * xval[1]) / 2;
|
397 |
return (yval[0] * xval[1]) / 2;
|
396 |
default:
|
398 |
default:
|
397 |
return 1;
|
399 |
return 1;
|
398 |
}
|
400 |
}
|
399 |
}, draw:function (x, y, color, opac, height, corner, image, radius, top, format) {
|
401 |
}, draw:function (x, y, color, opac, height, corner, image, radius, top, format) {
|
400 |
var px = document.createElement("div");
|
402 |
var px = document.createElement("div");
|
401 |
px.style.height = height + "px";
|
403 |
px.style.height = height + "px";
|
402 |
px.style.width = "1px";
|
404 |
px.style.width = "1px";
|
403 |
px.style.position = "absolute";
|
405 |
px.style.position = "absolute";
|
404 |
px.style.fontSize = "1px";
|
406 |
px.style.fontSize = "1px";
|
405 |
px.style.overflow = "hidden";
|
407 |
px.style.overflow = "hidden";
|
406 |
if (image == -1 && format.bgImage != "") {
|
408 |
if (image == -1 && format.bgImage != "") {
|
407 |
px.style.backgroundImage = format.bgImage;
|
409 |
px.style.backgroundImage = format.bgImage;
|
408 |
px.style.backgroundPosition = "-" + (format.width - (radius - x) + format.borderWidth) + "px -" + ((format.height + top + y) - format.borderWidth) + "px";
|
410 |
px.style.backgroundPosition = "-" + (format.width - (radius - x) + format.borderWidth) + "px -" + ((format.height + top + y) - format.borderWidth) + "px";
|
409 |
} else {
|
411 |
} else {
|
410 |
px.style.backgroundColor = color;
|
412 |
px.style.backgroundColor = color;
|
411 |
}
|
413 |
}
|
412 |
if (opac != 100) {
|
414 |
if (opac != 100) {
|
413 |
dojo.html.setOpacity(px, (opac / 100));
|
415 |
dojo.html.setOpacity(px, (opac / 100));
|
414 |
}
|
416 |
}
|
415 |
px.style.top = y + "px";
|
417 |
px.style.top = y + "px";
|
416 |
px.style.left = x + "px";
|
418 |
px.style.left = x + "px";
|
417 |
corner.appendChild(px);
|
419 |
corner.appendChild(px);
|
418 |
}, getRGB:function (clr) {
|
420 |
}, getRGB:function (clr) {
|
419 |
var ret = "#ffffff";
|
421 |
var ret = "#ffffff";
|
420 |
if (clr != "" && clr != "transparent") {
|
422 |
if (clr != "" && clr != "transparent") {
|
421 |
if (clr.substr(0, 3) == "rgb") {
|
423 |
if (clr.substr(0, 3) == "rgb") {
|
422 |
var t = clr.substring(4, clr.indexOf(")"));
|
424 |
var t = clr.substring(4, clr.indexOf(")"));
|
423 |
t = t.split(",");
|
425 |
t = t.split(",");
|
424 |
for (var i = 0; i < t.length; i++) {
|
426 |
for (var i = 0; i < t.length; i++) {
|
425 |
var n = parseInt(t[i]).toString(16);
|
427 |
var n = parseInt(t[i]).toString(16);
|
426 |
if (n.length < 2) {
|
428 |
if (n.length < 2) {
|
427 |
n = "0" + n;
|
429 |
n = "0" + n;
|
428 |
}
|
430 |
}
|
429 |
t[i] = n;
|
431 |
t[i] = n;
|
430 |
}
|
432 |
}
|
431 |
ret = "#" + t.join("");
|
433 |
ret = "#" + t.join("");
|
432 |
} else {
|
434 |
} else {
|
433 |
if (clr.length == 4) {
|
435 |
if (clr.length == 4) {
|
434 |
ret = "#" + clr.substring(1, 2) + clr.substring(1, 2) + clr.substring(2, 3) + clr.substring(2, 3) + clr.substring(3, 4) + clr.substring(3, 4);
|
436 |
ret = "#" + clr.substring(1, 2) + clr.substring(1, 2) + clr.substring(2, 3) + clr.substring(2, 3) + clr.substring(3, 4) + clr.substring(3, 4);
|
435 |
} else {
|
437 |
} else {
|
436 |
ret = clr;
|
438 |
ret = clr;
|
437 |
}
|
439 |
}
|
438 |
}
|
440 |
}
|
439 |
}
|
441 |
}
|
440 |
return ret;
|
442 |
return ret;
|
441 |
}};
|
443 |
}};
|
442 |
|
444 |
|