diff --git a/tests/unit/selectable/common.js b/tests/unit/selectable/common.js index 460ea0602..70b94bbb9 100644 --- a/tests/unit/selectable/common.js +++ b/tests/unit/selectable/common.js @@ -24,6 +24,6 @@ common.testWidget( "selectable", { unselected: null, unselecting: null } -}); +} ); } ); diff --git a/tests/unit/selectable/events.js b/tests/unit/selectable/events.js index 5d4e48996..0e2e1384d 100644 --- a/tests/unit/selectable/events.js +++ b/tests/unit/selectable/events.js @@ -4,37 +4,37 @@ define( [ "ui/widgets/selectable" ], function( $, testHelpers ) { -module("selectable: events"); +module( "selectable: events" ); test( "start", function() { expect( 2 ); - var el = $("#selectable1"); - el.selectable({ + var el = $( "#selectable1" ); + el.selectable( { start: function() { ok( true, "drag fired start callback" ); - equal( this, el[0], "context of callback" ); + equal( this, el[ 0 ], "context of callback" ); } - }); + } ); el.simulate( "drag", { dx: 20, dy: 20 - }); -}); + } ); +} ); test( "stop", function() { expect( 2 ); - var el = $("#selectable1"); - el.selectable({ + var el = $( "#selectable1" ); + el.selectable( { start: function() { ok( true, "drag fired stop callback" ); - equal( this, el[0], "context of callback" ); + equal( this, el[ 0 ], "context of callback" ); } - }); + } ); el.simulate( "drag", { dx: 20, dy: 20 - }); -}); + } ); +} ); test( "mousedown: initial position of helper", function() { expect( 2 ); @@ -48,7 +48,7 @@ test( "mousedown: initial position of helper", function() { element.simulate( "mousedown", { clientX: 10, clientY: 10 - }); + } ); helperOffset = $( ".ui-selectable-helper" ).offset(); ok( helperOffset.top, 110, "Scroll top should be accounted for." ); @@ -58,6 +58,6 @@ test( "mousedown: initial position of helper", function() { element.simulate( "mouseup" ); contentToForceScroll.remove(); $( window ).scrollTop( 0 ).scrollLeft( 0 ); -}); +} ); } ); diff --git a/tests/unit/selectable/methods.js b/tests/unit/selectable/methods.js index ee60e4ebf..30160e975 100644 --- a/tests/unit/selectable/methods.js +++ b/tests/unit/selectable/methods.js @@ -3,73 +3,73 @@ define( [ "ui/widgets/selectable" ], function( $ ) { -module("selectable: methods"); +module( "selectable: methods" ); -test("init", function() { +test( "init", function() { expect( 5 ); - $("
").appendTo("body").selectable().remove(); - ok(true, ".selectable() called on element"); + $( "
" ).appendTo( "body" ).selectable().remove(); + ok( true, ".selectable() called on element" ); - $([]).selectable().remove(); - ok(true, ".selectable() called on empty collection"); + $( [] ).selectable().remove(); + ok( true, ".selectable() called on empty collection" ); - $("
").selectable().remove(); - ok(true, ".selectable() called on disconnected DOMElement"); + $( "
" ).selectable().remove(); + ok( true, ".selectable() called on disconnected DOMElement" ); - var el = $("
").selectable(); - el.selectable("option", "foo"); + var el = $( "
" ).selectable(); + el.selectable( "option", "foo" ); el.remove(); - ok(true, "arbitrary option getter after init"); + ok( true, "arbitrary option getter after init" ); - $("
").selectable().selectable("option", "foo", "bar").remove(); - ok(true, "arbitrary option setter after init"); -}); + $( "
" ).selectable().selectable( "option", "foo", "bar" ).remove(); + ok( true, "arbitrary option setter after init" ); +} ); -test("destroy", function() { +test( "destroy", function() { expect( 4 ); - $("
").appendTo("body").selectable().selectable("destroy").remove(); - ok(true, ".selectable('destroy') called on element"); + $( "
" ).appendTo( "body" ).selectable().selectable( "destroy" ).remove(); + ok( true, ".selectable('destroy') called on element" ); - $([]).selectable().selectable("destroy").remove(); - ok(true, ".selectable('destroy') called on empty collection"); + $( [] ).selectable().selectable( "destroy" ).remove(); + ok( true, ".selectable('destroy') called on empty collection" ); - $("
").selectable().selectable("destroy").remove(); - ok(true, ".selectable('destroy') called on disconnected DOMElement"); + $( "
" ).selectable().selectable( "destroy" ).remove(); + ok( true, ".selectable('destroy') called on disconnected DOMElement" ); - var expected = $("
").selectable(), - actual = expected.selectable("destroy"); - equal(actual, expected, "destroy is chainable"); -}); + var expected = $( "
" ).selectable(), + actual = expected.selectable( "destroy" ); + equal( actual, expected, "destroy is chainable" ); +} ); -test("enable", function() { - expect(3); +test( "enable", function() { + expect( 3 ); var expected, actual, fired = false, - el = $("#selectable1"); + el = $( "#selectable1" ); - el.selectable({ + el.selectable( { disabled: true, start: function() { fired = true; } - }); + } ); el.simulate( "drag", { dx: 20, dy: 20 - }); - equal(fired, false, "start fired"); - el.selectable("enable"); + } ); + equal( fired, false, "start fired" ); + el.selectable( "enable" ); el.simulate( "drag", { dx: 20, dy: 20 - }); - equal(fired, true, "start fired"); - el.selectable("destroy"); + } ); + equal( fired, true, "start fired" ); + el.selectable( "destroy" ); - expected = $("
").selectable(); - actual = expected.selectable("enable"); - equal(actual, expected, "enable is chainable"); -}); + expected = $( "
" ).selectable(); + actual = expected.selectable( "enable" ); + equal( actual, expected, "enable is chainable" ); +} ); test( "disable", function( assert ) { expect( 6 ); @@ -77,16 +77,16 @@ test( "disable", function( assert ) { fired = false, element = $( "#selectable1" ); - element.selectable({ + element.selectable( { disabled: false, start: function() { fired = true; } - }); + } ); element.simulate( "drag", { dx: 20, dy: 20 - }); + } ); equal( fired, true, "start fired" ); chainable = element.selectable( "disable" ); @@ -95,7 +95,7 @@ test( "disable", function( assert ) { element.simulate( "drag", { dx: 20, dy: 20 - }); + } ); equal( fired, false, "start fired" ); assert.lacksClasses( element.selectable( "widget" ), "ui-state-disabled" ); @@ -106,6 +106,6 @@ test( "disable", function( assert ) { element.selectable( "destroy" ); equal( chainable, element, "disable is chainable" ); -}); +} ); } ); diff --git a/tests/unit/selectable/options.js b/tests/unit/selectable/options.js index 6bb898d26..df2f54f3e 100644 --- a/tests/unit/selectable/options.js +++ b/tests/unit/selectable/options.js @@ -3,62 +3,62 @@ define( [ "ui/widgets/selectable" ], function( $ ) { -module("selectable: options"); +module( "selectable: options" ); -test("autoRefresh", function() { - expect(3); +test( "autoRefresh", function() { + expect( 3 ); var actual = 0, - el = $("#selectable1"), - sel = $("*", el), + el = $( "#selectable1" ), + sel = $( "*", el ), selected = function() { actual += 1; }; - el = $("#selectable1").selectable({ autoRefresh: false, selected: selected }); + el = $( "#selectable1" ).selectable( { autoRefresh: false, selected: selected } ); sel.hide(); el.simulate( "drag", { dx: 1000, dy: 1000 - }); - equal(actual, sel.length); - el.selectable("destroy"); + } ); + equal( actual, sel.length ); + el.selectable( "destroy" ); actual = 0; sel.show(); - el = $("#selectable1").selectable({ autoRefresh: true, selected: selected }); + el = $( "#selectable1" ).selectable( { autoRefresh: true, selected: selected } ); sel.hide(); el.simulate( "drag", { dx: 1000, dy: 1000 - }); - equal(actual, 0); + } ); + equal( actual, 0 ); sel.show(); $( sel[ 0 ] ).simulate( "drag", { dx: 1000, dy: 1000 - }); - equal(actual, sel.length); + } ); + equal( actual, sel.length ); - el.selectable("destroy"); + el.selectable( "destroy" ); sel.show(); -}); +} ); -test("filter", function() { - expect(2); +test( "filter", function() { + expect( 2 ); - var actual =0, - el = $("#selectable1"), - sel = $("*", el), + var actual = 0, + el = $( "#selectable1" ), + sel = $( "*", el ), selected = function() { actual += 1; }; - el = $("#selectable1").selectable({ filter: ".special", selected: selected }); + el = $( "#selectable1" ).selectable( { filter: ".special", selected: selected } ); el.simulate( "drag", { dx: 1000, dy: 1000 - }); - ok(sel.length !== 1, "this test assumes more than 1 selectee"); - equal(actual, 1); - el.selectable("destroy"); -}); + } ); + ok( sel.length !== 1, "this test assumes more than 1 selectee" ); + equal( actual, 1 ); + el.selectable( "destroy" ); +} ); } ); diff --git a/ui/widgets/selectable.js b/ui/widgets/selectable.js index 0dadac962..152729d7c 100644 --- a/ui/widgets/selectable.js +++ b/ui/widgets/selectable.js @@ -14,11 +14,11 @@ //>>demos: http://jqueryui.com/selectable/ //>>css.structure: ../themes/base/selectable.css -(function( factory ) { +( function( factory ) { if ( typeof define === "function" && define.amd ) { // AMD. Register as an anonymous module. - define([ + define( [ "jquery", "./mouse", "../version", @@ -29,9 +29,9 @@ // Browser globals factory( jQuery ); } -}(function( $ ) { +}( function( $ ) { -return $.widget("ui.selectable", $.ui.mouse, { +return $.widget( "ui.selectable", $.ui.mouse, { version: "@VERSION", options: { appendTo: "body", @@ -57,12 +57,12 @@ return $.widget("ui.selectable", $.ui.mouse, { // Cache selectee children based on filter this.refresh = function() { - that.selectees = $(that.options.filter, that.element[0]); + that.selectees = $( that.options.filter, that.element[ 0 ] ); that._addClass( that.selectees, "ui-selectee" ); - that.selectees.each(function() { - var $this = $(this), + that.selectees.each( function() { + var $this = $( this ), pos = $this.offset(); - $.data(this, "selectable-item", { + $.data( this, "selectable-item", { element: this, $element: $this, left: pos.left, @@ -70,150 +70,156 @@ return $.widget("ui.selectable", $.ui.mouse, { right: pos.left + $this.outerWidth(), bottom: pos.top + $this.outerHeight(), startselected: false, - selected: $this.hasClass("ui-selected"), - selecting: $this.hasClass("ui-selecting"), - unselecting: $this.hasClass("ui-unselecting") - }); - }); + selected: $this.hasClass( "ui-selected" ), + selecting: $this.hasClass( "ui-selecting" ), + unselecting: $this.hasClass( "ui-unselecting" ) + } ); + } ); }; this.refresh(); this._mouseInit(); - this.helper = $("
"); + this.helper = $( "
" ); this._addClass( this.helper, "ui-selectable-helper" ); }, _destroy: function() { - this.selectees.removeData("selectable-item"); + this.selectees.removeData( "selectable-item" ); this._mouseDestroy(); }, - _mouseStart: function(event) { + _mouseStart: function( event ) { var that = this, options = this.options; this.opos = [ event.pageX, event.pageY ]; - if (this.options.disabled) { + if ( this.options.disabled ) { return; } - this.selectees = $(options.filter, this.element[0]); + this.selectees = $( options.filter, this.element[ 0 ] ); - this._trigger("start", event); + this._trigger( "start", event ); + + $( options.appendTo ).append( this.helper ); - $(options.appendTo).append(this.helper); // position helper (lasso) - this.helper.css({ + this.helper.css( { "left": event.pageX, "top": event.pageY, "width": 0, "height": 0 - }); + } ); - if (options.autoRefresh) { + if ( options.autoRefresh ) { this.refresh(); } - this.selectees.filter(".ui-selected").each(function() { - var selectee = $.data(this, "selectable-item"); + this.selectees.filter( ".ui-selected" ).each( function() { + var selectee = $.data( this, "selectable-item" ); selectee.startselected = true; - if (!event.metaKey && !event.ctrlKey) { + if ( !event.metaKey && !event.ctrlKey ) { that._removeClass( selectee.$element, "ui-selected" ); selectee.selected = false; that._addClass( selectee.$element, "ui-unselecting" ); selectee.unselecting = true; - // selectable UNSELECTING callback - that._trigger("unselecting", event, { - unselecting: selectee.element - }); - } - }); - $(event.target).parents().addBack().each(function() { + // selectable UNSELECTING callback + that._trigger( "unselecting", event, { + unselecting: selectee.element + } ); + } + } ); + + $( event.target ).parents().addBack().each( function() { var doSelect, - selectee = $.data(this, "selectable-item"); - if (selectee) { - doSelect = (!event.metaKey && !event.ctrlKey) || !selectee.$element.hasClass("ui-selected"); + selectee = $.data( this, "selectable-item" ); + if ( selectee ) { + doSelect = ( !event.metaKey && !event.ctrlKey ) || !selectee.$element.hasClass( "ui-selected" ); that._removeClass( selectee.$element, doSelect ? "ui-unselecting" : "ui-selected" ) ._addClass( selectee.$element, doSelect ? "ui-selecting" : "ui-unselecting" ); selectee.unselecting = !doSelect; selectee.selecting = doSelect; selectee.selected = doSelect; + // selectable (UN)SELECTING callback - if (doSelect) { - that._trigger("selecting", event, { + if ( doSelect ) { + that._trigger( "selecting", event, { selecting: selectee.element - }); + } ); } else { - that._trigger("unselecting", event, { + that._trigger( "unselecting", event, { unselecting: selectee.element - }); + } ); } return false; } - }); + } ); }, - _mouseDrag: function(event) { + _mouseDrag: function( event ) { this.dragged = true; - if (this.options.disabled) { + if ( this.options.disabled ) { return; } var tmp, that = this, options = this.options, - x1 = this.opos[0], - y1 = this.opos[1], + x1 = this.opos[ 0 ], + y1 = this.opos[ 1 ], x2 = event.pageX, y2 = event.pageY; - if (x1 > x2) { tmp = x2; x2 = x1; x1 = tmp; } - if (y1 > y2) { tmp = y2; y2 = y1; y1 = tmp; } - this.helper.css({ left: x1, top: y1, width: x2 - x1, height: y2 - y1 }); + if ( x1 > x2 ) { tmp = x2; x2 = x1; x1 = tmp; } + if ( y1 > y2 ) { tmp = y2; y2 = y1; y1 = tmp; } + this.helper.css( { left: x1, top: y1, width: x2 - x1, height: y2 - y1 } ); - this.selectees.each(function() { - var selectee = $.data(this, "selectable-item"), + this.selectees.each( function() { + var selectee = $.data( this, "selectable-item" ), hit = false; //prevent helper from being selected if appendTo: selectable - if (!selectee || selectee.element === that.element[0]) { + if ( !selectee || selectee.element === that.element[ 0 ] ) { return; } - if (options.tolerance === "touch") { - hit = ( !(selectee.left > x2 || selectee.right < x1 || selectee.top > y2 || selectee.bottom < y1) ); - } else if (options.tolerance === "fit") { - hit = (selectee.left > x1 && selectee.right < x2 && selectee.top > y1 && selectee.bottom < y2); + if ( options.tolerance === "touch" ) { + hit = ( !( selectee.left > x2 || selectee.right < x1 || selectee.top > y2 || selectee.bottom < y1 ) ); + } else if ( options.tolerance === "fit" ) { + hit = ( selectee.left > x1 && selectee.right < x2 && selectee.top > y1 && selectee.bottom < y2 ); } - if (hit) { + if ( hit ) { + // SELECT - if (selectee.selected) { + if ( selectee.selected ) { that._removeClass( selectee.$element, "ui-selected" ); selectee.selected = false; } - if (selectee.unselecting) { + if ( selectee.unselecting ) { that._removeClass( selectee.$element, "ui-unselecting" ); selectee.unselecting = false; } - if (!selectee.selecting) { + if ( !selectee.selecting ) { that._addClass( selectee.$element, "ui-selecting" ); selectee.selecting = true; + // selectable SELECTING callback - that._trigger("selecting", event, { + that._trigger( "selecting", event, { selecting: selectee.element - }); + } ); } } else { + // UNSELECT - if (selectee.selecting) { - if ((event.metaKey || event.ctrlKey) && selectee.startselected) { + if ( selectee.selecting ) { + if ( ( event.metaKey || event.ctrlKey ) && selectee.startselected ) { that._removeClass( selectee.$element, "ui-selecting" ); selectee.selecting = false; that._addClass( selectee.$element, "ui-selected" ); @@ -221,67 +227,69 @@ return $.widget("ui.selectable", $.ui.mouse, { } else { that._removeClass( selectee.$element, "ui-selecting" ); selectee.selecting = false; - if (selectee.startselected) { + if ( selectee.startselected ) { that._addClass( selectee.$element, "ui-unselecting" ); selectee.unselecting = true; } + // selectable UNSELECTING callback - that._trigger("unselecting", event, { + that._trigger( "unselecting", event, { unselecting: selectee.element - }); + } ); } } - if (selectee.selected) { - if (!event.metaKey && !event.ctrlKey && !selectee.startselected) { + if ( selectee.selected ) { + if ( !event.metaKey && !event.ctrlKey && !selectee.startselected ) { that._removeClass( selectee.$element, "ui-selected" ); selectee.selected = false; that._addClass( selectee.$element, "ui-unselecting" ); selectee.unselecting = true; + // selectable UNSELECTING callback - that._trigger("unselecting", event, { + that._trigger( "unselecting", event, { unselecting: selectee.element - }); + } ); } } } - }); + } ); return false; }, - _mouseStop: function(event) { + _mouseStop: function( event ) { var that = this; this.dragged = false; - $(".ui-unselecting", this.element[0]).each(function() { - var selectee = $.data(this, "selectable-item"); + $( ".ui-unselecting", this.element[ 0 ] ).each( function() { + var selectee = $.data( this, "selectable-item" ); that._removeClass( selectee.$element, "ui-unselecting" ); selectee.unselecting = false; selectee.startselected = false; - that._trigger("unselected", event, { + that._trigger( "unselected", event, { unselected: selectee.element - }); - }); - $(".ui-selecting", this.element[0]).each(function() { - var selectee = $.data(this, "selectable-item"); + } ); + } ); + $( ".ui-selecting", this.element[ 0 ] ).each( function() { + var selectee = $.data( this, "selectable-item" ); that._removeClass( selectee.$element, "ui-selecting" ) ._addClass( selectee.$element, "ui-selected" ); selectee.selecting = false; selectee.selected = true; selectee.startselected = true; - that._trigger("selected", event, { + that._trigger( "selected", event, { selected: selectee.element - }); - }); - this._trigger("stop", event); + } ); + } ); + this._trigger( "stop", event ); this.helper.remove(); return false; } -}); +} ); -})); +} ) );