') works
245 | var res = (req.responseText || '').replace(/^\s+|\s+$/g, '');
246 | if( req.status.toString().indexOf( "0" ) === 0 ){
247 | return settings.cancel( res, req.status, req );
248 | }
249 | else if ( req.status.toString().match( /^(4|5)/ ) && RegExp.$1 ){
250 | return settings.error( res, req.status, req );
251 | }
252 | else if (settings.success) {
253 | return settings.success( res, req.status, req );
254 | }
255 | }
256 | };
257 |
258 | if( req.readyState === 4 ){
259 | return req;
260 | }
261 |
262 | // Send request
263 | if( settings.method === "POST" && params ){
264 | req.send( params );
265 | } else {
266 | req.send();
267 | }
268 |
269 | return req;
270 | };
271 |
272 | shoestring.ajax.settings = {
273 | success: function(){},
274 | error: function(){},
275 | cancel: function(){},
276 | method: "GET",
277 | async: true,
278 | data: null,
279 | headers: {}
280 | };
281 |
282 |
283 |
284 | /**
285 | * Helper function wrapping a call to [ajax](ajax.js.html) using the `GET` method.
286 | *
287 | * @param {string} url The url to GET from.
288 | * @param {function} callback Callback to invoke on success.
289 | * @return shoestring
290 | * @this shoestring
291 | */
292 | shoestring.get = function( url, callback ){
293 | return shoestring.ajax( url, { success: callback } );
294 | };
295 |
296 |
297 |
298 | /**
299 | * Load the HTML response from `url` into the current set of elements.
300 | *
301 | * @param {string} url The url to GET from.
302 | * @param {function} callback Callback to invoke after HTML is inserted.
303 | * @return shoestring
304 | * @this shoestring
305 | */
306 | shoestring.fn.load = function( url, callback ){
307 | var self = this,
308 | args = arguments,
309 | intCB = function( data ){
310 | self.each(function(){
311 | shoestring( this ).html( data );
312 | });
313 |
314 | if( callback ){
315 | callback.apply( self, args );
316 | }
317 | };
318 |
319 | shoestring.ajax( url, { success: intCB } );
320 | return this;
321 | };
322 |
323 |
324 |
325 | /**
326 | * Helper function wrapping a call to [ajax](ajax.js.html) using the `POST` method.
327 | *
328 | * @param {string} url The url to POST to.
329 | * @param {object} data The data to send.
330 | * @param {function} callback Callback to invoke on success.
331 | * @return shoestring
332 | * @this shoestring
333 | */
334 | shoestring.post = function( url, data, callback ){
335 | return shoestring.ajax( url, { data: data, method: "POST", success: callback } );
336 | };
337 |
338 |
339 |
340 | /**
341 | * Iterates over `shoestring` collections.
342 | *
343 | * @param {function} callback The callback to be invoked on each element and index
344 | * @return shoestring
345 | * @this shoestring
346 | */
347 | shoestring.fn.each = function( callback ){
348 | return shoestring.each( this, callback );
349 | };
350 |
351 | shoestring.each = function( collection, callback ) {
352 | var val;
353 | for( var i = 0, il = collection.length; i < il; i++ ){
354 | val = callback.call( collection[i], i, collection[i] );
355 | if( val === false ){
356 | break;
357 | }
358 | }
359 |
360 | return collection;
361 | };
362 |
363 |
364 |
365 | /**
366 | * Check for array membership.
367 | *
368 | * @param {object} needle The thing to find.
369 | * @param {object} haystack The thing to find the needle in.
370 | * @return {boolean}
371 | * @this window
372 | */
373 | shoestring.inArray = function( needle, haystack ){
374 | var isin = -1;
375 | for( var i = 0, il = haystack.length; i < il; i++ ){
376 | if( haystack.hasOwnProperty( i ) && haystack[ i ] === needle ){
377 | isin = i;
378 | }
379 | }
380 | return isin;
381 | };
382 |
383 |
384 |
385 | /**
386 | * Bind callbacks to be run when the DOM is "ready".
387 | *
388 | * @param {function} fn The callback to be run
389 | * @return shoestring
390 | * @this shoestring
391 | */
392 | shoestring.ready = function( fn ){
393 | if( ready && fn ){
394 | fn.call( document );
395 | }
396 | else if( fn ){
397 | readyQueue.push( fn );
398 | }
399 | else {
400 | runReady();
401 | }
402 |
403 | return [document];
404 | };
405 |
406 | // TODO necessary?
407 | shoestring.fn.ready = function( fn ){
408 | shoestring.ready( fn );
409 | return this;
410 | };
411 |
412 | // Empty and exec the ready queue
413 | var ready = false,
414 | readyQueue = [],
415 | runReady = function(){
416 | if( !ready ){
417 | while( readyQueue.length ){
418 | readyQueue.shift().call( document );
419 | }
420 | ready = true;
421 | }
422 | };
423 |
424 | // Quick IE8 shiv
425 | if( !window.addEventListener ){
426 | window.addEventListener = function( evt, cb ){
427 | return window.attachEvent( "on" + evt, cb );
428 | };
429 | }
430 |
431 | // If DOM is already ready at exec time, depends on the browser.
432 | // From: https://github.com/mobify/mobifyjs/blob/526841be5509e28fc949038021799e4223479f8d/src/capture.js#L128
433 | if (document.attachEvent ? document.readyState === "complete" : document.readyState !== "loading") {
434 | runReady();
435 | } else {
436 | if( !document.addEventListener ){
437 | document.attachEvent( "DOMContentLoaded", runReady );
438 | document.attachEvent( "onreadystatechange", runReady );
439 | } else {
440 | document.addEventListener( "DOMContentLoaded", runReady, false );
441 | document.addEventListener( "readystatechange", runReady, false );
442 | }
443 | window.addEventListener( "load", runReady, false );
444 | }
445 |
446 |
447 |
448 | /**
449 | * Get data attached to the first element or set data values on all elements in the current set.
450 | *
451 | * @param {string} name The data attribute name.
452 | * @param {any} value The value assigned to the data attribute.
453 | * @return {any|shoestring}
454 | * @this shoestring
455 | */
456 | shoestring.fn.data = function( name, value ){
457 | if( name !== undefined ){
458 | if( value !== undefined ){
459 | return this.each(function(){
460 | if( !this.shoestringData ){
461 | this.shoestringData = {};
462 | }
463 |
464 | this.shoestringData[ name ] = value;
465 | });
466 | }
467 | else {
468 | return this[ 0 ] && this[ 0 ].shoestringData ? this[ 0 ].shoestringData[ name ] : undefined;
469 | }
470 | }
471 | else {
472 | return this[ 0 ] ? this[ 0 ].shoestringData || {} : undefined;
473 | }
474 | };
475 |
476 |
477 | /**
478 | * Remove data associated with `name` or all the data, for each element in the current set.
479 | *
480 | * @param {string} name The data attribute name.
481 | * @return shoestring
482 | * @this shoestring
483 | */
484 | shoestring.fn.removeData = function( name ){
485 | return this.each(function(){
486 | if( name !== undefined && this.shoestringData ){
487 | this.shoestringData[ name ] = undefined;
488 | delete this.shoestringData[ name ];
489 | } else {
490 | this[ 0 ].shoestringData = {};
491 | }
492 | });
493 | };
494 |
495 |
496 |
497 | /**
498 | * An alias for the `shoestring` constructor.
499 | */
500 | window.$ = shoestring;
501 |
502 |
503 |
504 | /**
505 | * Add a class to each DOM element in the set of elements.
506 | *
507 | * @param {string} className The name of the class to be added.
508 | * @return shoestring
509 | * @this shoestring
510 | */
511 | shoestring.fn.addClass = function( className ){
512 | var classes = className.replace(/^\s+|\s+$/g, '').split( " " );
513 |
514 | return this.each(function(){
515 | for( var i = 0, il = classes.length; i < il; i++ ){
516 | if( this.className !== undefined &&
517 | (this.className === "" ||
518 | !this.className.match( new RegExp( "(^|\\s)" + classes[ i ] + "($|\\s)"))) ){
519 | this.className += " " + classes[ i ];
520 | }
521 | }
522 | });
523 | };
524 |
525 |
526 |
527 | /**
528 | * Add elements matching the selector to the current set.
529 | *
530 | * @param {string} selector The selector for the elements to add from the DOM
531 | * @return shoestring
532 | * @this shoestring
533 | */
534 | shoestring.fn.add = function( selector ){
535 | var ret = [];
536 | this.each(function(){
537 | ret.push( this );
538 | });
539 |
540 | shoestring( selector ).each(function(){
541 | ret.push( this );
542 | });
543 |
544 | return shoestring( ret );
545 | };
546 |
547 |
548 |
549 | /**
550 | * Insert an element or HTML string after each element in the current set.
551 | *
552 | * @param {string|HTMLElement} fragment The HTML or HTMLElement to insert.
553 | * @return shoestring
554 | * @this shoestring
555 | */
556 | shoestring.fn.after = function( fragment ){
557 | if( typeof( fragment ) === "string" || fragment.nodeType !== undefined ){
558 | fragment = shoestring( fragment );
559 | }
560 |
561 | if( fragment.length > 1 ){
562 | fragment = fragment.reverse();
563 | }
564 | return this.each(function( i ){
565 | for( var j = 0, jl = fragment.length; j < jl; j++ ){
566 | var insertEl = i > 0 ? fragment[ j ].cloneNode( true ) : fragment[ j ];
567 | this.parentNode.insertBefore( insertEl, this.nextSibling );
568 | }
569 | });
570 | };
571 |
572 |
573 |
574 | /**
575 | * Insert an element or HTML string as the last child of each element in the set.
576 | *
577 | * @param {string|HTMLElement} fragment The HTML or HTMLElement to insert.
578 | * @return shoestring
579 | * @this shoestring
580 | */
581 | shoestring.fn.append = function( fragment ){
582 | if( typeof( fragment ) === "string" || fragment.nodeType !== undefined ){
583 | fragment = shoestring( fragment );
584 | }
585 |
586 | return this.each(function( i ){
587 | for( var j = 0, jl = fragment.length; j < jl; j++ ){
588 | this.appendChild( i > 0 ? fragment[ j ].cloneNode( true ) : fragment[ j ] );
589 | }
590 | });
591 | };
592 |
593 |
594 |
595 | /**
596 | * Insert the current set as the last child of the elements matching the selector.
597 | *
598 | * @param {string} selector The selector after which to append the current set.
599 | * @return shoestring
600 | * @this shoestring
601 | */
602 | shoestring.fn.appendTo = function( selector ){
603 | return this.each(function(){
604 | shoestring( selector ).append( this );
605 | });
606 | };
607 |
608 |
609 |
610 | /**
611 | * Get the value of the first element of the set or set the value of all the elements in the set.
612 | *
613 | * @param {string} name The attribute name.
614 | * @param {string} value The new value for the attribute.
615 | * @return {shoestring|string|undefined}
616 | * @this {shoestring}
617 | */
618 | shoestring.fn.attr = function( name, value ){
619 | var nameStr = typeof( name ) === "string";
620 |
621 | if( value !== undefined || !nameStr ){
622 | return this.each(function(){
623 | if( nameStr ){
624 | this.setAttribute( name, value );
625 | } else {
626 | for( var i in name ){
627 | if( name.hasOwnProperty( i ) ){
628 | this.setAttribute( i, name[ i ] );
629 | }
630 | }
631 | }
632 | });
633 | } else {
634 | return this[ 0 ] ? this[ 0 ].getAttribute( name ) : undefined;
635 | }
636 | };
637 |
638 |
639 |
640 | /**
641 | * Insert an element or HTML string before each element in the current set.
642 | *
643 | * @param {string|HTMLElement} fragment The HTML or HTMLElement to insert.
644 | * @return shoestring
645 | * @this shoestring
646 | */
647 | shoestring.fn.before = function( fragment ){
648 | if( typeof( fragment ) === "string" || fragment.nodeType !== undefined ){
649 | fragment = shoestring( fragment );
650 | }
651 |
652 | return this.each(function( i ){
653 | for( var j = 0, jl = fragment.length; j < jl; j++ ){
654 | this.parentNode.insertBefore( i > 0 ? fragment[ j ].cloneNode( true ) : fragment[ j ], this );
655 | }
656 | });
657 | };
658 |
659 |
660 |
661 | /**
662 | * Get the children of the current collection.
663 | * @return shoestring
664 | * @this shoestring
665 | */
666 | shoestring.fn.children = function(){
667 | var ret = [],
668 | childs,
669 | j;
670 | this.each(function(){
671 | childs = this.children;
672 | j = -1;
673 |
674 | while( j++ < childs.length-1 ){
675 | if( shoestring.inArray( childs[ j ], ret ) === -1 ){
676 | ret.push( childs[ j ] );
677 | }
678 | }
679 | });
680 | return shoestring(ret);
681 | };
682 |
683 |
684 |
685 | /**
686 | * Clone and return the current set of nodes into a new `shoestring` object.
687 | *
688 | * @return shoestring
689 | * @this shoestring
690 | */
691 | shoestring.fn.clone = function() {
692 | var ret = [];
693 |
694 | this.each(function() {
695 | ret.push( this.cloneNode( true ) );
696 | });
697 |
698 | return shoestring( ret );
699 | };
700 |
701 |
702 |
703 | /**
704 | * Checks the current set of elements against the selector, if one matches return `true`.
705 | *
706 | * @param {string} selector The selector to check.
707 | * @return {boolean}
708 | * @this {shoestring}
709 | */
710 | shoestring.fn.is = function( selector ){
711 | var ret = false, self = this, parents, check;
712 |
713 | // assume a dom element
714 | if( typeof selector !== "string" ){
715 | // array-like, ie shoestring objects or element arrays
716 | if( selector.length && selector[0] ){
717 | check = selector;
718 | } else {
719 | check = [selector];
720 | }
721 |
722 | return _checkElements(this, check);
723 | }
724 |
725 | parents = this.parent();
726 |
727 | if( !parents.length ){
728 | parents = shoestring( document );
729 | }
730 |
731 | parents.each(function( i, e ) {
732 | var children;
733 |
734 | try {
735 | children = e.querySelectorAll( selector );
736 | } catch( e ) {
737 | shoestring.error( 'queryselector', selector );
738 | }
739 |
740 | ret = _checkElements( self, children );
741 | });
742 |
743 | return ret;
744 | };
745 |
746 | function _checkElements(needles, haystack){
747 | var ret = false;
748 |
749 | needles.each(function() {
750 | var j = 0;
751 |
752 | while( j < haystack.length ){
753 | if( this === haystack[j] ){
754 | ret = true;
755 | }
756 |
757 | j++;
758 | }
759 | });
760 |
761 | return ret;
762 | }
763 |
764 |
765 |
766 | /**
767 | * Find an element matching the selector in the set of the current element and its parents.
768 | *
769 | * @param {string} selector The selector used to identify the target element.
770 | * @return shoestring
771 | * @this shoestring
772 | */
773 | shoestring.fn.closest = function( selector ){
774 | var ret = [];
775 |
776 | if( !selector ){
777 | return shoestring( ret );
778 | }
779 |
780 | this.each(function(){
781 | var element, $self = shoestring( element = this );
782 |
783 | if( $self.is(selector) ){
784 | ret.push( this );
785 | return;
786 | }
787 |
788 | while( element.parentElement ) {
789 | if( shoestring(element.parentElement).is(selector) ){
790 | ret.push( element.parentElement );
791 | break;
792 | }
793 |
794 | element = element.parentElement;
795 | }
796 | });
797 |
798 | return shoestring( ret );
799 | };
800 |
801 |
802 |
803 | shoestring.cssExceptions = {
804 | 'float': [ 'cssFloat', 'styleFloat' ] // styleFloat is IE8
805 | };
806 |
807 |
808 |
809 | /**
810 | * A polyfill to support computed styles in IE < 9
811 | *
812 | * NOTE this is taken directly from https://github.com/jonathantneal/polyfill
813 | */
814 | (function () {
815 | function getComputedStylePixel(element, property, fontSize) {
816 | element.document; // Internet Explorer sometimes struggles to read currentStyle until the element's document is accessed.
817 |
818 | var
819 | value = element.currentStyle[property].match(/([\d\.]+)(%|cm|em|in|mm|pc|pt|)/) || [0, 0, ''],
820 | size = value[1],
821 | suffix = value[2],
822 | rootSize;
823 |
824 | fontSize = !fontSize ? fontSize : /%|em/.test(suffix) && element.parentElement ? getComputedStylePixel(element.parentElement, 'fontSize', null) : 16;
825 | rootSize = property === 'fontSize' ? fontSize : /width/i.test(property) ? element.clientWidth : element.clientHeight;
826 |
827 | return suffix === '%' ? size / 100 * rootSize :
828 | suffix === 'cm' ? size * 0.3937 * 96 :
829 | suffix === 'em' ? size * fontSize :
830 | suffix === 'in' ? size * 96 :
831 | suffix === 'mm' ? size * 0.3937 * 96 / 10 :
832 | suffix === 'pc' ? size * 12 * 96 / 72 :
833 | suffix === 'pt' ? size * 96 / 72 :
834 | size;
835 | }
836 |
837 | function setShortStyleProperty(style, property) {
838 | var
839 | borderSuffix = property === 'border' ? 'Width' : '',
840 | t = property + 'Top' + borderSuffix,
841 | r = property + 'Right' + borderSuffix,
842 | b = property + 'Bottom' + borderSuffix,
843 | l = property + 'Left' + borderSuffix;
844 |
845 | style[property] = (style[t] === style[r] && style[t] === style[b] && style[t] === style[l] ? [ style[t] ] :
846 | style[t] === style[b] && style[l] === style[r] ? [ style[t], style[r] ] :
847 | style[l] === style[r] ? [ style[t], style[r], style[b] ] :
848 | [ style[t], style[r], style[b], style[l] ]).join(' ');
849 | }
850 |
851 | //
852 | function CSSStyleDeclaration(element) {
853 | var
854 | style = this,
855 | currentStyle = element.currentStyle,
856 | fontSize = getComputedStylePixel(element, 'fontSize'),
857 | unCamelCase = function (match) {
858 | return '-' + match.toLowerCase();
859 | },
860 | property;
861 |
862 | for (property in currentStyle) {
863 | Array.prototype.push.call(style, property === 'styleFloat' ? 'float' : property.replace(/[A-Z]/, unCamelCase));
864 |
865 | if (property === 'width') {
866 | style[property] = element.offsetWidth + 'px';
867 | } else if (property === 'height') {
868 | style[property] = element.offsetHeight + 'px';
869 | } else if (property === 'styleFloat') {
870 | style.float = currentStyle[property];
871 | } else if (/margin.|padding.|border.+W/.test(property) && style[property] !== 'auto') {
872 | style[property] = Math.round(getComputedStylePixel(element, property, fontSize)) + 'px';
873 | } else if (/^outline/.test(property)) {
874 | // errors on checking outline
875 | try {
876 | style[property] = currentStyle[property];
877 | } catch (error) {
878 | style.outlineColor = currentStyle.color;
879 | style.outlineStyle = style.outlineStyle || 'none';
880 | style.outlineWidth = style.outlineWidth || '0px';
881 | style.outline = [style.outlineColor, style.outlineWidth, style.outlineStyle].join(' ');
882 | }
883 | } else {
884 | style[property] = currentStyle[property];
885 | }
886 | }
887 |
888 | setShortStyleProperty(style, 'margin');
889 | setShortStyleProperty(style, 'padding');
890 | setShortStyleProperty(style, 'border');
891 |
892 | style.fontSize = Math.round(fontSize) + 'px';
893 | }
894 |
895 | CSSStyleDeclaration.prototype = {
896 | constructor: CSSStyleDeclaration,
897 | // .getPropertyPriority
898 | getPropertyPriority: function () {
899 | throw new Error('NotSupportedError: DOM Exception 9');
900 | },
901 | // .getPropertyValue
902 | getPropertyValue: function (property) {
903 | return this[property.replace(/-\w/g, function (match) {
904 | return match[1].toUpperCase();
905 | })];
906 | },
907 | // .item
908 | item: function (index) {
909 | return this[index];
910 | },
911 | // .removeProperty
912 | removeProperty: function () {
913 | throw new Error('NoModificationAllowedError: DOM Exception 7');
914 | },
915 | // .setProperty
916 | setProperty: function () {
917 | throw new Error('NoModificationAllowedError: DOM Exception 7');
918 | },
919 | // .getPropertyCSSValue
920 | getPropertyCSSValue: function () {
921 | throw new Error('NotSupportedError: DOM Exception 9');
922 | }
923 | };
924 |
925 | if( !window.getComputedStyle ) {
926 | // .getComputedStyle
927 | // NOTE Window is not defined in all browsers
928 | window.getComputedStyle = function (element) {
929 | return new CSSStyleDeclaration(element);
930 | };
931 |
932 | if ( window.Window ) {
933 | window.Window.prototype.getComputedStyle = window.getComputedStyle;
934 | }
935 | }
936 | })();
937 |
938 |
939 |
940 | (function() {
941 | var cssExceptions = shoestring.cssExceptions;
942 |
943 | // IE8 uses marginRight instead of margin-right
944 | function convertPropertyName( str ) {
945 | return str.replace( /\-([A-Za-z])/g, function ( match, character ) {
946 | return character.toUpperCase();
947 | });
948 | }
949 |
950 | function _getStyle( element, property ) {
951 | // polyfilled in getComputedStyle module
952 | return window.getComputedStyle( element, null ).getPropertyValue( property );
953 | }
954 |
955 | var vendorPrefixes = [ '', '-webkit-', '-ms-', '-moz-', '-o-', '-khtml-' ];
956 |
957 | /**
958 | * Private function for getting the computed style of an element.
959 | *
960 | * **NOTE** Please use the [css](../css.js.html) method instead.
961 | *
962 | * @method _getStyle
963 | * @param {HTMLElement} element The element we want the style property for.
964 | * @param {string} property The css property we want the style for.
965 | */
966 | shoestring._getStyle = function( element, property ) {
967 | var convert, value, j, k;
968 |
969 | if( cssExceptions[ property ] ) {
970 | for( j = 0, k = cssExceptions[ property ].length; j < k; j++ ) {
971 | value = _getStyle( element, cssExceptions[ property ][ j ] );
972 |
973 | if( value ) {
974 | return value;
975 | }
976 | }
977 | }
978 |
979 | for( j = 0, k = vendorPrefixes.length; j < k; j++ ) {
980 | convert = convertPropertyName( vendorPrefixes[ j ] + property );
981 |
982 | // VendorprefixKeyName || key-name
983 | value = _getStyle( element, convert );
984 |
985 | if( convert !== property ) {
986 | value = value || _getStyle( element, property );
987 | }
988 |
989 | if( vendorPrefixes[ j ] ) {
990 | // -vendorprefix-key-name
991 | value = value || _getStyle( element, vendorPrefixes[ j ] + property );
992 | }
993 |
994 | if( value ) {
995 | return value;
996 | }
997 | }
998 |
999 | return undefined;
1000 | };
1001 | })();
1002 |
1003 |
1004 |
1005 | (function() {
1006 | var cssExceptions = shoestring.cssExceptions;
1007 |
1008 | // IE8 uses marginRight instead of margin-right
1009 | function convertPropertyName( str ) {
1010 | return str.replace( /\-([A-Za-z])/g, function ( match, character ) {
1011 | return character.toUpperCase();
1012 | });
1013 | }
1014 |
1015 | /**
1016 | * Private function for setting the style of an element.
1017 | *
1018 | * **NOTE** Please use the [css](../css.js.html) method instead.
1019 | *
1020 | * @method _setStyle
1021 | * @param {HTMLElement} element The element we want to style.
1022 | * @param {string} property The property being used to style the element.
1023 | * @param {string} value The css value for the style property.
1024 | */
1025 | shoestring._setStyle = function( element, property, value ) {
1026 | var convertedProperty = convertPropertyName(property);
1027 |
1028 | element.style[ property ] = value;
1029 |
1030 | if( convertedProperty !== property ) {
1031 | element.style[ convertedProperty ] = value;
1032 | }
1033 |
1034 | if( cssExceptions[ property ] ) {
1035 | for( var j = 0, k = cssExceptions[ property ].length; j -1 ){
1127 | ret.push( this );
1128 | }
1129 | }
1130 | });
1131 |
1132 | return shoestring( ret );
1133 | };
1134 |
1135 |
1136 |
1137 | /**
1138 | * Find descendant elements of the current collection.
1139 | *
1140 | * @param {string} selector The selector used to find the children
1141 | * @return shoestring
1142 | * @this shoestring
1143 | */
1144 | shoestring.fn.find = function( selector ){
1145 | var ret = [],
1146 | finds;
1147 | this.each(function(){
1148 | try {
1149 | finds = this.querySelectorAll( selector );
1150 | } catch( e ) {
1151 | shoestring.error( 'queryselector', selector );
1152 | }
1153 |
1154 | for( var i = 0, il = finds.length; i < il; i++ ){
1155 | ret = ret.concat( finds[i] );
1156 | }
1157 | });
1158 | return shoestring( ret );
1159 | };
1160 |
1161 |
1162 |
1163 | /**
1164 | * Returns the first element of the set wrapped in a new `shoestring` object.
1165 | *
1166 | * @return shoestring
1167 | * @this shoestring
1168 | */
1169 | shoestring.fn.first = function(){
1170 | return this.eq( 0 );
1171 | };
1172 |
1173 |
1174 |
1175 | /**
1176 | * Returns the raw DOM node at the passed index.
1177 | *
1178 | * @param {integer} index The index of the element to wrap and return.
1179 | * @return HTMLElement
1180 | * @this shoestring
1181 | */
1182 | shoestring.fn.get = function( index ){
1183 | return this[ index ];
1184 | };
1185 |
1186 |
1187 |
1188 | /**
1189 | * Private function for setting/getting the offset property for height/width.
1190 | *
1191 | * **NOTE** Please use the [width](width.js.html) or [height](height.js.html) methods instead.
1192 | *
1193 | * @param {shoestring} set The set of elements.
1194 | * @param {string} name The string "height" or "width".
1195 | * @param {float|undefined} value The value to assign.
1196 | * @return shoestring
1197 | * @this window
1198 | */
1199 | shoestring._dimension = function( set, name, value ){
1200 | var offsetName;
1201 |
1202 | if( value === undefined ){
1203 | offsetName = name.replace(/^[a-z]/, function( letter ) {
1204 | return letter.toUpperCase();
1205 | });
1206 |
1207 | return set[ 0 ][ "offset" + offsetName ];
1208 | } else {
1209 | // support integer values as pixels
1210 | value = typeof value === "string" ? value : value + "px";
1211 |
1212 | return set.each(function(){
1213 | this.style[ name ] = value;
1214 | });
1215 | }
1216 | };
1217 |
1218 |
1219 |
1220 | /**
1221 | * Gets the height value of the first element or sets the height for the whole set.
1222 | *
1223 | * @param {float|undefined} value The value to assign.
1224 | * @return shoestring
1225 | * @this shoestring
1226 | */
1227 | shoestring.fn.height = function( value ){
1228 | return shoestring._dimension( this, "height", value );
1229 | };
1230 |
1231 |
1232 |
1233 | var set = function( html ){
1234 | if( typeof html === "string" ){
1235 | return this.each(function(){
1236 | this.innerHTML = html;
1237 | });
1238 | } else {
1239 | var h = "";
1240 | if( typeof html.length !== "undefined" ){
1241 | for( var i = 0, l = html.length; i < l; i++ ){
1242 | h += html[i].outerHTML;
1243 | }
1244 | } else {
1245 | h = html.outerHTML;
1246 | }
1247 | return this.each(function(){
1248 | this.innerHTML = h;
1249 | });
1250 | }
1251 | };
1252 | /**
1253 | * Gets or sets the `innerHTML` from all the elements in the set.
1254 | *
1255 | * @param {string|undefined} html The html to assign
1256 | * @return {string|shoestring}
1257 | * @this shoestring
1258 | */
1259 | shoestring.fn.html = function( html ){
1260 | if( !!html && typeof html === "function" ){
1261 | shoestring.error( 'html-function' );
1262 | }
1263 | if( typeof html !== "undefined" ){
1264 | return set.call( this, html );
1265 | } else { // get
1266 | var pile = "";
1267 |
1268 | this.each(function(){
1269 | pile += this.innerHTML;
1270 | });
1271 |
1272 | return pile;
1273 | }
1274 | };
1275 |
1276 |
1277 |
1278 | (function() {
1279 | function _getIndex( set, test ) {
1280 | var i, result, element;
1281 |
1282 | for( i = result = 0; i < set.length; i++ ) {
1283 | element = set.item ? set.item(i) : set[i];
1284 |
1285 | if( test(element) ){
1286 | return result;
1287 | }
1288 |
1289 | // ignore text nodes, etc
1290 | // NOTE may need to be more permissive
1291 | if( element.nodeType === 1 ){
1292 | result++;
1293 | }
1294 | }
1295 |
1296 | return -1;
1297 | }
1298 |
1299 | /**
1300 | * Find the index in the current set for the passed selector.
1301 | * Without a selector it returns the index of the first node within the array of its siblings.
1302 | *
1303 | * @param {string|undefined} selector The selector used to search for the index.
1304 | * @return {integer}
1305 | * @this {shoestring}
1306 | */
1307 | shoestring.fn.index = function( selector ){
1308 | var self, children;
1309 |
1310 | self = this;
1311 |
1312 | // no arg? check the children, otherwise check each element that matches
1313 | if( selector === undefined ){
1314 | children = ( ( this[ 0 ] && this[0].parentNode ) || document.documentElement).childNodes;
1315 |
1316 | // check if the element matches the first of the set
1317 | return _getIndex(children, function( element ) {
1318 | return self[0] === element;
1319 | });
1320 | } else {
1321 |
1322 | // check if the element matches the first selected node from the parent
1323 | return _getIndex(self, function( element ) {
1324 | return element === (shoestring( selector, element.parentNode )[ 0 ]);
1325 | });
1326 | }
1327 | };
1328 | })();
1329 |
1330 |
1331 |
1332 | /**
1333 | * Insert the current set after the elements matching the selector.
1334 | *
1335 | * @param {string} selector The selector after which to insert the current set.
1336 | * @return shoestring
1337 | * @this shoestring
1338 | */
1339 | shoestring.fn.insertAfter = function( selector ){
1340 | return this.each(function(){
1341 | shoestring( selector ).after( this );
1342 | });
1343 | };
1344 |
1345 |
1346 |
1347 | /**
1348 | * Insert the current set before the elements matching the selector.
1349 | *
1350 | * @param {string} selector The selector before which to insert the current set.
1351 | * @return shoestring
1352 | * @this shoestring
1353 | */
1354 | shoestring.fn.insertBefore = function( selector ){
1355 | return this.each(function(){
1356 | shoestring( selector ).before( this );
1357 | });
1358 | };
1359 |
1360 |
1361 |
1362 | /**
1363 | * Returns the last element of the set wrapped in a new `shoestring` object.
1364 | *
1365 | * @return shoestring
1366 | * @this shoestring
1367 | */
1368 | shoestring.fn.last = function(){
1369 | return this.eq( this.length - 1 );
1370 | };
1371 |
1372 |
1373 |
1374 | /**
1375 | * Returns a `shoestring` object with the set of siblings of each element in the original set.
1376 | *
1377 | * @return shoestring
1378 | * @this shoestring
1379 | */
1380 | shoestring.fn.next = function(){
1381 | if( arguments.length > 0 ){
1382 | shoestring.error( 'next-selector' );
1383 | }
1384 |
1385 | var result = [];
1386 |
1387 | // TODO need to implement map
1388 | this.each(function() {
1389 | var children, item, found;
1390 |
1391 | // get the child nodes for this member of the set
1392 | children = shoestring( this.parentNode )[0].childNodes;
1393 |
1394 | for( var i = 0; i < children.length; i++ ){
1395 | item = children.item( i );
1396 |
1397 | // found the item we needed (found) which means current item value is
1398 | // the next node in the list, as long as it's viable grab it
1399 | // NOTE may need to be more permissive
1400 | if( found && item.nodeType === 1 ){
1401 | result.push( item );
1402 | break;
1403 | }
1404 |
1405 | // find the current item and mark it as found
1406 | if( item === this ){
1407 | found = true;
1408 | }
1409 | }
1410 | });
1411 |
1412 | return shoestring( result );
1413 | };
1414 |
1415 |
1416 |
1417 | /**
1418 | * Removes elements from the current set.
1419 | *
1420 | * @param {string} selector The selector to use when removing the elements.
1421 | * @return shoestring
1422 | * @this shoestring
1423 | */
1424 | shoestring.fn.not = function( selector ){
1425 | var ret = [];
1426 |
1427 | this.each(function(){
1428 | var found = shoestring( selector, this.parentNode );
1429 |
1430 | if( shoestring.inArray(this, found) === -1 ){
1431 | ret.push( this );
1432 | }
1433 | });
1434 |
1435 | return shoestring( ret );
1436 | };
1437 |
1438 |
1439 |
1440 | /**
1441 | * Returns an object with the `top` and `left` properties corresponging to the first elements offsets.
1442 | *
1443 | * @return object
1444 | * @this shoestring
1445 | */
1446 | shoestring.fn.offset = function(){
1447 | return {
1448 | top: this[ 0 ].offsetTop,
1449 | left: this[ 0 ].offsetLeft
1450 | };
1451 | };
1452 |
1453 |
1454 |
1455 | /**
1456 | * Returns the set of first parents for each element in the current set.
1457 | *
1458 | * @return shoestring
1459 | * @this shoestring
1460 | */
1461 | shoestring.fn.parent = function(){
1462 | var ret = [],
1463 | parent;
1464 |
1465 | this.each(function(){
1466 | // no parent node, assume top level
1467 | // jQuery parent: return the document object for or the parent node if it exists
1468 | parent = (this === document.documentElement ? document : this.parentNode);
1469 |
1470 | // if there is a parent and it's not a document fragment
1471 | if( parent && parent.nodeType !== 11 ){
1472 | ret.push( parent );
1473 | }
1474 | });
1475 |
1476 | return shoestring(ret);
1477 | };
1478 |
1479 |
1480 |
1481 | /**
1482 | * Returns the set of all parents matching the selector if provided for each element in the current set.
1483 | *
1484 | * @param {string} selector The selector to check the parents with.
1485 | * @return shoestring
1486 | * @this shoestring
1487 | */
1488 | shoestring.fn.parents = function( selector ){
1489 | var ret = [];
1490 |
1491 | this.each(function(){
1492 | var curr = this, match;
1493 |
1494 | while( curr.parentElement && !match ){
1495 | curr = curr.parentElement;
1496 |
1497 | if( selector ){
1498 | if( curr === shoestring( selector )[0] ){
1499 | match = true;
1500 |
1501 | if( shoestring.inArray( curr, ret ) === -1 ){
1502 | ret.push( curr );
1503 | }
1504 | }
1505 | } else {
1506 | if( shoestring.inArray( curr, ret ) === -1 ){
1507 | ret.push( curr );
1508 | }
1509 | }
1510 | }
1511 | });
1512 |
1513 | return shoestring(ret);
1514 | };
1515 |
1516 |
1517 |
1518 | /**
1519 | * Add an HTML string or element before the children of each element in the current set.
1520 | *
1521 | * @param {string|HTMLElement} fragment The HTML string or element to add.
1522 | * @return shoestring
1523 | * @this shoestring
1524 | */
1525 | shoestring.fn.prepend = function( fragment ){
1526 | if( typeof( fragment ) === "string" || fragment.nodeType !== undefined ){
1527 | fragment = shoestring( fragment );
1528 | }
1529 |
1530 | return this.each(function( i ){
1531 |
1532 | for( var j = 0, jl = fragment.length; j < jl; j++ ){
1533 | var insertEl = i > 0 ? fragment[ j ].cloneNode( true ) : fragment[ j ];
1534 | if ( this.firstChild ){
1535 | this.insertBefore( insertEl, this.firstChild );
1536 | } else {
1537 | this.appendChild( insertEl );
1538 | }
1539 | }
1540 | });
1541 | };
1542 |
1543 |
1544 |
1545 | /**
1546 | * Add each element of the current set before the children of the selected elements.
1547 | *
1548 | * @param {string} selector The selector for the elements to add the current set to..
1549 | * @return shoestring
1550 | * @this shoestring
1551 | */
1552 | shoestring.fn.prependTo = function( selector ){
1553 | return this.each(function(){
1554 | shoestring( selector ).prepend( this );
1555 | });
1556 | };
1557 |
1558 |
1559 |
1560 | /**
1561 | * Returns a `shoestring` object with the set of *one* siblingx before each element in the original set.
1562 | *
1563 | * @return shoestring
1564 | * @this shoestring
1565 | */
1566 | shoestring.fn.prev = function(){
1567 | if( arguments.length > 0 ){
1568 | shoestring.error( 'prev-selector' );
1569 | }
1570 |
1571 | var result = [];
1572 |
1573 | // TODO need to implement map
1574 | this.each(function() {
1575 | var children, item, found;
1576 |
1577 | // get the child nodes for this member of the set
1578 | children = shoestring( this.parentNode )[0].childNodes;
1579 |
1580 | for( var i = children.length -1; i >= 0; i-- ){
1581 | item = children.item( i );
1582 |
1583 | // found the item we needed (found) which means current item value is
1584 | // the next node in the list, as long as it's viable grab it
1585 | // NOTE may need to be more permissive
1586 | if( found && item.nodeType === 1 ){
1587 | result.push( item );
1588 | break;
1589 | }
1590 |
1591 | // find the current item and mark it as found
1592 | if( item === this ){
1593 | found = true;
1594 | }
1595 | }
1596 | });
1597 |
1598 | return shoestring( result );
1599 | };
1600 |
1601 |
1602 |
1603 | /**
1604 | * Returns a `shoestring` object with the set of *all* siblings before each element in the original set.
1605 | *
1606 | * @return shoestring
1607 | * @this shoestring
1608 | */
1609 | shoestring.fn.prevAll = function(){
1610 | if( arguments.length > 0 ){
1611 | shoestring.error( 'prevall-selector' );
1612 | }
1613 |
1614 | var result = [];
1615 |
1616 | this.each(function() {
1617 | var $previous = shoestring( this ).prev();
1618 |
1619 | while( $previous.length ){
1620 | result.push( $previous[0] );
1621 | $previous = $previous.prev();
1622 | }
1623 | });
1624 |
1625 | return shoestring( result );
1626 | };
1627 |
1628 |
1629 |
1630 | // Property normalization, a subset taken from jQuery src
1631 | shoestring.propFix = {
1632 | "class": "className",
1633 | contenteditable: "contentEditable",
1634 | "for": "htmlFor",
1635 | readonly: "readOnly",
1636 | tabindex: "tabIndex"
1637 | };
1638 |
1639 |
1640 |
1641 | /**
1642 | * Gets the property value from the first element or sets the property value on all elements of the currrent set.
1643 | *
1644 | * @param {string} name The property name.
1645 | * @param {any} value The property value.
1646 | * @return {any|shoestring}
1647 | * @this shoestring
1648 | */
1649 | shoestring.fn.prop = function( name, value ){
1650 | if( !this[0] ){
1651 | return;
1652 | }
1653 |
1654 | name = shoestring.propFix[ name ] || name;
1655 |
1656 | if( value !== undefined ){
1657 | return this.each(function(){
1658 | this[ name ] = value;
1659 | });
1660 | } else {
1661 | return this[ 0 ][ name ];
1662 | }
1663 | };
1664 |
1665 |
1666 |
1667 | /**
1668 | * Remove an attribute from each element in the current set.
1669 | *
1670 | * @param {string} name The name of the attribute.
1671 | * @return shoestring
1672 | * @this shoestring
1673 | */
1674 | shoestring.fn.removeAttr = function( name ){
1675 | return this.each(function(){
1676 | this.removeAttribute( name );
1677 | });
1678 | };
1679 |
1680 |
1681 |
1682 | /**
1683 | * Remove a class from each DOM element in the set of elements.
1684 | *
1685 | * @param {string} className The name of the class to be removed.
1686 | * @return shoestring
1687 | * @this shoestring
1688 | */
1689 | shoestring.fn.removeClass = function( cname ){
1690 | var classes = cname.replace(/^\s+|\s+$/g, '').split( " " );
1691 |
1692 | return this.each(function(){
1693 | var newClassName, regex;
1694 |
1695 | for( var i = 0, il = classes.length; i < il; i++ ){
1696 | if( this.className !== undefined ){
1697 | regex = new RegExp( "(^|\\s)" + classes[ i ] + "($|\\s)", "gmi" );
1698 | newClassName = this.className.replace( regex, " " );
1699 |
1700 | this.className = newClassName.replace(/^\s+|\s+$/g, '');
1701 | }
1702 | }
1703 | });
1704 | };
1705 |
1706 |
1707 |
1708 | /**
1709 | * Remove the current set of elements from the DOM.
1710 | *
1711 | * @return shoestring
1712 | * @this shoestring
1713 | */
1714 | shoestring.fn.remove = function(){
1715 | return this.each(function(){
1716 | if( this.parentNode ) {
1717 | this.parentNode.removeChild( this );
1718 | }
1719 | });
1720 | };
1721 |
1722 |
1723 |
1724 | /**
1725 | * Remove a proprety from each element in the current set.
1726 | *
1727 | * @param {string} name The name of the property.
1728 | * @return shoestring
1729 | * @this shoestring
1730 | */
1731 | shoestring.fn.removeProp = function( property ){
1732 | var name = shoestring.propFix[ property ] || property;
1733 |
1734 | return this.each(function(){
1735 | this[ name ] = undefined;
1736 | delete this[ name ];
1737 | });
1738 | };
1739 |
1740 |
1741 |
1742 | /**
1743 | * Replace each element in the current set with that argument HTML string or HTMLElement.
1744 | *
1745 | * @param {string|HTMLElement} fragment The value to assign.
1746 | * @return shoestring
1747 | * @this shoestring
1748 | */
1749 | shoestring.fn.replaceWith = function( fragment ){
1750 | if( typeof( fragment ) === "string" ){
1751 | fragment = shoestring( fragment );
1752 | }
1753 |
1754 | var ret = [];
1755 |
1756 | if( fragment.length > 1 ){
1757 | fragment = fragment.reverse();
1758 | }
1759 | this.each(function( i ){
1760 | var clone = this.cloneNode( true ),
1761 | insertEl;
1762 | ret.push( clone );
1763 |
1764 | // If there is no parentNode, this is pointless, drop it.
1765 | if( !this.parentNode ){ return; }
1766 |
1767 | if( fragment.length === 1 ){
1768 | insertEl = i > 0 ? fragment[ 0 ].cloneNode( true ) : fragment[ 0 ];
1769 | this.parentNode.replaceChild( insertEl, this );
1770 | } else {
1771 | for( var j = 0, jl = fragment.length; j < jl; j++ ){
1772 | insertEl = i > 0 ? fragment[ j ].cloneNode( true ) : fragment[ j ];
1773 | this.parentNode.insertBefore( insertEl, this.nextSibling );
1774 | }
1775 | this.parentNode.removeChild( this );
1776 | }
1777 | });
1778 |
1779 | return shoestring( ret );
1780 | };
1781 |
1782 |
1783 |
1784 | shoestring.inputTypes = [
1785 | "text",
1786 | "hidden",
1787 | "password",
1788 | "color",
1789 | "date",
1790 | "datetime",
1791 | // "datetime\-local" matched by datetime
1792 | "email",
1793 | "month",
1794 | "number",
1795 | "range",
1796 | "search",
1797 | "tel",
1798 | "time",
1799 | "url",
1800 | "week"
1801 | ];
1802 |
1803 | shoestring.inputTypeTest = new RegExp( shoestring.inputTypes.join( "|" ) );
1804 |
1805 |
1806 | /**
1807 | * Serialize child input element values into an object.
1808 | *
1809 | * @return shoestring
1810 | * @this shoestring
1811 | */
1812 | shoestring.fn.serialize = function(){
1813 | var data = {};
1814 |
1815 | shoestring( "input, select", this ).each(function(){
1816 | var type = this.type, name = this.name, value = this.value;
1817 |
1818 | if( shoestring.inputTypeTest.test( type ) ||
1819 | ( type === "checkbox" || type === "radio" ) &&
1820 | this.checked ){
1821 |
1822 | data[ name ] = value;
1823 | } else if( this.nodeName === "SELECT" ){
1824 | data[ name ] = this.options[ this.selectedIndex ].nodeValue;
1825 | }
1826 | });
1827 |
1828 | return data;
1829 | };
1830 |
1831 |
1832 |
1833 | /**
1834 | * Get all of the sibling elements for each element in the current set.
1835 | *
1836 | * @return shoestring
1837 | * @this shoestring
1838 | */
1839 | shoestring.fn.siblings = function(){
1840 | if( !this.length ) {
1841 | return shoestring( [] );
1842 | }
1843 |
1844 | var sibs = [], el = this[ 0 ].parentNode.firstChild;
1845 |
1846 | do {
1847 | if( el.nodeType === 1 && el !== this[ 0 ] ) {
1848 | sibs.push( el );
1849 | }
1850 |
1851 | el = el.nextSibling;
1852 | } while( el );
1853 |
1854 | return shoestring( sibs );
1855 | };
1856 |
1857 |
1858 |
1859 | var getText = function( elem ){
1860 | var node,
1861 | ret = "",
1862 | i = 0,
1863 | nodeType = elem.nodeType;
1864 |
1865 | if ( !nodeType ) {
1866 | // If no nodeType, this is expected to be an array
1867 | while ( (node = elem[i++]) ) {
1868 | // Do not traverse comment nodes
1869 | ret += getText( node );
1870 | }
1871 | } else if ( nodeType === 1 || nodeType === 9 || nodeType === 11 ) {
1872 | // Use textContent for elements
1873 | // innerText usage removed for consistency of new lines (jQuery #11153)
1874 | if ( typeof elem.textContent === "string" ) {
1875 | return elem.textContent;
1876 | } else {
1877 | // Traverse its children
1878 | for ( elem = elem.firstChild; elem; elem = elem.nextSibling ) {
1879 | ret += getText( elem );
1880 | }
1881 | }
1882 | } else if ( nodeType === 3 || nodeType === 4 ) {
1883 | return elem.nodeValue;
1884 | }
1885 | // Do not include comment or processing instruction nodes
1886 |
1887 | return ret;
1888 | };
1889 |
1890 | /**
1891 | * Recursively retrieve the text content of the each element in the current set.
1892 | *
1893 | * @return shoestring
1894 | * @this shoestring
1895 | */
1896 | shoestring.fn.text = function() {
1897 | if( arguments.length > 0 ){
1898 | shoestring.error( 'text-setter' );
1899 | }
1900 |
1901 | return getText( this );
1902 | };
1903 |
1904 |
1905 |
1906 |
1907 | /**
1908 | * Get the value of the first element or set the value of all elements in the current set.
1909 | *
1910 | * @param {string} value The value to set.
1911 | * @return shoestring
1912 | * @this shoestring
1913 | */
1914 | shoestring.fn.val = function( value ){
1915 | var el;
1916 | if( value !== undefined ){
1917 | return this.each(function(){
1918 | if( this.tagName === "SELECT" ){
1919 | var optionSet, option,
1920 | options = this.options,
1921 | values = [],
1922 | i = options.length,
1923 | newIndex;
1924 |
1925 | values[0] = value;
1926 | while ( i-- ) {
1927 | option = options[ i ];
1928 | if ( (option.selected = shoestring.inArray( option.value, values ) >= 0) ) {
1929 | optionSet = true;
1930 | newIndex = i;
1931 | }
1932 | }
1933 | // force browsers to behave consistently when non-matching value is set
1934 | if ( !optionSet ) {
1935 | this.selectedIndex = -1;
1936 | } else {
1937 | this.selectedIndex = newIndex;
1938 | }
1939 | } else {
1940 | this.value = value;
1941 | }
1942 | });
1943 | } else {
1944 | el = this[0];
1945 |
1946 | if( el.tagName === "SELECT" ){
1947 | if( el.selectedIndex < 0 ){ return ""; }
1948 | return el.options[ el.selectedIndex ].value;
1949 | } else {
1950 | return el.value;
1951 | }
1952 | }
1953 | };
1954 |
1955 |
1956 |
1957 | /**
1958 | * Gets the width value of the first element or sets the width for the whole set.
1959 | *
1960 | * @param {float|undefined} value The value to assign.
1961 | * @return shoestring
1962 | * @this shoestring
1963 | */
1964 | shoestring.fn.width = function( value ){
1965 | return shoestring._dimension( this, "width", value );
1966 | };
1967 |
1968 |
1969 |
1970 | /**
1971 | * Wraps the child elements in the provided HTML.
1972 | *
1973 | * @param {string} html The wrapping HTML.
1974 | * @return shoestring
1975 | * @this shoestring
1976 | */
1977 | shoestring.fn.wrapInner = function( html ){
1978 | return this.each(function(){
1979 | var inH = this.innerHTML;
1980 |
1981 | this.innerHTML = "";
1982 | shoestring( this ).append( shoestring( html ).html( inH ) );
1983 | });
1984 | };
1985 |
1986 |
1987 |
1988 | function initEventCache( el, evt ) {
1989 | if ( !el.shoestringData ) {
1990 | el.shoestringData = {};
1991 | }
1992 | if ( !el.shoestringData.events ) {
1993 | el.shoestringData.events = {};
1994 | }
1995 | if ( !el.shoestringData.loop ) {
1996 | el.shoestringData.loop = {};
1997 | }
1998 | if ( !el.shoestringData.events[ evt ] ) {
1999 | el.shoestringData.events[ evt ] = [];
2000 | }
2001 | }
2002 |
2003 | function addToEventCache( el, evt, eventInfo ) {
2004 | var obj = {};
2005 | obj.isCustomEvent = eventInfo.isCustomEvent;
2006 | obj.callback = eventInfo.callfunc;
2007 | obj.originalCallback = eventInfo.originalCallback;
2008 | obj.namespace = eventInfo.namespace;
2009 |
2010 | el.shoestringData.events[ evt ].push( obj );
2011 |
2012 | if( eventInfo.customEventLoop ) {
2013 | el.shoestringData.loop[ evt ] = eventInfo.customEventLoop;
2014 | }
2015 | }
2016 |
2017 | // In IE8 the events trigger in a reverse order (LIFO). This code
2018 | // unbinds and rebinds all callbacks on an element in the a FIFO order.
2019 | function reorderEvents( node, eventName ) {
2020 | if( node.addEventListener || !node.shoestringData || !node.shoestringData.events ) {
2021 | // add event listner obviates the need for all the callback order juggling
2022 | return;
2023 | }
2024 |
2025 | var otherEvents = node.shoestringData.events[ eventName ] || [];
2026 | for( var j = otherEvents.length - 1; j >= 0; j-- ) {
2027 | // DOM Events only, Custom events maintain their own order internally.
2028 | if( !otherEvents[ j ].isCustomEvent ) {
2029 | node.detachEvent( "on" + eventName, otherEvents[ j ].callback );
2030 | node.attachEvent( "on" + eventName, otherEvents[ j ].callback );
2031 | }
2032 | }
2033 | }
2034 |
2035 | /**
2036 | * Bind a callback to an event for the currrent set of elements.
2037 | *
2038 | * @param {string} evt The event(s) to watch for.
2039 | * @param {object,function} data Data to be included with each event or the callback.
2040 | * @param {function} originalCallback Callback to be invoked when data is define.d.
2041 | * @return shoestring
2042 | * @this shoestring
2043 | */
2044 | shoestring.fn.bind = function( evt, data, originalCallback ){
2045 |
2046 | if( arguments.length > 3 ){
2047 | shoestring.error( 'on-delegate' );
2048 | }
2049 | if( typeof data === "string" ){
2050 | shoestring.error( 'on-delegate' );
2051 | }
2052 | if( typeof data === "function" ){
2053 | originalCallback = data;
2054 | data = null;
2055 | }
2056 |
2057 | var evts = evt.split( " " ),
2058 | docEl = document.documentElement;
2059 |
2060 | // NOTE the `triggeredElement` is purely for custom events from IE
2061 | function encasedCallback( e, namespace, triggeredElement ){
2062 | var result;
2063 |
2064 | if( e._namespace && e._namespace !== namespace ) {
2065 | return;
2066 | }
2067 |
2068 | e.data = data;
2069 | e.namespace = e._namespace;
2070 |
2071 | var returnTrue = function(){
2072 | return true;
2073 | };
2074 |
2075 | e.isDefaultPrevented = function(){
2076 | return false;
2077 | };
2078 |
2079 | var originalPreventDefault = e.preventDefault;
2080 | var preventDefaultConstructor = function(){
2081 | if( originalPreventDefault ) {
2082 | return function(){
2083 | e.isDefaultPrevented = returnTrue;
2084 | originalPreventDefault.call(e);
2085 | };
2086 | } else {
2087 | return function(){
2088 | e.isDefaultPrevented = returnTrue;
2089 | e.returnValue = false;
2090 | };
2091 | }
2092 | };
2093 |
2094 | // thanks https://github.com/jonathantneal/EventListener
2095 | e.target = triggeredElement || e.target || e.srcElement;
2096 | e.preventDefault = preventDefaultConstructor();
2097 | e.stopPropagation = e.stopPropagation || function () {
2098 | e.cancelBubble = true;
2099 | };
2100 |
2101 | result = originalCallback.apply(this, [ e ].concat( e._args ) );
2102 |
2103 | if( result === false ){
2104 | e.preventDefault();
2105 | e.stopPropagation();
2106 | }
2107 |
2108 | return result;
2109 | }
2110 |
2111 | // This is exclusively for custom events on browsers without addEventListener (IE8)
2112 | function propChange( originalEvent, boundElement, namespace ) {
2113 | var lastEventInfo = document.documentElement[ originalEvent.propertyName ],
2114 | triggeredElement = lastEventInfo.el;
2115 |
2116 | var boundCheckElement = boundElement;
2117 |
2118 | if( boundElement === document && triggeredElement !== document ) {
2119 | boundCheckElement = document.documentElement;
2120 | }
2121 |
2122 | if( triggeredElement !== undefined &&
2123 | shoestring( triggeredElement ).closest( boundCheckElement ).length ) {
2124 |
2125 | originalEvent._namespace = lastEventInfo._namespace;
2126 | originalEvent._args = lastEventInfo._args;
2127 | encasedCallback.call( boundElement, originalEvent, namespace, triggeredElement );
2128 | }
2129 | }
2130 |
2131 | return this.each(function(){
2132 | var domEventCallback,
2133 | customEventCallback,
2134 | customEventLoop,
2135 | oEl = this;
2136 |
2137 | for( var i = 0, il = evts.length; i < il; i++ ){
2138 | var split = evts[ i ].split( "." ),
2139 | evt = split[ 0 ],
2140 | namespace = split.length > 0 ? split[ 1 ] : null;
2141 |
2142 | domEventCallback = function( originalEvent ) {
2143 | if( oEl.ssEventTrigger ) {
2144 | originalEvent._namespace = oEl.ssEventTrigger._namespace;
2145 | originalEvent._args = oEl.ssEventTrigger._args;
2146 |
2147 | oEl.ssEventTrigger = null;
2148 | }
2149 | return encasedCallback.call( oEl, originalEvent, namespace );
2150 | };
2151 | customEventCallback = null;
2152 | customEventLoop = null;
2153 |
2154 | initEventCache( this, evt );
2155 |
2156 | if( "addEventListener" in this ){
2157 | this.addEventListener( evt, domEventCallback, false );
2158 | } else if( this.attachEvent ){
2159 | if( this[ "on" + evt ] !== undefined ) {
2160 | this.attachEvent( "on" + evt, domEventCallback );
2161 | } else {
2162 | customEventCallback = (function() {
2163 | var eventName = evt;
2164 | return function( e ) {
2165 | if( e.propertyName === eventName ) {
2166 | propChange( e, oEl, namespace );
2167 | }
2168 | };
2169 | })();
2170 |
2171 | // only assign one onpropertychange per element
2172 | if( this.shoestringData.events[ evt ].length === 0 ) {
2173 | customEventLoop = (function() {
2174 | var eventName = evt;
2175 | return function( e ) {
2176 | if( !oEl.shoestringData || !oEl.shoestringData.events ) {
2177 | return;
2178 | }
2179 | var events = oEl.shoestringData.events[ eventName ];
2180 | if( !events ) {
2181 | return;
2182 | }
2183 |
2184 | // TODO stopImmediatePropagation
2185 | for( var j = 0, k = events.length; j < k; j++ ) {
2186 | events[ j ].callback( e );
2187 | }
2188 | };
2189 | })();
2190 |
2191 | docEl.attachEvent( "onpropertychange", customEventLoop );
2192 | }
2193 | }
2194 | }
2195 |
2196 | addToEventCache( this, evt, {
2197 | callfunc: customEventCallback || domEventCallback,
2198 | isCustomEvent: !!customEventCallback,
2199 | customEventLoop: customEventLoop,
2200 | originalCallback: originalCallback,
2201 | namespace: namespace
2202 | });
2203 |
2204 | // Don’t reorder custom events, only DOM Events.
2205 | if( !customEventCallback ) {
2206 | reorderEvents( oEl, evt );
2207 | }
2208 | }
2209 | });
2210 | };
2211 |
2212 | shoestring.fn.on = shoestring.fn.bind;
2213 |
2214 | shoestring.fn.live = function(){
2215 | shoestring.error( 'live-delegate' );
2216 | };
2217 |
2218 | shoestring.fn.delegate = function(){
2219 | shoestring.error( 'live-delegate' );
2220 | };
2221 |
2222 |
2223 |
2224 | /**
2225 | * Unbind a previous bound callback for an event.
2226 | *
2227 | * @param {string} event The event(s) the callback was bound to..
2228 | * @param {function} callback Callback to unbind.
2229 | * @return shoestring
2230 | * @this shoestring
2231 | */
2232 | shoestring.fn.unbind = function( event, callback ){
2233 |
2234 | if( arguments.length >= 3 || typeof callback === "string" ){
2235 | shoestring.error( 'off-delegate' );
2236 | }
2237 |
2238 | var evts = event ? event.split( " " ) : [];
2239 |
2240 | return this.each(function(){
2241 | if( !this.shoestringData || !this.shoestringData.events ) {
2242 | return;
2243 | }
2244 |
2245 | if( !evts.length ) {
2246 | unbindAll.call( this );
2247 | } else {
2248 | var split, evt, namespace;
2249 | for( var i = 0, il = evts.length; i < il; i++ ){
2250 | split = evts[ i ].split( "." ),
2251 | evt = split[ 0 ],
2252 | namespace = split.length > 0 ? split[ 1 ] : null;
2253 |
2254 | if( evt ) {
2255 | unbind.call( this, evt, namespace, callback );
2256 | } else {
2257 | unbindAll.call( this, namespace, callback );
2258 | }
2259 | }
2260 | }
2261 | });
2262 | };
2263 |
2264 | function unbind( evt, namespace, callback ) {
2265 | var bound = this.shoestringData.events[ evt ];
2266 | if( !(bound && bound.length) ) {
2267 | return;
2268 | }
2269 |
2270 | var matched = [], j, jl;
2271 | for( j = 0, jl = bound.length; j < jl; j++ ) {
2272 | if( !namespace || namespace === bound[ j ].namespace ) {
2273 | if( callback === undefined || callback === bound[ j ].originalCallback ) {
2274 | if( "removeEventListener" in window ){
2275 | this.removeEventListener( evt, bound[ j ].callback, false );
2276 | } else if( this.detachEvent ){
2277 | // dom event
2278 | this.detachEvent( "on" + evt, bound[ j ].callback );
2279 |
2280 | // only unbind custom events if its the last one on the element
2281 | if( bound.length === 1 && this.shoestringData.loop && this.shoestringData.loop[ evt ] ) {
2282 | document.documentElement.detachEvent( "onpropertychange", this.shoestringData.loop[ evt ] );
2283 | }
2284 | }
2285 | matched.push( j );
2286 | }
2287 | }
2288 | }
2289 |
2290 | for( j = 0, jl = matched.length; j < jl; j++ ) {
2291 | this.shoestringData.events[ evt ].splice( j, 1 );
2292 | }
2293 | }
2294 |
2295 | function unbindAll( namespace, callback ) {
2296 | for( var evtKey in this.shoestringData.events ) {
2297 | unbind.call( this, evtKey, namespace, callback );
2298 | }
2299 | }
2300 |
2301 | shoestring.fn.off = shoestring.fn.unbind;
2302 |
2303 |
2304 | /**
2305 | * Bind a callback to an event for the currrent set of elements, unbind after one occurence.
2306 | *
2307 | * @param {string} event The event(s) to watch for.
2308 | * @param {function} callback Callback to invoke on the event.
2309 | * @return shoestring
2310 | * @this shoestring
2311 | */
2312 | shoestring.fn.one = function( event, callback ){
2313 | var evts = event.split( " " );
2314 |
2315 | return this.each(function(){
2316 | var thisevt, cbs = {}, $t = shoestring( this );
2317 |
2318 | for( var i = 0, il = evts.length; i < il; i++ ){
2319 | thisevt = evts[ i ];
2320 |
2321 | cbs[ thisevt ] = function( e ){
2322 | var $t = shoestring( this );
2323 |
2324 | for( var j in cbs ) {
2325 | $t.unbind( j, cbs[ j ] );
2326 | }
2327 |
2328 | return callback.apply( this, [ e ].concat( e._args ) );
2329 | };
2330 |
2331 | $t.bind( thisevt, cbs[ thisevt ] );
2332 | }
2333 | });
2334 | };
2335 |
2336 |
2337 |
2338 | /**
2339 | * Trigger an event on the first element in the set, no bubbling, no defaults.
2340 | *
2341 | * @param {string} event The event(s) to trigger.
2342 | * @param {object} args Arguments to append to callback invocations.
2343 | * @return shoestring
2344 | * @this shoestring
2345 | */
2346 | shoestring.fn.triggerHandler = function( event, args ){
2347 | var e = event.split( " " )[ 0 ],
2348 | el = this[ 0 ],
2349 | ret;
2350 |
2351 | // TODO needs IE8 support
2352 | // See this.fireEvent( 'on' + evts[ i ], document.createEventObject() ); instead of click() etc in trigger.
2353 | if( document.createEvent && el.shoestringData && el.shoestringData.events && el.shoestringData.events[ e ] ){
2354 | var bindings = el.shoestringData.events[ e ];
2355 | for (var i in bindings ){
2356 | if( bindings.hasOwnProperty( i ) ){
2357 | event = document.createEvent( "Event" );
2358 | event.initEvent( e, true, true );
2359 | event._args = args;
2360 | args.unshift( event );
2361 |
2362 | ret = bindings[ i ].originalCallback.apply( event.target, args );
2363 | }
2364 | }
2365 | }
2366 |
2367 | return ret;
2368 | };
2369 |
2370 |
2371 |
2372 | /**
2373 | * Trigger an event on each of the DOM elements in the current set.
2374 | *
2375 | * @param {string} event The event(s) to trigger.
2376 | * @param {object} args Arguments to append to callback invocations.
2377 | * @return shoestring
2378 | * @this shoestring
2379 | */
2380 | shoestring.fn.trigger = function( event, args ){
2381 | var evts = event.split( " " );
2382 |
2383 | return this.each(function(){
2384 | var split, evt, namespace;
2385 | for( var i = 0, il = evts.length; i < il; i++ ){
2386 | split = evts[ i ].split( "." ),
2387 | evt = split[ 0 ],
2388 | namespace = split.length > 0 ? split[ 1 ] : null;
2389 |
2390 | if( evt === "click" ){
2391 | if( this.tagName === "INPUT" && this.type === "checkbox" && this.click ){
2392 | this.click();
2393 | return false;
2394 | }
2395 | }
2396 |
2397 | if( document.createEvent ){
2398 | var event = document.createEvent( "Event" );
2399 | event.initEvent( evt, true, true );
2400 | event._args = args;
2401 | event._namespace = namespace;
2402 |
2403 | this.dispatchEvent( event );
2404 | } else if ( document.createEventObject ) {
2405 | if( ( "" + this[ evt ] ).indexOf( "function" ) > -1 ) {
2406 | this.ssEventTrigger = {
2407 | _namespace: namespace,
2408 | _args: args
2409 | };
2410 |
2411 | this[ evt ]();
2412 | } else {
2413 | document.documentElement[ evt ] = {
2414 | "el": this,
2415 | _namespace: namespace,
2416 | _args: args
2417 | };
2418 | }
2419 | }
2420 | }
2421 | });
2422 | };
2423 |
2424 |
2425 |
2426 |
2427 | shoestring.fn.hasClass = function(){
2428 | shoestring.error( 'has-class' );
2429 | };
2430 |
2431 |
2432 |
2433 | shoestring.fn.hide = function(){
2434 | shoestring.error( 'show-hide' );
2435 | };
2436 |
2437 |
2438 |
2439 | shoestring.fn.outerWidth = function(){
2440 | shoestring.error( 'outer-width' );
2441 | };
2442 |
2443 |
2444 |
2445 | shoestring.fn.show = function(){
2446 | shoestring.error( 'show-hide' );
2447 | };
2448 |
2449 |
2450 |
2451 | shoestring.fn.click = function(){
2452 | shoestring.error( 'click' );
2453 | };
2454 |
2455 |
2456 |
2457 | shoestring.map = function(){
2458 | shoestring.error( 'map' );
2459 | };
2460 |
2461 |
2462 |
2463 | shoestring.fn.map = function(){
2464 | shoestring.error( 'map' );
2465 | };
2466 |
2467 |
2468 |
2469 | shoestring.trim = function(){
2470 | shoestring.error( 'trim' );
2471 | };
2472 |
2473 |
2474 |
2475 | (function() {
2476 | shoestring.trackedMethodsKey = "shoestringMethods";
2477 |
2478 | // simple check for localStorage from Modernizr - https://github.com/Modernizr/Modernizr/blob/master/feature-detects/storage/localstorage.js
2479 | function supportsStorage() {
2480 | var mod = "modernizr";
2481 | try {
2482 | localStorage.setItem(mod, mod);
2483 | localStorage.removeItem(mod);
2484 | return true;
2485 | } catch(e) {
2486 | return false;
2487 | }
2488 | }
2489 |
2490 | // return a new function closed over the old implementation
2491 | function recordProxy( old, name ) {
2492 | return function() {
2493 | var tracked;
2494 | try {
2495 | tracked = JSON.parse(window.localStorage.getItem( shoestring.trackedMethodsKey ) || "{}");
2496 | } catch (e) {
2497 | if( e instanceof SyntaxError) {
2498 | tracked = {};
2499 | }
2500 | }
2501 |
2502 | tracked[ name ] = true;
2503 | window.localStorage.setItem( shoestring.trackedMethodsKey, JSON.stringify(tracked) );
2504 |
2505 | return old.apply(this, arguments);
2506 | };
2507 | }
2508 |
2509 | // proxy each of the methods defined on fn
2510 | if( supportsStorage() ){
2511 | for( var method in shoestring.fn ){
2512 | if( shoestring.fn.hasOwnProperty(method) ) {
2513 | shoestring.fn[ method ] = recordProxy(shoestring.fn[ method ], method);
2514 | }
2515 | }
2516 | }
2517 | })();
2518 |
2519 |
2520 |
2521 | })( this );
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "fg-menu",
3 | "filename": "menu",
4 | "title": "Menu",
5 | "description": "jQuery Plugin for progressively enhanced menus",
6 | "version": "0.1.5",
7 | "homepage": "https://github.com/filamentgroup/menu",
8 | "author": {
9 | "name": "Scott Jehl",
10 | "email": "scott@filamentgroup.com",
11 | "url": "http://filamentgroup.com"
12 | },
13 | "repository": {
14 | "type": "git",
15 | "url": "https://github.com/filamentgroup/menu.git"
16 | },
17 | "bugs": "https://github.com/filamentgroup/menu/issues",
18 | "license": "MIT",
19 | "dependencies": {
20 | "jquery": "*"
21 | },
22 | "devDependencies": {
23 | "grunt-contrib-jshint": "~0.6.0",
24 | "grunt-contrib-qunit": "~0.2.0",
25 | "grunt-contrib-concat": "~0.3.0",
26 | "grunt-contrib-uglify": "~0.2.0",
27 | "grunt-contrib-watch": "~0.4.0",
28 | "grunt-contrib-clean": "~0.4.0",
29 | "grunt": "~0.4.2"
30 | },
31 | "keywords": []
32 | }
33 |
--------------------------------------------------------------------------------
/src/.jshintrc:
--------------------------------------------------------------------------------
1 | {
2 | "curly": true,
3 | "eqeqeq": true,
4 | "immed": true,
5 | "latedef": true,
6 | "newcap": true,
7 | "noarg": true,
8 | "sub": true,
9 | "undef": true,
10 | "unused": true,
11 | "boss": true,
12 | "eqnull": true,
13 | "browser": true,
14 | "predef": ["jQuery"]
15 | }
--------------------------------------------------------------------------------
/src/menu-init.js:
--------------------------------------------------------------------------------
1 | /*
2 | * menu plugin
3 | *
4 | * Copyright (c) 2013 Filament Group, Inc.
5 | * Licensed under MIT
6 | */
7 |
8 | /* global Menu:true */
9 | (function( Menu, $ ) {
10 |
11 | var pluginName = "menu",
12 | initSelector = "[data-" + pluginName + "]";
13 |
14 | $.fn[ pluginName ] = function(){
15 | return this.each(function(){
16 | new window.componentNamespace.Menu( this ).init();
17 | });
18 | };
19 |
20 | // auto-init on enhance (which is called on domready)
21 | $( document ).bind( "enhance", function( e ){
22 | $( initSelector, e.target )[ pluginName ]();
23 | });
24 |
25 | }( Menu, jQuery, this ));
26 |
--------------------------------------------------------------------------------
/src/menu-trigger-init.js:
--------------------------------------------------------------------------------
1 | /*
2 | * menu trigger plugin
3 | *
4 | * Copyright (c) 2013 Filament Group, Inc.
5 | * Licensed under MIT
6 | */
7 |
8 | /* global Menutrigger:true */
9 | (function( Menutrigger, $ ) {
10 |
11 | var pluginName = "menu-trigger",
12 | initSelector = "[data-" + pluginName + "]";
13 |
14 | $.fn[ pluginName ] = function(){
15 | return this.each(function(){
16 | new Menutrigger( this ).init();
17 | });
18 | };
19 |
20 | // auto-init on enhance (which is called on domready)
21 | $( document ).bind( "enhance", function( e ){
22 | $( initSelector, e.target )[ pluginName ]();
23 | });
24 |
25 | }( Menutrigger, jQuery, this ));
26 |
27 |
--------------------------------------------------------------------------------
/src/menu-trigger.js:
--------------------------------------------------------------------------------
1 | /*
2 | * menu-trigger plugin
3 | *
4 | * Copyright (c) 2013 Filament Group, Inc.
5 | * Licensed under MIT
6 | */
7 |
8 | (function( $, w ) {
9 | "use strict";
10 |
11 | var componentName = "Menutrigger";
12 |
13 | var Menutrigger = function( element ){
14 | if( !element ){
15 | throw new Error( "Element required to initialize object" );
16 | }
17 | this.element = element;
18 | this.$element = $( element );
19 | this.$menu = $( "#" + this.$element.attr( "data-menu-trigger" ) );
20 | this.menu = this.$menu.data( "Menu" );
21 | };
22 |
23 | Menutrigger.prototype._bindbehavior = function(){
24 | var self = this;
25 |
26 | if( this.$element.is( "a" ) ){
27 | this.$element
28 | .attr( "role", "button" )
29 | .bind( "click", function( e ){
30 | e.preventDefault();
31 | self.menu.toggle( this, true );
32 | });
33 | }
34 | else if( this.$element.is( "input" ) ){
35 | this.$element
36 | .bind( "input keyup", function(){
37 | if( this.value === "" ){
38 | self.menu.close();
39 | }
40 | else {
41 | self.menu.open( this, false );
42 | }
43 |
44 | })
45 | .bind( "input keydown", function( e ){
46 | self.menu.keyDown( e );
47 | })
48 | .bind( "focus click", function(){
49 | if( this.value !== "" ){
50 | self.menu.open();
51 | }
52 | } )
53 | .bind( "blur", function(){
54 | self.menu.close();
55 | });
56 | }
57 | };
58 |
59 | Menutrigger.prototype.init = function(){
60 | // prevent re-init
61 | if( this.$element.data( componentName ) ) {
62 | return;
63 | }
64 | this.$element.data( componentName, this );
65 |
66 | // add attrs
67 | this.$element.attr( "aria-controls", this.$menu.attr( "id" ) );
68 | this.$element.attr( "aria-haspopup", "true" );
69 |
70 | this._bindbehavior();
71 |
72 | this.$element.trigger( componentName + ":init" );
73 | };
74 |
75 | w[ componentName ] = Menutrigger;
76 |
77 | }( jQuery, this ));
78 |
79 |
--------------------------------------------------------------------------------
/src/menu.css:
--------------------------------------------------------------------------------
1 | /* menu component */
2 | [data-menu] {
3 | position: absolute;
4 | }
5 | [data-menu][aria-hidden=true] {
6 | display: none;
7 | }
--------------------------------------------------------------------------------
/src/menu.js:
--------------------------------------------------------------------------------
1 | /*
2 | * menu plugin
3 | *
4 | * Copyright (c) 2013 Filament Group, Inc.
5 | * Licensed under MIT
6 | */
7 |
8 | window.jQuery = window.jQuery || window.shoestring;
9 |
10 | (function( $, w ) {
11 | "use strict";
12 |
13 | var componentName = "Menu",
14 | at = {
15 | ariaHidden: "aria-hidden"
16 | },
17 | selectClass = "menu-selected",
18 | focusables = "a,input,[tabindex]";
19 |
20 | var menu = function( element ){
21 | if( !element ){
22 | throw new Error( "Element required to initialize object" );
23 | }
24 | this.element = element;
25 | this.$element = $( element );
26 | this.opened = true;
27 | };
28 |
29 | menu.prototype.fill = function( items, selectedText ) {
30 | var html = "";
31 |
32 | $.each( items, function( i, item ){
33 | html += "" + item + "";
36 | });
37 |
38 | this.$element.find( "ol,ul" ).html( html );
39 | };
40 |
41 | menu.prototype.moveSelected = function( placement, focus ){
42 | var $items = this.$element.find( "li" ),
43 | $selected = $items.filter( "." + selectClass ),
44 | $nextSelected;
45 |
46 | if( !$selected.length || placement === "start" ){
47 | $nextSelected = $items.eq( 0 );
48 | }
49 | else if( placement === "next" ){
50 | $nextSelected = $selected.next();
51 | if( !$nextSelected.length ){
52 | $nextSelected = $items.eq( 0 );
53 | }
54 | }
55 | else {
56 | $nextSelected = $selected.prev();
57 | if( !$nextSelected.length ){
58 | $nextSelected = $items.eq( $items.length - 1 );
59 | }
60 | }
61 | $selected.removeClass( selectClass );
62 | $nextSelected.addClass( selectClass );
63 |
64 | if( focus || $( w.document.activeElement ).closest( $selected ).length ){
65 | if( $nextSelected.is( focusables ) ){
66 | $nextSelected[ 0 ].focus();
67 | }
68 | else{
69 | var $focusChild = $nextSelected.find( focusables );
70 | if( $focusChild.length ){
71 | $focusChild[ 0 ].focus();
72 | }
73 | }
74 | }
75 | };
76 |
77 | menu.prototype.getSelectedElement = function(){
78 | return this.$element.find( "li." + selectClass );
79 | };
80 |
81 | menu.prototype.selectActive = function(){
82 | var trigger = this.$element.data( componentName + "-trigger" );
83 | var $selected = this.getSelectedElement();
84 |
85 | if( trigger && $( trigger ).is( "input" ) ){
86 | trigger.value = $selected.text();
87 | }
88 | $selected.trigger( componentName + ":select" );
89 | this.close();
90 | return $selected.text();
91 | };
92 |
93 | menu.prototype.keycodes = {
94 | 38 : function(e) {
95 | this.moveSelected( "prev" );
96 | e.preventDefault();
97 | },
98 |
99 | 40 : function(e){
100 | this.moveSelected( "next" );
101 | e.preventDefault();
102 | },
103 |
104 | 13 : function(){
105 | // return the selected value
106 | return this.selectActive();
107 | },
108 |
109 | 9 : function(e){
110 | this.moveSelected( e.shiftKey ? "prev" : "next" );
111 | e.preventDefault();
112 | },
113 |
114 | 27 : function(){
115 | this.close();
116 | }
117 | };
118 |
119 | menu.prototype.keyDown = function( e ){
120 | var fn = this.keycodes[e.keyCode] || function(){};
121 | return fn.call( this, e );
122 | };
123 |
124 | menu.prototype._bindKeyHandling = function(){
125 | var self = this;
126 | this.$element
127 | .bind( "keydown", function( e ){
128 | self.keyDown( e );
129 | } )
130 | .bind( "mouseover", function( e ){
131 | self.$element.find( "." + selectClass ).removeClass( selectClass );
132 | $( e.target ).closest( "li" ).addClass( selectClass );
133 | })
134 | .bind( "mouseleave", function( e ){
135 | $( e.target ).closest( "li" ).removeClass( selectClass );
136 | })
137 | .bind( "click", function(){
138 | self.selectActive();
139 | });
140 | };
141 |
142 | menu.prototype.open = function( trigger, sendFocus ){
143 | if( this.opened ){
144 | return;
145 | }
146 | this.$element.attr( at.ariaHidden, false );
147 |
148 | this.$element.data( componentName + "-trigger", trigger );
149 | this.opened = true;
150 | this.moveSelected( "start", sendFocus );
151 | this.$element.trigger( componentName + ":open" );
152 | };
153 |
154 | menu.prototype.close = function(){
155 | if( !this.opened ){
156 | return;
157 | }
158 | this.$element.attr( at.ariaHidden, true );
159 | this.opened = false;
160 | var $trigger = this.$element.data( componentName + "-trigger" );
161 | if( $trigger ){
162 | $trigger.focus();
163 | }
164 | this.$element.trigger( componentName + ":close" );
165 | };
166 |
167 | menu.prototype.toggle = function( trigger, sendFocus ){
168 | this[ this.opened ? "close" : "open" ]( trigger, sendFocus );
169 | };
170 |
171 | menu.prototype.init = function(){
172 | // prevent re-init
173 | if( this.$element.data( componentName ) ) {
174 | return;
175 | }
176 | this.$element.data( componentName, this );
177 |
178 | this.$element.attr( "role", "menu" );
179 | this.close();
180 | var self = this;
181 |
182 | $( document ).bind( "mouseup", function(event){
183 | // only close the menu if the click is outside the menu element
184 | if( ! $(event.target).closest( self.$element[0] ).length ){
185 | self.close();
186 | }
187 | });
188 |
189 | this._bindKeyHandling();
190 |
191 | this.$element.trigger( componentName + ":init" );
192 | };
193 |
194 | menu.prototype.isOpen = function(){
195 | return this.opened;
196 | };
197 |
198 | (w.componentNamespace = w.componentNamespace || w)[ componentName ] = menu;
199 | }( jQuery, this ));
200 |
--------------------------------------------------------------------------------
/test/.jshintrc:
--------------------------------------------------------------------------------
1 | {
2 | "curly": true,
3 | "eqeqeq": true,
4 | "immed": true,
5 | "latedef": true,
6 | "newcap": true,
7 | "noarg": true,
8 | "sub": true,
9 | "undef": true,
10 | "unused": true,
11 | "boss": true,
12 | "eqnull": true,
13 | "browser": true,
14 | "predef": [
15 | "jQuery",
16 | "QUnit",
17 | "module",
18 | "test",
19 | "asyncTest",
20 | "expect",
21 | "start",
22 | "stop",
23 | "ok",
24 | "equal",
25 | "notEqual",
26 | "deepEqual",
27 | "notDeepEqual",
28 | "strictEqual",
29 | "notStrictEqual",
30 | "throws"
31 | ]
32 | }
--------------------------------------------------------------------------------
/test/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 | Menu Test Suite
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
17 |
29 |