flexlayout-rails 0.1.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- data/.document +5 -0
- data/.rspec +1 -0
- data/Gemfile +11 -0
- data/Gemfile.lock +37 -0
- data/LICENSE.txt +20 -0
- data/README.md +140 -0
- data/Rakefile +49 -0
- data/VERSION +1 -0
- data/flexlayout-rails.gemspec +79 -0
- data/lib/flexlayout-rails.rb +6 -0
- data/spec/regions/img/lorem-ipsum-logo.jpeg +0 -0
- data/spec/regions/index.html +120 -0
- data/spec/regions/js/detection.js +9 -0
- data/spec/regions/js/layout.js +43 -0
- data/spec/regions/js/setup.js +0 -0
- data/spec/spec_helper.rb +12 -0
- data/vendor/assets/javascripts/feature-detects/cssregions.js +6 -0
- data/vendor/assets/javascripts/flexie.js +2039 -0
- data/vendor/assets/javascripts/flexie.min.js +1 -0
- data/vendor/assets/javascripts/jquery.lettering.js +66 -0
- data/vendor/assets/javascripts/jquery.lettering.min.js +13 -0
- data/vendor/assets/javascripts/regions.jquery.js +204 -0
- data/vendor/assets/javascripts/regions.jquery.min.js +7 -0
- data/vendor/assets/javascripts/template_layout/jquery/jquery.tpl_layout1.1.6.js +1256 -0
- data/vendor/assets/javascripts/template_layout/jquery/jquery.tpl_layout1.1.6.min.js +1 -0
- data/vendor/assets/javascripts/template_layout/templateLayout.compiler.js +1049 -0
- data/vendor/assets/javascripts/template_layout/templateLayout.generator.js +615 -0
- data/vendor/assets/javascripts/template_layout/templateLayout.js +339 -0
- metadata +158 -0
@@ -0,0 +1 @@
|
|
1
|
+
var Flexie=(function(win,doc){var FLX={},FLX_DOM_ID=0,FLX_DOM_ATTR="data-flexie-id",FLX_PARENT_ATTR="data-flexie-parent",SUPPORT,ENGINE,ENGINES={"NW":{s:"*.Dom.select"},"DOMAssistant":{s:"*.$",m:"*.DOMReady"},"Prototype":{s:"$$",m:"document.observe",p:"dom:loaded",c:"document"},"YAHOO":{s:"*.util.Selector.query",m:"*.util.Event.onDOMReady",c:"*.util.Event"},"MooTools":{s:"$$",m:"window.addEvent",p:"domready"},"Sizzle":{s:"*"},"jQuery":{s:"*",m:"*(document).ready"},"dojo":{s:"*.query",m:"*.addOnLoad"}},LIBRARY,PIXEL=/^-?\d+(?:px)?$/i,NUMBER=/^-?\d/,SIZES=/width|height|margin|padding|border/,MSIE=/(msie) ([\w.]+)/,WHITESPACE_CHARACTERS=/\t|\n|\r/g,RESTRICTIVE_PROPERTIES=/^max\-([a-z]+)/,PROTOCOL=/^https?:\/\//i,LEADINGTRIM=/^\s\s*/,TRAILINGTRIM=/\s\s*$/,ONLY_WHITESPACE=/^\s*$/,CSS_SELECTOR=/\s?(\#|\.|\[|\:(\:)?[^first\-(line|letter)|before|after]+)/g,EMPTY_STRING="",SPACE_STRING=" ",PLACEHOLDER_STRING="$1",PADDING_RIGHT="paddingRight",PADDING_BOTTOM="paddingBottom",PADDING_LEFT="paddingLeft",PADDING_TOP="paddingTop",BORDER_RIGHT="borderRightWidth",BORDER_BOTTOM="borderBottomWidth",BORDER_LEFT="borderLeftWidth",BORDER_TOP="borderTopWidth",HORIZONTAL="horizontal",VERTICAL="vertical",INLINE_AXIS="inline-axis",BLOCK_AXIS="block-axis",INHERIT="inherit",LEFT="left",END_MUSTACHE="}",PREFIXES=" -o- -moz- -ms- -webkit- -khtml- ".split(SPACE_STRING),DEFAULTS={orient:HORIZONTAL,align:"stretch",direction:INHERIT,pack:"start"},FLEX_BOXES=[],POSSIBLE_FLEX_CHILDREN=[],DOM_ORDERED,RESIZE_LISTENER,TRUE=true,FALSE=false,NULL=null,UNDEFINED,BROWSER={IE:(function(){var ie,ua=win.navigator.userAgent,match=(MSIE).exec(ua.toLowerCase());if(match){ie=parseInt(match[2],10)}return ie}())},selectivizrEngine;function trim(string){if(string){string=string.replace(LEADINGTRIM,EMPTY_STRING).replace(TRAILINGTRIM,EMPTY_STRING)}return string}function determineSelectorMethod(){var engines=ENGINES,method,engine,obj;for(engine in engines){if(engines.hasOwnProperty(engine)){obj=engines[engine];if(win[engine]&&!method){method=eval(obj.s.replace("*",engine));if(method){ENGINE=engine;break}}}}return method}function addEvent(type,func){type="on"+type;var oldevent=win[type];if(typeof win[type]!=="function"){win[type]=func}else{win[type]=function(){if(oldevent){oldevent()}func()}}}function attachLoadMethod(handler){if(!ENGINE){LIBRARY=determineSelectorMethod()}var engines=ENGINES,method,caller,args,engine,obj;for(engine in engines){if(engines.hasOwnProperty(engine)){obj=engines[engine];if(win[engine]&&!method&&obj.m){method=eval(obj.m.replace("*",engine));caller=obj.c?eval(obj.c.replace("*",engine)):win;args=[];if(method&&caller){if(obj.p){args.push(obj.p)}args.push(handler);method.apply(caller,args);break}}}}if(!method){addEvent("load",handler)}}function buildSelector(node){var selector=node.nodeName.toLowerCase();if(node.id){selector+="#"+node.id}else if(node.FLX_DOM_ID){selector+="["+FLX_DOM_ATTR+"='"+node.FLX_DOM_ID+"']"}return selector}function setFlexieId(node){if(!node.FLX_DOM_ID){FLX_DOM_ID=(FLX_DOM_ID+1);node.FLX_DOM_ID=FLX_DOM_ID;node.setAttribute(FLX_DOM_ATTR,node.FLX_DOM_ID)}}function buildSelectorTree(text){var rules=[],ruletext,rule,match,selector,proptext,splitprop,properties,i,j,x;text=text.replace(WHITESPACE_CHARACTERS,EMPTY_STRING);text=text.replace(/\s?(\{|\:|\})\s?/g,PLACEHOLDER_STRING);ruletext=text.split(END_MUSTACHE);for(i in ruletext){if(ruletext.hasOwnProperty(i)){text=ruletext[i];if(text){rule=[text,END_MUSTACHE].join(EMPTY_STRING);match=(/(\@media[^\{]+\{)?(.*)\{(.*)\}/).exec(rule);if(match&&match[3]){selector=match[2];proptext=match[3].split(";");properties=[];for(j in proptext){if(proptext.hasOwnProperty(j)){x=proptext[j];splitprop=x.split(":");if(splitprop.length&&splitprop[1]){properties.push({property:splitprop[0],value:splitprop[1]})}}}if(selector&&properties.length){rules.push({selector:selector,properties:properties})}}}}}return rules}function findFlexboxElements(rules){var selectors,properties,property,value,shortProp,selectorSplit=/\s?,\s?/,createUniqueObject,addRules,key,uniqueChildren={},uniqueBoxes={},i,j,rule,k,l,selector,m,n,prop;createUniqueObject=function(selector,rules,prop,value){var unique,i,j,rule;unique={selector:trim(selector),properties:[]};for(i=0,j=rules.properties.length;i<j;i++){rule=rules.properties[i];unique.properties.push({property:trim(rule.property),value:trim(rule.value)})}if(prop&&value){unique[prop]=value}return unique};addRules=function(selector,rules,prop,value){var box=(prop&&value)?uniqueChildren[selector]:uniqueBoxes[selector],exists,x,i,j,rule,k,l;if(box){for(i=0,j=rules.properties.length;i<j;i++){rule=rules.properties[i];for(k=0,l=box.properties.length;k<l;k++){x=box.properties[k];if(rule.property===x.property){exists=k;return false}}if(exists){box.properties[exists]=rule}else{box.properties.push(rule)}}if(prop&&value){box[prop]=value}}else{if(prop&&value){uniqueChildren[selector]=createUniqueObject(selector,rules,prop,value)}else{uniqueBoxes[selector]=createUniqueObject(selector,rules,NULL,NULL)}}};for(i=0,j=rules.length;i<j;i++){rule=rules[i];selectors=trim(rule.selector).replace(selectorSplit,",").split(selectorSplit);for(k=0,l=selectors.length;k<l;k++){selector=trim(selectors[k]);properties=rule.properties;for(m=0,n=properties.length;m<n;m++){prop=properties[m];property=trim(prop.property);value=trim(prop.value);if(property){shortProp=property.replace("box-",EMPTY_STRING);switch(shortProp){case"display":if(value==="box"){addRules(selector,rule,NULL,NULL)}break;case"orient":case"align":case"direction":case"pack":addRules(selector,rule,NULL,NULL);break;case"flex":case"flex-group":case"ordinal-group":addRules(selector,rule,shortProp,value);break}}}}}for(key in uniqueBoxes){if(uniqueBoxes.hasOwnProperty(key)){FLEX_BOXES.push(uniqueBoxes[key])}}for(key in uniqueChildren){if(uniqueChildren.hasOwnProperty(key)){POSSIBLE_FLEX_CHILDREN.push(uniqueChildren[key])}}return{boxes:FLEX_BOXES,children:POSSIBLE_FLEX_CHILDREN}}function matchFlexChildren(parent,lib,possibleChildren){var caller,unique,matches=[],i,j,child,k,l,node,key;for(i=0,j=possibleChildren.length;i<j;i++){child=possibleChildren[i];if(child.selector){caller=lib(child.selector);caller=caller[0]?caller:[caller];if(caller[0]){for(k=0,l=caller.length;k<l;k++){node=caller[k];if(node.nodeName!==UNDEFINED){switch(node.nodeName.toLowerCase()){case"script":case"style":case"link":break;default:if(node.parentNode===parent){setFlexieId(node);unique={};for(key in child){if(child.hasOwnProperty(key)){unique[key]=child[key]}}unique.match=node;matches.push(unique)}break}}}}}else{setFlexieId(child);matches.push({match:child,selector:buildSelector(child)})}}return matches}function getParams(params){var key;for(key in params){if(params.hasOwnProperty(key)){params[key]=params[key]||DEFAULTS[key]}}return params}function buildFlexieCall(flexers){var selector,properties,property,value,shortProp,display,orient,align,direction,pack,lib,caller,children,box,params,flexboxes={},match,childMatch,nestedFlexboxes,flexieParentSelector="["+FLX_PARENT_ATTR+"]",i,j,flex,k,l,prop,target,key,m,n,child,o,p,existing;if(!flexers){return}for(i=0,j=flexers.boxes.length;i<j;i++){flex=flexers.boxes[i];flex.selector=trim(flex.selector);selector=flex.selector;properties=flex.properties;display=orient=align=direction=pack=NULL;for(k=0,l=properties.length;k<l;k++){prop=properties[k];property=trim(prop.property);value=trim(prop.value);if(property){shortProp=property.replace("box-",EMPTY_STRING);switch(shortProp){case"display":if(value==="box"){display=value}break;case"orient":orient=value;break;case"align":align=value;break;case"direction":direction=value;break;case"pack":pack=value;break}}}lib=LIBRARY;caller=lib(flex.selector);caller=caller[0]?caller:[caller];for(k=0,l=caller.length;k<l;k++){target=caller[k];if(target.nodeType){setFlexieId(target);children=matchFlexChildren(target,lib,flexers.children);nestedFlexboxes=selector+" "+flexieParentSelector;params={target:target,selector:selector,properties:properties,children:children,display:display,orient:orient,align:align,direction:direction,pack:pack,nested:nestedFlexboxes};match=flexboxes[target.FLX_DOM_ID];if(match){for(key in params){if(params.hasOwnProperty(key)){value=params[key];switch(key){case"selector":if(value&&!(new RegExp(value).test(match[key]))){match[key]+=", "+value}break;case"children":for(m=0,n=params[key].length;m<n;m++){child=params[key][m];childMatch=FALSE;for(o=0,p=match[key].length;o<p;o++){existing=match[key][o];if(child.match.FLX_DOM_ID===existing.match.FLX_DOM_ID){childMatch=TRUE}}if(!childMatch){match[key].push(child)}}break;default:if(value){match[key]=value}break}}}}else{flexboxes[target.FLX_DOM_ID]=getParams(params);flexboxes[target.FLX_DOM_ID].target.setAttribute(FLX_PARENT_ATTR,TRUE)}}}}DOM_ORDERED=LIBRARY(flexieParentSelector);FLEX_BOXES={};for(i=0,j=DOM_ORDERED.length;i<j;i++){target=DOM_ORDERED[i];FLEX_BOXES[target.FLX_DOM_ID]=flexboxes[target.FLX_DOM_ID]}for(key in FLEX_BOXES){if(FLEX_BOXES.hasOwnProperty(key)){flex=FLEX_BOXES[key];if(flex.display==="box"){box=new FLX.box(flex)}}}}function calcPx(element,props,dir){var dim=dir.replace(dir.charAt(0),dir.charAt(0).toUpperCase()),value=element["offset"+dim]||0,i,j,prop;if(value){for(i=0,j=props.length;i<j;i++){prop=parseFloat(element.currentStyle[props[i]]);if(!isNaN(prop)){value-=prop}}}return value}function getTrueValue(element,name){var left,rsLeft,ret=element.currentStyle&&element.currentStyle[name],style=element.style;if(!PIXEL.test(ret)&&NUMBER.test(ret)){left=style.left;rsLeft=element.runtimeStyle.left;element.runtimeStyle.left=element.currentStyle.left;style.left=ret||0;ret=style.pixelLeft+"px";style.left=left||0;element.runtimeStyle.left=rsLeft}return ret}function unAuto(element,prop,name){var props;switch(name){case"width":props=[PADDING_LEFT,PADDING_RIGHT,BORDER_LEFT,BORDER_RIGHT];prop=calcPx(element,props,name);break;case"height":props=[PADDING_TOP,PADDING_BOTTOM,BORDER_TOP,BORDER_BOTTOM];prop=calcPx(element,props,name);break;default:prop=getTrueValue(element,name);break}return prop}function getPixelValue(element,prop,name){if(PIXEL.test(prop)){return prop}if(prop==="auto"||prop==="medium"){prop=unAuto(element,prop,name)}else{prop=getTrueValue(element,name)}return prop}function getComputedStyle(element,property,returnAsInt){var value;if(element===UNDEFINED){return}if(win.getComputedStyle){value=win.getComputedStyle(element,NULL)[property]}else{if(SIZES.test(property)){value=getPixelValue(element,(element&&element.currentStyle)?element.currentStyle[property]:0,property)}else{value=element.currentStyle[property]}}if(returnAsInt){value=parseInt(value,10);if(isNaN(value)){value=0}}return value}function clientWidth(element){return element.innerWidth||element.clientWidth}function clientHeight(element){return element.innerHeight||element.clientHeight}function appendProperty(target,prop,value,prefixName){var cssText=[],i,j,prefix;for(i=0,j=PREFIXES.length;i<j;i++){prefix=PREFIXES[i];cssText.push((prefixName?prefix:EMPTY_STRING)+prop+":"+(!prefixName?prefix:EMPTY_STRING)+value)}target.style.cssText+=cssText.join(";");return target}function appendPixelValue(target,prop,value){var targets=target&&target[0]?target:[target],i,j;for(i=0,j=targets.length;i<j;i++){target=targets[i];if(target&&target.style){target.style[prop]=(value?(value+"px"):EMPTY_STRING)}}}function calculateSpecificity(selector){var selectorGrid,matrix,total,i,j,chunk;selectorGrid=selector.replace(CSS_SELECTOR,function(e,f){return"%"+f}).replace(/\s|\>|\+|\~/g,"%").split(/%/g);matrix={_id:100,_class:10,_tag:1};total=0;for(i=0,j=selectorGrid.length;i<j;i++){chunk=selectorGrid[i];if((/#/).test(chunk)){total+=matrix._id}else if((/\.|\[|\:/).test(chunk)){total+=matrix._class}else if((/[a-zA-Z]+/).test(chunk)){total+=matrix._tag}}return total}function filterDuplicates(matches,children,type){var filteredMatches=[],exists,spec=(type?"ordinal":"flex")+"Specificity",i,j,x,k,l,f;for(i=0,j=matches.length;i<j;i++){x=matches[i];if((!type&&x.flex)||(type&&x["ordinal-group"])){x[spec]=x[spec]||calculateSpecificity(x.selector);exists=FALSE;for(k=0,l=filteredMatches.length;k<l;k++){f=filteredMatches[k];if(f.match===x.match){if(f[spec]<x[spec]){filteredMatches[j]=x}exists=TRUE;return FALSE}}if(!exists){filteredMatches.push(x)}}}return filteredMatches}function createMatchMatrix(matches,children,type){var groups={},keys=[],totalRatio=0,group,order="ordinal-group",BoxOrdinalAttr="data-"+order,i,j,kid,k,l,x,key;matches=filterDuplicates(matches,children,type);for(i=0,j=children.length;i<j;i++){kid=children[i];for(k=0,l=matches.length;k<l;k++){x=matches[k];if(type){group=x[order]||"1";if(x.match===kid){x.match.setAttribute(BoxOrdinalAttr,group);groups[group]=groups[group]||[];groups[group].push(x)}}else{group=x.flex||"0";if(x.match===kid&&(!x[group]||(x[group]&&parseInt(x[group],10)<=1))){totalRatio+=parseInt(group,10);groups[group]=groups[group]||[];groups[group].push(x)}}}if(type&&!kid.getAttribute(BoxOrdinalAttr)){group="1";kid.setAttribute(BoxOrdinalAttr,group);groups[group]=groups[group]||[];groups[group].push({match:kid})}}for(key in groups){if(groups.hasOwnProperty(key)){keys.push(key)}}keys.sort(function(a,b){return b-a});return{keys:keys,groups:groups,total:totalRatio}}function attachResizeListener(construct,params){if(!RESIZE_LISTENER){var storedWidth,storedHeight,currentWidth,currentHeight,docBody=doc.body,docEl=doc.documentElement,resizeTimer,innerWidth="innerWidth",innerHeight="innerHeight",clientWidth="clientWidth",clientHeight="clientHeight";addEvent("resize",function(){if(resizeTimer){window.clearTimeout(resizeTimer)}resizeTimer=window.setTimeout(function(){currentWidth=win[innerWidth]||docEl[innerWidth]||docEl[clientWidth]||docBody[clientWidth];currentHeight=win[innerHeight]||docEl[innerHeight]||docEl[clientHeight]||docBody[clientHeight];if(storedWidth!==currentWidth||storedHeight!==currentHeight){FLX.updateInstance(NULL,NULL);storedWidth=currentWidth;storedHeight=currentHeight}},250)});RESIZE_LISTENER=TRUE}}function cleanPositioningProperties(children){var i,j,kid,w,h;for(i=0,j=children.length;i<j;i++){kid=children[i];w=kid.style.width;h=kid.style.height;kid.style.cssText=EMPTY_STRING;kid.style.width=w;kid.style.height=h}}function sanitizeChildren(target,nodes){var children=[],node,i,j;for(i=0,j=nodes.length;i<j;i++){node=nodes[i];if(node){switch(node.nodeName.toLowerCase()){case"script":case"style":case"link":break;default:if(node.nodeType===1){children.push(node)}else if((node.nodeType===3)&&(node.isElementContentWhitespace||(ONLY_WHITESPACE).test(node.data))){target.removeChild(node);i--}break}}}return children}function parentFlex(target){var totalFlex=0,parent=target.parentNode,obj,matrix,isNested;while(parent.FLX_DOM_ID){if(FLEX_BOXES[parent.FLX_DOM_ID]){obj=FLEX_BOXES[parent.FLX_DOM_ID];matrix=createMatchMatrix(obj.children,sanitizeChildren(parent,parent.childNodes),NULL);totalFlex+=matrix.total;isNested=TRUE}parent=parent.parentNode}return{nested:isNested,flex:totalFlex}}function dimensionValues(target,prop){var parent=target.parentNode,obj,dimension,i,j,rule;if(parent.FLX_DOM_ID){obj=FLEX_BOXES[parent.FLX_DOM_ID];for(i=0,j=obj.properties.length;i<j;i++){rule=obj.properties[i];if((new RegExp(prop)).test(rule.property)){dimension=TRUE;return FALSE}}}return dimension}function updateChildValues(params){var i,j,x;if(params.flexMatrix){for(i=0,j=params.children.length;i<j;i++){x=params.children[i];x.flex=params.flexMatrix[i]}}if(params.ordinalMatrix){for(i=0,j=params.children.length;i<j;i++){x=params.children[i];x["ordinal-group"]=params.ordinalMatrix[i]}}return params}function ensureStructuralIntegrity(params,instance){var target=params.target;if(!target.FLX_DOM_ID){target.FLX_DOM_ID=target.FLX_DOM_ID||(++FLX_DOM_ID)}if(!params.nodes){params.nodes=sanitizeChildren(target,target.childNodes)}if(!params.selector){params.selector=buildSelector(target);target.setAttribute(FLX_PARENT_ATTR,TRUE)}if(!params.properties){params.properties=[]}if(!params.children){params.children=matchFlexChildren(target,LIBRARY,sanitizeChildren(target,target.childNodes))}if(!params.nested){params.nested=params.selector+" ["+FLX_PARENT_ATTR+"]"}params.target=target;params._instance=instance;return params}selectivizrEngine=(function(){var RE_COMMENT=/(\/\*[^*]*\*+([^\/][^*]*\*+)*\/)\s*?/g,RE_IMPORT=/@import\s*(?:(?:(?:url\(\s*(['"]?)(.*)\1)\s*\))|(?:(['"])(.*)\3))\s*([^;]*);/g,RE_ASSET_URL=/(behavior\s*?:\s*)?\burl\(\s*(["']?)(?!data:)([^"')]+)\2\s*\)/g,RE_SELECTOR_GROUP=/((?:^|(?:\s*\})+)(?:\s*@media[^\{]+\{)?)\s*([^\{]*?[\[:][^{]+)/g,RE_TIDY_TRAILING_WHITESPACE=/([(\[+~])\s+/g,RE_TIDY_LEADING_WHITESPACE=/\s+([)\]+~])/g,RE_TIDY_CONSECUTIVE_WHITESPACE=/\s+/g,RE_TIDY_TRIM_WHITESPACE=/^\s*((?:[\S\s]*\S)?)\s*$/;function trim(text){return text.replace(RE_TIDY_TRIM_WHITESPACE,PLACEHOLDER_STRING)}function normalizeWhitespace(text){return trim(text).replace(RE_TIDY_CONSECUTIVE_WHITESPACE,SPACE_STRING)}function normalizeSelectorWhitespace(selectorText){return normalizeWhitespace(selectorText.replace(RE_TIDY_TRAILING_WHITESPACE,PLACEHOLDER_STRING).replace(RE_TIDY_LEADING_WHITESPACE,PLACEHOLDER_STRING))}function patchStyleSheet(cssText){return cssText.replace(RE_SELECTOR_GROUP,function(m,prefix,selectorText){var selectorGroups,selector,i,j,group;selectorGroups=selectorText.split(",");for(i=0,j=selectorGroups.length;i<j;i++){group=selectorGroups[i];selector=normalizeSelectorWhitespace(group)+SPACE_STRING}return prefix+selectorGroups.join(",")})}function getXHRObject(){if(win.XMLHttpRequest){return new win.XMLHttpRequest()}try{return new win.ActiveXObject("Microsoft.XMLHTTP")}catch(e){return NULL}}function parseInlineStyles(text){var reg=/<style[^<>]*>([^<>]*)<\/style[\s]?>/img,match=reg.exec(text),stylesheets=[],rawCSSText;while(match){rawCSSText=match[1];if(rawCSSText){stylesheets.push(rawCSSText)}match=reg.exec(text)}return stylesheets.join("\n\n")}function loadStyleSheet(url){var xhr=getXHRObject(),responseText;xhr.open("GET",url,FALSE);xhr.send();responseText=(xhr.status===200)?xhr.responseText:EMPTY_STRING;if(url===window.location.href){responseText=parseInlineStyles(responseText)}return responseText}function resolveUrl(url,contextUrl){if(!url){return}function getProtocolAndHost(url){return url.substring(0,url.indexOf("/",8))}if(PROTOCOL.test(url)){return getProtocolAndHost(contextUrl)===getProtocolAndHost(url)?url:NULL}if(url.charAt(0)==="/"){return getProtocolAndHost(contextUrl)+url}var contextUrlPath=contextUrl.split("?")[0];if(url.charAt(0)!=="?"&&contextUrlPath.charAt(contextUrlPath.length-1)!=="/"){contextUrlPath=contextUrlPath.substring(0,contextUrlPath.lastIndexOf("/")+1)}return contextUrlPath+url}function parseStyleSheet(url){if(url){return loadStyleSheet(url).replace(RE_COMMENT,EMPTY_STRING).replace(RE_IMPORT,function(match,quoteChar,importUrl,quoteChar2,importUrl2,media){var cssText=parseStyleSheet(resolveUrl(importUrl||importUrl2,url));return(media)?"@media "+media+" {"+cssText+"}":cssText}).replace(RE_ASSET_URL,function(match,isBehavior,quoteChar,assetUrl){quoteChar=quoteChar||EMPTY_STRING;return isBehavior?match:" url("+quoteChar+resolveUrl(assetUrl,url,true)+quoteChar+") "})}return EMPTY_STRING}return function(){var url,stylesheets=[],stylesheet,i,j,baseTags=doc.getElementsByTagName("BASE"),baseUrl=(baseTags.length>0)?baseTags[0].href:doc.location.href,externalStyles=doc.styleSheets,cssText,tree,flexers;for(i=0,j=externalStyles.length;i<j;i++){stylesheet=externalStyles[i];if(stylesheet!=NULL){stylesheets.push(stylesheet)}}stylesheets.push(window.location);for(i=0,j=stylesheets.length;i<j;i++){stylesheet=stylesheets[i];if(stylesheet){url=resolveUrl(stylesheet.href,baseUrl);if(url){cssText=patchStyleSheet(parseStyleSheet(url))}if(cssText){tree=buildSelectorTree(cssText);flexers=findFlexboxElements(tree)}}}buildFlexieCall(flexers)}}());FLX.box=function(params){return this.renderModel(params)};FLX.box.prototype={properties:{boxModel:function(target,children,params){var selectors,stylesheet,paddingFix,generatedRules,i,j,selector;target.style.display="block";if(BROWSER.IE===8){target.style.overflow="hidden"}if(!params.cleared){selectors=params.selector.split(/\s?,\s?/);stylesheet=doc.styleSheets;stylesheet=stylesheet[stylesheet.length-1];paddingFix="padding-top:"+(getComputedStyle(target,PADDING_TOP,NULL)||"0.1px;");generatedRules=["content: '.'","display: block","height: 0","overflow: hidden"].join(";");for(i=0,j=selectors.length;i<j;i++){selector=selectors[i];if(stylesheet.addRule){if(BROWSER.IE<8){target.style.zoom="1";if(BROWSER.IE===6){stylesheet.addRule(selector.replace(/\>|\+|\~/g,""),paddingFix+"zoom:1;",0)}else if(BROWSER.IE===7){stylesheet.addRule(selector,paddingFix+"display:inline-block;",0)}}else{stylesheet.addRule(selector,paddingFix,0);stylesheet.addRule(selector+":before",generatedRules,0);stylesheet.addRule(selector+":after",generatedRules+";clear:both;",0)}}else if(stylesheet.insertRule){stylesheet.insertRule(selector+"{"+paddingFix+"}",0);stylesheet.insertRule(selector+":after{"+generatedRules+";clear:both;}",0)}}params.cleared=TRUE}},boxDirection:function(target,children,params){var nestedSelector,nested,i,j,kid,node;if((params.direction==="reverse"&&!params.reversed)||(params.direction==="normal"&¶ms.reversed)){children=children.reverse();for(i=0,j=children.length;i<j;i++){kid=children[i];target.appendChild(kid)}nestedSelector=LIBRARY(params.nested);for(i=0,j=nestedSelector.length;i<j;i++){node=nestedSelector[i];nested=FLEX_BOXES[node.FLX_DOM_ID];if(nested&&nested.direction===INHERIT){nested.direction=params.direction}}params.reversed=!params.reversed}},boxOrient:function(target,children,params){var self=this,wide,high,i,j,kid;wide={pos:"marginLeft",opp:"marginRight",dim:"width",out:"offsetWidth",func:clientWidth,pad:[PADDING_LEFT,PADDING_RIGHT,BORDER_LEFT,BORDER_RIGHT]};high={pos:"marginTop",opp:"marginBottom",dim:"height",out:"offsetHeight",func:clientHeight,pad:[PADDING_TOP,PADDING_BOTTOM,BORDER_TOP,BORDER_BOTTOM]};if(!SUPPORT){for(i=0,j=children.length;i<j;i++){kid=children[i];kid.style[(BROWSER.IE>=9)?"cssFloat":"styleFloat"]=LEFT;if(params.orient===VERTICAL||params.orient===BLOCK_AXIS){kid.style.clear=LEFT}if(BROWSER.IE===6){kid.style.display="inline"}}}switch(params.orient){case VERTICAL:case BLOCK_AXIS:self.props=high;self.anti=wide;break;default:self.props=wide;self.anti=high;break}},boxOrdinalGroup:function(target,children,params){var organizeChildren,matrix;if(!children.length){return}organizeChildren=function(matrix){var keys=matrix.keys,iterator=params.reversed?keys:keys.reverse(),i,j,key,k,l,kid;for(i=0,j=iterator.length;i<j;i++){key=iterator[i];for(k=0,l=children.length;k<l;k++){kid=children[k];if(key===kid.getAttribute("data-ordinal-group")){target.appendChild(kid)}}}};matrix=createMatchMatrix(params.children,children,TRUE);if(matrix.keys.length>1){organizeChildren(matrix)}},boxFlex:function(target,children,params){var self=this,testForRestrictiveProperties,findTotalWhitespace,distributeRatio,matrix,restrict,whitespace,distro;if(!children.length){return}testForRestrictiveProperties=function(matrix){var flexers=matrix.groups,keys=matrix.keys,max,i,j,key,k,l,x,m,n,rule;for(i=0,j=keys.length;i<j;i++){key=keys[i];for(k=0,l=flexers[key].length;k<l;k++){x=flexers[key][k];max=NULL;for(m=0,n=x.properties.length;m<n;m++){rule=x.properties[m];if((RESTRICTIVE_PROPERTIES).test(rule.property)){max=parseFloat(rule.value)}}if(!max||x.match[self.props.out]>max){appendPixelValue(x.match,self.props.pos,NULL)}}}};findTotalWhitespace=function(matrix){var groupDimension=0,whitespace,ration,i,j,kid,k,l,pad;for(i=0,j=children.length;i<j;i++){kid=children[i];groupDimension+=getComputedStyle(kid,self.props.dim,TRUE);for(k=0,l=self.props.pad.length;k<l;k++){pad=self.props.pad[k];groupDimension+=getComputedStyle(kid,pad,TRUE)}groupDimension+=getComputedStyle(kid,self.props.pos,TRUE);groupDimension+=getComputedStyle(kid,self.props.opp,TRUE)}whitespace=target[self.props.out]-groupDimension;for(i=0,j=self.props.pad.length;i<j;i++){pad=self.props.pad[i];whitespace-=getComputedStyle(target,pad,TRUE)}ration=(whitespace/matrix.total);return{whitespace:whitespace,ration:ration}};distributeRatio=function(matrix,whitespace){var flexers=matrix.groups,keys=matrix.keys,flex,specificity,ration=whitespace.ration,widthRation,trueDim,newDimension,i,j,key,k,l,x;for(i=0,j=keys.length;i<j;i++){key=keys[i];widthRation=(ration*key);for(k=0,l=flexers[key].length;k<l;k++){x=flexers[key][k];if(x.match){flex=x.match.getAttribute("data-flex");specificity=x.match.getAttribute("data-specificity");if(!flex||(specificity<=x.flexSpecificity)){x.match.setAttribute("data-flex",key);x.match.setAttribute("data-specificity",x.flexSpecificity);trueDim=getComputedStyle(x.match,self.props.dim,TRUE);newDimension=Math.max(0,(trueDim+widthRation));appendPixelValue(x.match,self.props.dim,newDimension)}}}}};matrix=createMatchMatrix(params.children,children,NULL);if(matrix.total){params.hasFlex=TRUE;restrict=testForRestrictiveProperties(matrix);whitespace=findTotalWhitespace(matrix);distro=distributeRatio(matrix,whitespace)}},boxAlign:function(target,children,params){var self=this,targetDimension,kidDimension,flexCheck=parentFlex(target),i,j,pad,k,l,kid;if(!SUPPORT&&!flexCheck.flex&&(params.orient===VERTICAL||params.orient===BLOCK_AXIS)){if(!dimensionValues(target,self.anti.dim)){appendPixelValue(target,self.anti.dim,NULL)}appendPixelValue(children,self.anti.dim,NULL)}targetDimension=target[self.anti.out];for(i=0,j=self.anti.pad.length;i<j;i++){pad=self.anti.pad[i];targetDimension-=getComputedStyle(target,pad,TRUE)}switch(params.align){case"start":break;case"end":for(i=0,j=children.length;i<j;i++){kid=children[i];kidDimension=targetDimension-kid[self.anti.out];kidDimension-=getComputedStyle(kid,self.anti.opp,TRUE);appendPixelValue(kid,self.anti.pos,kidDimension)}break;case"center":for(i=0,j=children.length;i<j;i++){kid=children[i];kidDimension=(targetDimension-kid[self.anti.out])/2;appendPixelValue(kid,self.anti.pos,kidDimension)}break;default:for(i=0,j=children.length;i<j;i++){kid=children[i];switch(kid.nodeName.toLowerCase()){case"button":case"input":case"select":break;default:var subtract=0;for(k=0,l=self.anti.pad.length;k<l;k++){pad=self.anti.pad[k];subtract+=getComputedStyle(kid,pad,TRUE);subtract+=getComputedStyle(target,pad,TRUE)}kid.style[self.anti.dim]="100%";kidDimension=kid[self.anti.out]-subtract;appendPixelValue(kid,self.anti.dim,NULL);kidDimension=targetDimension;kidDimension-=getComputedStyle(kid,self.anti.pos,TRUE);for(k=0,l=self.anti.pad.length;k<l;k++){pad=self.anti.pad[k];kidDimension-=getComputedStyle(kid,pad,TRUE)}kidDimension-=getComputedStyle(kid,self.anti.opp,TRUE);kidDimension=Math.max(0,kidDimension);appendPixelValue(kid,self.anti.dim,kidDimension);break}}break}},boxPack:function(target,children,params){var self=this,groupDimension=0,firstComputedMargin=0,targetPadding=0,totalDimension,fractionedDimension,currentDimension,remainder,length=children.length-1,kid,i,j,value,pad;for(i=0,j=children.length;i<j;i++){kid=children[i];groupDimension+=kid[self.props.out];groupDimension+=getComputedStyle(kid,self.props.pos,TRUE);groupDimension+=getComputedStyle(kid,self.props.opp,TRUE)}firstComputedMargin=getComputedStyle(children[0],self.props.pos,TRUE);totalDimension=target[self.props.out]-groupDimension;for(i=0,j=self.props.pad.length;i<j;i++){pad=self.props.pad[i];totalDimension-=getComputedStyle(target,pad,TRUE)}if(totalDimension<0){totalDimension=Math.max(0,totalDimension)}switch(params.pack){case"end":appendPixelValue(children[0],self.props.pos,targetPadding+firstComputedMargin+totalDimension);break;case"center":if(targetPadding){targetPadding/=2}appendPixelValue(children[0],self.props.pos,targetPadding+firstComputedMargin+Math.floor(totalDimension/2));break;case"justify":fractionedDimension=Math.floor((targetPadding+totalDimension)/length);remainder=(fractionedDimension*length)-totalDimension;i=children.length-1;while(i){kid=children[i];currentDimension=fractionedDimension;if(remainder){currentDimension++;remainder++}value=getComputedStyle(kid,self.props.pos,TRUE)+currentDimension;appendPixelValue(kid,self.props.pos,value);i--}break}target.style.overflow=""}},setup:function(target,children,params){var self=this,matrix,flexCheck,key,func;if(!target||!children||!params){return}if(SUPPORT&&SUPPORT.partialSupport){matrix=createMatchMatrix(params.children,children,NULL);flexCheck=parentFlex(target);children=sanitizeChildren(target,target.childNodes);self.properties.boxOrient.call(self,target,children,params);if(!matrix.total||!LIBRARY(params.nested).length){if((params.align==="stretch")&&!SUPPORT.boxAlignStretch&&(!flexCheck.nested||!flexCheck.flex)){self.properties.boxAlign.call(self,target,children,params)}if((params.pack==="justify")&&!SUPPORT.boxPackJustify&&!matrix.total){self.properties.boxPack.call(self,target,children,params)}}}else if(!SUPPORT){for(key in self.properties){if(self.properties.hasOwnProperty(key)){func=self.properties[key];func.call(self,target,sanitizeChildren(target,target.childNodes),params)}}}},trackDOM:function(params){attachResizeListener(this,params)},updateModel:function(params){var self=this,target=params.target,children=params.nodes;cleanPositioningProperties(children);if(params.flexMatrix||params.ordinalMatrix){params=updateChildValues(params)}self.setup(target,children,params);self.bubbleUp(target,params)},renderModel:function(params){var self=this,target=params.target,nodes=target.childNodes;if(!target.length&&!nodes){return false}params=ensureStructuralIntegrity(params,this);self.updateModel(params);win.setTimeout(function(){self.trackDOM(params)},0);return self},bubbleUp:function(target,params){var self=this,flex,parent=params.target.parentNode;while(parent){flex=FLEX_BOXES[parent.FLX_DOM_ID];if(flex&&flex.nodes){cleanPositioningProperties(flex.nodes);self.setup(flex.target,flex.nodes,flex)}parent=parent.parentNode}}};FLX.updateInstance=function(target,params){var box,key;if(target){box=FLEX_BOXES[target.FLX_DOM_ID];if(box&&box._instance){box._instance.updateModel(box)}else if(!box){box=new FLX.box(params)}}else{for(key in FLEX_BOXES){if(FLEX_BOXES.hasOwnProperty(key)){box=FLEX_BOXES[key];if(box&&box._instance){box._instance.updateModel(box)}}}}};FLX.getInstance=function(target){return FLEX_BOXES[target.FLX_DOM_ID]};FLX.destroyInstance=function(target){var box,destroy,i,j,x,key;destroy=function(box){box.target.FLX_DOM_ID=NULL;box.target.style.cssText=EMPTY_STRING;for(i=0,j=box.children.length;i<j;i++){x=box.children[i];x.match.style.cssText=EMPTY_STRING}};if(target){box=FLEX_BOXES[target.FLX_DOM_ID];if(box){destroy(box)}}else{for(key in FLEX_BOXES){if(FLEX_BOXES.hasOwnProperty(key)){destroy(FLEX_BOXES[key])}}FLEX_BOXES=[]}};FLX.flexboxSupport=function(){var partialSupportGrid={},height=100,childHeight,dummy=doc.createElement("flxbox"),child='<b style="margin: 0; padding: 0; display:block; width: 10px; height:'+(height/2)+'px"></b>',tests,result,key,value;dummy.style.width=dummy.style.height=height+"px";dummy.innerHTML=(child+child+child);appendProperty(dummy,"display","box",NULL);appendProperty(dummy,"box-align","stretch",TRUE);appendProperty(dummy,"box-pack","justify",TRUE);doc.body.appendChild(dummy);childHeight=dummy.firstChild.offsetHeight;tests={boxAlignStretch:function(){return(childHeight===100)},boxPackJustify:function(){var totalOffset=0,i,j;for(i=0,j=dummy.childNodes.length;i<j;i++){totalOffset+=dummy.childNodes[i].offsetLeft}return(totalOffset===135)}};for(key in tests){if(tests.hasOwnProperty(key)){value=tests[key];result=value();if(!result){partialSupportGrid.partialSupport=TRUE}partialSupportGrid[key]=result}}doc.body.removeChild(dummy);return~(dummy.style.display).indexOf("box")?partialSupportGrid:FALSE};FLX.init=function(){FLX.flexboxSupported=SUPPORT=FLX.flexboxSupport();if((!SUPPORT||SUPPORT.partialSupport)&&LIBRARY){selectivizrEngine()}};FLX.version="1.0.3";attachLoadMethod(FLX.init);return FLX}(this,document));
|
@@ -0,0 +1,66 @@
|
|
1
|
+
/*global jQuery */
|
2
|
+
/*!
|
3
|
+
* Lettering.JS 0.6.1
|
4
|
+
*
|
5
|
+
* Copyright 2010, Dave Rupert http://daverupert.com
|
6
|
+
* Released under the WTFPL license
|
7
|
+
* http://sam.zoy.org/wtfpl/
|
8
|
+
*
|
9
|
+
* Thanks to Paul Irish - http://paulirish.com - for the feedback.
|
10
|
+
*
|
11
|
+
* Date: Mon Sep 20 17:14:00 2010 -0600
|
12
|
+
*/
|
13
|
+
(function($){
|
14
|
+
function injector(t, splitter, klass, after) {
|
15
|
+
var a = t.text().split(splitter), inject = '';
|
16
|
+
if (a.length) {
|
17
|
+
$(a).each(function(i, item) {
|
18
|
+
inject += '<span class="'+klass+(i+1)+'">'+item+'</span>'+after;
|
19
|
+
});
|
20
|
+
t.empty().append(inject);
|
21
|
+
}
|
22
|
+
}
|
23
|
+
|
24
|
+
var methods = {
|
25
|
+
init : function() {
|
26
|
+
|
27
|
+
return this.each(function() {
|
28
|
+
injector($(this), '', 'char', '');
|
29
|
+
});
|
30
|
+
|
31
|
+
},
|
32
|
+
|
33
|
+
words : function() {
|
34
|
+
|
35
|
+
return this.each(function() {
|
36
|
+
injector($(this), ' ', 'word', ' ');
|
37
|
+
});
|
38
|
+
|
39
|
+
},
|
40
|
+
|
41
|
+
lines : function() {
|
42
|
+
|
43
|
+
return this.each(function() {
|
44
|
+
var r = "eefec303079ad17405c889e092e105b0";
|
45
|
+
// Because it's hard to split a <br/> tag consistently across browsers,
|
46
|
+
// (*ahem* IE *ahem*), we replaces all <br/> instances with an md5 hash
|
47
|
+
// (of the word "split"). If you're trying to use this plugin on that
|
48
|
+
// md5 hash string, it will fail because you're being ridiculous.
|
49
|
+
injector($(this).children("br").replaceWith(r).end(), r, 'line', '');
|
50
|
+
});
|
51
|
+
|
52
|
+
}
|
53
|
+
};
|
54
|
+
|
55
|
+
$.fn.lettering = function( method ) {
|
56
|
+
// Method calling logic
|
57
|
+
if ( method && methods[method] ) {
|
58
|
+
return methods[ method ].apply( this, [].slice.call( arguments, 1 ));
|
59
|
+
} else if ( method === 'letters' || ! method ) {
|
60
|
+
return methods.init.apply( this, [].slice.call( arguments, 0 ) ); // always pass an array
|
61
|
+
}
|
62
|
+
$.error( 'Method ' + method + ' does not exist on jQuery.lettering' );
|
63
|
+
return this;
|
64
|
+
};
|
65
|
+
|
66
|
+
})(jQuery);
|
@@ -0,0 +1,13 @@
|
|
1
|
+
/*global jQuery */
|
2
|
+
/*!
|
3
|
+
* Lettering.JS 0.6.1
|
4
|
+
*
|
5
|
+
* Copyright 2010, Dave Rupert http://daverupert.com
|
6
|
+
* Released under the WTFPL license
|
7
|
+
* http://sam.zoy.org/wtfpl/
|
8
|
+
*
|
9
|
+
* Thanks to Paul Irish - http://paulirish.com - for the feedback.
|
10
|
+
*
|
11
|
+
* Date: Mon Sep 20 17:14:00 2010 -0600
|
12
|
+
*/
|
13
|
+
(function($){function injector(t,splitter,klass,after){var a=t.text().split(splitter),inject='';if(a.length){$(a).each(function(i,item){inject+='<span class="'+klass+(i+1)+'">'+item+'</span>'+after});t.empty().append(inject)}}var methods={init:function(){return this.each(function(){injector($(this),'','char','')})},words:function(){return this.each(function(){injector($(this),' ','word',' ')})},lines:function(){return this.each(function(){var r="eefec303079ad17405c889e092e105b0";injector($(this).children("br").replaceWith(r).end(),r,'line','')})}};$.fn.lettering=function(method){if(method&&methods[method]){return methods[method].apply(this,[].slice.call(arguments,1))}else if(method==='letters'||!method){return methods.init.apply(this,[].slice.call(arguments,0))}$.error('Method '+method+' does not exist on jQuery.lettering');return this}})(jQuery);
|
@@ -0,0 +1,204 @@
|
|
1
|
+
/*global jQuery, window, document */
|
2
|
+
/*!
|
3
|
+
* Regions.js v0.1
|
4
|
+
*
|
5
|
+
* Copyright 2011, Robin Ricard
|
6
|
+
* Released under the MIT license
|
7
|
+
*/
|
8
|
+
|
9
|
+
(function($, window, document, undefined ) {
|
10
|
+
|
11
|
+
/**
|
12
|
+
* Defines the standard settings
|
13
|
+
*/
|
14
|
+
|
15
|
+
var settings = defaults = {
|
16
|
+
resizing: true,
|
17
|
+
lazyTime: 150,
|
18
|
+
resizeOversizedElements : true // set to false, if you handle the overflow of oversized elems by yourself
|
19
|
+
},
|
20
|
+
|
21
|
+
/**
|
22
|
+
* Build and rebuild when window sizing changes
|
23
|
+
*/
|
24
|
+
|
25
|
+
autoBuildRegions = function (flowContainer, regions, settings) {
|
26
|
+
// First display
|
27
|
+
buildRegions(flowContainer, regions, settings);
|
28
|
+
// is the lazy timeout engaged ?
|
29
|
+
var lazyEngaged = false;
|
30
|
+
// When Resize
|
31
|
+
$(window).resize(function () {
|
32
|
+
if(!lazyEngaged) { // if no event was fired in the few seconds before
|
33
|
+
lazyEngaged = true; // it tells that an event was fired
|
34
|
+
setTimeout(function () { // and it waits before rebuild that things happens
|
35
|
+
buildRegions(flowContainer, regions, settings);
|
36
|
+
lazyEngaged = false;
|
37
|
+
}, settings.lazyTime);
|
38
|
+
}
|
39
|
+
});
|
40
|
+
},
|
41
|
+
|
42
|
+
/**
|
43
|
+
* Introduce a flow into several regions (once)
|
44
|
+
* Returns the overflow in a DOM element
|
45
|
+
*/
|
46
|
+
|
47
|
+
buildRegions = function (flowContainer, regions, settings) {
|
48
|
+
regions = regions.slice(0); // Copy of the Array
|
49
|
+
flowContainer.css("display", "none");
|
50
|
+
var overflow = integrate(flowContainer, regions[0]);
|
51
|
+
regions.shift();
|
52
|
+
if (regions.length > 0) {
|
53
|
+
return buildRegions(overflow, regions);
|
54
|
+
} else {
|
55
|
+
return overflow;
|
56
|
+
}
|
57
|
+
},
|
58
|
+
|
59
|
+
/**
|
60
|
+
* Just put enough elements (that fits) into the region
|
61
|
+
* Returns the overflow in a container
|
62
|
+
*/
|
63
|
+
|
64
|
+
integrate = function (elementsContainer, region) {
|
65
|
+
// This avoids the original copy's alteration
|
66
|
+
elementsContainer = elementsContainer.clone();
|
67
|
+
|
68
|
+
// This redefines the offsetParent for children
|
69
|
+
if (region.css("position") === "static") {
|
70
|
+
region.css("position", "relative");
|
71
|
+
}
|
72
|
+
|
73
|
+
// This introduces the elements
|
74
|
+
region.empty();
|
75
|
+
region.append(elementsContainer.children());
|
76
|
+
|
77
|
+
// Clears the top margin
|
78
|
+
region.children().first().css("margin-top", "0");
|
79
|
+
|
80
|
+
// This removes the overflow and return it
|
81
|
+
var ret = overflowRemover(region);
|
82
|
+
|
83
|
+
// Clears the bottom margin
|
84
|
+
region.children().last().css("margin-bottom", "0");
|
85
|
+
|
86
|
+
return ret;
|
87
|
+
},
|
88
|
+
|
89
|
+
/**
|
90
|
+
* Removes and return the overflow in a region
|
91
|
+
* for each container you want to analyze.
|
92
|
+
*/
|
93
|
+
|
94
|
+
overflowRemover = function (elementsContainer, region, letteringForbidden) {
|
95
|
+
if (region === undefined) {
|
96
|
+
region = elementsContainer;
|
97
|
+
}
|
98
|
+
|
99
|
+
// This create an empty and hidden DOM node
|
100
|
+
var overflowContainer = $("<div></div>"),
|
101
|
+
elements = elementsContainer.children(),
|
102
|
+
// This stores the first element that had to be rejected
|
103
|
+
firstRejected = false;
|
104
|
+
|
105
|
+
elements.each(function (index, element) {
|
106
|
+
element = $(element); // jQuery manipulable
|
107
|
+
if (firstRejected) { // If a rejected element have been keeped.
|
108
|
+
// It's added directly into the overflow node
|
109
|
+
element.detach();
|
110
|
+
overflowContainer.append($("<span> </span>")); // Fix whitespace issues
|
111
|
+
overflowContainer.append(element);
|
112
|
+
} else if ( // If it does not fit in the region
|
113
|
+
element.position().top + element.outerHeight(true) >= region.height()
|
114
|
+
) {
|
115
|
+
element.detach();
|
116
|
+
firstRejected = element;
|
117
|
+
}
|
118
|
+
});
|
119
|
+
|
120
|
+
if (firstRejected) { // The first rejected is taken
|
121
|
+
// If some children are text nodes, treat it with Lettering.js
|
122
|
+
if (!letteringForbidden) {
|
123
|
+
firstRejected.contents().filter(function() {
|
124
|
+
return this.nodeType === 3; // Select text nodes
|
125
|
+
})
|
126
|
+
.wrap("<span></span")
|
127
|
+
.parent()
|
128
|
+
.lettering("words");
|
129
|
+
letteringForbidden = true;
|
130
|
+
}
|
131
|
+
// If he is not empty
|
132
|
+
if (firstRejected.children().length) {
|
133
|
+
// He is reintroduced into the DOM
|
134
|
+
elementsContainer.append(firstRejected);
|
135
|
+
// The same treatment will be performed on him (recursion)
|
136
|
+
var removed = overflowRemover(firstRejected, region, letteringForbidden),
|
137
|
+
// His overflow will be moved into his parent's overflow
|
138
|
+
reintroduce = firstRejected.clone();
|
139
|
+
reintroduce.empty();
|
140
|
+
reintroduce.append(removed.children());
|
141
|
+
overflowContainer.prepend(reintroduce);
|
142
|
+
} else {
|
143
|
+
overflowContainer.prepend(firstRejected);
|
144
|
+
}
|
145
|
+
}
|
146
|
+
|
147
|
+
// if the first element is immediately rejected, its probably too big for the region
|
148
|
+
// so append it anyways. by default, the max-width and max-height are set to the regions dimension.
|
149
|
+
if (firstRejected && elementsContainer.children().length === 0) {
|
150
|
+
if (settings.resizeOversizedElements) {
|
151
|
+
firstRejected.css({
|
152
|
+
'max-width' : region.innerWidth(),
|
153
|
+
'max-height' : region.innerHeight()
|
154
|
+
});
|
155
|
+
};
|
156
|
+
elementsContainer.append(firstRejected);
|
157
|
+
}
|
158
|
+
|
159
|
+
return overflowContainer;
|
160
|
+
};
|
161
|
+
|
162
|
+
/**
|
163
|
+
* The JS API is a jQuery plugin
|
164
|
+
* Target your flow node with jQuery
|
165
|
+
* The first parameter is an array or jQuery Object/String of the regions you want to target
|
166
|
+
* The second parameter are the options
|
167
|
+
*/
|
168
|
+
|
169
|
+
$.fn.regions = function (regions, settings) {
|
170
|
+
// Merge settings with defaults
|
171
|
+
settings = $.extend(defaults, settings);
|
172
|
+
|
173
|
+
// add possibility to define target regions via jquery object or query string
|
174
|
+
if (typeof regions === "string" || regions instanceof jQuery) {
|
175
|
+
if (!(regions instanceof jQuery)) {
|
176
|
+
regions = $(regions);
|
177
|
+
}
|
178
|
+
regionsArray = $.makeArray(regions);
|
179
|
+
regions = $.map(regionsArray, function(region) {
|
180
|
+
return $(region);
|
181
|
+
});
|
182
|
+
} else {
|
183
|
+
// Ensure that we're passing DOM elements not just strings !
|
184
|
+
regions = $.map(regions, function (region) {
|
185
|
+
if(typeof region === "string") {
|
186
|
+
return $(region);
|
187
|
+
} else {
|
188
|
+
return region;
|
189
|
+
}
|
190
|
+
});
|
191
|
+
}
|
192
|
+
|
193
|
+
// Then call the right function
|
194
|
+
if(settings.resizing) {
|
195
|
+
autoBuildRegions($(this), regions, settings);
|
196
|
+
} else {
|
197
|
+
buildRegions($(this), regions, settings);
|
198
|
+
}
|
199
|
+
|
200
|
+
// maintain chainability
|
201
|
+
return this;
|
202
|
+
};
|
203
|
+
|
204
|
+
})(jQuery, window, document);
|
@@ -0,0 +1,7 @@
|
|
1
|
+
/*!
|
2
|
+
* Regions.js v0.1
|
3
|
+
*
|
4
|
+
* Copyright 2011, Robin Ricard
|
5
|
+
* Released under the MIT license
|
6
|
+
*/
|
7
|
+
(function(e,f,g,a){var c=defaults={resizing:true,lazyTime:150,resizeOversizedElements:true},h=function(j,m,k){i(j,m,k);var l=false;e(f).resize(function(){if(!l){l=true;setTimeout(function(){i(j,m,k);l=false},k.lazyTime)}})},i=function(j,m,k){m=m.slice(0);j.css("display","none");var l=d(j,m[0]);m.shift();if(m.length>0){return i(l,m)}else{return l}},d=function(k,l){k=k.clone();if(l.css("position")==="static"){l.css("position","relative")}l.empty();l.append(k.children());l.children().first().css("margin-top","0");var j=b(l);l.children().last().css("margin-bottom","0");return j},b=function(n,q,j){if(q===a){q=n}var k=e("<div></div>"),m=n.children(),l=false;m.each(function(r,s){s=e(s);if(l){s.detach();k.append(e("<span> </span>"));k.append(s)}else{if(s.position().top+s.outerHeight(true)>=q.height()){s.detach();l=s}}});if(l){if(!j){l.contents().filter(function(){return this.nodeType===3}).wrap("<span></span").parent().lettering("words");j=true}if(l.children().length){n.append(l);var p=b(l,q,j),o=l.clone();o.empty();o.append(p.children());k.prepend(o)}else{k.prepend(l)}}if(l&&n.children().length===0){if(c.resizeOversizedElements){l.css({"max-width":q.innerWidth(),"max-height":q.innerHeight()})}n.append(l)}return k};e.fn.regions=function(k,j){j=e.extend(defaults,j);if(typeof k==="string"||k instanceof jQuery){if(!(k instanceof jQuery)){k=e(k)}regionsArray=e.makeArray(k);k=e.map(regionsArray,function(l){return e(l)})}else{k=e.map(k,function(l){if(typeof l==="string"){return e(l)}else{return l}})}if(j.resizing){h(e(this),k,j)}else{i(e(this),k,j)}return this}})(jQuery,window,document);
|
@@ -0,0 +1,1256 @@
|
|
1
|
+
/*
|
2
|
+
* CSS Template Layout Module Implementation <http://code.google.com/p/css-template-layout/>
|
3
|
+
* Version: 1.1.6 (2010-08-09)
|
4
|
+
* Copyright: 2010, Alexis Deveria <http://a.deveria.com/>
|
5
|
+
* License: GNU General Public License, Free Software Foundation
|
6
|
+
* <http://creativecommons.org/licenses/GPL/2.0/>
|
7
|
+
*/
|
8
|
+
|
9
|
+
|
10
|
+
/*
|
11
|
+
Known bugs:
|
12
|
+
- Template widths are not used if total of row widths is smaller
|
13
|
+
- min/max-width/heights for elements is not supported
|
14
|
+
- template content should flow in first slot if not @ is found
|
15
|
+
|
16
|
+
Changelog
|
17
|
+
|
18
|
+
V1.01
|
19
|
+
|
20
|
+
* Replaced .css() notation for width and height with shorter notations
|
21
|
+
* Improved the way multiple elements per slot appear
|
22
|
+
|
23
|
+
V1.1
|
24
|
+
|
25
|
+
* Fixed margin/border/padding behavior
|
26
|
+
* Changed slot behavior to match spec text rather than examples
|
27
|
+
* Limited ::slot() values to allowed values
|
28
|
+
* Support for ::slot() vertical-align "middle" and "bottom" added
|
29
|
+
* Support for ::slot() overflow hidden/visible added
|
30
|
+
* Proper support far ::slot() background properties
|
31
|
+
* Support for template background in combination with slot backgrounds
|
32
|
+
|
33
|
+
V1.1.1
|
34
|
+
|
35
|
+
* Added support for comma-seperated selectors
|
36
|
+
* Fixed background positioning for body templates.
|
37
|
+
* Added support for setting template display/position properties using jQuery().css()
|
38
|
+
|
39
|
+
V1.1.2
|
40
|
+
|
41
|
+
* Added/fixed support for width/height set in CSS for elements in a slot
|
42
|
+
* Allow fallback class to be set, to hide fallback CSS rules
|
43
|
+
* Improved display property parsing, corrected handling of incorrect width values
|
44
|
+
* Added support for spaces between minmax() values
|
45
|
+
* Added $.templateLayoutShowOnReady to hide the non-template rendering.
|
46
|
+
* Added support for sub-templates with same letters
|
47
|
+
|
48
|
+
V1.1.3
|
49
|
+
|
50
|
+
* Fixed IE bugs
|
51
|
+
|
52
|
+
V1.1.4
|
53
|
+
|
54
|
+
* Made body appear visible on native support
|
55
|
+
* Fixed vertical positioning for multiple elements with margins
|
56
|
+
|
57
|
+
V1.1.5
|
58
|
+
|
59
|
+
* Fixed Bug where first given column width would be ignored
|
60
|
+
|
61
|
+
V1.1.6
|
62
|
+
|
63
|
+
* Fixed jQuery 1.4/IE8 bug
|
64
|
+
|
65
|
+
|
66
|
+
*/
|
67
|
+
|
68
|
+
|
69
|
+
(function($) {
|
70
|
+
|
71
|
+
var css_data, prefix = '';
|
72
|
+
var templates;
|
73
|
+
var same_els = [];
|
74
|
+
var cur_tpl_sel;
|
75
|
+
var delay = 0;
|
76
|
+
var page_hidden = false;
|
77
|
+
var rules = [];
|
78
|
+
|
79
|
+
// Set Template display/position values using jQuery
|
80
|
+
var proxied = jQuery.fn.css;
|
81
|
+
jQuery.fn.css = function(key, value) {
|
82
|
+
|
83
|
+
var disp_prop = prefix + 'display';
|
84
|
+
var pos_prop = prefix + 'position';
|
85
|
+
var disp = false, pos = false;
|
86
|
+
|
87
|
+
if(value) {
|
88
|
+
if(key == disp_prop && value.indexOf('"') != -1) {
|
89
|
+
disp = true;
|
90
|
+
} else if(key == pos_prop && value.length == 1) {
|
91
|
+
pos = true;
|
92
|
+
} else {
|
93
|
+
return proxied.apply(this, arguments);
|
94
|
+
}
|
95
|
+
|
96
|
+
var jq_el = this;
|
97
|
+
|
98
|
+
//Change "display" value
|
99
|
+
|
100
|
+
var cur_sel;
|
101
|
+
|
102
|
+
|
103
|
+
$.each(templates,function(sel,tpl) {
|
104
|
+
if(disp) {
|
105
|
+
if(jq_el.is(sel)) { cur_sel = sel; }
|
106
|
+
} else {
|
107
|
+
$.each(tpl.chars,function(chr,chr_data) {
|
108
|
+
if(jq_el.is(chr_data.selector)) {
|
109
|
+
cur_sel = chr_data.selector;
|
110
|
+
}
|
111
|
+
});
|
112
|
+
}
|
113
|
+
});
|
114
|
+
|
115
|
+
$.each(rules,function(i,rule) {
|
116
|
+
if(rule.selector == cur_sel) {
|
117
|
+
|
118
|
+
if(disp) {
|
119
|
+
rule.properties[disp_prop] = value;
|
120
|
+
} else if(pos) {
|
121
|
+
rule.properties[pos_prop] = value;
|
122
|
+
}
|
123
|
+
}
|
124
|
+
});
|
125
|
+
|
126
|
+
getTemplateData(rules);
|
127
|
+
setLayout();
|
128
|
+
|
129
|
+
} else {
|
130
|
+
|
131
|
+
return proxied.apply(this, arguments);
|
132
|
+
}
|
133
|
+
};
|
134
|
+
|
135
|
+
$.templateLayoutShowOnReady = function() {
|
136
|
+
document.write('<style> body {visibility:hidden} </style>');
|
137
|
+
page_hidden = true;
|
138
|
+
}
|
139
|
+
|
140
|
+
$.setTemplateLayout = function(given_data, given_pre) {
|
141
|
+
|
142
|
+
// Do nothing if native support is found
|
143
|
+
if(hasNativeSupport()) {
|
144
|
+
showPage();
|
145
|
+
return false;
|
146
|
+
}
|
147
|
+
|
148
|
+
// Redo layout on resize
|
149
|
+
setTimeout(function() {
|
150
|
+
$(window).resize(setLayout);
|
151
|
+
},100);
|
152
|
+
|
153
|
+
if(typeof given_data == 'string') {
|
154
|
+
given_data = {file:given_data};
|
155
|
+
}
|
156
|
+
|
157
|
+
if(given_pre) {
|
158
|
+
given_data.prefix = given_pre;
|
159
|
+
}
|
160
|
+
|
161
|
+
// Set prefix if given
|
162
|
+
if(given_data) {
|
163
|
+
if(given_data.prefix) {
|
164
|
+
prefix = '-' + given_data.prefix + '-';
|
165
|
+
}
|
166
|
+
|
167
|
+
if(given_data.delay) {
|
168
|
+
delay = given_data.delay;
|
169
|
+
}
|
170
|
+
|
171
|
+
if(given_data.fallback) {
|
172
|
+
$('.' + given_data.fallback).remove();
|
173
|
+
}
|
174
|
+
}
|
175
|
+
|
176
|
+
if(!given_data) {
|
177
|
+
setLayoutFromTag();
|
178
|
+
} else {
|
179
|
+
css_data = '';
|
180
|
+
|
181
|
+
if(given_data.text) {
|
182
|
+
css_data = given_data.text;
|
183
|
+
$('head').append('<style>' + css_data + '</style>');
|
184
|
+
}
|
185
|
+
|
186
|
+
if(given_data.file) {
|
187
|
+
$.get(given_data.file,function(str) {
|
188
|
+
css_data += str;
|
189
|
+
setLayout();
|
190
|
+
});
|
191
|
+
}
|
192
|
+
|
193
|
+
if(!given_data.file && !css_data) {
|
194
|
+
setLayoutFromTag();
|
195
|
+
return false;
|
196
|
+
}
|
197
|
+
|
198
|
+
if(css_data) setLayout();
|
199
|
+
}
|
200
|
+
};
|
201
|
+
|
202
|
+
$.redoTemplateLayout = setLayout;
|
203
|
+
|
204
|
+
function showPage() {
|
205
|
+
if(page_hidden) {
|
206
|
+
$('body').css('visibility','visible');
|
207
|
+
page_hidden = false;
|
208
|
+
}
|
209
|
+
}
|
210
|
+
|
211
|
+
function setLayoutFromTag() {
|
212
|
+
var st_el = $('style');
|
213
|
+
if(!st_el.length) return;
|
214
|
+
|
215
|
+
if(st_el.text()) {
|
216
|
+
css_data = st_el.text();
|
217
|
+
setLayout();
|
218
|
+
} else {
|
219
|
+
// Get raw HTML page as string and get CSS using regexp
|
220
|
+
$.get(document.location.href,function(html_page) {
|
221
|
+
var style_match = html_page.match(/<style.*?>([\s\S]*?)<\/style>/);
|
222
|
+
css_data = style_match?style_match[1]:'';
|
223
|
+
|
224
|
+
setLayout();
|
225
|
+
});
|
226
|
+
}
|
227
|
+
}
|
228
|
+
|
229
|
+
// Returns the CSS data as an array with objects
|
230
|
+
function getCSSRules() {
|
231
|
+
|
232
|
+
// Remove commented out stuff
|
233
|
+
css_data = css_data.replace(/\/\*[\s\S]*?\*\//g,'');
|
234
|
+
|
235
|
+
var bits = css_data.split('}');
|
236
|
+
|
237
|
+
$.each(bits,function() {
|
238
|
+
var rule = $.trim(this);
|
239
|
+
|
240
|
+
if(!rule) return;
|
241
|
+
|
242
|
+
var rule_data = parseRule(rule);
|
243
|
+
|
244
|
+
if(!rule_data) return;
|
245
|
+
|
246
|
+
if(rule_data.selector.indexOf(',') != -1) {
|
247
|
+
// Multiple selectors
|
248
|
+
var selectors = rule_data.selector.split(',');
|
249
|
+
$.each(selectors, function(i,sel) {
|
250
|
+
rules.push({
|
251
|
+
'selector': $.trim(sel),
|
252
|
+
'properties': rule_data.properties
|
253
|
+
});
|
254
|
+
});
|
255
|
+
|
256
|
+
} else {
|
257
|
+
// One selector
|
258
|
+
rules.push(rule_data);
|
259
|
+
}
|
260
|
+
|
261
|
+
});
|
262
|
+
|
263
|
+
return rules;
|
264
|
+
}
|
265
|
+
|
266
|
+
// Returns CSS selectors and properties
|
267
|
+
function parseRule(rule) {
|
268
|
+
|
269
|
+
if(rule.indexOf('@') === 0 || rule.indexOf('{') == -1) {
|
270
|
+
return false;
|
271
|
+
}
|
272
|
+
|
273
|
+
var rule_parts = rule.split('{');
|
274
|
+
|
275
|
+
var sel = $.trim(rule_parts[0]);
|
276
|
+
|
277
|
+
var prop_text = rule_parts[1].split(';');
|
278
|
+
var props = {};
|
279
|
+
|
280
|
+
$.each(prop_text,function() {
|
281
|
+
var prop_parts = this.split(':');
|
282
|
+
var name = $.trim(prop_parts[0]).toLowerCase(); // lowercase for IE
|
283
|
+
var value = $.trim(prop_parts[1]);
|
284
|
+
props[name] = value;
|
285
|
+
});
|
286
|
+
|
287
|
+
return {
|
288
|
+
'selector':sel,
|
289
|
+
'properties':props
|
290
|
+
};
|
291
|
+
}
|
292
|
+
|
293
|
+
function getTemplateDisplay(display_val) {
|
294
|
+
// Remove newlines
|
295
|
+
var str = display_val.replace(/\n|\r/g,' ');
|
296
|
+
|
297
|
+
var d_parts = str.split('"');
|
298
|
+
|
299
|
+
var rows = [];
|
300
|
+
var widths = [];
|
301
|
+
var unique_chars = {};
|
302
|
+
|
303
|
+
// Loop through even numbers
|
304
|
+
for(var i = 2, l = d_parts.length; i < l; i+=2) {
|
305
|
+
|
306
|
+
var part = d_parts[i];
|
307
|
+
|
308
|
+
var height = 'auto';
|
309
|
+
|
310
|
+
if(part.indexOf('/') != -1) {
|
311
|
+
// Has a row height
|
312
|
+
var val_parts = part.match(/\/\s*(\S+)(.*)/);
|
313
|
+
|
314
|
+
height = $.trim(val_parts[1]);
|
315
|
+
|
316
|
+
}
|
317
|
+
|
318
|
+
if($.trim(part) && i == l-1) {
|
319
|
+
|
320
|
+
var last = $.trim(d_parts[l-1]).replace(/^\/\s*\S+\s*/,'');
|
321
|
+
|
322
|
+
if(last && last.indexOf('/') == -1) {
|
323
|
+
if(last.indexOf('(') != -1) {
|
324
|
+
// Deal with minmax pars
|
325
|
+
var pars = last.match(/minmax(\(.*?\))/g);
|
326
|
+
|
327
|
+
$.each(pars,function(i,p_set) {
|
328
|
+
var clean_p = p_set.replace(/\s*/g,'');
|
329
|
+
last = last.replace(p_set,clean_p);
|
330
|
+
});
|
331
|
+
}
|
332
|
+
|
333
|
+
last = last.replace(/\(\)/,'');
|
334
|
+
|
335
|
+
widths = last.split(/\s+/);
|
336
|
+
}
|
337
|
+
}
|
338
|
+
|
339
|
+
var chars = d_parts[i-1].replace(/[^a-z@\.]/gi,'');
|
340
|
+
|
341
|
+
chars = $.trim(chars).split('');
|
342
|
+
|
343
|
+
// Get unique characters
|
344
|
+
$.each(chars,function() {
|
345
|
+
unique_chars[this] = true;
|
346
|
+
});
|
347
|
+
|
348
|
+
// Do not allow negative row heights
|
349
|
+
if(height.indexOf('-') == 0) {
|
350
|
+
return false;
|
351
|
+
}
|
352
|
+
|
353
|
+
rows.push({
|
354
|
+
'chars':chars,
|
355
|
+
'height':height
|
356
|
+
});
|
357
|
+
}
|
358
|
+
|
359
|
+
var col_width = rows[0].chars.length;
|
360
|
+
|
361
|
+
// too many widths, cut last off
|
362
|
+
while(widths.length > col_width) {
|
363
|
+
widths.pop();
|
364
|
+
}
|
365
|
+
|
366
|
+
// too few, add '*'
|
367
|
+
while(widths.length < col_width) {
|
368
|
+
widths.push('*');
|
369
|
+
}
|
370
|
+
|
371
|
+
return {
|
372
|
+
'rows':rows,
|
373
|
+
'widths':widths,
|
374
|
+
'chars':unique_chars
|
375
|
+
}
|
376
|
+
|
377
|
+
}
|
378
|
+
|
379
|
+
|
380
|
+
function getTemplateData(rules) {
|
381
|
+
|
382
|
+
var tpl_positions = {};
|
383
|
+
var pseudo_props = {};
|
384
|
+
var tpl_num = 0;
|
385
|
+
|
386
|
+
var tmp_templates = [];
|
387
|
+
|
388
|
+
$.each(rules,function(r,rule) {
|
389
|
+
var props = rule.properties;
|
390
|
+
var selector = rule.selector;
|
391
|
+
var disp_prop = prefix + 'display';
|
392
|
+
var pos_prop = prefix + 'position';
|
393
|
+
|
394
|
+
var slotEl = false;
|
395
|
+
|
396
|
+
//Look for ::slot() pseudo-class
|
397
|
+
if(selector.indexOf('::slot(') != -1) {
|
398
|
+
var matches = selector.match(/slot\((.)\)/);
|
399
|
+
|
400
|
+
if(matches && matches.length > 1) {
|
401
|
+
var p_char = matches[1];
|
402
|
+
var selector_start = selector.split('::slot')[0];
|
403
|
+
|
404
|
+
var allowed_props = {};
|
405
|
+
$.each(props,function(name,val) {
|
406
|
+
if(name.indexOf('background') == 0
|
407
|
+
|| name.indexOf('overflow') != -1
|
408
|
+
|| name.indexOf('vertical-align') != -1) {
|
409
|
+
allowed_props[name] = val;
|
410
|
+
}
|
411
|
+
});
|
412
|
+
|
413
|
+
pseudo_props[selector_start + '|' + p_char] = allowed_props;
|
414
|
+
}
|
415
|
+
}
|
416
|
+
|
417
|
+
//Look for Layout "position" property
|
418
|
+
if(props[pos_prop] && props[pos_prop].length == 1) {
|
419
|
+
var chr = props[pos_prop];
|
420
|
+
|
421
|
+
tpl_positions[selector] = {
|
422
|
+
'chr':chr,
|
423
|
+
'props':props
|
424
|
+
}
|
425
|
+
|
426
|
+
slotEl = true;
|
427
|
+
} else if(props[pos_prop] == 'same') {
|
428
|
+
same_els.push(selector);
|
429
|
+
}
|
430
|
+
|
431
|
+
//Look for Layout "display" property
|
432
|
+
if(props[disp_prop] && props[disp_prop].indexOf('"') != -1) {
|
433
|
+
|
434
|
+
var tpl_display = getTemplateDisplay(props[disp_prop]);
|
435
|
+
|
436
|
+
if(!tpl_display) return;
|
437
|
+
|
438
|
+
// Store template data
|
439
|
+
tmp_templates.push({
|
440
|
+
'sel':selector,
|
441
|
+
'rows':tpl_display.rows,
|
442
|
+
'widths':tpl_display.widths,
|
443
|
+
'chars':tpl_display.chars,
|
444
|
+
'properties':props,
|
445
|
+
'pseudo_props':{},
|
446
|
+
'num':tpl_num,
|
447
|
+
'slotEl':slotEl
|
448
|
+
});
|
449
|
+
|
450
|
+
tpl_num++;
|
451
|
+
}
|
452
|
+
});
|
453
|
+
|
454
|
+
// Re-order to process parent templates first
|
455
|
+
tmp_templates.sort(function(a,b) { return !b.slotEl; });
|
456
|
+
|
457
|
+
$.each(tmp_templates,function(i,tpl) {
|
458
|
+
templates[tpl.sel] = tpl;
|
459
|
+
});
|
460
|
+
|
461
|
+
$.each(tpl_positions,function(p_sel,pos) {
|
462
|
+
var min_distance = false;
|
463
|
+
var cur_sel = false;
|
464
|
+
|
465
|
+
$.each(templates,function(t_sel,tpl) {
|
466
|
+
// Check if template includes this character and has it as a child
|
467
|
+
if(t_sel == p_sel) {
|
468
|
+
tpl_positions[t_sel].tplEl = true;
|
469
|
+
}
|
470
|
+
|
471
|
+
if(!tpl.chars[pos.chr]) return;
|
472
|
+
|
473
|
+
var parents = $(p_sel).parents();
|
474
|
+
|
475
|
+
if(parents.is(t_sel)) {
|
476
|
+
// Calculate closeness
|
477
|
+
|
478
|
+
var distance;
|
479
|
+
var i = 0;
|
480
|
+
parents.each(function() {
|
481
|
+
if(parents[i] == $(t_sel)[0]) {
|
482
|
+
distance = i;
|
483
|
+
}
|
484
|
+
i++;
|
485
|
+
});
|
486
|
+
|
487
|
+
// Get first template or nearest one
|
488
|
+
if(min_distance === false || distance < min_distance) {
|
489
|
+
min_distance = distance;
|
490
|
+
cur_sel = t_sel;
|
491
|
+
}
|
492
|
+
|
493
|
+
}
|
494
|
+
});
|
495
|
+
|
496
|
+
var tplEl = pos.tplEl || false;
|
497
|
+
|
498
|
+
if(cur_sel) {
|
499
|
+
|
500
|
+
var pseudo_id = cur_sel + '|' + pos.chr;
|
501
|
+
|
502
|
+
var p_props = pseudo_props[pseudo_id] || false;
|
503
|
+
|
504
|
+
templates[cur_sel].chars[pos.chr] = {
|
505
|
+
'selector':p_sel,
|
506
|
+
'props':pos.props,
|
507
|
+
'pseudo_props':p_props,
|
508
|
+
'tplEl':tplEl,
|
509
|
+
'cur_sel':cur_sel
|
510
|
+
};
|
511
|
+
}
|
512
|
+
});
|
513
|
+
|
514
|
+
}
|
515
|
+
|
516
|
+
// Check if browser has native support for template layout
|
517
|
+
function hasNativeSupport() {
|
518
|
+
var test_val = '"@"';
|
519
|
+
var test_el = $('<p></p>');
|
520
|
+
var supported = true;
|
521
|
+
try {
|
522
|
+
test_el.get(0).style.display = test_val;
|
523
|
+
} catch(err) {
|
524
|
+
supported = false;
|
525
|
+
}
|
526
|
+
|
527
|
+
supported = (test_el.css('display') == test_val);
|
528
|
+
test_el.remove();
|
529
|
+
return supported;
|
530
|
+
}
|
531
|
+
|
532
|
+
// Template Constructor
|
533
|
+
function Template(tpl,tpl_sel) {
|
534
|
+
|
535
|
+
var given_widths = tpl.widths;
|
536
|
+
var rows = tpl.rows;
|
537
|
+
var tpl_props = tpl.properties;
|
538
|
+
|
539
|
+
var widths = [], heights = [];
|
540
|
+
var tpl_el = $(tpl_sel);
|
541
|
+
var slots = tpl.chars;
|
542
|
+
|
543
|
+
$.each(slots,function(chr,slot) {
|
544
|
+
if(slot !== true) {
|
545
|
+
slot.slot_w = 1;
|
546
|
+
slot.slot_h = 1;
|
547
|
+
}
|
548
|
+
});
|
549
|
+
|
550
|
+
|
551
|
+
tpl.margins = 0;
|
552
|
+
|
553
|
+
// Get the width of a 'min/max-content' column
|
554
|
+
function getContentWidth(col_num, type) {
|
555
|
+
var cell_widths = [];
|
556
|
+
|
557
|
+
$.each(slots,function(chr,slot) {
|
558
|
+
|
559
|
+
var width = slot.props.width || 'auto';
|
560
|
+
|
561
|
+
|
562
|
+
if(slot.col == col_num && slot.slot_w == 1) {
|
563
|
+
//Get content width from this element
|
564
|
+
|
565
|
+
var cur_w = getDivDims({
|
566
|
+
'width':width,
|
567
|
+
'top':'auto',
|
568
|
+
'left':'auto'
|
569
|
+
},slot.el.clone()).w;
|
570
|
+
|
571
|
+
cell_widths.push(cur_w);
|
572
|
+
}
|
573
|
+
});
|
574
|
+
|
575
|
+
var calc = type.split('-')[0];
|
576
|
+
|
577
|
+
// Get min-content or max-content value
|
578
|
+
return Math[calc].apply({}, cell_widths);
|
579
|
+
}
|
580
|
+
|
581
|
+
// Get width and height based on given style/content
|
582
|
+
function getDivDims(given_css, content) {
|
583
|
+
var testDiv = $('<div><\/div>');
|
584
|
+
testDiv.css({
|
585
|
+
'visibility':'hidden',
|
586
|
+
'margin':0,
|
587
|
+
'padding':0,
|
588
|
+
'position':'absolute'
|
589
|
+
});
|
590
|
+
|
591
|
+
if(content) {
|
592
|
+
|
593
|
+
testDiv.append(content);
|
594
|
+
}
|
595
|
+
if(given_css) {
|
596
|
+
testDiv.css(given_css);
|
597
|
+
}
|
598
|
+
|
599
|
+
tpl_el.append(testDiv);
|
600
|
+
|
601
|
+
var info = {
|
602
|
+
w:testDiv.width(),
|
603
|
+
h:testDiv.height()
|
604
|
+
}
|
605
|
+
|
606
|
+
testDiv.remove();
|
607
|
+
|
608
|
+
return info;
|
609
|
+
}
|
610
|
+
|
611
|
+
// Get width or height of an element in pixels
|
612
|
+
function getPixelData(type,size,col_num) {
|
613
|
+
var width = 'auto', height = 'auto';
|
614
|
+
if(type == 'h') {
|
615
|
+
height = size;
|
616
|
+
} else {
|
617
|
+
width = size;
|
618
|
+
|
619
|
+
if(width == 'min-content' || width == 'max-content') {
|
620
|
+
return getContentWidth(col_num, width);
|
621
|
+
}
|
622
|
+
}
|
623
|
+
|
624
|
+
var dims = getDivDims({
|
625
|
+
'height':height,
|
626
|
+
'width':width
|
627
|
+
});
|
628
|
+
|
629
|
+
return dims[type];
|
630
|
+
}
|
631
|
+
|
632
|
+
function getHeight(slot) {
|
633
|
+
var total_h = 0;
|
634
|
+
|
635
|
+
for(var i = slot.row; i < slot.slot_h+slot.row && i < heights.length;i++) {
|
636
|
+
total_h += heights[i];
|
637
|
+
}
|
638
|
+
|
639
|
+
//Change based on negative top margin
|
640
|
+
var t_margin = parseInt(slot.el.css('margin-top'));
|
641
|
+
|
642
|
+
if(t_margin < 0) {
|
643
|
+
total_h -= t_margin;
|
644
|
+
}
|
645
|
+
|
646
|
+
return total_h;
|
647
|
+
}
|
648
|
+
|
649
|
+
function getElSize(type,chr,cur_size) {
|
650
|
+
var css_val = slots[chr].props[type]+'';
|
651
|
+
var new_size = css_val;
|
652
|
+
|
653
|
+
if(css_val.indexOf('%') != -1 && type == 'width') {
|
654
|
+
new_size = cur_size * parseInt(css_val)/100;
|
655
|
+
}
|
656
|
+
|
657
|
+
return new_size;
|
658
|
+
}
|
659
|
+
|
660
|
+
// Get the pixel width of a given slot
|
661
|
+
function getWidth(slot) {
|
662
|
+
var total_w = 0;
|
663
|
+
|
664
|
+
for(var i = slot.col; i < slot.slot_w+slot.col;i++) {
|
665
|
+
total_w += widths[i];
|
666
|
+
}
|
667
|
+
|
668
|
+
//Change based on margin
|
669
|
+
|
670
|
+
var cur_border = slot.el.outerWidth(true) - slot.el.width();
|
671
|
+
if(cur_border) {
|
672
|
+
|
673
|
+
total_w -= cur_border;
|
674
|
+
}
|
675
|
+
|
676
|
+
|
677
|
+
|
678
|
+
if(slot.tplEl) {
|
679
|
+
|
680
|
+
// Give width/height to sub-template if given
|
681
|
+
if(rows[slot.row].height && rows[slot.row].height != '*') {
|
682
|
+
templates[slot.selector].properties.height = rows[slot.row].height;
|
683
|
+
}
|
684
|
+
|
685
|
+
templates[slot.selector].properties.width = total_w;
|
686
|
+
|
687
|
+
var newTpl = new Template(templates[slot.selector], slot.selector);
|
688
|
+
var sub_tpl = newTpl.make();
|
689
|
+
slot.genHeight = sub_tpl.height;
|
690
|
+
return sub_tpl.width;
|
691
|
+
}
|
692
|
+
|
693
|
+
return total_w;
|
694
|
+
}
|
695
|
+
|
696
|
+
// Get total height of multiple elements
|
697
|
+
function getMultiHeight(el) {
|
698
|
+
|
699
|
+
var btop = el.css('border-top-width');
|
700
|
+
|
701
|
+
|
702
|
+
var clone = el.clone();
|
703
|
+
|
704
|
+
clone.each(function() {
|
705
|
+
$(this).css('position','static');
|
706
|
+
});
|
707
|
+
|
708
|
+
return getDivDims(0,clone).h;
|
709
|
+
|
710
|
+
}
|
711
|
+
|
712
|
+
// Calculate row heights
|
713
|
+
function calcRowHeights() {
|
714
|
+
|
715
|
+
// if(tpl.slotEl && slots['@']) {
|
716
|
+
if(tpl.slotEl) {
|
717
|
+
// Is template as well as slot, get height if exists
|
718
|
+
tpl_props.height = tpl_el.height();
|
719
|
+
}
|
720
|
+
|
721
|
+
//Set template height to 100% or the given height
|
722
|
+
if(tpl_props.height) {
|
723
|
+
|
724
|
+
tpl_el.height(tpl_props.height);
|
725
|
+
var tot_height = tpl_el.height();
|
726
|
+
|
727
|
+
} else {
|
728
|
+
var tpl_height = 0;
|
729
|
+
}
|
730
|
+
|
731
|
+
var flex_rows = 0;
|
732
|
+
|
733
|
+
var min_heights = [];
|
734
|
+
|
735
|
+
$.each(rows,function(row_num,row) {
|
736
|
+
var max_h = 0;
|
737
|
+
|
738
|
+
$.each(slots,function(chr,slot) {
|
739
|
+
|
740
|
+
if(slot.row == row_num) { // && slot.slot_h == 1
|
741
|
+
|
742
|
+
if(slot.props.height) {
|
743
|
+
slot.el.height(slot.props.height);
|
744
|
+
} else {
|
745
|
+
slot.el.height('auto');
|
746
|
+
}
|
747
|
+
|
748
|
+
if(!min_heights[row_num]) {
|
749
|
+
min_heights[row_num] = 0;
|
750
|
+
}
|
751
|
+
|
752
|
+
var cur_h;
|
753
|
+
|
754
|
+
// If slot is a template, get its generated height
|
755
|
+
if(slot.genHeight) {
|
756
|
+
cur_h = slot.genHeight;
|
757
|
+
} else if(slot.slot_h == 1) {
|
758
|
+
cur_h = getMultiHeight(slot.el);
|
759
|
+
} else {
|
760
|
+
var part_h = getMultiHeight(slot.el)/slot.slot_h;
|
761
|
+
|
762
|
+
for(var i = row_num; i<slot.slot_h; i++) {
|
763
|
+
min_heights[i] = part_h;
|
764
|
+
}
|
765
|
+
|
766
|
+
}
|
767
|
+
|
768
|
+
if(max_h < min_heights[row_num]) {
|
769
|
+
max_h = min_heights[row_num];
|
770
|
+
}
|
771
|
+
|
772
|
+
if(max_h < cur_h) {
|
773
|
+
max_h = cur_h;
|
774
|
+
}
|
775
|
+
}
|
776
|
+
});
|
777
|
+
|
778
|
+
if(tpl_props.height && tpl_props.height != 'auto') {
|
779
|
+
// Any "auto" / * rows should be distributed
|
780
|
+
flex_rows++;
|
781
|
+
max_h = 0;
|
782
|
+
} else if(row.height != '*' && row.height != 'auto') {
|
783
|
+
max_h = getPixelData('h',row.height);
|
784
|
+
}
|
785
|
+
|
786
|
+
heights[row_num] = max_h;
|
787
|
+
tpl_height += max_h;
|
788
|
+
});
|
789
|
+
|
790
|
+
if(flex_rows) {
|
791
|
+
var flex_height = tot_height/flex_rows;
|
792
|
+
|
793
|
+
$.each(rows,function(row_num,row) {
|
794
|
+
if(row.height == '*' || row.height == 'auto') {
|
795
|
+
heights[row_num] = flex_height;
|
796
|
+
}
|
797
|
+
});
|
798
|
+
} else {
|
799
|
+
tpl_el.height(tpl_height);
|
800
|
+
}
|
801
|
+
|
802
|
+
}
|
803
|
+
|
804
|
+
|
805
|
+
function calcColWidths() {
|
806
|
+
|
807
|
+
var px_width = 0;
|
808
|
+
var flex_cols = 0;
|
809
|
+
|
810
|
+
if(tpl.slotEl) {
|
811
|
+
tpl_el.width(tpl_el.width());
|
812
|
+
}
|
813
|
+
|
814
|
+
//Set template width to 100% or the given width
|
815
|
+
tpl_el.width(tpl_props.width || '100%');
|
816
|
+
|
817
|
+
var tot_width = tpl_el.width();
|
818
|
+
|
819
|
+
widths = [];
|
820
|
+
var new_tot = 0;
|
821
|
+
|
822
|
+
$.each(given_widths,function(i,w) {
|
823
|
+
if(w == 'fit-content') {
|
824
|
+
w = given_widths[i] = 'minmax(min-content,max-content)';
|
825
|
+
}
|
826
|
+
|
827
|
+
if(w == '*' || w == 'auto') {
|
828
|
+
flex_cols++;
|
829
|
+
px_width = 0;
|
830
|
+
} else if(w.indexOf('minmax') === 0) {
|
831
|
+
//Calc min/max
|
832
|
+
var minmax = w.match(/\((.*?),(.*?)\)/);
|
833
|
+
var min = minmax[1];
|
834
|
+
var max = minmax[2];
|
835
|
+
|
836
|
+
px_width = getPixelData('w',max,i);
|
837
|
+
tot_width -= px_width;
|
838
|
+
} else {
|
839
|
+
px_width = getPixelData('w',w,i);
|
840
|
+
tot_width -= px_width;
|
841
|
+
}
|
842
|
+
|
843
|
+
widths.push(px_width);
|
844
|
+
new_tot += px_width;
|
845
|
+
});
|
846
|
+
|
847
|
+
if(tot_width < 0) {
|
848
|
+
$.each(given_widths,function(i,w) {
|
849
|
+
if(w.indexOf('minmax') != -1) {
|
850
|
+
var minmax = w.match(/\((.*?),(.*?)\)/);
|
851
|
+
var min = minmax[1];
|
852
|
+
var max = minmax[2];
|
853
|
+
|
854
|
+
min_pixels = getPixelData('w',min,i);
|
855
|
+
|
856
|
+
widths[i] += tot_width;
|
857
|
+
tot_width = 0;
|
858
|
+
|
859
|
+
if(widths[i] < min_pixels) {
|
860
|
+
widths[i] = min_pixels;
|
861
|
+
}
|
862
|
+
}
|
863
|
+
});
|
864
|
+
}
|
865
|
+
|
866
|
+
var flex_width = tot_width/flex_cols;
|
867
|
+
|
868
|
+
$.each(given_widths,function(i,w) {
|
869
|
+
if(w == '*' || w == 'auto') {
|
870
|
+
widths[i] = flex_width;
|
871
|
+
}
|
872
|
+
});
|
873
|
+
}
|
874
|
+
|
875
|
+
function getTop(slot, offset) {
|
876
|
+
var total_h = offset || 0;
|
877
|
+
var row_num = slot.row;
|
878
|
+
|
879
|
+
if(slots['@'] && !slot.isHolder) {
|
880
|
+
total_h = -1*getPixelData('h',tpl_el.css('top'));
|
881
|
+
}
|
882
|
+
|
883
|
+
$.each(heights,function(i) {
|
884
|
+
if(i < row_num) {
|
885
|
+
total_h += this;
|
886
|
+
}
|
887
|
+
});
|
888
|
+
|
889
|
+
return total_h;
|
890
|
+
}
|
891
|
+
|
892
|
+
function getLeft(slot) {
|
893
|
+
var col_num = slot.col;
|
894
|
+
var total_w = 0;
|
895
|
+
|
896
|
+
if(slots['@'] && !slot.isHolder) {
|
897
|
+
total_w = -1*getPixelData('w',tpl_el.css('left'));
|
898
|
+
}
|
899
|
+
|
900
|
+
$.each(widths,function(i) {
|
901
|
+
if(i < col_num) {
|
902
|
+
total_w += this;
|
903
|
+
}
|
904
|
+
});
|
905
|
+
|
906
|
+
return total_w;
|
907
|
+
}
|
908
|
+
|
909
|
+
function setSames(slot) {
|
910
|
+
// Loop through "same" elements
|
911
|
+
$.each(same_els,function(a,el_sel) {
|
912
|
+
|
913
|
+
var same_el = $(el_sel);
|
914
|
+
|
915
|
+
// Loop through "same" element collection
|
916
|
+
same_el.each(function() {
|
917
|
+
var cur_el = $(this);
|
918
|
+
|
919
|
+
var new_group = false;
|
920
|
+
|
921
|
+
// Make a new element collection including "same" elements if it's the same as the slot element
|
922
|
+
slot.el.each(function() {
|
923
|
+
var cslot_el = $(this);
|
924
|
+
|
925
|
+
if(!new_group) {
|
926
|
+
new_group = cslot_el;
|
927
|
+
} else {
|
928
|
+
new_group[new_group.length++] = cslot_el[0];
|
929
|
+
}
|
930
|
+
|
931
|
+
if(cslot_el.next()[0] == cur_el[0]) {
|
932
|
+
new_group[new_group.length++] = cur_el[0];
|
933
|
+
}
|
934
|
+
|
935
|
+
});
|
936
|
+
|
937
|
+
if(new_group.length > 1) {
|
938
|
+
slot.el = new_group;
|
939
|
+
slot.multi = true;
|
940
|
+
}
|
941
|
+
|
942
|
+
});
|
943
|
+
|
944
|
+
});
|
945
|
+
}
|
946
|
+
|
947
|
+
function setBackground() {
|
948
|
+
|
949
|
+
var set_bg = false;
|
950
|
+
var bg_props = {};
|
951
|
+
|
952
|
+
if(tpl_el.is('body')) {
|
953
|
+
return;
|
954
|
+
}
|
955
|
+
|
956
|
+
$.each(tpl_props,function(name,val) {
|
957
|
+
|
958
|
+
if(name.indexOf('background') === 0) {
|
959
|
+
set_bg = true;
|
960
|
+
bg_props[name] = val;
|
961
|
+
}
|
962
|
+
});
|
963
|
+
|
964
|
+
if(!set_bg) return;
|
965
|
+
|
966
|
+
var id = 'jq_tpl_bg-' + tpl.num;
|
967
|
+
var off = tpl_el.offset();
|
968
|
+
var tpl_bg = $('#'+id);
|
969
|
+
|
970
|
+
if(!tpl_bg.length) {
|
971
|
+
tpl_bg = $('<div id="'+id+'"></div>');
|
972
|
+
|
973
|
+
tpl_bg.css(bg_props);
|
974
|
+
}
|
975
|
+
|
976
|
+
tpl_bg.css({
|
977
|
+
'z-index': -2,
|
978
|
+
position: 'absolute',
|
979
|
+
top: off.top,
|
980
|
+
left: off.left,
|
981
|
+
width: tpl_el.width(),
|
982
|
+
height: tpl_el.height()
|
983
|
+
});
|
984
|
+
|
985
|
+
$('body').append(tpl_bg);
|
986
|
+
}
|
987
|
+
|
988
|
+
function makePseudoSlot(chr,slot) {
|
989
|
+
// Set pseudo-slot properties if found
|
990
|
+
if(slot.pseudo_props) {
|
991
|
+
var doc_offset = slot.el.offset();
|
992
|
+
var id = 'jq_tpl' + tpl.num + '_slot-' + chr;
|
993
|
+
var p_slot = $('#'+id);
|
994
|
+
var p_props = slot.pseudo_props;
|
995
|
+
|
996
|
+
if(!p_slot.length) {
|
997
|
+
|
998
|
+
// Create if not existant
|
999
|
+
p_slot = $('<div id="' + id + '"></div>');
|
1000
|
+
$('body').append(p_slot)
|
1001
|
+
}
|
1002
|
+
|
1003
|
+
var slot_w = slot.el.outerWidth(true);
|
1004
|
+
var slot_h = getHeight(slot);
|
1005
|
+
|
1006
|
+
p_slot.css({
|
1007
|
+
display: 'block',
|
1008
|
+
position: 'absolute',
|
1009
|
+
'z-index': (tpl.num-10),
|
1010
|
+
top: doc_offset.top,
|
1011
|
+
left: doc_offset.left,
|
1012
|
+
width: slot_w,
|
1013
|
+
height: slot_h
|
1014
|
+
});
|
1015
|
+
|
1016
|
+
// Fix left offset when body is template and has left margin
|
1017
|
+
if($('body').is(tpl_sel)) {
|
1018
|
+
|
1019
|
+
if(!tpl.margins) {
|
1020
|
+
var p = $('<p style="position:static;margin:0;display:block;visibility:hidden;"></p>');
|
1021
|
+
tpl_el.append(p);
|
1022
|
+
tpl.margins = p.offset();
|
1023
|
+
tpl.margins.left -= parseFloat(tpl_el.css('padding-left'));
|
1024
|
+
tpl.margins.top -= parseFloat(tpl_el.css('padding-top'));
|
1025
|
+
p.remove();
|
1026
|
+
}
|
1027
|
+
|
1028
|
+
p_slot.css('left',doc_offset.left - tpl.margins.left);
|
1029
|
+
p_slot.css('top',doc_offset.top - tpl.margins.top);
|
1030
|
+
}
|
1031
|
+
|
1032
|
+
|
1033
|
+
|
1034
|
+
p_slot.css(p_props);
|
1035
|
+
|
1036
|
+
if(p_props['vertical-align']) {
|
1037
|
+
var more_top = 0;
|
1038
|
+
var align = p_props['vertical-align'];
|
1039
|
+
|
1040
|
+
switch ( align ) {
|
1041
|
+
case 'middle':
|
1042
|
+
|
1043
|
+
more_top = slot_h/2 - slot.el.height()/2;;
|
1044
|
+
break;
|
1045
|
+
|
1046
|
+
case 'bottom':
|
1047
|
+
more_top = slot_h - slot.el.height();
|
1048
|
+
break;
|
1049
|
+
|
1050
|
+
case 'baseline':
|
1051
|
+
|
1052
|
+
// Not correct
|
1053
|
+
more_top = slot_h - slot.el.height();
|
1054
|
+
break;
|
1055
|
+
|
1056
|
+
default:
|
1057
|
+
break;
|
1058
|
+
}
|
1059
|
+
|
1060
|
+
slot.el.css('top', getTop(slot) + more_top);
|
1061
|
+
}
|
1062
|
+
}
|
1063
|
+
}
|
1064
|
+
|
1065
|
+
function makeSlots() {
|
1066
|
+
|
1067
|
+
// Get element position info
|
1068
|
+
$.each(rows,function(i,row) {
|
1069
|
+
|
1070
|
+
$.each(row.chars,function(j,chr) {
|
1071
|
+
|
1072
|
+
// Skip if whitespace block
|
1073
|
+
if(chr == '.') {
|
1074
|
+
return;
|
1075
|
+
}
|
1076
|
+
|
1077
|
+
if(chr == '@') {
|
1078
|
+
slots['@'] = {
|
1079
|
+
'selector':tpl_sel,
|
1080
|
+
isHolder:true
|
1081
|
+
}
|
1082
|
+
}
|
1083
|
+
|
1084
|
+
var slot = slots[chr];
|
1085
|
+
|
1086
|
+
slot.el = $(slot.selector);
|
1087
|
+
|
1088
|
+
// Set slot width based on last char
|
1089
|
+
if(j > 0 && row.chars[j-1] == chr) {
|
1090
|
+
if(slot.slot_h == 1) {
|
1091
|
+
slot.slot_w++;
|
1092
|
+
}
|
1093
|
+
}
|
1094
|
+
|
1095
|
+
// Set slot height based on last char
|
1096
|
+
if(i > 0 && rows[i-1].chars[j] == chr) {
|
1097
|
+
slot.slot_h++;
|
1098
|
+
}
|
1099
|
+
|
1100
|
+
// Set row/col value only for first occurance
|
1101
|
+
if(isNaN(slot.row)) slot.row = i;
|
1102
|
+
|
1103
|
+
if(isNaN(slot.col)) slot.col = j;
|
1104
|
+
|
1105
|
+
// Check if element is child of template
|
1106
|
+
if(!slot.el.parents().is(tpl_sel) && !slot.el.is(tpl_sel)) {
|
1107
|
+
// Not a child, remove slot!
|
1108
|
+
delete slot;
|
1109
|
+
return;
|
1110
|
+
}
|
1111
|
+
|
1112
|
+
if(slot.el.length > 1) {
|
1113
|
+
slot.multi = true;
|
1114
|
+
}
|
1115
|
+
|
1116
|
+
setSames(slot);
|
1117
|
+
});
|
1118
|
+
|
1119
|
+
});
|
1120
|
+
|
1121
|
+
delete slots['.'];
|
1122
|
+
|
1123
|
+
}
|
1124
|
+
|
1125
|
+
this.make = function() {
|
1126
|
+
|
1127
|
+
tpl_el.css('position','relative');
|
1128
|
+
|
1129
|
+
makeSlots();
|
1130
|
+
|
1131
|
+
calcColWidths();
|
1132
|
+
|
1133
|
+
if(slots['@']) {
|
1134
|
+
// Do holder slot first
|
1135
|
+
slots['@'].el.css('left',getLeft(slots['@']));
|
1136
|
+
}
|
1137
|
+
|
1138
|
+
$.each(slots,function(chr,slot) {
|
1139
|
+
var el = slot.el;
|
1140
|
+
|
1141
|
+
var elWidth = getWidth(slot);
|
1142
|
+
|
1143
|
+
if(slot.props.width) {
|
1144
|
+
elWidth = getElSize('width',chr,elWidth);
|
1145
|
+
}
|
1146
|
+
|
1147
|
+
el.css({
|
1148
|
+
'display': 'block',
|
1149
|
+
'position': 'absolute',
|
1150
|
+
'width': elWidth
|
1151
|
+
});
|
1152
|
+
|
1153
|
+
el.css('left',getLeft(slot));
|
1154
|
+
|
1155
|
+
});
|
1156
|
+
|
1157
|
+
calcRowHeights();
|
1158
|
+
|
1159
|
+
if(slots['@']) {
|
1160
|
+
// Do holder slot first
|
1161
|
+
slots['@'].el.css('top',getTop(slots['@']));
|
1162
|
+
}
|
1163
|
+
|
1164
|
+
// Set heights & tops
|
1165
|
+
$.each(slots,function(chr,slot) {
|
1166
|
+
|
1167
|
+
if(slot.tplEl) {
|
1168
|
+
templates[slot.selector].genTop = getTop(slot);
|
1169
|
+
}
|
1170
|
+
|
1171
|
+
|
1172
|
+
var slotTop = getTop(slot);
|
1173
|
+
var slotHeight = getHeight(slot);
|
1174
|
+
var newTop = slotTop;
|
1175
|
+
|
1176
|
+
var hide_overflow = false;
|
1177
|
+
if(slot.pseudo_props) {
|
1178
|
+
if(slot.pseudo_props.overflow == 'hidden') {
|
1179
|
+
hide_overflow = true;
|
1180
|
+
}
|
1181
|
+
}
|
1182
|
+
|
1183
|
+
slot.el.each(function(i) {
|
1184
|
+
if(i > 0) {
|
1185
|
+
newTop += slot.el.eq(i-1).outerHeight(true);
|
1186
|
+
}
|
1187
|
+
|
1188
|
+
$(this).css('top',newTop);
|
1189
|
+
|
1190
|
+
// Check for percentage height
|
1191
|
+
if(slot.props.height) {
|
1192
|
+
slotHeight = getElSize('height',chr,slotHeight);
|
1193
|
+
$(this).height(slotHeight);
|
1194
|
+
}
|
1195
|
+
|
1196
|
+
if(hide_overflow) {
|
1197
|
+
var lastHeight = slotHeight - newTop + slotTop;
|
1198
|
+
var full_overflow = (newTop - slotTop > slotHeight);
|
1199
|
+
var part_overflow = (slot.el.height() + newTop - slotTop > slotHeight);
|
1200
|
+
|
1201
|
+
if(full_overflow || part_overflow) {
|
1202
|
+
$(this).height( full_overflow?0:lastHeight );
|
1203
|
+
$(this).css('overflow','hidden');
|
1204
|
+
}
|
1205
|
+
}
|
1206
|
+
|
1207
|
+
});
|
1208
|
+
|
1209
|
+
if(slot.tplEl) {
|
1210
|
+
slot.el.height(getHeight(slot));
|
1211
|
+
}
|
1212
|
+
|
1213
|
+
makePseudoSlot(chr,slot);
|
1214
|
+
|
1215
|
+
});
|
1216
|
+
|
1217
|
+
setBackground();
|
1218
|
+
|
1219
|
+
if(tpl.genTop && slots['@']) {
|
1220
|
+
slots['@'].el.css('top',getTop(slots['@'],tpl.genTop));
|
1221
|
+
}
|
1222
|
+
|
1223
|
+
return {
|
1224
|
+
'height':tpl_el.height(),
|
1225
|
+
'width':tpl_el.width()
|
1226
|
+
};
|
1227
|
+
}
|
1228
|
+
|
1229
|
+
}
|
1230
|
+
|
1231
|
+
function makeTemplate(tpl_sel,tpl) {
|
1232
|
+
|
1233
|
+
var t = new Template(tpl,tpl_sel);
|
1234
|
+
t.make();
|
1235
|
+
}
|
1236
|
+
|
1237
|
+
function setLayout() {
|
1238
|
+
|
1239
|
+
// Create templates if not done already
|
1240
|
+
if(!templates) {
|
1241
|
+
templates = {};
|
1242
|
+
rules = getCSSRules();
|
1243
|
+
var tpl_positions = {};
|
1244
|
+
|
1245
|
+
getTemplateData(rules);
|
1246
|
+
}
|
1247
|
+
|
1248
|
+
setTimeout(function() {
|
1249
|
+
$.each(templates,makeTemplate);
|
1250
|
+
showPage();
|
1251
|
+
},delay);
|
1252
|
+
|
1253
|
+
delay = 0;
|
1254
|
+
}
|
1255
|
+
|
1256
|
+
})(jQuery);
|