").append(c.replace(bN,"")).find(g):c)),d&&i.each(d,[c,b,a])}});return this},serialize:function(){return f.param(this.serializeArray())},serializeArray:function(){return this.map(function(){return this.elements?f.makeArray(this.elements):this}).filter(function(){return this.name&&!this.disabled&&(this.checked||bO.test(this.nodeName)||bI.test(this.type))}).map(function(a,b){var c=f(this).val();return c==null?null:f.isArray(c)?f.map(c,function(a,c){return{name:b.name,value:a.replace(bF,"\r\n")}}):{name:b.name,value:c.replace(bF,"\r\n")}}).get()}}),f.each("ajaxStart ajaxStop ajaxComplete ajaxError ajaxSuccess ajaxSend".split(" "),function(a,b){f.fn[b]=function(a){return this.on(b,a)}}),f.each(["get","post"],function(a,c){f[c]=function(a,d,e,g){f.isFunction(d)&&(g=g||e,e=d,d=b);return f.ajax({type:c,url:a,data:d,success:e,dataType:g})}}),f.extend({getScript:function(a,c){return f.get(a,b,c,"script")},getJSON:function(a,b,c){return f.get(a,b,c,"json")},ajaxSetup:function(a,b){b?b_(a,f.ajaxSettings):(b=a,a=f.ajaxSettings),b_(a,b);return a},ajaxSettings:{url:bV,isLocal:bJ.test(bW[1]),global:!0,type:"GET",contentType:"application/x-www-form-urlencoded",processData:!0,async:!0,accepts:{xml:"application/xml, text/xml",html:"text/html",text:"text/plain",json:"application/json, text/javascript","*":bX},contents:{xml:/xml/,html:/html/,json:/json/},responseFields:{xml:"responseXML",text:"responseText"},converters:{"* text":a.String,"text html":!0,"text json":f.parseJSON,"text xml":f.parseXML},flatOptions:{context:!0,url:!0}},ajaxPrefilter:bZ(bT),ajaxTransport:bZ(bU),ajax:function(a,c){function w(a,c,l,m){if(s!==2){s=2,q&&clearTimeout(q),p=b,n=m||"",v.readyState=a>0?4:0;var o,r,u,w=c,x=l?cb(d,v,l):b,y,z;if(a>=200&&a<300||a===304){if(d.ifModified){if(y=v.getResponseHeader("Last-Modified"))f.lastModified[k]=y;if(z=v.getResponseHeader("Etag"))f.etag[k]=z}if(a===304)w="notmodified",o=!0;else try{r=cc(d,x),w="success",o=!0}catch(A){w="parsererror",u=A}}else{u=w;if(!w||a)w="error",a<0&&(a=0)}v.status=a,v.statusText=""+(c||w),o?h.resolveWith(e,[r,w,v]):h.rejectWith(e,[v,w,u]),v.statusCode(j),j=b,t&&g.trigger("ajax"+(o?"Success":"Error"),[v,d,o?r:u]),i.fireWith(e,[v,w]),t&&(g.trigger("ajaxComplete",[v,d]),--f.active||f.event.trigger("ajaxStop"))}}typeof a=="object"&&(c=a,a=b),c=c||{};var d=f.ajaxSetup({},c),e=d.context||d,g=e!==d&&(e.nodeType||e instanceof f)?f(e):f.event,h=f.Deferred(),i=f.Callbacks("once memory"),j=d.statusCode||{},k,l={},m={},n,o,p,q,r,s=0,t,u,v={readyState:0,setRequestHeader:function(a,b){if(!s){var c=a.toLowerCase();a=m[c]=m[c]||a,l[a]=b}return this},getAllResponseHeaders:function(){return s===2?n:null},getResponseHeader:function(a){var c;if(s===2){if(!o){o={};while(c=bH.exec(n))o[c[1].toLowerCase()]=c[2]}c=o[a.toLowerCase()]}return c===b?null:c},overrideMimeType:function(a){s||(d.mimeType=a);return this},abort:function(a){a=a||"abort",p&&p.abort(a),w(0,a);return this}};h.promise(v),v.success=v.done,v.error=v.fail,v.complete=i.add,v.statusCode=function(a){if(a){var b;if(s<2)for(b in a)j[b]=[j[b],a[b]];else b=a[v.status],v.then(b,b)}return this},d.url=((a||d.url)+"").replace(bG,"").replace(bL,bW[1]+"//"),d.dataTypes=f.trim(d.dataType||"*").toLowerCase().split(bP),d.crossDomain==null&&(r=bR.exec(d.url.toLowerCase()),d.crossDomain=!(!r||r[1]==bW[1]&&r[2]==bW[2]&&(r[3]||(r[1]==="http:"?80:443))==(bW[3]||(bW[1]==="http:"?80:443)))),d.data&&d.processData&&typeof d.data!="string"&&(d.data=f.param(d.data,d.traditional)),b$(bT,d,c,v);if(s===2)return!1;t=d.global,d.type=d.type.toUpperCase(),d.hasContent=!bK.test(d.type),t&&f.active++===0&&f.event.trigger("ajaxStart");if(!d.hasContent){d.data&&(d.url+=(bM.test(d.url)?"&":"?")+d.data,delete d.data),k=d.url;if(d.cache===!1){var x=f.now(),y=d.url.replace(bQ,"$1_="+x);d.url=y+(y===d.url?(bM.test(d.url)?"&":"?")+"_="+x:"")}}(d.data&&d.hasContent&&d.contentType!==!1||c.contentType)&&v.setRequestHeader("Content-Type",d.contentType),d.ifModified&&(k=k||d.url,f.lastModified[k]&&v.setRequestHeader("If-Modified-Since",f.lastModified[k]),f.etag[k]&&v.setRequestHeader("If-None-Match",f.etag[k])),v.setRequestHeader("Accept",d.dataTypes[0]&&d.accepts[d.dataTypes[0]]?d.accepts[d.dataTypes[0]]+(d.dataTypes[0]!=="*"?", "+bX+"; q=0.01":""):d.accepts["*"]);for(u in d.headers)v.setRequestHeader(u,d.headers[u]);if(d.beforeSend&&(d.beforeSend.call(e,v,d)===!1||s===2)){v.abort();return!1}for(u in{success:1,error:1,complete:1})v[u](d[u]);p=b$(bU,d,c,v);if(!p)w(-1,"No Transport");else{v.readyState=1,t&&g.trigger("ajaxSend",[v,d]),d.async&&d.timeout>0&&(q=setTimeout(function(){v.abort("timeout")},d.timeout));try{s=1,p.send(l,w)}catch(z){if(s<2)w(-1,z);else throw z}}return v},param:function(a,c){var d=[],e=function(a,b){b=f.isFunction(b)?b():b,d[d.length]=encodeURIComponent(a)+"="+encodeURIComponent(b)};c===b&&(c=f.ajaxSettings.traditional);if(f.isArray(a)||a.jquery&&!f.isPlainObject(a))f.each(a,function(){e(this.name,this.value)});else for(var g in a)ca(g,a[g],c,e);return d.join("&").replace(bD,"+")}}),f.extend({active:0,lastModified:{},etag:{}});var cd=f.now(),ce=/(\=)\?(&|$)|\?\?/i;f.ajaxSetup({jsonp:"callback",jsonpCallback:function(){return f.expando+"_"+cd++}}),f.ajaxPrefilter("json jsonp",function(b,c,d){var e=b.contentType==="application/x-www-form-urlencoded"&&typeof b.data=="string";if(b.dataTypes[0]==="jsonp"||b.jsonp!==!1&&(ce.test(b.url)||e&&ce.test(b.data))){var g,h=b.jsonpCallback=f.isFunction(b.jsonpCallback)?b.jsonpCallback():b.jsonpCallback,i=a[h],j=b.url,k=b.data,l="$1"+h+"$2";b.jsonp!==!1&&(j=j.replace(ce,l),b.url===j&&(e&&(k=k.replace(ce,l)),b.data===k&&(j+=(/\?/.test(j)?"&":"?")+b.jsonp+"="+h))),b.url=j,b.data=k,a[h]=function(a){g=[a]},d.always(function(){a[h]=i,g&&f.isFunction(i)&&a[h](g[0])}),b.converters["script json"]=function(){g||f.error(h+" was not called");return g[0]},b.dataTypes[0]="json";return"script"}}),f.ajaxSetup({accepts:{script:"text/javascript, application/javascript, application/ecmascript, application/x-ecmascript"},contents:{script:/javascript|ecmascript/},converters:{"text script":function(a){f.globalEval(a);return a}}}),f.ajaxPrefilter("script",function(a){a.cache===b&&(a.cache=!1),a.crossDomain&&(a.type="GET",a.global=!1)}),f.ajaxTransport("script",function(a){if(a.crossDomain){var d,e=c.head||c.getElementsByTagName("head")[0]||c.documentElement;return{send:function(f,g){d=c.createElement("script"),d.async="async",a.scriptCharset&&(d.charset=a.scriptCharset),d.src=a.url,d.onload=d.onreadystatechange=function(a,c){if(c||!d.readyState||/loaded|complete/.test(d.readyState))d.onload=d.onreadystatechange=null,e&&d.parentNode&&e.removeChild(d),d=b,c||g(200,"success")},e.insertBefore(d,e.firstChild)},abort:function(){d&&d.onload(0,1)}}}});var cf=a.ActiveXObject?function(){for(var a in ch)ch[a](0,1)}:!1,cg=0,ch;f.ajaxSettings.xhr=a.ActiveXObject?function(){return!this.isLocal&&ci()||cj()}:ci,function(a){f.extend(f.support,{ajax:!!a,cors:!!a&&"withCredentials"in a})}(f.ajaxSettings.xhr()),f.support.ajax&&f.ajaxTransport(function(c){if(!c.crossDomain||f.support.cors){var d;return{send:function(e,g){var h=c.xhr(),i,j;c.username?h.open(c.type,c.url,c.async,c.username,c.password):h.open(c.type,c.url,c.async);if(c.xhrFields)for(j in c.xhrFields)h[j]=c.xhrFields[j];c.mimeType&&h.overrideMimeType&&h.overrideMimeType(c.mimeType),!c.crossDomain&&!e["X-Requested-With"]&&(e["X-Requested-With"]="XMLHttpRequest");try{for(j in e)h.setRequestHeader(j,e[j])}catch(k){}h.send(c.hasContent&&c.data||null),d=function(a,e){var j,k,l,m,n;try{if(d&&(e||h.readyState===4)){d=b,i&&(h.onreadystatechange=f.noop,cf&&delete ch[i]);if(e)h.readyState!==4&&h.abort();else{j=h.status,l=h.getAllResponseHeaders(),m={},n=h.responseXML,n&&n.documentElement&&(m.xml=n),m.text=h.responseText;try{k=h.statusText}catch(o){k=""}!j&&c.isLocal&&!c.crossDomain?j=m.text?200:404:j===1223&&(j=204)}}}catch(p){e||g(-1,p)}m&&g(j,k,m,l)},!c.async||h.readyState===4?d():(i=++cg,cf&&(ch||(ch={},f(a).unload(cf)),ch[i]=d),h.onreadystatechange=d)},abort:function(){d&&d(0,1)}}}});var ck={},cl,cm,cn=/^(?:toggle|show|hide)$/,co=/^([+\-]=)?([\d+.\-]+)([a-z%]*)$/i,cp,cq=[["height","marginTop","marginBottom","paddingTop","paddingBottom"],["width","marginLeft","marginRight","paddingLeft","paddingRight"],["opacity"]],cr;f.fn.extend({show:function(a,b,c){var d,e;if(a||a===0)return this.animate(cu("show",3),a,b,c);for(var g=0,h=this.length;g
=i.duration+this.startTime){this.now=this.end,this.pos=this.state=1,this.update(),i.animatedProperties[this.prop]=!0;for(b in i.animatedProperties)i.animatedProperties[b]!==!0&&(g=!1);if(g){i.overflow!=null&&!f.support.shrinkWrapBlocks&&f.each(["","X","Y"],function(a,b){h.style["overflow"+b]=i.overflow[a]}),i.hide&&f(h).hide();if(i.hide||i.show)for(b in i.animatedProperties)f.style(h,b,i.orig[b]),f.removeData(h,"fxshow"+b,!0),f.removeData(h,"toggle"+b,!0);d=i.complete,d&&(i.complete=!1,d.call(h))}return!1}i.duration==Infinity?this.now=e:(c=e-this.startTime,this.state=c/i.duration,this.pos=f.easing[i.animatedProperties[this.prop]](this.state,c,0,1,i.duration),this.now=this.start+(this.end-this.start)*this.pos),this.update();return!0}},f.extend(f.fx,{tick:function(){var a,b=f.timers,c=0;for(;c-1,k={},l={},m,n;j?(l=e.position(),m=l.top,n=l.left):(m=parseFloat(h)||0,n=parseFloat(i)||0),f.isFunction(b)&&(b=b.call(a,c,g)),b.top!=null&&(k.top=b.top-g.top+m),b.left!=null&&(k.left=b.left-g.left+n),"using"in b?b.using.call(a,k):e.css(k)}},f.fn.extend({position:function(){if(!this[0])return null;var a=this[0],b=this.offsetParent(),c=this.offset(),d=cx.test(b[0].nodeName)?{top:0,left:0}:b.offset();c.top-=parseFloat(f.css(a,"marginTop"))||0,c.left-=parseFloat(f.css(a,"marginLeft"))||0,d.top+=parseFloat(f.css(b[0],"borderTopWidth"))||0,d.left+=parseFloat(f.css(b[0],"borderLeftWidth"))||0;return{top:c.top-d.top,left:c.left-d.left}},offsetParent:function(){return this.map(function(){var a=this.offsetParent||c.body;while(a&&!cx.test(a.nodeName)&&f.css(a,"position")==="static")a=a.offsetParent;return a})}}),f.each(["Left","Top"],function(a,c){var d="scroll"+c;f.fn[d]=function(c){var e,g;if(c===b){e=this[0];if(!e)return null;g=cy(e);return g?"pageXOffset"in g?g[a?"pageYOffset":"pageXOffset"]:f.support.boxModel&&g.document.documentElement[d]||g.document.body[d]:e[d]}return this.each(function(){g=cy(this),g?g.scrollTo(a?f(g).scrollLeft():c,a?c:f(g).scrollTop()):this[d]=c})}}),f.each(["Height","Width"],function(a,c){var d=c.toLowerCase();f.fn["inner"+c]=function(){var a=this[0];return a?a.style?parseFloat(f.css(a,d,"padding")):this[d]():null},f.fn["outer"+c]=function(a){var b=this[0];return b?b.style?parseFloat(f.css(b,d,a?"margin":"border")):this[d]():null},f.fn[d]=function(a){var e=this[0];if(!e)return a==null?null:this;if(f.isFunction(a))return this.each(function(b){var c=f(this);c[d](a.call(this,b,c[d]()))});if(f.isWindow(e)){var g=e.document.documentElement["client"+c],h=e.document.body;return e.document.compatMode==="CSS1Compat"&&g||h&&h["client"+c]||g}if(e.nodeType===9)return Math.max(e.documentElement["client"+c],e.body["scroll"+c],e.documentElement["scroll"+c],e.body["offset"+c],e.documentElement["offset"+c]);if(a===b){var i=f.css(e,d),j=parseFloat(i);return f.isNumeric(j)?j:i}return this.css(d,typeof a=="string"?a:a+"px")}}),a.jQuery=a.$=f,typeof define=="function"&&define.amd&&define.amd.jQuery&&define("jquery",[],function(){return f})})(window);
\ No newline at end of file
diff --git a/demo/scripts/jquery.easing.1.3.js b/demo/scripts/jquery.easing.1.3.js
new file mode 100755
index 0000000..d65948d
--- /dev/null
+++ b/demo/scripts/jquery.easing.1.3.js
@@ -0,0 +1,205 @@
+/*
+ * jQuery Easing v1.3 - http://gsgd.co.uk/sandbox/jquery/easing/
+ *
+ * Uses the built in easing capabilities added In jQuery 1.1
+ * to offer multiple easing options
+ *
+ * TERMS OF USE - jQuery Easing
+ *
+ * Open source under the BSD License.
+ *
+ * Copyright © 2008 George McGinley Smith
+ * All rights reserved.
+ *
+ * Redistribution and use in source and binary forms, with or without modification,
+ * are permitted provided that the following conditions are met:
+ *
+ * Redistributions of source code must retain the above copyright notice, this list of
+ * conditions and the following disclaimer.
+ * Redistributions in binary form must reproduce the above copyright notice, this list
+ * of conditions and the following disclaimer in the documentation and/or other materials
+ * provided with the distribution.
+ *
+ * Neither the name of the author nor the names of contributors may be used to endorse
+ * or promote products derived from this software without specific prior written permission.
+ *
+ * THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND ANY
+ * EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF
+ * MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE
+ * COPYRIGHT OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL,
+ * EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE
+ * GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED
+ * AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING
+ * NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED
+ * OF THE POSSIBILITY OF SUCH DAMAGE.
+ *
+*/
+
+// t: current time, b: begInnIng value, c: change In value, d: duration
+jQuery.easing['jswing'] = jQuery.easing['swing'];
+
+jQuery.extend( jQuery.easing,
+{
+ def: 'easeOutQuad',
+ swing: function (x, t, b, c, d) {
+ //alert(jQuery.easing.default);
+ return jQuery.easing[jQuery.easing.def](x, t, b, c, d);
+ },
+ easeInQuad: function (x, t, b, c, d) {
+ return c*(t/=d)*t + b;
+ },
+ easeOutQuad: function (x, t, b, c, d) {
+ return -c *(t/=d)*(t-2) + b;
+ },
+ easeInOutQuad: function (x, t, b, c, d) {
+ if ((t/=d/2) < 1) return c/2*t*t + b;
+ return -c/2 * ((--t)*(t-2) - 1) + b;
+ },
+ easeInCubic: function (x, t, b, c, d) {
+ return c*(t/=d)*t*t + b;
+ },
+ easeOutCubic: function (x, t, b, c, d) {
+ return c*((t=t/d-1)*t*t + 1) + b;
+ },
+ easeInOutCubic: function (x, t, b, c, d) {
+ if ((t/=d/2) < 1) return c/2*t*t*t + b;
+ return c/2*((t-=2)*t*t + 2) + b;
+ },
+ easeInQuart: function (x, t, b, c, d) {
+ return c*(t/=d)*t*t*t + b;
+ },
+ easeOutQuart: function (x, t, b, c, d) {
+ return -c * ((t=t/d-1)*t*t*t - 1) + b;
+ },
+ easeInOutQuart: function (x, t, b, c, d) {
+ if ((t/=d/2) < 1) return c/2*t*t*t*t + b;
+ return -c/2 * ((t-=2)*t*t*t - 2) + b;
+ },
+ easeInQuint: function (x, t, b, c, d) {
+ return c*(t/=d)*t*t*t*t + b;
+ },
+ easeOutQuint: function (x, t, b, c, d) {
+ return c*((t=t/d-1)*t*t*t*t + 1) + b;
+ },
+ easeInOutQuint: function (x, t, b, c, d) {
+ if ((t/=d/2) < 1) return c/2*t*t*t*t*t + b;
+ return c/2*((t-=2)*t*t*t*t + 2) + b;
+ },
+ easeInSine: function (x, t, b, c, d) {
+ return -c * Math.cos(t/d * (Math.PI/2)) + c + b;
+ },
+ easeOutSine: function (x, t, b, c, d) {
+ return c * Math.sin(t/d * (Math.PI/2)) + b;
+ },
+ easeInOutSine: function (x, t, b, c, d) {
+ return -c/2 * (Math.cos(Math.PI*t/d) - 1) + b;
+ },
+ easeInExpo: function (x, t, b, c, d) {
+ return (t==0) ? b : c * Math.pow(2, 10 * (t/d - 1)) + b;
+ },
+ easeOutExpo: function (x, t, b, c, d) {
+ return (t==d) ? b+c : c * (-Math.pow(2, -10 * t/d) + 1) + b;
+ },
+ easeInOutExpo: function (x, t, b, c, d) {
+ if (t==0) return b;
+ if (t==d) return b+c;
+ if ((t/=d/2) < 1) return c/2 * Math.pow(2, 10 * (t - 1)) + b;
+ return c/2 * (-Math.pow(2, -10 * --t) + 2) + b;
+ },
+ easeInCirc: function (x, t, b, c, d) {
+ return -c * (Math.sqrt(1 - (t/=d)*t) - 1) + b;
+ },
+ easeOutCirc: function (x, t, b, c, d) {
+ return c * Math.sqrt(1 - (t=t/d-1)*t) + b;
+ },
+ easeInOutCirc: function (x, t, b, c, d) {
+ if ((t/=d/2) < 1) return -c/2 * (Math.sqrt(1 - t*t) - 1) + b;
+ return c/2 * (Math.sqrt(1 - (t-=2)*t) + 1) + b;
+ },
+ easeInElastic: function (x, t, b, c, d) {
+ var s=1.70158;var p=0;var a=c;
+ if (t==0) return b; if ((t/=d)==1) return b+c; if (!p) p=d*.3;
+ if (a < Math.abs(c)) { a=c; var s=p/4; }
+ else var s = p/(2*Math.PI) * Math.asin (c/a);
+ return -(a*Math.pow(2,10*(t-=1)) * Math.sin( (t*d-s)*(2*Math.PI)/p )) + b;
+ },
+ easeOutElastic: function (x, t, b, c, d) {
+ var s=1.70158;var p=0;var a=c;
+ if (t==0) return b; if ((t/=d)==1) return b+c; if (!p) p=d*.3;
+ if (a < Math.abs(c)) { a=c; var s=p/4; }
+ else var s = p/(2*Math.PI) * Math.asin (c/a);
+ return a*Math.pow(2,-10*t) * Math.sin( (t*d-s)*(2*Math.PI)/p ) + c + b;
+ },
+ easeInOutElastic: function (x, t, b, c, d) {
+ var s=1.70158;var p=0;var a=c;
+ if (t==0) return b; if ((t/=d/2)==2) return b+c; if (!p) p=d*(.3*1.5);
+ if (a < Math.abs(c)) { a=c; var s=p/4; }
+ else var s = p/(2*Math.PI) * Math.asin (c/a);
+ if (t < 1) return -.5*(a*Math.pow(2,10*(t-=1)) * Math.sin( (t*d-s)*(2*Math.PI)/p )) + b;
+ return a*Math.pow(2,-10*(t-=1)) * Math.sin( (t*d-s)*(2*Math.PI)/p )*.5 + c + b;
+ },
+ easeInBack: function (x, t, b, c, d, s) {
+ if (s == undefined) s = 1.70158;
+ return c*(t/=d)*t*((s+1)*t - s) + b;
+ },
+ easeOutBack: function (x, t, b, c, d, s) {
+ if (s == undefined) s = 1.70158;
+ return c*((t=t/d-1)*t*((s+1)*t + s) + 1) + b;
+ },
+ easeInOutBack: function (x, t, b, c, d, s) {
+ if (s == undefined) s = 1.70158;
+ if ((t/=d/2) < 1) return c/2*(t*t*(((s*=(1.525))+1)*t - s)) + b;
+ return c/2*((t-=2)*t*(((s*=(1.525))+1)*t + s) + 2) + b;
+ },
+ easeInBounce: function (x, t, b, c, d) {
+ return c - jQuery.easing.easeOutBounce (x, d-t, 0, c, d) + b;
+ },
+ easeOutBounce: function (x, t, b, c, d) {
+ if ((t/=d) < (1/2.75)) {
+ return c*(7.5625*t*t) + b;
+ } else if (t < (2/2.75)) {
+ return c*(7.5625*(t-=(1.5/2.75))*t + .75) + b;
+ } else if (t < (2.5/2.75)) {
+ return c*(7.5625*(t-=(2.25/2.75))*t + .9375) + b;
+ } else {
+ return c*(7.5625*(t-=(2.625/2.75))*t + .984375) + b;
+ }
+ },
+ easeInOutBounce: function (x, t, b, c, d) {
+ if (t < d/2) return jQuery.easing.easeInBounce (x, t*2, 0, c, d) * .5 + b;
+ return jQuery.easing.easeOutBounce (x, t*2-d, 0, c, d) * .5 + c*.5 + b;
+ }
+});
+
+/*
+ *
+ * TERMS OF USE - EASING EQUATIONS
+ *
+ * Open source under the BSD License.
+ *
+ * Copyright © 2001 Robert Penner
+ * All rights reserved.
+ *
+ * Redistribution and use in source and binary forms, with or without modification,
+ * are permitted provided that the following conditions are met:
+ *
+ * Redistributions of source code must retain the above copyright notice, this list of
+ * conditions and the following disclaimer.
+ * Redistributions in binary form must reproduce the above copyright notice, this list
+ * of conditions and the following disclaimer in the documentation and/or other materials
+ * provided with the distribution.
+ *
+ * Neither the name of the author nor the names of contributors may be used to endorse
+ * or promote products derived from this software without specific prior written permission.
+ *
+ * THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND ANY
+ * EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF
+ * MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE
+ * COPYRIGHT OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL,
+ * EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE
+ * GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED
+ * AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING
+ * NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED
+ * OF THE POSSIBILITY OF SUCH DAMAGE.
+ *
+ */
\ No newline at end of file
diff --git a/demo/scripts/prism.js b/demo/scripts/prism.js
new file mode 100644
index 0000000..253198b
--- /dev/null
+++ b/demo/scripts/prism.js
@@ -0,0 +1,501 @@
+/**
+ * Prism: Lightweight, robust, elegant syntax highlighting
+ * MIT license http://www.opensource.org/licenses/mit-license.php/
+ * @author Lea Verou http://lea.verou.me
+ */
+
+(function(){
+
+// Private helper vars
+var lang = /\blang(?:uage)?-(?!\*)(\w+)\b/i;
+
+var _ = self.Prism = {
+ languages: {
+ insertBefore: function (inside, before, insert, root) {
+ root = root || _.languages;
+ var grammar = root[inside];
+ var ret = {};
+
+ for (var token in grammar) {
+
+ if (grammar.hasOwnProperty(token)) {
+
+ if (token == before) {
+
+ for (var newToken in insert) {
+
+ if (insert.hasOwnProperty(newToken)) {
+ ret[newToken] = insert[newToken];
+ }
+ }
+ }
+
+ ret[token] = grammar[token];
+ }
+ }
+
+ return root[inside] = ret;
+ },
+
+ DFS: function(o, callback) {
+ for (var i in o) {
+ callback.call(o, i, o[i]);
+
+ if (Object.prototype.toString.call(o) === '[object Object]') {
+ _.languages.DFS(o[i], callback);
+ }
+ }
+ }
+ },
+
+ highlightAll: function(async, callback) {
+ var elements = document.querySelectorAll('code[class*="language-"], [class*="language-"] code, code[class*="lang-"], [class*="lang-"] code');
+
+ for (var i=0, element; element = elements[i++];) {
+ _.highlightElement(element, async === true, callback);
+ }
+ },
+
+ highlightElement: function(element, async, callback) {
+ // Find language
+ var language, grammar, parent = element;
+
+ while (parent && !lang.test(parent.className)) {
+ parent = parent.parentNode;
+ }
+
+ if (parent) {
+ language = (parent.className.match(lang) || [,''])[1];
+ grammar = _.languages[language];
+ }
+
+ if (!grammar) {
+ return;
+ }
+
+ // Set language on the element, if not present
+ element.className = element.className.replace(lang, '').replace(/\s+/g, ' ') + ' language-' + language;
+
+ // Set language on the parent, for styling
+ parent = element.parentNode;
+
+ if (/pre/i.test(parent.nodeName)) {
+ parent.className = parent.className.replace(lang, '').replace(/\s+/g, ' ') + ' language-' + language;
+ }
+
+ var code = element.textContent.trim();
+
+ if(!code) {
+ return;
+ }
+
+ code = code.replace(/&/g, '&').replace(//g, '>').replace(/\u00a0/g, ' ');
+ //console.time(code.slice(0,50));
+
+ var env = {
+ element: element,
+ language: language,
+ grammar: grammar,
+ code: code
+ };
+
+ _.hooks.run('before-highlight', env);
+
+ if (async && self.Worker) {
+ var worker = new Worker(_.filename);
+
+ worker.onmessage = function(evt) {
+ env.highlightedCode = Token.stringify(JSON.parse(evt.data));
+ env.element.innerHTML = env.highlightedCode;
+
+ callback && callback.call(env.element);
+ //console.timeEnd(code.slice(0,50));
+ _.hooks.run('after-highlight', env);
+ };
+
+ worker.postMessage(JSON.stringify({
+ language: env.language,
+ code: env.code
+ }));
+ }
+ else {
+ env.highlightedCode = _.highlight(env.code, env.grammar)
+ env.element.innerHTML = env.highlightedCode;
+
+ callback && callback.call(element);
+
+ _.hooks.run('after-highlight', env);
+ //console.timeEnd(code.slice(0,50));
+ }
+ },
+
+ highlight: function (text, grammar) {
+ return Token.stringify(_.tokenize(text, grammar));
+ },
+
+ tokenize: function(text, grammar) {
+ var Token = _.Token;
+
+ var strarr = [text];
+
+ var rest = grammar.rest;
+
+ if (rest) {
+ for (var token in rest) {
+ grammar[token] = rest[token];
+ }
+
+ delete grammar.rest;
+ }
+
+ tokenloop: for (var token in grammar) {
+ if(!grammar.hasOwnProperty(token) || !grammar[token]) {
+ continue;
+ }
+
+ var pattern = grammar[token],
+ inside = pattern.inside,
+ lookbehind = !!pattern.lookbehind || 0;
+
+ pattern = pattern.pattern || pattern;
+
+ for (var i=0; i text.length) {
+ // Something went terribly wrong, ABORT, ABORT!
+ break tokenloop;
+ }
+
+ if (str instanceof Token) {
+ continue;
+ }
+
+ pattern.lastIndex = 0;
+
+ var match = pattern.exec(str);
+
+ if (match) {
+ if(lookbehind) {
+ lookbehind = match[1].length;
+ }
+
+ var from = match.index - 1 + lookbehind,
+ match = match[0].slice(lookbehind),
+ len = match.length,
+ to = from + len,
+ before = str.slice(0, from + 1),
+ after = str.slice(to + 1);
+
+ var args = [i, 1];
+
+ if (before) {
+ args.push(before);
+ }
+
+ var wrapped = new Token(token, inside? _.tokenize(match, inside) : match);
+
+ args.push(wrapped);
+
+ if (after) {
+ args.push(after);
+ }
+
+ Array.prototype.splice.apply(strarr, args);
+ }
+ }
+ }
+
+ return strarr;
+ },
+
+ hooks: {
+ all: {},
+
+ add: function (name, callback) {
+ var hooks = _.hooks.all;
+
+ hooks[name] = hooks[name] || [];
+
+ hooks[name].push(callback);
+ },
+
+ run: function (name, env) {
+ var callbacks = _.hooks.all[name];
+
+ if (!callbacks || !callbacks.length) {
+ return;
+ }
+
+ for (var i=0, callback; callback = callbacks[i++];) {
+ callback(env);
+ }
+ }
+ }
+};
+
+var Token = _.Token = function(type, content) {
+ this.type = type;
+ this.content = content;
+};
+
+Token.stringify = function(o) {
+ if (typeof o == 'string') {
+ return o;
+ }
+
+ if (Object.prototype.toString.call(o) == '[object Array]') {
+ for (var i=0; i<' + env.tag + ' class="' + env.classes.join(' ') + '" ' + attributes + '>' + env.content + '';
+
+};
+
+if (!self.document) {
+ // In worker
+ self.addEventListener('message', function(evt) {
+ var message = JSON.parse(evt.data),
+ lang = message.language,
+ code = message.code;
+
+ self.postMessage(JSON.stringify(_.tokenize(code, _.languages[lang])));
+ self.close();
+ }, false);
+
+ return;
+}
+
+// Get current script and highlight
+var script = document.getElementsByTagName('script');
+
+script = script[script.length - 1];
+
+if (script) {
+ _.filename = script.src;
+
+ if (document.addEventListener && !script.hasAttribute('data-manual')) {
+ document.addEventListener('DOMContentLoaded', _.highlightAll);
+ }
+}
+
+})();
+Prism.languages.markup = {
+ 'comment': /<!--[\w\W]*?--(>|>)/g,
+ 'prolog': /<\?.+?\?>/,
+ 'doctype': /<!DOCTYPE.+?>/,
+ 'cdata': /<!\[CDATA\[[\w\W]+?]]>/i,
+ 'tag': {
+ pattern: /<\/?[\w:-]+\s*[\w\W]*?>/gi,
+ inside: {
+ 'tag': {
+ pattern: /^<\/?[\w:-]+/i,
+ inside: {
+ 'punctuation': /^<\/?/,
+ 'namespace': /^[\w-]+?:/
+ }
+ },
+ 'attr-value': {
+ pattern: /=(('|")[\w\W]*?(\2)|[^\s>]+)/gi,
+ inside: {
+ 'punctuation': /=/g
+ }
+ },
+ 'punctuation': /\/?>/g,
+ 'attr-name': {
+ pattern: /[\w:-]+/g,
+ inside: {
+ 'namespace': /^[\w-]+?:/
+ }
+ }
+
+ }
+ },
+ 'entity': /&#?[\da-z]{1,8};/gi
+};
+
+// Plugin to make entity title show the real entity, idea by Roman Komarov
+Prism.hooks.add('wrap', function(env) {
+
+ if (env.type === 'entity') {
+ env.attributes['title'] = env.content.replace(/&/, '&');
+ }
+});
+Prism.languages.css = {
+ 'comment': /\/\*[\w\W]*?\*\//g,
+ 'atrule': /@[\w-]+?(\s+[^;{]+)?(?=\s*{|\s*;)/gi,
+ 'url': /url\((["']?).*?\1\)/gi,
+ 'selector': /[^\{\}\s][^\{\}]*(?=\s*\{)/g,
+ 'property': /(\b|\B)[a-z-]+(?=\s*:)/ig,
+ 'string': /("|')(\\?.)*?\1/g,
+ 'important': /\B!important\b/gi,
+ 'ignore': /&(lt|gt|amp);/gi,
+ 'punctuation': /[\{\};:]/g
+};
+
+if (Prism.languages.markup) {
+ Prism.languages.insertBefore('markup', 'tag', {
+ 'style': {
+ pattern: /(<|<)style[\w\W]*?(>|>)[\w\W]*?(<|<)\/style(>|>)/ig,
+ inside: {
+ 'tag': {
+ pattern: /(<|<)style[\w\W]*?(>|>)|(<|<)\/style(>|>)/ig,
+ inside: Prism.languages.markup.tag.inside
+ },
+ rest: Prism.languages.css
+ }
+ }
+ });
+}
+Prism.languages.javascript = {
+ 'comment': {
+ pattern: /(^|[^\\])(\/\*[\w\W]*?\*\/|\/\/.*?(\r?\n|$))/g,
+ lookbehind: true
+ },
+ 'string': /("|')(\\?.)*?\1/g,
+ 'regex': {
+ pattern: /(^|[^/])\/(?!\/)(\[.+?]|\\.|[^/\r\n])+\/[gim]{0,3}(?=\s*($|[\r\n,.;})]))/g,
+ lookbehind: true
+ },
+ 'keyword': /\b(var|let|if|else|while|do|for|return|in|instanceof|function|new|with|typeof|try|catch|finally|null|break|continue)\b/g,
+ 'boolean': /\b(true|false)\b/g,
+ 'number': /\b-?(0x)?\d*\.?\d+\b/g,
+ 'operator': /[-+]{1,2}|!|=?<|=?>|={1,2}|(&){1,2}|\|?\||\?|\*|\//g,
+ 'ignore': /&(lt|gt|amp);/gi,
+ 'punctuation': /[{}[\];(),.:]/g
+};
+
+if (Prism.languages.markup) {
+ Prism.languages.insertBefore('markup', 'tag', {
+ 'script': {
+ pattern: /(<|<)script[\w\W]*?(>|>)[\w\W]*?(<|<)\/script(>|>)/ig,
+ inside: {
+ 'tag': {
+ pattern: /(<|<)script[\w\W]*?(>|>)|(<|<)\/script(>|>)/ig,
+ inside: Prism.languages.markup.tag.inside
+ },
+ rest: Prism.languages.javascript
+ }
+ }
+ });
+}
+(function(){
+
+if(!window.Prism) {
+ return;
+}
+
+function $$(expr, con) {
+ return Array.prototype.slice.call((con || document).querySelectorAll(expr));
+}
+
+var CRLF = crlf = /\r?\n|\r/g;
+
+function highlightLines(pre, lines, classes) {
+ var ranges = lines.replace(/\s+/g, '').split(','),
+ offset = +pre.getAttribute('data-line-offset') || 0;
+
+ var lineHeight = parseFloat(getComputedStyle(pre).lineHeight);
+
+ for (var i=0, range; range = ranges[i++];) {
+ range = range.split('-');
+
+ var start = +range[0],
+ end = +range[1] || start;
+
+ var line = document.createElement('div');
+
+ line.textContent = Array(end - start + 2).join(' \r\n');
+ line.className = (classes || '') + ' line-highlight';
+ line.setAttribute('data-start', start);
+
+ if(end > start) {
+ line.setAttribute('data-end', end);
+ }
+
+ line.style.top = (start - offset - 1) * lineHeight + 'px';
+
+ (pre.querySelector('code') || pre).appendChild(line);
+ }
+}
+
+function applyHash() {
+ var hash = location.hash.slice(1);
+
+ // Remove pre-existing temporary lines
+ $$('.temporary.line-highlight').forEach(function (line) {
+ line.parentNode.removeChild(line);
+ });
+
+ var range = (hash.match(/\.([\d,-]+)$/) || [,''])[1];
+
+ if (!range || document.getElementById(hash)) {
+ return;
+ }
+
+ var id = hash.slice(0, hash.lastIndexOf('.')),
+ pre = document.getElementById(id);
+
+ if (!pre) {
+ return;
+ }
+
+ if (!pre.hasAttribute('data-line')) {
+ pre.setAttribute('data-line', '');
+ }
+
+ highlightLines(pre, range, 'temporary ');
+
+ document.querySelector('.temporary.line-highlight').scrollIntoView();
+}
+
+var fakeTimer = 0; // Hack to limit the number of times applyHash() runs
+
+Prism.hooks.add('after-highlight', function(env) {
+ var pre = env.element.parentNode;
+ var lines = pre && pre.getAttribute('data-line');
+
+ if (!pre || !lines || !/pre/i.test(pre.nodeName)) {
+ return;
+ }
+
+ clearTimeout(fakeTimer);
+
+ $$('.line-highlight', pre).forEach(function (line) {
+ line.parentNode.removeChild(line);
+ });
+
+ highlightLines(pre, lines);
+
+ fakeTimer = setTimeout(applyHash, 1);
+});
+
+addEventListener('hashchange', applyHash);
+
+})();
diff --git a/jquery.superLabels.js b/jquery.superLabels.js
index 43715ec..a464328 100644
--- a/jquery.superLabels.js
+++ b/jquery.superLabels.js
@@ -1,87 +1,130 @@
-/*
+/*global console */
+/*!
* Title: jQuery Super Labels Plugin - Give your forms a helping of awesome!
* Author: Rémy Bach
- * Version: 1.0
+ * Version: 2.0.3
* License: http://remybach.mit-license.org
* Url: http://github.com/remybach/jQuery.superLabels
* Description:
* This plugin allows you to display your form labels on top of your form fields, saving you space on your page.
*/
-(function($) {
+;(function($) {
+ 'use strict';
+
var defaults = {
- baseZindex:0, // The base z-index which we display on top of.
- debug:false,
- duration:500, // Time of the slide in milliseconds.
- easingIn:($.easing.def ? 'easeInOutCubic' : false), // The easing in function to use for the slide.
- easingOut:($.easing.def ? 'easeInOutCubic' : false), // The easing out function to use for the slide.
- fadeDuration:250, // Duration of animation when it's fade only.
- labelLeft:0, // The distance from the left for the label.
- labelTop:0, // The distance from the top for the label.
- opacity:0.5, // The opacity to fade the label to.
- slide:true, // Whether or not to slide the label across the input field.
- wrapSelector:false // The selector for the element you have wrapping each field.
- };
+ autoCharLimit:false, // Whether to automatically attempt to determine the number of characters after which to fade the label out or not.
+ baseZindex:0, // The base z-index which we display on top of.
+ /* nominify */
+ debug:false,
+ /* /nominify */
+ duration:500, // Time of the slide in milliseconds.
+ easingIn:($.easing && $.easing.def ? 'easeInOutCubic' : false), // The easing in function to use for the slide.
+ easingOut:($.easing && $.easing.def ? 'easeInOutCubic' : false), // The easing out function to use for the slide.
+ fadeDuration:250, // Duration of animation when it's fade only.
+ labelLeft:0, // The distance from the left for the label.
+ labelTop:0, // The distance from the top for the label.
+ noAnimate:false, // Whether or not to animate (slide and fade) the label. If true, we'll just hide it.
+ opacity:0.5, // The opacity to fade the label to.
+ slide:true, // Whether or not to slide the label across the input field.
+ wrapSelector:false // The selector for the element you have wrapping each field.
+ },
+ acceptedInputTypes = ['text', 'search', 'url', 'tel', 'email', 'password', 'number'],
+ acceptedElements = ['input', 'textarea', 'select'],
- var acceptedInputTypes = ['text', 'search', 'url', 'tel', 'email', 'password'];
- var acceptedElements = ['input', 'textarea', 'select'];
+ // Function declarations
+ _getLabel, _prepLabel, _focus, _blur, _keyup, _noVal, _withinCharLimit, _approximateChars/* nominify */,_log, _info, _error/* /nominify */;
$.fn.superLabels = function(options) {
+ var _fields = [],
+ _newDefaults;
+
// If this has been run on an empty set of elements, pop out.
- if (this.length === 0) return false;
-
+ if (this.length === 0) { return false; }
+
+ // Make a copy of the defaults.
+ _newDefaults = $.extend({}, defaults);
// If options were passed in, merge them with the defaults.
- $.extend(defaults, options || {});
- if (!$.easing.def) { _info('Easing plugin not found - using standard jQuery animations.'); }
+ // Store them on each element so that they don't get overwritten by subsequent calls
+ // to superLabels.
+ $(this).data('slDefaults', $.extend(_newDefaults, options || {})).addClass('sl-defaults');
- var _fields = this;
+ /* nominify */
+ if (!$.easing.def) { _info('Easing plugin not found - using standard jQuery animations.'); }
+ /* /nominify */
- // Check for whether the user has just passed in the form. If so, we need to fetch all the accepted fields, etc..
- if (this.length === 1 && this[0].tagName.match(/form/i)) {
+ // Check for whether the user has just passed in the form. If so, we need to fetch all the accepted fields.
+ if (this.length === 1 && /form/i.test(this[0].tagName)) {
_fields = $(acceptedElements.join(','), this);
+ } else if (this.length > 1) { // we need to extrapolate these fields
+ this.each(function() {
+ if (/form/i.test(this.tagName)) { // if this is a form merge the accepted elements into the _fields array.
+ $.merge(_fields, $(acceptedElements.join(','), this));
+ } else {
+ // This is a normal field, so just dump this one in.
+ _fields.push(this);
+ }
+ });
+ } else { // If all else fails, assume the user passed in the fields individually
+ _fields = this;
}
// Do our magic on each form field.
- return _fields.each(function() {
- var _field = $(this);
-
+ return $(_fields).each(function() {
+ var _field = $(this),
+ _label,
+ _placeholder = _field.attr('placeholder'),
+ _placeholderLabel;
+
// Don't even bother going further if this isn't one of the accepted input field types or elements.
- if ($.inArray(_field.attr('type'), acceptedInputTypes) === -1 && $.inArray(_field[0].tagName.toLowerCase(), acceptedElements) !== -1) {
+ if ((_field[0].tagName.toLowerCase() === 'input' && $.inArray(_field.attr('type'), acceptedInputTypes)) === -1 && $.inArray(_field[0].tagName.toLowerCase(), acceptedElements) !== -1) {
+ /* nominify */
_info('Doh! The following '+this.tagName.toLowerCase()+', is not supported.', this);
+ /* /nominify */
return true; // Equivalent to continue in a normal for loop.
}
- var _label = _getLabel(this);
- var _placeholder = _field.attr('placeholder');
+ // Get the label associated to this field.
+ _label = _getLabel(this);
- // Check for the placeholder attribute first.
+ // If there's a placeholder
if (_placeholder) {
- var _placeholderLabel = $('');
-
- // If there isn't a label for this field, create one, otherwise replace the existing one with the placeholder one.
+ // but NO label, make a label using the placeholder
if (_label.length === 0) {
+ _placeholderLabel = '';
+ _placeholderLabel+= '';
+ _placeholderLabel = $(_placeholderLabel);
+
+ // If there isn't a label for this field, create one, otherwise replace the existing one with the placeholder one.
_label = _placeholderLabel;
- _field.prev(_label);
+ _field.before(_label);
} else {
- _label.replaceWith(_placeholderLabel);
+ // Otherwise, just give the label a title with the placeholder
+ _label.attr('title', _placeholder);
}
_field.removeAttr('placeholder');
}
-
+
// Make sure this form field has a label
if (_label.length === 0) {
+ /* nominify */
_info('Doh! The following '+this.tagName.toLowerCase()+' has no related label.', this);
+ /* /nominify */
return true;
}
// Position the labels above the form fields. Note:We do this here and not in the CSS for the purposes of progressive enhancement.
_prepLabel(_field, _label);
-
+
// Select boxes don't need to have any fancy label stuff done.
if (!this.tagName.match(/select/i)) {
// What happens when we enter the field
_field.focus(_focus);
// What happens when we leave the field.
_field.blur(_blur);
+ _field.change(_blur);
+ // Autofil bug fixes
+ _field.bind('input', _keyup); // For the currently selected field.
+ _field.bind('propertychange', _blur);
// Check for when the user is typing
_field.keyup(_keyup);
// Make sure the field gets focus when the label is clicked on (for those people who don't use the 'for' attribute and deserve a kick to the face).
@@ -93,12 +136,14 @@
/*========== Private Functions ==========*/
// Get the label for a given field.
_getLabel = function(_field) {
- var _label = $(_field).siblings('label');
+ var _defaults = $(_field).closest('.sl-defaults').data('slDefaults'),
+ _label = $(_field).siblings('label'),
+ _for;
if (_label.length === 0) {
// If a selector is present for the wrapping element, use that, otherwise, proceed to use more traditional methods.
- if (defaults.wrapSelector) {
- _label = $(_field).parents(defaults.wrapSelector).find('label');
+ if (_defaults.wrapSelector) {
+ _label = $(_field).parents(_defaults.wrapSelector).find('label');
} else {
_for = _field.id || _field.name;
_label = $('[for="'+_for+'"]');
@@ -110,84 +155,191 @@
// Position the label.
_prepLabel = function(_field, _label) {
+ var _charLimitAttr = _field.data('slCharLimit'),
+ _defaults = $(_field).closest('.sl-defaults').data('slDefaults'),
+ _opacity = 0,
+ _selected;
+
// Handle drop down list labels differently
if (_field[0].tagName.match(/select/i)) {
// Checking whether the field has a value doesn't work (the browser just seems to select the first ');
_label.css('display','none');
} else {
- // If the field already has a value, then hide the label.
- if (!_noVal(_field)) _label.hide();
+ // If we need to figure out the length automatically (and this field isn't specifically excluded),
+ // or if this field is specifically requesting this functionality.
+ if (_charLimitAttr === 'auto' || (_defaults.autoCharLimit && isNaN(_charLimitAttr))) {
+ _approximateChars(_field, _label);
+ }
+
+ // If the field is empty, make the label fully opaque.
+ if (_noVal(_field)) {
+ _opacity = 1;
+ // Otherwise, if the field is not empty, but below the character limit (if any), use the passed in option.
+ } else if (_withinCharLimit(_field)) {
+ _opacity = _defaults._opacity;
+ }
- _field.css({ zIndex:defaults.baseZindex+1 }).addClass('sl_field');
+ _field.css({ zIndex:_defaults.baseZindex+1 }).addClass('sl_field');
_label.css({
- left:defaults.labelLeft,
+ left:_noVal(_field) ? _defaults.labelLeft : $(_field).width()-_label.width(),
+ opacity:_opacity,
position:'absolute',
- top:defaults.labelTop,
- zIndex:defaults.baseZindex+2
+ top:_defaults.labelTop,
+ zIndex:_defaults.baseZindex+2
}).addClass('sl_label');
}
};
- // The focus and blur functions
+ // The event handlers for the form fields.
_focus = function() {
+ var _defaults = $(this).closest('.sl-defaults').data('slDefaults'),
+ _duration = _defaults.duration,
+ _label,
+ _to = { opacity:0 };
+
if (_noVal(this)) {
- var _duration = defaults.duration;
- var _label = _getLabel(this);
- var _to ={ opacity:0 };
-
- if (defaults.slide) {
+ _label = _getLabel(this);
+
+ if (_defaults.noAnimate) {
+ _label.hide();
+ return false;
+ }
+
+ if (_defaults.slide) {
_to.left = $(this).width()-_label.width();
- _to.opacity = defaults.opacity;
+ _to.opacity = _defaults.opacity;
} else {
- _duration = defaults.fadeDuration;
+ _duration = _defaults.fadeDuration;
}
-
- _label.animate(_to, _duration, defaults.easingOut);
+
+ _label.stop(true,false).animate(_to, _duration, _defaults.easingOut);
}
};
_blur = function() {
- if (_noVal(this) ) {
- var _duration = defaults.duration;
- var _to ={ opacity:1 };
-
- if (defaults.slide) {
- _to.left = defaults.labelLeft;
+ var _defaults = $(this).closest('.sl-defaults').data('slDefaults'),
+ _duration = _defaults.duration,
+ _label,
+ _to ={ opacity:1 };
+
+ if (_noVal(this)) {
+ _label = _getLabel(this);
+
+ if (_defaults.noAnimate) {
+ _label.show();
+ return false;
+ }
+
+ if (_defaults.slide) {
+ _to.left = _defaults.labelLeft;
} else {
- _duration = defaults.fadeDuration;
+ _duration = _defaults.fadeDuration;
}
-
- _getLabel(this).animate(_to, _duration, defaults.easingOut);
+
+ _label.stop(true,false).animate(_to, _duration, _defaults.easingOut);
+ } else {
+ // If there is a value, and the label is visible, fire our _keyup function so as to hide it. (this semi-fixes the autofill bug)
+ _keyup.apply(this);
}
};
_keyup = function() {
- var _label = _getLabel(this);
- var _o = 0;
-
+ var _defaults = $(this).closest('.sl-defaults').data('slDefaults'),
+ _label,
+ _o = 0;
+
+ if (_defaults.noAnimate) {
+ return false; // We don't need any keyup checking done if we're not animating (the label would be in the way while trying to type).
+ }
+
+ _label = _getLabel(this);
+
// Let's check whether there's even a need to animate anything first.
- if ((_noVal(this) && _label.css('opacity') > 0) || (!_noVal(this) && _label.css('opacity') == 0 )) {
+ if ((_noVal(this) && _label.css('opacity') > 0) || (!_noVal(this) && _label.css('opacity') === 0 )) {
return false;
}
// If the field is empty and the label isn't showing, make it show up again.
- if (_noVal(this) && !_label.css('opacity') == 0) {
- _o = defaults.opacity;
+ if ((_noVal(this) && _label.css('opacity') !== 0) || _withinCharLimit(this)) {
+ _o = _defaults.opacity;
}
-
- _label.animate({ opacity:_o }, defaults.fadeDuration, defaults.easingOut);
+
+ _label.stop(true,false).animate({ opacity:_o }, _defaults.fadeDuration, _defaults.easingOut);
};
/*===== Utility Functions =====*/
// Tell us whether the form field has a value.
_noVal = function(_el) { return $(_el).val() === ''; };
-
+ // Tell us whether the form field meets a given character limit (if necessary)
+ _withinCharLimit = function(_el) {
+ var _limit = $(_el).data('slCharLimit');
+
+ // Stop here if there's no need to check for number of characters.
+ if (!_limit || typeof _limit !== 'number') {
+ return false;
+ }
+
+ // If this has a length property, we can assume this element is part of a
+ // jQuery object-like Array, thus: grab the DOM element from it (there should only be 1).
+ _el = _el.length ? _el[0] : _el;
+
+ return _limit && _el.value && _el.value.length <= _limit;
+ };
+ // Attempt to automatically set up the character limit and attach it to the field.
+ // This will only run once per field on page load.
+ _approximateChars = function(_field, _label) {
+ var _available,
+ _charLen,
+ _chars = '1234567890abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ',
+ _properties = ["font-family", "font-size", "font-weight", "letter-spacing", "line-height", "text-shadow", "text-transform"],
+ _tmp = $(''+_chars+'
');
+
+ // Loop through each of the defined properties so that we can get the font looking the same size.
+ // I know this isn't too great for performance, but for now I don't know of a better way to do this.
+ // If you do know of a better way, please hit me with a pull request.
+ $.each(_properties, function(i, _prop) {
+ _tmp.css(_prop, _field.css(_prop));
+ });
+
+ _tmp.css({
+ 'position':'absolute', // so it's out of the document flow.
+ 'visibility':'hidden' // so that it's not visible, but still takes up space in the DOM so we can grab the width
+ });
+
+ // Append this to the parent so that it can correctly replicate the style of the field.
+ _field.parent().append(_tmp);
+ // Get the average length *per character*
+ _charLen = Math.round(_tmp.width() / _chars.length);
+ // Remove our temporary div from the DOM.
+ _tmp.remove();
+
+ // Figure out how much room we have to work with here.
+ _available = _field.width() - _label.width();
+
+ // Set the data-sl-char-limit attribute for this field to our approximated value.
+ _field.data('slCharLimit', Math.floor(_available / _charLen));
+ };
+
+ /* nominify */
// Console Functions (We need these to make sure this only displays when the console exists.)
- _log = function() { if (defaults.debug && console && console.log) console.log.apply(console, arguments); };
- _info = function() { if (defaults.debug && console && console.info) console.info.apply(console, arguments); };
- _error = function() { if (defaults.debug && console && console.error) console.error.apply(console, arguments); };
+ _log = function() {
+ if (defaults.debug && console && console.log) {
+ console.log.apply(console, arguments);
+ }
+ };
+ _info = function() {
+ if (defaults.debug && console && console.info) {
+ console.info.apply(console, arguments);
+ }
+ };
+ _error = function() {
+ if (defaults.debug && console && console.error) {
+ console.error.apply(console, arguments);
+ }
+ };
+ /* /nominify */
})(jQuery);
\ No newline at end of file
diff --git a/jquery.superLabels.min.js b/jquery.superLabels.min.js
new file mode 100644
index 0000000..c2699c7
--- /dev/null
+++ b/jquery.superLabels.min.js
@@ -0,0 +1,10 @@
+/*!
+ * Title: jQuery Super Labels Plugin - Give your forms a helping of awesome!
+ * Author: Rémy Bach
+ * Version: 2.0.4
+ * License: http://remybach.mit-license.org
+ * Url: http://github.com/remybach/jQuery.superLabels
+ * Description:
+ * This plugin allows you to display your form labels on top of your form fields, saving you space on your page.
+ */
+;(function(t){"use strict";var e,a,i,s,n,l,o,r,d={autoCharLimit:!1,baseZindex:0,duration:500,easingIn:t.easing&&t.easing.def?"easeInOutCubic":!1,easingOut:t.easing&&t.easing.def?"easeInOutCubic":!1,fadeDuration:250,labelLeft:0,labelTop:0,noAnimate:!1,opacity:.5,slide:!0,wrapSelector:!1},u=["text","search","url","tel","email","password","number"],h=["input","textarea","select"];t.fn.superLabels=function(l){var o,r=[];return 0===this.length?!1:(o=t.extend({},d),t(this).data("slDefaults",t.extend(o,l||{})).addClass("sl-defaults"),1===this.length&&/form/i.test(this[0].tagName)?r=t(h.join(","),this):this.length>1?this.each(function(){/form/i.test(this.tagName)?t.merge(r,t(h.join(","),this)):r.push(this)}):r=this,t(r).each(function(){var l,o,r=t(this),d=r.attr("placeholder");return-1===("input"===r[0].tagName.toLowerCase()&&t.inArray(r.attr("type"),u))&&-1!==t.inArray(r[0].tagName.toLowerCase(),h)?!0:(l=e(this),d&&(0===l.length?(o='",o+="",o=t(o),l=o,r.before(l)):l.attr("title",d),r.removeAttr("placeholder")),0===l.length?!0:(a(r,l),this.tagName.match(/select/i)||(r.focus(i),r.blur(s),r.change(s),r.bind("input",n),r.bind("propertychange",s),r.keyup(n),l.click(function(){r.focus()})),void 0))}))},e=function(e){var a,i=t(e).closest(".sl-defaults").data("slDefaults"),s=t(e).siblings("label");return 0===s.length&&(i.wrapSelector?s=t(e).parents(i.wrapSelector).find("label"):(a=e.id||e.name,s=t('[for="'+a+'"]'))),s},a=function(e,a){var i,s=e.data("slCharLimit"),n=t(e).closest(".sl-defaults").data("slDefaults"),d=0;e[0].tagName.match(/select/i)?(i=0===e.find("[selected]").length?" selected":"",e.prepend('"),a.css("display","none")):(("auto"===s||n.autoCharLimit&&isNaN(s))&&r(e,a),l(e)?d=1:o(e)&&(d=n._opacity),e.css({zIndex:n.baseZindex+1}).addClass("sl_field"),a.css({left:l(e)?n.labelLeft:t(e).width()-a.width(),opacity:d,position:"absolute",top:n.labelTop,zIndex:n.baseZindex+2}).addClass("sl_label"))},i=function(){var a,i=t(this).closest(".sl-defaults").data("slDefaults"),s=i.duration,n={opacity:0};if(l(this)){if(a=e(this),i.noAnimate)return a.hide(),!1;i.slide?(n.left=t(this).width()-a.width(),n.opacity=i.opacity):s=i.fadeDuration,a.stop(!0,!1).animate(n,s,i.easingOut)}},s=function(){var a,i=t(this).closest(".sl-defaults").data("slDefaults"),s=i.duration,o={opacity:1};if(l(this)){if(a=e(this),i.noAnimate)return a.show(),!1;i.slide?o.left=i.labelLeft:s=i.fadeDuration,a.stop(!0,!1).animate(o,s,i.easingOut)}else n.apply(this)},n=function(){var a,i=t(this).closest(".sl-defaults").data("slDefaults"),s=0;return i.noAnimate?!1:(a=e(this),l(this)&&a.css("opacity")>0||!l(this)&&0===a.css("opacity")?!1:((l(this)&&0!==a.css("opacity")||o(this))&&(s=i.opacity),a.stop(!0,!1).animate({opacity:s},i.fadeDuration,i.easingOut),void 0))},l=function(e){return""===t(e).val()},o=function(e){var a=t(e).data("slCharLimit");return a&&"number"==typeof a?(e=e.length?e[0]:e,a&&e.value&&a>=e.value.length):!1},r=function(e,a){var i,s,n="1234567890abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ",l=["font-family","font-size","font-weight","letter-spacing","line-height","text-shadow","text-transform"],o=t(""+n+"
");t.each(l,function(t,a){o.css(a,e.css(a))}),o.css({position:"absolute",visibility:"hidden"}),e.parent().append(o),s=Math.round(o.width()/n.length),o.remove(),i=e.width()-a.width(),e.data("slCharLimit",Math.floor(i/s))}})(jQuery);
\ No newline at end of file
diff --git a/package.json b/package.json
new file mode 100644
index 0000000..6d3ba62
--- /dev/null
+++ b/package.json
@@ -0,0 +1,25 @@
+{
+ "name": "jQuery.superLabels",
+ "version": "2.0.4",
+ "description": "Give your forms a helping of awesome!",
+ "homepage": "http://remy.bach.me.uk/superlabels_demo/",
+ "bugs": {
+ "url": "https://github.com/remybach/jQuery.superLabels/issues"
+ },
+ "contributors": [
+ {
+ "name": "Rémy Bach",
+ "url": "http://remy.bach.me.uk"
+ }
+ ],
+ "repository": {
+ "type": "git",
+ "url": "https://github.com/remybach/jQuery.superLabels"
+ },
+ "private": true,
+ "devDependencies": {
+ "grunt": "0.4.0rc7",
+ "grunt-contrib-jshint": "0.1.1",
+ "grunt-contrib-uglify": "0.1.1"
+ }
+}
\ No newline at end of file
diff --git a/seen-on.md b/seen-on.md
new file mode 100644
index 0000000..fbc5249
--- /dev/null
+++ b/seen-on.md
@@ -0,0 +1,2 @@
+* [http://www.biscuiteers.com](http://www.biscuiteers.com)
+* [http://www.yeovalley.co.uk](http://www.yeovalley.co.uk)
\ No newline at end of file
diff --git a/superLabels.jquery.json b/superLabels.jquery.json
new file mode 100644
index 0000000..572f14a
--- /dev/null
+++ b/superLabels.jquery.json
@@ -0,0 +1,30 @@
+{
+ "name": "superLabels",
+ "version": "2.0.4",
+ "title": "jQuery Super Labels",
+ "author": {
+ "name": "Rémy Bach",
+ "url": "http://remy.bach.me.uk"
+ },
+ "licenses": [
+ {
+ "type": "MIT",
+ "url": "http://remybach.mit-license.org/"
+ }
+ ],
+ "dependencies": {
+ "jquery": ">=1.5"
+ },
+ "description": "Give your forms a helping of awesome!",
+ "keywords": [
+ "form",
+ "forms",
+ "label",
+ "labels",
+ "usability"
+ ],
+ "homepage": "https://github.com/remybach/jQuery.superLabels",
+ "docs": "https://github.com/remybach/jQuery.superLabels",
+ "demo": "http://remy.bach.me.uk/superlabels_demo/",
+ "bugs": "https://github.com/remybach/jQuery.superLabels/issues"
+}
\ No newline at end of file
diff --git a/tasks/checkBanner.js b/tasks/checkBanner.js
new file mode 100644
index 0000000..10224d1
--- /dev/null
+++ b/tasks/checkBanner.js
@@ -0,0 +1,32 @@
+module.exports = function(grunt) {
+ 'use strict';
+
+ grunt.registerTask('checkBanner', 'Update the banner of the given file.', function() {
+ var banner, filename;
+
+ grunt.config.requires('minify.filename');
+
+ banner = grunt.config('meta.banner');
+ filename = grunt.config('minify.filename');
+
+ var src;
+
+ // Warn on and remove invalid source files (if nonull was set).
+ if (!grunt.file.exists(filename)) {
+ grunt.log.warn('Source file not found at "' + filename + '"');
+ return false;
+ }
+
+ grunt.log.writeln('Updating Banner for: '+filename);
+
+ src = grunt.file.read(filename);
+
+ // Strip out the existing banner
+ src = src.replace(/\/\*![\r\n] \*\sTitle(.|[\r\n])*?\*\/[\r\n];/gm, banner);
+
+ grunt.file.write(filename, src);
+
+ grunt.log.writeln('Done updating banner in: '+filename);
+
+ });
+};
\ No newline at end of file
diff --git a/tasks/minify.js b/tasks/minify.js
new file mode 100644
index 0000000..6c841d4
--- /dev/null
+++ b/tasks/minify.js
@@ -0,0 +1,37 @@
+module.exports = function(grunt) {
+ 'use strict';
+
+ grunt.registerTask('minify', 'Strip out some of the guff and uglify.', function() {
+ var dest,
+ filename;
+
+ // Fail task if we don't know which file/s to minify or where to put them
+ grunt.config.requires('minify.dest');
+ grunt.config.requires('minify.filename');
+
+ dest = grunt.config('minify.dest');
+ filename = grunt.config('minify.filename');
+
+ var src;
+
+ // Warn on and remove invalid source files (if nonull was set).
+ if (!grunt.file.exists(filename)) {
+ grunt.log.warn('Source file not found at "' + filename + '"');
+ return false;
+ }
+
+ grunt.log.writeln('Minifying: '+filename);
+
+ src = grunt.file.read(filename);
+
+ // Strip out anything we don't want in the minified version.
+ src = src.replace(/\/\* nominify \*\/(.|[\r\n])*?\/\* \/nominify \*\//gm, '');
+
+ grunt.file.write(dest, src);
+
+ grunt.task.run('uglify');
+
+ grunt.log.writeln('Done minifying, stripped and uglified file is at: '+dest);
+
+ });
+};
\ No newline at end of file
diff --git a/tasks/updateVersion.js b/tasks/updateVersion.js
new file mode 100644
index 0000000..49e28bf
--- /dev/null
+++ b/tasks/updateVersion.js
@@ -0,0 +1,33 @@
+module.exports = function(grunt) {
+ 'use strict';
+
+ grunt.registerTask('updateVersion', 'Update the version number in all relevant *.json files.', function() {
+ var filename,
+ files,
+ json;
+
+ grunt.config.requires('updateVersion.files');
+
+ files = grunt.config('updateVersion.files');
+
+ for (var i = files.length - 1; i >= 0; i--) {
+ filename = files[i];
+
+ // Warn on and remove invalid source files (if nonull was set).
+ if (!grunt.file.exists(filename)) {
+ grunt.log.warn('Source file not found at "' + filename + '"');
+ return false;
+ }
+
+ grunt.log.writeln('Updating Banner for: '+filename);
+
+ json = grunt.file.readJSON(filename);
+
+ json.version = grunt.config('meta.version');
+
+ grunt.file.write(filename, JSON.stringify(json, null, 4));
+
+ grunt.log.writeln('Done updating version in: '+filename);
+ }
+ });
+};
\ No newline at end of file
+
+