1 /* Nifty Corners Cube - rounded corners with CSS and Javascript
2 Copyright 2006 Alessandro Fulciniti (a.fulciniti@html.it)
4 This program is free software; you can redistribute it and/or modify
5 it under the terms of the GNU General Public License as published by
6 the Free Software Foundation; either version 2 of the License, or
7 (at your option) any later version.
9 This program is distributed in the hope that it will be useful,
10 but WITHOUT ANY WARRANTY; without even the implied warranty of
11 MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
12 GNU General Public License for more details.
14 You should have received a copy of the GNU General Public License
15 along with this program; if not, write to the Free Software
16 Foundation, Inc., 51 Franklin St, Fifth Floor, Boston, MA 02110-1301 USA
19 var niftyOk=(document.getElementById && document.createElement && Array.prototype.push);
22 String.prototype.find=function(what){
23 return(this.indexOf(what)>=0 ? true : false);
26 var oldonload=window.onload;
27 if(typeof(NiftyLoad)!='function') NiftyLoad=function(){};
28 if(typeof(oldonload)=='function')
29 window.onload=function(){oldonload();AddCss('/plekit/niftycorner');NiftyLoad()};
30 else window.onload=function(){AddCss('/plekit/niftycorner');NiftyLoad()};
32 /* xxx local change : pass a path as parameter */
33 function AddCss(path){
35 var l=CreateEl("link");
36 l.setAttribute("type","text/css");
37 l.setAttribute("rel","stylesheet");
38 l.setAttribute("href",path+"/niftyCorners.css");
39 l.setAttribute("media","screen");
40 document.getElementsByTagName("head")[0].appendChild(l);
43 function Nifty(selector,options){
44 if(niftyOk==false) return;
45 if(niftyCss==false) AddCss('/plekit/niftycorner');
46 var i,v=selector.split(","),h=0;
47 if(options==null) options="";
48 if(options.find("fixed-height"))
49 h=getElementsBySelector(v[0])[0].offsetHeight;
50 for(i=0;i<v.length;i++)
51 Rounded(v[i],options);
52 if(options.find("height")) SameHeight(selector,h);
55 function Rounded(selector,options){
56 var i,top="",bottom="",v=new Array();
58 options=options.replace("left","tl bl");
59 options=options.replace("right","tr br");
60 options=options.replace("top","tr tl");
61 options=options.replace("bottom","br bl");
62 options=options.replace("transparent","alias");
63 if(options.find("tl")){
65 if(!options.find("tr")) top="left";
67 else if(options.find("tr")) top="right";
68 if(options.find("bl")){
70 if(!options.find("br")) bottom="left";
72 else if(options.find("br")) bottom="right";
74 if(top=="" && bottom=="" && !options.find("none")){top="both";bottom="both";}
75 v=getElementsBySelector(selector);
76 for(i=0;i<v.length;i++){
78 if(top!="") AddTop(v[i],top,options);
79 if(bottom!="") AddBottom(v[i],bottom,options);
84 * accept element rather than selectors */
85 function pleRounded(element,options){
86 var i,top="",bottom="",v=new Array();
88 options=options.replace("left","tl bl");
89 options=options.replace("right","tr br");
90 options=options.replace("top","tr tl");
91 options=options.replace("bottom","br bl");
92 options=options.replace("transparent","alias");
93 if(options.find("tl")){
95 if(!options.find("tr")) top="left";
97 else if(options.find("tr")) top="right";
98 if(options.find("bl")){
100 if(!options.find("br")) bottom="left";
102 else if(options.find("br")) bottom="right";
104 if(top=="" && bottom=="" && !options.find("none")){top="both";bottom="both";}
106 if(top!="") AddTop(element,top,options);
107 if(bottom!="") AddBottom(element,bottom,options);
111 function AddTop(el,side,options){
112 var d=CreateEl("b"),lim=4,border="",p,i,btype="r",bk,color;
113 d.style.marginLeft="-"+getPadding(el,"Left")+"px";
114 d.style.marginRight="-"+getPadding(el,"Right")+"px";
115 if(options.find("alias") || (color=getBk(el))=="transparent"){
116 color="transparent";bk="transparent"; border=getParentBk(el);btype="t";
119 bk=getParentBk(el); border=Mix(color,bk);
121 d.style.background=bk;
122 d.className="niftycorners";
123 p=getPadding(el,"Top");
124 if(options.find("small")){
125 d.style.marginBottom=(p-2)+"px";
128 else if(options.find("big")){
129 d.style.marginBottom=(p-10)+"px";
132 else d.style.marginBottom=(p-5)+"px";
134 d.appendChild(CreateStrip(i,side,color,border,btype));
135 el.style.paddingTop="0";
136 el.insertBefore(d,el.firstChild);
139 function AddBottom(el,side,options){
140 var d=CreateEl("b"),lim=4,border="",p,i,btype="r",bk,color;
141 d.style.marginLeft="-"+getPadding(el,"Left")+"px";
142 d.style.marginRight="-"+getPadding(el,"Right")+"px";
143 if(options.find("alias") || (color=getBk(el))=="transparent"){
144 color="transparent";bk="transparent"; border=getParentBk(el);btype="t";
147 bk=getParentBk(el); border=Mix(color,bk);
149 d.style.background=bk;
150 d.className="niftycorners";
151 p=getPadding(el,"Bottom");
152 if(options.find("small")){
153 d.style.marginTop=(p-2)+"px";
156 else if(options.find("big")){
157 d.style.marginTop=(p-10)+"px";
160 else d.style.marginTop=(p-5)+"px";
162 d.appendChild(CreateStrip(i,side,color,border,btype));
163 el.style.paddingBottom=0;
167 function CreateStrip(index,side,color,border,btype){
169 x.className=btype+index;
170 x.style.backgroundColor=color;
171 x.style.borderColor=border;
173 x.style.borderRightWidth="0";
174 x.style.marginRight="0";
176 else if(side=="right"){
177 x.style.borderLeftWidth="0";
178 x.style.marginLeft="0";
183 function CreateEl(x){
184 return(document.createElement(x));
188 if(el.currentStyle!=null && el.currentStyle.hasLayout!=null && el.currentStyle.hasLayout==false)
189 el.style.display="inline-block";
192 function SameHeight(selector,maxh){
193 var i,v=selector.split(","),t,j,els=[],gap;
194 for(i=0;i<v.length;i++){
195 t=getElementsBySelector(v[i]);
198 for(i=0;i<els.length;i++){
199 if(els[i].offsetHeight>maxh) maxh=els[i].offsetHeight;
200 els[i].style.height="auto";
202 for(i=0;i<els.length;i++){
203 gap=maxh-els[i].offsetHeight;
205 t=CreateEl("b");t.className="niftyfill";t.style.height=gap+"px";
207 if(nc.className=="niftycorners")
208 els[i].insertBefore(t,nc);
209 else els[i].appendChild(t);
214 function getElementsBySelector(selector){
215 var i,j,selid="",selclass="",tag=selector,tag2="",v2,k,f,a,s=[],objlist=[],c;
216 if(selector.find("#")){ //id selector like "tag#id"
217 if(selector.find(" ")){ //descendant selector like "tag#id tag"
218 s=selector.split(" ");
219 var fs=s[0].split("#");
220 if(fs.length==1) return(objlist);
221 f=document.getElementById(fs[1]);
223 v=f.getElementsByTagName(s[1]);
224 for(i=0;i<v.length;i++) objlist.push(v[i]);
229 s=selector.split("#");
233 f=document.getElementById(selid);
234 if(f) objlist.push(f);
239 if(selector.find(".")){ //class selector like "tag.class"
240 s=selector.split(".");
243 if(selclass.find(" ")){ //descendant selector like tag1.classname tag2
244 s=selclass.split(" ");
249 var v=document.getElementsByTagName(tag); // tag selector like "tag"
251 for(i=0;i<v.length;i++) objlist.push(v[i]);
254 for(i=0;i<v.length;i++){
255 c=v[i].className.split(" ");
256 for(j=0;j<c.length;j++){
258 if(tag2=="") objlist.push(v[i]);
260 v2=v[i].getElementsByTagName(tag2);
261 for(k=0;k<v2.length;k++) objlist.push(v2[k]);
269 function getParentBk(x){
270 var el=x.parentNode,c;
271 while(el.tagName.toUpperCase()!="HTML" && (c=getBk(el))=="transparent")
273 if(c=="transparent") c="#FFFFFF";
278 var c=getStyleProp(x,"backgroundColor");
279 if(c==null || c=="transparent" || c.find("rgba(0, 0, 0, 0)"))
280 return("transparent");
281 if(c.find("rgb")) c=rgb2hex(c);
285 function getPadding(x,side){
286 var p=getStyleProp(x,"padding"+side);
287 if(p==null || !p.find("px")) return(0);
291 function getStyleProp(x,prop){
293 return(x.currentStyle[prop]);
294 if(document.defaultView.getComputedStyle)
295 return(document.defaultView.getComputedStyle(x,'')[prop]);
299 function rgb2hex(value){
301 var regexp=/([0-9]+)[, ]+([0-9]+)[, ]+([0-9]+)/;
302 var h=regexp.exec(value);
304 v=parseInt(h[i]).toString(16);
305 if(v.length==1) hex+="0"+v;
312 var i,step1,step2,x,y,r=new Array(3);
313 if(c1.length==4)step1=1;
315 if(c2.length==4) step2=1;
318 x=parseInt(c1.substr(1+step1*i,step1),16);
319 if(step1==1) x=16*x+x;
320 y=parseInt(c2.substr(1+step2*i,step2),16);
321 if(step2==1) y=16*y+y;
322 r[i]=Math.floor((x*50+y*50)/100);
323 r[i]=r[i].toString(16);
324 if(r[i].length==1) r[i]="0"+r[i];
326 return("#"+r[0]+r[1]+r[2]);