From da84672db8ad1f3909e645a665e9a9c6c0de0ded Mon Sep 17 00:00:00 2001 From: Scott González Date: Wed, 8 Jun 2011 17:02:57 -0400 Subject: .attr() -> .prop() --- ui/jquery.ui.accordion.js | 38 +++++++++++++++++++------------------- ui/jquery.ui.autocomplete.js | 8 ++++---- ui/jquery.ui.button.js | 24 ++++++++++++------------ ui/jquery.ui.datepicker.js | 6 +++--- ui/jquery.ui.dialog.js | 4 ++-- ui/jquery.ui.menu.js | 28 ++++++++++++++-------------- ui/jquery.ui.menubar.js | 36 +++++++++++++++++++++--------------- ui/jquery.ui.popup.js | 16 ++++++++-------- ui/jquery.ui.slider.js | 4 ++-- ui/jquery.ui.spinner.js | 6 +++--- ui/jquery.ui.widget.js | 4 ++-- 11 files changed, 90 insertions(+), 84 deletions(-) (limited to 'ui') diff --git a/ui/jquery.ui.accordion.js b/ui/jquery.ui.accordion.js index 7602ae9bc..fc0ba3910 100644 --- a/ui/jquery.ui.accordion.js +++ b/ui/jquery.ui.accordion.js @@ -78,11 +78,11 @@ $.widget( "ui.accordion", { self.headers .not( self.active ) - .attr({ - "aria-expanded": "false", - "aria-selected": "false", - tabIndex: -1 + .prop({ + "aria-expanded": false, + "aria-selected": false }) + .attr( "tabIndex", -1 ) .next() .hide(); @@ -91,11 +91,11 @@ $.widget( "ui.accordion", { self.headers.eq( 0 ).attr( "tabIndex", 0 ); } else { self.active - .attr({ - "aria-expanded": "true", - "aria-selected": "true", - tabIndex: 0 - }); + .prop({ + "aria-expanded": true, + "aria-selected": true + }) + .attr( "tabIndex", 0 ); } // only need links in tab order for Safari @@ -135,8 +135,8 @@ $.widget( "ui.accordion", { .unbind( ".accordion" ) .removeClass( "ui-accordion-header ui-accordion-disabled ui-helper-reset ui-state-default ui-corner-all ui-state-active ui-state-disabled ui-corner-top" ) .removeAttr( "role" ) - .removeAttr( "aria-expanded" ) - .removeAttr( "aria-selected" ) + .removeProp( "aria-expanded" ) + .removeProp( "aria-selected" ) .removeAttr( "tabIndex" ) .find( "a" ) .removeAttr( "tabIndex" ) @@ -393,18 +393,18 @@ $.widget( "ui.accordion", { // TODO assert that the blur and focus triggers are really necessary, remove otherwise toHide.prev() - .attr({ - "aria-expanded": "false", - "aria-selected": "false", - tabIndex: -1 + .prop({ + "aria-expanded": false, + "aria-selected": false }) + .attr( "tabIndex", -1 ) .blur(); toShow.prev() - .attr({ - "aria-expanded": "true", - "aria-selected": "true", - tabIndex: 0 + .prop({ + "aria-expanded": true, + "aria-selected": true }) + .attr( "tabIndex", 0 ) .focus(); }, diff --git a/ui/jquery.ui.autocomplete.js b/ui/jquery.ui.autocomplete.js index e39b4649e..3f5e2d10a 100644 --- a/ui/jquery.ui.autocomplete.js +++ b/ui/jquery.ui.autocomplete.js @@ -59,11 +59,11 @@ $.widget( "ui.autocomplete", { // TODO verify these actually work as intended .attr({ role: "textbox", - "aria-autocomplete": "list", - "aria-haspopup": "true" + "aria-autocomplete": "list" }) + .prop( "aria-haspopup", true ) .bind( "keydown.autocomplete", function( event ) { - if ( self.options.disabled || self.element.attr( "readonly" ) ) { + if ( self.options.disabled || self.element.prop( "readonly" ) ) { suppressKeyPress = true; suppressInput = true; return; @@ -268,7 +268,7 @@ $.widget( "ui.autocomplete", { .removeAttr( "autocomplete" ) .removeAttr( "role" ) .removeAttr( "aria-autocomplete" ) - .removeAttr( "aria-haspopup" ); + .removeProp( "aria-haspopup" ); this.menu.element.remove(); }, diff --git a/ui/jquery.ui.button.js b/ui/jquery.ui.button.js index 482cdc24c..5f48f69a2 100644 --- a/ui/jquery.ui.button.js +++ b/ui/jquery.ui.button.js @@ -58,7 +58,7 @@ $.widget( "ui.button", { .bind( "reset.button", formResetHandler ); if ( typeof this.options.disabled !== "boolean" ) { - this.options.disabled = this.element.attr( "disabled" ); + this.options.disabled = this.element.prop( "disabled" ); } this._determineButtonType(); @@ -147,7 +147,7 @@ $.widget( "ui.button", { return false; } $( this ).toggleClass( "ui-state-active" ); - self.buttonElement.attr( "aria-pressed", self.element[0].checked ); + self.buttonElement.prop( "aria-pressed", self.element[0].checked ); }); } else if ( this.type === "radio" ) { this.buttonElement.bind( "click.button", function() { @@ -155,7 +155,7 @@ $.widget( "ui.button", { return false; } $( this ).addClass( "ui-state-active" ); - self.buttonElement.attr( "aria-pressed", true ); + self.buttonElement.prop( "aria-pressed", true ); var radio = self.element[ 0 ]; radioGroup( radio ) @@ -164,7 +164,7 @@ $.widget( "ui.button", { return $( this ).button( "widget" )[ 0 ]; }) .removeClass( "ui-state-active" ) - .attr( "aria-pressed", false ); + .prop( "aria-pressed", false ); }); } else { this.buttonElement @@ -244,7 +244,7 @@ $.widget( "ui.button", { if ( checked ) { this.buttonElement.addClass( "ui-state-active" ); } - this.buttonElement.attr( "aria-pressed", checked ); + this.buttonElement.prop( "aria-pressed", checked ); } else { this.buttonElement = this.element; } @@ -260,7 +260,7 @@ $.widget( "ui.button", { this.buttonElement .removeClass( baseClasses + " " + stateClasses + " " + typeClasses ) .removeAttr( "role" ) - .removeAttr( "aria-pressed" ) + .removeProp( "aria-pressed" ) .html( this.buttonElement.find(".ui-button-text").html() ); if ( !this.hasTitle ) { @@ -272,9 +272,9 @@ $.widget( "ui.button", { this._super( "_setOption", key, value ); if ( key === "disabled" ) { if ( value ) { - this.element.attr( "disabled", true ); + this.element.prop( "disabled", true ); } else { - this.element.removeAttr( "disabled" ); + this.element.prop( "disabled", false ); } return; } @@ -291,22 +291,22 @@ $.widget( "ui.button", { if ( $( this ).is( ":checked" ) ) { $( this ).button( "widget" ) .addClass( "ui-state-active" ) - .attr( "aria-pressed", true ); + .prop( "aria-pressed", true ); } else { $( this ).button( "widget" ) .removeClass( "ui-state-active" ) - .attr( "aria-pressed", false ); + .prop( "aria-pressed", false ); } }); } else if ( this.type === "checkbox" ) { if ( this.element.is( ":checked" ) ) { this.buttonElement .addClass( "ui-state-active" ) - .attr( "aria-pressed", true ); + .prop( "aria-pressed", true ); } else { this.buttonElement .removeClass( "ui-state-active" ) - .attr( "aria-pressed", false ); + .prop( "aria-pressed", false ); } } }, diff --git a/ui/jquery.ui.datepicker.js b/ui/jquery.ui.datepicker.js index 4c73bdfd8..bf42f0411 100644 --- a/ui/jquery.ui.datepicker.js +++ b/ui/jquery.ui.datepicker.js @@ -254,7 +254,7 @@ $.extend(Datepicker.prototype, { date.setDate(findMax(this._get(inst, (dateFormat.match(/DD/) ? 'dayNames' : 'dayNamesShort'))) + 20 - date.getDay()); } - inst.input.attr('size', this._formatDate(inst, date).length); + inst.input.prop('size', this._formatDate(inst, date).length); } }, @@ -365,7 +365,7 @@ $.extend(Datepicker.prototype, { var inline = $target.children('.' + this._inlineClass); inline.children().removeClass('ui-state-disabled'); inline.find("select.ui-datepicker-month, select.ui-datepicker-year"). - removeAttr("disabled"); + prop("disabled", false); } this._disabledInputs = $.map(this._disabledInputs, function(value) { return (value == target ? null : value); }); // delete entry @@ -390,7 +390,7 @@ $.extend(Datepicker.prototype, { var inline = $target.children('.' + this._inlineClass); inline.children().addClass('ui-state-disabled'); inline.find("select.ui-datepicker-month, select.ui-datepicker-year"). - attr("disabled", "disabled"); + prop("disabled", true); } this._disabledInputs = $.map(this._disabledInputs, function(value) { return (value == target ? null : value); }); // delete entry diff --git a/ui/jquery.ui.dialog.js b/ui/jquery.ui.dialog.js index 0eba39842..89ccdf734 100644 --- a/ui/jquery.ui.dialog.js +++ b/ui/jquery.ui.dialog.js @@ -266,8 +266,8 @@ $.widget("ui.dialog", { // Opera 9.5+ resets when parent z-index is changed. // http://bugs.jqueryui.com/ticket/3193 saveScroll = { - scrollTop: self.element.attr( "scrollTop" ), - scrollLeft: self.element.attr( "scrollLeft" ) + scrollTop: self.element.scrollTop(), + scrollLeft: self.element.scrollLeft() }; $.ui.dialog.maxZ += 1; self.uiDialog.css( "z-index", $.ui.dialog.maxZ ); diff --git a/ui/jquery.ui.menu.js b/ui/jquery.ui.menu.js index 03e14f124..8045797ae 100644 --- a/ui/jquery.ui.menu.js +++ b/ui/jquery.ui.menu.js @@ -178,8 +178,8 @@ $.widget("ui.menu", { .removeAttr( "role" ) .removeAttr("tabIndex") .removeAttr( "aria-labelledby" ) - .removeAttr( "aria-expanded" ) - .removeAttr( "aria-hidden" ) + .removeProp( "aria-expanded" ) + .removeProp( "aria-hidden" ) .show(); //destroy menu items @@ -191,7 +191,7 @@ $.widget("ui.menu", { .removeClass( "ui-corner-all ui-state-hover" ) .removeAttr( "tabIndex" ) .removeAttr( "role" ) - .removeAttr( "aria-haspopup" ) + .removeProp( "aria-haspopup" ) .removeAttr( "id" ) .children(".ui-icon").remove(); }, @@ -203,9 +203,10 @@ $.widget("ui.menu", { .addClass( "ui-menu ui-widget ui-widget-content ui-corner-all" ) .attr("role", "menu") .hide() - .attr("aria-hidden", "true") - .attr("aria-expanded", "false") - ; + .prop({ + "aria-hidden": true, + "aria-expanded": false + }); // don't refresh list items that are already adapted var items = submenus.add(this.element).children( "li:not(.ui-menu-item):has(a)" ) @@ -221,7 +222,7 @@ $.widget("ui.menu", { submenus.each(function() { var menu = $(this); var item = menu.prev("a") - item.attr("aria-haspopup", "true") + item.prop("aria-haspopup", true) .prepend(''); menu.attr("aria-labelledby", item.attr("id")); }); @@ -289,19 +290,19 @@ $.widget("ui.menu", { _open: function(submenu) { clearTimeout(this.timer); - this.element.find(".ui-menu").not(submenu.parents()).hide().attr("aria-hidden", "true"); + this.element.find(".ui-menu").not(submenu.parents()).hide().prop("aria-hidden", true); var position = $.extend({}, { of: this.active }, $.type(this.options.position) == "function" ? this.options.position(this.active) : this.options.position ); - submenu.show().removeAttr("aria-hidden").attr("aria-expanded", "true").position(position); + submenu.show().removeProp("aria-hidden").prop("aria-expanded", true).position(position); }, closeAll: function() { this.element - .find("ul").hide().attr("aria-hidden", "true").attr("aria-expanded", "false").end() + .find("ul").hide().prop("aria-hidden", true).prop("aria-expanded", false).end() .find("a.ui-state-active").removeClass("ui-state-active"); this.blur(); this.activeMenu = this.element; @@ -309,14 +310,14 @@ $.widget("ui.menu", { _close: function() { this.active.parent() - .find("ul").hide().attr("aria-hidden", "true").attr("aria-expanded", "false").end() + .find("ul").hide().prop("aria-hidden", true).prop("aria-expanded", false).end() .find("a.ui-state-active").removeClass("ui-state-active"); }, left: function(event) { var newItem = this.active && this.active.parents("li:not(.ui-menubar-item)").first(); if (newItem && newItem.length) { - this.active.parent().attr("aria-hidden", "true").attr("aria-expanded", "false").hide(); + this.active.parent().prop("aria-hidden", true).prop("aria-expanded", false).hide(); this.focus(event, newItem); return true; } @@ -407,8 +408,7 @@ $.widget("ui.menu", { }, _hasScroll: function() { - // TODO: just use .prop() when we drop support for jQuery <1.6 - return this.element.height() < this.element[ $.fn.prop ? "prop" : "attr" ]( "scrollHeight" ); + return this.element.height() < this.element.prop( "scrollHeight" ); }, select: function( event ) { diff --git a/ui/jquery.ui.menubar.js b/ui/jquery.ui.menubar.js index a0e9afb3c..2ce59bd6c 100644 --- a/ui/jquery.ui.menubar.js +++ b/ui/jquery.ui.menubar.js @@ -48,8 +48,10 @@ $.widget( "ui.menubar", { } }) .hide() - .attr( "aria-hidden", "true" ) - .attr( "aria-expanded", "false" ) + .prop({ + "aria-hidden": true, + "aria-expanded": false + }) .bind( "keydown.menubar", function( event ) { var menu = $( this ); if ( menu.is( ":hidden" ) ) @@ -106,7 +108,7 @@ $.widget( "ui.menubar", { }) .addClass( "ui-button ui-widget ui-button-text-only ui-menubar-link" ) .attr( "role", "menuitem" ) - .attr( "aria-haspopup", "true" ) + .prop( "aria-haspopup", true ) .wrapInner( "" ); // TODO review if these options are a good choice, maybe they can be merged @@ -144,19 +146,19 @@ $.widget( "ui.menubar", { _destroy : function() { var items = this.element.children( "li" ) .removeClass( "ui-menubar-item" ) - .removeAttr( "role", "presentation" ) + .removeAttr( "role" ) .children( "button, a" ); this.element .removeClass( "ui-menubar ui-widget-header ui-helper-clearfix" ) - .removeAttr( "role", "menubar" ) + .removeAttr( "role" ) .unbind( ".menubar" ); items .unbind( ".menubar" ) .removeClass( "ui-button ui-widget ui-button-text-only ui-menubar-link ui-state-default" ) - .removeAttr( "role", "menuitem" ) - .removeAttr( "aria-haspopup", "true" ) + .removeAttr( "role" ) + .removeProp( "aria-haspopup" ) // TODO unwrap? .children( "span.ui-button-text" ).each(function( i, e ) { var item = $( this ); @@ -168,8 +170,8 @@ $.widget( "ui.menubar", { this.element.find( ":ui-menu" ) .menu( "destroy" ) .show() - .removeAttr( "aria-hidden", "true" ) - .removeAttr( "aria-expanded", "false" ) + .removeProp( "aria-hidden" ) + .removeProp( "aria-expanded" ) .removeAttr( "tabindex" ) .unbind( ".menubar" ); }, @@ -180,8 +182,10 @@ $.widget( "ui.menubar", { this.active .menu( "closeAll" ) .hide() - .attr( "aria-hidden", "true" ) - .attr( "aria-expanded", "false" ); + .prop({ + "aria-hidden": true, + "aria-expanded": false + }); this.active .prev() .removeClass( "ui-state-active" ) @@ -200,8 +204,10 @@ $.widget( "ui.menubar", { this.active .menu( "closeAll" ) .hide() - .attr( "aria-hidden", "true" ) - .attr( "aria-expanded", "false" ); + .prop({ + "aria-hidden": true, + "aria-expanded": false + }); this.active .prev() .removeClass( "ui-state-active" ); @@ -215,8 +221,8 @@ $.widget( "ui.menubar", { at: "left bottom", of: button }) - .removeAttr( "aria-hidden" ) - .attr( "aria-expanded", "true" ) + .removeProp( "aria-hidden" ) + .prop( "aria-expanded", true ) .menu("focus", event, menu.children( "li" ).first() ) // TODO need a comment here why both events are triggered .focus() diff --git a/ui/jquery.ui.popup.js b/ui/jquery.ui.popup.js index c90755fbb..4c9f20c06 100644 --- a/ui/jquery.ui.popup.js +++ b/ui/jquery.ui.popup.js @@ -41,7 +41,7 @@ $.widget( "ui.popup", { } this.options.trigger - .attr( "aria-haspopup", true ) + .prop( "aria-haspopup", true ) .attr( "aria-owns", this.element.attr( "id" ) ); this.element @@ -118,11 +118,11 @@ $.widget( "ui.popup", { this.element .show() .removeClass( "ui-popup" ) - .removeAttr( "aria-hidden" ) - .removeAttr( "aria-expanded" ); + .removeProp( "aria-hidden" ) + .removeProp( "aria-expanded" ); this.options.trigger - .removeAttr( "aria-haspopup" ) + .removeProp( "aria-haspopup" ) .removeAttr( "aria-owns" ); if ( this.generatedId ) { @@ -140,8 +140,8 @@ $.widget( "ui.popup", { this.element .show() - .attr( "aria-hidden", false ) - .attr( "aria-expanded", true ) + .prop( "aria-hidden", false ) + .prop( "aria-expanded", true ) .position( position ) // TODO find a focussable child, otherwise put focus on element, add tabIndex=0 if not focussable .focus(); @@ -160,8 +160,8 @@ $.widget( "ui.popup", { close: function( event ) { this.element .hide() - .attr( "aria-hidden", true ) - .attr( "aria-expanded", false ); + .prop( "aria-hidden", true ) + .prop( "aria-expanded", false ); this.options.trigger.attr("tabindex", 0); diff --git a/ui/jquery.ui.slider.js b/ui/jquery.ui.slider.js index 978155370..9c5d21ffb 100644 --- a/ui/jquery.ui.slider.js +++ b/ui/jquery.ui.slider.js @@ -502,10 +502,10 @@ $.widget( "ui.slider", $.ui.mouse, { if ( value ) { this.handles.filter( ".ui-state-focus" ).blur(); this.handles.removeClass( "ui-state-hover" ); - this.handles.attr( "disabled", "disabled" ); + this.handles.prop( "disabled", true ); this.element.addClass( "ui-disabled" ); } else { - this.handles.removeAttr( "disabled" ); + this.handles.prop( "disabled", false ); this.element.removeClass( "ui-disabled" ); } break; diff --git a/ui/jquery.ui.spinner.js b/ui/jquery.ui.spinner.js index b4cefc982..87da9ac05 100644 --- a/ui/jquery.ui.spinner.js +++ b/ui/jquery.ui.spinner.js @@ -291,10 +291,10 @@ $.widget( "ui.spinner", { if ( key === "disabled" ) { if ( value ) { - this.element.attr( "disabled", true ); + this.element.prop( "disabled", true ); this.buttons.button( "disable" ); } else { - this.element.removeAttr( "disabled" ); + this.element.prop( "disabled", false ); this.buttons.button( "enable" ); } } @@ -332,7 +332,7 @@ $.widget( "ui.spinner", { destroy: function() { this.element .removeClass( "ui-spinner-input" ) - .removeAttr( "disabled" ) + .prop( "disabled", false ) .removeAttr( "autocomplete" ) .removeAttr( "role" ) .removeAttr( "aria-valuemin" ) diff --git a/ui/jquery.ui.widget.js b/ui/jquery.ui.widget.js index 00bc07c4f..8079f0357 100644 --- a/ui/jquery.ui.widget.js +++ b/ui/jquery.ui.widget.js @@ -211,7 +211,7 @@ $.Widget.prototype = { .removeData( this.widgetName ); this.widget() .unbind( "." + this.widgetName ) - .removeAttr( "aria-disabled" ) + .removeProp( "aria-disabled" ) .removeClass( this.widgetBaseClass + "-disabled " + "ui-state-disabled" ); @@ -276,7 +276,7 @@ $.Widget.prototype = { if ( key === "disabled" ) { this.widget() .toggleClass( this.widgetBaseClass + "-disabled ui-state-disabled", !!value ) - .attr( "aria-disabled", value ); + .prop( "aria-disabled", value ); this.hoverable.removeClass( "ui-state-hover" ); this.focusable.removeClass( "ui-state-focus" ); } -- cgit v1.2.3 From 1c1a3b1a361d90a73755fbd038b3cdfb0960c29f Mon Sep 17 00:00:00 2001 From: gnarf Date: Tue, 21 Jun 2011 00:23:52 -0500 Subject: Effects.*: Updating Effect Method API to avoid duplicating the queue call - Fixes #7318 - Add the queue functions to $.fn.effect() --- ui/jquery.effects.blind.js | 112 +++++------ ui/jquery.effects.bounce.js | 184 +++++++++-------- ui/jquery.effects.clip.js | 93 ++++----- ui/jquery.effects.core.js | 7 +- ui/jquery.effects.drop.js | 84 ++++---- ui/jquery.effects.explode.js | 142 +++++++------ ui/jquery.effects.fade.js | 40 ++-- ui/jquery.effects.fold.js | 94 +++++---- ui/jquery.effects.highlight.js | 62 +++--- ui/jquery.effects.pulsate.js | 78 ++++--- ui/jquery.effects.scale.js | 447 +++++++++++++++++++++-------------------- ui/jquery.effects.shake.js | 103 +++++----- ui/jquery.effects.slide.js | 90 ++++----- ui/jquery.effects.transfer.js | 63 +++--- 14 files changed, 785 insertions(+), 814 deletions(-) (limited to 'ui') diff --git a/ui/jquery.effects.blind.js b/ui/jquery.effects.blind.js index b6485b641..8c536be78 100644 --- a/ui/jquery.effects.blind.js +++ b/ui/jquery.effects.blind.js @@ -12,73 +12,69 @@ */ (function( $, undefined ) { -var rvertical = /up|down|vertical/; -var rpositivemotion = /up|left|vertical|horizontal/; +var rvertical = /up|down|vertical/, + rpositivemotion = /up|left|vertical|horizontal/; -$.effects.effect.blind = function( o ) { +$.effects.effect.blind = function( o, next ) { + // Create element + var el = $( this ), + props = [ "position", "top", "bottom", "left", "right", "height", "width" ], + mode = $.effects.setMode( el, o.mode || "hide" ), + direction = o.direction || "up", + vertical = rvertical.test( direction ), + ref = vertical ? "height" : "width", + ref2 = vertical ? "top" : "left", + motion = rpositivemotion.test( direction ), + animation = {}, + show = mode === "show", + wrapper, distance; - return this.queue( function() { - - // Create element - var el = $( this ), - props = [ "position", "top", "bottom", "left", "right", "height", "width" ], - mode = $.effects.setMode( el, o.mode || "hide" ), - direction = o.direction || "up", - vertical = rvertical.test( direction ), - ref = vertical ? "height" : "width", - ref2 = vertical ? "top" : "left", - motion = rpositivemotion.test( direction ), - animation = {}, - wrapper, distance; + // if already wrapped, the wrapper's properties are my property. #6245 + if ( el.parent().is( ".ui-effects-wrapper" ) ) { + $.effects.save( el.parent(), props ); + } else { + $.effects.save( el, props ); + } + el.show(); + wrapper = $.effects.createWrapper( el ).css({ + overflow: "hidden" + }); - // if already wrapped, the wrapper's properties are my property. #6245 - if ( el.parent().is( ".ui-effects-wrapper" ) ) { - $.effects.save( el.parent(), props ); - } else { - $.effects.save( el, props ); - } - el.show(); - wrapper = $.effects.createWrapper( el ).css({ - overflow: "hidden" - }); + distance = wrapper[ ref ](); - distance = wrapper[ ref ](); + animation[ ref ] = ( mode === "show" ? distance : 0 ); + if ( !motion ) { + el + .css( vertical ? "bottom" : "right", 0 ) + .css( vertical ? "top" : "left", "" ) + .css({ position: "absolute" }); + animation[ ref2 ] = ( mode === "show" ) ? 0 : distance; + } - animation[ ref ] = ( mode === "show" ? distance : 0 ); - if ( !motion ) { - el - .css( vertical ? "bottom" : "right", 0 ) - .css( vertical ? "top" : "left", "" ) - .css({ position: "absolute" }); - animation[ ref2 ] = ( mode === "show" ) ? 0 : distance; + // start at 0 if we are showing + if ( mode === "show" ) { + wrapper.css( ref, 0 ); + if ( ! motion ) { + wrapper.css( ref2, distance ); } + } - // start at 0 if we are showing - if ( mode == "show" ) { - wrapper.css( ref, 0 ); - if ( ! motion ) { - wrapper.css( ref2, distance ); + // Animate + wrapper.animate( animation, { + duration: o.duration, + easing: o.easing, + queue: false, + complete: function() { + if ( mode == "hide" ) { + el.hide(); } - } - - // Animate - wrapper.animate( animation, { - duration: o.duration, - easing: o.easing, - queue: false, - complete: function() { - if ( mode == "hide" ) { - el.hide(); - } - $.effects.restore( el, props ); - $.effects.removeWrapper( el ); - if ( $.isFunction( o.complete ) ) { - o.complete.apply( el[ 0 ], arguments ); - } - el.dequeue(); + $.effects.restore( el, props ); + $.effects.removeWrapper( el ); + if ( $.isFunction( o.complete ) ) { + o.complete.apply( el[ 0 ], arguments ); } - }); - + next(); + } }); }; diff --git a/ui/jquery.effects.bounce.js b/ui/jquery.effects.bounce.js index 78fedb0ce..f6cf5bb02 100644 --- a/ui/jquery.effects.bounce.js +++ b/ui/jquery.effects.bounce.js @@ -12,108 +12,104 @@ */ (function( $, undefined ) { -$.effects.effect.bounce = function(o) { - - return this.queue( function( next ) { - var el = $( this ), - props = [ "position", "top", "bottom", "left", "right", "height", "width" ], - - // defaults: - mode = $.effects.setMode( el, o.mode || "effect" ), - hide = mode === "hide", - show = mode === "show", - direction = o.direction || "up", - distance = o.distance, - times = o.times || 5, - - // number of internal animations - anims = times * 2 + ( show || hide ? 1 : 0 ), - speed = o.duration / anims, - easing = o.easing, - - // utility: - ref = ( direction === "up" || direction === "down" ) ? "top" : "left", - motion = ( direction === "up" || direction === "left" ), - i, - upAnim, - downAnim, - - // we will need to re-assemble the queue to stack our animations in place - queue = el.queue(), - queuelen = queue.length; - - // Avoid touching opacity to prevent clearType and PNG issues in IE - if ( show || hide ) { - props.push( "opacity" ); - } - - $.effects.save( el, props ); - el.show(); - $.effects.createWrapper( el ); // Create Wrapper - - // default distance for the BIGGEST bounce is the outer Distance / 3 - if ( !distance ) { - distance = el[ ref === "top" ? "outerHeight" : "outerWidth" ]() / 3; - } - - if ( show ) { - downAnim = { opacity: 1 }; - downAnim[ ref ] = 0; - - // if we are showing, force opacity 0 and set the initial position - // then do the "first" animation - el.css( "opacity", 0 ) - .css( ref, motion ? -distance*2 : distance*2 ) - .animate( downAnim, speed, easing ); - } - - // start at the smallest distance if we are hiding - if ( hide ) { - distance = distance / Math.pow( 2, times - 1 ); - } - - downAnim = {}; +$.effects.effect.bounce = function( o, next ) { + var el = $( this ), + props = [ "position", "top", "bottom", "left", "right", "height", "width" ], + + // defaults: + mode = $.effects.setMode( el, o.mode || "effect" ), + hide = mode === "hide", + show = mode === "show", + direction = o.direction || "up", + distance = o.distance, + times = o.times || 5, + + // number of internal animations + anims = times * 2 + ( show || hide ? 1 : 0 ), + speed = o.duration / anims, + easing = o.easing, + + // utility: + ref = ( direction === "up" || direction === "down" ) ? "top" : "left", + motion = ( direction === "up" || direction === "left" ), + i, + upAnim, + downAnim, + + // we will need to re-assemble the queue to stack our animations in place + queue = el.queue(), + queuelen = queue.length; + + // Avoid touching opacity to prevent clearType and PNG issues in IE + if ( show || hide ) { + props.push( "opacity" ); + } + + $.effects.save( el, props ); + el.show(); + $.effects.createWrapper( el ); // Create Wrapper + + // default distance for the BIGGEST bounce is the outer Distance / 3 + if ( !distance ) { + distance = el[ ref === "top" ? "outerHeight" : "outerWidth" ]() / 3; + } + + if ( show ) { + downAnim = { opacity: 1 }; downAnim[ ref ] = 0; - // Bounces up/down/left/right then back to 0 -- times * 2 animations happen here - for ( i = 0; i < times; i++ ) { - upAnim = {}; - upAnim[ ref ] = ( motion ? "-=" : "+=" ) + distance; - - el.animate( upAnim, speed, easing ) - .animate( downAnim, speed, easing ); - - distance = hide ? distance * 2 : distance / 2; - } - // Last Bounce when Hiding + // if we are showing, force opacity 0 and set the initial position + // then do the "first" animation + el.css( "opacity", 0 ) + .css( ref, motion ? -distance*2 : distance*2 ) + .animate( downAnim, speed, easing ); + } + + // start at the smallest distance if we are hiding + if ( hide ) { + distance = distance / Math.pow( 2, times - 1 ); + } + + downAnim = {}; + downAnim[ ref ] = 0; + // Bounces up/down/left/right then back to 0 -- times * 2 animations happen here + for ( i = 0; i < times; i++ ) { + upAnim = {}; + upAnim[ ref ] = ( motion ? "-=" : "+=" ) + distance; + + el.animate( upAnim, speed, easing ) + .animate( downAnim, speed, easing ); + + distance = hide ? distance * 2 : distance / 2; + } + + // Last Bounce when Hiding + if ( hide ) { + upAnim = { opacity: 0 }; + upAnim[ ref ] = ( motion ? "-=" : "+=" ) + distance; + + el.animate( upAnim, speed, easing ); + } + + el.queue( function( next ) { if ( hide ) { - upAnim = { opacity: 0 }; - upAnim[ ref ] = ( motion ? "-=" : "+=" ) + distance; - - el.animate( upAnim, speed, easing ); + el.hide(); } - - el.queue( function( next ) { - if ( hide ) { - el.hide(); - } - $.effects.restore( el, props ); - $.effects.removeWrapper( el ); - if ( o.complete ) { - o.complete.apply( el[ 0 ] ); - } - next(); - }); - - // inject all the animations we just queued to be first in line (after "inprogress") - if ( queuelen > 1) { - queue.splice.apply( queue, - [ 1, 0 ].concat( queue.splice( queuelen, anims + 1 ) ) ); + $.effects.restore( el, props ); + $.effects.removeWrapper( el ); + if ( o.complete ) { + o.complete.apply( el[ 0 ] ); } next(); - }); + // inject all the animations we just queued to be first in line (after "inprogress") + if ( queuelen > 1) { + queue.splice.apply( queue, + [ 1, 0 ].concat( queue.splice( queuelen, anims + 1 ) ) ); + } + next(); + }; })(jQuery); diff --git a/ui/jquery.effects.clip.js b/ui/jquery.effects.clip.js index dbf0d36c9..8c5c76e8c 100644 --- a/ui/jquery.effects.clip.js +++ b/ui/jquery.effects.clip.js @@ -12,61 +12,56 @@ */ (function( $, undefined ) { -$.effects.effect.clip = function( o ) { +$.effects.effect.clip = function( o, next ) { + // Create element + var el = $( this ), + props = [ "position", "top", "bottom", "left", "right", "height", "width" ], + mode = $.effects.setMode( el, o.mode || "hide" ), + show = mode === "show", + direction = o.direction || "vertical", + vert = direction === "vertical", + size = vert ? "height" : "width", + position = vert ? "top" : "left", + animation = {}, + wrapper, animate, distance; - return this.queue( function() { + // Save & Show + $.effects.save( el, props ); + el.show(); - // Create element - var el = $( this ), - props = [ "position", "top", "bottom", "left", "right", "height", "width" ], - mode = $.effects.setMode( el, o.mode || "hide" ), - show = mode === "show", - direction = o.direction || "vertical", - vert = direction === "vertical", - size = vert ? "height" : "width", - position = vert ? "top" : "left", - animation = {}, - wrapper, animate, distance; - - // Save & Show - $.effects.save( el, props ); - el.show(); - - // Create Wrapper - wrapper = $.effects.createWrapper( el ).css({ - overflow: "hidden" - }); - animate = ( el[0].tagName === "IMG" ) ? wrapper : el; - distance = animate[ size ](); + // Create Wrapper + wrapper = $.effects.createWrapper( el ).css({ + overflow: "hidden" + }); + animate = ( el[0].tagName === "IMG" ) ? wrapper : el; + distance = animate[ size ](); - // Shift - if ( show ) { - animate.css( size, 0 ); - animate.css( position, distance / 2 ); - } + // Shift + if ( show ) { + animate.css( size, 0 ); + animate.css( position, distance / 2 ); + } - // Create Animation Object: - animation[ size ] = show ? distance : 0; - animation[ position ] = show ? 0 : distance / 2; + // Create Animation Object: + animation[ size ] = show ? distance : 0; + animation[ position ] = show ? 0 : distance / 2; - // Animate - animate.animate( animation, { - queue: false, - duration: o.duration, - easing: o.easing, - complete: function() { - if ( !show ) { - el.hide(); - } - $.effects.restore( el, props ); - $.effects.removeWrapper( el ); - if ( $.isFunction( o.complete ) ) { - o.complete.apply( el[ 0 ], arguments ); - } - el.dequeue(); + // Animate + animate.animate( animation, { + queue: false, + duration: o.duration, + easing: o.easing, + complete: function() { + if ( !show ) { + el.hide(); } - }); - + $.effects.restore( el, props ); + $.effects.removeWrapper( el ); + if ( $.isFunction( o.complete ) ) { + o.complete.apply( el[ 0 ], arguments ); + } + el.dequeue(); + } }); }; diff --git a/ui/jquery.effects.core.js b/ui/jquery.effects.core.js index 00a803360..87fc5a074 100644 --- a/ui/jquery.effects.core.js +++ b/ui/jquery.effects.core.js @@ -536,6 +536,7 @@ $.fn.extend({ effect: function( effect, options, speed, callback ) { var args = _normalizeArguments.apply( this, arguments ), mode = args.mode, + queue = args.queue, effectMethod = $.effects.effect[ args.effect ], // DEPRECATED: remove in 2.0 (#7115) @@ -554,9 +555,13 @@ $.fn.extend({ } } + function run( next ) { + effectMethod.call( this, args, $.isFunction( next ) ? next : $.noop ); + } + // TODO: remove this check in 2.0, effectMethod will always be true if ( effectMethod ) { - return effectMethod.call( this, args ); + return queue === false ? this.each( run ) : this.queue( queue || "fx", run ); } else { // DEPRECATED: remove in 2.0 (#7115) return oldEffectMethod.call(this, { diff --git a/ui/jquery.effects.drop.js b/ui/jquery.effects.drop.js index 4265b737b..a0bdc7d4d 100644 --- a/ui/jquery.effects.drop.js +++ b/ui/jquery.effects.drop.js @@ -12,51 +12,47 @@ */ (function( $, undefined ) { -$.effects.effect.drop = function( o ) { - - return this.queue( function() { - - var el = $( this ), - props = [ 'position', 'top', 'bottom', 'left', 'right', 'opacity', "height", "width" ], - mode = $.effects.setMode( el, o.mode || 'hide' ), - direction = o.direction || 'left', - ref = ( direction == 'up' || direction == 'down' ) ? 'top' : 'left', - motion = ( direction == 'up' || direction == 'left' ) ? 'pos' : 'neg', - animation = { - opacity: mode == 'show' ? 1 : 0 - }, - distance; - - // Adjust - $.effects.save( el, props ); - el.show(); - $.effects.createWrapper( el ); - - distance = o.distance || el[ ref == 'top' ? 'outerHeight': 'outerWidth' ]({ margin: true }) / 2; - - if ( mode == 'show' ) { - el - .css( 'opacity', 0 ) - .css( ref, motion == 'pos' ? -distance : distance ); +$.effects.effect.drop = function( o, next ) { + + var el = $( this ), + props = [ "position", "top", "bottom", "left", "right", "opacity", "height", "width" ], + mode = $.effects.setMode( el, o.mode || "hide" ), + direction = o.direction || "left", + ref = ( direction == "up" || direction == "down" ) ? "top" : "left", + motion = ( direction == "up" || direction == "left" ) ? "pos" : "neg", + animation = { + opacity: mode == "show" ? 1 : 0 + }, + distance; + + // Adjust + $.effects.save( el, props ); + el.show(); + $.effects.createWrapper( el ); + + distance = o.distance || el[ ref == "top" ? "outerHeight": "outerWidth" ]({ margin: true }) / 2; + + if ( mode == "show" ) { + el + .css( "opacity", 0 ) + .css( ref, motion == "pos" ? -distance : distance ); + } + + // Animation + animation[ ref ] = ((mode == "show") ? (motion == "pos" ? "+=" : "-=") : (motion == "pos" ? "-=" : "+=")) + distance; + + // Animate + el.animate( animation, { + queue: false, + duration: o.duration, + easing: o.easing, + complete: function() { + mode == "hide" && el.hide(); + $.effects.restore( el, props ); + $.effects.removeWrapper( el ); + $.isFunction( o.complete ) && o.complete.apply(this, arguments); + next(); } - - // Animation - animation[ ref ] = ((mode == 'show') ? (motion == 'pos' ? '+=' : '-=') : (motion == 'pos' ? '-=' : '+=')) + distance; - - // Animate - el.animate( animation, { - queue: false, - duration: o.duration, - easing: o.easing, - complete: function() { - mode == 'hide' && el.hide(); - $.effects.restore( el, props ); - $.effects.removeWrapper( el ); - $.isFunction( o.complete ) && o.complete.apply(this, arguments); - el.dequeue(); - } - }); - }); }; diff --git a/ui/jquery.effects.explode.js b/ui/jquery.effects.explode.js index f5217ecb5..76711c6f2 100644 --- a/ui/jquery.effects.explode.js +++ b/ui/jquery.effects.explode.js @@ -12,92 +12,88 @@ */ (function( $, undefined ) { -$.effects.effect.explode = function( o ) { +$.effects.effect.explode = function( o, next ) { - return this.queue( function( next ) { + var rows = o.pieces ? Math.round(Math.sqrt(o.pieces)) : 3, + cells = rows, + el = $( this ), + mode = $.effects.setMode( el, o.mode || "hide" ), + show = ( mode == "show" ), - var rows = o.pieces ? Math.round(Math.sqrt(o.pieces)) : 3, - cells = rows, - el = $( this ), - mode = $.effects.setMode( el, o.mode || 'hide' ), - show = ( mode == 'show' ), + // show and then visibility:hidden the element before calculating offset + offset = el.show().css( "visibility", "hidden" ).offset(), - // show and then visibility:hidden the element before calculating offset - offset = el.show().css( 'visibility', 'hidden' ).offset(), + // width and height of a piece + width = Math.ceil( el.outerWidth() / cells ), + height = Math.ceil( el.outerHeight() / rows ), + pieces = [], - // width and height of a piece - width = Math.ceil( el.outerWidth() / cells ), - height = Math.ceil( el.outerHeight() / rows ), - pieces = [], + // loop + i, j, left, top, mx, my; - // loop - i, j, left, top, mx, my; + // clone the element for each row and cell. + for( i = 0; i < rows ; i++ ) { // ===> + top = offset.top + i * height; + my = i - ( rows - 1 ) / 2 ; - // clone the element for each row and cell. - for( i = 0; i < rows ; i++ ) { // ===> - top = offset.top + i * height; - my = i - ( rows - 1 ) / 2 ; + for( j = 0; j < cells ; j++ ) { // ||| + left = offset.left + j * width; + mx = j - ( cells - 1 ) / 2 ; - for( j = 0; j < cells ; j++ ) { // ||| - left = offset.left + j * width; - mx = j - ( cells - 1 ) / 2 ; + // Create a clone of the now hidden main element that will be absolute positioned + // within a wrapper div off the -left and -top equal to size of our pieces + el + .clone() + .appendTo( "body" ) + .wrap( "
" ) + .css({ + position: "absolute", + visibility: "visible", + left: -j * width, + top: -i * height + }) - // Create a clone of the now hidden main element that will be absolute positioned - // within a wrapper div off the -left and -top equal to size of our pieces - el - .clone() - .appendTo( 'body' ) - .wrap( '
' ) - .css({ - position: 'absolute', - visibility: 'visible', - left: -j * width, - top: -i * height - }) - - // select the wrapper - make it overflow: hidden and absolute positioned based on - // where the original was located +left and +top equal to the size of pieces - .parent() - .addClass( 'ui-effects-explode' ) - .css({ - position: 'absolute', - overflow: 'hidden', - width: width, - height: height, - left: left + ( show ? mx * width : 0 ), - top: top + ( show ? my * height : 0 ), - opacity: show ? 0 : 1 - }).animate({ - left: left + ( show ? 0 : mx * width ), - top: top + ( show ? 0 : my * height ), - opacity: show ? 1 : 0 - }, o.duration || 500, o.easing, childComplete ); - } + // select the wrapper - make it overflow: hidden and absolute positioned based on + // where the original was located +left and +top equal to the size of pieces + .parent() + .addClass( "ui-effects-explode" ) + .css({ + position: "absolute", + overflow: "hidden", + width: width, + height: height, + left: left + ( show ? mx * width : 0 ), + top: top + ( show ? my * height : 0 ), + opacity: show ? 0 : 1 + }).animate({ + left: left + ( show ? 0 : mx * width ), + top: top + ( show ? 0 : my * height ), + opacity: show ? 1 : 0 + }, o.duration || 500, o.easing, childComplete ); } + } - // children animate complete: - function childComplete() { - pieces.push( this ); - if ( pieces.length == rows * cells ) { - animComplete(); - } + // children animate complete: + function childComplete() { + pieces.push( this ); + if ( pieces.length == rows * cells ) { + animComplete(); } + } - function animComplete() { - el.css({ - visibility: 'visible' - }); - $( pieces ).remove(); - if ( !show ) { - el.hide(); - } - if ( $.isFunction( o.complete ) ) { - o.complete.apply( el[ 0 ] ); - } - next(); + function animComplete() { + el.css({ + visibility: "visible" + }); + $( pieces ).remove(); + if ( !show ) { + el.hide(); } - }); - + if ( $.isFunction( o.complete ) ) { + o.complete.apply( el[ 0 ] ); + } + next(); + } }; })(jQuery); diff --git a/ui/jquery.effects.fade.js b/ui/jquery.effects.fade.js index ff1cba5f8..8f2d956dc 100644 --- a/ui/jquery.effects.fade.js +++ b/ui/jquery.effects.fade.js @@ -12,29 +12,27 @@ */ (function( $, undefined ) { -$.effects.effect.fade = function( o ) { - return this.queue( function( next ) { - var el = $( this ), - mode = $.effects.setMode( el, o.mode || 'toggle' ), - hide = mode === "hide"; +$.effects.effect.fade = function( o, next ) { + var el = $( this ), + mode = $.effects.setMode( el, o.mode || "toggle" ), + hide = mode === "hide"; - el.show(); - el.animate({ - opacity: hide ? 0 : 1 - }, { - queue: false, - duration: o.duration, - easing: o.easing, - complete: function() { - if ( hide ) { - el.hide(); - } - if ( o.complete ) { - o.complete.call( this ); - } - next(); + el.show(); + el.animate({ + opacity: hide ? 0 : 1 + }, { + queue: false, + duration: o.duration, + easing: o.easing, + complete: function() { + if ( hide ) { + el.hide(); } - }); + if ( o.complete ) { + o.complete.call( this ); + } + next(); + } }); }; diff --git a/ui/jquery.effects.fold.js b/ui/jquery.effects.fold.js index 6100c33a1..de7530bf0 100644 --- a/ui/jquery.effects.fold.js +++ b/ui/jquery.effects.fold.js @@ -12,61 +12,57 @@ */ (function( $, undefined ) { -$.effects.effect.fold = function( o ) { +$.effects.effect.fold = function( o, next ) { - return this.queue( function() { + // Create element + var el = $( this ), + props = ["position","top","bottom","left","right","height","width"], + mode = $.effects.setMode(el, o.mode || "hide"), + size = o.size || 15, + percent = /([0-9]+)%/.exec(size), + horizFirst = !!o.horizFirst, + widthFirst = ((mode == "show") != horizFirst), + ref = widthFirst ? ["width", "height"] : ["height", "width"], + duration = o.duration / 2, + wrapper, distance; - // Create element - var el = $( this ), - props = ['position','top','bottom','left','right','height','width'], - mode = $.effects.setMode(el, o.mode || 'hide'), - size = o.size || 15, - percent = /([0-9]+)%/.exec(size), - horizFirst = !!o.horizFirst, - widthFirst = ((mode == 'show') != horizFirst), - ref = widthFirst ? ['width', 'height'] : ['height', 'width'], - duration = o.duration / 2, - wrapper, distance; + $.effects.save( el, props ); + el.show(); - $.effects.save( el, props ); - el.show(); - - // Create Wrapper - wrapper = $.effects.createWrapper( el ).css({ - overflow: 'hidden' - }); - distance = widthFirst ? - [ wrapper.width(), wrapper.height() ] : - [ wrapper.height(), wrapper.width() ]; - - if ( percent ) { - size = parseInt( percent[ 1 ], 10 ) / 100 * distance[ ( mode == 'hide') ? 0 : 1 ]; - } - mode == 'show' && wrapper.css( horizFirst ? { - height: 0, - width: size - } : { - height: size, - width: 0 - }); + // Create Wrapper + wrapper = $.effects.createWrapper( el ).css({ + overflow: "hidden" + }); + distance = widthFirst ? + [ wrapper.width(), wrapper.height() ] : + [ wrapper.height(), wrapper.width() ]; - // Animation - var animation1 = {}, animation2 = {}; - animation1[ ref[ 0 ] ] = mode == 'show' ? distance[ 0 ] : size; - animation2[ ref[ 1 ] ] = mode == 'show' ? distance[ 1 ] : 0; + if ( percent ) { + size = parseInt( percent[ 1 ], 10 ) / 100 * distance[ ( mode == "hide") ? 0 : 1 ]; + } + mode == "show" && wrapper.css( horizFirst ? { + height: 0, + width: size + } : { + height: size, + width: 0 + }); - // Animate - wrapper - .animate( animation1, duration, o.easing ) - .animate( animation2, duration, o.easing, function() { - (mode == 'hide') && el.hide(); - $.effects.restore( el, props ); - $.effects.removeWrapper( el ); - jQuery.isFunction(o.complete) && o.complete.apply( el[ 0 ], arguments ); - el.dequeue(); - }); + // Animation + var animation1 = {}, animation2 = {}; + animation1[ ref[ 0 ] ] = mode == "show" ? distance[ 0 ] : size; + animation2[ ref[ 1 ] ] = mode == "show" ? distance[ 1 ] : 0; - }); + // Animate + wrapper + .animate( animation1, duration, o.easing ) + .animate( animation2, duration, o.easing, function() { + (mode == "hide") && el.hide(); + $.effects.restore( el, props ); + $.effects.removeWrapper( el ); + jQuery.isFunction(o.complete) && o.complete.apply( el[ 0 ], arguments ); + next(); + }); }; diff --git a/ui/jquery.effects.highlight.js b/ui/jquery.effects.highlight.js index cd4f0705a..61826e696 100644 --- a/ui/jquery.effects.highlight.js +++ b/ui/jquery.effects.highlight.js @@ -12,40 +12,38 @@ */ (function( $, undefined ) { -$.effects.effect.highlight = function( o ) { - return this.queue( function() { - var elem = $( this ), - props = [ 'backgroundImage', 'backgroundColor', 'opacity' ], - mode = $.effects.setMode( elem, o.mode || 'show' ), - animation = { - backgroundColor: elem.css( 'backgroundColor' ) - }; +$.effects.effect.highlight = function( o, next ) { + var elem = $( this ), + props = [ "backgroundImage", "backgroundColor", "opacity" ], + mode = $.effects.setMode( elem, o.mode || "show" ), + animation = { + backgroundColor: elem.css( "backgroundColor" ) + }; - if (mode == 'hide') { - animation.opacity = 0; - } + if (mode == "hide") { + animation.opacity = 0; + } - $.effects.save( elem, props ); - - elem - .show() - .css({ - backgroundImage: 'none', - backgroundColor: o.color || '#ffff99' - }) - .animate( animation, { - queue: false, - duration: o.duration, - easing: o.easing, - complete: function() { - (mode == 'hide' && elem.hide()); - $.effects.restore( elem, props ); - (mode == 'show' && !$.support.opacity && this.style.removeAttribute( 'filter' )); - jQuery.isFunction(o.complete) && o.complete.apply(this, arguments); - elem.dequeue(); - } - }); - }); + $.effects.save( elem, props ); + + elem + .show() + .css({ + backgroundImage: "none", + backgroundColor: o.color || "#ffff99" + }) + .animate( animation, { + queue: false, + duration: o.duration, + easing: o.easing, + complete: function() { + (mode == "hide" && elem.hide()); + $.effects.restore( elem, props ); + (mode == "show" && !$.support.opacity && this.style.removeAttribute( "filter" )); + jQuery.isFunction(o.complete) && o.complete.apply(this, arguments); + next(); + } + }); }; })(jQuery); diff --git a/ui/jquery.effects.pulsate.js b/ui/jquery.effects.pulsate.js index a0ddf51fd..bc257f624 100644 --- a/ui/jquery.effects.pulsate.js +++ b/ui/jquery.effects.pulsate.js @@ -12,56 +12,54 @@ */ (function( $, undefined ) { -$.effects.effect.pulsate = function( o ) { - return this.queue( function( next ) { - var elem = $( this ), - mode = $.effects.setMode( elem, o.mode || "show" ), - show = mode === "show", - hide = mode === "hide", - showhide = ( show || mode === "hide" ), +$.effects.effect.pulsate = function( o, next ) { + var elem = $( this ), + mode = $.effects.setMode( elem, o.mode || "show" ), + show = mode === "show", + hide = mode === "hide", + showhide = ( show || mode === "hide" ), - // showing or hiding leaves of the "last" animation - anims = ( ( o.times || 5 ) * 2 ) + ( showhide ? 1 : 0 ), - duration = o.duration / anims, - animateTo = 0, - queue = elem.queue(), - queuelen = queue.length, - i; + // showing or hiding leaves of the "last" animation + anims = ( ( o.times || 5 ) * 2 ) + ( showhide ? 1 : 0 ), + duration = o.duration / anims, + animateTo = 0, + queue = elem.queue(), + queuelen = queue.length, + i; - if ( show || !elem.is(':visible')) { - elem.css( "opacity", 0 ).show(); - animateTo = 1; - } - - // anims - 1 opacity "toggles" - for ( i = 1; i < anims; i++ ) { - elem.animate({ - opacity: animateTo - }, duration, o.easing ); - animateTo = 1 - animateTo; - } + if ( show || !elem.is(":visible")) { + elem.css( "opacity", 0 ).show(); + animateTo = 1; + } + // anims - 1 opacity "toggles" + for ( i = 1; i < anims; i++ ) { elem.animate({ opacity: animateTo - }, duration, o.easing); + }, duration, o.easing ); + animateTo = 1 - animateTo; + } - elem.queue( function( next ) { - if ( hide ) { - elem.hide(); - } - if ( o.complete ) { - o.complete.apply( this ); - } - next(); - }); + elem.animate({ + opacity: animateTo + }, duration, o.easing); - // We just queued up "anims" animations, we need to put them next in the queue - if ( queuelen > 1) { - queue.splice.apply( queue, - [ 1, 0 ].concat( queue.splice( queuelen, anims + 1 ) ) ); + elem.queue( function( next ) { + if ( hide ) { + elem.hide(); + } + if ( o.complete ) { + o.complete.apply( this ); } next(); }); + + // We just queued up "anims" animations, we need to put them next in the queue + if ( queuelen > 1 ) { + queue.splice.apply( queue, + [ 1, 0 ].concat( queue.splice( queuelen, anims + 1 ) ) ); + } + next(); }; })(jQuery); diff --git a/ui/jquery.effects.scale.js b/ui/jquery.effects.scale.js index e00d82497..614943cfb 100644 --- a/ui/jquery.effects.scale.js +++ b/ui/jquery.effects.scale.js @@ -12,249 +12,255 @@ */ (function( $, undefined ) { -$.effects.effect.puff = function( o ) { - return this.queue( function() { - var elem = $( this ), - mode = $.effects.setMode( elem, o.mode || 'hide' ), - percent = parseInt( o.percent, 10 ) || 150, - factor = percent / 100, - original = { - height: elem.height(), - width: elem.width() - }; - - $.extend(o, { - effect: 'scale', - queue: false, - fade: true, - mode: mode, - percent: mode == 'hide' ? percent : 100, - from: mode == 'hide' - ? original - : { - height: original.height * factor, - width: original.width * factor - } - }); - - elem.effect( o ); - }); -}; - -$.effects.effect.scale = function( o ) { - - return this[ o.queue === false ? "each" : "queue" ]( function() { - - // Create element - var el = $( this ), - options = $.extend( true, {}, o ), - mode = $.effects.setMode( el, o.mode || 'effect' ), - percent = parseInt( o.percent, 10 ) || ( parseInt( o.percent, 10 ) == 0 ? 0 : ( mode == 'hide' ? 0 : 100 ) ), - direction = o.direction || 'both', - origin = o.origin, - original = { - height: el.height(), - width: el.width(), - outerHeight: el.outerHeight(), - outerWidth: el.outerWidth() - }, - factor = { - y: direction != 'horizontal' ? (percent / 100) : 1, - x: direction != 'vertical' ? (percent / 100) : 1 - }; - - // We are going to pass this effect to the size effect: - options.effect = "size"; - options.queue = false; - - // Set default origin and restore for show/hide - if ( mode != 'effect' ) { - options.origin = origin || ['middle','center']; - options.restore = true; +function compFunction( el, complete, next ) { + return function() { + if ( $.isFunction( complete ) ) { + complete.apply( el ); } + next(); + }; +}; - options.from = o.from || ( mode == 'show' ? { height: 0, width: 0 } : original ); - options.to = { - height: original.height * factor.y, - width: original.width * factor.x, - outerHeight: original.outerHeight * factor.y, - outerWidth: original.outerWidth * factor.x - }; - - if ( options.fade ) { // Fade option to support puff - if ( mode == 'show' ) { - options.from.opacity = 0; - options.to.opacity = 1; - } - if ( mode == 'hide' ) { - options.from.opacity = 1; - options.to.opacity = 0; - } +$.effects.effect.puff = function( o, next ) { + var elem = $( this ), + mode = $.effects.setMode( elem, o.mode || "hide" ), + percent = parseInt( o.percent, 10 ) || 150, + factor = percent / 100, + original = { + height: elem.height(), + width: elem.width() }; - // Animate - el.effect(options); + $.extend( o, { + effect: "scale", + queue: false, + fade: true, + mode: mode, + complete: compFunction( this, o.complete, next ), + percent: mode == "hide" ? percent : 100, + from: mode == "hide" + ? original + : { + height: original.height * factor, + width: original.width * factor + } }); + elem.effect( o ); }; -$.effects.effect.size = function( o ) { - - return this[ o.queue === false ? "each" : "queue" ]( function() { - // Create element - var el = $( this ), - props = [ 'position', 'top', 'bottom', 'left', 'right', 'width', 'height', 'overflow', 'opacity' ], - - // Always restore - props1 = [ 'position', 'top', 'bottom', 'left', 'right', 'overflow', 'opacity' ], - - // Copy for children - props2 = [ 'width', 'height', 'overflow' ], - cProps = [ 'fontSize' ], - vProps = [ 'borderTopWidth', 'borderBottomWidth', 'paddingTop', 'paddingBottom' ], - hProps = [ 'borderLeftWidth', 'borderRightWidth', 'paddingLeft', 'paddingRight' ], - - // Set options - mode = $.effects.setMode( el, o.mode || 'effect' ), - restore = o.restore || mode !== "effect", - scale = o.scale || 'both', - origin = o.origin || [ "middle", "center" ], - original, baseline, factor, - position = el.css( "position" ), - originalVerticalPositioning = el.css( "bottom" ) !== "auto" ? "bottom" : "top"; - originalHorizontalPositioning = el.css( "right" ) !== "auto" ? "right" : "left"; - - if ( mode === "show" ) { - el.show(); - } - original = { +$.effects.effect.scale = function( o, next ) { + + // Create element + var el = $( this ), + options = $.extend( true, {}, o ), + mode = $.effects.setMode( el, o.mode || "effect" ), + percent = parseInt( o.percent, 10 ) || ( parseInt( o.percent, 10 ) == 0 ? 0 : ( mode == "hide" ? 0 : 100 ) ), + direction = o.direction || "both", + origin = o.origin, + original = { height: el.height(), width: el.width(), outerHeight: el.outerHeight(), outerWidth: el.outerWidth() - }; + }, + factor = { + y: direction != "horizontal" ? (percent / 100) : 1, + x: direction != "vertical" ? (percent / 100) : 1 + }; - el.from = o.from || original; - el.to = o.to || original; + // We are going to pass this effect to the size effect: + options.effect = "size"; + options.queue = false; + options.complete = compFunction( this, options.complete, next ); + + // Set default origin and restore for show/hide + if ( mode != "effect" ) { + options.origin = origin || ["middle","center"]; + options.restore = true; + } + + options.from = o.from || ( mode == "show" ? { height: 0, width: 0 } : original ); + options.to = { + height: original.height * factor.y, + width: original.width * factor.x, + outerHeight: original.outerHeight * factor.y, + outerWidth: original.outerWidth * factor.x + }; + + if ( options.fade ) { // Fade option to support puff + if ( mode == "show" ) { + options.from.opacity = 0; + options.to.opacity = 1; + } + if ( mode == "hide" ) { + options.from.opacity = 1; + options.to.opacity = 0; + } + }; - // Set scaling factor - factor = { - from: { - y: el.from.height / original.height, - x: el.from.width / original.width - }, - to: { - y: el.to.height / original.height, - x: el.to.width / original.width - } - }; + // Animate + el.effect( options ); - // Scale the css box - if ( scale == 'box' || scale == 'both' ) { +}; - // Vertical props scaling - if ( factor.from.y !== factor.to.y ) { - props = props.concat( vProps ); - el.from = $.effects.setTransition( el, vProps, factor.from.y, el.from ); - el.to = $.effects.setTransition( el, vProps, factor.to.y, el.to ); - }; +$.effects.effect.size = function( o, next ) { + + // Create element + var el = $( this ), + props = [ "position", "top", "bottom", "left", "right", "width", "height", "overflow", "opacity" ], + + // Always restore + props1 = [ "position", "top", "bottom", "left", "right", "overflow", "opacity" ], + + // Copy for children + props2 = [ "width", "height", "overflow" ], + cProps = [ "fontSize" ], + vProps = [ "borderTopWidth", "borderBottomWidth", "paddingTop", "paddingBottom" ], + hProps = [ "borderLeftWidth", "borderRightWidth", "paddingLeft", "paddingRight" ], + + // Set options + mode = $.effects.setMode( el, o.mode || "effect" ), + restore = o.restore || mode !== "effect", + scale = o.scale || "both", + origin = o.origin || [ "middle", "center" ], + original, baseline, factor, + position = el.css( "position" ), + originalVerticalPositioning = el.css( "bottom" ) !== "auto" ? "bottom" : "top"; + originalHorizontalPositioning = el.css( "right" ) !== "auto" ? "right" : "left"; + + if ( mode === "show" ) { + el.show(); + } + original = { + height: el.height(), + width: el.width(), + outerHeight: el.outerHeight(), + outerWidth: el.outerWidth() + }; + + el.from = o.from || original; + el.to = o.to || original; + + // Set scaling factor + factor = { + from: { + y: el.from.height / original.height, + x: el.from.width / original.width + }, + to: { + y: el.to.height / original.height, + x: el.to.width / original.width + } + }; - // Horizontal props scaling - if ( factor.from.x !== factor.to.x ) { - props = props.concat( hProps ); - el.from = $.effects.setTransition( el, hProps, factor.from.x, el.from ); - el.to = $.effects.setTransition( el, hProps, factor.to.x, el.to ); - }; + // Scale the css box + if ( scale == "box" || scale == "both" ) { + + // Vertical props scaling + if ( factor.from.y !== factor.to.y ) { + props = props.concat( vProps ); + el.from = $.effects.setTransition( el, vProps, factor.from.y, el.from ); + el.to = $.effects.setTransition( el, vProps, factor.to.y, el.to ); }; - // Scale the content - if ( scale == 'content' || scale == 'both' ) { + // Horizontal props scaling + if ( factor.from.x !== factor.to.x ) { + props = props.concat( hProps ); + el.from = $.effects.setTransition( el, hProps, factor.from.x, el.from ); + el.to = $.effects.setTransition( el, hProps, factor.to.x, el.to ); + }; + }; - // Vertical props scaling - if ( factor.from.y !== factor.to.y ) { - props = props.concat( cProps ); - el.from = $.effects.setTransition( el, cProps, factor.from.y, el.from ); - el.to = $.effects.setTransition( el, cProps, factor.to.y, el.to ); - }; + // Scale the content + if ( scale == "content" || scale == "both" ) { + + // Vertical props scaling + if ( factor.from.y !== factor.to.y ) { + props = props.concat( cProps ); + el.from = $.effects.setTransition( el, cProps, factor.from.y, el.from ); + el.to = $.effects.setTransition( el, cProps, factor.to.y, el.to ); }; - - $.effects.save( el, restore ? props : props1 ); - el.show(); - $.effects.createWrapper( el ); - el.css( 'overflow', 'hidden' ).css( el.from ); - - // Adjust - if (origin) { // Calculate baseline shifts - baseline = $.effects.getBaseline( origin, original ); - el.from.top = ( original.outerHeight - el.outerHeight() ) * baseline.y; - el.from.left = ( original.outerWidth - el.outerWidth() ) * baseline.x; - el.to.top = ( original.outerHeight - el.to.outerHeight ) * baseline.y; - el.to.left = ( original.outerWidth - el.to.outerWidth ) * baseline.x; - } - el.css( el.from ); // set top & left - - // Animate - if ( scale == 'content' || scale == 'both' ) { // Scale the children - - // Add margins/font-size - vProps = vProps.concat([ 'marginTop', 'marginBottom' ]).concat(cProps); - hProps = hProps.concat([ 'marginLeft', 'marginRight' ]); - props2 = props.concat(vProps).concat(hProps); - - el.find( "*[width]" ).each( function(){ - var child = $( this ), - c_original = { - height: child.height(), - width: child.width() - }; - if (restore) $.effects.save(child, props2); - - child.from = { - height: c_original.height * factor.from.y, - width: c_original.width * factor.from.x - }; - child.to = { - height: c_original.height * factor.to.y, - width: c_original.width * factor.to.x + }; + + $.effects.save( el, restore ? props : props1 ); + el.show(); + $.effects.createWrapper( el ); + el.css( "overflow", "hidden" ).css( el.from ); + + // Adjust + if (origin) { // Calculate baseline shifts + baseline = $.effects.getBaseline( origin, original ); + el.from.top = ( original.outerHeight - el.outerHeight() ) * baseline.y; + el.from.left = ( original.outerWidth - el.outerWidth() ) * baseline.x; + el.to.top = ( original.outerHeight - el.to.outerHeight ) * baseline.y; + el.to.left = ( original.outerWidth - el.to.outerWidth ) * baseline.x; + } + el.css( el.from ); // set top & left + + // Animate + if ( scale == "content" || scale == "both" ) { // Scale the children + + // Add margins/font-size + vProps = vProps.concat([ "marginTop", "marginBottom" ]).concat(cProps); + hProps = hProps.concat([ "marginLeft", "marginRight" ]); + props2 = props.concat(vProps).concat(hProps); + + el.find( "*[width]" ).each( function(){ + var child = $( this ), + c_original = { + height: child.height(), + width: child.width() }; + if (restore) $.effects.save(child, props2); + + child.from = { + height: c_original.height * factor.from.y, + width: c_original.width * factor.from.x + }; + child.to = { + height: c_original.height * factor.to.y, + width: c_original.width * factor.to.x + }; - // Vertical props scaling - if ( factor.from.y != factor.to.y ) { - child.from = $.effects.setTransition( child, vProps, factor.from.y, child.from ); - child.to = $.effects.setTransition( child, vProps, factor.to.y, child.to ); - }; + // Vertical props scaling + if ( factor.from.y != factor.to.y ) { + child.from = $.effects.setTransition( child, vProps, factor.from.y, child.from ); + child.to = $.effects.setTransition( child, vProps, factor.to.y, child.to ); + }; - // Horizontal props scaling - if ( factor.from.x != factor.to.x ) { - child.from = $.effects.setTransition( child, hProps, factor.from.x, child.from ); - child.to = $.effects.setTransition( child, hProps, factor.to.x, child.to ); - }; + // Horizontal props scaling + if ( factor.from.x != factor.to.x ) { + child.from = $.effects.setTransition( child, hProps, factor.from.x, child.from ); + child.to = $.effects.setTransition( child, hProps, factor.to.x, child.to ); + }; - // Animate children - child.css( child.from ); - child.animate( child.to, o.duration, o.easing, function() { + // Animate children + child.css( child.from ); + child.animate( child.to, o.duration, o.easing, function() { - // Restore children - if (restore) $.effects.restore( child, props2 ); - }); + // Restore children + if (restore) $.effects.restore( child, props2 ); }); - }; - - // Animate - el.animate( el.to, { - queue: false, - duration: o.duration, - easing: o.easing, - complete: function() { - if ( el.to.opacity === 0 ) { - el.css( 'opacity', el.from.opacity ); - } - if( mode == 'hide' ) { - el.hide(); - } - $.effects.restore( el, restore ? props : props1 ); + }); + }; + + // Animate + el.animate( el.to, { + queue: false, + duration: o.duration, + easing: o.easing, + complete: function() { + if ( el.to.opacity === 0 ) { + el.css( "opacity", el.from.opacity ); + } + if( mode == "hide" ) { + el.hide(); + } + $.effects.restore( el, restore ? props : props1 ); + if ( !restore ) { - // we need to recalculate our positioning based on the new scaling + // we need to calculate our new positioning based on the scaling if ( position === "static" ) { el.css({ position: "relative", @@ -292,13 +298,14 @@ $.effects.effect.size = function( o ) { }); }); } - - $.effects.removeWrapper( el ); - $.isFunction( o.complete ) && o.complete.apply( this, arguments ); // Callback - el.dequeue(); } - }); + $.effects.removeWrapper( el ); + if ( $.isFunction( o.complete ) ) { + o.complete.apply( this, arguments ); + } + next(); + } }); }; diff --git a/ui/jquery.effects.shake.js b/ui/jquery.effects.shake.js index 52ab331e8..82d7ae97e 100644 --- a/ui/jquery.effects.shake.js +++ b/ui/jquery.effects.shake.js @@ -12,66 +12,63 @@ */ (function( $, undefined ) { -$.effects.effect.shake = function( o ) { +$.effects.effect.shake = function( o, next ) { - return this.queue( function() { + var el = $( this ), + props = [ "position", "top", "bottom", "left", "right", "height", "width" ], + mode = $.effects.setMode( el, o.mode || "effect" ), + direction = o.direction || "left", + distance = o.distance || 20, + times = o.times || 3, + anims = times * 2 + 1, + speed = o.duration, + ref = (direction == "up" || direction == "down") ? "top" : "left", + motion = (direction == "up" || direction == "left") ? "pos" : "neg", + animation = {}, + animation1 = {}, + animation2 = {}, + i, - var el = $( this ), - props = [ "position", "top", "bottom", "left", "right", "height", "width" ], - mode = $.effects.setMode( el, o.mode || "effect" ), - direction = o.direction || "left", - distance = o.distance || 20, - times = o.times || 3, - anims = times * 2 + 1, - speed = o.duration, - ref = (direction == "up" || direction == "down") ? "top" : "left", - motion = (direction == "up" || direction == "left") ? "pos" : "neg", - animation = {}, - animation1 = {}, - animation2 = {}, - i, + // we will need to re-assemble the queue to stack our animations in place + queue = el.queue(), + queuelen = queue.length; + - // we will need to re-assemble the queue to stack our animations in place - queue = el.queue(), - queuelen = queue.length; - + $.effects.save( el, props ); + el.show(); + $.effects.createWrapper( el ); - $.effects.save( el, props ); - el.show(); - $.effects.createWrapper( el ); + // Animation + animation[ ref ] = ( motion == "pos" ? "-=" : "+=" ) + distance; + animation1[ ref ] = ( motion == "pos" ? "+=" : "-=" ) + distance * 2; + animation2[ ref ] = ( motion == "pos" ? "-=" : "+=" ) + distance * 2; - // Animation - animation[ ref ] = ( motion == "pos" ? "-=" : "+=" ) + distance; - animation1[ ref ] = ( motion == "pos" ? "+=" : "-=" ) + distance * 2; - animation2[ ref ] = ( motion == "pos" ? "-=" : "+=" ) + distance * 2; + // Animate + el.animate( animation, speed, o.easing ); - // Animate - el.animate( animation, speed, o.easing ); + // Shakes + for ( i = 1; i < times; i++ ) { + el.animate( animation1, speed, o.easing ).animate( animation2, speed, o.easing ); + }; + el + .animate( animation1, speed, o.easing ) + .animate( animation, speed / 2, o.easing ) + .queue( function( next ) { + if ( mode === "hide" ) { + el.hide(); + } + $.effects.restore( el, props ); + $.effects.removeWrapper( el ); + $.isFunction( o.complete ) && o.complete.apply( this, arguments ); + next(); + }); - // Shakes - for ( i = 1; i < times; i++ ) { - el.animate( animation1, speed, o.easing ).animate( animation2, speed, o.easing ); - }; - el - .animate( animation1, speed, o.easing ) - .animate( animation, speed / 2, o.easing ) - .queue( function( next ) { - if ( mode === "hide" ) { - el.hide(); - } - $.effects.restore( el, props ); - $.effects.removeWrapper( el ); - $.isFunction( o.complete ) && o.complete.apply( this, arguments ); - next(); - }); - - // inject all the animations we just queued to be first in line (after "inprogress") - if ( queuelen > 1) { - queue.splice.apply( queue, - [ 1, 0 ].concat( queue.splice( queuelen, anims + 1 ) ) ); - } - el.dequeue(); - }); + // inject all the animations we just queued to be first in line (after "inprogress") + if ( queuelen > 1) { + queue.splice.apply( queue, + [ 1, 0 ].concat( queue.splice( queuelen, anims + 1 ) ) ); + } + next(); }; diff --git a/ui/jquery.effects.slide.js b/ui/jquery.effects.slide.js index ccb13fa1b..7ed744284 100644 --- a/ui/jquery.effects.slide.js +++ b/ui/jquery.effects.slide.js @@ -12,58 +12,54 @@ */ (function( $, undefined ) { -$.effects.effect.slide = function( o ) { +$.effects.effect.slide = function( o, next ) { - return this.queue( function() { + // Create element + var el = $( this ), + props = [ "position", "top", "bottom", "left", "right", "width", "height" ], + mode = $.effects.setMode( el, o.mode || "show" ), + direction = o.direction || "left", + ref = (direction == "up" || direction == "down") ? "top" : "left", + motion = (direction == "up" || direction == "left") ? "pos" : "neg", + distance, + animation = {}, + size; - // Create element - var el = $( this ), - props = [ "position", "top", "bottom", "left", "right", "width", "height" ], - mode = $.effects.setMode( el, o.mode || 'show' ), - direction = o.direction || 'left', - ref = (direction == 'up' || direction == 'down') ? 'top' : 'left', - motion = (direction == 'up' || direction == 'left') ? 'pos' : 'neg', - distance, - animation = {}, - size; - - // Adjust - $.effects.save( el, props ); - el.show(); - distance = o.distance || el[ ref == 'top' ? "outerHeight" : "outerWidth" ]({ - margin: true - }); - - $.effects.createWrapper( el ).css({ - overflow: 'hidden' - }); - - if (mode == 'show') { - el.css( ref, motion == 'pos' ? (isNaN(distance) ? "-" + distance : -distance) : distance ); - } + // Adjust + $.effects.save( el, props ); + el.show(); + distance = o.distance || el[ ref == "top" ? "outerHeight" : "outerWidth" ]({ + margin: true + }); + + $.effects.createWrapper( el ).css({ + overflow: "hidden" + }); + + if (mode == "show") { + el.css( ref, motion == "pos" ? (isNaN(distance) ? "-" + distance : -distance) : distance ); + } - // Animation - animation[ ref ] = ( mode == 'show' ? - (motion == 'pos' ? '+=' : '-=') : - (motion == 'pos' ? '-=' : '+=')) - + distance; + // Animation + animation[ ref ] = ( mode == "show" ? + (motion == "pos" ? "+=" : "-=") : + (motion == "pos" ? "-=" : "+=")) + + distance; - // Animate - el.animate( animation, { - queue: false, - duration: o.duration, - easing: o.easing, - complete: function() { - if ( mode == 'hide' ) { - el.hide(); - } - $.effects.restore( el, props ); - $.effects.removeWrapper( el ); - $.isFunction(o.complete) && o.complete.apply( this, arguments ); - el.dequeue(); + // Animate + el.animate( animation, { + queue: false, + duration: o.duration, + easing: o.easing, + complete: function() { + if ( mode == "hide" ) { + el.hide(); } - }); - + $.effects.restore( el, props ); + $.effects.removeWrapper( el ); + $.isFunction(o.complete) && o.complete.apply( this, arguments ); + next(); + } }); }; diff --git a/ui/jquery.effects.transfer.js b/ui/jquery.effects.transfer.js index f0f9d9fd4..061882fec 100644 --- a/ui/jquery.effects.transfer.js +++ b/ui/jquery.effects.transfer.js @@ -12,39 +12,36 @@ */ (function( $, undefined ) { -$.effects.effect.transfer = function( o ) { - - return this.queue( function() { - var elem = $( this ), - target = $( o.to ), - targetFixed = target.css( "position" ) === "fixed", - body = $("body"), - fixTop = targetFixed ? body.scrollTop() : 0, - fixLeft = targetFixed ? body.scrollLeft() : 0, - endPosition = target.offset(), - animation = { - top: endPosition.top - fixTop , - left: endPosition.left - fixLeft , - height: target.innerHeight(), - width: target.innerWidth() - }, - startPosition = elem.offset(), - transfer = $( '
' ) - .appendTo( document.body ) - .addClass( o.className ) - .css({ - top: startPosition.top - fixTop , - left: startPosition.left - fixLeft , - height: elem.innerHeight(), - width: elem.innerWidth(), - position: targetFixed ? "fixed" : "absolute" - }) - .animate( animation, o.duration, o.easing, function() { - transfer.remove(); - $.isFunction( o.complete ) && o.complete.apply(elem[0], arguments); - elem.dequeue(); - }); - }); +$.effects.effect.transfer = function( o, next ) { + var elem = $( this ), + target = $( o.to ), + targetFixed = target.css( "position" ) === "fixed", + body = $("body"), + fixTop = targetFixed ? body.scrollTop() : 0, + fixLeft = targetFixed ? body.scrollLeft() : 0, + endPosition = target.offset(), + animation = { + top: endPosition.top - fixTop , + left: endPosition.left - fixLeft , + height: target.innerHeight(), + width: target.innerWidth() + }, + startPosition = elem.offset(), + transfer = $( '
' ) + .appendTo( document.body ) + .addClass( o.className ) + .css({ + top: startPosition.top - fixTop , + left: startPosition.left - fixLeft , + height: elem.innerHeight(), + width: elem.innerWidth(), + position: targetFixed ? "fixed" : "absolute" + }) + .animate( animation, o.duration, o.easing, function() { + transfer.remove(); + $.isFunction( o.complete ) && o.complete.apply(elem[0], arguments); + next(); + }); }; })(jQuery); -- cgit v1.2.3 From 65a6c46e5568c43a9df9505e23da6a766814557e Mon Sep 17 00:00:00 2001 From: gnarf Date: Tue, 21 Jun 2011 01:15:42 -0500 Subject: Effects.*: Style Guidance --- ui/jquery.effects.blind.js | 16 ++++++++-------- ui/jquery.effects.bounce.js | 2 +- ui/jquery.effects.drop.js | 16 ++++++++++------ ui/jquery.effects.explode.js | 4 ++-- ui/jquery.effects.fold.js | 34 +++++++++++++++++++++------------- ui/jquery.effects.highlight.js | 11 +++++++---- ui/jquery.effects.scale.js | 5 +++-- ui/jquery.effects.shake.js | 12 +++++++----- ui/jquery.effects.slide.js | 21 ++++++++++++--------- ui/jquery.effects.transfer.js | 4 +++- 10 files changed, 74 insertions(+), 51 deletions(-) (limited to 'ui') diff --git a/ui/jquery.effects.blind.js b/ui/jquery.effects.blind.js index 8c536be78..09d6a9e57 100644 --- a/ui/jquery.effects.blind.js +++ b/ui/jquery.effects.blind.js @@ -11,7 +11,7 @@ * jquery.effects.core.js */ (function( $, undefined ) { - + var rvertical = /up|down|vertical/, rpositivemotion = /up|left|vertical|horizontal/; @@ -35,24 +35,24 @@ $.effects.effect.blind = function( o, next ) { } else { $.effects.save( el, props ); } - el.show(); - wrapper = $.effects.createWrapper( el ).css({ + el.show(); + wrapper = $.effects.createWrapper( el ).css({ overflow: "hidden" }); distance = wrapper[ ref ](); - animation[ ref ] = ( mode === "show" ? distance : 0 ); + animation[ ref ] = show ? distance : 0; if ( !motion ) { el .css( vertical ? "bottom" : "right", 0 ) .css( vertical ? "top" : "left", "" ) .css({ position: "absolute" }); - animation[ ref2 ] = ( mode === "show" ) ? 0 : distance; + animation[ ref2 ] = show ? 0 : distance; } // start at 0 if we are showing - if ( mode === "show" ) { + if ( show ) { wrapper.css( ref, 0 ); if ( ! motion ) { wrapper.css( ref2, distance ); @@ -65,10 +65,10 @@ $.effects.effect.blind = function( o, next ) { easing: o.easing, queue: false, complete: function() { - if ( mode == "hide" ) { + if ( mode === "hide" ) { el.hide(); } - $.effects.restore( el, props ); + $.effects.restore( el, props ); $.effects.removeWrapper( el ); if ( $.isFunction( o.complete ) ) { o.complete.apply( el[ 0 ], arguments ); diff --git a/ui/jquery.effects.bounce.js b/ui/jquery.effects.bounce.js index f6cf5bb02..38171c32e 100644 --- a/ui/jquery.effects.bounce.js +++ b/ui/jquery.effects.bounce.js @@ -61,7 +61,7 @@ $.effects.effect.bounce = function( o, next ) { // if we are showing, force opacity 0 and set the initial position // then do the "first" animation el.css( "opacity", 0 ) - .css( ref, motion ? -distance*2 : distance*2 ) + .css( ref, motion ? -distance * 2 : distance * 2 ) .animate( downAnim, speed, easing ); } diff --git a/ui/jquery.effects.drop.js b/ui/jquery.effects.drop.js index a0bdc7d4d..2fba49d92 100644 --- a/ui/jquery.effects.drop.js +++ b/ui/jquery.effects.drop.js @@ -17,11 +17,12 @@ $.effects.effect.drop = function( o, next ) { var el = $( this ), props = [ "position", "top", "bottom", "left", "right", "opacity", "height", "width" ], mode = $.effects.setMode( el, o.mode || "hide" ), + show = mode === "show", direction = o.direction || "left", - ref = ( direction == "up" || direction == "down" ) ? "top" : "left", - motion = ( direction == "up" || direction == "left" ) ? "pos" : "neg", + ref = ( direction === "up" || direction === "down" ) ? "top" : "left", + motion = ( direction === "up" || direction === "left" ) ? "pos" : "neg", animation = { - opacity: mode == "show" ? 1 : 0 + opacity: show ? 1 : 0 }, distance; @@ -32,14 +33,17 @@ $.effects.effect.drop = function( o, next ) { distance = o.distance || el[ ref == "top" ? "outerHeight": "outerWidth" ]({ margin: true }) / 2; - if ( mode == "show" ) { + if ( show ) { el .css( "opacity", 0 ) .css( ref, motion == "pos" ? -distance : distance ); } // Animation - animation[ ref ] = ((mode == "show") ? (motion == "pos" ? "+=" : "-=") : (motion == "pos" ? "-=" : "+=")) + distance; + animation[ ref ] = ( show ? + ( motion === "pos" ? "+=" : "-=" ) : + ( motion === "pos" ? "-=" : "+=" ) ) + + distance; // Animate el.animate( animation, { @@ -50,7 +54,7 @@ $.effects.effect.drop = function( o, next ) { mode == "hide" && el.hide(); $.effects.restore( el, props ); $.effects.removeWrapper( el ); - $.isFunction( o.complete ) && o.complete.apply(this, arguments); + $.isFunction( o.complete ) && o.complete.apply( this, arguments ); next(); } }); diff --git a/ui/jquery.effects.explode.js b/ui/jquery.effects.explode.js index 76711c6f2..0deb2be9f 100644 --- a/ui/jquery.effects.explode.js +++ b/ui/jquery.effects.explode.js @@ -14,11 +14,11 @@ $.effects.effect.explode = function( o, next ) { - var rows = o.pieces ? Math.round(Math.sqrt(o.pieces)) : 3, + var rows = o.pieces ? Math.round( Math.sqrt( o.pieces ) ) : 3, cells = rows, el = $( this ), mode = $.effects.setMode( el, o.mode || "hide" ), - show = ( mode == "show" ), + show = mode === "show", // show and then visibility:hidden the element before calculating offset offset = el.show().css( "visibility", "hidden" ).offset(), diff --git a/ui/jquery.effects.fold.js b/ui/jquery.effects.fold.js index de7530bf0..b2a02ba78 100644 --- a/ui/jquery.effects.fold.js +++ b/ui/jquery.effects.fold.js @@ -16,15 +16,18 @@ $.effects.effect.fold = function( o, next ) { // Create element var el = $( this ), - props = ["position","top","bottom","left","right","height","width"], - mode = $.effects.setMode(el, o.mode || "hide"), + props = [ "position", "top", "bottom", "left", "right", "height", "width" ], + mode = $.effects.setMode( el, o.mode || "hide" ), + show = mode === "show", + hide = mode === "hide", size = o.size || 15, - percent = /([0-9]+)%/.exec(size), + percent = /([0-9]+)%/.exec( size ), horizFirst = !!o.horizFirst, - widthFirst = ((mode == "show") != horizFirst), - ref = widthFirst ? ["width", "height"] : ["height", "width"], + widthFirst = show != horizFirst, + ref = widthFirst ? [ "width", "height" ] : [ "height", "width" ], duration = o.duration / 2, - wrapper, distance; + wrapper, distance, + animation1 = {}, animation2 = {}; $.effects.save( el, props ); el.show(); @@ -38,29 +41,34 @@ $.effects.effect.fold = function( o, next ) { [ wrapper.height(), wrapper.width() ]; if ( percent ) { - size = parseInt( percent[ 1 ], 10 ) / 100 * distance[ ( mode == "hide") ? 0 : 1 ]; + size = parseInt( percent[ 1 ], 10 ) / 100 * distance[ hide ? 0 : 1 ]; } - mode == "show" && wrapper.css( horizFirst ? { + if ( show ) { + wrapper.css( horizFirst ? { height: 0, width: size } : { height: size, width: 0 }); + } // Animation - var animation1 = {}, animation2 = {}; - animation1[ ref[ 0 ] ] = mode == "show" ? distance[ 0 ] : size; - animation2[ ref[ 1 ] ] = mode == "show" ? distance[ 1 ] : 0; + animation1[ ref[ 0 ] ] = show ? distance[ 0 ] : size; + animation2[ ref[ 1 ] ] = show ? distance[ 1 ] : 0; // Animate wrapper .animate( animation1, duration, o.easing ) .animate( animation2, duration, o.easing, function() { - (mode == "hide") && el.hide(); + if ( hide ) { + el.hide(); + } $.effects.restore( el, props ); $.effects.removeWrapper( el ); - jQuery.isFunction(o.complete) && o.complete.apply( el[ 0 ], arguments ); + if ( $.isFunction( o.complete ) ) { + o.complete.apply( el[ 0 ], arguments ); + } next(); }); diff --git a/ui/jquery.effects.highlight.js b/ui/jquery.effects.highlight.js index 61826e696..709e93a3c 100644 --- a/ui/jquery.effects.highlight.js +++ b/ui/jquery.effects.highlight.js @@ -20,7 +20,7 @@ $.effects.effect.highlight = function( o, next ) { backgroundColor: elem.css( "backgroundColor" ) }; - if (mode == "hide") { + if (mode === "hide") { animation.opacity = 0; } @@ -37,10 +37,13 @@ $.effects.effect.highlight = function( o, next ) { duration: o.duration, easing: o.easing, complete: function() { - (mode == "hide" && elem.hide()); + if ( mode === "hide" ) { + elem.hide(); + } $.effects.restore( elem, props ); - (mode == "show" && !$.support.opacity && this.style.removeAttribute( "filter" )); - jQuery.isFunction(o.complete) && o.complete.apply(this, arguments); + if ( $.isFunction( o.complete) ) { + o.complete.apply( this, arguments ); + } next(); } }); diff --git a/ui/jquery.effects.scale.js b/ui/jquery.effects.scale.js index 614943cfb..2642c6c1d 100644 --- a/ui/jquery.effects.scale.js +++ b/ui/jquery.effects.scale.js @@ -24,6 +24,7 @@ function compFunction( el, complete, next ) { $.effects.effect.puff = function( o, next ) { var elem = $( this ), mode = $.effects.setMode( elem, o.mode || "hide" ), + hide = mode === "hide", percent = parseInt( o.percent, 10 ) || 150, factor = percent / 100, original = { @@ -37,8 +38,8 @@ $.effects.effect.puff = function( o, next ) { fade: true, mode: mode, complete: compFunction( this, o.complete, next ), - percent: mode == "hide" ? percent : 100, - from: mode == "hide" + percent: hide ? percent : 100, + from: hide ? original : { height: original.height * factor, diff --git a/ui/jquery.effects.shake.js b/ui/jquery.effects.shake.js index 82d7ae97e..311edced0 100644 --- a/ui/jquery.effects.shake.js +++ b/ui/jquery.effects.shake.js @@ -23,7 +23,7 @@ $.effects.effect.shake = function( o, next ) { anims = times * 2 + 1, speed = o.duration, ref = (direction == "up" || direction == "down") ? "top" : "left", - motion = (direction == "up" || direction == "left") ? "pos" : "neg", + positiveMotion = (direction == "up" || direction == "left"), animation = {}, animation1 = {}, animation2 = {}, @@ -39,9 +39,9 @@ $.effects.effect.shake = function( o, next ) { $.effects.createWrapper( el ); // Animation - animation[ ref ] = ( motion == "pos" ? "-=" : "+=" ) + distance; - animation1[ ref ] = ( motion == "pos" ? "+=" : "-=" ) + distance * 2; - animation2[ ref ] = ( motion == "pos" ? "-=" : "+=" ) + distance * 2; + animation[ ref ] = ( positiveMotion ? "-=" : "+=" ) + distance; + animation1[ ref ] = ( positiveMotion ? "+=" : "-=" ) + distance * 2; + animation2[ ref ] = ( positiveMotion ? "-=" : "+=" ) + distance * 2; // Animate el.animate( animation, speed, o.easing ); @@ -59,7 +59,9 @@ $.effects.effect.shake = function( o, next ) { } $.effects.restore( el, props ); $.effects.removeWrapper( el ); - $.isFunction( o.complete ) && o.complete.apply( this, arguments ); + if ( $.isFunction( o.complete ) ) { + o.complete.apply( this, arguments ); + } next(); }); diff --git a/ui/jquery.effects.slide.js b/ui/jquery.effects.slide.js index 7ed744284..3be28d91b 100644 --- a/ui/jquery.effects.slide.js +++ b/ui/jquery.effects.slide.js @@ -18,9 +18,10 @@ $.effects.effect.slide = function( o, next ) { var el = $( this ), props = [ "position", "top", "bottom", "left", "right", "width", "height" ], mode = $.effects.setMode( el, o.mode || "show" ), + show = mode === "show", direction = o.direction || "left", ref = (direction == "up" || direction == "down") ? "top" : "left", - motion = (direction == "up" || direction == "left") ? "pos" : "neg", + positiveMotion = (direction == "up" || direction == "left"), distance, animation = {}, size; @@ -28,7 +29,7 @@ $.effects.effect.slide = function( o, next ) { // Adjust $.effects.save( el, props ); el.show(); - distance = o.distance || el[ ref == "top" ? "outerHeight" : "outerWidth" ]({ + distance = o.distance || el[ ref === "top" ? "outerHeight" : "outerWidth" ]({ margin: true }); @@ -36,14 +37,14 @@ $.effects.effect.slide = function( o, next ) { overflow: "hidden" }); - if (mode == "show") { - el.css( ref, motion == "pos" ? (isNaN(distance) ? "-" + distance : -distance) : distance ); + if ( show ) { + el.css( ref, positiveMotion ? (isNaN(distance) ? "-" + distance : -distance) : distance ); } // Animation - animation[ ref ] = ( mode == "show" ? - (motion == "pos" ? "+=" : "-=") : - (motion == "pos" ? "-=" : "+=")) + animation[ ref ] = ( show ? + ( positiveMotion ? "+=" : "-=") : + ( positiveMotion ? "-=" : "+=")) + distance; // Animate @@ -52,12 +53,14 @@ $.effects.effect.slide = function( o, next ) { duration: o.duration, easing: o.easing, complete: function() { - if ( mode == "hide" ) { + if ( mode === "hide" ) { el.hide(); } $.effects.restore( el, props ); $.effects.removeWrapper( el ); - $.isFunction(o.complete) && o.complete.apply( this, arguments ); + if ( $.isFunction( o.complete ) ) { + o.complete.apply( this, arguments ); + } next(); } }); diff --git a/ui/jquery.effects.transfer.js b/ui/jquery.effects.transfer.js index 061882fec..0c840c35c 100644 --- a/ui/jquery.effects.transfer.js +++ b/ui/jquery.effects.transfer.js @@ -39,7 +39,9 @@ $.effects.effect.transfer = function( o, next ) { }) .animate( animation, o.duration, o.easing, function() { transfer.remove(); - $.isFunction( o.complete ) && o.complete.apply(elem[0], arguments); + if ( $.isFunction( o.complete ) ) { + o.complete.apply( elem[0], arguments ); + } next(); }); }; -- cgit v1.2.3 From ab627e03a6a37cbf3291e9600f5482bd50991360 Mon Sep 17 00:00:00 2001 From: gnarf Date: Tue, 21 Jun 2011 01:11:46 -0500 Subject: Effects.*: DRY the complete callback execution into the 'done' callback passed into an effect --- ui/jquery.effects.blind.js | 7 ++----- ui/jquery.effects.bounce.js | 11 ++++------- ui/jquery.effects.clip.js | 7 ++----- ui/jquery.effects.core.js | 14 +++++++++++++- ui/jquery.effects.drop.js | 5 ++--- ui/jquery.effects.explode.js | 7 ++----- ui/jquery.effects.fade.js | 7 ++----- ui/jquery.effects.fold.js | 7 ++----- ui/jquery.effects.highlight.js | 7 ++----- ui/jquery.effects.pulsate.js | 11 ++++------- ui/jquery.effects.scale.js | 24 ++++++------------------ ui/jquery.effects.shake.js | 11 ++++------- ui/jquery.effects.slide.js | 7 ++----- ui/jquery.effects.transfer.js | 7 ++----- 14 files changed, 49 insertions(+), 83 deletions(-) (limited to 'ui') diff --git a/ui/jquery.effects.blind.js b/ui/jquery.effects.blind.js index 09d6a9e57..5f86bed7b 100644 --- a/ui/jquery.effects.blind.js +++ b/ui/jquery.effects.blind.js @@ -15,7 +15,7 @@ var rvertical = /up|down|vertical/, rpositivemotion = /up|left|vertical|horizontal/; -$.effects.effect.blind = function( o, next ) { +$.effects.effect.blind = function( o, done ) { // Create element var el = $( this ), props = [ "position", "top", "bottom", "left", "right", "height", "width" ], @@ -70,10 +70,7 @@ $.effects.effect.blind = function( o, next ) { } $.effects.restore( el, props ); $.effects.removeWrapper( el ); - if ( $.isFunction( o.complete ) ) { - o.complete.apply( el[ 0 ], arguments ); - } - next(); + done(); } }); diff --git a/ui/jquery.effects.bounce.js b/ui/jquery.effects.bounce.js index 38171c32e..41ee34f64 100644 --- a/ui/jquery.effects.bounce.js +++ b/ui/jquery.effects.bounce.js @@ -12,7 +12,7 @@ */ (function( $, undefined ) { -$.effects.effect.bounce = function( o, next ) { +$.effects.effect.bounce = function( o, done ) { var el = $( this ), props = [ "position", "top", "bottom", "left", "right", "height", "width" ], @@ -91,16 +91,13 @@ $.effects.effect.bounce = function( o, next ) { el.animate( upAnim, speed, easing ); } - el.queue( function( next ) { + el.queue(function() { if ( hide ) { el.hide(); } $.effects.restore( el, props ); $.effects.removeWrapper( el ); - if ( o.complete ) { - o.complete.apply( el[ 0 ] ); - } - next(); + done(); }); // inject all the animations we just queued to be first in line (after "inprogress") @@ -108,7 +105,7 @@ $.effects.effect.bounce = function( o, next ) { queue.splice.apply( queue, [ 1, 0 ].concat( queue.splice( queuelen, anims + 1 ) ) ); } - next(); + el.dequeue(); }; diff --git a/ui/jquery.effects.clip.js b/ui/jquery.effects.clip.js index 8c5c76e8c..c6eecc671 100644 --- a/ui/jquery.effects.clip.js +++ b/ui/jquery.effects.clip.js @@ -12,7 +12,7 @@ */ (function( $, undefined ) { -$.effects.effect.clip = function( o, next ) { +$.effects.effect.clip = function( o, done ) { // Create element var el = $( this ), props = [ "position", "top", "bottom", "left", "right", "height", "width" ], @@ -57,10 +57,7 @@ $.effects.effect.clip = function( o, next ) { } $.effects.restore( el, props ); $.effects.removeWrapper( el ); - if ( $.isFunction( o.complete ) ) { - o.complete.apply( el[ 0 ], arguments ); - } - el.dequeue(); + done(); } }); diff --git a/ui/jquery.effects.core.js b/ui/jquery.effects.core.js index 87fc5a074..330ddd83c 100644 --- a/ui/jquery.effects.core.js +++ b/ui/jquery.effects.core.js @@ -556,7 +556,19 @@ $.fn.extend({ } function run( next ) { - effectMethod.call( this, args, $.isFunction( next ) ? next : $.noop ); + var elem = this, + complete = args.complete; + + function done() { + if ( $.isFunction( complete ) ) { + complete.call( elem ); + } + if ( $.isFunction( next ) ) { + next(); + } + } + + effectMethod.call( elem, args, done ); } // TODO: remove this check in 2.0, effectMethod will always be true diff --git a/ui/jquery.effects.drop.js b/ui/jquery.effects.drop.js index 2fba49d92..2e7a6ec0f 100644 --- a/ui/jquery.effects.drop.js +++ b/ui/jquery.effects.drop.js @@ -12,7 +12,7 @@ */ (function( $, undefined ) { -$.effects.effect.drop = function( o, next ) { +$.effects.effect.drop = function( o, done ) { var el = $( this ), props = [ "position", "top", "bottom", "left", "right", "opacity", "height", "width" ], @@ -54,8 +54,7 @@ $.effects.effect.drop = function( o, next ) { mode == "hide" && el.hide(); $.effects.restore( el, props ); $.effects.removeWrapper( el ); - $.isFunction( o.complete ) && o.complete.apply( this, arguments ); - next(); + done(); } }); diff --git a/ui/jquery.effects.explode.js b/ui/jquery.effects.explode.js index 0deb2be9f..22f506045 100644 --- a/ui/jquery.effects.explode.js +++ b/ui/jquery.effects.explode.js @@ -12,7 +12,7 @@ */ (function( $, undefined ) { -$.effects.effect.explode = function( o, next ) { +$.effects.effect.explode = function( o, done ) { var rows = o.pieces ? Math.round( Math.sqrt( o.pieces ) ) : 3, cells = rows, @@ -89,10 +89,7 @@ $.effects.effect.explode = function( o, next ) { if ( !show ) { el.hide(); } - if ( $.isFunction( o.complete ) ) { - o.complete.apply( el[ 0 ] ); - } - next(); + done(); } }; diff --git a/ui/jquery.effects.fade.js b/ui/jquery.effects.fade.js index 8f2d956dc..9b79ad3bc 100644 --- a/ui/jquery.effects.fade.js +++ b/ui/jquery.effects.fade.js @@ -12,7 +12,7 @@ */ (function( $, undefined ) { -$.effects.effect.fade = function( o, next ) { +$.effects.effect.fade = function( o, done ) { var el = $( this ), mode = $.effects.setMode( el, o.mode || "toggle" ), hide = mode === "hide"; @@ -28,10 +28,7 @@ $.effects.effect.fade = function( o, next ) { if ( hide ) { el.hide(); } - if ( o.complete ) { - o.complete.call( this ); - } - next(); + done(); } }); }; diff --git a/ui/jquery.effects.fold.js b/ui/jquery.effects.fold.js index b2a02ba78..7c4f583c1 100644 --- a/ui/jquery.effects.fold.js +++ b/ui/jquery.effects.fold.js @@ -12,7 +12,7 @@ */ (function( $, undefined ) { -$.effects.effect.fold = function( o, next ) { +$.effects.effect.fold = function( o, done ) { // Create element var el = $( this ), @@ -66,10 +66,7 @@ $.effects.effect.fold = function( o, next ) { } $.effects.restore( el, props ); $.effects.removeWrapper( el ); - if ( $.isFunction( o.complete ) ) { - o.complete.apply( el[ 0 ], arguments ); - } - next(); + done(); }); }; diff --git a/ui/jquery.effects.highlight.js b/ui/jquery.effects.highlight.js index 709e93a3c..edde845a3 100644 --- a/ui/jquery.effects.highlight.js +++ b/ui/jquery.effects.highlight.js @@ -12,7 +12,7 @@ */ (function( $, undefined ) { -$.effects.effect.highlight = function( o, next ) { +$.effects.effect.highlight = function( o, done ) { var elem = $( this ), props = [ "backgroundImage", "backgroundColor", "opacity" ], mode = $.effects.setMode( elem, o.mode || "show" ), @@ -41,10 +41,7 @@ $.effects.effect.highlight = function( o, next ) { elem.hide(); } $.effects.restore( elem, props ); - if ( $.isFunction( o.complete) ) { - o.complete.apply( this, arguments ); - } - next(); + done(); } }); }; diff --git a/ui/jquery.effects.pulsate.js b/ui/jquery.effects.pulsate.js index bc257f624..7d6e9328f 100644 --- a/ui/jquery.effects.pulsate.js +++ b/ui/jquery.effects.pulsate.js @@ -12,7 +12,7 @@ */ (function( $, undefined ) { -$.effects.effect.pulsate = function( o, next ) { +$.effects.effect.pulsate = function( o, done ) { var elem = $( this ), mode = $.effects.setMode( elem, o.mode || "show" ), show = mode === "show", @@ -44,14 +44,11 @@ $.effects.effect.pulsate = function( o, next ) { opacity: animateTo }, duration, o.easing); - elem.queue( function( next ) { + elem.queue(function() { if ( hide ) { elem.hide(); } - if ( o.complete ) { - o.complete.apply( this ); - } - next(); + done(); }); // We just queued up "anims" animations, we need to put them next in the queue @@ -59,7 +56,7 @@ $.effects.effect.pulsate = function( o, next ) { queue.splice.apply( queue, [ 1, 0 ].concat( queue.splice( queuelen, anims + 1 ) ) ); } - next(); + elem.dequeue(); }; })(jQuery); diff --git a/ui/jquery.effects.scale.js b/ui/jquery.effects.scale.js index 2642c6c1d..000fdee28 100644 --- a/ui/jquery.effects.scale.js +++ b/ui/jquery.effects.scale.js @@ -12,16 +12,7 @@ */ (function( $, undefined ) { -function compFunction( el, complete, next ) { - return function() { - if ( $.isFunction( complete ) ) { - complete.apply( el ); - } - next(); - }; -}; - -$.effects.effect.puff = function( o, next ) { +$.effects.effect.puff = function( o, done ) { var elem = $( this ), mode = $.effects.setMode( elem, o.mode || "hide" ), hide = mode === "hide", @@ -37,7 +28,7 @@ $.effects.effect.puff = function( o, next ) { queue: false, fade: true, mode: mode, - complete: compFunction( this, o.complete, next ), + complete: done, percent: hide ? percent : 100, from: hide ? original @@ -50,7 +41,7 @@ $.effects.effect.puff = function( o, next ) { elem.effect( o ); }; -$.effects.effect.scale = function( o, next ) { +$.effects.effect.scale = function( o, done ) { // Create element var el = $( this ), @@ -73,7 +64,7 @@ $.effects.effect.scale = function( o, next ) { // We are going to pass this effect to the size effect: options.effect = "size"; options.queue = false; - options.complete = compFunction( this, options.complete, next ); + options.complete = done; // Set default origin and restore for show/hide if ( mode != "effect" ) { @@ -105,7 +96,7 @@ $.effects.effect.scale = function( o, next ) { }; -$.effects.effect.size = function( o, next ) { +$.effects.effect.size = function( o, done ) { // Create element var el = $( this ), @@ -302,10 +293,7 @@ $.effects.effect.size = function( o, next ) { } $.effects.removeWrapper( el ); - if ( $.isFunction( o.complete ) ) { - o.complete.apply( this, arguments ); - } - next(); + done(); } }); diff --git a/ui/jquery.effects.shake.js b/ui/jquery.effects.shake.js index 311edced0..7d83a9bb8 100644 --- a/ui/jquery.effects.shake.js +++ b/ui/jquery.effects.shake.js @@ -12,7 +12,7 @@ */ (function( $, undefined ) { -$.effects.effect.shake = function( o, next ) { +$.effects.effect.shake = function( o, done ) { var el = $( this ), props = [ "position", "top", "bottom", "left", "right", "height", "width" ], @@ -53,16 +53,13 @@ $.effects.effect.shake = function( o, next ) { el .animate( animation1, speed, o.easing ) .animate( animation, speed / 2, o.easing ) - .queue( function( next ) { + .queue(function() { if ( mode === "hide" ) { el.hide(); } $.effects.restore( el, props ); $.effects.removeWrapper( el ); - if ( $.isFunction( o.complete ) ) { - o.complete.apply( this, arguments ); - } - next(); + done(); }); // inject all the animations we just queued to be first in line (after "inprogress") @@ -70,7 +67,7 @@ $.effects.effect.shake = function( o, next ) { queue.splice.apply( queue, [ 1, 0 ].concat( queue.splice( queuelen, anims + 1 ) ) ); } - next(); + el.dequeue(); }; diff --git a/ui/jquery.effects.slide.js b/ui/jquery.effects.slide.js index 3be28d91b..de393c779 100644 --- a/ui/jquery.effects.slide.js +++ b/ui/jquery.effects.slide.js @@ -12,7 +12,7 @@ */ (function( $, undefined ) { -$.effects.effect.slide = function( o, next ) { +$.effects.effect.slide = function( o, done ) { // Create element var el = $( this ), @@ -58,10 +58,7 @@ $.effects.effect.slide = function( o, next ) { } $.effects.restore( el, props ); $.effects.removeWrapper( el ); - if ( $.isFunction( o.complete ) ) { - o.complete.apply( this, arguments ); - } - next(); + done(); } }); diff --git a/ui/jquery.effects.transfer.js b/ui/jquery.effects.transfer.js index 0c840c35c..1fa291228 100644 --- a/ui/jquery.effects.transfer.js +++ b/ui/jquery.effects.transfer.js @@ -12,7 +12,7 @@ */ (function( $, undefined ) { -$.effects.effect.transfer = function( o, next ) { +$.effects.effect.transfer = function( o, done ) { var elem = $( this ), target = $( o.to ), targetFixed = target.css( "position" ) === "fixed", @@ -39,10 +39,7 @@ $.effects.effect.transfer = function( o, next ) { }) .animate( animation, o.duration, o.easing, function() { transfer.remove(); - if ( $.isFunction( o.complete ) ) { - o.complete.apply( elem[0], arguments ); - } - next(); + done(); }); }; -- cgit v1.2.3 From 5f0a2f01c4609315ab66158191d3f9bd420f827f Mon Sep 17 00:00:00 2001 From: marcneuwirth Date: Wed, 22 Jun 2011 04:03:55 -0500 Subject: Datepicker: Removing unnessecary typeof check. Fixed #6669 - Datepicker: _selectDate restores focus to non-object --- ui/jquery.ui.datepicker.js | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) (limited to 'ui') diff --git a/ui/jquery.ui.datepicker.js b/ui/jquery.ui.datepicker.js index ee0a86338..1d3de7740 100644 --- a/ui/jquery.ui.datepicker.js +++ b/ui/jquery.ui.datepicker.js @@ -932,8 +932,7 @@ $.extend(Datepicker.prototype, { else { this._hideDatepicker(); this._lastInput = inst.input[0]; - if (typeof(inst.input[0]) != 'object') - inst.input.focus(); // restore focus + inst.input.focus(); // restore focus this._lastInput = null; } }, -- cgit v1.2.3 From d18cd7ed0f41213aca9f29ae67c360ca6b21abfa Mon Sep 17 00:00:00 2001 From: Corey Frang Date: Thu, 23 Jun 2011 07:22:34 -0500 Subject: Effects.core: Check Visibility vs 'hide' and 'show' modes, finish immediately if neccessary - Fixes #6715 - Hide and Show try to affect hidden and showing elements --- tests/unit/effects/effects_core.js | 12 ++++++++++++ ui/jquery.effects.core.js | 15 +++++++++++---- 2 files changed, 23 insertions(+), 4 deletions(-) (limited to 'ui') diff --git a/tests/unit/effects/effects_core.js b/tests/unit/effects/effects_core.js index fd6b4d378..f78aea304 100644 --- a/tests/unit/effects/effects_core.js +++ b/tests/unit/effects/effects_core.js @@ -19,6 +19,18 @@ var minDuration = 15, module( "effects.core" ); +test( "Immediate Return Conditions", function() { + var hidden = $( "div.hidden" ), + count = 0; + expect( 6 ); + hidden.hide( "blind", function() { + equal( ++count, 1, "Hide on hidden returned immediately" ); + }).show().show( "blind", function() { + equal( ++count, 2, "Show on shown returned immediately" ); + }); + equal( ++count, 3, "Both Functions worked properly" ); +}); + $.each( $.effects.effect, function( effect ) { if ( effect === "transfer" ) { return; diff --git a/ui/jquery.effects.core.js b/ui/jquery.effects.core.js index 330ddd83c..b08cd6cf4 100644 --- a/ui/jquery.effects.core.js +++ b/ui/jquery.effects.core.js @@ -556,19 +556,26 @@ $.fn.extend({ } function run( next ) { - var elem = this, - complete = args.complete; + var elem = $( this ), + complete = args.complete, + mode = args.mode; function done() { if ( $.isFunction( complete ) ) { - complete.call( elem ); + complete.call( elem[0] ); } if ( $.isFunction( next ) ) { next(); } } - effectMethod.call( elem, args, done ); + // if the element is hiddden and mode is hide, + // or element is visible and mode is show + if ( elem.is( ":hidden" ) ? mode === "hide" : mode === "show" ) { + done(); + } else { + effectMethod.call( elem[0], args, done ); + } } // TODO: remove this check in 2.0, effectMethod will always be true -- cgit v1.2.3 From a56aa861b1deb6d71ec74a77647d12d50570ea57 Mon Sep 17 00:00:00 2001 From: marcneuwirth Date: Tue, 28 Jun 2011 10:49:47 -0500 Subject: Datepicker: Added onSelect.apply() call to _doKeyDown method when enter button pushed if onSelect is defined. Fixed #7124 - Datepicker: onSelect does not fire when enter button is pushed --- tests/unit/datepicker/datepicker_events.js | 5 +++++ ui/jquery.ui.datepicker.js | 7 +++++++ 2 files changed, 12 insertions(+) (limited to 'ui') diff --git a/tests/unit/datepicker/datepicker_events.js b/tests/unit/datepicker/datepicker_events.js index bf48c9c8a..c7c16b610 100644 --- a/tests/unit/datepicker/datepicker_events.js +++ b/tests/unit/datepicker/datepicker_events.js @@ -41,6 +41,11 @@ test('events', function() { simulate('keydown', {keyCode: $.simulate.VK_ESC}); equals(selectedDate, $.datepicker.formatDate('mm/dd/yy', date), 'Callback selected date - esc'); + var dateStr = '02/04/2008'; + inp.val(dateStr).datepicker('show'). + simulate('keydown', {keyCode: $.simulate.VK_ENTER}); + equals(dateStr, selectedDate, + 'onSelect is called after enter keydown'); // onChangeMonthYear inp.datepicker('option', {onChangeMonthYear: callback2, onSelect: null}). val('').datepicker('show'); diff --git a/ui/jquery.ui.datepicker.js b/ui/jquery.ui.datepicker.js index 1d3de7740..442621e0d 100644 --- a/ui/jquery.ui.datepicker.js +++ b/ui/jquery.ui.datepicker.js @@ -529,6 +529,13 @@ $.extend(Datepicker.prototype, { $.datepicker._currentClass + ')', inst.dpDiv); if (sel[0]) $.datepicker._selectDay(event.target, inst.selectedMonth, inst.selectedYear, sel[0]); + var onSelect = $.datepicker._get(inst, 'onSelect'); + if (onSelect) { + var dateStr = $.datepicker._formatDate(inst); + + // trigger custom callback + onSelect.apply((inst.input ? inst.input[0] : null), [dateStr, inst]); + } else $.datepicker._hideDatepicker(); return false; // don't submit the form -- cgit v1.2.3 From effdd5d19c534f8445ebafe4212278c4366b0041 Mon Sep 17 00:00:00 2001 From: marcneuwirth Date: Tue, 28 Jun 2011 10:59:08 -0500 Subject: Datepicker: Added onSelect.apply() call to _setDate method if onSelect is defined. Fixed #6264 - Datepicker: onSelect does not fire when setDate is called --- tests/unit/datepicker/datepicker_options.js | 10 ++++++++++ ui/jquery.ui.datepicker.js | 8 ++++++++ 2 files changed, 18 insertions(+) (limited to 'ui') diff --git a/tests/unit/datepicker/datepicker_options.js b/tests/unit/datepicker/datepicker_options.js index a10d1ea45..107609174 100644 --- a/tests/unit/datepicker/datepicker_options.js +++ b/tests/unit/datepicker/datepicker_options.js @@ -469,6 +469,16 @@ test('setDate', function() { var dateAndTimeClone = new Date(2008, 3 - 1, 28, 1, 11, 0); inp.datepicker('setDate', dateAndTimeToSet); equals(dateAndTimeToSet.getTime(), dateAndTimeClone.getTime(), 'Date object passed should not be changed by setDate'); + // Test onSelect callback is executed when using setDate + inp.datepicker('destroy'); + var testDate = null; + inp.datepicker({ + onSelect: function(dateText, inst) { + testDate = new Date(dateText); + } + }); + inp.datepicker('setDate', date2); + equals(date2.getTime(), testDate.getTime(), 'onSelect is called after setDate'); }); test('altField', function() { diff --git a/ui/jquery.ui.datepicker.js b/ui/jquery.ui.datepicker.js index 442621e0d..dda8585fd 100644 --- a/ui/jquery.ui.datepicker.js +++ b/ui/jquery.ui.datepicker.js @@ -1399,6 +1399,14 @@ $.extend(Datepicker.prototype, { if (inst.input) { inst.input.val(clear ? '' : this._formatDate(inst)); } + + var onSelect = this._get(inst, 'onSelect'); + if (onSelect) { + var dateStr = this._formatDate(inst); + + // trigger custom callback + onSelect.apply((inst.input ? inst.input[0] : null), [dateStr, inst]); + } }, /* Retrieve the date(s) directly. */ -- cgit v1.2.3 From 76e2b98a312cfab3d754aac5068ad965e544840c Mon Sep 17 00:00:00 2001 From: Philip Graham Date: Tue, 28 Jun 2011 16:40:28 +0000 Subject: Updated guard against unparsed characters to allow extra characters as long as they are separated from the date by whitespace. This maintains compatibility with timepicker extensions. Fixes #7244 - Datepicker: parseDate() does not throw an exception for long years --- tests/unit/datepicker/datepicker_tickets.js | 14 ++++++++++++-- ui/jquery.ui.datepicker.js | 5 ++++- 2 files changed, 16 insertions(+), 3 deletions(-) (limited to 'ui') diff --git a/tests/unit/datepicker/datepicker_tickets.js b/tests/unit/datepicker/datepicker_tickets.js index d5249f905..10647eb13 100644 --- a/tests/unit/datepicker/datepicker_tickets.js +++ b/tests/unit/datepicker/datepicker_tickets.js @@ -30,12 +30,22 @@ test('Ticket 6827: formatDate day of year calculation is wrong during day lights }); test('Ticket #7244: date parser does not fail when too many numbers are passed into the date function', function() { - expect(1); + var date; try{ - var date = $.datepicker.parseDate('dd/mm/yy', '18/04/19881'); + date = $.datepicker.parseDate('dd/mm/yy', '18/04/19881'); + ok(false, "Did not properly detect an invalid date"); }catch(e){ ok("invalid date detected"); } + + try { + date = $.datepicker.parseDate('dd/mm/yy', '18/04/1988 @ 2:43 pm'); + equal(date.getDate(), 18); + equal(date.getMonth(), 3); + equal(date.getFullYear(), 1988); + } catch(e) { + ok(false, "Did not properly parse date with extra text separated by whitespace"); + } }); })(jQuery); diff --git a/ui/jquery.ui.datepicker.js b/ui/jquery.ui.datepicker.js index 1d3de7740..45107c969 100644 --- a/ui/jquery.ui.datepicker.js +++ b/ui/jquery.ui.datepicker.js @@ -1095,7 +1095,10 @@ $.extend(Datepicker.prototype, { } } if (iValue < value.length){ - throw "Extra/unparsed characters found in date: " + value.substring(iValue); + var extra = value.substr(iValue); + if (!/^\s+/.test(extra)) { + throw "Extra/unparsed characters found in date: " + extra; + } } if (year == -1) year = new Date().getFullYear(); -- cgit v1.2.3 From 5d2b6837612c0cf6195092c9b223a3a982e67fb5 Mon Sep 17 00:00:00 2001 From: kborchers Date: Tue, 5 Jul 2011 10:02:33 -0500 Subject: Menu: Changed left and right methods to collapse and expand respectively. --- ui/jquery.ui.menu.js | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) (limited to 'ui') diff --git a/ui/jquery.ui.menu.js b/ui/jquery.ui.menu.js index 7dd1a9ce0..b93c95531 100644 --- a/ui/jquery.ui.menu.js +++ b/ui/jquery.ui.menu.js @@ -98,20 +98,20 @@ $.widget( "ui.menu", { event.stopImmediatePropagation(); break; case $.ui.keyCode.LEFT: - if (self.left( event )) { + if (self.collapse( event )) { event.stopImmediatePropagation(); } event.preventDefault(); break; case $.ui.keyCode.RIGHT: - if (self.right( event )) { + if (self.expand( event )) { event.stopImmediatePropagation(); } event.preventDefault(); break; case $.ui.keyCode.ENTER: if ( self.active.children( "a[aria-haspopup='true']" ).length ) { - if ( self.right( event ) ) { + if ( self.expand( event ) ) { event.stopImmediatePropagation(); } } @@ -122,7 +122,7 @@ $.widget( "ui.menu", { event.preventDefault(); break; case $.ui.keyCode.ESCAPE: - if ( self.left( event ) ) { + if ( self.collapse( event ) ) { event.stopImmediatePropagation(); } event.preventDefault(); @@ -344,7 +344,7 @@ $.widget( "ui.menu", { .removeClass( "ui-state-active" ); }, - left: function( event ) { + collapse: function( event ) { var newItem = this.active && this.active.parents("li:not(.ui-menubar-item)").first(); if ( newItem && newItem.length ) { this.active.parent() @@ -356,7 +356,7 @@ $.widget( "ui.menu", { } }, - right: function( event ) { + expand: function( event ) { var self = this, newItem = this.active && this.active.children("ul").children("li").first(); -- cgit v1.2.3 From 40aa8f57151b0a01f33389482e5676725fd50ae7 Mon Sep 17 00:00:00 2001 From: kborchers Date: Thu, 7 Jul 2011 09:29:50 -0500 Subject: Menubar: Added the autoExpand option and modified the default demo to show functionality --- demos/menubar/default.html | 1 + ui/jquery.ui.menubar.js | 23 ++++++++++++++++++++++- 2 files changed, 23 insertions(+), 1 deletion(-) (limited to 'ui') diff --git a/demos/menubar/default.html b/demos/menubar/default.html index 57a3209ce..6bd67b64a 100644 --- a/demos/menubar/default.html +++ b/demos/menubar/default.html @@ -23,6 +23,7 @@ }); $(".menubar-icons").menubar({ + autoExpand: true, menuIcon: true, buttons: true, position: { diff --git a/ui/jquery.ui.menubar.js b/ui/jquery.ui.menubar.js index 39e75924e..3df6d9a53 100644 --- a/ui/jquery.ui.menubar.js +++ b/ui/jquery.ui.menubar.js @@ -20,6 +20,7 @@ $.widget( "ui.menubar", { version: "@VERSION", options: { + autoExpand: false, buttons: false, menuIcon: false, position: { @@ -89,7 +90,11 @@ $.widget( "ui.menubar", { that._close(); return; } - if ( ( that.open && event.type == "mouseenter" ) || event.type == "click" ) { + if ( ( that.open && event.type == "mouseenter" ) || event.type == "click" || that.options.autoExpand ) { + if( that.options.autoExpand ) { + clearTimeout( that.timer ); + } + that._open( event, menu ); } }) @@ -115,6 +120,22 @@ $.widget( "ui.menubar", { .attr( "role", "menuitem" ) .attr( "aria-haspopup", "true" ) .wrapInner( "" ); + + if ( that.options.autoExpand ) { + input.bind( "mouseleave.menubar", function( event ) { + that.timer = setTimeout( function() { + that._close(); + }, 150 ); + }); + menu.bind( "mouseleave.menubar", function( event ) { + that.timer = setTimeout( function() { + that._close(); + }, 150 ); + }) + .bind( "mouseenter.menubar", function( event ) { + clearTimeout( that.timer ); + }); + } // TODO review if these options are a good choice, maybe they can be merged if ( that.options.menuIcon ) { -- cgit v1.2.3 From d5452c0ec27219c3564522b852f83ca9757bed84 Mon Sep 17 00:00:00 2001 From: Benjamin Sterling Date: Mon, 11 Jul 2011 19:49:56 -0400 Subject: Position: Add flip-classes. Fixes #5937 - Position: Add ability to determine if the element is flipped via css --- demos/position/default.html | 12 ++++ tests/unit/position/position_core.js | 81 ++++++++++++++++++++++++ tests/unit/position/position_core_within.js | 95 +++++++++++++++++++++++++++++ ui/jquery.ui.position.js | 18 +++++- 4 files changed, 205 insertions(+), 1 deletion(-) (limited to 'ui') diff --git a/demos/position/default.html b/demos/position/default.html index 87fc8e38a..60b8b39f9 100644 --- a/demos/position/default.html +++ b/demos/position/default.html @@ -30,6 +30,18 @@ background-color: #bcd5e6; text-align: center; } + div.ui-flipped-top { + border-top: 3px solid #000000; + } + div.ui-flipped-bottom { + border-bottom: 3px solid #000000; + } + div.ui-flipped-left { + border-left: 3px solid #000000; + } + div.ui-flipped-right { + border-right: 3px solid #000000; + } select, input { margin-left: 15px; } diff --git a/tests/unit/position/position_core.js b/tests/unit/position/position_core.js index bd8e58612..fd6e643e9 100644 --- a/tests/unit/position/position_core.js +++ b/tests/unit/position/position_core.js @@ -435,6 +435,87 @@ test( "collision: flip, with margin", function() { }, { top: 0, left: 0 }, "right bottom" ); }); +test( "addClass: flipped left", function() { + var elem = $( "#elx" ).position( { + my: "left center", + of: window, + collision: "flip", + at: "right center" + }); + + same( elem.hasClass( 'ui-flipped-left' ), true, 'Has ui-flipped-left class' ); + + elem.position( { + my: "right center", + of: window, + collision: "flip", + at: "left center" + }) + + same( elem.hasClass( 'ui-flipped-left' ), false, 'Removed ui-flipped-left class' ); +}); + +test( "addClass: flipped top", function() { + var elem = $( "#elx" ).position( { + my: "left top", + of: window, + collision: "flip", + at: "right bottom" + }); + + same( elem.hasClass( 'ui-flipped-top' ), true, 'Has ui-flipped-top class' ); + + elem.position( { + my: "left bottom", + of: window, + collision: "flip", + at: "right top" + }); + + same( elem.hasClass( 'ui-flipped-top' ), false, 'Removed ui-flipped-top class' ); +}); + +test( "addClass: flipped right", function() { + var elem = $( "#elx" ).position( { + my: "right center", + of: window, + collision: "flip", + at: "left center" + }); + + same( elem.hasClass( 'ui-flipped-right' ), true, 'Has ui-flipped-right class' ); + + elem.position( { + my: "left center", + of: window, + collision: "flip", + at: "right center" + }); + + same( elem.hasClass( 'ui-flipped-right' ), false, 'Removed ui-flipped-right class' ); + +}); + +test( "addClass: flipped bottom", function() { + var elem = $( "#elx" ).position( { + my: "left bottom", + of: window, + collision: "flip", + at: "right top" + }); + + same( elem.hasClass( 'ui-flipped-bottom' ), true, 'Has ui-flipped-bottom class' ); + + elem.position( { + my: "left top", + of: window, + collision: "flip", + at: "right bottom" + }); + + same( elem.hasClass( 'ui-flipped-bottom' ), false, 'Removed ui-flipped-bottom class' ); +}); + //test( "bug #5280: consistent results (avoid fractional values)", function() { // var wrapper = $( "#bug-5280" ), // elem = wrapper.children(), diff --git a/tests/unit/position/position_core_within.js b/tests/unit/position/position_core_within.js index 567c17192..bfb913335 100644 --- a/tests/unit/position/position_core_within.js +++ b/tests/unit/position/position_core_within.js @@ -438,4 +438,99 @@ test( "collision: flip, with margin", function() { }, { top: addTop + 0, left: addLeft + 0 }, "right bottom" ); }); +test( "addClass: flipped left", function() { + var within = $("#within-container"); + + var elem = $( "#elx" ).position( { + my: "left center", + of: within[0], + within: within, + collision: "flip", + at: "right center" + }); + + same( elem.hasClass( 'ui-flipped-left' ), true, 'Has ui-flipped-left class' ); + + elem.position( { + my: "right center", + of: within[0], + within: within, + collision: "flip", + at: "left center" + }) + + same( elem.hasClass( 'ui-flipped-left' ), false, 'Removed ui-flipped-left class' ); +}); + +test( "addClass: flipped top", function() { + var within = $("#within-container"); + + var elem = $( "#elx" ).position( { + my: "left top", + of: within[0], + within: within, + collision: "flip", + at: "right bottom" + }); + + same( elem.hasClass( 'ui-flipped-top' ), true, 'Has ui-flipped-top class' ); + + elem.position( { + my: "left bottom", + of: within[0], + within: within, + collision: "flip", + at: "right top" + }); + + same( elem.hasClass( 'ui-flipped-top' ), false, 'Removed ui-flipped-top class' ); +}); + +test( "addClass: flipped right", function() { + var within = $("#within-container"); + + var elem = $( "#elx" ).position( { + my: "right center", + of: within[0], + within: within, + collision: "flip", + at: "left center" + }); + + same( elem.hasClass( 'ui-flipped-right' ), true, 'Has ui-flipped-right class' ); + + elem.position( { + my: "left center", + of: within[0], + within: within, + collision: "flip", + at: "right center" + }); + + same( elem.hasClass( 'ui-flipped-right' ), false, 'Removed ui-flipped-right class' ); + +}); + +test( "addClass: flipped bottom", function() { + var within = $("#within-container"); + + var elem = $( "#elx" ).position( { + my: "left bottom", + of: window, + collision: "flip", + at: "right top" + }); + + same( elem.hasClass( 'ui-flipped-bottom' ), true, 'Has ui-flipped-bottom class' ); + + elem.position( { + my: "left top", + of: window, + collision: "flip", + at: "right bottom" + }); + + same( elem.hasClass( 'ui-flipped-bottom' ), false, 'Removed ui-flipped-bottom class' ); +}); + }( jQuery ) ); diff --git a/ui/jquery.ui.position.js b/ui/jquery.ui.position.js index 3bae0d010..23a98b491 100644 --- a/ui/jquery.ui.position.js +++ b/ui/jquery.ui.position.js @@ -204,7 +204,8 @@ $.fn.position = function( options ) { offset: [ atOffset[ 0 ] + myOffset[ 0 ], atOffset [ 1 ] + myOffset[ 1 ] ], my: options.my, at: options.at, - within: within + within: within, + elem : elem }); } }); @@ -265,6 +266,9 @@ $.ui.position = { return; } + data.elem + .removeClass( "ui-flipped-left ui-flipped-right" ); + var within = data.within, win = $( window ), isWindow = $.isWindow( data.within[0] ), @@ -283,6 +287,10 @@ $.ui.position = { -data.targetWidth, offset = -2 * data.offset[ 0 ]; if ( overLeft < 0 || overRight > 0 ) { + + data.elem + .addClass( "ui-flipped-" + ( overLeft < 0 ? "right" : "left" ) ); + position.left += myOffset + atOffset + offset; } }, @@ -290,6 +298,10 @@ $.ui.position = { if ( data.at[ 1 ] === center ) { return; } + + data.elem + .removeClass( "ui-flipped-top ui-flipped-bottom" ); + var within = data.within, win = $( window ), isWindow = $.isWindow( data.within[0] ), @@ -308,6 +320,10 @@ $.ui.position = { -data.targetHeight, offset = -2 * data.offset[ 1 ]; if ( overTop < 0 || overBottom > 0 ) { + + data.elem + .addClass( "ui-flipped-" + ( overTop < 0 ? "bottom" : "top" ) ); + position.top += myOffset + atOffset + offset; } } -- cgit v1.2.3 From 0dc4a487628c674868f786db73db7f0c0c2b02b2 Mon Sep 17 00:00:00 2001 From: Scott González Date: Tue, 12 Jul 2011 09:16:03 -0400 Subject: Dialog: Append the dialog to the body early to make sure styles from the classes get applied. --- ui/jquery.ui.dialog.js | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) (limited to 'ui') diff --git a/ui/jquery.ui.dialog.js b/ui/jquery.ui.dialog.js index 0eba39842..e9cf67540 100644 --- a/ui/jquery.ui.dialog.js +++ b/ui/jquery.ui.dialog.js @@ -108,7 +108,8 @@ $.widget("ui.dialog", { }) .mousedown(function( event ) { self.moveToTop( false, event ); - }), + }) + .appendTo( "body" ), uiDialogContent = self.element .show() @@ -155,8 +156,6 @@ $.widget("ui.dialog", { self._createButtons( options.buttons ); self._isOpen = false; - uiDialog.appendTo( document.body ); - if ( $.fn.bgiframe ) { uiDialog.bgiframe(); } -- cgit v1.2.3 From 9f5050ee063ed4c9e6191fc58ef151254cf54e76 Mon Sep 17 00:00:00 2001 From: kborchers Date: Sat, 9 Jul 2011 23:30:35 -0500 Subject: Menu: Added close on click outside using technique from popup --- ui/jquery.ui.menu.js | 8 ++++++++ 1 file changed, 8 insertions(+) (limited to 'ui') diff --git a/ui/jquery.ui.menu.js b/ui/jquery.ui.menu.js index b93c95531..770e0252a 100644 --- a/ui/jquery.ui.menu.js +++ b/ui/jquery.ui.menu.js @@ -170,6 +170,14 @@ $.widget( "ui.menu", { } } }); + + this._bind( document, { + click: function( event ) { + if ( !$( event.target ).closest( ".ui-menu" ).length ) { + this.closeAll(); + } + } + }); }, _destroy: function() { -- cgit v1.2.3 From 0080f2d5813747cbbe44021197e352564e02b782 Mon Sep 17 00:00:00 2001 From: Scott González Date: Tue, 12 Jul 2011 11:36:34 -0400 Subject: Use .attr() for boolean ARIA attributes. --- tests/unit/accordion/accordion_core.js | 16 ++++++------ tests/unit/progressbar/progressbar_core.js | 4 +-- ui/jquery.ui.accordion.js | 39 +++++++++++++++--------------- ui/jquery.ui.autocomplete.js | 6 ++--- ui/jquery.ui.button.js | 16 ++++++------ ui/jquery.ui.menu.js | 24 +++++++++--------- ui/jquery.ui.menubar.js | 30 +++++++++++------------ ui/jquery.ui.popup.js | 16 ++++++------ ui/jquery.ui.widget.js | 4 +-- 9 files changed, 77 insertions(+), 78 deletions(-) (limited to 'ui') diff --git a/tests/unit/accordion/accordion_core.js b/tests/unit/accordion/accordion_core.js index 7bf71c31b..280339c26 100644 --- a/tests/unit/accordion/accordion_core.js +++ b/tests/unit/accordion/accordion_core.js @@ -39,15 +39,15 @@ test( "accessibility", function () { equals( element.attr( "role" ), "tablist", "main role" ); equals( headers.attr( "role" ), "tab", "tab roles" ); equals( headers.next().attr( "role" ), "tabpanel", "tabpanel roles" ); - equals( headers.eq( 1 ).prop( "aria-expanded" ), true, "active tab has aria-expanded" ); - equals( headers.eq( 0 ).prop( "aria-expanded" ), false, "inactive tab has aria-expanded" ); - equals( headers.eq( 1 ).prop( "aria-selected" ), true, "active tab has aria-selected" ); - equals( headers.eq( 0 ).prop( "aria-selected" ), false, "inactive tab has aria-selected" ); + equals( headers.eq( 1 ).attr( "aria-expanded" ), "true", "active tab has aria-expanded" ); + equals( headers.eq( 0 ).attr( "aria-expanded" ), "false", "inactive tab has aria-expanded" ); + equals( headers.eq( 1 ).attr( "aria-selected" ), "true", "active tab has aria-selected" ); + equals( headers.eq( 0 ).attr( "aria-selected" ), "false", "inactive tab has aria-selected" ); element.accordion( "option", "active", 0 ); - equals( headers.eq( 0 ).prop( "aria-expanded" ), true, "newly active tab has aria-expanded" ); - equals( headers.eq( 1 ).prop( "aria-expanded" ), false, "newly inactive tab has aria-expanded" ); - equals( headers.eq( 0 ).prop( "aria-selected" ), true, "active tab has aria-selected" ); - equals( headers.eq( 1 ).prop( "aria-selected" ), false, "inactive tab has aria-selected" ); + equals( headers.eq( 0 ).attr( "aria-expanded" ), "true", "newly active tab has aria-expanded" ); + equals( headers.eq( 1 ).attr( "aria-expanded" ), "false", "newly inactive tab has aria-expanded" ); + equals( headers.eq( 0 ).attr( "aria-selected" ), "true", "active tab has aria-selected" ); + equals( headers.eq( 1 ).attr( "aria-selected" ), "false", "inactive tab has aria-selected" ); }); }( jQuery ) ); diff --git a/tests/unit/progressbar/progressbar_core.js b/tests/unit/progressbar/progressbar_core.js index 2380061db..a499d858c 100644 --- a/tests/unit/progressbar/progressbar_core.js +++ b/tests/unit/progressbar/progressbar_core.js @@ -19,10 +19,10 @@ test("accessibility", function() { el.progressbar("value", 77); equals(el.attr("aria-valuenow"), 77, "aria-valuenow"); el.progressbar("disable"); - equals(el.prop("aria-disabled"), true, "aria-disabled on"); + equals(el.attr("aria-disabled"), "true", "aria-disabled on"); el.progressbar("enable"); // FAIL: for some reason IE6 and 7 return a boolean false instead of the string - equals(el.prop("aria-disabled"), false, "aria-disabled off"); + equals(el.attr("aria-disabled"), "false", "aria-disabled off"); }); })(jQuery); diff --git a/ui/jquery.ui.accordion.js b/ui/jquery.ui.accordion.js index fc0ba3910..14b67586e 100644 --- a/ui/jquery.ui.accordion.js +++ b/ui/jquery.ui.accordion.js @@ -78,11 +78,11 @@ $.widget( "ui.accordion", { self.headers .not( self.active ) - .prop({ - "aria-expanded": false, - "aria-selected": false + .attr({ + "aria-expanded": "false", + "aria-selected": "false", + tabIndex: -1 }) - .attr( "tabIndex", -1 ) .next() .hide(); @@ -90,12 +90,11 @@ $.widget( "ui.accordion", { if ( !self.active.length ) { self.headers.eq( 0 ).attr( "tabIndex", 0 ); } else { - self.active - .prop({ - "aria-expanded": true, - "aria-selected": true - }) - .attr( "tabIndex", 0 ); + self.active.attr({ + "aria-expanded": "true", + "aria-selected": "true", + tabIndex: 0 + }); } // only need links in tab order for Safari @@ -135,8 +134,8 @@ $.widget( "ui.accordion", { .unbind( ".accordion" ) .removeClass( "ui-accordion-header ui-accordion-disabled ui-helper-reset ui-state-default ui-corner-all ui-state-active ui-state-disabled ui-corner-top" ) .removeAttr( "role" ) - .removeProp( "aria-expanded" ) - .removeProp( "aria-selected" ) + .removeAttr( "aria-expanded" ) + .removeAttr( "aria-selected" ) .removeAttr( "tabIndex" ) .find( "a" ) .removeAttr( "tabIndex" ) @@ -393,18 +392,18 @@ $.widget( "ui.accordion", { // TODO assert that the blur and focus triggers are really necessary, remove otherwise toHide.prev() - .prop({ - "aria-expanded": false, - "aria-selected": false + .attr({ + "aria-expanded": "false", + "aria-selected": "false", + tabIndex: -1 }) - .attr( "tabIndex", -1 ) .blur(); toShow.prev() - .prop({ - "aria-expanded": true, - "aria-selected": true + .attr({ + "aria-expanded": "true", + "aria-selected": "true", + tabIndex: 0 }) - .attr( "tabIndex", 0 ) .focus(); }, diff --git a/ui/jquery.ui.autocomplete.js b/ui/jquery.ui.autocomplete.js index 3f5e2d10a..59caf625d 100644 --- a/ui/jquery.ui.autocomplete.js +++ b/ui/jquery.ui.autocomplete.js @@ -59,9 +59,9 @@ $.widget( "ui.autocomplete", { // TODO verify these actually work as intended .attr({ role: "textbox", - "aria-autocomplete": "list" + "aria-autocomplete": "list", + "aria-haspopup": "true" }) - .prop( "aria-haspopup", true ) .bind( "keydown.autocomplete", function( event ) { if ( self.options.disabled || self.element.prop( "readonly" ) ) { suppressKeyPress = true; @@ -268,7 +268,7 @@ $.widget( "ui.autocomplete", { .removeAttr( "autocomplete" ) .removeAttr( "role" ) .removeAttr( "aria-autocomplete" ) - .removeProp( "aria-haspopup" ); + .removeAttr( "aria-haspopup" ); this.menu.element.remove(); }, diff --git a/ui/jquery.ui.button.js b/ui/jquery.ui.button.js index 5f48f69a2..ad17ab0c1 100644 --- a/ui/jquery.ui.button.js +++ b/ui/jquery.ui.button.js @@ -147,7 +147,7 @@ $.widget( "ui.button", { return false; } $( this ).toggleClass( "ui-state-active" ); - self.buttonElement.prop( "aria-pressed", self.element[0].checked ); + self.buttonElement.attr( "aria-pressed", self.element[0].checked ); }); } else if ( this.type === "radio" ) { this.buttonElement.bind( "click.button", function() { @@ -155,7 +155,7 @@ $.widget( "ui.button", { return false; } $( this ).addClass( "ui-state-active" ); - self.buttonElement.prop( "aria-pressed", true ); + self.buttonElement.attr( "aria-pressed", "true" ); var radio = self.element[ 0 ]; radioGroup( radio ) @@ -164,7 +164,7 @@ $.widget( "ui.button", { return $( this ).button( "widget" )[ 0 ]; }) .removeClass( "ui-state-active" ) - .prop( "aria-pressed", false ); + .attr( "aria-pressed", "false" ); }); } else { this.buttonElement @@ -260,7 +260,7 @@ $.widget( "ui.button", { this.buttonElement .removeClass( baseClasses + " " + stateClasses + " " + typeClasses ) .removeAttr( "role" ) - .removeProp( "aria-pressed" ) + .removeAttr( "aria-pressed" ) .html( this.buttonElement.find(".ui-button-text").html() ); if ( !this.hasTitle ) { @@ -291,22 +291,22 @@ $.widget( "ui.button", { if ( $( this ).is( ":checked" ) ) { $( this ).button( "widget" ) .addClass( "ui-state-active" ) - .prop( "aria-pressed", true ); + .attr( "aria-pressed", "true" ); } else { $( this ).button( "widget" ) .removeClass( "ui-state-active" ) - .prop( "aria-pressed", false ); + .attr( "aria-pressed", "false" ); } }); } else if ( this.type === "checkbox" ) { if ( this.element.is( ":checked" ) ) { this.buttonElement .addClass( "ui-state-active" ) - .prop( "aria-pressed", true ); + .attr( "aria-pressed", "true" ); } else { this.buttonElement .removeClass( "ui-state-active" ) - .prop( "aria-pressed", false ); + .attr( "aria-pressed", "false" ); } } }, diff --git a/ui/jquery.ui.menu.js b/ui/jquery.ui.menu.js index 8045797ae..aa01e91b9 100644 --- a/ui/jquery.ui.menu.js +++ b/ui/jquery.ui.menu.js @@ -178,8 +178,8 @@ $.widget("ui.menu", { .removeAttr( "role" ) .removeAttr("tabIndex") .removeAttr( "aria-labelledby" ) - .removeProp( "aria-expanded" ) - .removeProp( "aria-hidden" ) + .removeAttr( "aria-expanded" ) + .removeAttr( "aria-hidden" ) .show(); //destroy menu items @@ -191,7 +191,7 @@ $.widget("ui.menu", { .removeClass( "ui-corner-all ui-state-hover" ) .removeAttr( "tabIndex" ) .removeAttr( "role" ) - .removeProp( "aria-haspopup" ) + .removeAttr( "aria-haspopup" ) .removeAttr( "id" ) .children(".ui-icon").remove(); }, @@ -203,9 +203,9 @@ $.widget("ui.menu", { .addClass( "ui-menu ui-widget ui-widget-content ui-corner-all" ) .attr("role", "menu") .hide() - .prop({ - "aria-hidden": true, - "aria-expanded": false + .attr({ + "aria-hidden": "true", + "aria-expanded": "false" }); // don't refresh list items that are already adapted @@ -222,7 +222,7 @@ $.widget("ui.menu", { submenus.each(function() { var menu = $(this); var item = menu.prev("a") - item.prop("aria-haspopup", true) + item.attr("aria-haspopup", "true") .prepend(''); menu.attr("aria-labelledby", item.attr("id")); }); @@ -290,19 +290,19 @@ $.widget("ui.menu", { _open: function(submenu) { clearTimeout(this.timer); - this.element.find(".ui-menu").not(submenu.parents()).hide().prop("aria-hidden", true); + this.element.find(".ui-menu").not(submenu.parents()).hide().attr("aria-hidden", "true"); var position = $.extend({}, { of: this.active }, $.type(this.options.position) == "function" ? this.options.position(this.active) : this.options.position ); - submenu.show().removeProp("aria-hidden").prop("aria-expanded", true).position(position); + submenu.show().removeAttr("aria-hidden").attr("aria-expanded", "true").position(position); }, closeAll: function() { this.element - .find("ul").hide().prop("aria-hidden", true).prop("aria-expanded", false).end() + .find("ul").hide().attr("aria-hidden", "true").attr("aria-expanded", "false").end() .find("a.ui-state-active").removeClass("ui-state-active"); this.blur(); this.activeMenu = this.element; @@ -310,14 +310,14 @@ $.widget("ui.menu", { _close: function() { this.active.parent() - .find("ul").hide().prop("aria-hidden", true).prop("aria-expanded", false).end() + .find("ul").hide().attr("aria-hidden", "true").attr("aria-expanded", "false").end() .find("a.ui-state-active").removeClass("ui-state-active"); }, left: function(event) { var newItem = this.active && this.active.parents("li:not(.ui-menubar-item)").first(); if (newItem && newItem.length) { - this.active.parent().prop("aria-hidden", true).prop("aria-expanded", false).hide(); + this.active.parent().attr("aria-hidden", "true").attr("aria-expanded", "false").hide(); this.focus(event, newItem); return true; } diff --git a/ui/jquery.ui.menubar.js b/ui/jquery.ui.menubar.js index 2ce59bd6c..0f80f4fda 100644 --- a/ui/jquery.ui.menubar.js +++ b/ui/jquery.ui.menubar.js @@ -48,9 +48,9 @@ $.widget( "ui.menubar", { } }) .hide() - .prop({ - "aria-hidden": true, - "aria-expanded": false + .attr({ + "aria-hidden": "true", + "aria-expanded": "false" }) .bind( "keydown.menubar", function( event ) { var menu = $( this ); @@ -108,7 +108,7 @@ $.widget( "ui.menubar", { }) .addClass( "ui-button ui-widget ui-button-text-only ui-menubar-link" ) .attr( "role", "menuitem" ) - .prop( "aria-haspopup", true ) + .attr( "aria-haspopup", "true" ) .wrapInner( "" ); // TODO review if these options are a good choice, maybe they can be merged @@ -158,7 +158,7 @@ $.widget( "ui.menubar", { .unbind( ".menubar" ) .removeClass( "ui-button ui-widget ui-button-text-only ui-menubar-link ui-state-default" ) .removeAttr( "role" ) - .removeProp( "aria-haspopup" ) + .removeAttr( "aria-haspopup" ) // TODO unwrap? .children( "span.ui-button-text" ).each(function( i, e ) { var item = $( this ); @@ -170,8 +170,8 @@ $.widget( "ui.menubar", { this.element.find( ":ui-menu" ) .menu( "destroy" ) .show() - .removeProp( "aria-hidden" ) - .removeProp( "aria-expanded" ) + .removeAttr( "aria-hidden" ) + .removeAttr( "aria-expanded" ) .removeAttr( "tabindex" ) .unbind( ".menubar" ); }, @@ -182,9 +182,9 @@ $.widget( "ui.menubar", { this.active .menu( "closeAll" ) .hide() - .prop({ - "aria-hidden": true, - "aria-expanded": false + .attr({ + "aria-hidden": "true", + "aria-expanded": "false" }); this.active .prev() @@ -204,9 +204,9 @@ $.widget( "ui.menubar", { this.active .menu( "closeAll" ) .hide() - .prop({ - "aria-hidden": true, - "aria-expanded": false + .attr({ + "aria-hidden": "true", + "aria-expanded": "false" }); this.active .prev() @@ -221,8 +221,8 @@ $.widget( "ui.menubar", { at: "left bottom", of: button }) - .removeProp( "aria-hidden" ) - .prop( "aria-expanded", true ) + .removeAttr( "aria-hidden" ) + .attr( "aria-expanded", "true" ) .menu("focus", event, menu.children( "li" ).first() ) // TODO need a comment here why both events are triggered .focus() diff --git a/ui/jquery.ui.popup.js b/ui/jquery.ui.popup.js index 4c9f20c06..b506a641f 100644 --- a/ui/jquery.ui.popup.js +++ b/ui/jquery.ui.popup.js @@ -41,7 +41,7 @@ $.widget( "ui.popup", { } this.options.trigger - .prop( "aria-haspopup", true ) + .attr( "aria-haspopup", "true" ) .attr( "aria-owns", this.element.attr( "id" ) ); this.element @@ -118,11 +118,11 @@ $.widget( "ui.popup", { this.element .show() .removeClass( "ui-popup" ) - .removeProp( "aria-hidden" ) - .removeProp( "aria-expanded" ); + .removeAttr( "aria-hidden" ) + .removeAttr( "aria-expanded" ); this.options.trigger - .removeProp( "aria-haspopup" ) + .removeAttr( "aria-haspopup" ) .removeAttr( "aria-owns" ); if ( this.generatedId ) { @@ -140,8 +140,8 @@ $.widget( "ui.popup", { this.element .show() - .prop( "aria-hidden", false ) - .prop( "aria-expanded", true ) + .attr( "aria-hidden", "false" ) + .attr( "aria-expanded", "true" ) .position( position ) // TODO find a focussable child, otherwise put focus on element, add tabIndex=0 if not focussable .focus(); @@ -160,8 +160,8 @@ $.widget( "ui.popup", { close: function( event ) { this.element .hide() - .prop( "aria-hidden", true ) - .prop( "aria-expanded", false ); + .attr( "aria-hidden", "true" ) + .attr( "aria-expanded", "false" ); this.options.trigger.attr("tabindex", 0); diff --git a/ui/jquery.ui.widget.js b/ui/jquery.ui.widget.js index 8079f0357..00bc07c4f 100644 --- a/ui/jquery.ui.widget.js +++ b/ui/jquery.ui.widget.js @@ -211,7 +211,7 @@ $.Widget.prototype = { .removeData( this.widgetName ); this.widget() .unbind( "." + this.widgetName ) - .removeProp( "aria-disabled" ) + .removeAttr( "aria-disabled" ) .removeClass( this.widgetBaseClass + "-disabled " + "ui-state-disabled" ); @@ -276,7 +276,7 @@ $.Widget.prototype = { if ( key === "disabled" ) { this.widget() .toggleClass( this.widgetBaseClass + "-disabled ui-state-disabled", !!value ) - .prop( "aria-disabled", value ); + .attr( "aria-disabled", value ); this.hoverable.removeClass( "ui-state-hover" ); this.focusable.removeClass( "ui-state-focus" ); } -- cgit v1.2.3 From 06676f46966d43b6ba169363d751074645c8c303 Mon Sep 17 00:00:00 2001 From: Scott González Date: Tue, 12 Jul 2011 20:50:24 -0400 Subject: Accordion: Fixed key handling. --- ui/jquery.ui.accordion.js | 12 +++++++----- 1 file changed, 7 insertions(+), 5 deletions(-) (limited to 'ui') diff --git a/ui/jquery.ui.accordion.js b/ui/jquery.ui.accordion.js index 7602ae9bc..acd19c981 100644 --- a/ui/jquery.ui.accordion.js +++ b/ui/jquery.ui.accordion.js @@ -162,6 +162,13 @@ $.widget( "ui.accordion", { return; } + if ( key === "event" ) { + if ( this.options.event ) { + this.headers.unbind( this.options.event + ".accordion", this._eventHandler ); + } + this._setupEvents( value ); + } + this._super( "_setOption", key, value ); // setting collapsible: false while collapsed; open first panel @@ -169,10 +176,6 @@ $.widget( "ui.accordion", { this._activate( 0 ); } - if ( key === "event" ) { - this._setupEvents( value ); - } - if ( key === "icons" ) { this._destroyIcons(); if ( value ) { @@ -294,7 +297,6 @@ $.widget( "ui.accordion", { }, _setupEvents: function( event ) { - this.headers.unbind( ".accordion" ); if ( event ) { this.headers.bind( event.split( " " ).join( ".accordion " ) + ".accordion", $.proxy( this, "_eventHandler" ) ); -- cgit v1.2.3 From 7856b264a297d78762f599611580804b92afd1c0 Mon Sep 17 00:00:00 2001 From: Jörn Zaefferer Date: Wed, 13 Jul 2011 11:03:25 -0400 Subject: Menubar: Trigger select event after running all other methods. Allows the select-handler to destroy the widget without errors. --- demos/menubar/default.html | 14 ++++++++------ ui/jquery.ui.menubar.js | 6 +++--- 2 files changed, 11 insertions(+), 9 deletions(-) (limited to 'ui') diff --git a/demos/menubar/default.html b/demos/menubar/default.html index 6bd67b64a..adee4afc9 100644 --- a/demos/menubar/default.html +++ b/demos/menubar/default.html @@ -13,13 +13,17 @@ diff --git a/ui/jquery.ui.menubar.js b/ui/jquery.ui.menubar.js index 3df6d9a53..e28ea3e3c 100644 --- a/ui/jquery.ui.menubar.js +++ b/ui/jquery.ui.menubar.js @@ -49,10 +49,10 @@ $.widget( "ui.menubar", { }, select: function( event, ui ) { ui.item.parents( "ul.ui-menu:last" ).hide(); - that._trigger( "select", event, ui ); that._close(); // TODO what is this targetting? there's probably a better way to access it $(event.target).prev().focus(); + that._trigger( "select", event, ui ); } }) .hide() @@ -94,7 +94,7 @@ $.widget( "ui.menubar", { if( that.options.autoExpand ) { clearTimeout( that.timer ); } - + that._open( event, menu ); } }) @@ -120,7 +120,7 @@ $.widget( "ui.menubar", { .attr( "role", "menuitem" ) .attr( "aria-haspopup", "true" ) .wrapInner( "" ); - + if ( that.options.autoExpand ) { input.bind( "mouseleave.menubar", function( event ) { that.timer = setTimeout( function() { -- cgit v1.2.3 From bc93b3ff080160e4e8e7a035e2e4421d1521e224 Mon Sep 17 00:00:00 2001 From: kborchers Date: Wed, 13 Jul 2011 15:33:17 -0500 Subject: Menu: Remove the ui-state-active class from the siblings of the newly activated menu item without a delay to fix a bug where mouseover of a menu item directly adjacent to the active item would cause a 1 pixel jump due to both items having a class with a border (ui-state-active and ui-state-focus) --- ui/jquery.ui.menu.js | 2 ++ 1 file changed, 2 insertions(+) (limited to 'ui') diff --git a/ui/jquery.ui.menu.js b/ui/jquery.ui.menu.js index 770e0252a..5f9de6134 100644 --- a/ui/jquery.ui.menu.js +++ b/ui/jquery.ui.menu.js @@ -58,6 +58,8 @@ $.widget( "ui.menu", { } var target = $( event.target ).closest( ".ui-menu-item" ); if ( target.length ) { + //Remove ui-state-active class from siblings of the newly focused menu item to avoid a jump caused by adjacent elements both having a class with a border + target.siblings().children( ".ui-state-active" ).removeClass( "ui-state-active" ); self.focus( event, target ); } }) -- cgit v1.2.3 From 2803417dc44c6147cee14f46ba0ccfa29218a257 Mon Sep 17 00:00:00 2001 From: Jörn Zaefferer Date: Wed, 13 Jul 2011 18:06:16 -0400 Subject: Tooltip: Handle ESCAPE key event to close tooltip when target has focus. --- ui/jquery.ui.tooltip.js | 11 +++++++++-- 1 file changed, 9 insertions(+), 2 deletions(-) (limited to 'ui') diff --git a/ui/jquery.ui.tooltip.js b/ui/jquery.ui.tooltip.js index f19061bc3..5e32459fc 100644 --- a/ui/jquery.ui.tooltip.js +++ b/ui/jquery.ui.tooltip.js @@ -148,7 +148,14 @@ $.widget( "ui.tooltip", { this._bind( target, { mouseleave: "close", - blur: "close" + blur: "close", + keyup: function( event ) { + if ( event.keyCode == $.ui.keyCode.ESCAPE ) { + var fakeEvent = $.Event(event); + fakeEvent.currentTarget = target[0]; + this.close( fakeEvent, true ); + } + } }); }, @@ -176,7 +183,7 @@ $.widget( "ui.tooltip", { delete that.tooltips[ this.id ]; }); - target.unbind( "mouseleave.tooltip blur.tooltip" ); + target.unbind( "mouseleave.tooltip blur.tooltip keyup.tooltip" ); this._trigger( "close", event, { tooltip: tooltip } ); }, -- cgit v1.2.3 From f41d2378f95bc88165833487a923f90061d3f138 Mon Sep 17 00:00:00 2001 From: kborchers Date: Wed, 13 Jul 2011 18:19:02 -0500 Subject: Menu: Check if submenu is already open and if so, don't call open again. Fixes Firefox bug where a mouseover of an icon adjusted the position of a submenu by a half pixel --- ui/jquery.ui.menu.js | 4 ++++ 1 file changed, 4 insertions(+) (limited to 'ui') diff --git a/ui/jquery.ui.menu.js b/ui/jquery.ui.menu.js index 5f9de6134..83ff1b949 100644 --- a/ui/jquery.ui.menu.js +++ b/ui/jquery.ui.menu.js @@ -301,6 +301,10 @@ $.widget( "ui.menu", { _startOpening: function( submenu ) { clearTimeout( this.timer ); + + //Don't open if already open fixes a Firefox bug that caused a .5 pixel shift in the submenu position when mousing over the carat icon + if ( submenu.attr( "aria-hidden" ) !== "true" ) return; + var self = this; self.timer = setTimeout( function() { self._close(); -- cgit v1.2.3 From 11d24ee84cc29adf7349b08031146936cf4dd9a9 Mon Sep 17 00:00:00 2001 From: Jörn Zaefferer Date: Thu, 14 Jul 2011 11:10:28 -0400 Subject: Menu: Fix formatting and whitespace (was supposed to update previous commit) --- ui/jquery.ui.menu.js | 11 +++++++---- 1 file changed, 7 insertions(+), 4 deletions(-) (limited to 'ui') diff --git a/ui/jquery.ui.menu.js b/ui/jquery.ui.menu.js index 83ff1b949..66601ef38 100644 --- a/ui/jquery.ui.menu.js +++ b/ui/jquery.ui.menu.js @@ -301,10 +301,13 @@ $.widget( "ui.menu", { _startOpening: function( submenu ) { clearTimeout( this.timer ); - - //Don't open if already open fixes a Firefox bug that caused a .5 pixel shift in the submenu position when mousing over the carat icon - if ( submenu.attr( "aria-hidden" ) !== "true" ) return; - + + // Don't open if already open fixes a Firefox bug that caused a .5 pixel + // shift in the submenu position when mousing over the carat icon + if ( submenu.attr( "aria-hidden" ) !== "true" ) { + return; + } + var self = this; self.timer = setTimeout( function() { self._close(); -- cgit v1.2.3 From 6d0859f71600c3776913f90a39e9cfe086454e11 Mon Sep 17 00:00:00 2001 From: kborchers Date: Thu, 14 Jul 2011 10:20:47 -0500 Subject: Menu: Changed closeAll to collapseAll and updated in Menubar, also updated a reference to left in Menubar to collapse. --- ui/jquery.ui.menu.js | 8 ++++---- ui/jquery.ui.menubar.js | 6 +++--- 2 files changed, 7 insertions(+), 7 deletions(-) (limited to 'ui') diff --git a/ui/jquery.ui.menu.js b/ui/jquery.ui.menu.js index 66601ef38..f6012de4f 100644 --- a/ui/jquery.ui.menu.js +++ b/ui/jquery.ui.menu.js @@ -176,7 +176,7 @@ $.widget( "ui.menu", { this._bind( document, { click: function( event ) { if ( !$( event.target ).closest( ".ui-menu" ).length ) { - this.closeAll(); + this.collapseAll(); } } }); @@ -336,7 +336,7 @@ $.widget( "ui.menu", { .position( position ); }, - closeAll: function() { + collapseAll: function() { this.element .find( "ul" ) .hide() @@ -466,11 +466,11 @@ $.widget( "ui.menu", { }, select: function( event ) { - // save active reference before closeAll triggers blur + // save active reference before collapseAll triggers blur var ui = { item: this.active }; - this.closeAll(); + this.collapseAll(); this._trigger( "select", event, ui ); } }); diff --git a/ui/jquery.ui.menubar.js b/ui/jquery.ui.menubar.js index e28ea3e3c..fd6d92d6b 100644 --- a/ui/jquery.ui.menubar.js +++ b/ui/jquery.ui.menubar.js @@ -151,7 +151,7 @@ $.widget( "ui.menubar", { }); that._bind( { keydown: function( event ) { - if ( event.keyCode == $.ui.keyCode.ESCAPE && that.active && that.active.menu( "left", event ) !== true ) { + if ( event.keyCode == $.ui.keyCode.ESCAPE && that.active && that.active.menu( "collapse", event ) !== true ) { var active = that.active; that.active.blur(); that._close( event ); @@ -206,7 +206,7 @@ $.widget( "ui.menubar", { if ( !this.active || !this.active.length ) return; this.active - .menu( "closeAll" ) + .menu( "collapseAll" ) .hide() .attr( "aria-hidden", "true" ) .attr( "aria-expanded", "false" ); @@ -226,7 +226,7 @@ $.widget( "ui.menubar", { // TODO refactor, almost the same as _close above, but don't remove tabIndex if ( this.active ) { this.active - .menu( "closeAll" ) + .menu( "collapseAll" ) .hide() .attr( "aria-hidden", "true" ) .attr( "aria-expanded", "false" ); -- cgit v1.2.3 From b8af0d1f7505dd5e56319a11bbd14f1e381b36b9 Mon Sep 17 00:00:00 2001 From: "Richard D. Worth" Date: Tue, 19 Jul 2011 07:59:21 -0400 Subject: Datepicker: show inline datepicker setting explicit display:block instead of using .show() in case it is disconnected. Fixed #7552 - A Datepicker created on a detached div has zero height --- .../visual/datepicker/datepicker_ticket_7552.html | 23 ++++++++++++++++++++++ ui/jquery.ui.datepicker.js | 4 +++- 2 files changed, 26 insertions(+), 1 deletion(-) create mode 100644 tests/visual/datepicker/datepicker_ticket_7552.html (limited to 'ui') diff --git a/tests/visual/datepicker/datepicker_ticket_7552.html b/tests/visual/datepicker/datepicker_ticket_7552.html new file mode 100644 index 000000000..a78a84818 --- /dev/null +++ b/tests/visual/datepicker/datepicker_ticket_7552.html @@ -0,0 +1,23 @@ + + + + + Datepicker Visual Test : Datepicker ticket #7552 + + + + + + + + + + +

#7552 - A Datepicker created on a detached div has zero height

+ + + diff --git a/ui/jquery.ui.datepicker.js b/ui/jquery.ui.datepicker.js index aeadde4ee..87f9bd950 100644 --- a/ui/jquery.ui.datepicker.js +++ b/ui/jquery.ui.datepicker.js @@ -285,7 +285,9 @@ $.extend(Datepicker.prototype, { if( inst.settings.disabled ) { this._disableDatepicker( target ); } - inst.dpDiv.show(); + // Set display:block in place of inst.dpDiv.show() which won't work on disconnected elements + // http://bugs.jqueryui.com/ticket/7552 - A Datepicker created on a detached div has zero height + inst.dpDiv.css( "display", "block" ); }, /* Pop-up the date picker in a "dialog" box. -- cgit v1.2.3 From 5002bf61855ffe365f759f0b2c484188bfe4e1d6 Mon Sep 17 00:00:00 2001 From: "Richard D. Worth" Date: Tue, 19 Jul 2011 11:03:22 -0400 Subject: Datepicker i18n: Corrected Dutch abbreviation of month name March. Fixed #7566 - Dutch march name translation --- ui/i18n/jquery.ui.datepicker-nl.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'ui') diff --git a/ui/i18n/jquery.ui.datepicker-nl.js b/ui/i18n/jquery.ui.datepicker-nl.js index 09634088b..781fe6191 100644 --- a/ui/i18n/jquery.ui.datepicker-nl.js +++ b/ui/i18n/jquery.ui.datepicker-nl.js @@ -8,7 +8,7 @@ jQuery(function($){ currentText: 'Vandaag', monthNames: ['januari', 'februari', 'maart', 'april', 'mei', 'juni', 'juli', 'augustus', 'september', 'oktober', 'november', 'december'], - monthNamesShort: ['jan', 'feb', 'maa', 'apr', 'mei', 'jun', + monthNamesShort: ['jan', 'feb', 'mrt', 'apr', 'mei', 'jun', 'jul', 'aug', 'sep', 'okt', 'nov', 'dec'], dayNames: ['zondag', 'maandag', 'dinsdag', 'woensdag', 'donderdag', 'vrijdag', 'zaterdag'], dayNamesShort: ['zon', 'maa', 'din', 'woe', 'don', 'vri', 'zat'], -- cgit v1.2.3 From 8224c675e19bf5cb9ed0b00159dc572715ad7727 Mon Sep 17 00:00:00 2001 From: kborchers Date: Tue, 19 Jul 2011 16:15:59 -0500 Subject: Menu: Passed the original event that causes a blur through collapseAll to blur, then trigger a blur on the menu. Fixes failing unit test provided by @rwaldron which has been included in this commit --- tests/unit/menu/menu_events.js | 21 +++++++++++++++++++++ ui/jquery.ui.menu.js | 12 +++++++----- 2 files changed, 28 insertions(+), 5 deletions(-) (limited to 'ui') diff --git a/tests/unit/menu/menu_events.js b/tests/unit/menu/menu_events.js index a03bec3f6..2f713acf8 100644 --- a/tests/unit/menu/menu_events.js +++ b/tests/unit/menu/menu_events.js @@ -21,4 +21,25 @@ test("handle click on menu", function() { equals( $("#log").html(), "1,3,2,afterclick,1,click,", "Click order not valid."); }); +test( "handle blur: click", function() { + expect( 4 ); + var $menu = $( "#menu1" ).menu({ + focus: function( event, ui ) { + equal( event.originalEvent.type, "click", "focus triggered 'click'" ); + equal( event.type, "menufocus", "focus event.type is 'menufocus'" ); + + }, + blur: function( event, ui ) { + console.log( event, ui ); + equal( event.originalEvent.type, "click", "blur triggered 'click'" ); + equal( event.type, "menublur", "blur event.type is 'menublur'" ); + } + }); + + $menu.find( "li a:first" ).trigger( "click" ); + $( "", { id: "remove"} ).appendTo("body").trigger( "click" ); + + $("#remove").remove(); +}); + })(jQuery); diff --git a/ui/jquery.ui.menu.js b/ui/jquery.ui.menu.js index f6012de4f..4717946f1 100644 --- a/ui/jquery.ui.menu.js +++ b/ui/jquery.ui.menu.js @@ -176,7 +176,7 @@ $.widget( "ui.menu", { this._bind( document, { click: function( event ) { if ( !$( event.target ).closest( ".ui-menu" ).length ) { - this.collapseAll(); + this.collapseAll( event ); } } }); @@ -249,7 +249,7 @@ $.widget( "ui.menu", { var nested, self = this; - this.blur(); + this.blur( event ); if ( this._hasScroll() ) { var borderTop = parseFloat( $.curCSS( this.element[0], "borderTopWidth", true ) ) || 0, @@ -297,6 +297,8 @@ $.widget( "ui.menu", { this.active.children( "a" ).removeClass( "ui-state-focus" ); this.active = null; + + this._trigger( "blur", event, { item: this.active } ); }, _startOpening: function( submenu ) { @@ -336,7 +338,7 @@ $.widget( "ui.menu", { .position( position ); }, - collapseAll: function() { + collapseAll: function( event ) { this.element .find( "ul" ) .hide() @@ -346,7 +348,7 @@ $.widget( "ui.menu", { .find( "a.ui-state-active" ) .removeClass( "ui-state-active" ); - this.blur(); + this.blur( event ); this.activeMenu = this.element; }, @@ -470,7 +472,7 @@ $.widget( "ui.menu", { var ui = { item: this.active }; - this.collapseAll(); + this.collapseAll( event ); this._trigger( "select", event, ui ); } }); -- cgit v1.2.3 From 5f02a8ff1fb7947c40003208886214203b834ce1 Mon Sep 17 00:00:00 2001 From: kborchers Date: Wed, 20 Jul 2011 08:19:01 -0500 Subject: Accordion: Stop current hide animation, jump to last animation and calculate percentages for padding in addition to height. Fixes #3532 - Accordion: Activating a panel during animation fails --- ui/jquery.ui.accordion.js | 24 +++++++++++++----------- 1 file changed, 13 insertions(+), 11 deletions(-) (limited to 'ui') diff --git a/ui/jquery.ui.accordion.js b/ui/jquery.ui.accordion.js index 7602ae9bc..97dad0b8b 100644 --- a/ui/jquery.ui.accordion.js +++ b/ui/jquery.ui.accordion.js @@ -12,6 +12,8 @@ * jquery.ui.widget.js */ (function( $, undefined ) { + +var lastToggle = {}; // TODO: use ui-accordion-header-active class and fix styling $.widget( "ui.accordion", { @@ -37,8 +39,6 @@ $.widget( "ui.accordion", { var self = this, options = self.options; - self.running = false; - self.element.addClass( "ui-accordion ui-widget ui-helper-reset" ); self.headers = self.element.find( options.header ) @@ -319,8 +319,6 @@ $.widget( "ui.accordion", { event.preventDefault(); if ( options.disabled || - // can't switch during an animation - this.running || // click on active header, but not collapsible ( clickedIsActive && !options.collapsible ) || // allow canceling activation @@ -361,7 +359,6 @@ $.widget( "ui.accordion", { toShow = data.newContent, toHide = data.oldContent; - self.running = true; function complete() { self._completed( data ); } @@ -382,6 +379,8 @@ $.widget( "ui.accordion", { animations[ animation ]({ toShow: toShow, toHide: toHide, + prevShow: lastToggle.toShow, + prevHide: lastToggle.toHide, complete: complete, down: toShow.length && ( !toHide.length || ( toShow.index() < toHide.index() ) ) }, additional ); @@ -412,8 +411,6 @@ $.widget( "ui.accordion", { var toShow = data.newContent, toHide = data.oldContent; - this.running = false; - if ( this.options.heightStyle === "content" ) { toShow.add( toHide ).css({ height: "", @@ -435,6 +432,11 @@ $.widget( "ui.accordion", { $.extend( $.ui.accordion, { animations: { slide: function( options, additions ) { + if ( options.prevShow || options.prevHide ) { + options.prevHide.stop( true, true ); + options.toHide = options.prevShow; + } + var showOverflow = options.toShow.css( "overflow" ), hideOverflow = options.toHide.css( "overflow" ), percentDone = 0, @@ -446,6 +448,9 @@ $.extend( $.ui.accordion, { easing: "swing", duration: 300 }, options, additions ); + + lastToggle = options; + if ( !options.toHide.size() ) { originalWidth = options.toShow[0].style.width; options.toShow @@ -502,10 +507,7 @@ $.extend( $.ui.accordion, { .filter( ":visible" ) .animate( hideProps, { step: function( now, settings ) { - // only calculate the percent when animating height - // IE gets very inconsistent results when animating elements - // with small values, which is common for padding - if ( settings.prop == "height" ) { + if ( settings.prop == "height" || settings.prop == "paddingTop" || settings.prop == "paddingBottom" ) { percentDone = ( settings.end - settings.start === 0 ) ? 0 : ( settings.now - settings.start ) / ( settings.end - settings.start ); } -- cgit v1.2.3 From 23340f1162cbe64c2dc58e97130b20c3f3562192 Mon Sep 17 00:00:00 2001 From: kborchers Date: Mon, 25 Jul 2011 09:13:13 -0500 Subject: Menu: Added Home moves to first item and End moves to last item in currently active menu or submenu. Also fixed PageUp and PageDown so that they don't wrap back around to other end of menu. Also fixed scrolling to use activeMenu rather than element to all. Also added unit tests for keyboard nav --- tests/unit/menu/menu.html | 159 ++++++++++++++++++++- tests/unit/menu/menu_events.js | 305 +++++++++++++++++++++++++++++++++++++++++ ui/jquery.ui.menu.js | 61 ++++++--- 3 files changed, 504 insertions(+), 21 deletions(-) (limited to 'ui') diff --git a/tests/unit/menu/menu.html b/tests/unit/menu/menu.html index c917f5c4b..ec2c82e6b 100644 --- a/tests/unit/menu/menu.html +++ b/tests/unit/menu/menu.html @@ -31,7 +31,7 @@ $("#log").data("lastItem",item); $('li:eq(' + item + ') a',menu).trigger("click"); } - + @@ -41,10 +41,12 @@ - + @@ -66,6 +68,159 @@
  • Addyston
  • Adelphi
    • + + + + + + +
    diff --git a/tests/unit/menu/menu_events.js b/tests/unit/menu/menu_events.js index 2f713acf8..b949c827d 100644 --- a/tests/unit/menu/menu_events.js +++ b/tests/unit/menu/menu_events.js @@ -42,4 +42,309 @@ test( "handle blur: click", function() { $("#remove").remove(); }); +test("handle keyboard navigation on menu without scroll and without submenus", function() { + expect(12); + var element = $('#menu1').menu({ + select: function(event, ui) { + log($(ui.item[0]).text()); + }, + focus: function( event, ui ) { + log($(event.target).find(".ui-state-focus").parent().index()); + } + }); + + log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } ); + element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } ); + equals( $("#log").html(), "1,0,keydown,", "Keydown DOWN"); + + log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.UP } ); + equals( $("#log").html(), "0,keydown,", "Keydown UP"); + + log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.LEFT } ); + equals( $("#log").html(), "keydown,", "Keydown LEFT (no effect)"); + + log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.RIGHT } ); + equals( $("#log").html(), "keydown,", "Keydown RIGHT (no effect)"); + + log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_DOWN } ); + equals( $("#log").html(), "4,keydown,", "Keydown PAGE_DOWN"); + + log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_DOWN } ); + equals( $("#log").html(), "keydown,", "Keydown PAGE_DOWN (no effect)"); + + log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_UP } ); + equals( $("#log").html(), "0,keydown,", "Keydown PAGE_UP"); + + log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_UP } ); + equals( $("#log").html(), "keydown,", "Keydown PAGE_UP (no effect)"); + + log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.END } ); + equals( $("#log").html(), "4,keydown,", "Keydown END"); + + log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.HOME } ); + equals( $("#log").html(), "0,keydown,", "Keydown HOME"); + + log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.ESCAPE } ); + equals( $("#log").html(), "keydown,", "Keydown ESCAPE (no effect)"); + + log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.ENTER } ); + equals( $("#log").html(), "Aberdeen,keydown,", "Keydown ENTER"); +}); + +asyncTest("handle keyboard navigation on menu without scroll and with submenus", function() { + expect(14); + var element = $('#menu2').menu({ + select: function(event, ui) { + log($(ui.item[0]).text()); + }, + focus: function( event, ui ) { + log($(event.target).find(".ui-state-focus").parent().index()); + } + }); + + log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } ); + element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } ); + equals( $("#log").html(), "1,0,keydown,", "Keydown DOWN"); + + log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.UP } ); + equals( $("#log").html(), "0,keydown,", "Keydown UP"); + + log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.LEFT } ); + equals( $("#log").html(), "keydown,", "Keydown LEFT (no effect)"); + + log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } ); + element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } ); + element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } ); + element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } ); + element.simulate( "keydown", { keyCode: $.ui.keyCode.RIGHT } ); + + setTimeout( function() { + equals( $("#log").html(), "0,4,3,2,1,keydown,", "Keydown RIGHT (open submenu)"); + }, 50); + + setTimeout( function() { + log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.LEFT } ); + equals( $("#log").html(), "4,keydown,", "Keydown LEFT (close submenu)"); + + //re-open submenu + element.simulate( "keydown", { keyCode: $.ui.keyCode.RIGHT } ); + + setTimeout( function() { + log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_DOWN } ); + equals( $("#log").html(), "2,keydown,", "Keydown PAGE_DOWN"); + + log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_DOWN } ); + equals( $("#log").html(), "keydown,", "Keydown PAGE_DOWN (no effect)"); + + log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_UP } ); + equals( $("#log").html(), "0,keydown,", "Keydown PAGE_UP"); + + log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_UP } ); + equals( $("#log").html(), "keydown,", "Keydown PAGE_UP (no effect)"); + + log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.END } ); + equals( $("#log").html(), "2,keydown,", "Keydown END"); + + log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.HOME } ); + equals( $("#log").html(), "0,keydown,", "Keydown HOME"); + + log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.ESCAPE } ); + equals( $("#log").html(), "4,keydown,", "Keydown ESCAPE (close submenu)"); + + log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.ENTER } ); + + setTimeout( function() { + equals( $("#log").html(), "0,keydown,", "Keydown ENTER (open submenu)"); + + log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.ENTER } ); + equals( $("#log").html(), "Ada,keydown,", "Keydown ENTER (select item)"); + + start(); + }, 200); + }, 150); + }, 100); + +}); + +test("handle keyboard navigation on menu with scroll and without submenus", function() { + expect(14); + var element = $('#menu3').menu({ + select: function(event, ui) { + log($(ui.item[0]).text()); + }, + focus: function( event, ui ) { + log($(event.target).find(".ui-state-focus").parent().index()); + } + }); + + log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } ); + element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } ); + equals( $("#log").html(), "1,0,keydown,", "Keydown DOWN"); + + log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.UP } ); + equals( $("#log").html(), "0,keydown,", "Keydown UP"); + + log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.LEFT } ); + equals( $("#log").html(), "keydown,", "Keydown LEFT (no effect)"); + + log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.RIGHT } ); + equals( $("#log").html(), "keydown,", "Keydown RIGHT (no effect)"); + + log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_DOWN } ); + equals( $("#log").html(), "10,keydown,", "Keydown PAGE_DOWN"); + + log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_DOWN } ); + equals( $("#log").html(), "20,keydown,", "Keydown PAGE_DOWN"); + + log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_UP } ); + equals( $("#log").html(), "10,keydown,", "Keydown PAGE_UP"); + + log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_UP } ); + equals( $("#log").html(), "0,keydown,", "Keydown PAGE_UP"); + + log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_UP } ); + equals( $("#log").html(), "keydown,", "Keydown PAGE_UP (no effect)"); + + log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.END } ); + equals( $("#log").html(), "37,keydown,", "Keydown END"); + + log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_DOWN } ); + equals( $("#log").html(), "keydown,", "Keydown PAGE_DOWN (no effect)"); + + log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.HOME } ); + equals( $("#log").html(), "0,keydown,", "Keydown HOME"); + + log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.ESCAPE } ); + equals( $("#log").html(), "keydown,", "Keydown ESCAPE (no effect)"); + + log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.ENTER } ); + equals( $("#log").html(), "Aberdeen,keydown,", "Keydown ENTER"); +}); + +asyncTest("handle keyboard navigation on menu with scroll and with submenus", function() { + expect(14); + var element = $('#menu4').menu({ + select: function(event, ui) { + log($(ui.item[0]).text()); + }, + focus: function( event, ui ) { + log($(event.target).find(".ui-state-focus").parent().index()); + } + }); + + log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } ); + element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } ); + equals( $("#log").html(), "1,0,keydown,", "Keydown DOWN"); + + log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.UP } ); + equals( $("#log").html(), "0,keydown,", "Keydown UP"); + + log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.LEFT } ); + equals( $("#log").html(), "keydown,", "Keydown LEFT (no effect)"); + + log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } ); + element.simulate( "keydown", { keyCode: $.ui.keyCode.RIGHT } ); + + setTimeout( function() { + equals( $("#log").html(), "0,1,keydown,", "Keydown RIGHT (open submenu)"); + }, 50); + + setTimeout( function() { + log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.LEFT } ); + equals( $("#log").html(), "1,keydown,", "Keydown LEFT (close submenu)"); + + //re-open submenu + element.simulate( "keydown", { keyCode: $.ui.keyCode.RIGHT } ); + + setTimeout( function() { + log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_DOWN } ); + equals( $("#log").html(), "10,keydown,", "Keydown PAGE_DOWN"); + + log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_DOWN } ); + equals( $("#log").html(), "20,keydown,", "Keydown PAGE_DOWN"); + + log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_UP } ); + equals( $("#log").html(), "10,keydown,", "Keydown PAGE_UP"); + + log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_UP } ); + equals( $("#log").html(), "0,keydown,", "Keydown PAGE_UP"); + + log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.END } ); + equals( $("#log").html(), "27,keydown,", "Keydown END"); + + log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.HOME } ); + equals( $("#log").html(), "0,keydown,", "Keydown HOME"); + + log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.ESCAPE } ); + equals( $("#log").html(), "1,keydown,", "Keydown ESCAPE (close submenu)"); + + log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.ENTER } ); + + setTimeout( function() { + equals( $("#log").html(), "0,keydown,", "Keydown ENTER (open submenu)"); + + log("keydown",true); + element.simulate( "keydown", { keyCode: $.ui.keyCode.ENTER } ); + equals( $("#log").html(), "Aberdeen,keydown,", "Keydown ENTER (select item)"); + + start(); + }, 200); + }, 150); + }, 100); + +}); + })(jQuery); diff --git a/ui/jquery.ui.menu.js b/ui/jquery.ui.menu.js index 4717946f1..66f874290 100644 --- a/ui/jquery.ui.menu.js +++ b/ui/jquery.ui.menu.js @@ -89,6 +89,16 @@ $.widget( "ui.menu", { event.preventDefault(); event.stopImmediatePropagation(); break; + case $.ui.keyCode.HOME: + self._move( "first", "first", event ); + event.preventDefault(); + event.stopImmediatePropagation(); + break; + case $.ui.keyCode.END: + self._move( "last", "last", event ); + event.preventDefault(); + event.stopImmediatePropagation(); + break; case $.ui.keyCode.UP: self.previous( event ); event.preventDefault(); @@ -252,17 +262,17 @@ $.widget( "ui.menu", { this.blur( event ); if ( this._hasScroll() ) { - var borderTop = parseFloat( $.curCSS( this.element[0], "borderTopWidth", true ) ) || 0, - paddingTop = parseFloat( $.curCSS( this.element[0], "paddingTop", true ) ) || 0, - offset = item.offset().top - this.element.offset().top - borderTop - paddingTop, - scroll = this.element.scrollTop(), - elementHeight = this.element.height(), + var borderTop = parseFloat( $.curCSS( this.activeMenu[0], "borderTopWidth", true ) ) || 0, + paddingTop = parseFloat( $.curCSS( this.activeMenu[0], "paddingTop", true ) ) || 0, + offset = item.offset().top - this.activeMenu.offset().top - borderTop - paddingTop, + scroll = this.activeMenu.scrollTop(), + elementHeight = this.activeMenu.height(), itemHeight = item.height(); if ( offset < 0 ) { - this.element.scrollTop( scroll + offset ); + this.activeMenu.scrollTop( scroll + offset ); } else if ( offset + itemHeight > elementHeight ) { - this.element.scrollTop( scroll + offset - elementHeight + itemHeight ); + this.activeMenu.scrollTop( scroll + offset - elementHeight + itemHeight ); } } @@ -391,11 +401,11 @@ $.widget( "ui.menu", { }, next: function(event) { - this._move( "next", ".ui-menu-item", "first", event ); + this._move( "next", "first", event ); }, previous: function(event) { - this._move( "prev", ".ui-menu-item", "last", event ); + this._move( "prev", "last", event ); }, first: function() { @@ -406,25 +416,36 @@ $.widget( "ui.menu", { return this.active && !this.active.nextAll( ".ui-menu-item" ).length; }, - _move: function( direction, edge, filter, event ) { + _move: function( direction, filter, event ) { if ( !this.active ) { - this.focus( event, this.activeMenu.children( edge )[ filter ]() ); + this.focus( event, this.activeMenu.children( ".ui-menu-item" )[ filter ]() ); return; } - var next = this.active[ direction + "All" ]( ".ui-menu-item" ).eq( 0 ); + + var next; + if ( direction === "first" || direction === "last" ) { + next = this.active[ direction === "first" ? "prevAll" : "nextAll" ]( ".ui-menu-item" ).eq( -1 ); + } else { + next = this.active[ direction + "All" ]( ".ui-menu-item" ).eq( 0 ); + } + if ( next.length ) { this.focus( event, next ); } else { - this.focus( event, this.activeMenu.children( edge )[ filter ]() ); + this.focus( event, this.activeMenu.children( ".ui-menu-item" )[ filter ]() ); } }, nextPage: function( event ) { if ( this._hasScroll() ) { - if ( !this.active || this.last() ) { + if ( !this.active ) { this.focus( event, this.activeMenu.children( ".ui-menu-item" ).first() ); return; } + if ( this.last() ) { + return; + } + var base = this.active.offset().top, height = this.element.height(), result; @@ -436,14 +457,17 @@ $.widget( "ui.menu", { this.focus( event, result ); } else { this.focus( event, this.activeMenu.children( ".ui-menu-item" ) - [ !this.active || this.last() ? "first" : "last" ]() ); + [ !this.active ? "first" : "last" ]() ); } }, previousPage: function( event ) { if ( this._hasScroll() ) { - if ( !this.active || this.first() ) { - this.focus( event, this.activeMenu.children( ".ui-menu-item" ).last() ); + if ( !this.active ) { + this.focus( event, this.activeMenu.children( ".ui-menu-item" ).first() ); + return; + } + if ( this.first() ) { return; } @@ -457,8 +481,7 @@ $.widget( "ui.menu", { this.focus( event, result ); } else { - this.focus( event, this.activeMenu.children( ".ui-menu-item" ) - [ !this.active || this.first() ? ":last" : ":first" ]() ); + this.focus( event, this.activeMenu.children( ".ui-menu-item" ).first() ); } }, -- cgit v1.2.3 From f59a3e91e31379663983377f9dbd682e7bc67834 Mon Sep 17 00:00:00 2001 From: Scott González Date: Mon, 25 Jul 2011 11:13:54 -0400 Subject: Datepicker: Use .attr() for size. --- ui/jquery.ui.datepicker.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'ui') diff --git a/ui/jquery.ui.datepicker.js b/ui/jquery.ui.datepicker.js index bf42f0411..aa42c972e 100644 --- a/ui/jquery.ui.datepicker.js +++ b/ui/jquery.ui.datepicker.js @@ -254,7 +254,7 @@ $.extend(Datepicker.prototype, { date.setDate(findMax(this._get(inst, (dateFormat.match(/DD/) ? 'dayNames' : 'dayNamesShort'))) + 20 - date.getDay()); } - inst.input.prop('size', this._formatDate(inst, date).length); + inst.input.attr('size', this._formatDate(inst, date).length); } }, -- cgit v1.2.3 From e16e99a154d7f3bdbc7ffe56e5c74e9fe90bbd6b Mon Sep 17 00:00:00 2001 From: kborchers Date: Tue, 26 Jul 2011 08:52:33 -0500 Subject: Menu: Added focusing first menu item when menu receives focus and collapseAll when menu loses focus (blur). --- ui/jquery.ui.menu.js | 12 ++++++++++++ 1 file changed, 12 insertions(+) (limited to 'ui') diff --git a/ui/jquery.ui.menu.js b/ui/jquery.ui.menu.js index ad7a9c8c1..c55ae75c9 100644 --- a/ui/jquery.ui.menu.js +++ b/ui/jquery.ui.menu.js @@ -71,6 +71,18 @@ $.widget( "ui.menu", { if ( target.length ) { self.blur( event ); } + }) + .bind( "focus.menu", function( event ) { + if ( self.options.disabled ) { + return; + } + self.focus( event, $( event.target ).children( ".ui-menu-item:first" ) ); + }) + .bind( "blur.menu", function( event ) { + if ( self.options.disabled ) { + return; + } + self.collapseAll( event ); }); this.refresh(); -- cgit v1.2.3