doc/changes.txt doc/demo/cristina_zorrilla/Screenshot.png doc/demo/cristina_zorrilla/contact.html doc/demo/cristina_zorrilla/design_gimp_slice.png doc/demo/cristina_zorrilla/elastic doc/demo/cristina_zorrilla/home.html doc/demo/cristina_zorrilla/images/blue_arrow.jpg doc/demo/cristina_zorrilla/images/dark_blue_circle.jpg doc/demo/cristina_zorrilla/images/image_contact.jpg doc/demo/cristina_zorrilla/images/image_exhibitions.jpg doc/demo/cristina_zorrilla/images/image_home.jpg doc/demo/cristina_zorrilla/images/image_main.jpg doc/demo/cristina_zorrilla/images/image_workshops.jpg doc/demo/cristina_zorrilla/images/light_blue_circle.jpg doc/demo/cristina_zorrilla/images/line_background.jpg doc/demo/cristina_zorrilla/images/logo.jpg doc/demo/cristina_zorrilla/images/logo_main.jpg doc/demo/cristina_zorrilla/images/mailto_button.jpg doc/demo/cristina_zorrilla/images/navigation_contact.jpg doc/demo/cristina_zorrilla/images/navigation_contact_current.jpg doc/demo/cristina_zorrilla/images/navigation_exhibitions.jpg doc/demo/cristina_zorrilla/images/navigation_exhibitions_current.jpg doc/demo/cristina_zorrilla/images/navigation_home.jpg doc/demo/cristina_zorrilla/images/navigation_home_current.jpg doc/demo/cristina_zorrilla/images/navigation_workshops.jpg doc/demo/cristina_zorrilla/images/navigation_workshops_current.jpg doc/demo/cristina_zorrilla/images/page_background.jpg doc/demo/cristina_zorrilla/images/slider_left_arrow.jpg doc/demo/cristina_zorrilla/images/slider_right_arrow.jpg doc/demo/cristina_zorrilla/index.html doc/demo/cristina_zorrilla/inicio.xcf doc/demo/cristina_zorrilla/pages.xcf doc/demo/cristina_zorrilla/skin.css doc/demo/cristina_zorrilla/skin.js doc/demo/cristina_zorrilla/uploads/bull.jpg doc/demo/cristina_zorrilla/uploads/cheetah.jpg doc/demo/cristina_zorrilla/uploads/hippo.jpg doc/demo/cristina_zorrilla/uploads/hippo_med.jpg doc/demo/cristina_zorrilla/uploads/mandril.jpg doc/demo/cristina_zorrilla/uploads/tiger.jpg doc/demo/elastic_vs_yui/elastic_vs_yui.html doc/demo/elastic_vs_yui/elastic_vs_yui_content.html doc/nesting.txt doc/test/test-columns.html doc/test/test_adaptive.html doc/test/test_adaptive_final.html doc/test/test_layouts.html jquery.js lib/css/base.css lib/css/class.css lib/css/fonts.css lib/css/grid.css lib/css/print.css lib/css/reset.css lib/js/elastic.js lib/js/jquery.ui.js @@ -9,7 +9,6 @@ Elastic is organized in several files * *reset.css*: unifies the css of the browser * *base.css*: builds a base to work on * *fonts.css*: sets the font base -* *class.css*: CSS Classes for engine.js * *grid.css*: layout components * *print.css*: layout printing components * *jquery.js*: jquery to simplify the creation of helpers @@ -37,34 +36,29 @@ elastic's engine.js provides a predictable way of rounding letting you know what h4. The order is this: -* fixed-column never modified -* column (last) modified -* elastic-column (last) +* .column.fixed never modified +* .column (last) modified +* .column.elastic (last) h4. Engine performance -We are currently releasing a working version of the engine in order to spot bugs on design and on implementation -next milestone will be to improve speed of this engine. +Since version 1.0 we have been working in making engine faster, and will continue to improve +the speed of the engine, but from version 1.0 to 2.0 we have gained around a 60% of speed +some new features have been added, so if you use them all, you may get a lil slower than 1.0 +but hey engine is doing more things. <pre><code class="html"> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> - <link rel="stylesheet" type="text/css" media="all" href="reset.css" /> - <link rel="stylesheet" type="text/css" media="all" href="base.css" /> - <link rel="stylesheet" type="text/css" media="all" href="fonts.css" /> - <link rel="stylesheet" type="text/css" media="all" href="class.css" /> - <link rel="stylesheet" type="text/css" media="all" href="grid.css" /> - <link rel="stylesheet" type="text/css" media="print" href="print.css" /> + <link rel="stylesheet" type="text/css" media="print" href="elastic.css" /> <script src="jquery.js" type="text/javascript" language="javascript" charset="utf-8"></script> <script src="engine.js" type="text/javascript" language="javascript" charset="utf-8"></script> </head> <body> - <div class="unit three-columns"> - <div class="column">first column content</div> - <div class="column">second column content</div> - <div class="column">third column content</div> + <div class="unit"> + content </div> </body> </html> @@ -83,7 +77,7 @@ h3. Make a layout based on 1 column h3. Make a layout based on 2 columns <pre><code class="html"> -<div class="unit two-columns"> +<div class="unit on-2 columns"> <div class="column">first column content</div> <div class="column">second column content</div> </div> @@ -92,7 +86,7 @@ h3. Make a layout based on 2 columns h3. Make a layout based on 3 columns <pre><code class="html"> -<div class="unit three-columns"> +<div class="unit on-3 columns"> <div class="column">first column content</div> <div class="column">second column content</div> <div class="column">third column content</div> @@ -102,7 +96,7 @@ h3. Make a layout based on 3 columns h3. Make a layout based on 4 columns <pre><code class="html"> -<div class="unit four-columns"> +<div class="unit on-4 columns"> <div class="column">first column content</div> <div class="column">second column content</div> <div class="column">third column content</div> @@ -113,7 +107,7 @@ h3. Make a layout based on 4 columns h3. But i really really need more columns <pre><code class="html"> -<div class="unit auto-columns"> +<div class="unit columns"> <div class="column">column content</div> <div class="column">column content</div> <div class="column">column content</div> @@ -129,12 +123,12 @@ h3. This things is like tables, can i have span? Well you can, but currently not for auto-columns. and it is called span <pre><code class="html"> -<div class="unit four-columns"> +<div class="unit on-4 columns"> <div class="column">first column content</div> <div class="column">second column content</div> <div class="column span-2">third column content spawned as a double column</div> </div> -<div class="unit four-columns"> +<div class="unit on-4 columns"> <div class="column">first column content</div> <div class="column span-3">second column content spawned as a triple column</div> </div> @@ -165,11 +159,11 @@ div.layout h3. Make a layout based on 2 columns and a 3 columns below that <pre><code class="html"> -<div class="unit two-columns"> +<div class="unit on-2 columns"> <div class="column">first column content</div> <div class="column">second column content</div> </div> -<div class="unit three-columns"> +<div class="unit on-3 columns"> <div class="column">first column content</div> <div class="column">second column content</div> <div class="column">third column content</div> @@ -199,33 +193,33 @@ h2. Advanced layout features h3. Make a column fixed and the other elastic <pre><code class="html"> -<div class="unit two-columns"> - <div class="fixed-column" style="width:250px;">first column content</div> - <div class="elastic-column">second column content</div> +<div class="unit columns"> + <div class="fixed column" style="width:250px;">first column content</div> + <div class="elastic column">second column content</div> </div> -<div class="unit two-columns"> - <div class="elastic-column">second column content</div> - <div class="fixed-column" style="width:250px;">second column content</div> +<div class="unit columns"> + <div class="elastic column">second column content</div> + <div class="fixed column" style="width:250px;">second column content</div> </div> </code></pre> h3. How about i dont know the width of fixed-column <pre><code class="html"> -<div class="unit two-columns"> - <div class="fixed-column">let elastic get it</div> - <div class="elastic-column">second column content</div> +<div class="unit columns"> + <div class="fixed column">let elastic get it</div> + <div class="elastic column">second column content</div> </div> -<div class="unit two-columns"> - <div class="elastic-column">second column content</div> - <div class="fixed-column" style="width:250px;">second column content</div> +<div class="unit columns"> + <div class="elastic column">second column content</div> + <div class="fixed column" style="width:250px;">second column content</div> </div> </code></pre> h3. How about a 3x3 layout <pre><code class="html"> -<div class="unit two-columns"> +<div class="unit columns on-3"> <div class="column"> column </div> @@ -247,7 +241,7 @@ h3. How about a 3x3 layout h3. Make columns of same height <pre><code class="html"> -<div class="unit two-columns same-height"> +<div class="unit columns same-height"> <div class="column">first column content</div> <div class="column">second column content</div> </div> @@ -256,7 +250,7 @@ h3. Make columns of same height h3. Centering on the vertical axis <pre><code class="html"> -<div class="unit two-columns same-height"> +<div class="unit columns same-height"> <div class="column" style="height:50px;">first column content</div> <div class="column"> <div class="container vertical-center" style=""> @@ -342,11 +336,7 @@ h3. Telling elastic to refresh calculations <pre><code class="html"> <script type="text/javascript" language="javascript" charset="utf-8"> // direct call - Elastic.refresh(); -</script> -<script type="text/javascript" language="javascript" charset="utf-8"> - // jquery event invocation - $(document).trigger('elastic'); + Elastic.refresh(context); </script> </code></pre> @@ -361,4 +351,6 @@ h2. Contributors Fernando Trasviña (Lead Developer) trasvina [at] gmail -Sergio de la Garza (Core Member Lead) sergio.delagarza [at] gmail +Sergio de la Garza (Core Member Lead) sergio.delagarza [at] gmail + +Javier Ayala (Website) jav.forza [at] gmail README.textile @@ -1 +1,14 @@ -html{color:#000;background:#FFF;}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0;}table{border-collapse:collapse;border-spacing:0;}fieldset,img{border:0;}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}li{list-style:none;}caption,th{text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}q:before,q:after{content:'';}abbr,acronym{border:0;font-variant:normal;}sup{vertical-align:text-top;}sub{vertical-align:text-bottom;}input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;}input,textarea,select{*font-size:100%;}legend{color:#000;}h1{font-size:138.5%;}h2{font-size:123.1%;}h3{font-size:108%;}h1,h2,h3{margin:1em 0;}h1,h2,h3,h4,h5,h6,strong{font-weight:bold;}abbr,acronym{border-bottom:1px dotted #000;cursor:help;}em{font-style:italic;}blockquote,ul,ol,dl{margin:1em;}ol,ul,dl{margin-left:2em;}ol li{list-style:decimal outside;}ul li{list-style:disc outside;}dl dd{margin-left:1em;}th{font-weight:bold;text-align:center;}caption{margin-bottom:.5em;text-align:center;}p,fieldset,table,pre{margin-bottom:1em;}input[type=text],input[type=password],textarea{width:12.25em;*width:11.9em;}body{font:13px/1.231 arial,helvetica,clean,sans-serif;*font-size:small;*font:x-small;}select,input,button,textarea{font:99% arial,helvetica,clean,sans-serif;}table{font-size:inherit;font:100%;}pre,code,kbd,samp,tt{font-family:monospace;*font-size:108%;}.elastic-height{height:0;}.horizontal-center{margin:0 auto;}.center{margin:0 auto;}.unit:after,.container:after,.column:after,.fixed-column:after,.elastic-column:after,.clearfix:after{content:" ";display:block;height:0;clear:both;visibility:hidden;}.unit,.container,.column,.fixed-column,.elastic-column,.clearfix{*zoom:1;*display:inline-block;}.two-columns>.column,.two-columns>.container>.column{width:50%;}.column,.elastic-column,.fixed-column{float:left;}.three-columns>.column,.three-columns>.container>.column{width:33.33%;}.three-columns>.span-2,.three-columns>.container>.span-2{width:66.66%;}.four-columns>.column,.four-columns>.container>.column{width:25%;}.four-columns>.span-2,.four-columns>.container>.span-2{width:50%;}.four-columns>.span-3,.four-columns>.container>.span-3{width:75%;} \ No newline at end of file +/* +Copyright (c) 2008, Yahoo! Inc. All rights reserved. +Code licensed under the BSD License: +http://developer.yahoo.net/yui/license.txt +version: 3.0.0pr1 +*/ +html{color:#000;background:#FFF;}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td {margin:0;padding:0;}table {border-collapse:collapse;border-spacing:0;}fieldset,img {border:0;}address,caption,cite,code,dfn,em,strong,th,var {font-style:normal;font-weight:normal;}li {list-style:none;}caption,th {text-align:left;}h1,h2,h3,h4,h5,h6 {font-size:100%;font-weight:normal;}q:before,q:after {content:'';}abbr,acronym {border:0;font-variant:normal;}sup {vertical-align:text-top;}sub {vertical-align:text-bottom;}input,textarea,select {font-family:inherit;font-size:inherit;font-weight:inherit;}input,textarea,select {*font-size:100%;}legend {color:#000;}h1 {font-size : 138.5%; }h2 {font-size : 123.1%; }h3 {font-size : 108%; }h1,h2,h3 {margin : 1em 0;}h1,h2,h3,h4,h5,h6,strong {font-weight : bold; }abbr,acronym {border-bottom : 1px dotted #000;cursor : help;} em {font-style : italic;}blockquote,ul,ol,dl {margin : 1em;}ol,ul,dl {margin-left : 2em;}ol li {list-style : decimal outside;}ul li {list-style : disc outside;}dl dd {margin-left : 1em;}th {font-weight : bold;text-align : center;}caption {margin-bottom : .5em;text-align : center;}p,fieldset,table,pre {margin-bottom : 1em;}input[type=text],input[type=password],textarea{width : 12.25em;*width : 11.9em;}body {font:13px/1.231 arial,helvetica,clean,sans-serif;*font-size:small;*font:x-small;}select,input,button,textarea {font:99% arial,helvetica,clean,sans-serif;}table {font-size:inherit;font:100%;}pre,code,kbd,samp,tt {font-family:monospace;*font-size:108%;} + +/* +Elastic CSS Framework +Released under the MIT, BSD, and GPL Licenses. +More information http://elasticss.com +*/ +.unit:after,.container:after,.columns:after,.column:after,.clearfix:after{content:" ";display:block;height:0;clear:both;visibility:hidden;}.unit,.container,.columns,.column,.clearfix{display:block;*zoom:1;*display:inline-block;}.full-height{display:block;}.same-height{display:block;}.elastic-height{height:0;}.horizontal-center{margin:0 auto;}.vertical-center{/* margin:auto 0; */display:block;}.center{/* margin:auto */margin:0 auto;}.column{float:left;}.column.final{display:block;}.column.fixed{width:auto;}.column.elastic{display:block;}.inverted>.column,.inverted>.container>.column{float:right;}.on-2.columns>.column:not(.fixed),.on-2.columns>.container>.column:not(.fixed){width:50%;}.on-3.columns>.column:not(.fixed),.on-3.columns>.container>.column:not(.fixed){width:33.33%;}.on-3.columns>.column.span-2,.on-3.columns>.container>.column.span-2{width:66.66%;}.on-4.columns>.column:not(.fixed),.on-4.columns>.container>.column:not(.fixed){width:25%;}.on-4.columns>.column.span-2,.on-4.columns>.container>.column.span-2{width:50%;}.on-4.columns>.column.span-3,.on-4.columns>.container>.column.span-2{width:75%;} production/elastic.css @@ -1 +1,13 @@ -(function(f){var c=function(n,o){if(window.getComputedStyle){return window.getComputedStyle(n,o)}else{return n.currentStyle}};var a=function(n){var o=c(n).width;if(o=="auto"){return f(n).width()}else{return parseFloat(o)}};window.Elastic=function e(s){var P,O,M,K,E,R,t,F;var G,x,A,Q,z,r,w,S,D,v,n,J,C,H;var L,T,u,N,p,q,B,y,o;var U=/(^|\s+)group\-by\-(\d+)(\s+|$)/;var I=/(^|\s+)span\-(\d+)(\s+|$)/;w=[];D=v=0;G=f.find(".two-columns, .three-columns, .four-columns, .auto-columns",s);for(P=0,E=G.length;P<E;P++){x=G[P];A=x.className;if(A.indexOf("two-columns")>-1){S=2}else{if(A.indexOf("three-columns")>-1){S=3}else{if(A.indexOf("four-columns")>-1){S=4}else{if(A.indexOf("auto-columns")>-1){S=f.find("> .column, > .container > .column",x).length;if(A.indexOf("group-by-")>-1&&U.test(A)){S=Number(RegExp.$2)}}else{continue}}}}x=f.find("> .container",G[P])[0]||x;n=Math.round(x.clientWidth/S);Q=f.find("> .column, > .fixed-column, > .elastic-column",x);for(O=0,R=Q.length;O<R;O++){L=[];u=[];q=[];C=H=T=B=0;z=Q[O];r=z.className;J=1;if(r.indexOf("span-")>-1&&I.test(r)){J=Number(RegExp.$2)}z.escol=J;v+=J;if(v==S||O==(R-1)){w.push(z);D=0;C=1}else{if(v<S){w.push(z);D=v}else{if(v>S){D=J;C=1;H=1}}}if(C){for(M=0,t=w.length;M<t;M++){y=w[M];o=y.className;if(o.indexOf("fixed-")>-1){L.push(y);T+=a(y)}else{if(o.indexOf("elastic-")>-1){u.push(y)}else{q.push(y);y.style.width=(n*y.escol)+"px";B+=a(y)}}}F=u.length;if(F>0){p=Math.round((a(x)-(B+T))/F);N=p*F;if(F>1){for(K=0;K<F;K++){u[K].style.width=p+"px"}}u[F-1].style.width=(a(x)-(B+T+(N-p)))+"px"}else{if(q.length>0&&v==S){q[q.length-1].style.width=(a(x)-((B-a(q[q.length-1]))+T))+"px"}}w=[];v=0}if(H){w=[z];v=J}}}for(P in e.helpers){if(e.helpers.hasOwnProperty(P)){e.helpers[P](s)}}};var e=window.Elastic;e.version="1.2.5";e.reset=function k(o){var u=jQuery(document);u.trigger("elastic:beforeReset");var s,v,x,t,q,n,r;t=f.find(".same-height > *, .full-height, .equalized-height > *, .elastic-height",o);for(s=0,q=t.length;s<q;s++){t[s].style.height=""}n=f.find(".vertical-center, .center, .bottom",o);for(s=0,r=n.length;s<r;s++){n[s].parentNode.style.paddingTop=""}v=f(".column, .elastic-column",o);for(s=0,x=v.length;s<x;s++){v[s].parentNode.style.width=""}u.trigger("elastic:reset")};e.refresh=function g(n){var o=jQuery(document);o.trigger("elastic:beforeRefresh");e.reset(n);e(n);o.trigger("elastic:refresh")};e.configuration={refreshOnResize:true};e.helpers={"full-width":function i(n){f(".full-width",n).each(function(){var o=f(this);o.width(f(this.parentNode).width()-(o.outerWidth(true)-o.width()))})},"same-height":function j(n){f(".same-height",n).each(function(){var p=f(this);var o=p.outerHeight(true)-(p.outerHeight(true)-p.height());f("> *",this).each(function(){f(this).css("height",o)})})},"equalized-height":function d(n){f(".equalized-height",n).each(function(){var o=f("> .column, > .container > .column",this);var p=0;o.each(function(){var q=f(this).outerHeight(true);p=(p>q)?p:q}).each(function(){f(this).css("height",p)})})},"full-height":function b(n){f(".full-height",n).each(function(){var o=f(this);o.css("height",f(this.parentNode).height()-(o.outerHeight(true)-o.height()))})},"elastic-height":function h(n){f(".elastic-height",n).each(function(){var p=f(this);var o=0;f("> *:not(.elastic-height)",this.parentNode).each(function(){o+=f(this).outerHeight(true)});p.css("height",Math.round(p.parent().height()-o));e.refresh(this)})},center:function m(n){f(".vertical-center, .center",n).each(function(){var o=f(this.parentNode);var p=Math.round((o.height()-f(this).outerHeight(true))/2);o.css({paddingTop:p+"px",height:(o.css("height"))?(o.outerHeight()-p):""})})},bottom:function l(n){f(".bottom",n).each(function(){var o=f(this.parentNode);var p=Math.round(o.height()-f(this).outerHeight(true));o.css({paddingTop:p+"px",height:(o.css("height"))?(o.outerHeight()-p):""})})}}})(jQuery);jQuery(function(){var c=jQuery(document);c.trigger("elastic:beforeInitialize");var a=document.body.clientWidth;Elastic();if(a!=document.body.clientWidth){Elastic.refresh()}jQuery(window).bind("resize",function b(){if(Elastic.configuration.refreshOnResize){Elastic.refresh()}});c.bind("elastic",Elastic.refresh);c.trigger("elastic:initialize")}); \ No newline at end of file +/* + Elastic CSS Framework + Released under the MIT, BSD, and GPL Licenses. + More information http://elasticss.com + + Elastic Engine + + @author Fernando Trasviña + @core team Sergio de la Garza, Javier Ayala + @copyright 2009 Elastic CSS framework + @version 2.0 +*/ +(function ($){var CStyle=function (element,pseudoElement){if(window.getComputedStyle){return window.getComputedStyle(element,pseudoElement);}else{return element.currentStyle;}};var width=function (element){var width=CStyle(element).width;if(width=='auto'){return $(element).width();}else{return parseFloat(width);}};window.Elastic=function Elastic(context){var i,j,k,l,il,jl,kl,ll,econs,econ,econw,econclass,ecols,ecol,ecolclass,eg,egml,egcl,egnl,ecw,escol,rp,ig,efcs,efcsw,eecs,eecsw,eecw,ecs,ecsw,ec,ecclass,adaptive,ecolminw,ecolmaxw,egreg=/(^|\s+)on\-(\d+)(\s+|$)/,esreg=/(^|\s+)span\-(\d+)(\s+|$)/,eareg=/(^|\s+)adaptive\-(\d+)\-(\d+)(\s+|$)/;eg=[];egcl=egnl=0;econs=$.find('.columns',context);for(i=0,il=econs.length;i<il;i++){econ=econs[i];econclass=econ.className;if(econclass.indexOf('on-')>-1&&egreg.test(econclass)){egml=Number(RegExp.$2);}else{egml=$.find('>.column,>.container>.column',econ).length;}econ=$.find('>.container',econ)[0]||econ;econw=width(econ);ecw=Math.round(econw/egml);if(econclass.indexOf('adaptive-')>-1&&eareg.test(econclass)){ecolminw=Number(RegExp.$2);ecolmaxw=Number(RegExp.$3);if(ecw>ecolmaxw){while(ecw>ecolmaxw){egml=egml+1;ecw=Math.round(econw/egml);}}else if(ecw<ecolminw){while(ecw<ecolminw){egml=egml-1;ecw=Math.round(econw/egml);}}}ecols=$.find('>.column',econ);for(j=0,jl=ecols.length;j<jl;j++){efcs=[],eecs=[],ecs=[];rp=ig=efcsw=ecsw=0;ecol=ecols[j];ecolclass=ecol.className;escol=1;if(ecolclass.indexOf('span-')>-1&&esreg.test(ecolclass)){escol=Number(RegExp.$2);}ecol.escol=((escol<=egml)?escol:1);egnl+=escol;if(egnl==egml||j==(jl-1)||ecolclass.indexOf('final')>-1){eg.push(ecol);egcl=0;rp=1;}else if(egnl<egml){eg.push(ecol);egcl=egnl;}else if(egnl>egml){egcl=escol;rp=1;ig=1;}if(rp){for(k=0,kl=eg.length;k<kl;k++){ec=eg[k];ecclass=ec.className;if(ecclass.indexOf('fixed')>-1){efcs.push(ec);efcsw+=width(ec);}else if(ecclass.indexOf('elastic')>-1){eecs.push(ec);}else{ecs.push(ec);ec.style.width=(ecw*ec.escol)+'px';ecsw+=width(ec);}}ll=eecs.length;if(ll>0){eecw=Math.round((width(econ)-(ecsw+efcsw))/ll);eecsw=eecw*ll;if(ll>1){for(l=0;l<ll;l++){eecs[l].style.width=eecw+'px';}}eecs[ll-1].style.width=(width(econ)-(ecsw+efcsw+(eecsw-eecw)))+'px';}else if(ecol.escol==egml&&efcs.length==0){ecol.style.width=width(econ)+'px';}else if(ecs.length>0&&efcs.length==0&&egnl==egml){ecs[ecs.length-1].style.width=(width(econ)-((ecsw-width(ecs[ecs.length-1]))+efcsw))+'px';}else if(egnl<egml&&ecolclass.indexOf('final')>-1){ecol.style['margin'+((econclass.indexOf('inverted')>-1)?'Left':'Right')]=(width(econ)-ecsw-efcsw)+'px';}eg=[];egnl=0;}if(ig){eg=[ecol];egnl=escol;}}}for(i in Elastic.helpers){if(Elastic.helpers.hasOwnProperty(i)){Elastic.helpers[i](context);}}};var Elastic=window.Elastic;Elastic.version='2.0';Elastic.reset=function Elastic_reset(context){var doc=$(document);doc.trigger('elastic:beforeReset');var i,w,wl,h,hl,p,pl,m,ml;h=$.find('.same-height>*,.full-height,.elastic-height',context);for(i=0,hl=h.length;i<hl;i++){h[i].style.height='';}p=$.find('.vertical-center,.center,.bottom',context);for(i=0,pl=p.length;i<pl;i++){p[i].parentNode.style.paddingTop='';}w=$.find('.column:not(.fixed),.full-width',context);for(i=0,wl=w.length;i<wl;i++){w[i].style.width='';}m=$.find('.column.last',context);for(i=0,ml=m.length;i<ml;i++){m[i].style.marginLeft='';m[i].style.marginRight='';}doc.trigger('elastic:reset');};Elastic.refresh=function Elastic_refresh(context){var doc=$(document);doc.trigger('elastic:beforeRefresh');Elastic.reset(context);Elastic(context);doc.trigger('elastic:refresh');};Elastic.configuration={refreshOnResize:true};Elastic.helpers={'full-width':function Elastic_helper_fullWidth(context){var i,$el;var els=$.find('.full-width',context);var elsl=els.length;for(i=0;i<elsl;i++){$el=$(els[i]);$el.width($el.parent().width()-($el.outerWidth(true)-$el.width()));}},'same-height':function Elastic_helper_sameHeight(context){$('.same-height',context).each(function (){var columns=$('>*',this);var maxHeight=0;columns.each(function (){var currentHeight=$(this).outerHeight(true);maxHeight=(maxHeight>currentHeight)?maxHeight:currentHeight;}).each(function (){$(this).css('height',maxHeight);});});},'full-height':function Elastic_helper_fullHeight(context){$('.full-height',context).each(function (){var _this=$(this);_this.css('height',$(this.parentNode).height()-(_this.outerHeight(true)-_this.height()));});},'elastic-height':function Elastic_helper_elasticHeight(context){$('.elastic-height',context).each(function (){var _this=$(this);var h=0;$('>*:not(.elastic-height)',this.parentNode).each(function (){h+=$(this).outerHeight(true);});_this.css('height',Math.round(_this.parent().height()-h));Elastic.refresh(this);});},'center':function Elastic_helper_center(context){$('.vertical-center,.center',context).each(function (){var parentNode=$(this.parentNode);var paddingTop=Math.round((parentNode.height()-$(this).outerHeight(true))/2);parentNode.css({paddingTop:paddingTop+'px',height:(parentNode.css('height'))?(parentNode.outerHeight()-paddingTop):''});});},'bottom':function Elastic_helper_bottom(context){$('.bottom',context).each(function (){var parentNode=$(this.parentNode);var paddingTop=Math.round(parentNode.height()-$(this).outerHeight(true));parentNode.css({paddingTop:paddingTop+'px',height:(parentNode.css('height'))?(parentNode.outerHeight()-paddingTop):''});});}};/*ElasticLayouts*/$(document).bind('elastic:beforeInitialize',function (){var r=/(^|\s+)display\s+([\w\_\-\d]+)(\s+|$)/;$('.display').each(function Elastic_layout(){r.test(this.className);var c='.position-'+RegExp.$2;$(c).removeClass(c).appendTo(this);});});})(jQuery);jQuery(window).bind('load',function (){var doc=jQuery(document);var iw=document.body.clientWidth;doc.trigger('elastic:beforeInitialize');Elastic();if(iw!=document.body.clientWidth){Elastic.refresh();}jQuery(window).bind('resize',function Elastic_resizeHandler(){if(Elastic.configuration.refreshOnResize){Elastic.refresh();}});doc.bind('elastic',Elastic.refresh);doc.trigger('elastic:initialize');}); production/elastic.js Capfile base.css class.css config/deploy.rb doc/SyntaxHighlighter/Scripts/clipboard.swf doc/SyntaxHighlighter/Scripts/shBrushCSharp.js doc/SyntaxHighlighter/Scripts/shBrushCpp.js doc/SyntaxHighlighter/Scripts/shBrushCss.js doc/SyntaxHighlighter/Scripts/shBrushDelphi.js doc/SyntaxHighlighter/Scripts/shBrushJScript.js doc/SyntaxHighlighter/Scripts/shBrushJava.js doc/SyntaxHighlighter/Scripts/shBrushPhp.js doc/SyntaxHighlighter/Scripts/shBrushPython.js doc/SyntaxHighlighter/Scripts/shBrushRuby.js doc/SyntaxHighlighter/Scripts/shBrushSql.js doc/SyntaxHighlighter/Scripts/shBrushVb.js doc/SyntaxHighlighter/Scripts/shBrushXml.js doc/SyntaxHighlighter/Scripts/shCore.js doc/SyntaxHighlighter/Styles/SyntaxHighlighter.css doc/SyntaxHighlighter/Uncompressed/shBrushCSharp.js doc/SyntaxHighlighter/Uncompressed/shBrushCpp.js doc/SyntaxHighlighter/Uncompressed/shBrushCss.js doc/SyntaxHighlighter/Uncompressed/shBrushDelphi.js doc/SyntaxHighlighter/Uncompressed/shBrushJScript.js doc/SyntaxHighlighter/Uncompressed/shBrushJava.js doc/SyntaxHighlighter/Uncompressed/shBrushPhp.js doc/SyntaxHighlighter/Uncompressed/shBrushPython.js doc/SyntaxHighlighter/Uncompressed/shBrushRuby.js doc/SyntaxHighlighter/Uncompressed/shBrushSql.js doc/SyntaxHighlighter/Uncompressed/shBrushVb.js doc/SyntaxHighlighter/Uncompressed/shBrushXml.js doc/SyntaxHighlighter/Uncompressed/shCore.js doc/documentation.html doc/grid_system.html doc/img/logo.png doc/img/ninja.png doc/index.html doc/skin.css doc/src/elastic.svg doc/src/logo.svg fonts.css grid.css helpers_jquery/engine.js helpers_jquery/extensions.js helpers_jquery/jquery.js helpers_jquery/ui.js print.css reset.css test/elastic-side-cols.html test/getElementsByTagName test/test.html 7aa597848abe42c49564948a32d829b5756d63d5 fernando trasvina fernando@chu-linux.gateway.2wire.net http://github.com/azendal/elastic/commit/a48b1f96e4364e224f86f35b068746dbd6790d0d a48b1f96e4364e224f86f35b068746dbd6790d0d

2009-06-23T12:28:25-07:00

Elastic 2.0 RC 6a91ccfd8f8e865ddc1d33ee1c7ba646ce808e8a fernando trasvina fernando@chu-linux.gateway.2wire.net