1 /* Nifty Corners Cube - rounded corners with CSS and Javascript
\r
2 Copyright 2006 Alessandro Fulciniti (a.fulciniti@html.it)
\r
4 This program is free software; you can redistribute it and/or modify
\r
5 it under the terms of the GNU General Public License as published by
\r
6 the Free Software Foundation; either version 2 of the License, or
\r
7 (at your option) any later version.
\r
9 This program is distributed in the hope that it will be useful,
\r
10 but WITHOUT ANY WARRANTY; without even the implied warranty of
\r
11 MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
\r
12 GNU General Public License for more details.
\r
14 You should have received a copy of the GNU General Public License
\r
15 along with this program; if not, write to the Free Software
\r
16 Foundation, Inc., 51 Franklin St, Fifth Floor, Boston, MA 02110-1301 USA
\r
19 var niftyOk=(document.getElementById && document.createElement && Array.prototype.push);
\r
22 String.prototype.find=function(what){
\r
23 return(this.indexOf(what)>=0 ? true : false);
\r
26 var oldonload=window.onload;
\r
27 if(typeof(NiftyLoad)!='function') NiftyLoad=function(){};
\r
28 if(typeof(oldonload)=='function')
\r
29 window.onload=function(){oldonload();AddCss('/plekit/niftycorner');NiftyLoad()};
\r
30 else window.onload=function(){AddCss('/plekit/niftycorner');NiftyLoad()};
\r
32 function AddCss(path){
\r
34 var l=CreateEl("link");
\r
35 l.setAttribute("type","text/css");
\r
36 l.setAttribute("rel","stylesheet");
\r
37 l.setAttribute("href",path+"/niftyCorners.css");
\r
38 l.setAttribute("media","screen");
\r
39 document.getElementsByTagName("head")[0].appendChild(l);
\r
42 function Nifty(selector,options){
\r
43 if(niftyOk==false) return;
\r
44 if(niftyCss==false) AddCss('/plekit/niftycorner');
\r
45 var i,v=selector.split(","),h=0;
\r
46 if(options==null) options="";
\r
47 if(options.find("fixed-height"))
\r
48 h=getElementsBySelector(v[0])[0].offsetHeight;
\r
49 for(i=0;i<v.length;i++)
\r
50 Rounded(v[i],options);
\r
51 if(options.find("height")) SameHeight(selector,h);
\r
54 function Rounded(selector,options){
\r
55 var i,top="",bottom="",v=new Array();
\r
57 options=options.replace("left","tl bl");
\r
58 options=options.replace("right","tr br");
\r
59 options=options.replace("top","tr tl");
\r
60 options=options.replace("bottom","br bl");
\r
61 options=options.replace("transparent","alias");
\r
62 if(options.find("tl")){
\r
64 if(!options.find("tr")) top="left";
\r
66 else if(options.find("tr")) top="right";
\r
67 if(options.find("bl")){
\r
69 if(!options.find("br")) bottom="left";
\r
71 else if(options.find("br")) bottom="right";
\r
73 if(top=="" && bottom=="" && !options.find("none")){top="both";bottom="both";}
\r
74 v=getElementsBySelector(selector);
\r
75 for(i=0;i<v.length;i++){
\r
77 if(top!="") AddTop(v[i],top,options);
\r
78 if(bottom!="") AddBottom(v[i],bottom,options);
\r
82 function AddTop(el,side,options){
\r
83 var d=CreateEl("b"),lim=4,border="",p,i,btype="r",bk,color;
\r
84 d.style.marginLeft="-"+getPadding(el,"Left")+"px";
\r
85 d.style.marginRight="-"+getPadding(el,"Right")+"px";
\r
86 if(options.find("alias") || (color=getBk(el))=="transparent"){
\r
87 color="transparent";bk="transparent"; border=getParentBk(el);btype="t";
\r
90 bk=getParentBk(el); border=Mix(color,bk);
\r
92 d.style.background=bk;
\r
93 d.className="niftycorners";
\r
94 p=getPadding(el,"Top");
\r
95 if(options.find("small")){
\r
96 d.style.marginBottom=(p-2)+"px";
\r
99 else if(options.find("big")){
\r
100 d.style.marginBottom=(p-10)+"px";
\r
103 else d.style.marginBottom=(p-5)+"px";
\r
104 for(i=1;i<=lim;i++)
\r
105 d.appendChild(CreateStrip(i,side,color,border,btype));
\r
106 el.style.paddingTop="0";
\r
107 el.insertBefore(d,el.firstChild);
\r
110 function AddBottom(el,side,options){
\r
111 var d=CreateEl("b"),lim=4,border="",p,i,btype="r",bk,color;
\r
112 d.style.marginLeft="-"+getPadding(el,"Left")+"px";
\r
113 d.style.marginRight="-"+getPadding(el,"Right")+"px";
\r
114 if(options.find("alias") || (color=getBk(el))=="transparent"){
\r
115 color="transparent";bk="transparent"; border=getParentBk(el);btype="t";
\r
118 bk=getParentBk(el); border=Mix(color,bk);
\r
120 d.style.background=bk;
\r
121 d.className="niftycorners";
\r
122 p=getPadding(el,"Bottom");
\r
123 if(options.find("small")){
\r
124 d.style.marginTop=(p-2)+"px";
\r
127 else if(options.find("big")){
\r
128 d.style.marginTop=(p-10)+"px";
\r
131 else d.style.marginTop=(p-5)+"px";
\r
133 d.appendChild(CreateStrip(i,side,color,border,btype));
\r
134 el.style.paddingBottom=0;
\r
138 function CreateStrip(index,side,color,border,btype){
\r
139 var x=CreateEl("b");
\r
140 x.className=btype+index;
\r
141 x.style.backgroundColor=color;
\r
142 x.style.borderColor=border;
\r
144 x.style.borderRightWidth="0";
\r
145 x.style.marginRight="0";
\r
147 else if(side=="right"){
\r
148 x.style.borderLeftWidth="0";
\r
149 x.style.marginLeft="0";
\r
154 function CreateEl(x){
\r
155 return(document.createElement(x));
\r
158 function FixIE(el){
\r
159 if(el.currentStyle!=null && el.currentStyle.hasLayout!=null && el.currentStyle.hasLayout==false)
\r
160 el.style.display="inline-block";
\r
163 function SameHeight(selector,maxh){
\r
164 var i,v=selector.split(","),t,j,els=[],gap;
\r
165 for(i=0;i<v.length;i++){
\r
166 t=getElementsBySelector(v[i]);
\r
169 for(i=0;i<els.length;i++){
\r
170 if(els[i].offsetHeight>maxh) maxh=els[i].offsetHeight;
\r
171 els[i].style.height="auto";
\r
173 for(i=0;i<els.length;i++){
\r
174 gap=maxh-els[i].offsetHeight;
\r
176 t=CreateEl("b");t.className="niftyfill";t.style.height=gap+"px";
\r
177 nc=els[i].lastChild;
\r
178 if(nc.className=="niftycorners")
\r
179 els[i].insertBefore(t,nc);
\r
180 else els[i].appendChild(t);
\r
185 function getElementsBySelector(selector){
\r
186 var i,j,selid="",selclass="",tag=selector,tag2="",v2,k,f,a,s=[],objlist=[],c;
\r
187 if(selector.find("#")){ //id selector like "tag#id"
\r
188 if(selector.find(" ")){ //descendant selector like "tag#id tag"
\r
189 s=selector.split(" ");
\r
190 var fs=s[0].split("#");
\r
191 if(fs.length==1) return(objlist);
\r
192 f=document.getElementById(fs[1]);
\r
194 v=f.getElementsByTagName(s[1]);
\r
195 for(i=0;i<v.length;i++) objlist.push(v[i]);
\r
200 s=selector.split("#");
\r
204 f=document.getElementById(selid);
\r
205 if(f) objlist.push(f);
\r
210 if(selector.find(".")){ //class selector like "tag.class"
\r
211 s=selector.split(".");
\r
214 if(selclass.find(" ")){ //descendant selector like tag1.classname tag2
\r
215 s=selclass.split(" ");
\r
220 var v=document.getElementsByTagName(tag); // tag selector like "tag"
\r
222 for(i=0;i<v.length;i++) objlist.push(v[i]);
\r
225 for(i=0;i<v.length;i++){
\r
226 c=v[i].className.split(" ");
\r
227 for(j=0;j<c.length;j++){
\r
228 if(c[j]==selclass){
\r
229 if(tag2=="") objlist.push(v[i]);
\r
231 v2=v[i].getElementsByTagName(tag2);
\r
232 for(k=0;k<v2.length;k++) objlist.push(v2[k]);
\r
240 function getParentBk(x){
\r
241 var el=x.parentNode,c;
\r
242 while(el.tagName.toUpperCase()!="HTML" && (c=getBk(el))=="transparent")
\r
244 if(c=="transparent") c="#FFFFFF";
\r
249 var c=getStyleProp(x,"backgroundColor");
\r
250 if(c==null || c=="transparent" || c.find("rgba(0, 0, 0, 0)"))
\r
251 return("transparent");
\r
252 if(c.find("rgb")) c=rgb2hex(c);
\r
256 function getPadding(x,side){
\r
257 var p=getStyleProp(x,"padding"+side);
\r
258 if(p==null || !p.find("px")) return(0);
\r
259 return(parseInt(p));
\r
262 function getStyleProp(x,prop){
\r
264 return(x.currentStyle[prop]);
\r
265 if(document.defaultView.getComputedStyle)
\r
266 return(document.defaultView.getComputedStyle(x,'')[prop]);
\r
270 function rgb2hex(value){
\r
272 var regexp=/([0-9]+)[, ]+([0-9]+)[, ]+([0-9]+)/;
\r
273 var h=regexp.exec(value);
\r
275 v=parseInt(h[i]).toString(16);
\r
276 if(v.length==1) hex+="0"+v;
\r
282 function Mix(c1,c2){
\r
283 var i,step1,step2,x,y,r=new Array(3);
\r
284 if(c1.length==4)step1=1;
\r
286 if(c2.length==4) step2=1;
\r
289 x=parseInt(c1.substr(1+step1*i,step1),16);
\r
290 if(step1==1) x=16*x+x;
\r
291 y=parseInt(c2.substr(1+step2*i,step2),16);
\r
292 if(step2==1) y=16*y+y;
\r
293 r[i]=Math.floor((x*50+y*50)/100);
\r
294 r[i]=r[i].toString(16);
\r
295 if(r[i].length==1) r[i]="0"+r[i];
\r
297 return("#"+r[0]+r[1]+r[2]);
\r