From 8c36603305bba105d03fe611c33e8ae5973b072b Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Scott=20Gonz=C3=A1lez?= Date: Thu, 15 Nov 2012 10:47:36 -0500 Subject: [PATCH 01/28] Dialog tests: Work around inconsistent handling of non-breaking spaces in IE7/8 with jQuery <1.8. --- tests/unit/dialog/dialog_options.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/tests/unit/dialog/dialog_options.js b/tests/unit/dialog/dialog_options.js index c58cf6915..331230318 100644 --- a/tests/unit/dialog/dialog_options.js +++ b/tests/unit/dialog/dialog_options.js @@ -424,8 +424,8 @@ test("title", function() { var el = $('
').dialog(); // some browsers return a non-breaking space and some return " " - // so we get the text to normalize to the actual non-breaking space - equal(el.dialog('widget').find(".ui-dialog-title").text(), " ", "[default]"); + // so we generate a non-breaking space for comparison + equal(titleText(), $( " " ).html(), "[default]"); equal(el.dialog("option", "title"), "", "option not changed"); el.remove(); From ccdceddd804458ed451b11660c161ef3cf8de5cd Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Scott=20Gonz=C3=A1lez?= Date: Thu, 15 Nov 2012 18:57:44 -0500 Subject: [PATCH 02/28] Datepicker tests: Work around encoding issues in oldIE. --- tests/unit/datepicker/datepicker_events.js | 11 ++++++++--- tests/unit/datepicker/datepicker_options.js | 10 ++++++++-- 2 files changed, 16 insertions(+), 5 deletions(-) diff --git a/tests/unit/datepicker/datepicker_events.js b/tests/unit/datepicker/datepicker_events.js index 5e8a35e0d..43b0a4b23 100644 --- a/tests/unit/datepicker/datepicker_events.js +++ b/tests/unit/datepicker/datepicker_events.js @@ -132,16 +132,21 @@ test('beforeShowDay-getDate', function() { dp = $('#ui-datepicker-div'); inp.val('01/01/2010').datepicker('show'); // contains non-breaking space - equal($('div.ui-datepicker-title').text(), 'January 2010', 'Initial month'); + equal($('div.ui-datepicker-title').text(), + // support: IE <9, jQuery <1.8 + // In IE7/8 with jQuery <1.8, encoded spaces behave in strange ways + $( "January 2010" ).text(), 'Initial month'); $('a.ui-datepicker-next', dp).click(); $('a.ui-datepicker-next', dp).click(); // contains non-breaking space - equal($('div.ui-datepicker-title').text(), 'March 2010', 'After next clicks'); + equal($('div.ui-datepicker-title').text(), + $( "March 2010" ).text(), 'After next clicks'); inp.datepicker('hide').datepicker('show'); $('a.ui-datepicker-prev', dp).click(); $('a.ui-datepicker-prev', dp).click(); // contains non-breaking space - equal($('div.ui-datepicker-title').text(), 'November 2009', 'After prev clicks'); + equal($('div.ui-datepicker-title').text(), + $( "November 2009" ).text(), 'After prev clicks'); inp.datepicker('hide'); }); diff --git a/tests/unit/datepicker/datepicker_options.js b/tests/unit/datepicker/datepicker_options.js index 7d2b070fa..8b8888780 100644 --- a/tests/unit/datepicker/datepicker_options.js +++ b/tests/unit/datepicker/datepicker_options.js @@ -146,7 +146,10 @@ test('otherMonths', function() { var inp = TestHelpers.datepicker.init('#inp'), pop = $('#ui-datepicker-div'); inp.val('06/01/2009').datepicker('show'); - equal(pop.find('tbody').text(), '\u00a0123456789101112131415161718192021222324252627282930\u00a0\u00a0\u00a0\u00a0', + equal(pop.find('tbody').text(), + // support: IE <9, jQuery <1.8 + // In IE7/8 with jQuery <1.8, encoded spaces behave in strange ways + $( "\u00a0123456789101112131415161718192021222324252627282930\u00a0\u00a0\u00a0\u00a0" ).text(), 'Other months - none'); ok(pop.find('td:last *').length === 0, 'Other months - no content'); inp.datepicker('hide').datepicker('option', 'showOtherMonths', true).datepicker('show'); @@ -158,7 +161,10 @@ test('otherMonths', function() { 'Other months - select'); ok(pop.find('td:last a').length === 1, 'Other months - link content'); inp.datepicker('hide').datepicker('option', 'showOtherMonths', false).datepicker('show'); - equal(pop.find('tbody').text(), '\u00a0123456789101112131415161718192021222324252627282930\u00a0\u00a0\u00a0\u00a0', + equal(pop.find('tbody').text(), + // support: IE <9, jQuery <1.8 + // In IE7/8 with jQuery <1.8, encoded spaces behave in strange ways + $( "\u00a0123456789101112131415161718192021222324252627282930\u00a0\u00a0\u00a0\u00a0" ).text(), 'Other months - none'); ok(pop.find('td:last *').length === 0, 'Other months - no content'); }); From a18863205e060bf9a145bb5ed90e36d8feb3c8f7 Mon Sep 17 00:00:00 2001 From: Juan Pablo Kaniefsky Date: Tue, 13 Nov 2012 22:05:59 -0300 Subject: [PATCH 03/28] Slider: when handles overlap, clicking and dragging will now pick the last one that was moved. Fixed #3467 - Sliders Handles can overlap, only small sliver of slider is selectable --- tests/unit/slider/slider_events.js | 51 ++++++++++++++++++++++++++++++ ui/jquery.ui.slider.js | 15 ++++----- 2 files changed, 57 insertions(+), 9 deletions(-) diff --git a/tests/unit/slider/slider_events.js b/tests/unit/slider/slider_events.js index 2fb9b37b6..b6fa6698d 100644 --- a/tests/unit/slider/slider_events.js +++ b/tests/unit/slider/slider_events.js @@ -104,4 +104,55 @@ test( "programmatic event triggers", function() { }); +test( "mouse based interaction part two: when handles overlap", function() { + expect(4); + + var el = $( "#slider1" ) + .slider({ + values: [ 0, 0, 0 ], + start: function( event, ui ) { + equal(handles.index(ui.handle), 2, "rightmost handle activated when overlapping at minimum (#3736)"); + } + }), + handles = el.find( ".ui-slider-handle" ); + handles.eq(0).simulate( "drag", { dx: 10 } ); + + QUnit.reset(); + el = $( "#slider1" ) + .slider({ + values: [ 10, 10, 10 ], + max: 10, + start: function( event, ui ) { + equal(handles.index(ui.handle), 0, "leftmost handle activated when overlapping at maximum"); + } + }), + handles = el.find( ".ui-slider-handle" ); + handles.eq(0).simulate( "drag", { dx: -10 } ); + + QUnit.reset(); + el = $( "#slider1" ) + .slider({ + values: [ 19, 20 ] + }), + handles = el.find( ".ui-slider-handle" ); + handles.eq(0).simulate( "drag", { dx: 10 } ); + el.on("slidestart", function(event, ui) { + equal(handles.index(ui.handle), 0, "left handle activated if left was moved last"); + }); + handles.eq(0).simulate( "drag", { dx: 10 } ); + + QUnit.reset(); + el = $( "#slider1" ) + .slider({ + values: [ 19, 20 ] + }), + handles = el.find( ".ui-slider-handle" ); + handles.eq(1).simulate( "drag", { dx: -10 } ); + el.on("slidestart", function(event, ui) { + equal(handles.index(ui.handle), 1, "right handle activated if right was moved last (#3467)"); + }); + handles.eq(0).simulate( "drag", { dx: 10 } ); + +}); + }( jQuery ) ); diff --git a/ui/jquery.ui.slider.js b/ui/jquery.ui.slider.js index 18f7113d4..90de25316 100644 --- a/ui/jquery.ui.slider.js +++ b/ui/jquery.ui.slider.js @@ -233,21 +233,15 @@ $.widget( "ui.slider", $.ui.mouse, { distance = this._valueMax() - this._valueMin() + 1; this.handles.each(function( i ) { var thisDistance = Math.abs( normValue - that.values(i) ); - if ( distance > thisDistance ) { + if (( distance > thisDistance ) || + ( distance === thisDistance && + (i === that._lastChangedValue || that.values(i) === o.min ))) { distance = thisDistance; closestHandle = $( this ); index = i; } }); - // workaround for bug #3736 (if both handles of a range are at 0, - // the first is always used as the one with least distance, - // and moving it is obviously prevented by preventing negative ranges) - if( o.range === true && this.values(1) === o.min ) { - index += 1; - closestHandle = $( this.handles[index] ); - } - allowed = this._start( event, index ); if ( allowed === false ) { return false; @@ -419,6 +413,9 @@ $.widget( "ui.slider", $.ui.mouse, { uiHash.values = this.values(); } + //store the last changed value index for reference when handles overlap + this._lastChangedValue = index; + this._trigger( "change", event, uiHash ); } }, From 8f46418c35e597e81ba043f15b25258ab54483f0 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Scott=20Gonz=C3=A1lez?= Date: Fri, 16 Nov 2012 11:20:58 -0500 Subject: [PATCH 04/28] Slider tests: Don't use QUnit.reset() or on(). --- tests/unit/slider/slider_events.js | 13 +++++-------- 1 file changed, 5 insertions(+), 8 deletions(-) diff --git a/tests/unit/slider/slider_events.js b/tests/unit/slider/slider_events.js index b6fa6698d..d5e7dff45 100644 --- a/tests/unit/slider/slider_events.js +++ b/tests/unit/slider/slider_events.js @@ -70,7 +70,6 @@ test( "programmatic event triggers", function() { }) .slider( "value", 0 ); - QUnit.reset(); // Test values method el = $( "
" ) .slider({ @@ -81,7 +80,6 @@ test( "programmatic event triggers", function() { }) .slider( "values", [80, 90] ); - QUnit.reset(); // Test value option el = $( "
" ) .slider({ @@ -91,7 +89,6 @@ test( "programmatic event triggers", function() { }) .slider( "option", "value", 0 ); - QUnit.reset(); // Test values option el = $( "
" ) .slider({ @@ -116,8 +113,8 @@ test( "mouse based interaction part two: when handles overlap", function() { }), handles = el.find( ".ui-slider-handle" ); handles.eq(0).simulate( "drag", { dx: 10 } ); + el.slider( "destroy" ); - QUnit.reset(); el = $( "#slider1" ) .slider({ values: [ 10, 10, 10 ], @@ -128,27 +125,27 @@ test( "mouse based interaction part two: when handles overlap", function() { }), handles = el.find( ".ui-slider-handle" ); handles.eq(0).simulate( "drag", { dx: -10 } ); + el.slider( "destroy" ); - QUnit.reset(); el = $( "#slider1" ) .slider({ values: [ 19, 20 ] }), handles = el.find( ".ui-slider-handle" ); handles.eq(0).simulate( "drag", { dx: 10 } ); - el.on("slidestart", function(event, ui) { + el.one("slidestart", function(event, ui) { equal(handles.index(ui.handle), 0, "left handle activated if left was moved last"); }); handles.eq(0).simulate( "drag", { dx: 10 } ); + el.slider( "destroy" ); - QUnit.reset(); el = $( "#slider1" ) .slider({ values: [ 19, 20 ] }), handles = el.find( ".ui-slider-handle" ); handles.eq(1).simulate( "drag", { dx: -10 } ); - el.on("slidestart", function(event, ui) { + el.one("slidestart", function(event, ui) { equal(handles.index(ui.handle), 1, "right handle activated if right was moved last (#3467)"); }); handles.eq(0).simulate( "drag", { dx: 10 } ); From 23f7e30c77820904cc1813fc8b54b809b352a551 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Scott=20Gonz=C3=A1lez?= Date: Fri, 16 Nov 2012 16:10:22 -0500 Subject: [PATCH 05/28] Tabs: Remove ui-tabs-aria-controls data on destroy. --- tests/unit/tabs/tabs_methods.js | 5 ++++- ui/jquery.ui.tabs.js | 4 +++- 2 files changed, 7 insertions(+), 2 deletions(-) diff --git a/tests/unit/tabs/tabs_methods.js b/tests/unit/tabs/tabs_methods.js index 076c3f379..a3d663f27 100644 --- a/tests/unit/tabs/tabs_methods.js +++ b/tests/unit/tabs/tabs_methods.js @@ -6,10 +6,13 @@ var disabled = TestHelpers.tabs.disabled, module( "tabs: methods" ); test( "destroy", function() { - expect( 1 ); + expect( 2 ); domEqual( "#tabs1", function() { $( "#tabs1" ).tabs().tabs( "destroy" ); }); + domEqual( "#tabs2", function() { + $( "#tabs2" ).tabs().tabs( "destroy" ); + }); }); test( "enable", function() { diff --git a/ui/jquery.ui.tabs.js b/ui/jquery.ui.tabs.js index 5b5227128..e557c6cec 100644 --- a/ui/jquery.ui.tabs.js +++ b/ui/jquery.ui.tabs.js @@ -710,7 +710,9 @@ $.widget( "ui.tabs", { var li = $( this ), prev = li.data( "ui-tabs-aria-controls" ); if ( prev ) { - li.attr( "aria-controls", prev ); + li + .attr( "aria-controls", prev ) + .removeData( "ui-tabs-aria-controls" ); } else { li.removeAttr( "aria-controls" ); } From 3541c5408203557b389625115fd1eddab99006bc Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Scott=20Gonz=C3=A1lez?= Date: Fri, 16 Nov 2012 16:57:36 -0500 Subject: [PATCH 06/28] Tabs: Removed some legacy code that isn't doing anything. --- ui/jquery.ui.tabs.js | 2 -- 1 file changed, 2 deletions(-) diff --git a/ui/jquery.ui.tabs.js b/ui/jquery.ui.tabs.js index e557c6cec..0b6480123 100644 --- a/ui/jquery.ui.tabs.js +++ b/ui/jquery.ui.tabs.js @@ -684,8 +684,6 @@ $.widget( "ui.tabs", { .removeClass( "ui-tabs-anchor" ) .removeAttr( "role" ) .removeAttr( "tabIndex" ) - .removeData( "href.tabs" ) - .removeData( "load.tabs" ) .removeUniqueId(); this.tabs.add( this.panels ).each(function() { From 9eaa572de189434521cf5cb307e37c2e65fb1f9f Mon Sep 17 00:00:00 2001 From: Mike Sherov Date: Sat, 17 Nov 2012 00:08:01 -0500 Subject: [PATCH 07/28] Dev: Make resizable pass JSHint without any settings overrides --- ui/jquery.ui.resizable.js | 476 ++++++++++++++++++++++++-------------- 1 file changed, 306 insertions(+), 170 deletions(-) diff --git a/ui/jquery.ui.resizable.js b/ui/jquery.ui.resizable.js index a27a140b2..50cc19e47 100644 --- a/ui/jquery.ui.resizable.js +++ b/ui/jquery.ui.resizable.js @@ -15,8 +15,6 @@ */ (function( $, undefined ) { -/*jshint onevar: false, curly: false, eqeqeq: false, funcscope: true, loopfunc: true */ - function num(v) { return parseInt(v, 10) || 0; } @@ -48,7 +46,9 @@ $.widget("ui.resizable", $.ui.mouse, { }, _create: function() { - var that = this, o = this.options; + var n, i, handle, axis, hname, + that = this, + o = this.options; this.element.addClass("ui-resizable"); $.extend(this, { @@ -100,21 +100,26 @@ $.widget("ui.resizable", $.ui.mouse, { } this.handles = o.handles || (!$('.ui-resizable-handle', this.element).length ? "e,s,se" : { n: '.ui-resizable-n', e: '.ui-resizable-e', s: '.ui-resizable-s', w: '.ui-resizable-w', se: '.ui-resizable-se', sw: '.ui-resizable-sw', ne: '.ui-resizable-ne', nw: '.ui-resizable-nw' }); - if(this.handles.constructor == String) { + if(this.handles.constructor === String) { - if(this.handles == 'all') this.handles = 'n,e,s,w,se,sw,ne,nw'; - var n = this.handles.split(","); this.handles = {}; + if ( this.handles === 'all') { + this.handles = 'n,e,s,w,se,sw,ne,nw'; + } - for(var i = 0; i < n.length; i++) { + n = this.handles.split(","); + this.handles = {}; - var handle = $.trim(n[i]), hname = 'ui-resizable-'+handle; - var axis = $('
'); + for(i = 0; i < n.length; i++) { + + handle = $.trim(n[i]); + hname = 'ui-resizable-'+handle; + axis = $('
'); // Apply zIndex to all handles - see #7960 axis.css({ zIndex: o.zIndex }); //TODO : What's going on here? - if ('se' == handle) { + if ('se' === handle) { axis.addClass('ui-icon ui-icon-gripsmall-diagonal-se'); } @@ -127,23 +132,26 @@ $.widget("ui.resizable", $.ui.mouse, { this._renderAxis = function(target) { + var i, axis, padPos, padWrapper; + target = target || this.element; - for(var i in this.handles) { + for(i in this.handles) { - if(this.handles[i].constructor == String) + if(this.handles[i].constructor === String) { this.handles[i] = $(this.handles[i], this.element).show(); + } //Apply pad to wrapper element, needed to fix axis position (textarea, inputs, scrolls) if (this.elementIsWrapper && this.originalElement[0].nodeName.match(/textarea|input|select|button/i)) { - var axis = $(this.handles[i], this.element), padWrapper = 0; + axis = $(this.handles[i], this.element); //Checking the correct pad and border padWrapper = /sw|ne|nw|se|n|s/.test(i) ? axis.outerHeight() : axis.outerWidth(); //The padding type i have to apply... - var padPos = [ 'padding', + padPos = [ 'padding', /ne|nw|n/.test(i) ? 'Top' : /se|sw|s/.test(i) ? 'Bottom' : /^e$/.test(i) ? 'Right' : 'Left' ].join(""); @@ -155,9 +163,9 @@ $.widget("ui.resizable", $.ui.mouse, { } //TODO: What's that good for? There's not anything to be executed left - if(!$(this.handles[i]).length) + if(!$(this.handles[i]).length) { continue; - + } } }; @@ -170,8 +178,9 @@ $.widget("ui.resizable", $.ui.mouse, { //Matching axis name this._handles.mouseover(function() { if (!that.resizing) { - if (this.className) - var axis = this.className.match(/ui-resizable-(se|sw|ne|nw|n|e|s|w)/i); + if (this.className) { + axis = this.className.match(/ui-resizable-(se|sw|ne|nw|n|e|s|w)/i); + } //Axis, default = se that.axis = axis && axis[1] ? axis[1] : 'se'; } @@ -183,12 +192,16 @@ $.widget("ui.resizable", $.ui.mouse, { $(this.element) .addClass("ui-resizable-autohide") .mouseenter(function() { - if (o.disabled) return; + if (o.disabled) { + return; + } $(this).removeClass("ui-resizable-autohide"); that._handles.show(); }) .mouseleave(function(){ - if (o.disabled) return; + if (o.disabled) { + return; + } if (!that.resizing) { $(this).addClass("ui-resizable-autohide"); that._handles.hide(); @@ -205,15 +218,16 @@ $.widget("ui.resizable", $.ui.mouse, { this._mouseDestroy(); - var _destroy = function(exp) { - $(exp).removeClass("ui-resizable ui-resizable-disabled ui-resizable-resizing") - .removeData("resizable").removeData("ui-resizable").unbind(".resizable").find('.ui-resizable-handle').remove(); - }; + var wrapper, + _destroy = function(exp) { + $(exp).removeClass("ui-resizable ui-resizable-disabled ui-resizable-resizing") + .removeData("resizable").removeData("ui-resizable").unbind(".resizable").find('.ui-resizable-handle').remove(); + }; //TODO: Unwrap at same DOM position if (this.elementIsWrapper) { _destroy(this.element); - var wrapper = this.element; + wrapper = this.element; this.originalElement.css({ position: wrapper.css('position'), width: wrapper.outerWidth(), @@ -231,10 +245,12 @@ $.widget("ui.resizable", $.ui.mouse, { }, _mouseCapture: function(event) { - var capture = false; - for (var i in this.handles) { - var handle = $(this.handles[i])[0]; - if (handle == event.target || $.contains(handle, event.target)) { + var i, handle, + capture = false; + + for (i in this.handles) { + handle = $(this.handles[i])[0]; + if (handle === event.target || $.contains(handle, event.target)) { capture = true; } } @@ -244,7 +260,10 @@ $.widget("ui.resizable", $.ui.mouse, { _mouseStart: function(event) { - var o = this.options, iniPos = this.element.position(), el = this.element; + var curleft, curtop, cursor, + o = this.options, + iniPos = this.element.position(), + el = this.element; this.resizing = true; this.documentScroll = { top: $(document).scrollTop(), left: $(document).scrollLeft() }; @@ -256,7 +275,8 @@ $.widget("ui.resizable", $.ui.mouse, { this._renderProxy(); - var curleft = num(this.helper.css('left')), curtop = num(this.helper.css('top')); + curleft = num(this.helper.css('left')); + curtop = num(this.helper.css('top')); if (o.containment) { curleft += $(o.containment).scrollLeft() || 0; @@ -273,10 +293,10 @@ $.widget("ui.resizable", $.ui.mouse, { this.originalMousePosition = { left: event.pageX, top: event.pageY }; //Aspect Ratio - this.aspectRatio = (typeof o.aspectRatio == 'number') ? o.aspectRatio : ((this.originalSize.width / this.originalSize.height) || 1); + this.aspectRatio = (typeof o.aspectRatio === 'number') ? o.aspectRatio : ((this.originalSize.width / this.originalSize.height) || 1); - var cursor = $('.ui-resizable-' + this.axis).css('cursor'); - $('body').css('cursor', cursor == 'auto' ? this.axis + '-resize' : cursor); + cursor = $('.ui-resizable-' + this.axis).css('cursor'); + $('body').css('cursor', cursor === 'auto' ? this.axis + '-resize' : cursor); el.addClass("ui-resizable-resizing"); this._propagate("start", event); @@ -286,22 +306,30 @@ $.widget("ui.resizable", $.ui.mouse, { _mouseDrag: function(event) { //Increase performance, avoid regex - var el = this.helper, props = {}, - smp = this.originalMousePosition, a = this.axis, - prevTop = this.position.top, prevLeft = this.position.left, - prevWidth = this.size.width, prevHeight = this.size.height; + var data, + el = this.helper, props = {}, + smp = this.originalMousePosition, + a = this.axis, + prevTop = this.position.top, + prevLeft = this.position.left, + prevWidth = this.size.width, + prevHeight = this.size.height, + dx = (event.pageX-smp.left)||0, + dy = (event.pageY-smp.top)||0, + trigger = this._change[a]; - var dx = (event.pageX-smp.left)||0, dy = (event.pageY-smp.top)||0; - var trigger = this._change[a]; - if (!trigger) return false; + if (!trigger) { + return false; + } // Calculate the attrs that will be change - var data = trigger.apply(this, [event, dx, dy]); + data = trigger.apply(this, [event, dx, dy]); // Put this in the mouseDrag handler since the user can start pressing shift while resizing this._updateVirtualBoundaries(event.shiftKey); - if (this._aspectRatio || event.shiftKey) + if (this._aspectRatio || event.shiftKey) { data = this._updateRatio(data, event); + } data = this._respectSize(data, event); @@ -324,8 +352,9 @@ $.widget("ui.resizable", $.ui.mouse, { } el.css(props); - if (!this._helper && this._proportionallyResizeElements.length) + if (!this._helper && this._proportionallyResizeElements.length) { this._proportionallyResize(); + } // Call the user callback if the element was resized if ( ! $.isEmptyObject(props) ) { @@ -338,24 +367,30 @@ $.widget("ui.resizable", $.ui.mouse, { _mouseStop: function(event) { this.resizing = false; - var o = this.options, that = this; + var pr, ista, soffseth, soffsetw, s, left, top, + o = this.options, that = this; if(this._helper) { - var pr = this._proportionallyResizeElements, ista = pr.length && (/textarea/i).test(pr[0].nodeName), - soffseth = ista && $.ui.hasScroll(pr[0], 'left') /* TODO - jump height */ ? 0 : that.sizeDiff.height, - soffsetw = ista ? 0 : that.sizeDiff.width; - var s = { width: (that.helper.width() - soffsetw), height: (that.helper.height() - soffseth) }, - left = (parseInt(that.element.css('left'), 10) + (that.position.left - that.originalPosition.left)) || null, - top = (parseInt(that.element.css('top'), 10) + (that.position.top - that.originalPosition.top)) || null; + pr = this._proportionallyResizeElements; + ista = pr.length && (/textarea/i).test(pr[0].nodeName); + soffseth = ista && $.ui.hasScroll(pr[0], 'left') /* TODO - jump height */ ? 0 : that.sizeDiff.height; + soffsetw = ista ? 0 : that.sizeDiff.width; - if (!o.animate) + s = { width: (that.helper.width() - soffsetw), height: (that.helper.height() - soffseth) }; + left = (parseInt(that.element.css('left'), 10) + (that.position.left - that.originalPosition.left)) || null; + top = (parseInt(that.element.css('top'), 10) + (that.position.top - that.originalPosition.top)) || null; + + if (!o.animate) { this.element.css($.extend(s, { top: top, left: left })); + } that.helper.height(that.size.height); that.helper.width(that.size.width); - if (this._helper && !o.animate) this._proportionallyResize(); + if (this._helper && !o.animate) { + this._proportionallyResize(); + } } $('body').css('cursor', 'auto'); @@ -364,13 +399,17 @@ $.widget("ui.resizable", $.ui.mouse, { this._propagate("stop", event); - if (this._helper) this.helper.remove(); + if (this._helper) { + this.helper.remove(); + } + return false; }, _updateVirtualBoundaries: function(forceAspectRatio) { - var o = this.options, pMinWidth, pMaxWidth, pMinHeight, pMaxHeight, b; + var pMinWidth, pMaxWidth, pMinHeight, pMaxHeight, b, + o = this.options; b = { minWidth: isNumber(o.minWidth) ? o.minWidth : 0, @@ -387,34 +426,55 @@ $.widget("ui.resizable", $.ui.mouse, { pMaxWidth = b.maxHeight * this.aspectRatio; pMaxHeight = b.maxWidth / this.aspectRatio; - if(pMinWidth > b.minWidth) b.minWidth = pMinWidth; - if(pMinHeight > b.minHeight) b.minHeight = pMinHeight; - if(pMaxWidth < b.maxWidth) b.maxWidth = pMaxWidth; - if(pMaxHeight < b.maxHeight) b.maxHeight = pMaxHeight; + if(pMinWidth > b.minWidth) { + b.minWidth = pMinWidth; + } + if(pMinHeight > b.minHeight) { + b.minHeight = pMinHeight; + } + if(pMaxWidth < b.maxWidth) { + b.maxWidth = pMaxWidth; + } + if(pMaxHeight < b.maxHeight) { + b.maxHeight = pMaxHeight; + } } this._vBoundaries = b; }, _updateCache: function(data) { this.offset = this.helper.offset(); - if (isNumber(data.left)) this.position.left = data.left; - if (isNumber(data.top)) this.position.top = data.top; - if (isNumber(data.height)) this.size.height = data.height; - if (isNumber(data.width)) this.size.width = data.width; + if (isNumber(data.left)) { + this.position.left = data.left; + } + if (isNumber(data.top)) { + this.position.top = data.top; + } + if (isNumber(data.height)) { + this.size.height = data.height; + } + if (isNumber(data.width)) { + this.size.width = data.width; + } }, _updateRatio: function( data ) { - var cpos = this.position, csize = this.size, a = this.axis; + var cpos = this.position, + csize = this.size, + a = this.axis; - if (isNumber(data.height)) data.width = (data.height * this.aspectRatio); - else if (isNumber(data.width)) data.height = (data.width / this.aspectRatio); + if (isNumber(data.height)) { + data.width = (data.height * this.aspectRatio); + } else if (isNumber(data.width)) { + data.height = (data.width / this.aspectRatio); + } - if (a == 'sw') { + if (a === 'sw') { data.left = cpos.left + (csize.width - data.width); data.top = null; } - if (a == 'nw') { + if (a === 'nw') { data.top = cpos.top + (csize.height - data.height); data.left = cpos.left + (csize.width - data.width); } @@ -424,48 +484,70 @@ $.widget("ui.resizable", $.ui.mouse, { _respectSize: function( data ) { - var o = this._vBoundaries, a = this.axis, + var o = this._vBoundaries, + a = this.axis, ismaxw = isNumber(data.width) && o.maxWidth && (o.maxWidth < data.width), ismaxh = isNumber(data.height) && o.maxHeight && (o.maxHeight < data.height), - isminw = isNumber(data.width) && o.minWidth && (o.minWidth > data.width), isminh = isNumber(data.height) && o.minHeight && (o.minHeight > data.height); + isminw = isNumber(data.width) && o.minWidth && (o.minWidth > data.width), isminh = isNumber(data.height) && o.minHeight && (o.minHeight > data.height), + dw = this.originalPosition.left + this.originalSize.width, + dh = this.position.top + this.size.height, + cw = /sw|nw|w/.test(a), ch = /nw|ne|n/.test(a); + if (isminw) { + data.width = o.minWidth; + } + if (isminh) { + data.height = o.minHeight; + } + if (ismaxw) { + data.width = o.maxWidth; + } + if (ismaxh) { + data.height = o.maxHeight; + } - if (isminw) data.width = o.minWidth; - if (isminh) data.height = o.minHeight; - if (ismaxw) data.width = o.maxWidth; - if (ismaxh) data.height = o.maxHeight; - - var dw = this.originalPosition.left + this.originalSize.width, dh = this.position.top + this.size.height; - var cw = /sw|nw|w/.test(a), ch = /nw|ne|n/.test(a); - - if (isminw && cw) data.left = dw - o.minWidth; - if (ismaxw && cw) data.left = dw - o.maxWidth; - if (isminh && ch) data.top = dh - o.minHeight; - if (ismaxh && ch) data.top = dh - o.maxHeight; + if (isminw && cw) { + data.left = dw - o.minWidth; + } + if (ismaxw && cw) { + data.left = dw - o.maxWidth; + } + if (isminh && ch) { + data.top = dh - o.minHeight; + } + if (ismaxh && ch) { + data.top = dh - o.maxHeight; + } // fixing jump error on top/left - bug #2330 - var isNotwh = !data.width && !data.height; - if (isNotwh && !data.left && data.top) data.top = null; - else if (isNotwh && !data.top && data.left) data.left = null; + if (!data.width && !data.height && !data.left && data.top) { + data.top = null; + } else if (!data.width && !data.height && !data.top && data.left) { + data.left = null; + } return data; }, _proportionallyResize: function() { - if (!this._proportionallyResizeElements.length) return; - var element = this.helper || this.element; + if (!this._proportionallyResizeElements.length) { + return; + } - for (var i=0; i < this._proportionallyResizeElements.length; i++) { + var i, j, borders, paddings, prel, + element = this.helper || this.element; - var prel = this._proportionallyResizeElements[i]; + for ( i=0; i < this._proportionallyResizeElements.length; i++) { + + prel = this._proportionallyResizeElements[i]; if (!this.borderDif) { - var b = [prel.css('borderTopWidth'), prel.css('borderRightWidth'), prel.css('borderBottomWidth'), prel.css('borderLeftWidth')], - p = [prel.css('paddingTop'), prel.css('paddingRight'), prel.css('paddingBottom'), prel.css('paddingLeft')]; + this.borderDif = []; + borders = [prel.css('borderTopWidth'), prel.css('borderRightWidth'), prel.css('borderBottomWidth'), prel.css('borderLeftWidth')]; + paddings = [prel.css('paddingTop'), prel.css('paddingRight'), prel.css('paddingBottom'), prel.css('paddingLeft')]; - this.borderDif = $.map(b, function(v, i) { - var border = parseInt(v,10)||0, padding = parseInt(p[i],10)||0; - return border + padding; - }); + for ( j = 0; j < borders.length; j++ ) { + this.borderDif[ j ] = ( parseInt( borders[ j ], 10 ) || 0 ) + ( parseInt( paddings[ j ], 10 ) || 0 ); + } } prel.css({ @@ -536,7 +618,7 @@ $.widget("ui.resizable", $.ui.mouse, { _propagate: function(n, event) { $.ui.plugin.call(this, n, [event, this.ui()]); - (n != "resize" && this._trigger(n, event, this.ui())); + (n !== "resize" && this._trigger(n, event, this.ui())); }, plugins: {}, @@ -562,19 +644,19 @@ $.widget("ui.resizable", $.ui.mouse, { $.ui.plugin.add("resizable", "alsoResize", { start: function () { - var that = $(this).data("ui-resizable"), o = that.options; - - var _store = function (exp) { - $(exp).each(function() { - var el = $(this); - el.data("ui-resizable-alsoresize", { - width: parseInt(el.width(), 10), height: parseInt(el.height(), 10), - left: parseInt(el.css('left'), 10), top: parseInt(el.css('top'), 10) + var that = $(this).data("ui-resizable"), + o = that.options, + _store = function (exp) { + $(exp).each(function() { + var el = $(this); + el.data("ui-resizable-alsoresize", { + width: parseInt(el.width(), 10), height: parseInt(el.height(), 10), + left: parseInt(el.css('left'), 10), top: parseInt(el.css('top'), 10) + }); }); - }); - }; + }; - if (typeof(o.alsoResize) == 'object' && !o.alsoResize.parentNode) { + if (typeof(o.alsoResize) === 'object' && !o.alsoResize.parentNode) { if (o.alsoResize.length) { o.alsoResize = o.alsoResize[0]; _store(o.alsoResize); } else { $.each(o.alsoResize, function (exp) { _store(exp); }); } }else{ @@ -583,29 +665,32 @@ $.ui.plugin.add("resizable", "alsoResize", { }, resize: function (event, ui) { - var that = $(this).data("ui-resizable"), o = that.options, os = that.originalSize, op = that.originalPosition; + var that = $(this).data("ui-resizable"), + o = that.options, + os = that.originalSize, + op = that.originalPosition, + delta = { + height: (that.size.height - os.height) || 0, width: (that.size.width - os.width) || 0, + top: (that.position.top - op.top) || 0, left: (that.position.left - op.left) || 0 + }, - var delta = { - height: (that.size.height - os.height) || 0, width: (that.size.width - os.width) || 0, - top: (that.position.top - op.top) || 0, left: (that.position.left - op.left) || 0 - }, + _alsoResize = function (exp, c) { + $(exp).each(function() { + var el = $(this), start = $(this).data("ui-resizable-alsoresize"), style = {}, + css = c && c.length ? c : el.parents(ui.originalElement[0]).length ? ['width', 'height'] : ['width', 'height', 'top', 'left']; - _alsoResize = function (exp, c) { - $(exp).each(function() { - var el = $(this), start = $(this).data("ui-resizable-alsoresize"), style = {}, - css = c && c.length ? c : el.parents(ui.originalElement[0]).length ? ['width', 'height'] : ['width', 'height', 'top', 'left']; + $.each(css, function (i, prop) { + var sum = (start[prop]||0) + (delta[prop]||0); + if (sum && sum >= 0) { + style[prop] = sum || null; + } + }); - $.each(css, function (i, prop) { - var sum = (start[prop]||0) + (delta[prop]||0); - if (sum && sum >= 0) - style[prop] = sum || null; + el.css(style); }); + }; - el.css(style); - }); - }; - - if (typeof(o.alsoResize) == 'object' && !o.alsoResize.nodeType) { + if (typeof(o.alsoResize) === 'object' && !o.alsoResize.nodeType) { $.each(o.alsoResize, function (exp, c) { _alsoResize(exp, c); }); }else{ _alsoResize(o.alsoResize); @@ -620,15 +705,15 @@ $.ui.plugin.add("resizable", "alsoResize", { $.ui.plugin.add("resizable", "animate", { stop: function( event ) { - var that = $(this).data("ui-resizable"), o = that.options; - - var pr = that._proportionallyResizeElements, ista = pr.length && (/textarea/i).test(pr[0].nodeName), - soffseth = ista && $.ui.hasScroll(pr[0], 'left') /* TODO - jump height */ ? 0 : that.sizeDiff.height, - soffsetw = ista ? 0 : that.sizeDiff.width; - - var style = { width: (that.size.width - soffsetw), height: (that.size.height - soffseth) }, - left = (parseInt(that.element.css('left'), 10) + (that.position.left - that.originalPosition.left)) || null, - top = (parseInt(that.element.css('top'), 10) + (that.position.top - that.originalPosition.top)) || null; + var that = $(this).data("ui-resizable"), + o = that.options, + pr = that._proportionallyResizeElements, + ista = pr.length && (/textarea/i).test(pr[0].nodeName), + soffseth = ista && $.ui.hasScroll(pr[0], 'left') /* TODO - jump height */ ? 0 : that.sizeDiff.height, + soffsetw = ista ? 0 : that.sizeDiff.width, + style = { width: (that.size.width - soffsetw), height: (that.size.height - soffseth) }, + left = (parseInt(that.element.css('left'), 10) + (that.position.left - that.originalPosition.left)) || null, + top = (parseInt(that.element.css('top'), 10) + (that.position.top - that.originalPosition.top)) || null; that.element.animate( $.extend(style, top && left ? { top: top, left: left } : {}), { @@ -643,7 +728,9 @@ $.ui.plugin.add("resizable", "animate", { left: parseInt(that.element.css('left'), 10) }; - if (pr && pr.length) $(pr[0]).css({ width: data.width, height: data.height }); + if (pr && pr.length) { + $(pr[0]).css({ width: data.width, height: data.height }); + } // propagating resize, and updating values for each animation step that._updateCache(data); @@ -659,13 +746,20 @@ $.ui.plugin.add("resizable", "animate", { $.ui.plugin.add("resizable", "containment", { start: function() { - var that = $(this).data("ui-resizable"), o = that.options, el = that.element; - var oc = o.containment, ce = (oc instanceof $) ? oc.get(0) : (/parent/.test(oc)) ? el.parent().get(0) : oc; - if (!ce) return; + var element, p, co, ch, cw, width, height, + that = $(this).data("ui-resizable"), + o = that.options, + el = that.element, + oc = o.containment, + ce = (oc instanceof $) ? oc.get(0) : (/parent/.test(oc)) ? el.parent().get(0) : oc; + + if (!ce) { + return; + } that.containerElement = $(ce); - if (/document/.test(oc) || oc == document) { + if (/document/.test(oc) || oc === document) { that.containerOffset = { left: 0, top: 0 }; that.containerPosition = { left: 0, top: 0 }; @@ -677,15 +771,19 @@ $.ui.plugin.add("resizable", "containment", { // i'm a node, so compute top, left, right, bottom else { - var element = $(ce), p = []; + element = $(ce); + p = []; $([ "Top", "Right", "Left", "Bottom" ]).each(function(i, name) { p[i] = num(element.css("padding" + name)); }); that.containerOffset = element.offset(); that.containerPosition = element.position(); that.containerSize = { height: (element.innerHeight() - p[3]), width: (element.innerWidth() - p[1]) }; - var co = that.containerOffset, ch = that.containerSize.height, cw = that.containerSize.width, - width = ($.ui.hasScroll(ce, "left") ? ce.scrollWidth : cw ), height = ($.ui.hasScroll(ce) ? ce.scrollHeight : ch); + co = that.containerOffset; + ch = that.containerSize.height; + cw = that.containerSize.width; + width = ($.ui.hasScroll(ce, "left") ? ce.scrollWidth : cw ); + height = ($.ui.hasScroll(ce) ? ce.scrollHeight : ch); that.parentData = { element: ce, left: co.left, top: co.top, width: width, height: height @@ -694,57 +792,79 @@ $.ui.plugin.add("resizable", "containment", { }, resize: function( event ) { - var that = $(this).data("ui-resizable"), o = that.options, + var woset, hoset, isParent, isOffsetRelative, + that = $(this).data("ui-resizable"), + o = that.options, co = that.containerOffset, cp = that.position, - pRatio = that._aspectRatio || event.shiftKey, cop = { top:0, left:0 }, ce = that.containerElement; + pRatio = that._aspectRatio || event.shiftKey, + cop = { top:0, left:0 }, ce = that.containerElement; - if (ce[0] != document && (/static/).test(ce.css('position'))) cop = co; + if (ce[0] !== document && (/static/).test(ce.css('position'))) { + cop = co; + } if (cp.left < (that._helper ? co.left : 0)) { that.size.width = that.size.width + (that._helper ? (that.position.left - co.left) : (that.position.left - cop.left)); - if (pRatio) that.size.height = that.size.width / that.aspectRatio; + if (pRatio) { + that.size.height = that.size.width / that.aspectRatio; + } that.position.left = o.helper ? co.left : 0; } if (cp.top < (that._helper ? co.top : 0)) { that.size.height = that.size.height + (that._helper ? (that.position.top - co.top) : that.position.top); - if (pRatio) that.size.width = that.size.height * that.aspectRatio; + if (pRatio) { + that.size.width = that.size.height * that.aspectRatio; + } that.position.top = that._helper ? co.top : 0; } that.offset.left = that.parentData.left+that.position.left; that.offset.top = that.parentData.top+that.position.top; - var woset = Math.abs( (that._helper ? that.offset.left - cop.left : (that.offset.left - cop.left)) + that.sizeDiff.width ), - hoset = Math.abs( (that._helper ? that.offset.top - cop.top : (that.offset.top - co.top)) + that.sizeDiff.height ); + woset = Math.abs( (that._helper ? that.offset.left - cop.left : (that.offset.left - cop.left)) + that.sizeDiff.width ); + hoset = Math.abs( (that._helper ? that.offset.top - cop.top : (that.offset.top - co.top)) + that.sizeDiff.height ); - var isParent = that.containerElement.get(0) == that.element.parent().get(0), - isOffsetRelative = /relative|absolute/.test(that.containerElement.css('position')); + isParent = that.containerElement.get(0) === that.element.parent().get(0); + isOffsetRelative = /relative|absolute/.test(that.containerElement.css('position')); - if(isParent && isOffsetRelative) woset -= that.parentData.left; + if(isParent && isOffsetRelative) { + woset -= that.parentData.left; + } if (woset + that.size.width >= that.parentData.width) { that.size.width = that.parentData.width - woset; - if (pRatio) that.size.height = that.size.width / that.aspectRatio; + if (pRatio) { + that.size.height = that.size.width / that.aspectRatio; + } } if (hoset + that.size.height >= that.parentData.height) { that.size.height = that.parentData.height - hoset; - if (pRatio) that.size.width = that.size.height * that.aspectRatio; + if (pRatio) { + that.size.width = that.size.height * that.aspectRatio; + } } }, stop: function(){ - var that = $(this).data("ui-resizable"), o = that.options, - co = that.containerOffset, cop = that.containerPosition, ce = that.containerElement; + var that = $(this).data("ui-resizable"), + o = that.options, + co = that.containerOffset, + cop = that.containerPosition, + ce = that.containerElement, + helper = $(that.helper), + ho = helper.offset(), + w = helper.outerWidth() - that.sizeDiff.width, + h = helper.outerHeight() - that.sizeDiff.height; - var helper = $(that.helper), ho = helper.offset(), w = helper.outerWidth() - that.sizeDiff.width, h = helper.outerHeight() - that.sizeDiff.height; - - if (that._helper && !o.animate && (/relative/).test(ce.css('position'))) + if (that._helper && !o.animate && (/relative/).test(ce.css('position'))) { $(this).css({ left: ho.left - cop.left - co.left, width: w, height: h }); + } - if (that._helper && !o.animate && (/static/).test(ce.css('position'))) + if (that._helper && !o.animate && (/static/).test(ce.css('position'))) { $(this).css({ left: ho.left - cop.left - co.left, width: w, height: h }); + } } }); @@ -759,7 +879,7 @@ $.ui.plugin.add("resizable", "ghost", { that.ghost .css({ opacity: 0.25, display: 'block', position: 'relative', height: cs.height, width: cs.width, margin: 0, left: 0, top: 0 }) .addClass('ui-resizable-ghost') - .addClass(typeof o.ghost == 'string' ? o.ghost : ''); + .addClass(typeof o.ghost === 'string' ? o.ghost : ''); that.ghost.appendTo(that.helper); @@ -767,12 +887,16 @@ $.ui.plugin.add("resizable", "ghost", { resize: function(){ var that = $(this).data("ui-resizable"); - if (that.ghost) that.ghost.css({ position: 'relative', height: that.size.height, width: that.size.width }); + if (that.ghost) { + that.ghost.css({ position: 'relative', height: that.size.height, width: that.size.width }); + } }, stop: function() { var that = $(this).data("ui-resizable"); - if (that.ghost && that.helper) that.helper.get(0).removeChild(that.ghost.get(0)); + if (that.ghost && that.helper) { + that.helper.get(0).removeChild(that.ghost.get(0)); + } } }); @@ -780,13 +904,25 @@ $.ui.plugin.add("resizable", "ghost", { $.ui.plugin.add("resizable", "grid", { resize: function() { - var that = $(this).data("ui-resizable"), o = that.options, cs = that.size, os = that.originalSize, op = that.originalPosition, a = that.axis; - o.grid = typeof o.grid == "number" ? [o.grid, o.grid] : o.grid; - var gridX = (o.grid[0]||1), gridY = (o.grid[1]||1), - ox = Math.round((cs.width - os.width) / gridX) * gridX, oy = Math.round((cs.height - os.height) / gridY) * gridY, - newWidth = os.width + ox, newHeight = os.height + oy, - isMaxWidth = o.maxWidth && (o.maxWidth < newWidth), isMaxHeight = o.maxHeight && (o.maxHeight < newHeight), - isMinWidth = o.minWidth && (o.minWidth > newWidth), isMinHeight = o.minHeight && (o.minHeight > newHeight); + var that = $(this).data("ui-resizable"), + o = that.options, + cs = that.size, + os = that.originalSize, + op = that.originalPosition, + a = that.axis, + grid = typeof o.grid === "number" ? [o.grid, o.grid] : o.grid, + gridX = (grid[0]||1), + gridY = (grid[1]||1), + ox = Math.round((cs.width - os.width) / gridX) * gridX, + oy = Math.round((cs.height - os.height) / gridY) * gridY, + newWidth = os.width + ox, + newHeight = os.height + oy, + isMaxWidth = o.maxWidth && (o.maxWidth < newWidth), + isMaxHeight = o.maxHeight && (o.maxHeight < newHeight), + isMinWidth = o.minWidth && (o.minWidth > newWidth), + isMinHeight = o.minHeight && (o.minHeight > newHeight); + + o.grid = grid; if (isMinWidth) { newWidth = newWidth + gridX; From a1b32b59d57c2171af9ba0ed6b35ccde28794e3b Mon Sep 17 00:00:00 2001 From: Mike Sherov Date: Sat, 17 Nov 2012 01:29:39 -0500 Subject: [PATCH 08/28] Resizable: use css() instead of position() for absolute placement. Fixes #3815 - Resizable: absolutely positioned element inside scrollable element is repositioned when resized --- tests/unit/resizable/resizable_core.js | 23 ++++++++++++++++++++++- ui/jquery.ui.resizable.js | 5 +++-- 2 files changed, 25 insertions(+), 3 deletions(-) diff --git a/tests/unit/resizable/resizable_core.js b/tests/unit/resizable/resizable_core.js index 447499f05..13da26ece 100644 --- a/tests/unit/resizable/resizable_core.js +++ b/tests/unit/resizable/resizable_core.js @@ -162,7 +162,7 @@ test("handle with complex markup (#8756)", function() { ); var handle = '.ui-resizable-w div', target = $('#resizable1').resizable({ handles: 'all' }); - + TestHelpers.resizable.drag(handle, -50); equal( target.width(), 150, "compare width" ); @@ -170,4 +170,25 @@ test("handle with complex markup (#8756)", function() { equal( target.width(), 100, "compare width" ); }); +test("resizable accounts for scroll position correctly (#3815)", function() { + expect( 3 ); + + var position, top, left, + container = $("
").appendTo("#qunit-fixture"), + overflowed = $("
").appendTo( container ), + el = $("
").appendTo( overflowed ).resizable({ handles: 'all' }), + handle = ".ui-resizable-e"; + + container.scrollLeft( 100 ).scrollTop( 100 ); + + position = el.position(); + left = el.css("left"); + top = el.css("top"); + + TestHelpers.resizable.drag(handle, 50, 50); + deepEqual( el.position(), position, "position stays the same when resized" ); + equal( el.css("left"), left, "css('left') stays the same when resized" ); + equal( el.css("top"), top, "css('top') stays the same when resized" ); +}); + })(jQuery); diff --git a/ui/jquery.ui.resizable.js b/ui/jquery.ui.resizable.js index 50cc19e47..41f3c03c0 100644 --- a/ui/jquery.ui.resizable.js +++ b/ui/jquery.ui.resizable.js @@ -266,10 +266,11 @@ $.widget("ui.resizable", $.ui.mouse, { el = this.element; this.resizing = true; - this.documentScroll = { top: $(document).scrollTop(), left: $(document).scrollLeft() }; // bugfix for http://dev.jquery.com/ticket/1749 - if (el.is('.ui-draggable') || (/absolute/).test(el.css('position'))) { + if ( (/absolute/).test( el.css('position') ) ) { + el.css({ position: 'absolute', top: el.css('top'), left: el.css('left') }); + } else if (el.is('.ui-draggable')) { el.css({ position: 'absolute', top: iniPos.top, left: iniPos.left }); } From 5bae9a4763394b9ec038618b33fc78988be4d315 Mon Sep 17 00:00:00 2001 From: Mike Sherov Date: Fri, 16 Nov 2012 22:51:24 -0500 Subject: [PATCH 09/28] Dev: Make sortable pass JSHint with only the loopfunc setting override --- ui/jquery.ui.sortable.js | 557 ++++++++++++++++++++++++--------------- 1 file changed, 343 insertions(+), 214 deletions(-) diff --git a/ui/jquery.ui.sortable.js b/ui/jquery.ui.sortable.js index a98e46632..b1fb642fe 100644 --- a/ui/jquery.ui.sortable.js +++ b/ui/jquery.ui.sortable.js @@ -15,7 +15,8 @@ */ (function( $, undefined ) { -/*jshint onevar: false, curly: false, eqeqeq: false, laxbreak: true, shadow: true, loopfunc: true */ +/*jshint loopfunc: true */ + $.widget("ui.sortable", $.ui.mouse, { version: "@VERSION", widgetEventPrefix: "sort", @@ -72,8 +73,9 @@ $.widget("ui.sortable", $.ui.mouse, { .removeClass("ui-sortable ui-sortable-disabled"); this._mouseDestroy(); - for ( var i = this.items.length - 1; i >= 0; i-- ) + for ( var i = this.items.length - 1; i >= 0; i-- ) { this.items[i].item.removeData(this.widgetName + "-item"); + } return this; }, @@ -90,34 +92,44 @@ $.widget("ui.sortable", $.ui.mouse, { }, _mouseCapture: function(event, overrideHandle) { - var that = this; + var currentItem = null, + validHandle = false, + that = this; if (this.reverting) { return false; } - if(this.options.disabled || this.options.type == 'static') return false; + if(this.options.disabled || this.options.type === 'static') { + return false; + } //We have to refresh the items data once first this._refreshItems(event); //Find out if the clicked node (or one of its parents) is a actual item in this.items - var currentItem = null; - $(event.target).parents().each(function() { - if($.data(this, that.widgetName + '-item') == that) { + if($.data(this, that.widgetName + '-item') === that) { currentItem = $(this); return false; } }); - if($.data(event.target, that.widgetName + '-item') == that) currentItem = $(event.target); + if($.data(event.target, that.widgetName + '-item') === that) { + currentItem = $(event.target); + } - if(!currentItem) return false; + if(!currentItem) { + return false; + } if(this.options.handle && !overrideHandle) { - var validHandle = false; - - $(this.options.handle, currentItem).find("*").andSelf().each(function() { if(this == event.target) validHandle = true; }); - if(!validHandle) return false; + $(this.options.handle, currentItem).find("*").andSelf().each(function() { + if(this === event.target) { + validHandle = true; + } + }); + if(!validHandle) { + return false; + } } this.currentItem = currentItem; @@ -128,7 +140,9 @@ $.widget("ui.sortable", $.ui.mouse, { _mouseStart: function(event, overrideHandle, noActivation) { - var o = this.options; + var i, + o = this.options; + this.currentContainer = this; //We only need to call refreshPositions, because the refreshItems call has been moved to mouseCapture @@ -184,7 +198,7 @@ $.widget("ui.sortable", $.ui.mouse, { this.domPosition = { prev: this.currentItem.prev()[0], parent: this.currentItem.parent()[0] }; //If the helper is not the original, hide the original so it's not playing any role during the drag, won't cause anything bad this way - if(this.helper[0] != this.currentItem[0]) { + if(this.helper[0] !== this.currentItem[0]) { this.currentItem.hide(); } @@ -192,47 +206,60 @@ $.widget("ui.sortable", $.ui.mouse, { this._createPlaceholder(); //Set a containment if given in the options - if(o.containment) + if(o.containment) { this._setContainment(); + } if(o.cursor) { // cursor option - if ($('body').css("cursor")) this._storedCursor = $('body').css("cursor"); + if ($('body').css("cursor")) { + this._storedCursor = $('body').css("cursor"); + } $('body').css("cursor", o.cursor); } if(o.opacity) { // opacity option - if (this.helper.css("opacity")) this._storedOpacity = this.helper.css("opacity"); + if (this.helper.css("opacity")) { + this._storedOpacity = this.helper.css("opacity"); + } this.helper.css("opacity", o.opacity); } if(o.zIndex) { // zIndex option - if (this.helper.css("zIndex")) this._storedZIndex = this.helper.css("zIndex"); + if (this.helper.css("zIndex")) { + this._storedZIndex = this.helper.css("zIndex"); + } this.helper.css("zIndex", o.zIndex); } //Prepare scrolling - if(this.scrollParent[0] != document && this.scrollParent[0].tagName != 'HTML') + if(this.scrollParent[0] !== document && this.scrollParent[0].tagName !== 'HTML') { this.overflowOffset = this.scrollParent.offset(); + } //Call callbacks this._trigger("start", event, this._uiHash()); //Recache the helper size - if(!this._preserveHelperProportions) + if(!this._preserveHelperProportions) { this._cacheHelperProportions(); + } //Post 'activate' events to possible containers - if(!noActivation) { - for (var i = this.containers.length - 1; i >= 0; i--) { this.containers[i]._trigger("activate", event, this._uiHash(this)); } + if( !noActivation ) { + for ( i = this.containers.length - 1; i >= 0; i-- ) { + this.containers[ i ]._trigger( "activate", event, this._uiHash( this ) ); + } } //Prepare possible droppables - if($.ui.ddmanager) + if($.ui.ddmanager) { $.ui.ddmanager.current = this; + } - if ($.ui.ddmanager && !o.dropBehaviour) + if ($.ui.ddmanager && !o.dropBehaviour) { $.ui.ddmanager.prepareOffsets(this, event); + } this.dragging = true; @@ -243,6 +270,9 @@ $.widget("ui.sortable", $.ui.mouse, { }, _mouseDrag: function(event) { + var i, item, itemElement, intersection, + o = this.options, + scrolled = false; //Compute the helpers position this.position = this._generatePosition(event); @@ -254,50 +284,62 @@ $.widget("ui.sortable", $.ui.mouse, { //Do scrolling if(this.options.scroll) { - var o = this.options, scrolled = false; - if(this.scrollParent[0] != document && this.scrollParent[0].tagName != 'HTML') { + if(this.scrollParent[0] !== document && this.scrollParent[0].tagName !== 'HTML') { - if((this.overflowOffset.top + this.scrollParent[0].offsetHeight) - event.pageY < o.scrollSensitivity) + if((this.overflowOffset.top + this.scrollParent[0].offsetHeight) - event.pageY < o.scrollSensitivity) { this.scrollParent[0].scrollTop = scrolled = this.scrollParent[0].scrollTop + o.scrollSpeed; - else if(event.pageY - this.overflowOffset.top < o.scrollSensitivity) + } else if(event.pageY - this.overflowOffset.top < o.scrollSensitivity) { this.scrollParent[0].scrollTop = scrolled = this.scrollParent[0].scrollTop - o.scrollSpeed; + } - if((this.overflowOffset.left + this.scrollParent[0].offsetWidth) - event.pageX < o.scrollSensitivity) + if((this.overflowOffset.left + this.scrollParent[0].offsetWidth) - event.pageX < o.scrollSensitivity) { this.scrollParent[0].scrollLeft = scrolled = this.scrollParent[0].scrollLeft + o.scrollSpeed; - else if(event.pageX - this.overflowOffset.left < o.scrollSensitivity) + } else if(event.pageX - this.overflowOffset.left < o.scrollSensitivity) { this.scrollParent[0].scrollLeft = scrolled = this.scrollParent[0].scrollLeft - o.scrollSpeed; + } } else { - if(event.pageY - $(document).scrollTop() < o.scrollSensitivity) + if(event.pageY - $(document).scrollTop() < o.scrollSensitivity) { scrolled = $(document).scrollTop($(document).scrollTop() - o.scrollSpeed); - else if($(window).height() - (event.pageY - $(document).scrollTop()) < o.scrollSensitivity) + } else if($(window).height() - (event.pageY - $(document).scrollTop()) < o.scrollSensitivity) { scrolled = $(document).scrollTop($(document).scrollTop() + o.scrollSpeed); + } - if(event.pageX - $(document).scrollLeft() < o.scrollSensitivity) + if(event.pageX - $(document).scrollLeft() < o.scrollSensitivity) { scrolled = $(document).scrollLeft($(document).scrollLeft() - o.scrollSpeed); - else if($(window).width() - (event.pageX - $(document).scrollLeft()) < o.scrollSensitivity) + } else if($(window).width() - (event.pageX - $(document).scrollLeft()) < o.scrollSensitivity) { scrolled = $(document).scrollLeft($(document).scrollLeft() + o.scrollSpeed); + } } - if(scrolled !== false && $.ui.ddmanager && !o.dropBehaviour) + if(scrolled !== false && $.ui.ddmanager && !o.dropBehaviour) { $.ui.ddmanager.prepareOffsets(this, event); + } } //Regenerate the absolute position used for position checks this.positionAbs = this._convertPositionTo("absolute"); //Set the helper position - if(!this.options.axis || this.options.axis != "y") this.helper[0].style.left = this.position.left+'px'; - if(!this.options.axis || this.options.axis != "x") this.helper[0].style.top = this.position.top+'px'; + if(!this.options.axis || this.options.axis !== "y") { + this.helper[0].style.left = this.position.left+'px'; + } + if(!this.options.axis || this.options.axis !== "x") { + this.helper[0].style.top = this.position.top+'px'; + } //Rearrange - for (var i = this.items.length - 1; i >= 0; i--) { + for (i = this.items.length - 1; i >= 0; i--) { //Cache variables and intersection, continue if no intersection - var item = this.items[i], itemElement = item.item[0], intersection = this._intersectsWithPointer(item); - if (!intersection) continue; + item = this.items[i]; + itemElement = item.item[0]; + intersection = this._intersectsWithPointer(item); + if (!intersection) { + continue; + } // Only put the placeholder inside the current Container, skip all // items form other containers. This works because when moving @@ -306,18 +348,22 @@ $.widget("ui.sortable", $.ui.mouse, { // // Without this moving items in "sub-sortables" can cause the placeholder to jitter // beetween the outer and inner container. - if (item.instance !== this.currentContainer) continue; + if (item.instance !== this.currentContainer) { + continue; + } - if (itemElement != this.currentItem[0] //cannot intersect with itself - && this.placeholder[intersection == 1 ? "next" : "prev"]()[0] != itemElement //no useless actions that have been done before - && !$.contains(this.placeholder[0], itemElement) //no action if the item moved is the parent of the item checked - && (this.options.type == 'semi-dynamic' ? !$.contains(this.element[0], itemElement) : true) - //&& itemElement.parentNode == this.placeholder[0].parentNode // only rearrange items within the same container + // cannot intersect with itself + // no useless actions that have been done before + // no action if the item moved is the parent of the item checked + if (itemElement !== this.currentItem[0] && + this.placeholder[intersection === 1 ? "next" : "prev"]()[0] !== itemElement && + !$.contains(this.placeholder[0], itemElement) && + (this.options.type === 'semi-dynamic' ? !$.contains(this.element[0], itemElement) : true) ) { - this.direction = intersection == 1 ? "down" : "up"; + this.direction = intersection === 1 ? "down" : "up"; - if (this.options.tolerance == "pointer" || this._intersectsWithSides(item)) { + if (this.options.tolerance === "pointer" || this._intersectsWithSides(item)) { this._rearrange(event, item); } else { break; @@ -332,7 +378,9 @@ $.widget("ui.sortable", $.ui.mouse, { this._contactContainers(event); //Interconnect with droppables - if($.ui.ddmanager) $.ui.ddmanager.drag(this, event); + if($.ui.ddmanager) { + $.ui.ddmanager.drag(this, event); + } //Call callbacks this._trigger('sort', event, this._uiHash()); @@ -344,21 +392,24 @@ $.widget("ui.sortable", $.ui.mouse, { _mouseStop: function(event, noPropagation) { - if(!event) return; + if(!event) { + return; + } //If we are using droppables, inform the manager about the drop - if ($.ui.ddmanager && !this.options.dropBehaviour) + if ($.ui.ddmanager && !this.options.dropBehaviour) { $.ui.ddmanager.drop(this, event); + } if(this.options.revert) { - var that = this; - var cur = this.placeholder.offset(); + var that = this, + cur = this.placeholder.offset(); this.reverting = true; $(this.helper).animate({ - left: cur.left - this.offset.parent.left - this.margins.left + (this.offsetParent[0] == document.body ? 0 : this.offsetParent[0].scrollLeft), - top: cur.top - this.offset.parent.top - this.margins.top + (this.offsetParent[0] == document.body ? 0 : this.offsetParent[0].scrollTop) + left: cur.left - this.offset.parent.left - this.margins.left + (this.offsetParent[0] === document.body ? 0 : this.offsetParent[0].scrollLeft), + top: cur.top - this.offset.parent.top - this.margins.top + (this.offsetParent[0] === document.body ? 0 : this.offsetParent[0].scrollTop) }, parseInt(this.options.revert, 10) || 500, function() { that._clear(event); }); @@ -376,10 +427,11 @@ $.widget("ui.sortable", $.ui.mouse, { this._mouseUp({ target: null }); - if(this.options.helper == "original") + if(this.options.helper === "original") { this.currentItem.css(this._storedCSS).removeClass("ui-sortable-helper"); - else + } else { this.currentItem.show(); + } //Post deactivating events to containers for (var i = this.containers.length - 1; i >= 0; i--){ @@ -394,8 +446,12 @@ $.widget("ui.sortable", $.ui.mouse, { if (this.placeholder) { //$(this.placeholder[0]).remove(); would have been the jQuery way - unfortunately, it unbinds ALL events from the original node! - if(this.placeholder[0].parentNode) this.placeholder[0].parentNode.removeChild(this.placeholder[0]); - if(this.options.helper != "original" && this.helper && this.helper[0].parentNode) this.helper.remove(); + if(this.placeholder[0].parentNode) { + this.placeholder[0].parentNode.removeChild(this.placeholder[0]); + } + if(this.options.helper !== "original" && this.helper && this.helper[0].parentNode) { + this.helper.remove(); + } $.extend(this, { helper: null, @@ -417,12 +473,15 @@ $.widget("ui.sortable", $.ui.mouse, { serialize: function(o) { - var items = this._getItemsAsjQuery(o && o.connected); - var str = []; o = o || {}; + var items = this._getItemsAsjQuery(o && o.connected), + str = []; + o = o || {}; $(items).each(function() { var res = ($(o.item || this).attr(o.attribute || 'id') || '').match(o.expression || (/(.+)[\-=_](.+)/)); - if(res) str.push((o.key || res[1]+'[]')+'='+(o.key && o.expression ? res[1] : res[2])); + if (res) { + str.push((o.key || res[1]+'[]')+'='+(o.key && o.expression ? res[1] : res[2])); + } }); if(!str.length && o.key) { @@ -435,8 +494,10 @@ $.widget("ui.sortable", $.ui.mouse, { toArray: function(o) { - var items = this._getItemsAsjQuery(o && o.connected); - var ret = []; o = o || {}; + var items = this._getItemsAsjQuery(o && o.connected), + ret = []; + + o = o || {}; items.each(function() { ret.push($(o.item || this).attr(o.attribute || 'id') || ''); }); return ret; @@ -449,29 +510,26 @@ $.widget("ui.sortable", $.ui.mouse, { var x1 = this.positionAbs.left, x2 = x1 + this.helperProportions.width, y1 = this.positionAbs.top, - y2 = y1 + this.helperProportions.height; - - var l = item.left, + y2 = y1 + this.helperProportions.height, + l = item.left, r = l + item.width, t = item.top, - b = t + item.height; + b = t + item.height, + dyClick = this.offset.click.top, + dxClick = this.offset.click.left, + isOverElement = (y1 + dyClick) > t && (y1 + dyClick) < b && (x1 + dxClick) > l && (x1 + dxClick) < r; - var dyClick = this.offset.click.top, - dxClick = this.offset.click.left; - - var isOverElement = (y1 + dyClick) > t && (y1 + dyClick) < b && (x1 + dxClick) > l && (x1 + dxClick) < r; - - if (this.options.tolerance == "pointer" - || this.options.forcePointerForContainers - || (this.options.tolerance != "pointer" && this.helperProportions[this.floating ? 'width' : 'height'] > item[this.floating ? 'width' : 'height']) + if ( this.options.tolerance === "pointer" || + this.options.forcePointerForContainers || + (this.options.tolerance !== "pointer" && this.helperProportions[this.floating ? 'width' : 'height'] > item[this.floating ? 'width' : 'height']) ) { return isOverElement; } else { - return (l < x1 + (this.helperProportions.width / 2) // Right Half - && x2 - (this.helperProportions.width / 2) < r // Left Half - && t < y1 + (this.helperProportions.height / 2) // Bottom Half - && y2 - (this.helperProportions.height / 2) < b ); // Top Half + return (l < x1 + (this.helperProportions.width / 2) && // Right Half + x2 - (this.helperProportions.width / 2) < r && // Left Half + t < y1 + (this.helperProportions.height / 2) && // Bottom Half + y2 - (this.helperProportions.height / 2) < b ); // Top Half } }, @@ -484,12 +542,13 @@ $.widget("ui.sortable", $.ui.mouse, { verticalDirection = this._getDragVerticalDirection(), horizontalDirection = this._getDragHorizontalDirection(); - if (!isOverElement) + if (!isOverElement) { return false; + } return this.floating ? - ( ((horizontalDirection && horizontalDirection == "right") || verticalDirection == "down") ? 2 : 1 ) - : ( verticalDirection && (verticalDirection == "down" ? 2 : 1) ); + ( ((horizontalDirection && horizontalDirection === "right") || verticalDirection === "down") ? 2 : 1 ) + : ( verticalDirection && (verticalDirection === "down" ? 2 : 1) ); }, @@ -501,9 +560,9 @@ $.widget("ui.sortable", $.ui.mouse, { horizontalDirection = this._getDragHorizontalDirection(); if (this.floating && horizontalDirection) { - return ((horizontalDirection == "right" && isOverRightHalf) || (horizontalDirection == "left" && !isOverRightHalf)); + return ((horizontalDirection === "right" && isOverRightHalf) || (horizontalDirection === "left" && !isOverRightHalf)); } else { - return verticalDirection && ((verticalDirection == "down" && isOverBottomHalf) || (verticalDirection == "up" && !isOverBottomHalf)); + return verticalDirection && ((verticalDirection === "down" && isOverBottomHalf) || (verticalDirection === "up" && !isOverBottomHalf)); } }, @@ -526,23 +585,22 @@ $.widget("ui.sortable", $.ui.mouse, { _connectWith: function() { var options = this.options; - return options.connectWith.constructor == String - ? [options.connectWith] - : options.connectWith; + return options.connectWith.constructor === String ? [options.connectWith] : options.connectWith; }, _getItemsAsjQuery: function(connected) { - var items = []; - var queries = []; - var connectWith = this._connectWith(); + var i, j, cur, inst, + items = [], + queries = [], + connectWith = this._connectWith(); if(connectWith && connected) { - for (var i = connectWith.length - 1; i >= 0; i--){ - var cur = $(connectWith[i]); - for (var j = cur.length - 1; j >= 0; j--){ - var inst = $.data(cur[j], this.widgetFullName); - if(inst && inst != this && !inst.options.disabled) { + for (i = connectWith.length - 1; i >= 0; i--){ + cur = $(connectWith[i]); + for ( j = cur.length - 1; j >= 0; j--){ + inst = $.data(cur[j], this.widgetFullName); + if(inst && inst !== this && !inst.options.disabled) { queries.push([$.isFunction(inst.options.items) ? inst.options.items.call(inst.element) : $(inst.options.items, inst.element).not(".ui-sortable-helper").not('.ui-sortable-placeholder'), inst]); } } @@ -551,7 +609,7 @@ $.widget("ui.sortable", $.ui.mouse, { queries.push([$.isFunction(this.options.items) ? this.options.items.call(this.element, null, { options: this.options, item: this.currentItem }) : $(this.options.items, this.element).not(".ui-sortable-helper").not('.ui-sortable-placeholder'), this]); - for (var i = queries.length - 1; i >= 0; i--){ + for (i = queries.length - 1; i >= 0; i--){ queries[i][0].each(function() { items.push(this); }); @@ -567,8 +625,9 @@ $.widget("ui.sortable", $.ui.mouse, { this.items = $.grep(this.items, function (item) { for (var j=0; j < list.length; j++) { - if(list[j] == item.item[0]) + if(list[j] === item.item[0]) { return false; + } } return true; }); @@ -579,16 +638,18 @@ $.widget("ui.sortable", $.ui.mouse, { this.items = []; this.containers = [this]; - var items = this.items; - var queries = [[$.isFunction(this.options.items) ? this.options.items.call(this.element[0], event, { item: this.currentItem }) : $(this.options.items, this.element), this]]; - var connectWith = this._connectWith(); + + var i, j, cur, inst, targetData, _queries, item, queriesLength, + items = this.items, + queries = [[$.isFunction(this.options.items) ? this.options.items.call(this.element[0], event, { item: this.currentItem }) : $(this.options.items, this.element), this]], + connectWith = this._connectWith(); if(connectWith && this.ready) { //Shouldn't be run the first time through due to massive slow-down - for (var i = connectWith.length - 1; i >= 0; i--){ - var cur = $(connectWith[i]); - for (var j = cur.length - 1; j >= 0; j--){ - var inst = $.data(cur[j], this.widgetFullName); - if(inst && inst != this && !inst.options.disabled) { + for (i = connectWith.length - 1; i >= 0; i--){ + cur = $(connectWith[i]); + for (j = cur.length - 1; j >= 0; j--){ + inst = $.data(cur[j], this.widgetFullName); + if(inst && inst !== this && !inst.options.disabled) { queries.push([$.isFunction(inst.options.items) ? inst.options.items.call(inst.element[0], event, { item: this.currentItem }) : $(inst.options.items, inst.element), inst]); this.containers.push(inst); } @@ -596,12 +657,12 @@ $.widget("ui.sortable", $.ui.mouse, { } } - for (var i = queries.length - 1; i >= 0; i--) { - var targetData = queries[i][1]; - var _queries = queries[i][0]; + for (i = queries.length - 1; i >= 0; i--) { + targetData = queries[i][1]; + _queries = queries[i][0]; - for (var j=0, queriesLength = _queries.length; j < queriesLength; j++) { - var item = $(_queries[j]); + for (j=0, queriesLength = _queries.length; j < queriesLength; j++) { + item = $(_queries[j]); item.data(this.widgetName + '-item', targetData); // Data for target checking (mouse manager) @@ -623,21 +684,24 @@ $.widget("ui.sortable", $.ui.mouse, { this.offset.parent = this._getParentOffset(); } - for (var i = this.items.length - 1; i >= 0; i--){ - var item = this.items[i]; + var i, item, t, p; + + for (i = this.items.length - 1; i >= 0; i--){ + item = this.items[i]; //We ignore calculating positions of all connected containers when we're not over them - if(item.instance != this.currentContainer && this.currentContainer && item.item[0] != this.currentItem[0]) + if(item.instance !== this.currentContainer && this.currentContainer && item.item[0] !== this.currentItem[0]) { continue; + } - var t = this.options.toleranceElement ? $(this.options.toleranceElement, item.item) : item.item; + t = this.options.toleranceElement ? $(this.options.toleranceElement, item.item) : item.item; if (!fast) { item.width = t.outerWidth(); item.height = t.outerHeight(); } - var p = t.offset(); + p = t.offset(); item.left = p.left; item.top = p.top; } @@ -645,8 +709,8 @@ $.widget("ui.sortable", $.ui.mouse, { if(this.options.custom && this.options.custom.refreshContainers) { this.options.custom.refreshContainers.call(this); } else { - for (var i = this.containers.length - 1; i >= 0; i--){ - var p = this.containers[i].element.offset(); + for (i = this.containers.length - 1; i >= 0; i--){ + p = this.containers[i].element.offset(); this.containers[i].containerCache.left = p.left; this.containers[i].containerCache.top = p.top; this.containers[i].containerCache.width = this.containers[i].element.outerWidth(); @@ -659,10 +723,11 @@ $.widget("ui.sortable", $.ui.mouse, { _createPlaceholder: function(that) { that = that || this; - var o = that.options; + var className, + o = that.options; - if(!o.placeholder || o.placeholder.constructor == String) { - var className = o.placeholder; + if(!o.placeholder || o.placeholder.constructor === String) { + className = o.placeholder; o.placeholder = { element: function() { @@ -670,8 +735,9 @@ $.widget("ui.sortable", $.ui.mouse, { .addClass(className || that.currentItem[0].className+" ui-sortable-placeholder") .removeClass("ui-sortable-helper")[0]; - if(!className) + if(!className) { el.style.visibility = "hidden"; + } return el; }, @@ -679,7 +745,9 @@ $.widget("ui.sortable", $.ui.mouse, { // 1. If a className is set as 'placeholder option, we don't force sizes - the class is responsible for that // 2. The option 'forcePlaceholderSize can be enabled to force it even if a class name is specified - if(className && !o.forcePlaceholderSize) return; + if(className && !o.forcePlaceholderSize) { + return; + } //If the element doesn't have a actual height by itself (without styles coming from a stylesheet), it receives the inline height from the dragged item if(!p.height()) { p.height(that.currentItem.innerHeight() - parseInt(that.currentItem.css('paddingTop')||0, 10) - parseInt(that.currentItem.css('paddingBottom')||0, 10)); } @@ -700,22 +768,24 @@ $.widget("ui.sortable", $.ui.mouse, { }, _contactContainers: function(event) { + var i, j, dist, itemWithLeastDistance, posProperty, sizeProperty, base, cur, nearBottom, + innermostContainer = null, + innermostIndex = null; // get innermost container that intersects with item - var innermostContainer = null, innermostIndex = null; - - - for (var i = this.containers.length - 1; i >= 0; i--){ + for (i = this.containers.length - 1; i >= 0; i--) { // never consider a container that's located within the item itself - if($.contains(this.currentItem[0], this.containers[i].element[0])) + if($.contains(this.currentItem[0], this.containers[i].element[0])) { continue; + } if(this._intersectsWith(this.containers[i].containerCache)) { // if we've already found a container and it's more "inner" than this, then continue - if(innermostContainer && $.contains(this.containers[i].element[0], innermostContainer.element[0])) + if(innermostContainer && $.contains(this.containers[i].element[0], innermostContainer.element[0])) { continue; + } innermostContainer = this.containers[i]; innermostIndex = i; @@ -731,7 +801,9 @@ $.widget("ui.sortable", $.ui.mouse, { } // if no intersecting containers found, return - if(!innermostContainer) return; + if(!innermostContainer) { + return; + } // move the item into the container if it's not there already if(this.containers.length === 1) { @@ -740,15 +812,20 @@ $.widget("ui.sortable", $.ui.mouse, { } else { //When entering a new container, we will find the item with the least distance and append our item near it - var dist = 10000; var itemWithLeastDistance = null; - var posProperty = this.containers[innermostIndex].floating ? 'left' : 'top'; - var sizeProperty = this.containers[innermostIndex].floating ? 'width' : 'height'; - var base = this.positionAbs[posProperty] + this.offset.click[posProperty]; - for (var j = this.items.length - 1; j >= 0; j--) { - if(!$.contains(this.containers[innermostIndex].element[0], this.items[j].item[0])) continue; - if(this.items[j].item[0] == this.currentItem[0]) continue; - var cur = this.items[j].item.offset()[posProperty]; - var nearBottom = false; + dist = 10000; + itemWithLeastDistance = null; + posProperty = this.containers[innermostIndex].floating ? 'left' : 'top'; + sizeProperty = this.containers[innermostIndex].floating ? 'width' : 'height'; + base = this.positionAbs[posProperty] + this.offset.click[posProperty]; + for (j = this.items.length - 1; j >= 0; j--) { + if(!$.contains(this.containers[innermostIndex].element[0], this.items[j].item[0])) { + continue; + } + if(this.items[j].item[0] === this.currentItem[0]) { + continue; + } + cur = this.items[j].item.offset()[posProperty]; + nearBottom = false; if(Math.abs(cur - base) > Math.abs(cur + this.items[j][sizeProperty] - base)){ nearBottom = true; cur += this.items[j][sizeProperty]; @@ -760,8 +837,10 @@ $.widget("ui.sortable", $.ui.mouse, { } } - if(!itemWithLeastDistance && !this.options.dropOnEmpty) //Check if dropOnEmpty is enabled + //Check if dropOnEmpty is enabled + if(!itemWithLeastDistance && !this.options.dropOnEmpty) { return; + } this.currentContainer = this.containers[innermostIndex]; itemWithLeastDistance ? this._rearrange(event, itemWithLeastDistance, null, true) : this._rearrange(event, null, this.containers[innermostIndex].element, true); @@ -780,24 +859,31 @@ $.widget("ui.sortable", $.ui.mouse, { _createHelper: function(event) { - var o = this.options; - var helper = $.isFunction(o.helper) ? $(o.helper.apply(this.element[0], [event, this.currentItem])) : (o.helper == 'clone' ? this.currentItem.clone() : this.currentItem); + var o = this.options, + helper = $.isFunction(o.helper) ? $(o.helper.apply(this.element[0], [event, this.currentItem])) : (o.helper === 'clone' ? this.currentItem.clone() : this.currentItem); - if(!helper.parents('body').length) //Add the helper to the DOM if that didn't happen already - $(o.appendTo != 'parent' ? o.appendTo : this.currentItem[0].parentNode)[0].appendChild(helper[0]); + //Add the helper to the DOM if that didn't happen already + if(!helper.parents('body').length) { + $(o.appendTo !== 'parent' ? o.appendTo : this.currentItem[0].parentNode)[0].appendChild(helper[0]); + } - if(helper[0] == this.currentItem[0]) + if(helper[0] === this.currentItem[0]) { this._storedCSS = { width: this.currentItem[0].style.width, height: this.currentItem[0].style.height, position: this.currentItem.css("position"), top: this.currentItem.css("top"), left: this.currentItem.css("left") }; + } - if(!helper[0].style.width || o.forceHelperSize) helper.width(this.currentItem.width()); - if(!helper[0].style.height || o.forceHelperSize) helper.height(this.currentItem.height()); + if(!helper[0].style.width || o.forceHelperSize) { + helper.width(this.currentItem.width()); + } + if(!helper[0].style.height || o.forceHelperSize) { + helper.height(this.currentItem.height()); + } return helper; }, _adjustOffsetFromHelper: function(obj) { - if (typeof obj == 'string') { + if (typeof obj === 'string') { obj = obj.split(' '); } if ($.isArray(obj)) { @@ -828,14 +914,16 @@ $.widget("ui.sortable", $.ui.mouse, { // 1. The position of the helper is absolute, so it's position is calculated based on the next positioned parent // 2. The actual offset parent is a child of the scroll parent, and the scroll parent isn't the document, which means that // the scroll is included in the initial calculation of the offset of the parent, and never recalculated upon drag - if(this.cssPosition == 'absolute' && this.scrollParent[0] != document && $.contains(this.scrollParent[0], this.offsetParent[0])) { + if(this.cssPosition === 'absolute' && this.scrollParent[0] !== document && $.contains(this.scrollParent[0], this.offsetParent[0])) { po.left += this.scrollParent.scrollLeft(); po.top += this.scrollParent.scrollTop(); } - if((this.offsetParent[0] == document.body) //This needs to be actually done for all browsers, since pageX/pageY includes this information - || (this.offsetParent[0].tagName && this.offsetParent[0].tagName.toLowerCase() == 'html' && $.ui.ie)) //Ugly IE fix + // This needs to be actually done for all browsers, since pageX/pageY includes this information + // with an ugly IE fix + if( this.offsetParent[0] === document.body || (this.offsetParent[0].tagName && this.offsetParent[0].tagName.toLowerCase() === 'html' && $.ui.ie)) { po = { top: 0, left: 0 }; + } return { top: po.top + (parseInt(this.offsetParent.css("borderTopWidth"),10) || 0), @@ -846,7 +934,7 @@ $.widget("ui.sortable", $.ui.mouse, { _getRelativeOffset: function() { - if(this.cssPosition == "relative") { + if(this.cssPosition === "relative") { var p = this.currentItem.position(); return { top: p.top - (parseInt(this.helper.css("top"),10) || 0) + this.scrollParent.scrollTop(), @@ -874,19 +962,24 @@ $.widget("ui.sortable", $.ui.mouse, { _setContainment: function() { - var o = this.options; - if(o.containment == 'parent') o.containment = this.helper[0].parentNode; - if(o.containment == 'document' || o.containment == 'window') this.containment = [ - 0 - this.offset.relative.left - this.offset.parent.left, - 0 - this.offset.relative.top - this.offset.parent.top, - $(o.containment == 'document' ? document : window).width() - this.helperProportions.width - this.margins.left, - ($(o.containment == 'document' ? document : window).height() || document.body.parentNode.scrollHeight) - this.helperProportions.height - this.margins.top - ]; + var ce, co, over, + o = this.options; + if(o.containment === 'parent') { + o.containment = this.helper[0].parentNode; + } + if(o.containment === 'document' || o.containment === 'window') { + this.containment = [ + 0 - this.offset.relative.left - this.offset.parent.left, + 0 - this.offset.relative.top - this.offset.parent.top, + $(o.containment === 'document' ? document : window).width() - this.helperProportions.width - this.margins.left, + ($(o.containment === 'document' ? document : window).height() || document.body.parentNode.scrollHeight) - this.helperProportions.height - this.margins.top + ]; + } if(!(/^(document|window|parent)$/).test(o.containment)) { - var ce = $(o.containment)[0]; - var co = $(o.containment).offset(); - var over = ($(ce).css("overflow") != 'hidden'); + ce = $(o.containment)[0]; + co = $(o.containment).offset(); + over = ($(ce).css("overflow") !== 'hidden'); this.containment = [ co.left + (parseInt($(ce).css("borderLeftWidth"),10) || 0) + (parseInt($(ce).css("paddingLeft"),10) || 0) - this.margins.left, @@ -900,22 +993,25 @@ $.widget("ui.sortable", $.ui.mouse, { _convertPositionTo: function(d, pos) { - if(!pos) pos = this.position; - var mod = d == "absolute" ? 1 : -1; - var scroll = this.cssPosition == 'absolute' && !(this.scrollParent[0] != document && $.contains(this.scrollParent[0], this.offsetParent[0])) ? this.offsetParent : this.scrollParent, scrollIsRootNode = (/(html|body)/i).test(scroll[0].tagName); + if(!pos) { + pos = this.position; + } + var mod = d === "absolute" ? 1 : -1, + scroll = this.cssPosition === 'absolute' && !(this.scrollParent[0] !== document && $.contains(this.scrollParent[0], this.offsetParent[0])) ? this.offsetParent : this.scrollParent, + scrollIsRootNode = (/(html|body)/i).test(scroll[0].tagName); return { top: ( - pos.top // The absolute mouse position - + this.offset.relative.top * mod // Only for relative positioned nodes: Relative offset from element to offset parent - + this.offset.parent.top * mod // The offsetParent's offset without borders (offset + border) - - ( ( this.cssPosition == 'fixed' ? -this.scrollParent.scrollTop() : ( scrollIsRootNode ? 0 : scroll.scrollTop() ) ) * mod) + pos.top + // The absolute mouse position + this.offset.relative.top * mod + // Only for relative positioned nodes: Relative offset from element to offset parent + this.offset.parent.top * mod - // The offsetParent's offset without borders (offset + border) + ( ( this.cssPosition === 'fixed' ? -this.scrollParent.scrollTop() : ( scrollIsRootNode ? 0 : scroll.scrollTop() ) ) * mod) ), left: ( - pos.left // The absolute mouse position - + this.offset.relative.left * mod // Only for relative positioned nodes: Relative offset from element to offset parent - + this.offset.parent.left * mod // The offsetParent's offset without borders (offset + border) - - ( ( this.cssPosition == 'fixed' ? -this.scrollParent.scrollLeft() : scrollIsRootNode ? 0 : scroll.scrollLeft() ) * mod) + pos.left + // The absolute mouse position + this.offset.relative.left * mod + // Only for relative positioned nodes: Relative offset from element to offset parent + this.offset.parent.left * mod - // The offsetParent's offset without borders (offset + border) + ( ( this.cssPosition === 'fixed' ? -this.scrollParent.scrollLeft() : scrollIsRootNode ? 0 : scroll.scrollLeft() ) * mod) ) }; @@ -923,19 +1019,20 @@ $.widget("ui.sortable", $.ui.mouse, { _generatePosition: function(event) { - var o = this.options, scroll = this.cssPosition == 'absolute' && !(this.scrollParent[0] != document && $.contains(this.scrollParent[0], this.offsetParent[0])) ? this.offsetParent : this.scrollParent, scrollIsRootNode = (/(html|body)/i).test(scroll[0].tagName); + var top, left, + o = this.options, + pageX = event.pageX, + pageY = event.pageY, + scroll = this.cssPosition === 'absolute' && !(this.scrollParent[0] !== document && $.contains(this.scrollParent[0], this.offsetParent[0])) ? this.offsetParent : this.scrollParent, scrollIsRootNode = (/(html|body)/i).test(scroll[0].tagName); // This is another very weird special case that only happens for relative elements: // 1. If the css position is relative // 2. and the scroll parent is the document or similar to the offset parent // we have to refresh the relative offset during the scroll so there are no jumps - if(this.cssPosition == 'relative' && !(this.scrollParent[0] != document && this.scrollParent[0] != this.offsetParent[0])) { + if(this.cssPosition === 'relative' && !(this.scrollParent[0] !== document && this.scrollParent[0] !== this.offsetParent[0])) { this.offset.relative = this._getRelativeOffset(); } - var pageX = event.pageX; - var pageY = event.pageY; - /* * - Position constraining - * Constrain the position to a mix of grid, containment. @@ -944,17 +1041,25 @@ $.widget("ui.sortable", $.ui.mouse, { if(this.originalPosition) { //If we are not dragging yet, we won't check for options if(this.containment) { - if(event.pageX - this.offset.click.left < this.containment[0]) pageX = this.containment[0] + this.offset.click.left; - if(event.pageY - this.offset.click.top < this.containment[1]) pageY = this.containment[1] + this.offset.click.top; - if(event.pageX - this.offset.click.left > this.containment[2]) pageX = this.containment[2] + this.offset.click.left; - if(event.pageY - this.offset.click.top > this.containment[3]) pageY = this.containment[3] + this.offset.click.top; + if(event.pageX - this.offset.click.left < this.containment[0]) { + pageX = this.containment[0] + this.offset.click.left; + } + if(event.pageY - this.offset.click.top < this.containment[1]) { + pageY = this.containment[1] + this.offset.click.top; + } + if(event.pageX - this.offset.click.left > this.containment[2]) { + pageX = this.containment[2] + this.offset.click.left; + } + if(event.pageY - this.offset.click.top > this.containment[3]) { + pageY = this.containment[3] + this.offset.click.top; + } } if(o.grid) { - var top = this.originalPageY + Math.round((pageY - this.originalPageY) / o.grid[1]) * o.grid[1]; + top = this.originalPageY + Math.round((pageY - this.originalPageY) / o.grid[1]) * o.grid[1]; pageY = this.containment ? ( (top - this.offset.click.top >= this.containment[1] && top - this.offset.click.top <= this.containment[3]) ? top : ((top - this.offset.click.top >= this.containment[1]) ? top - o.grid[1] : top + o.grid[1])) : top; - var left = this.originalPageX + Math.round((pageX - this.originalPageX) / o.grid[0]) * o.grid[0]; + left = this.originalPageX + Math.round((pageX - this.originalPageX) / o.grid[0]) * o.grid[0]; pageX = this.containment ? ( (left - this.offset.click.left >= this.containment[0] && left - this.offset.click.left <= this.containment[2]) ? left : ((left - this.offset.click.left >= this.containment[0]) ? left - o.grid[0] : left + o.grid[0])) : left; } @@ -962,18 +1067,18 @@ $.widget("ui.sortable", $.ui.mouse, { return { top: ( - pageY // The absolute mouse position - - this.offset.click.top // Click offset (relative to the element) - - this.offset.relative.top // Only for relative positioned nodes: Relative offset from element to offset parent - - this.offset.parent.top // The offsetParent's offset without borders (offset + border) - + ( ( this.cssPosition == 'fixed' ? -this.scrollParent.scrollTop() : ( scrollIsRootNode ? 0 : scroll.scrollTop() ) )) + pageY - // The absolute mouse position + this.offset.click.top - // Click offset (relative to the element) + this.offset.relative.top - // Only for relative positioned nodes: Relative offset from element to offset parent + this.offset.parent.top + // The offsetParent's offset without borders (offset + border) + ( ( this.cssPosition === 'fixed' ? -this.scrollParent.scrollTop() : ( scrollIsRootNode ? 0 : scroll.scrollTop() ) )) ), left: ( - pageX // The absolute mouse position - - this.offset.click.left // Click offset (relative to the element) - - this.offset.relative.left // Only for relative positioned nodes: Relative offset from element to offset parent - - this.offset.parent.left // The offsetParent's offset without borders (offset + border) - + ( ( this.cssPosition == 'fixed' ? -this.scrollParent.scrollLeft() : scrollIsRootNode ? 0 : scroll.scrollLeft() )) + pageX - // The absolute mouse position + this.offset.click.left - // Click offset (relative to the element) + this.offset.relative.left - // Only for relative positioned nodes: Relative offset from element to offset parent + this.offset.parent.left + // The offsetParent's offset without borders (offset + border) + ( ( this.cssPosition === 'fixed' ? -this.scrollParent.scrollLeft() : scrollIsRootNode ? 0 : scroll.scrollLeft() )) ) }; @@ -981,7 +1086,7 @@ $.widget("ui.sortable", $.ui.mouse, { _rearrange: function(event, i, a, hardRefresh) { - a ? a[0].appendChild(this.placeholder[0]) : i.item[0].parentNode.insertBefore(this.placeholder[0], (this.direction == 'down' ? i.item[0] : i.item[0].nextSibling)); + a ? a[0].appendChild(this.placeholder[0]) : i.item[0].parentNode.insertBefore(this.placeholder[0], (this.direction === 'down' ? i.item[0] : i.item[0].nextSibling)); //Various things done here to improve the performance: // 1. we create a setTimeout, that calls refreshPositions @@ -992,7 +1097,9 @@ $.widget("ui.sortable", $.ui.mouse, { var counter = this.counter; this._delay(function() { - if(counter == this.counter) this.refreshPositions(!hardRefresh); //Precompute after each DOM insertion, NOT on mousemove + if(counter === this.counter) { + this.refreshPositions(!hardRefresh); //Precompute after each DOM insertion, NOT on mousemove + } }); }, @@ -1002,24 +1109,33 @@ $.widget("ui.sortable", $.ui.mouse, { this.reverting = false; // We delay all events that have to be triggered to after the point where the placeholder has been removed and // everything else normalized again - var delayedTriggers = []; + var i, + delayedTriggers = []; // We first have to update the dom position of the actual currentItem // Note: don't do it if the current item is already removed (by a user), or it gets reappended (see #4088) - if(!this._noFinalSort && this.currentItem.parent().length) this.placeholder.before(this.currentItem); + if(!this._noFinalSort && this.currentItem.parent().length) { + this.placeholder.before(this.currentItem); + } this._noFinalSort = null; - if(this.helper[0] == this.currentItem[0]) { - for(var i in this._storedCSS) { - if(this._storedCSS[i] == 'auto' || this._storedCSS[i] == 'static') this._storedCSS[i] = ''; + if(this.helper[0] === this.currentItem[0]) { + for(i in this._storedCSS) { + if(this._storedCSS[i] === 'auto' || this._storedCSS[i] === 'static') { + this._storedCSS[i] = ''; + } } this.currentItem.css(this._storedCSS).removeClass("ui-sortable-helper"); } else { this.currentItem.show(); } - if(this.fromOutside && !noPropagation) delayedTriggers.push(function(event) { this._trigger("receive", event, this._uiHash(this.fromOutside)); }); - if((this.fromOutside || this.domPosition.prev != this.currentItem.prev().not(".ui-sortable-helper")[0] || this.domPosition.parent != this.currentItem.parent()[0]) && !noPropagation) delayedTriggers.push(function(event) { this._trigger("update", event, this._uiHash()); }); //Trigger update callback if the DOM position has changed + if(this.fromOutside && !noPropagation) { + delayedTriggers.push(function(event) { this._trigger("receive", event, this._uiHash(this.fromOutside)); }); + } + if((this.fromOutside || this.domPosition.prev !== this.currentItem.prev().not(".ui-sortable-helper")[0] || this.domPosition.parent !== this.currentItem.parent()[0]) && !noPropagation) { + delayedTriggers.push(function(event) { this._trigger("update", event, this._uiHash()); }); //Trigger update callback if the DOM position has changed + } // Check if the items Container has Changed and trigger appropriate // events. @@ -1033,8 +1149,10 @@ $.widget("ui.sortable", $.ui.mouse, { //Post events to containers - for (var i = this.containers.length - 1; i >= 0; i--){ - if(!noPropagation) delayedTriggers.push((function(c) { return function(event) { c._trigger("deactivate", event, this._uiHash(this)); }; }).call(this, this.containers[i])); + for (i = this.containers.length - 1; i >= 0; i--){ + if(!noPropagation) { + delayedTriggers.push((function(c) { return function(event) { c._trigger("deactivate", event, this._uiHash(this)); }; }).call(this, this.containers[i])); + } if(this.containers[i].containerCache.over) { delayedTriggers.push((function(c) { return function(event) { c._trigger("out", event, this._uiHash(this)); }; }).call(this, this.containers[i])); this.containers[i].containerCache.over = 0; @@ -1042,15 +1160,21 @@ $.widget("ui.sortable", $.ui.mouse, { } //Do what was originally in plugins - if(this._storedCursor) $('body').css("cursor", this._storedCursor); //Reset cursor - if(this._storedOpacity) this.helper.css("opacity", this._storedOpacity); //Reset opacity - if(this._storedZIndex) this.helper.css("zIndex", this._storedZIndex == 'auto' ? '' : this._storedZIndex); //Reset z-index + if(this._storedCursor) { + $('body').css("cursor", this._storedCursor); + } + if(this._storedOpacity) { + this.helper.css("opacity", this._storedOpacity); + } + if(this._storedZIndex) { + this.helper.css("zIndex", this._storedZIndex === 'auto' ? '' : this._storedZIndex); + } this.dragging = false; if(this.cancelHelperRemoval) { if(!noPropagation) { this._trigger("beforeStop", event, this._uiHash()); - for (var i=0; i < delayedTriggers.length; i++) { + for (i=0; i < delayedTriggers.length; i++) { delayedTriggers[i].call(this, event); } //Trigger all delayed events this._trigger("stop", event, this._uiHash()); @@ -1060,15 +1184,20 @@ $.widget("ui.sortable", $.ui.mouse, { return false; } - if(!noPropagation) this._trigger("beforeStop", event, this._uiHash()); + if(!noPropagation) { + this._trigger("beforeStop", event, this._uiHash()); + } //$(this.placeholder[0]).remove(); would have been the jQuery way - unfortunately, it unbinds ALL events from the original node! this.placeholder[0].parentNode.removeChild(this.placeholder[0]); - if(this.helper[0] != this.currentItem[0]) this.helper.remove(); this.helper = null; + if(this.helper[0] !== this.currentItem[0]) { + this.helper.remove(); + } + this.helper = null; if(!noPropagation) { - for (var i=0; i < delayedTriggers.length; i++) { + for (i=0; i < delayedTriggers.length; i++) { delayedTriggers[i].call(this, event); } //Trigger all delayed events this._trigger("stop", event, this._uiHash()); From 0e800636c42dee2e50ccfd577c48620c20d48c88 Mon Sep 17 00:00:00 2001 From: Mike Sherov Date: Sat, 17 Nov 2012 14:51:56 -0500 Subject: [PATCH 10/28] Dev: Make droppable pass JSHint with no local settings overrides --- ui/jquery.ui.droppable.js | 206 +++++++++++++++++++++++++------------- 1 file changed, 135 insertions(+), 71 deletions(-) diff --git a/ui/jquery.ui.droppable.js b/ui/jquery.ui.droppable.js index f27d56b85..9d904992d 100644 --- a/ui/jquery.ui.droppable.js +++ b/ui/jquery.ui.droppable.js @@ -16,7 +16,6 @@ */ (function( $, undefined ) { -/*jshint onevar: false, curly: false, eqeqeq: false, laxbreak: true */ $.widget("ui.droppable", { version: "@VERSION", widgetEventPrefix: "drop", @@ -31,8 +30,11 @@ $.widget("ui.droppable", { }, _create: function() { - var o = this.options, accept = o.accept; - this.isover = 0; this.isout = 1; + var o = this.options, + accept = o.accept; + + this.isover = false; + this.isout = true; this.accept = $.isFunction(accept) ? accept : function(d) { return d.is(accept); @@ -50,17 +52,21 @@ $.widget("ui.droppable", { }, _destroy: function() { - var drop = $.ui.ddmanager.droppables[this.options.scope]; - for ( var i = 0; i < drop.length; i++ ) - if ( drop[i] == this ) + var i = 0, + drop = $.ui.ddmanager.droppables[this.options.scope]; + + for ( ; i < drop.length; i++ ) { + if ( drop[i] === this ) { drop.splice(i, 1); + } + } this.element.removeClass("ui-droppable ui-droppable-disabled"); }, _setOption: function(key, value) { - if(key == 'accept') { + if(key === 'accept') { this.accept = $.isFunction(value) ? value : function(d) { return d.is(value); }; @@ -70,23 +76,37 @@ $.widget("ui.droppable", { _activate: function(event) { var draggable = $.ui.ddmanager.current; - if(this.options.activeClass) this.element.addClass(this.options.activeClass); - (draggable && this._trigger('activate', event, this.ui(draggable))); + if(this.options.activeClass) { + this.element.addClass(this.options.activeClass); + } + if(draggable){ + this._trigger('activate', event, this.ui(draggable)); + } }, _deactivate: function(event) { var draggable = $.ui.ddmanager.current; - if(this.options.activeClass) this.element.removeClass(this.options.activeClass); - (draggable && this._trigger('deactivate', event, this.ui(draggable))); + if(this.options.activeClass) { + this.element.removeClass(this.options.activeClass); + } + if(draggable){ + this._trigger('deactivate', event, this.ui(draggable)); + } }, _over: function(event) { var draggable = $.ui.ddmanager.current; - if (!draggable || (draggable.currentItem || draggable.element)[0] == this.element[0]) return; // Bail if draggable and droppable are same element + + // Bail if draggable and droppable are same element + if (!draggable || (draggable.currentItem || draggable.element)[0] === this.element[0]) { + return; + } if (this.accept.call(this.element[0],(draggable.currentItem || draggable.element))) { - if(this.options.hoverClass) this.element.addClass(this.options.hoverClass); + if(this.options.hoverClass) { + this.element.addClass(this.options.hoverClass); + } this._trigger('over', event, this.ui(draggable)); } @@ -95,10 +115,16 @@ $.widget("ui.droppable", { _out: function(event) { var draggable = $.ui.ddmanager.current; - if (!draggable || (draggable.currentItem || draggable.element)[0] == this.element[0]) return; // Bail if draggable and droppable are same element + + // Bail if draggable and droppable are same element + if (!draggable || (draggable.currentItem || draggable.element)[0] === this.element[0]) { + return; + } if (this.accept.call(this.element[0],(draggable.currentItem || draggable.element))) { - if(this.options.hoverClass) this.element.removeClass(this.options.hoverClass); + if(this.options.hoverClass) { + this.element.removeClass(this.options.hoverClass); + } this._trigger('out', event, this.ui(draggable)); } @@ -106,25 +132,35 @@ $.widget("ui.droppable", { _drop: function(event,custom) { - var draggable = custom || $.ui.ddmanager.current; - if (!draggable || (draggable.currentItem || draggable.element)[0] == this.element[0]) return false; // Bail if draggable and droppable are same element + var draggable = custom || $.ui.ddmanager.current, + childrenIntersection = false; + + // Bail if draggable and droppable are same element + if (!draggable || (draggable.currentItem || draggable.element)[0] === this.element[0]) { + return false; + } - var childrenIntersection = false; this.element.find(":data(ui-droppable)").not(".ui-draggable-dragging").each(function() { var inst = $.data(this, 'ui-droppable'); if( - inst.options.greedy - && !inst.options.disabled - && inst.options.scope == draggable.options.scope - && inst.accept.call(inst.element[0], (draggable.currentItem || draggable.element)) - && $.ui.intersect(draggable, $.extend(inst, { offset: inst.element.offset() }), inst.options.tolerance) + inst.options.greedy && + !inst.options.disabled && + inst.options.scope === draggable.options.scope && + inst.accept.call(inst.element[0], (draggable.currentItem || draggable.element)) && + $.ui.intersect(draggable, $.extend(inst, { offset: inst.element.offset() }), inst.options.tolerance) ) { childrenIntersection = true; return false; } }); - if(childrenIntersection) return false; + if(childrenIntersection) { + return false; + } if(this.accept.call(this.element[0],(draggable.currentItem || draggable.element))) { - if(this.options.activeClass) this.element.removeClass(this.options.activeClass); - if(this.options.hoverClass) this.element.removeClass(this.options.hoverClass); + if(this.options.activeClass) { + this.element.removeClass(this.options.activeClass); + } + if(this.options.hoverClass) { + this.element.removeClass(this.options.hoverClass); + } this._trigger('drop', event, this.ui(draggable)); return this.element; } @@ -146,27 +182,28 @@ $.widget("ui.droppable", { $.ui.intersect = function(draggable, droppable, toleranceMode) { - if (!droppable.offset) return false; + if (!droppable.offset) { + return false; + } - var x1 = (draggable.positionAbs || draggable.position.absolute).left, x2 = x1 + draggable.helperProportions.width, - y1 = (draggable.positionAbs || draggable.position.absolute).top, y2 = y1 + draggable.helperProportions.height; - var l = droppable.offset.left, r = l + droppable.proportions.width, + var draggableLeft, draggableTop, + x1 = (draggable.positionAbs || draggable.position.absolute).left, x2 = x1 + draggable.helperProportions.width, + y1 = (draggable.positionAbs || draggable.position.absolute).top, y2 = y1 + draggable.helperProportions.height, + l = droppable.offset.left, r = l + droppable.proportions.width, t = droppable.offset.top, b = t + droppable.proportions.height; switch (toleranceMode) { case 'fit': - return (l <= x1 && x2 <= r - && t <= y1 && y2 <= b); + return (l <= x1 && x2 <= r && t <= y1 && y2 <= b); case 'intersect': - return (l < x1 + (draggable.helperProportions.width / 2) // Right Half - && x2 - (draggable.helperProportions.width / 2) < r // Left Half - && t < y1 + (draggable.helperProportions.height / 2) // Bottom Half - && y2 - (draggable.helperProportions.height / 2) < b ); // Top Half + return (l < x1 + (draggable.helperProportions.width / 2) && // Right Half + x2 - (draggable.helperProportions.width / 2) < r && // Left Half + t < y1 + (draggable.helperProportions.height / 2) && // Bottom Half + y2 - (draggable.helperProportions.height / 2) < b ); // Top Half case 'pointer': - var draggableLeft = ((draggable.positionAbs || draggable.position.absolute).left + (draggable.clickOffset || draggable.offset.click).left), - draggableTop = ((draggable.positionAbs || draggable.position.absolute).top + (draggable.clickOffset || draggable.offset.click).top), - isOver = $.ui.isOver(draggableTop, draggableLeft, t, l, droppable.proportions.height, droppable.proportions.width); - return isOver; + draggableLeft = ((draggable.positionAbs || draggable.position.absolute).left + (draggable.clickOffset || draggable.offset.click).left); + draggableTop = ((draggable.positionAbs || draggable.position.absolute).top + (draggable.clickOffset || draggable.offset.click).top); + return $.ui.isOver(draggableTop, draggableLeft, t, l, droppable.proportions.height, droppable.proportions.width); case 'touch': return ( (y1 >= t && y1 <= b) || // Top edge touching @@ -191,23 +228,35 @@ $.ui.ddmanager = { droppables: { 'default': [] }, prepareOffsets: function(t, event) { - var m = $.ui.ddmanager.droppables[t.options.scope] || []; - var type = event ? event.type : null; // workaround for #2317 - var list = (t.currentItem || t.element).find(":data(ui-droppable)").andSelf(); + var i, j, + m = $.ui.ddmanager.droppables[t.options.scope] || [], + type = event ? event.type : null, // workaround for #2317 + list = (t.currentItem || t.element).find(":data(ui-droppable)").andSelf(); - droppablesLoop: for (var i = 0; i < m.length; i++) { + droppablesLoop: for (i = 0; i < m.length; i++) { + + //No disabled and non-accepted + if(m[i].options.disabled || (t && !m[i].accept.call(m[i].element[0],(t.currentItem || t.element)))) { + continue; + } - if(m[i].options.disabled || (t && !m[i].accept.call(m[i].element[0],(t.currentItem || t.element)))) continue; //No disabled and non-accepted // Filter out elements in the current dragged item - for (var j=0; j < list.length; j++) { - if(list[j] == m[i].element[0]) { + for (j=0; j < list.length; j++) { + if(list[j] === m[i].element[0]) { m[i].proportions.height = 0; continue droppablesLoop; } } - m[i].visible = m[i].element.css("display") != "none"; if(!m[i].visible) continue; //If the element is not visible, continue - if(type == "mousedown") m[i]._activate.call(m[i], event); //Activate the droppable if used directly from draggables + m[i].visible = m[i].element.css("display") !== "none"; + if(!m[i].visible) { + continue; + } + + //Activate the droppable if used directly from draggables + if(type === "mousedown") { + m[i]._activate.call(m[i], event); + } m[i].offset = m[i].element.offset(); m[i].proportions = { width: m[i].element[0].offsetWidth, height: m[i].element[0].offsetHeight }; @@ -220,12 +269,16 @@ $.ui.ddmanager = { var dropped = false; $.each($.ui.ddmanager.droppables[draggable.options.scope] || [], function() { - if(!this.options) return; - if (!this.options.disabled && this.visible && $.ui.intersect(draggable, this, this.options.tolerance)) + if(!this.options) { + return; + } + if (!this.options.disabled && this.visible && $.ui.intersect(draggable, this, this.options.tolerance)) { dropped = this._drop.call(this, event) || dropped; + } if (!this.options.disabled && this.visible && this.accept.call(this.element[0],(draggable.currentItem || draggable.element))) { - this.isout = 1; this.isover = 0; + this.isout = true; + this.isover = false; this._deactivate.call(this, event); } @@ -236,51 +289,60 @@ $.ui.ddmanager = { dragStart: function( draggable, event ) { //Listen for scrolling so that if the dragging causes scrolling the position of the droppables can be recalculated (see #5003) draggable.element.parentsUntil( "body" ).bind( "scroll.droppable", function() { - if( !draggable.options.refreshPositions ) $.ui.ddmanager.prepareOffsets( draggable, event ); + if( !draggable.options.refreshPositions ) { + $.ui.ddmanager.prepareOffsets( draggable, event ); + } }); }, drag: function(draggable, event) { //If you have a highly dynamic page, you might try this option. It renders positions every time you move the mouse. - if(draggable.options.refreshPositions) $.ui.ddmanager.prepareOffsets(draggable, event); + if(draggable.options.refreshPositions) { + $.ui.ddmanager.prepareOffsets(draggable, event); + } //Run through all droppables and check their positions based on specific tolerance options $.each($.ui.ddmanager.droppables[draggable.options.scope] || [], function() { - if(this.options.disabled || this.greedyChild || !this.visible) return; - var intersects = $.ui.intersect(draggable, this, this.options.tolerance); + if(this.options.disabled || this.greedyChild || !this.visible) { + return; + } - var c = !intersects && this.isover == 1 ? 'isout' : (intersects && this.isover === 0 ? 'isover' : null); - if(!c) return; + var parentInstance, scope, parent, + intersects = $.ui.intersect(draggable, this, this.options.tolerance), + c = !intersects && this.isover ? 'isout' : (intersects && !this.isover ? 'isover' : null); + if(!c) { + return; + } - var parentInstance; if (this.options.greedy) { // find droppable parents with same scope - var scope = this.options.scope; - var parent = this.element.parents(':data(ui-droppable)').filter(function () { + scope = this.options.scope; + parent = this.element.parents(':data(ui-droppable)').filter(function () { return $.data(this, 'ui-droppable').options.scope === scope; }); if (parent.length) { parentInstance = $.data(parent[0], 'ui-droppable'); - parentInstance.greedyChild = (c == 'isover' ? 1 : 0); + parentInstance.greedyChild = (c === 'isover'); } } // we just moved into a greedy child - if (parentInstance && c == 'isover') { - parentInstance.isover = 0; - parentInstance.isout = 1; + if (parentInstance && c === 'isover') { + parentInstance.isover = false; + parentInstance.isout = true; parentInstance._out.call(parentInstance, event); } - this[c] = 1; this[c == 'isout' ? 'isover' : 'isout'] = 0; - this[c == "isover" ? "_over" : "_out"].call(this, event); + this[c] = true; + this[c === 'isout' ? 'isover' : 'isout'] = false; + this[c === "isover" ? "_over" : "_out"].call(this, event); // we just moved out of a greedy child - if (parentInstance && c == 'isout') { - parentInstance.isout = 0; - parentInstance.isover = 1; + if (parentInstance && c === 'isout') { + parentInstance.isout = false; + parentInstance.isover = true; parentInstance._over.call(parentInstance, event); } }); @@ -289,7 +351,9 @@ $.ui.ddmanager = { dragStop: function( draggable, event ) { draggable.element.parentsUntil( "body" ).unbind( "scroll.droppable" ); //Call prepareOffsets one final time since IE does not fire return scroll events when overflow was caused by drag (see #5003) - if( !draggable.options.refreshPositions ) $.ui.ddmanager.prepareOffsets( draggable, event ); + if( !draggable.options.refreshPositions ) { + $.ui.ddmanager.prepareOffsets( draggable, event ); + } } }; From 53c462b666ec5ca5f9e635bfcd7393a70f5bc39d Mon Sep 17 00:00:00 2001 From: Mike Sherov Date: Sun, 18 Nov 2012 11:44:12 -0500 Subject: [PATCH 11/28] Dev: make draggable pass JSHint with no local overrides --- ui/jquery.ui.draggable.js | 420 ++++++++++++++++++++++++-------------- 1 file changed, 267 insertions(+), 153 deletions(-) diff --git a/ui/jquery.ui.draggable.js b/ui/jquery.ui.draggable.js index 1f3c8d52c..dad5af074 100644 --- a/ui/jquery.ui.draggable.js +++ b/ui/jquery.ui.draggable.js @@ -15,7 +15,6 @@ */ (function( $, undefined ) { -/*jshint onevar: false, curly: false, eqeqeq: false, laxbreak: true, shadow: true, funcscope: true */ $.widget("ui.draggable", $.ui.mouse, { version: "@VERSION", widgetEventPrefix: "drag", @@ -47,11 +46,15 @@ $.widget("ui.draggable", $.ui.mouse, { }, _create: function() { - if (this.options.helper == 'original' && !(/^(?:r|a|f)/).test(this.element.css("position"))) + if (this.options.helper === 'original' && !(/^(?:r|a|f)/).test(this.element.css("position"))) { this.element[0].style.position = 'relative'; - - (this.options.addClasses && this.element.addClass("ui-draggable")); - (this.options.disabled && this.element.addClass("ui-draggable-disabled")); + } + if (this.options.addClasses){ + this.element.addClass("ui-draggable"); + } + if (this.options.disabled){ + this.element.addClass("ui-draggable-disabled"); + } this._mouseInit(); @@ -67,13 +70,15 @@ $.widget("ui.draggable", $.ui.mouse, { var o = this.options; // among others, prevent a drag on a resizable-handle - if (this.helper || o.disabled || $(event.target).is('.ui-resizable-handle')) + if (this.helper || o.disabled || $(event.target).is('.ui-resizable-handle')) { return false; + } //Quit if we're not on a valid handle this.handle = this._getHandle(event); - if (!this.handle) + if (!this.handle) { return false; + } $(o.iframeFix === true ? "iframe" : o.iframeFix).each(function() { $('
') @@ -102,8 +107,9 @@ $.widget("ui.draggable", $.ui.mouse, { this._cacheHelperProportions(); //If ddmanager is used for droppables, set the global draggable - if($.ui.ddmanager) + if($.ui.ddmanager) { $.ui.ddmanager.current = this; + } /* * - Position generation - @@ -142,8 +148,9 @@ $.widget("ui.draggable", $.ui.mouse, { (o.cursorAt && this._adjustOffsetFromHelper(o.cursorAt)); //Set a containment if given in the options - if(o.containment) + if(o.containment) { this._setContainment(); + } //Trigger event + callbacks if(this._trigger("start", event) === false) { @@ -155,14 +162,17 @@ $.widget("ui.draggable", $.ui.mouse, { this._cacheHelperProportions(); //Prepare the droppable offsets - if ($.ui.ddmanager && !o.dropBehaviour) + if ($.ui.ddmanager && !o.dropBehaviour) { $.ui.ddmanager.prepareOffsets(this, event); + } this._mouseDrag(event, true); //Execute the drag once - this causes the helper not to be visible before getting its correct position //If the ddmanager is used for droppables, inform the manager that dragging has started (see #5003) - if ( $.ui.ddmanager ) $.ui.ddmanager.dragStart(this, event); + if ( $.ui.ddmanager ) { + $.ui.ddmanager.dragStart(this, event); + } return true; }, @@ -183,9 +193,15 @@ $.widget("ui.draggable", $.ui.mouse, { this.position = ui.position; } - if(!this.options.axis || this.options.axis != "y") this.helper[0].style.left = this.position.left+'px'; - if(!this.options.axis || this.options.axis != "x") this.helper[0].style.top = this.position.top+'px'; - if($.ui.ddmanager) $.ui.ddmanager.drag(this, event); + if(!this.options.axis || this.options.axis !== "y") { + this.helper[0].style.left = this.position.left+'px'; + } + if(!this.options.axis || this.options.axis !== "x") { + this.helper[0].style.top = this.position.top+'px'; + } + if($.ui.ddmanager) { + $.ui.ddmanager.drag(this, event); + } return false; }, @@ -193,9 +209,13 @@ $.widget("ui.draggable", $.ui.mouse, { _mouseStop: function(event) { //If we are using droppables, inform the manager about the drop - var dropped = false; - if ($.ui.ddmanager && !this.options.dropBehaviour) + var element, + that = this, + elementInDom = false, + dropped = false; + if ($.ui.ddmanager && !this.options.dropBehaviour) { dropped = $.ui.ddmanager.drop(this, event); + } //if a drop comes from outside (a sortable) if(this.dropped) { @@ -204,17 +224,17 @@ $.widget("ui.draggable", $.ui.mouse, { } //if the original element is no longer in the DOM don't bother to continue (see #8269) - var element = this.element[0], elementInDom = false; + element = this.element[0]; while ( element && (element = element.parentNode) ) { - if (element == document ) { + if (element === document ) { elementInDom = true; } } - if ( !elementInDom && this.options.helper === "original" ) + if ( !elementInDom && this.options.helper === "original" ) { return false; + } - if((this.options.revert == "invalid" && !dropped) || (this.options.revert == "valid" && dropped) || this.options.revert === true || ($.isFunction(this.options.revert) && this.options.revert.call(this.element, dropped))) { - var that = this; + if((this.options.revert === "invalid" && !dropped) || (this.options.revert === "valid" && dropped) || this.options.revert === true || ($.isFunction(this.options.revert) && this.options.revert.call(this.element, dropped))) { $(this.helper).animate(this.originalPosition, parseInt(this.options.revertDuration, 10), function() { if(that._trigger("stop", event) !== false) { that._clear(); @@ -236,7 +256,9 @@ $.widget("ui.draggable", $.ui.mouse, { }); //If the ddmanager is used for droppables, inform the manager that dragging has stopped (see #5003) - if( $.ui.ddmanager ) $.ui.ddmanager.dragStop(this, event); + if( $.ui.ddmanager ) { + $.ui.ddmanager.dragStop(this, event); + } return $.ui.mouse.prototype._mouseUp.call(this, event); }, @@ -260,7 +282,9 @@ $.widget("ui.draggable", $.ui.mouse, { .find("*") .andSelf() .each(function() { - if(this == event.target) handle = true; + if(this === event.target) { + handle = true; + } }); return handle; @@ -269,21 +293,23 @@ $.widget("ui.draggable", $.ui.mouse, { _createHelper: function(event) { - var o = this.options; - var helper = $.isFunction(o.helper) ? $(o.helper.apply(this.element[0], [event])) : (o.helper == 'clone' ? this.element.clone().removeAttr('id') : this.element); + var o = this.options, + helper = $.isFunction(o.helper) ? $(o.helper.apply(this.element[0], [event])) : (o.helper === 'clone' ? this.element.clone().removeAttr('id') : this.element); - if(!helper.parents('body').length) - helper.appendTo((o.appendTo == 'parent' ? this.element[0].parentNode : o.appendTo)); + if(!helper.parents('body').length) { + helper.appendTo((o.appendTo === 'parent' ? this.element[0].parentNode : o.appendTo)); + } - if(helper[0] != this.element[0] && !(/(fixed|absolute)/).test(helper.css("position"))) + if(helper[0] !== this.element[0] && !(/(fixed|absolute)/).test(helper.css("position"))) { helper.css("position", "absolute"); + } return helper; }, _adjustOffsetFromHelper: function(obj) { - if (typeof obj == 'string') { + if (typeof obj === 'string') { obj = obj.split(' '); } if ($.isArray(obj)) { @@ -313,14 +339,17 @@ $.widget("ui.draggable", $.ui.mouse, { // 1. The position of the helper is absolute, so it's position is calculated based on the next positioned parent // 2. The actual offset parent is a child of the scroll parent, and the scroll parent isn't the document, which means that // the scroll is included in the initial calculation of the offset of the parent, and never recalculated upon drag - if(this.cssPosition == 'absolute' && this.scrollParent[0] != document && $.contains(this.scrollParent[0], this.offsetParent[0])) { + if(this.cssPosition === 'absolute' && this.scrollParent[0] !== document && $.contains(this.scrollParent[0], this.offsetParent[0])) { po.left += this.scrollParent.scrollLeft(); po.top += this.scrollParent.scrollTop(); } - if((this.offsetParent[0] == document.body) //This needs to be actually done for all browsers, since pageX/pageY includes this information - || (this.offsetParent[0].tagName && this.offsetParent[0].tagName.toLowerCase() == 'html' && $.ui.ie)) //Ugly IE fix + //This needs to be actually done for all browsers, since pageX/pageY includes this information + //Ugly IE fix + if((this.offsetParent[0] === document.body) || + (this.offsetParent[0].tagName && this.offsetParent[0].tagName.toLowerCase() === 'html' && $.ui.ie)) { po = { top: 0, left: 0 }; + } return { top: po.top + (parseInt(this.offsetParent.css("borderTopWidth"),10) || 0), @@ -331,7 +360,7 @@ $.widget("ui.draggable", $.ui.mouse, { _getRelativeOffset: function() { - if(this.cssPosition == "relative") { + if(this.cssPosition === "relative") { var p = this.element.position(); return { top: p.top - (parseInt(this.helper.css("top"),10) || 0) + this.scrollParent.scrollTop(), @@ -361,19 +390,30 @@ $.widget("ui.draggable", $.ui.mouse, { _setContainment: function() { - var o = this.options; - if(o.containment == 'parent') o.containment = this.helper[0].parentNode; - if(o.containment == 'document' || o.containment == 'window') this.containment = [ - o.containment == 'document' ? 0 : $(window).scrollLeft() - this.offset.relative.left - this.offset.parent.left, - o.containment == 'document' ? 0 : $(window).scrollTop() - this.offset.relative.top - this.offset.parent.top, - (o.containment == 'document' ? 0 : $(window).scrollLeft()) + $(o.containment == 'document' ? document : window).width() - this.helperProportions.width - this.margins.left, - (o.containment == 'document' ? 0 : $(window).scrollTop()) + ($(o.containment == 'document' ? document : window).height() || document.body.parentNode.scrollHeight) - this.helperProportions.height - this.margins.top - ]; + var over, c, ce, + o = this.options; - if(!(/^(document|window|parent)$/).test(o.containment) && o.containment.constructor != Array) { - var c = $(o.containment); - var ce = c[0]; if(!ce) return; - var over = ($(ce).css("overflow") != 'hidden'); + if(o.containment === 'parent') { + o.containment = this.helper[0].parentNode; + } + if(o.containment === 'document' || o.containment === 'window') { + this.containment = [ + o.containment === 'document' ? 0 : $(window).scrollLeft() - this.offset.relative.left - this.offset.parent.left, + o.containment === 'document' ? 0 : $(window).scrollTop() - this.offset.relative.top - this.offset.parent.top, + (o.containment === 'document' ? 0 : $(window).scrollLeft()) + $(o.containment === 'document' ? document : window).width() - this.helperProportions.width - this.margins.left, + (o.containment === 'document' ? 0 : $(window).scrollTop()) + ($(o.containment === 'document' ? document : window).height() || document.body.parentNode.scrollHeight) - this.helperProportions.height - this.margins.top + ]; + } + + if(!(/^(document|window|parent)$/).test(o.containment) && o.containment.constructor !== Array) { + c = $(o.containment); + ce = c[0]; + + if(!ce) { + return; + } + + over = ($(ce).css("overflow") !== 'hidden'); this.containment = [ (parseInt($(ce).css("borderLeftWidth"),10) || 0) + (parseInt($(ce).css("paddingLeft"),10) || 0), @@ -383,7 +423,7 @@ $.widget("ui.draggable", $.ui.mouse, { ]; this.relative_container = c; - } else if(o.containment.constructor == Array) { + } else if(o.containment.constructor === Array) { this.containment = o.containment; } @@ -391,22 +431,25 @@ $.widget("ui.draggable", $.ui.mouse, { _convertPositionTo: function(d, pos) { - if(!pos) pos = this.position; - var mod = d == "absolute" ? 1 : -1; - var scroll = this.cssPosition == 'absolute' && !(this.scrollParent[0] != document && $.contains(this.scrollParent[0], this.offsetParent[0])) ? this.offsetParent : this.scrollParent, scrollIsRootNode = (/(html|body)/i).test(scroll[0].tagName); + if(!pos) { + pos = this.position; + } + + var mod = d === "absolute" ? 1 : -1, + scroll = this.cssPosition === 'absolute' && !(this.scrollParent[0] !== document && $.contains(this.scrollParent[0], this.offsetParent[0])) ? this.offsetParent : this.scrollParent, scrollIsRootNode = (/(html|body)/i).test(scroll[0].tagName); return { top: ( - pos.top // The absolute mouse position - + this.offset.relative.top * mod // Only for relative positioned nodes: Relative offset from element to offset parent - + this.offset.parent.top * mod // The offsetParent's offset without borders (offset + border) - - ( ( this.cssPosition == 'fixed' ? -this.scrollParent.scrollTop() : ( scrollIsRootNode ? 0 : scroll.scrollTop() ) ) * mod) + pos.top + // The absolute mouse position + this.offset.relative.top * mod + // Only for relative positioned nodes: Relative offset from element to offset parent + this.offset.parent.top * mod - // The offsetParent's offset without borders (offset + border) + ( ( this.cssPosition === 'fixed' ? -this.scrollParent.scrollTop() : ( scrollIsRootNode ? 0 : scroll.scrollTop() ) ) * mod) ), left: ( - pos.left // The absolute mouse position - + this.offset.relative.left * mod // Only for relative positioned nodes: Relative offset from element to offset parent - + this.offset.parent.left * mod // The offsetParent's offset without borders (offset + border) - - ( ( this.cssPosition == 'fixed' ? -this.scrollParent.scrollLeft() : scrollIsRootNode ? 0 : scroll.scrollLeft() ) * mod) + pos.left + // The absolute mouse position + this.offset.relative.left * mod + // Only for relative positioned nodes: Relative offset from element to offset parent + this.offset.parent.left * mod - // The offsetParent's offset without borders (offset + border) + ( ( this.cssPosition === 'fixed' ? -this.scrollParent.scrollLeft() : scrollIsRootNode ? 0 : scroll.scrollLeft() ) * mod) ) }; @@ -414,9 +457,12 @@ $.widget("ui.draggable", $.ui.mouse, { _generatePosition: function(event) { - var o = this.options, scroll = this.cssPosition == 'absolute' && !(this.scrollParent[0] != document && $.contains(this.scrollParent[0], this.offsetParent[0])) ? this.offsetParent : this.scrollParent, scrollIsRootNode = (/(html|body)/i).test(scroll[0].tagName); - var pageX = event.pageX; - var pageY = event.pageY; + var containment, co, top, left, + o = this.options, + scroll = this.cssPosition === 'absolute' && !(this.scrollParent[0] !== document && $.contains(this.scrollParent[0], this.offsetParent[0])) ? this.offsetParent : this.scrollParent, + scrollIsRootNode = (/(html|body)/i).test(scroll[0].tagName), + pageX = event.pageX, + pageY = event.pageY; /* * - Position constraining - @@ -424,10 +470,9 @@ $.widget("ui.draggable", $.ui.mouse, { */ if(this.originalPosition) { //If we are not dragging yet, we won't check for options - var containment; if(this.containment) { if (this.relative_container){ - var co = this.relative_container.offset(); + co = this.relative_container.offset(); containment = [ this.containment[0] + co.left, this.containment[1] + co.top, this.containment[2] + co.left, @@ -437,18 +482,26 @@ $.widget("ui.draggable", $.ui.mouse, { containment = this.containment; } - if(event.pageX - this.offset.click.left < containment[0]) pageX = containment[0] + this.offset.click.left; - if(event.pageY - this.offset.click.top < containment[1]) pageY = containment[1] + this.offset.click.top; - if(event.pageX - this.offset.click.left > containment[2]) pageX = containment[2] + this.offset.click.left; - if(event.pageY - this.offset.click.top > containment[3]) pageY = containment[3] + this.offset.click.top; + if(event.pageX - this.offset.click.left < containment[0]) { + pageX = containment[0] + this.offset.click.left; + } + if(event.pageY - this.offset.click.top < containment[1]) { + pageY = containment[1] + this.offset.click.top; + } + if(event.pageX - this.offset.click.left > containment[2]) { + pageX = containment[2] + this.offset.click.left; + } + if(event.pageY - this.offset.click.top > containment[3]) { + pageY = containment[3] + this.offset.click.top; + } } if(o.grid) { //Check for grid elements set to 0 to prevent divide by 0 error causing invalid argument errors in IE (see ticket #6950) - var top = o.grid[1] ? this.originalPageY + Math.round((pageY - this.originalPageY) / o.grid[1]) * o.grid[1] : this.originalPageY; + top = o.grid[1] ? this.originalPageY + Math.round((pageY - this.originalPageY) / o.grid[1]) * o.grid[1] : this.originalPageY; pageY = containment ? ((top - this.offset.click.top >= containment[1] || top - this.offset.click.top > containment[3]) ? top : ((top - this.offset.click.top >= containment[1]) ? top - o.grid[1] : top + o.grid[1])) : top; - var left = o.grid[0] ? this.originalPageX + Math.round((pageX - this.originalPageX) / o.grid[0]) * o.grid[0] : this.originalPageX; + left = o.grid[0] ? this.originalPageX + Math.round((pageX - this.originalPageX) / o.grid[0]) * o.grid[0] : this.originalPageX; pageX = containment ? ((left - this.offset.click.left >= containment[0] || left - this.offset.click.left > containment[2]) ? left : ((left - this.offset.click.left >= containment[0]) ? left - o.grid[0] : left + o.grid[0])) : left; } @@ -456,18 +509,18 @@ $.widget("ui.draggable", $.ui.mouse, { return { top: ( - pageY // The absolute mouse position - - this.offset.click.top // Click offset (relative to the element) - - this.offset.relative.top // Only for relative positioned nodes: Relative offset from element to offset parent - - this.offset.parent.top // The offsetParent's offset without borders (offset + border) - + ( ( this.cssPosition == 'fixed' ? -this.scrollParent.scrollTop() : ( scrollIsRootNode ? 0 : scroll.scrollTop() ) )) + pageY - // The absolute mouse position + this.offset.click.top - // Click offset (relative to the element) + this.offset.relative.top - // Only for relative positioned nodes: Relative offset from element to offset parent + this.offset.parent.top + // The offsetParent's offset without borders (offset + border) + ( ( this.cssPosition === 'fixed' ? -this.scrollParent.scrollTop() : ( scrollIsRootNode ? 0 : scroll.scrollTop() ) )) ), left: ( - pageX // The absolute mouse position - - this.offset.click.left // Click offset (relative to the element) - - this.offset.relative.left // Only for relative positioned nodes: Relative offset from element to offset parent - - this.offset.parent.left // The offsetParent's offset without borders (offset + border) - + ( ( this.cssPosition == 'fixed' ? -this.scrollParent.scrollLeft() : scrollIsRootNode ? 0 : scroll.scrollLeft() )) + pageX - // The absolute mouse position + this.offset.click.left - // Click offset (relative to the element) + this.offset.relative.left - // Only for relative positioned nodes: Relative offset from element to offset parent + this.offset.parent.left + // The offsetParent's offset without borders (offset + border) + ( ( this.cssPosition === 'fixed' ? -this.scrollParent.scrollLeft() : scrollIsRootNode ? 0 : scroll.scrollLeft() )) ) }; @@ -475,8 +528,9 @@ $.widget("ui.draggable", $.ui.mouse, { _clear: function() { this.helper.removeClass("ui-draggable-dragging"); - if(this.helper[0] != this.element[0] && !this.cancelHelperRemoval) this.helper.remove(); - //if($.ui.ddmanager) $.ui.ddmanager.current = null; + if(this.helper[0] !== this.element[0] && !this.cancelHelperRemoval) { + this.helper.remove(); + } this.helper = null; this.cancelHelperRemoval = false; }, @@ -486,7 +540,10 @@ $.widget("ui.draggable", $.ui.mouse, { _trigger: function(type, event, ui) { ui = ui || this._uiHash(); $.ui.plugin.call(this, type, [event, ui]); - if(type == "drag") this.positionAbs = this._convertPositionTo("absolute"); //The absolute position has to be recalculated after plugins + //The absolute position has to be recalculated after plugins + if(type === "drag") { + this.positionAbs = this._convertPositionTo("absolute"); + } return $.Widget.prototype._trigger.call(this, type, event, ui); }, @@ -537,7 +594,9 @@ $.ui.plugin.add("draggable", "connectToSortable", { this.instance.cancelHelperRemoval = false; //Remove it in the sortable instance (so sortable plugins like revert still work) //The sortable revert is supported, and we have to set a temporary dropped variable on the draggable to support revert: 'valid/invalid' - if(this.shouldRevert) this.instance.options.revert = true; + if(this.shouldRevert) { + this.instance.options.revert = true; + } //Trigger the stop of the sortable this.instance._mouseStop(event); @@ -545,8 +604,9 @@ $.ui.plugin.add("draggable", "connectToSortable", { this.instance.options.helper = this.instance.options._helper; //If the helper has been the original item, restore properties in the sortable - if(inst.options.helper == 'original') + if(inst.options.helper === 'original') { this.instance.currentItem.css({ top: 'auto', left: 'auto' }); + } } else { this.instance.cancelHelperRemoval = false; //Remove the helper in the sortable instance @@ -562,8 +622,9 @@ $.ui.plugin.add("draggable", "connectToSortable", { $.each(inst.sortables, function() { - var innermostIntersecting = false; - var thisSortable = this; + var innermostIntersecting = false, + thisSortable = this; + //Copy over some variables to allow calling the sortable's native _intersectsWith this.instance.positionAbs = inst.positionAbs; this.instance.helperProportions = inst.helperProportions; @@ -575,11 +636,13 @@ $.ui.plugin.add("draggable", "connectToSortable", { this.instance.positionAbs = inst.positionAbs; this.instance.helperProportions = inst.helperProportions; this.instance.offset.click = inst.offset.click; - if (this != thisSortable - && this.instance._intersectsWith(this.instance.containerCache) - && $.ui.contains(thisSortable.instance.element[0], this.instance.element[0])) + if (this !== thisSortable && + this.instance._intersectsWith(this.instance.containerCache) && + $.ui.contains(thisSortable.instance.element[0], this.instance.element[0]) + ) { innermostIntersecting = false; - return innermostIntersecting; + } + return innermostIntersecting; }); } @@ -615,7 +678,9 @@ $.ui.plugin.add("draggable", "connectToSortable", { } //Provided we did all the previous steps, we can fire the drag event of the sortable on every draggable drag, when it intersects with the sortable - if(this.instance.currentItem) this.instance._mouseDrag(event); + if(this.instance.currentItem) { + this.instance._mouseDrag(event); + } } else { @@ -637,7 +702,9 @@ $.ui.plugin.add("draggable", "connectToSortable", { //Now we remove our currentItem, the list group clone again, and the placeholder, and animate the helper back to it's original size this.instance.currentItem.remove(); - if(this.instance.placeholder) this.instance.placeholder.remove(); + if(this.instance.placeholder) { + this.instance.placeholder.remove(); + } inst._trigger("fromSortable", event); inst.dropped = false; //draggable revert needs that @@ -653,72 +720,87 @@ $.ui.plugin.add("draggable", "connectToSortable", { $.ui.plugin.add("draggable", "cursor", { start: function() { var t = $('body'), o = $(this).data('ui-draggable').options; - if (t.css("cursor")) o._cursor = t.css("cursor"); + if (t.css("cursor")) { + o._cursor = t.css("cursor"); + } t.css("cursor", o.cursor); }, stop: function() { var o = $(this).data('ui-draggable').options; - if (o._cursor) $('body').css("cursor", o._cursor); + if (o._cursor) { + $('body').css("cursor", o._cursor); + } } }); $.ui.plugin.add("draggable", "opacity", { start: function(event, ui) { var t = $(ui.helper), o = $(this).data('ui-draggable').options; - if(t.css("opacity")) o._opacity = t.css("opacity"); + if(t.css("opacity")) { + o._opacity = t.css("opacity"); + } t.css('opacity', o.opacity); }, stop: function(event, ui) { var o = $(this).data('ui-draggable').options; - if(o._opacity) $(ui.helper).css('opacity', o._opacity); + if(o._opacity) { + $(ui.helper).css('opacity', o._opacity); + } } }); $.ui.plugin.add("draggable", "scroll", { start: function() { var i = $(this).data("ui-draggable"); - if(i.scrollParent[0] != document && i.scrollParent[0].tagName != 'HTML') i.overflowOffset = i.scrollParent.offset(); + if(i.scrollParent[0] !== document && i.scrollParent[0].tagName !== 'HTML') { + i.overflowOffset = i.scrollParent.offset(); + } }, drag: function( event ) { var i = $(this).data("ui-draggable"), o = i.options, scrolled = false; - if(i.scrollParent[0] != document && i.scrollParent[0].tagName != 'HTML') { + if(i.scrollParent[0] !== document && i.scrollParent[0].tagName !== 'HTML') { - if(!o.axis || o.axis != 'x') { - if((i.overflowOffset.top + i.scrollParent[0].offsetHeight) - event.pageY < o.scrollSensitivity) + if(!o.axis || o.axis !== 'x') { + if((i.overflowOffset.top + i.scrollParent[0].offsetHeight) - event.pageY < o.scrollSensitivity) { i.scrollParent[0].scrollTop = scrolled = i.scrollParent[0].scrollTop + o.scrollSpeed; - else if(event.pageY - i.overflowOffset.top < o.scrollSensitivity) + } else if(event.pageY - i.overflowOffset.top < o.scrollSensitivity) { i.scrollParent[0].scrollTop = scrolled = i.scrollParent[0].scrollTop - o.scrollSpeed; + } } - if(!o.axis || o.axis != 'y') { - if((i.overflowOffset.left + i.scrollParent[0].offsetWidth) - event.pageX < o.scrollSensitivity) + if(!o.axis || o.axis !== 'y') { + if((i.overflowOffset.left + i.scrollParent[0].offsetWidth) - event.pageX < o.scrollSensitivity) { i.scrollParent[0].scrollLeft = scrolled = i.scrollParent[0].scrollLeft + o.scrollSpeed; - else if(event.pageX - i.overflowOffset.left < o.scrollSensitivity) + } else if(event.pageX - i.overflowOffset.left < o.scrollSensitivity) { i.scrollParent[0].scrollLeft = scrolled = i.scrollParent[0].scrollLeft - o.scrollSpeed; + } } } else { - if(!o.axis || o.axis != 'x') { - if(event.pageY - $(document).scrollTop() < o.scrollSensitivity) + if(!o.axis || o.axis !== 'x') { + if(event.pageY - $(document).scrollTop() < o.scrollSensitivity) { scrolled = $(document).scrollTop($(document).scrollTop() - o.scrollSpeed); - else if($(window).height() - (event.pageY - $(document).scrollTop()) < o.scrollSensitivity) + } else if($(window).height() - (event.pageY - $(document).scrollTop()) < o.scrollSensitivity) { scrolled = $(document).scrollTop($(document).scrollTop() + o.scrollSpeed); + } } - if(!o.axis || o.axis != 'y') { - if(event.pageX - $(document).scrollLeft() < o.scrollSensitivity) + if(!o.axis || o.axis !== 'y') { + if(event.pageX - $(document).scrollLeft() < o.scrollSensitivity) { scrolled = $(document).scrollLeft($(document).scrollLeft() - o.scrollSpeed); - else if($(window).width() - (event.pageX - $(document).scrollLeft()) < o.scrollSensitivity) + } else if($(window).width() - (event.pageX - $(document).scrollLeft()) < o.scrollSensitivity) { scrolled = $(document).scrollLeft($(document).scrollLeft() + o.scrollSpeed); + } } } - if(scrolled !== false && $.ui.ddmanager && !o.dropBehaviour) + if(scrolled !== false && $.ui.ddmanager && !o.dropBehaviour) { $.ui.ddmanager.prepareOffsets(i, event); + } } }); @@ -726,65 +808,92 @@ $.ui.plugin.add("draggable", "scroll", { $.ui.plugin.add("draggable", "snap", { start: function() { - var i = $(this).data("ui-draggable"), o = i.options; + var i = $(this).data("ui-draggable"), + o = i.options; + i.snapElements = []; - $(o.snap.constructor != String ? ( o.snap.items || ':data(ui-draggable)' ) : o.snap).each(function() { - var $t = $(this); var $o = $t.offset(); - if(this != i.element[0]) i.snapElements.push({ - item: this, - width: $t.outerWidth(), height: $t.outerHeight(), - top: $o.top, left: $o.left - }); + $(o.snap.constructor !== String ? ( o.snap.items || ':data(ui-draggable)' ) : o.snap).each(function() { + var $t = $(this), + $o = $t.offset(); + if(this !== i.element[0]) { + i.snapElements.push({ + item: this, + width: $t.outerWidth(), height: $t.outerHeight(), + top: $o.top, left: $o.left + }); + } }); }, drag: function(event, ui) { - var inst = $(this).data("ui-draggable"), o = inst.options; - var d = o.snapTolerance; - - var x1 = ui.offset.left, x2 = x1 + inst.helperProportions.width, + var ts, bs, ls, rs, l, r, t, b, i, first, + inst = $(this).data("ui-draggable"), + o = inst.options, + d = o.snapTolerance, + x1 = ui.offset.left, x2 = x1 + inst.helperProportions.width, y1 = ui.offset.top, y2 = y1 + inst.helperProportions.height; - for (var i = inst.snapElements.length - 1; i >= 0; i--){ + for (i = inst.snapElements.length - 1; i >= 0; i--){ - var l = inst.snapElements[i].left, r = l + inst.snapElements[i].width, - t = inst.snapElements[i].top, b = t + inst.snapElements[i].height; + l = inst.snapElements[i].left; + r = l + inst.snapElements[i].width; + t = inst.snapElements[i].top; + b = t + inst.snapElements[i].height; //Yes, I know, this is insane ;) if(!((l-d < x1 && x1 < r+d && t-d < y1 && y1 < b+d) || (l-d < x1 && x1 < r+d && t-d < y2 && y2 < b+d) || (l-d < x2 && x2 < r+d && t-d < y1 && y1 < b+d) || (l-d < x2 && x2 < r+d && t-d < y2 && y2 < b+d))) { - if(inst.snapElements[i].snapping) (inst.options.snap.release && inst.options.snap.release.call(inst.element, event, $.extend(inst._uiHash(), { snapItem: inst.snapElements[i].item }))); + if(inst.snapElements[i].snapping) { + (inst.options.snap.release && inst.options.snap.release.call(inst.element, event, $.extend(inst._uiHash(), { snapItem: inst.snapElements[i].item }))); + } inst.snapElements[i].snapping = false; continue; } - if(o.snapMode != 'inner') { - var ts = Math.abs(t - y2) <= d; - var bs = Math.abs(b - y1) <= d; - var ls = Math.abs(l - x2) <= d; - var rs = Math.abs(r - x1) <= d; - if(ts) ui.position.top = inst._convertPositionTo("relative", { top: t - inst.helperProportions.height, left: 0 }).top - inst.margins.top; - if(bs) ui.position.top = inst._convertPositionTo("relative", { top: b, left: 0 }).top - inst.margins.top; - if(ls) ui.position.left = inst._convertPositionTo("relative", { top: 0, left: l - inst.helperProportions.width }).left - inst.margins.left; - if(rs) ui.position.left = inst._convertPositionTo("relative", { top: 0, left: r }).left - inst.margins.left; + if(o.snapMode !== 'inner') { + ts = Math.abs(t - y2) <= d; + bs = Math.abs(b - y1) <= d; + ls = Math.abs(l - x2) <= d; + rs = Math.abs(r - x1) <= d; + if(ts) { + ui.position.top = inst._convertPositionTo("relative", { top: t - inst.helperProportions.height, left: 0 }).top - inst.margins.top; + } + if(bs) { + ui.position.top = inst._convertPositionTo("relative", { top: b, left: 0 }).top - inst.margins.top; + } + if(ls) { + ui.position.left = inst._convertPositionTo("relative", { top: 0, left: l - inst.helperProportions.width }).left - inst.margins.left; + } + if(rs) { + ui.position.left = inst._convertPositionTo("relative", { top: 0, left: r }).left - inst.margins.left; + } } - var first = (ts || bs || ls || rs); + first = (ts || bs || ls || rs); - if(o.snapMode != 'outer') { - var ts = Math.abs(t - y1) <= d; - var bs = Math.abs(b - y2) <= d; - var ls = Math.abs(l - x1) <= d; - var rs = Math.abs(r - x2) <= d; - if(ts) ui.position.top = inst._convertPositionTo("relative", { top: t, left: 0 }).top - inst.margins.top; - if(bs) ui.position.top = inst._convertPositionTo("relative", { top: b - inst.helperProportions.height, left: 0 }).top - inst.margins.top; - if(ls) ui.position.left = inst._convertPositionTo("relative", { top: 0, left: l }).left - inst.margins.left; - if(rs) ui.position.left = inst._convertPositionTo("relative", { top: 0, left: r - inst.helperProportions.width }).left - inst.margins.left; + if(o.snapMode !== 'outer') { + ts = Math.abs(t - y1) <= d; + bs = Math.abs(b - y2) <= d; + ls = Math.abs(l - x1) <= d; + rs = Math.abs(r - x2) <= d; + if(ts) { + ui.position.top = inst._convertPositionTo("relative", { top: t, left: 0 }).top - inst.margins.top; + } + if(bs) { + ui.position.top = inst._convertPositionTo("relative", { top: b - inst.helperProportions.height, left: 0 }).top - inst.margins.top; + } + if(ls) { + ui.position.left = inst._convertPositionTo("relative", { top: 0, left: l }).left - inst.margins.left; + } + if(rs) { + ui.position.left = inst._convertPositionTo("relative", { top: 0, left: r - inst.helperProportions.width }).left - inst.margins.left; + } } - if(!inst.snapElements[i].snapping && (ts || bs || ls || rs || first)) + if(!inst.snapElements[i].snapping && (ts || bs || ls || rs || first)) { (inst.options.snap.snap && inst.options.snap.snap.call(inst.element, event, $.extend(inst._uiHash(), { snapItem: inst.snapElements[i].item }))); + } inst.snapElements[i].snapping = (ts || bs || ls || rs || first); } @@ -795,14 +904,15 @@ $.ui.plugin.add("draggable", "snap", { $.ui.plugin.add("draggable", "stack", { start: function() { - var o = $(this).data("ui-draggable").options; + var min, + o = $(this).data("ui-draggable").options, + group = $.makeArray($(o.stack)).sort(function(a,b) { + return (parseInt($(a).css("zIndex"),10) || 0) - (parseInt($(b).css("zIndex"),10) || 0); + }); - var group = $.makeArray($(o.stack)).sort(function(a,b) { - return (parseInt($(a).css("zIndex"),10) || 0) - (parseInt($(b).css("zIndex"),10) || 0); - }); if (!group.length) { return; } - var min = parseInt(group[0].style.zIndex, 10) || 0; + min = parseInt(group[0].style.zIndex, 10) || 0; $(group).each(function(i) { this.style.zIndex = min + i; }); @@ -815,12 +925,16 @@ $.ui.plugin.add("draggable", "stack", { $.ui.plugin.add("draggable", "zIndex", { start: function(event, ui) { var t = $(ui.helper), o = $(this).data("ui-draggable").options; - if(t.css("zIndex")) o._zIndex = t.css("zIndex"); + if(t.css("zIndex")) { + o._zIndex = t.css("zIndex"); + } t.css('zIndex', o.zIndex); }, stop: function(event, ui) { var o = $(this).data("ui-draggable").options; - if(o._zIndex) $(ui.helper).css('zIndex', o._zIndex); + if(o._zIndex) { + $(ui.helper).css('zIndex', o._zIndex); + } } }); From 4334b5d4f1113ef751cb6738d8b2a60467a700e4 Mon Sep 17 00:00:00 2001 From: Mike Sherov Date: Sun, 18 Nov 2012 15:01:30 -0500 Subject: [PATCH 12/28] Dev: make Datepicker pass JSHint with only eval setting overridden --- ui/jquery.ui.datepicker.js | 1211 +++++++++++++++++++++--------------- 1 file changed, 705 insertions(+), 506 deletions(-) diff --git a/ui/jquery.ui.datepicker.js b/ui/jquery.ui.datepicker.js index e3c3bd398..584f21aaa 100644 --- a/ui/jquery.ui.datepicker.js +++ b/ui/jquery.ui.datepicker.js @@ -13,12 +13,12 @@ */ (function( $, undefined ) { -/*jshint onevar: false, curly: false, eqeqeq: false, shadow: true, devel: true, evil: true */ +/*jshint evil: true */ $.extend($.ui, { datepicker: { version: "@VERSION" } }); -var PROP_NAME = 'datepicker'; -var dpuuid = new Date().getTime(); -var instActive; +var PROP_NAME = 'datepicker', + dpuuid = new Date().getTime(), + instActive; /* Date picker manager. Use the singleton instance of this class, $.datepicker, to interact with the date picker. @@ -26,7 +26,6 @@ var instActive; allowing multiple different settings on the same page. */ function Datepicker() { - this.debug = false; // Change this to true to start debugging this._curInst = null; // The current instance in use this._keyEvent = false; // If the last event was a key event this._disabledInputs = []; // List of date picker inputs that have been disabled @@ -121,12 +120,6 @@ $.extend(Datepicker.prototype, { //Keep track of the maximum number of rows displayed (see #7043) maxRows: 4, - /* Debug logging (if enabled). */ - log: function () { - if (this.debug) - console.log.apply('', arguments); - }, - // TODO rename to "widget" when switching to widget factory _widgetDatepicker: function() { return this.dpDiv; @@ -147,9 +140,10 @@ $.extend(Datepicker.prototype, { */ _attachDatepicker: function(target, settings) { // check for settings on the control itself - in namespace 'date:' - var inlineSettings = null; - for (var attrName in this._defaults) { - var attrValue = target.getAttribute('date:' + attrName); + var attrName, attrValue, nodeName, inline, inst, + inlineSettings = null; + for (attrName in this._defaults) { + attrValue = target.getAttribute('date:' + attrName); if (attrValue) { inlineSettings = inlineSettings || {}; try { @@ -159,15 +153,15 @@ $.extend(Datepicker.prototype, { } } } - var nodeName = target.nodeName.toLowerCase(); - var inline = (nodeName == 'div' || nodeName == 'span'); + nodeName = target.nodeName.toLowerCase(); + inline = (nodeName === 'div' || nodeName === 'span'); if (!target.id) { this.uuid += 1; target.id = 'dp' + this.uuid; } - var inst = this._newInst($(target), inline); + inst = this._newInst($(target), inline); inst.settings = $.extend({}, settings || {}, inlineSettings || {}); - if (nodeName == 'input') { + if (nodeName === 'input') { this._connectDatepicker(target, inst); } else if (inline) { this._inlineDatepicker(target, inst); @@ -190,8 +184,9 @@ $.extend(Datepicker.prototype, { var input = $(target); inst.append = $([]); inst.trigger = $([]); - if (input.hasClass(this.markerClassName)) + if (input.hasClass(this.markerClassName)) { return; + } this._attachments(input, inst); input.addClass(this.markerClassName).keydown(this._doKeyDown). keypress(this._doKeyPress).keyup(this._doKeyUp). @@ -210,23 +205,31 @@ $.extend(Datepicker.prototype, { /* Make attachments based on settings. */ _attachments: function(input, inst) { - var appendText = this._get(inst, 'appendText'); - var isRTL = this._get(inst, 'isRTL'); - if (inst.append) + var showOn, buttonText, buttonImage, + appendText = this._get(inst, 'appendText'), + isRTL = this._get(inst, 'isRTL'); + + if (inst.append) { inst.append.remove(); + } if (appendText) { inst.append = $('' + appendText + ''); input[isRTL ? 'before' : 'after'](inst.append); } + input.unbind('focus', this._showDatepicker); - if (inst.trigger) + + if (inst.trigger) { inst.trigger.remove(); - var showOn = this._get(inst, 'showOn'); - if (showOn == 'focus' || showOn == 'both') // pop-up date picker when in the marked field + } + + showOn = this._get(inst, 'showOn'); + if (showOn === 'focus' || showOn === 'both') { // pop-up date picker when in the marked field input.focus(this._showDatepicker); - if (showOn == 'button' || showOn == 'both') { // pop-up date picker when button clicked - var buttonText = this._get(inst, 'buttonText'); - var buttonImage = this._get(inst, 'buttonImage'); + } + if (showOn === 'button' || showOn === 'both') { // pop-up date picker when button clicked + buttonText = this._get(inst, 'buttonText'); + buttonImage = this._get(inst, 'buttonImage'); inst.trigger = $(this._get(inst, 'buttonImageOnly') ? $('').addClass(this._triggerClass). attr({ src: buttonImage, alt: buttonText, title: buttonText }) : @@ -235,13 +238,14 @@ $.extend(Datepicker.prototype, { { src:buttonImage, alt:buttonText, title:buttonText }))); input[isRTL ? 'before' : 'after'](inst.trigger); inst.trigger.click(function() { - if ($.datepicker._datepickerShowing && $.datepicker._lastInput == input[0]) + if ($.datepicker._datepickerShowing && $.datepicker._lastInput === input[0]) { $.datepicker._hideDatepicker(); - else if ($.datepicker._datepickerShowing && $.datepicker._lastInput != input[0]) { + } else if ($.datepicker._datepickerShowing && $.datepicker._lastInput !== input[0]) { $.datepicker._hideDatepicker(); $.datepicker._showDatepicker(input[0]); - } else + } else { $.datepicker._showDatepicker(input[0]); + } return false; }); } @@ -250,13 +254,15 @@ $.extend(Datepicker.prototype, { /* Apply the maximum length for the date format. */ _autoSize: function(inst) { if (this._get(inst, 'autoSize') && !inst.inline) { - var date = new Date(2009, 12 - 1, 20); // Ensure double digits - var dateFormat = this._get(inst, 'dateFormat'); + var findMax, max, maxI, i, + date = new Date(2009, 12 - 1, 20), // Ensure double digits + dateFormat = this._get(inst, 'dateFormat'); + if (dateFormat.match(/[DM]/)) { - var findMax = function(names) { - var max = 0; - var maxI = 0; - for (var i = 0; i < names.length; i++) { + findMax = function(names) { + max = 0; + maxI = 0; + for (i = 0; i < names.length; i++) { if (names[i].length > max) { max = names[i].length; maxI = i; @@ -276,8 +282,9 @@ $.extend(Datepicker.prototype, { /* Attach an inline date picker to a div. */ _inlineDatepicker: function(target, inst) { var divSpan = $(target); - if (divSpan.hasClass(this.markerClassName)) + if (divSpan.hasClass(this.markerClassName)) { return; + } divSpan.addClass(this.markerClassName).append(inst.dpDiv). bind("setData.datepicker", function(event, key, value){ inst.settings[key] = value; @@ -308,10 +315,12 @@ $.extend(Datepicker.prototype, { * @return the manager object */ _dialogDatepicker: function(input, date, onSelect, settings, pos) { - var inst = this._dialogInst; // internal instance + var id, browserWidth, browserHeight, scrollX, scrollY, + inst = this._dialogInst; // internal instance + if (!inst) { this.uuid += 1; - var id = 'dp' + this.uuid; + id = 'dp' + this.uuid; this._dialogInput = $(''); this._dialogInput.keydown(this._doKeyDown); @@ -321,15 +330,15 @@ $.extend(Datepicker.prototype, { $.data(this._dialogInput[0], PROP_NAME, inst); } extendRemove(inst.settings, settings || {}); - date = (date && date.constructor == Date ? this._formatDate(inst, date) : date); + date = (date && date.constructor === Date ? this._formatDate(inst, date) : date); this._dialogInput.val(date); this._pos = (pos ? (pos.length ? pos : [pos.pageX, pos.pageY]) : null); if (!this._pos) { - var browserWidth = document.documentElement.clientWidth; - var browserHeight = document.documentElement.clientHeight; - var scrollX = document.documentElement.scrollLeft || document.body.scrollLeft; - var scrollY = document.documentElement.scrollTop || document.body.scrollTop; + browserWidth = document.documentElement.clientWidth; + browserHeight = document.documentElement.clientHeight; + scrollX = document.documentElement.scrollLeft || document.body.scrollLeft; + scrollY = document.documentElement.scrollTop || document.body.scrollTop; this._pos = // should use actual width/height below [(browserWidth / 2) - 100 + scrollX, (browserHeight / 2) - 150 + scrollY]; } @@ -340,8 +349,9 @@ $.extend(Datepicker.prototype, { this._inDialog = true; this.dpDiv.addClass(this._dialogClass); this._showDatepicker(this._dialogInput[0]); - if ($.blockUI) + if ($.blockUI) { $.blockUI(this.dpDiv); + } $.data(this._dialogInput[0], PROP_NAME, inst); return this; }, @@ -350,14 +360,17 @@ $.extend(Datepicker.prototype, { * @param target element - the target input field or division or span */ _destroyDatepicker: function(target) { - var $target = $(target); - var inst = $.data(target, PROP_NAME); + var nodeName, + $target = $(target), + inst = $.data(target, PROP_NAME); + if (!$target.hasClass(this.markerClassName)) { return; } - var nodeName = target.nodeName.toLowerCase(); + + nodeName = target.nodeName.toLowerCase(); $.removeData(target, PROP_NAME); - if (nodeName == 'input') { + if (nodeName === 'input') { inst.append.remove(); inst.trigger.remove(); $target.removeClass(this.markerClassName). @@ -365,60 +378,65 @@ $.extend(Datepicker.prototype, { unbind('keydown', this._doKeyDown). unbind('keypress', this._doKeyPress). unbind('keyup', this._doKeyUp); - } else if (nodeName == 'div' || nodeName == 'span') + } else if (nodeName === 'div' || nodeName === 'span') { $target.removeClass(this.markerClassName).empty(); + } }, /* Enable the date picker to a jQuery selection. * @param target element - the target input field or division or span */ _enableDatepicker: function(target) { - var $target = $(target); - var inst = $.data(target, PROP_NAME); + var nodeName, inline, + $target = $(target), + inst = $.data(target, PROP_NAME); + if (!$target.hasClass(this.markerClassName)) { return; } - var nodeName = target.nodeName.toLowerCase(); - if (nodeName == 'input') { + + nodeName = target.nodeName.toLowerCase(); + if (nodeName === 'input') { target.disabled = false; inst.trigger.filter('button'). each(function() { this.disabled = false; }).end(). filter('img').css({opacity: '1.0', cursor: ''}); - } - else if (nodeName == 'div' || nodeName == 'span') { - var inline = $target.children('.' + this._inlineClass); + } else if (nodeName === 'div' || nodeName === 'span') { + inline = $target.children('.' + this._inlineClass); inline.children().removeClass('ui-state-disabled'); inline.find("select.ui-datepicker-month, select.ui-datepicker-year"). prop("disabled", false); } this._disabledInputs = $.map(this._disabledInputs, - function(value) { return (value == target ? null : value); }); // delete entry + function(value) { return (value === target ? null : value); }); // delete entry }, /* Disable the date picker to a jQuery selection. * @param target element - the target input field or division or span */ _disableDatepicker: function(target) { - var $target = $(target); - var inst = $.data(target, PROP_NAME); + var nodeName, inline, + $target = $(target), + inst = $.data(target, PROP_NAME); + if (!$target.hasClass(this.markerClassName)) { return; } - var nodeName = target.nodeName.toLowerCase(); - if (nodeName == 'input') { + + nodeName = target.nodeName.toLowerCase(); + if (nodeName === 'input') { target.disabled = true; inst.trigger.filter('button'). each(function() { this.disabled = true; }).end(). filter('img').css({opacity: '0.5', cursor: 'default'}); - } - else if (nodeName == 'div' || nodeName == 'span') { - var inline = $target.children('.' + this._inlineClass); + } else if (nodeName === 'div' || nodeName === 'span') { + inline = $target.children('.' + this._inlineClass); inline.children().addClass('ui-state-disabled'); inline.find("select.ui-datepicker-month, select.ui-datepicker-year"). prop("disabled", true); } this._disabledInputs = $.map(this._disabledInputs, - function(value) { return (value == target ? null : value); }); // delete entry + function(value) { return (value === target ? null : value); }); // delete entry this._disabledInputs[this._disabledInputs.length] = target; }, @@ -431,8 +449,9 @@ $.extend(Datepicker.prototype, { return false; } for (var i = 0; i < this._disabledInputs.length; i++) { - if (this._disabledInputs[i] == target) + if (this._disabledInputs[i] === target) { return true; + } } return false; }, @@ -461,30 +480,37 @@ $.extend(Datepicker.prototype, { * (omit if above is an object or to retrieve a value) */ _optionDatepicker: function(target, name, value) { - var inst = this._getInst(target); - if (arguments.length == 2 && typeof name == 'string') { - return (name == 'defaults' ? $.extend({}, $.datepicker._defaults) : - (inst ? (name == 'all' ? $.extend({}, inst.settings) : + var settings, date, minDate, maxDate, + inst = this._getInst(target); + + if (arguments.length === 2 && typeof name === 'string') { + return (name === 'defaults' ? $.extend({}, $.datepicker._defaults) : + (inst ? (name === 'all' ? $.extend({}, inst.settings) : this._get(inst, name)) : null)); } - var settings = name || {}; - if (typeof name == 'string') { + + settings = name || {}; + if (typeof name === 'string') { settings = {}; settings[name] = value; } + if (inst) { - if (this._curInst == inst) { + if (this._curInst === inst) { this._hideDatepicker(); } - var date = this._getDateDatepicker(target, true); - var minDate = this._getMinMaxDate(inst, 'min'); - var maxDate = this._getMinMaxDate(inst, 'max'); + + date = this._getDateDatepicker(target, true); + minDate = this._getMinMaxDate(inst, 'min'); + maxDate = this._getMinMaxDate(inst, 'max'); extendRemove(inst.settings, settings); // reformat the old minDate/maxDate values if dateFormat changes and a new minDate/maxDate isn't provided - if (minDate !== null && settings.dateFormat !== undefined && settings.minDate === undefined) + if (minDate !== null && settings.dateFormat !== undefined && settings.minDate === undefined) { inst.settings.minDate = this._formatDate(inst, minDate); - if (maxDate !== null && settings.dateFormat !== undefined && settings.maxDate === undefined) + } + if (maxDate !== null && settings.dateFormat !== undefined && settings.maxDate === undefined) { inst.settings.maxDate = this._formatDate(inst, maxDate); + } this._attachments($(target), inst); this._autoSize(inst); this._setDate(inst, date); @@ -528,35 +554,41 @@ $.extend(Datepicker.prototype, { */ _getDateDatepicker: function(target, noDefault) { var inst = this._getInst(target); - if (inst && !inst.inline) + if (inst && !inst.inline) { this._setDateFromField(inst, noDefault); + } return (inst ? this._getDate(inst) : null); }, /* Handle keystrokes. */ _doKeyDown: function(event) { - var inst = $.datepicker._getInst(event.target); - var handled = true; - var isRTL = inst.dpDiv.is('.ui-datepicker-rtl'); + var onSelect, dateStr, sel, + inst = $.datepicker._getInst(event.target), + handled = true, + isRTL = inst.dpDiv.is('.ui-datepicker-rtl'); + inst._keyEvent = true; - if ($.datepicker._datepickerShowing) + if ($.datepicker._datepickerShowing) { switch (event.keyCode) { case 9: $.datepicker._hideDatepicker(); handled = false; break; // hide on tab out - case 13: var sel = $('td.' + $.datepicker._dayOverClass + ':not(.' + + case 13: sel = $('td.' + $.datepicker._dayOverClass + ':not(.' + $.datepicker._currentClass + ')', inst.dpDiv); - if (sel[0]) + 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 + onSelect = $.datepicker._get(inst, 'onSelect'); + if (onSelect) { + 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 case 27: $.datepicker._hideDatepicker(); break; // hide on escape @@ -568,41 +600,58 @@ $.extend(Datepicker.prototype, { +$.datepicker._get(inst, 'stepBigMonths') : +$.datepicker._get(inst, 'stepMonths')), 'M'); break; // next month/year on page down/+ ctrl - case 35: if (event.ctrlKey || event.metaKey) $.datepicker._clearDate(event.target); + case 35: if (event.ctrlKey || event.metaKey) { + $.datepicker._clearDate(event.target); + } handled = event.ctrlKey || event.metaKey; break; // clear on ctrl or command +end - case 36: if (event.ctrlKey || event.metaKey) $.datepicker._gotoToday(event.target); + case 36: if (event.ctrlKey || event.metaKey) { + $.datepicker._gotoToday(event.target); + } handled = event.ctrlKey || event.metaKey; break; // current on ctrl or command +home - case 37: if (event.ctrlKey || event.metaKey) $.datepicker._adjustDate(event.target, (isRTL ? +1 : -1), 'D'); + case 37: if (event.ctrlKey || event.metaKey) { + $.datepicker._adjustDate(event.target, (isRTL ? +1 : -1), 'D'); + } handled = event.ctrlKey || event.metaKey; // -1 day on ctrl or command +left - if (event.originalEvent.altKey) $.datepicker._adjustDate(event.target, (event.ctrlKey ? - -$.datepicker._get(inst, 'stepBigMonths') : - -$.datepicker._get(inst, 'stepMonths')), 'M'); + if (event.originalEvent.altKey) { + $.datepicker._adjustDate(event.target, (event.ctrlKey ? + -$.datepicker._get(inst, 'stepBigMonths') : + -$.datepicker._get(inst, 'stepMonths')), 'M'); + } // next month/year on alt +left on Mac break; - case 38: if (event.ctrlKey || event.metaKey) $.datepicker._adjustDate(event.target, -7, 'D'); + case 38: if (event.ctrlKey || event.metaKey) { + $.datepicker._adjustDate(event.target, -7, 'D'); + } handled = event.ctrlKey || event.metaKey; break; // -1 week on ctrl or command +up - case 39: if (event.ctrlKey || event.metaKey) $.datepicker._adjustDate(event.target, (isRTL ? -1 : +1), 'D'); + case 39: if (event.ctrlKey || event.metaKey) { + $.datepicker._adjustDate(event.target, (isRTL ? -1 : +1), 'D'); + } handled = event.ctrlKey || event.metaKey; // +1 day on ctrl or command +right - if (event.originalEvent.altKey) $.datepicker._adjustDate(event.target, (event.ctrlKey ? - +$.datepicker._get(inst, 'stepBigMonths') : - +$.datepicker._get(inst, 'stepMonths')), 'M'); + if (event.originalEvent.altKey) { + $.datepicker._adjustDate(event.target, (event.ctrlKey ? + +$.datepicker._get(inst, 'stepBigMonths') : + +$.datepicker._get(inst, 'stepMonths')), 'M'); + } // next month/year on alt +right break; - case 40: if (event.ctrlKey || event.metaKey) $.datepicker._adjustDate(event.target, +7, 'D'); + case 40: if (event.ctrlKey || event.metaKey) { + $.datepicker._adjustDate(event.target, +7, 'D'); + } handled = event.ctrlKey || event.metaKey; break; // +1 week on ctrl or command +down default: handled = false; } - else if (event.keyCode == 36 && event.ctrlKey) // display the date picker on ctrl+home + } else if (event.keyCode === 36 && event.ctrlKey) { // display the date picker on ctrl+home $.datepicker._showDatepicker(this); - else { + } else { handled = false; } + if (handled) { event.preventDefault(); event.stopPropagation(); @@ -611,22 +660,27 @@ $.extend(Datepicker.prototype, { /* Filter entered characters - based on date format. */ _doKeyPress: function(event) { - var inst = $.datepicker._getInst(event.target); + var chars, chr, + inst = $.datepicker._getInst(event.target); + if ($.datepicker._get(inst, 'constrainInput')) { - var chars = $.datepicker._possibleChars($.datepicker._get(inst, 'dateFormat')); - var chr = String.fromCharCode(event.charCode == null ? event.keyCode : event.charCode); + chars = $.datepicker._possibleChars($.datepicker._get(inst, 'dateFormat')); + chr = String.fromCharCode(event.charCode == null ? event.keyCode : event.charCode); return event.ctrlKey || event.metaKey || (chr < ' ' || !chars || chars.indexOf(chr) > -1); } }, /* Synchronise manual entry and field/alternate field. */ _doKeyUp: function(event) { - var inst = $.datepicker._getInst(event.target); - if (inst.input.val() != inst.lastVal) { + var date, + inst = $.datepicker._getInst(event.target); + + if (inst.input.val() !== inst.lastVal) { try { - var date = $.datepicker.parseDate($.datepicker._get(inst, 'dateFormat'), + date = $.datepicker.parseDate($.datepicker._get(inst, 'dateFormat'), (inst.input ? inst.input.val() : null), $.datepicker._getFormatConfig(inst)); + if (date) { // only if valid $.datepicker._setDateFromField(inst); $.datepicker._updateAlternate(inst); @@ -634,7 +688,6 @@ $.extend(Datepicker.prototype, { } } catch (err) { - $.datepicker.log(err); } } return true; @@ -647,39 +700,51 @@ $.extend(Datepicker.prototype, { */ _showDatepicker: function(input) { input = input.target || input; - if (input.nodeName.toLowerCase() != 'input') // find from button/image trigger + if (input.nodeName.toLowerCase() !== 'input') { // find from button/image trigger input = $('input', input.parentNode)[0]; - if ($.datepicker._isDisabledDatepicker(input) || $.datepicker._lastInput == input) // already here + } + + if ($.datepicker._isDisabledDatepicker(input) || $.datepicker._lastInput === input) { // already here return; - var inst = $.datepicker._getInst(input); - if ($.datepicker._curInst && $.datepicker._curInst != inst) { + } + + var inst, beforeShow, beforeShowSettings, isFixed, + offset, showAnim, duration; + + inst = $.datepicker._getInst(input); + if ($.datepicker._curInst && $.datepicker._curInst !== inst) { $.datepicker._curInst.dpDiv.stop(true, true); if ( inst && $.datepicker._datepickerShowing ) { $.datepicker._hideDatepicker( $.datepicker._curInst.input[0] ); } } - var beforeShow = $.datepicker._get(inst, 'beforeShow'); - var beforeShowSettings = beforeShow ? beforeShow.apply(input, [input, inst]) : {}; + + beforeShow = $.datepicker._get(inst, 'beforeShow'); + beforeShowSettings = beforeShow ? beforeShow.apply(input, [input, inst]) : {}; if(beforeShowSettings === false){ - //false return; } extendRemove(inst.settings, beforeShowSettings); + inst.lastVal = null; $.datepicker._lastInput = input; $.datepicker._setDateFromField(inst); - if ($.datepicker._inDialog) // hide cursor + + if ($.datepicker._inDialog) { // hide cursor input.value = ''; + } if (!$.datepicker._pos) { // position below input $.datepicker._pos = $.datepicker._findPos(input); $.datepicker._pos[1] += input.offsetHeight; // add the height } - var isFixed = false; + + isFixed = false; $(input).parents().each(function() { - isFixed |= $(this).css('position') == 'fixed'; + isFixed |= $(this).css('position') === 'fixed'; return !isFixed; }); - var offset = {left: $.datepicker._pos[0], top: $.datepicker._pos[1]}; + + offset = {left: $.datepicker._pos[0], top: $.datepicker._pos[1]}; $.datepicker._pos = null; //to avoid flashes on Firefox inst.dpDiv.empty(); @@ -692,18 +757,22 @@ $.extend(Datepicker.prototype, { inst.dpDiv.css({position: ($.datepicker._inDialog && $.blockUI ? 'static' : (isFixed ? 'fixed' : 'absolute')), display: 'none', left: offset.left + 'px', top: offset.top + 'px'}); + if (!inst.inline) { - var showAnim = $.datepicker._get(inst, 'showAnim'); - var duration = $.datepicker._get(inst, 'duration'); + showAnim = $.datepicker._get(inst, 'showAnim'); + duration = $.datepicker._get(inst, 'duration'); inst.dpDiv.zIndex($(input).zIndex()+1); $.datepicker._datepickerShowing = true; - if ( $.effects && $.effects.effect[ showAnim ] ) + if ( $.effects && $.effects.effect[ showAnim ] ) { inst.dpDiv.show(showAnim, $.datepicker._get(inst, 'showOptions'), duration); - else + } else { inst.dpDiv[showAnim || 'show'](showAnim ? duration : null); - if (inst.input.is(':visible') && !inst.input.is(':disabled')) + } + + if (inst.input.is(':visible') && !inst.input.is(':disabled')) { inst.input.focus(); + } $.datepicker._curInst = inst; } }, @@ -715,24 +784,31 @@ $.extend(Datepicker.prototype, { inst.dpDiv.empty().append(this._generateHTML(inst)); this._attachHandlers(inst); inst.dpDiv.find('.' + this._dayOverClass + ' a').mouseover(); - var numMonths = this._getNumberOfMonths(inst); - var cols = numMonths[1]; - var width = 17; + + var origyearshtml, + numMonths = this._getNumberOfMonths(inst), + cols = numMonths[1], + width = 17; + inst.dpDiv.removeClass('ui-datepicker-multi-2 ui-datepicker-multi-3 ui-datepicker-multi-4').width(''); - if (cols > 1) + if (cols > 1) { inst.dpDiv.addClass('ui-datepicker-multi-' + cols).css('width', (width * cols) + 'em'); - inst.dpDiv[(numMonths[0] != 1 || numMonths[1] != 1 ? 'add' : 'remove') + + } + inst.dpDiv[(numMonths[0] !== 1 || numMonths[1] !== 1 ? 'add' : 'remove') + 'Class']('ui-datepicker-multi'); inst.dpDiv[(this._get(inst, 'isRTL') ? 'add' : 'remove') + 'Class']('ui-datepicker-rtl'); - if (inst == $.datepicker._curInst && $.datepicker._datepickerShowing && inst.input && - // #6694 - don't focus the input if it's already focused - // this breaks the change event in IE - inst.input.is(':visible') && !inst.input.is(':disabled') && inst.input[0] != document.activeElement) + + // #6694 - don't focus the input if it's already focused + // this breaks the change event in IE + if (inst === $.datepicker._curInst && $.datepicker._datepickerShowing && inst.input && + inst.input.is(':visible') && !inst.input.is(':disabled') && inst.input[0] !== document.activeElement) { inst.input.focus(); + } + // deffered render of the years select (to avoid flashes on Firefox) if( inst.yearshtml ){ - var origyearshtml = inst.yearshtml; + origyearshtml = inst.yearshtml; setTimeout(function(){ //assure that inst.yearshtml didn't change. if( origyearshtml === inst.yearshtml && inst.yearshtml ){ @@ -757,16 +833,16 @@ $.extend(Datepicker.prototype, { /* Check positioning to remain on screen. */ _checkOffset: function(inst, offset, isFixed) { - var dpWidth = inst.dpDiv.outerWidth(); - var dpHeight = inst.dpDiv.outerHeight(); - var inputWidth = inst.input ? inst.input.outerWidth() : 0; - var inputHeight = inst.input ? inst.input.outerHeight() : 0; - var viewWidth = document.documentElement.clientWidth + (isFixed ? 0 : $(document).scrollLeft()); - var viewHeight = document.documentElement.clientHeight + (isFixed ? 0 : $(document).scrollTop()); + var dpWidth = inst.dpDiv.outerWidth(), + dpHeight = inst.dpDiv.outerHeight(), + inputWidth = inst.input ? inst.input.outerWidth() : 0, + inputHeight = inst.input ? inst.input.outerHeight() : 0, + viewWidth = document.documentElement.clientWidth + (isFixed ? 0 : $(document).scrollLeft()), + viewHeight = document.documentElement.clientHeight + (isFixed ? 0 : $(document).scrollTop()); offset.left -= (this._get(inst, 'isRTL') ? (dpWidth - inputWidth) : 0); - offset.left -= (isFixed && offset.left == inst.input.offset().left) ? $(document).scrollLeft() : 0; - offset.top -= (isFixed && offset.top == (inst.input.offset().top + inputHeight)) ? $(document).scrollTop() : 0; + offset.left -= (isFixed && offset.left === inst.input.offset().left) ? $(document).scrollLeft() : 0; + offset.top -= (isFixed && offset.top === (inst.input.offset().top + inputHeight)) ? $(document).scrollTop() : 0; // now check if datepicker is showing outside window viewport - move to a better place if so. offset.left -= Math.min(offset.left, (offset.left + dpWidth > viewWidth && viewWidth > dpWidth) ? @@ -779,12 +855,15 @@ $.extend(Datepicker.prototype, { /* Find an object's position on the screen. */ _findPos: function(obj) { - var inst = this._getInst(obj); - var isRTL = this._get(inst, 'isRTL'); - while (obj && (obj.type == 'hidden' || obj.nodeType != 1 || $.expr.filters.hidden(obj))) { + var position, + inst = this._getInst(obj), + isRTL = this._get(inst, 'isRTL'); + + while (obj && (obj.type === 'hidden' || obj.nodeType !== 1 || $.expr.filters.hidden(obj))) { obj = obj[isRTL ? 'previousSibling' : 'nextSibling']; } - var position = $(obj).offset(); + + position = $(obj).offset(); return [position.left, position.top]; }, @@ -792,29 +871,38 @@ $.extend(Datepicker.prototype, { * @param input element - the input field attached to the date picker */ _hideDatepicker: function(input) { - var inst = this._curInst; - if (!inst || (input && inst != $.data(input, PROP_NAME))) + var showAnim, duration, postProcess, onClose, + inst = this._curInst; + + if (!inst || (input && inst !== $.data(input, PROP_NAME))) { return; + } + if (this._datepickerShowing) { - var showAnim = this._get(inst, 'showAnim'); - var duration = this._get(inst, 'duration'); - var postProcess = function() { + showAnim = this._get(inst, 'showAnim'); + duration = this._get(inst, 'duration'); + postProcess = function() { $.datepicker._tidyDialog(inst); }; // DEPRECATED: after BC for 1.8.x $.effects[ showAnim ] is not needed - if ( $.effects && ( $.effects.effect[ showAnim ] || $.effects[ showAnim ] ) ) + if ( $.effects && ( $.effects.effect[ showAnim ] || $.effects[ showAnim ] ) ) { inst.dpDiv.hide(showAnim, $.datepicker._get(inst, 'showOptions'), duration, postProcess); - else - inst.dpDiv[(showAnim == 'slideDown' ? 'slideUp' : - (showAnim == 'fadeIn' ? 'fadeOut' : 'hide'))]((showAnim ? duration : null), postProcess); - if (!showAnim) + } else { + inst.dpDiv[(showAnim === 'slideDown' ? 'slideUp' : + (showAnim === 'fadeIn' ? 'fadeOut' : 'hide'))]((showAnim ? duration : null), postProcess); + } + + if (!showAnim) { postProcess(); + } this._datepickerShowing = false; - var onClose = this._get(inst, 'onClose'); - if (onClose) - onClose.apply((inst.input ? inst.input[0] : null), - [(inst.input ? inst.input.val() : ''), inst]); + + onClose = this._get(inst, 'onClose'); + if (onClose) { + onClose.apply((inst.input ? inst.input[0] : null), [(inst.input ? inst.input.val() : ''), inst]); + } + this._lastInput = null; if (this._inDialog) { this._dialogInput.css({ position: 'absolute', left: '0', top: '-100px' }); @@ -834,45 +922,49 @@ $.extend(Datepicker.prototype, { /* Close date picker if clicked elsewhere. */ _checkExternalClick: function(event) { - if (!$.datepicker._curInst) + if (!$.datepicker._curInst) { return; + } var $target = $(event.target), inst = $.datepicker._getInst($target[0]); - if ( ( ( $target[0].id != $.datepicker._mainDivId && + if ( ( ( $target[0].id !== $.datepicker._mainDivId && $target.parents('#' + $.datepicker._mainDivId).length === 0 && !$target.hasClass($.datepicker.markerClassName) && !$target.closest("." + $.datepicker._triggerClass).length && $.datepicker._datepickerShowing && !($.datepicker._inDialog && $.blockUI) ) ) || - ( $target.hasClass($.datepicker.markerClassName) && $.datepicker._curInst != inst ) ) - $.datepicker._hideDatepicker(); + ( $target.hasClass($.datepicker.markerClassName) && $.datepicker._curInst !== inst ) ) { + $.datepicker._hideDatepicker(); + } }, /* Adjust one of the date sub-fields. */ _adjustDate: function(id, offset, period) { - var target = $(id); - var inst = this._getInst(target[0]); + var target = $(id), + inst = this._getInst(target[0]); + if (this._isDisabledDatepicker(target[0])) { return; } this._adjustInstDate(inst, offset + - (period == 'M' ? this._get(inst, 'showCurrentAtPos') : 0), // undo positioning + (period === 'M' ? this._get(inst, 'showCurrentAtPos') : 0), // undo positioning period); this._updateDatepicker(inst); }, /* Action for current link. */ _gotoToday: function(id) { - var target = $(id); - var inst = this._getInst(target[0]); + var date, + target = $(id), + inst = this._getInst(target[0]); + if (this._get(inst, 'gotoCurrent') && inst.currentDay) { inst.selectedDay = inst.currentDay; inst.drawMonth = inst.selectedMonth = inst.currentMonth; inst.drawYear = inst.selectedYear = inst.currentYear; - } - else { - var date = new Date(); + } else { + date = new Date(); inst.selectedDay = date.getDate(); inst.drawMonth = inst.selectedMonth = date.getMonth(); inst.drawYear = inst.selectedYear = date.getFullYear(); @@ -883,22 +975,27 @@ $.extend(Datepicker.prototype, { /* Action for selecting a new month/year. */ _selectMonthYear: function(id, select, period) { - var target = $(id); - var inst = this._getInst(target[0]); - inst['selected' + (period == 'M' ? 'Month' : 'Year')] = - inst['draw' + (period == 'M' ? 'Month' : 'Year')] = + var target = $(id), + inst = this._getInst(target[0]); + + inst['selected' + (period === 'M' ? 'Month' : 'Year')] = + inst['draw' + (period === 'M' ? 'Month' : 'Year')] = parseInt(select.options[select.selectedIndex].value,10); + this._notifyChange(inst); this._adjustDate(target); }, /* Action for selecting a day. */ _selectDay: function(id, month, year, td) { - var target = $(id); + var inst, + target = $(id); + if ($(td).hasClass(this._unselectableClass) || this._isDisabledDatepicker(target[0])) { return; } - var inst = this._getInst(target[0]); + + inst = this._getInst(target[0]); inst.selectedDay = inst.currentDay = $('a', td).html(); inst.selectedMonth = inst.currentMonth = month; inst.selectedYear = inst.currentYear = year; @@ -914,35 +1011,44 @@ $.extend(Datepicker.prototype, { /* Update the input field with the selected date. */ _selectDate: function(id, dateStr) { - var target = $(id); - var inst = this._getInst(target[0]); + var onSelect, + target = $(id), + inst = this._getInst(target[0]); + dateStr = (dateStr != null ? dateStr : this._formatDate(inst)); - if (inst.input) + if (inst.input) { inst.input.val(dateStr); + } this._updateAlternate(inst); - var onSelect = this._get(inst, 'onSelect'); - if (onSelect) + + onSelect = this._get(inst, 'onSelect'); + if (onSelect) { onSelect.apply((inst.input ? inst.input[0] : null), [dateStr, inst]); // trigger custom callback - else if (inst.input) + } else if (inst.input) { inst.input.trigger('change'); // fire the change event - if (inst.inline) + } + + if (inst.inline){ this._updateDatepicker(inst); - else { + } else { this._hideDatepicker(); this._lastInput = inst.input[0]; - if (typeof(inst.input[0]) != 'object') + if (typeof(inst.input[0]) !== 'object') { inst.input.focus(); // restore focus + } this._lastInput = null; } }, /* Update any alternate field to synchronise with the main field. */ _updateAlternate: function(inst) { - var altField = this._get(inst, 'altField'); + var altFormat, date, dateStr, + altField = this._get(inst, 'altField'); + if (altField) { // update alternate field too - var altFormat = this._get(inst, 'altFormat') || this._get(inst, 'dateFormat'); - var date = this._getDate(inst); - var dateStr = this.formatDate(altFormat, date, this._getFormatConfig(inst)); + altFormat = this._get(inst, 'altFormat') || this._get(inst, 'dateFormat'); + date = this._getDate(inst); + dateStr = this.formatDate(altFormat, date, this._getFormatConfig(inst)); $(altField).each(function() { $(this).val(dateStr); }); } }, @@ -961,10 +1067,13 @@ $.extend(Datepicker.prototype, { * @return number - the number of the week within the year that contains this date */ iso8601Week: function(date) { - var checkDate = new Date(date.getTime()); + var time, + checkDate = new Date(date.getTime()); + // Find Thursday of this week starting on Monday checkDate.setDate(checkDate.getDate() + 4 - (checkDate.getDay() || 7)); - var time = checkDate.getTime(); + + time = checkDate.getTime(); checkDate.setMonth(0); // Compare with Jan 1 checkDate.setDate(1); return Math.floor(Math.round((time - checkDate) / 86400000) / 7) + 1; @@ -984,77 +1093,90 @@ $.extend(Datepicker.prototype, { * @return Date - the extracted date value or null if value is blank */ parseDate: function (format, value, settings) { - if (format == null || value == null) + if (format == null || value == null) { throw 'Invalid arguments'; - value = (typeof value == 'object' ? value.toString() : value + ''); - if (value === '') + } + + value = (typeof value === 'object' ? value.toString() : value + ''); + if (value === '') { return null; - var shortYearCutoff = (settings ? settings.shortYearCutoff : null) || this._defaults.shortYearCutoff; - shortYearCutoff = (typeof shortYearCutoff != 'string' ? shortYearCutoff : - new Date().getFullYear() % 100 + parseInt(shortYearCutoff, 10)); - var dayNamesShort = (settings ? settings.dayNamesShort : null) || this._defaults.dayNamesShort; - var dayNames = (settings ? settings.dayNames : null) || this._defaults.dayNames; - var monthNamesShort = (settings ? settings.monthNamesShort : null) || this._defaults.monthNamesShort; - var monthNames = (settings ? settings.monthNames : null) || this._defaults.monthNames; - var year = -1; - var month = -1; - var day = -1; - var doy = -1; - var literal = false; - // Check whether a format character is doubled - var lookAhead = function(match) { - var matches = (iFormat + 1 < format.length && format.charAt(iFormat + 1) == match); - if (matches) - iFormat++; - return matches; - }; - // Extract a number from the string value - var getNumber = function(match) { - var isDoubled = lookAhead(match); - var size = (match == '@' ? 14 : (match == '!' ? 20 : - (match == 'y' && isDoubled ? 4 : (match == 'o' ? 3 : 2)))); - var digits = new RegExp('^\\d{1,' + size + '}'); - var num = value.substring(iValue).match(digits); - if (!num) - throw 'Missing number at position ' + iValue; - iValue += num[0].length; - return parseInt(num[0], 10); - }; - // Extract a name from the string value and convert to an index - var getName = function(match, shortNames, longNames) { - var names = $.map(lookAhead(match) ? longNames : shortNames, function (v, k) { - return [ [k, v] ]; - }).sort(function (a, b) { - return -(a[1].length - b[1].length); - }); - var index = -1; - $.each(names, function (i, pair) { - var name = pair[1]; - if (value.substr(iValue, name.length).toLowerCase() == name.toLowerCase()) { - index = pair[0]; - iValue += name.length; - return false; + } + + var iFormat, dim, extra, + iValue = 0, + shortYearCutoffTemp = (settings ? settings.shortYearCutoff : null) || this._defaults.shortYearCutoff, + shortYearCutoff = (typeof shortYearCutoffTemp !== 'string' ? shortYearCutoffTemp : + new Date().getFullYear() % 100 + parseInt(shortYearCutoffTemp, 10)), + dayNamesShort = (settings ? settings.dayNamesShort : null) || this._defaults.dayNamesShort, + dayNames = (settings ? settings.dayNames : null) || this._defaults.dayNames, + monthNamesShort = (settings ? settings.monthNamesShort : null) || this._defaults.monthNamesShort, + monthNames = (settings ? settings.monthNames : null) || this._defaults.monthNames, + year = -1, + month = -1, + day = -1, + doy = -1, + literal = false, + date, + // Check whether a format character is doubled + lookAhead = function(match) { + var matches = (iFormat + 1 < format.length && format.charAt(iFormat + 1) === match); + if (matches) { + iFormat++; } - }); - if (index != -1) - return index + 1; - else - throw 'Unknown name at position ' + iValue; - }; - // Confirm that a literal character matches the string value - var checkLiteral = function() { - if (value.charAt(iValue) != format.charAt(iFormat)) - throw 'Unexpected literal at position ' + iValue; - iValue++; - }; - var iValue = 0; - for (var iFormat = 0; iFormat < format.length; iFormat++) { - if (literal) - if (format.charAt(iFormat) == "'" && !lookAhead("'")) + return matches; + }, + // Extract a number from the string value + getNumber = function(match) { + var isDoubled = lookAhead(match), + size = (match === '@' ? 14 : (match === '!' ? 20 : + (match === 'y' && isDoubled ? 4 : (match === 'o' ? 3 : 2)))), + digits = new RegExp('^\\d{1,' + size + '}'), + num = value.substring(iValue).match(digits); + if (!num) { + throw 'Missing number at position ' + iValue; + } + iValue += num[0].length; + return parseInt(num[0], 10); + }, + // Extract a name from the string value and convert to an index + getName = function(match, shortNames, longNames) { + var index = -1, + names = $.map(lookAhead(match) ? longNames : shortNames, function (v, k) { + return [ [k, v] ]; + }).sort(function (a, b) { + return -(a[1].length - b[1].length); + }); + + $.each(names, function (i, pair) { + var name = pair[1]; + if (value.substr(iValue, name.length).toLowerCase() === name.toLowerCase()) { + index = pair[0]; + iValue += name.length; + return false; + } + }); + if (index !== -1) { + return index + 1; + } else { + throw 'Unknown name at position ' + iValue; + } + }, + // Confirm that a literal character matches the string value + checkLiteral = function() { + if (value.charAt(iValue) !== format.charAt(iFormat)) { + throw 'Unexpected literal at position ' + iValue; + } + iValue++; + }; + + for (iFormat = 0; iFormat < format.length; iFormat++) { + if (literal) { + if (format.charAt(iFormat) === "'" && !lookAhead("'")) { literal = false; - else + } else { checkLiteral(); - else + } + } else { switch (format.charAt(iFormat)) { case 'd': day = getNumber('d'); @@ -1075,52 +1197,61 @@ $.extend(Datepicker.prototype, { year = getNumber('y'); break; case '@': - var date = new Date(getNumber('@')); + date = new Date(getNumber('@')); year = date.getFullYear(); month = date.getMonth() + 1; day = date.getDate(); break; case '!': - var date = new Date((getNumber('!') - this._ticksTo1970) / 10000); + date = new Date((getNumber('!') - this._ticksTo1970) / 10000); year = date.getFullYear(); month = date.getMonth() + 1; day = date.getDate(); break; case "'": - if (lookAhead("'")) + if (lookAhead("'")){ checkLiteral(); - else + } else { literal = true; + } break; default: checkLiteral(); } + } } + if (iValue < value.length){ - var extra = value.substr(iValue); + extra = value.substr(iValue); if (!/^\s+/.test(extra)) { throw "Extra/unparsed characters found in date: " + extra; } } - if (year == -1) + + if (year === -1) { year = new Date().getFullYear(); - else if (year < 100) + } else if (year < 100) { year += new Date().getFullYear() - new Date().getFullYear() % 100 + (year <= shortYearCutoff ? 0 : -100); + } + if (doy > -1) { month = 1; day = doy; do { - var dim = this._getDaysInMonth(year, month - 1); - if (day <= dim) + dim = this._getDaysInMonth(year, month - 1); + if (day <= dim) { break; + } month++; day -= dim; } while (true); } - var date = this._daylightSavingAdjust(new Date(year, month - 1, day)); - if (date.getFullYear() != year || date.getMonth() + 1 != month || date.getDate() != day) + + date = this._daylightSavingAdjust(new Date(year, month - 1, day)); + if (date.getFullYear() !== year || date.getMonth() + 1 !== month || date.getDate() !== day) { throw 'Invalid date'; // E.g. 31/02/00 + } return date; }, @@ -1170,41 +1301,49 @@ $.extend(Datepicker.prototype, { * @return string - the date in the above format */ formatDate: function (format, date, settings) { - if (!date) + if (!date) { return ''; - var dayNamesShort = (settings ? settings.dayNamesShort : null) || this._defaults.dayNamesShort; - var dayNames = (settings ? settings.dayNames : null) || this._defaults.dayNames; - var monthNamesShort = (settings ? settings.monthNamesShort : null) || this._defaults.monthNamesShort; - var monthNames = (settings ? settings.monthNames : null) || this._defaults.monthNames; - // Check whether a format character is doubled - var lookAhead = function(match) { - var matches = (iFormat + 1 < format.length && format.charAt(iFormat + 1) == match); - if (matches) - iFormat++; - return matches; - }; - // Format a number, with leading zero if necessary - var formatNumber = function(match, value, len) { - var num = '' + value; - if (lookAhead(match)) - while (num.length < len) - num = '0' + num; - return num; - }; - // Format a name, short or long as requested - var formatName = function(match, value, shortNames, longNames) { - return (lookAhead(match) ? longNames[value] : shortNames[value]); - }; - var output = ''; - var literal = false; - if (date) - for (var iFormat = 0; iFormat < format.length; iFormat++) { - if (literal) - if (format.charAt(iFormat) == "'" && !lookAhead("'")) + } + + var iFormat, + dayNamesShort = (settings ? settings.dayNamesShort : null) || this._defaults.dayNamesShort, + dayNames = (settings ? settings.dayNames : null) || this._defaults.dayNames, + monthNamesShort = (settings ? settings.monthNamesShort : null) || this._defaults.monthNamesShort, + monthNames = (settings ? settings.monthNames : null) || this._defaults.monthNames, + // Check whether a format character is doubled + lookAhead = function(match) { + var matches = (iFormat + 1 < format.length && format.charAt(iFormat + 1) === match); + if (matches) { + iFormat++; + } + return matches; + }, + // Format a number, with leading zero if necessary + formatNumber = function(match, value, len) { + var num = '' + value; + if (lookAhead(match)) { + while (num.length < len) { + num = '0' + num; + } + } + return num; + }, + // Format a name, short or long as requested + formatName = function(match, value, shortNames, longNames) { + return (lookAhead(match) ? longNames[value] : shortNames[value]); + }, + output = '', + literal = false; + + if (date) { + for (iFormat = 0; iFormat < format.length; iFormat++) { + if (literal) { + if (format.charAt(iFormat) === "'" && !lookAhead("'")) { literal = false; - else + } else { output += format.charAt(iFormat); - else + } + } else { switch (format.charAt(iFormat)) { case 'd': output += formatNumber('d', date.getDate(), 2); @@ -1233,36 +1372,43 @@ $.extend(Datepicker.prototype, { output += date.getTime() * 10000 + this._ticksTo1970; break; case "'": - if (lookAhead("'")) + if (lookAhead("'")) { output += "'"; - else + } else { literal = true; + } break; default: output += format.charAt(iFormat); } + } } + } return output; }, /* Extract all possible characters from the date format. */ _possibleChars: function (format) { - var chars = ''; - var literal = false; - // Check whether a format character is doubled - var lookAhead = function(match) { - var matches = (iFormat + 1 < format.length && format.charAt(iFormat + 1) == match); - if (matches) - iFormat++; - return matches; - }; - for (var iFormat = 0; iFormat < format.length; iFormat++) - if (literal) - if (format.charAt(iFormat) == "'" && !lookAhead("'")) + var iFormat, + chars = '', + literal = false, + // Check whether a format character is doubled + lookAhead = function(match) { + var matches = (iFormat + 1 < format.length && format.charAt(iFormat + 1) === match); + if (matches) { + iFormat++; + } + return matches; + }; + + for (iFormat = 0; iFormat < format.length; iFormat++) { + if (literal) { + if (format.charAt(iFormat) === "'" && !lookAhead("'")) { literal = false; - else + } else { chars += format.charAt(iFormat); - else + } + } else { switch (format.charAt(iFormat)) { case 'd': case 'm': case 'y': case '@': chars += '0123456789'; @@ -1270,14 +1416,17 @@ $.extend(Datepicker.prototype, { case 'D': case 'M': return null; // Accept anything case "'": - if (lookAhead("'")) + if (lookAhead("'")) { chars += "'"; - else + } else { literal = true; + } break; default: chars += format.charAt(iFormat); } + } + } return chars; }, @@ -1289,18 +1438,19 @@ $.extend(Datepicker.prototype, { /* Parse existing date and initialise date picker. */ _setDateFromField: function(inst, noDefault) { - if (inst.input.val() == inst.lastVal) { + if (inst.input.val() === inst.lastVal) { return; } - var dateFormat = this._get(inst, 'dateFormat'); - var dates = inst.lastVal = inst.input ? inst.input.val() : null; - var date, defaultDate; - date = defaultDate = this._getDefaultDate(inst); - var settings = this._getFormatConfig(inst); + + var dateFormat = this._get(inst, 'dateFormat'), + dates = inst.lastVal = inst.input ? inst.input.val() : null, + defaultDate = this._getDefaultDate(inst), + date = defaultDate, + settings = this._getFormatConfig(inst); + try { date = this.parseDate(dateFormat, dates, settings) || defaultDate; } catch (event) { - this.log(event); dates = (noDefault ? '' : dates); } inst.selectedDay = date.getDate(); @@ -1321,47 +1471,50 @@ $.extend(Datepicker.prototype, { /* A date may be specified as an exact value or a relative one. */ _determineDate: function(inst, date, defaultDate) { var offsetNumeric = function(offset) { - var date = new Date(); - date.setDate(date.getDate() + offset); - return date; - }; - var offsetString = function(offset) { - try { - return $.datepicker.parseDate($.datepicker._get(inst, 'dateFormat'), - offset, $.datepicker._getFormatConfig(inst)); - } - catch (e) { - // Ignore - } - var date = (offset.toLowerCase().match(/^c/) ? - $.datepicker._getDate(inst) : null) || new Date(); - var year = date.getFullYear(); - var month = date.getMonth(); - var day = date.getDate(); - var pattern = /([+\-]?[0-9]+)\s*(d|D|w|W|m|M|y|Y)?/g; - var matches = pattern.exec(offset); - while (matches) { - switch (matches[2] || 'd') { - case 'd' : case 'D' : - day += parseInt(matches[1],10); break; - case 'w' : case 'W' : - day += parseInt(matches[1],10) * 7; break; - case 'm' : case 'M' : - month += parseInt(matches[1],10); - day = Math.min(day, $.datepicker._getDaysInMonth(year, month)); - break; - case 'y': case 'Y' : - year += parseInt(matches[1],10); - day = Math.min(day, $.datepicker._getDaysInMonth(year, month)); - break; + var date = new Date(); + date.setDate(date.getDate() + offset); + return date; + }, + offsetString = function(offset) { + try { + return $.datepicker.parseDate($.datepicker._get(inst, 'dateFormat'), + offset, $.datepicker._getFormatConfig(inst)); } - matches = pattern.exec(offset); - } - return new Date(year, month, day); - }; - var newDate = (date == null || date === '' ? defaultDate : (typeof date == 'string' ? offsetString(date) : - (typeof date == 'number' ? (isNaN(date) ? defaultDate : offsetNumeric(date)) : new Date(date.getTime())))); - newDate = (newDate && newDate.toString() == 'Invalid Date' ? defaultDate : newDate); + catch (e) { + // Ignore + } + + var date = (offset.toLowerCase().match(/^c/) ? + $.datepicker._getDate(inst) : null) || new Date(), + year = date.getFullYear(), + month = date.getMonth(), + day = date.getDate(), + pattern = /([+\-]?[0-9]+)\s*(d|D|w|W|m|M|y|Y)?/g, + matches = pattern.exec(offset); + + while (matches) { + switch (matches[2] || 'd') { + case 'd' : case 'D' : + day += parseInt(matches[1],10); break; + case 'w' : case 'W' : + day += parseInt(matches[1],10) * 7; break; + case 'm' : case 'M' : + month += parseInt(matches[1],10); + day = Math.min(day, $.datepicker._getDaysInMonth(year, month)); + break; + case 'y': case 'Y' : + year += parseInt(matches[1],10); + day = Math.min(day, $.datepicker._getDaysInMonth(year, month)); + break; + } + matches = pattern.exec(offset); + } + return new Date(year, month, day); + }, + newDate = (date == null || date === '' ? defaultDate : (typeof date === 'string' ? offsetString(date) : + (typeof date === 'number' ? (isNaN(date) ? defaultDate : offsetNumeric(date)) : new Date(date.getTime())))); + + newDate = (newDate && newDate.toString() === 'Invalid Date' ? defaultDate : newDate); if (newDate) { newDate.setHours(0); newDate.setMinutes(0); @@ -1379,22 +1532,26 @@ $.extend(Datepicker.prototype, { * @return (Date) the corrected date */ _daylightSavingAdjust: function(date) { - if (!date) return null; + if (!date) { + return null; + } date.setHours(date.getHours() > 12 ? date.getHours() + 2 : 0); return date; }, /* Set the date(s) directly. */ _setDate: function(inst, date, noChange) { - var clear = !date; - var origMonth = inst.selectedMonth; - var origYear = inst.selectedYear; - var newDate = this._restrictMinMax(inst, this._determineDate(inst, date, new Date())); + var clear = !date, + origMonth = inst.selectedMonth, + origYear = inst.selectedYear, + newDate = this._restrictMinMax(inst, this._determineDate(inst, date, new Date())); + inst.selectedDay = inst.currentDay = newDate.getDate(); inst.drawMonth = inst.selectedMonth = inst.currentMonth = newDate.getMonth(); inst.drawYear = inst.selectedYear = inst.currentYear = newDate.getFullYear(); - if ((origMonth != inst.selectedMonth || origYear != inst.selectedYear) && !noChange) + if ((origMonth !== inst.selectedMonth || origYear !== inst.selectedYear) && !noChange) { this._notifyChange(inst); + } this._adjustInstDate(inst); if (inst.input) { inst.input.val(clear ? '' : this._formatDate(inst)); @@ -1413,8 +1570,8 @@ $.extend(Datepicker.prototype, { * they work with static code transformers like Caja. */ _attachHandlers: function(inst) { - var stepMonths = this._get(inst, 'stepMonths'); - var id = '#' + inst.id.replace( /\\\\/g, "\\" ); + var stepMonths = this._get(inst, 'stepMonths'), + id = '#' + inst.id.replace( /\\\\/g, "\\" ); inst.dpDiv.find('[data-handler]').map(function () { var handler = { prev: function () { @@ -1448,29 +1605,36 @@ $.extend(Datepicker.prototype, { /* Generate the HTML for the current state of the date picker. */ _generateHTML: function(inst) { - var today = new Date(); - today = this._daylightSavingAdjust( - new Date(today.getFullYear(), today.getMonth(), today.getDate())); // clear time - var isRTL = this._get(inst, 'isRTL'); - var showButtonPanel = this._get(inst, 'showButtonPanel'); - var hideIfNoPrevNext = this._get(inst, 'hideIfNoPrevNext'); - var navigationAsDateFormat = this._get(inst, 'navigationAsDateFormat'); - var numMonths = this._getNumberOfMonths(inst); - var showCurrentAtPos = this._get(inst, 'showCurrentAtPos'); - var stepMonths = this._get(inst, 'stepMonths'); - var isMultiMonth = (numMonths[0] != 1 || numMonths[1] != 1); - var currentDate = this._daylightSavingAdjust((!inst.currentDay ? new Date(9999, 9, 9) : - new Date(inst.currentYear, inst.currentMonth, inst.currentDay))); - var minDate = this._getMinMaxDate(inst, 'min'); - var maxDate = this._getMinMaxDate(inst, 'max'); - var drawMonth = inst.drawMonth - showCurrentAtPos; - var drawYear = inst.drawYear; + var maxDraw, prevText, prev, nextText, next, currentText, gotoDate, + controls, buttonPanel, firstDay, showWeek, dayNames, dayNamesMin, + monthNames, monthNamesShort, beforeShowDay, showOtherMonths, + selectOtherMonths, defaultDate, html, dow, row, group, col, selectedDate, + cornerClass, calender, thead, day, daysInMonth, leadDays, curRows, numRows, + printDate, dRow, tbody, daySettings, otherMonth, unselectable, + tempDate = new Date(), + today = this._daylightSavingAdjust( + new Date(tempDate.getFullYear(), tempDate.getMonth(), tempDate.getDate())), // clear time + isRTL = this._get(inst, 'isRTL'), + showButtonPanel = this._get(inst, 'showButtonPanel'), + hideIfNoPrevNext = this._get(inst, 'hideIfNoPrevNext'), + navigationAsDateFormat = this._get(inst, 'navigationAsDateFormat'), + numMonths = this._getNumberOfMonths(inst), + showCurrentAtPos = this._get(inst, 'showCurrentAtPos'), + stepMonths = this._get(inst, 'stepMonths'), + isMultiMonth = (numMonths[0] !== 1 || numMonths[1] !== 1), + currentDate = this._daylightSavingAdjust((!inst.currentDay ? new Date(9999, 9, 9) : + new Date(inst.currentYear, inst.currentMonth, inst.currentDay))), + minDate = this._getMinMaxDate(inst, 'min'), + maxDate = this._getMinMaxDate(inst, 'max'), + drawMonth = inst.drawMonth - showCurrentAtPos, + drawYear = inst.drawYear; + if (drawMonth < 0) { drawMonth += 12; drawYear--; } if (maxDate) { - var maxDraw = this._daylightSavingAdjust(new Date(maxDate.getFullYear(), + maxDraw = this._daylightSavingAdjust(new Date(maxDate.getFullYear(), maxDate.getMonth() - (numMonths[0] * numMonths[1]) + 1, maxDate.getDate())); maxDraw = (minDate && maxDraw < minDate ? minDate : maxDraw); while (this._daylightSavingAdjust(new Date(drawYear, drawMonth, 1)) > maxDraw) { @@ -1483,53 +1647,63 @@ $.extend(Datepicker.prototype, { } inst.drawMonth = drawMonth; inst.drawYear = drawYear; - var prevText = this._get(inst, 'prevText'); + + prevText = this._get(inst, 'prevText'); prevText = (!navigationAsDateFormat ? prevText : this.formatDate(prevText, this._daylightSavingAdjust(new Date(drawYear, drawMonth - stepMonths, 1)), this._getFormatConfig(inst))); - var prev = (this._canAdjustMonth(inst, -1, drawYear, drawMonth) ? + + prev = (this._canAdjustMonth(inst, -1, drawYear, drawMonth) ? '' + prevText + '' : (hideIfNoPrevNext ? '' : '' + prevText + '')); - var nextText = this._get(inst, 'nextText'); + + nextText = this._get(inst, 'nextText'); nextText = (!navigationAsDateFormat ? nextText : this.formatDate(nextText, this._daylightSavingAdjust(new Date(drawYear, drawMonth + stepMonths, 1)), this._getFormatConfig(inst))); - var next = (this._canAdjustMonth(inst, +1, drawYear, drawMonth) ? + + next = (this._canAdjustMonth(inst, +1, drawYear, drawMonth) ? '' + nextText + '' : (hideIfNoPrevNext ? '' : '' + nextText + '')); - var currentText = this._get(inst, 'currentText'); - var gotoDate = (this._get(inst, 'gotoCurrent') && inst.currentDay ? currentDate : today); + + currentText = this._get(inst, 'currentText'); + gotoDate = (this._get(inst, 'gotoCurrent') && inst.currentDay ? currentDate : today); currentText = (!navigationAsDateFormat ? currentText : this.formatDate(currentText, gotoDate, this._getFormatConfig(inst))); - var controls = (!inst.inline ? '' : ''); - var buttonPanel = (showButtonPanel) ? '
' + (isRTL ? controls : '') + + + buttonPanel = (showButtonPanel) ? '
' + (isRTL ? controls : '') + (this._isInRange(inst, gotoDate) ? '' : '') + (isRTL ? '' : controls) + '
' : ''; - var firstDay = parseInt(this._get(inst, 'firstDay'),10); + + firstDay = parseInt(this._get(inst, 'firstDay'),10); firstDay = (isNaN(firstDay) ? 0 : firstDay); - var showWeek = this._get(inst, 'showWeek'); - var dayNames = this._get(inst, 'dayNames'); - var dayNamesMin = this._get(inst, 'dayNamesMin'); - var monthNames = this._get(inst, 'monthNames'); - var monthNamesShort = this._get(inst, 'monthNamesShort'); - var beforeShowDay = this._get(inst, 'beforeShowDay'); - var showOtherMonths = this._get(inst, 'showOtherMonths'); - var selectOtherMonths = this._get(inst, 'selectOtherMonths'); - var defaultDate = this._getDefaultDate(inst); - var html = ''; - for (var row = 0; row < numMonths[0]; row++) { - var group = ''; + + showWeek = this._get(inst, 'showWeek'); + dayNames = this._get(inst, 'dayNames'); + dayNamesMin = this._get(inst, 'dayNamesMin'); + monthNames = this._get(inst, 'monthNames'); + monthNamesShort = this._get(inst, 'monthNamesShort'); + beforeShowDay = this._get(inst, 'beforeShowDay'); + showOtherMonths = this._get(inst, 'showOtherMonths'); + selectOtherMonths = this._get(inst, 'selectOtherMonths'); + defaultDate = this._getDefaultDate(inst); + html = ''; + dow; + for (row = 0; row < numMonths[0]; row++) { + group = ''; this.maxRows = 4; - for (var col = 0; col < numMonths[1]; col++) { - var selectedDate = this._daylightSavingAdjust(new Date(drawYear, drawMonth, inst.selectedDay)); - var cornerClass = ' ui-corner-all'; - var calender = ''; + for (col = 0; col < numMonths[1]; col++) { + selectedDate = this._daylightSavingAdjust(new Date(drawYear, drawMonth, inst.selectedDay)); + cornerClass = ' ui-corner-all'; + calender = ''; if (isMultiMonth) { calender += '
'; } calender += '
' + @@ -1546,48 +1721,49 @@ $.extend(Datepicker.prototype, { row > 0 || col > 0, monthNames, monthNamesShort) + // draw month headers '
' + ''; - var thead = (showWeek ? '' : ''); - for (var dow = 0; dow < 7; dow++) { // days of the week - var day = (dow + firstDay) % 7; + thead = (showWeek ? '' : ''); + for (dow = 0; dow < 7; dow++) { // days of the week + day = (dow + firstDay) % 7; thead += '= 5 ? ' class="ui-datepicker-week-end"' : '') + '>' + '' + dayNamesMin[day] + ''; } calender += thead + ''; - var daysInMonth = this._getDaysInMonth(drawYear, drawMonth); - if (drawYear == inst.selectedYear && drawMonth == inst.selectedMonth) + daysInMonth = this._getDaysInMonth(drawYear, drawMonth); + if (drawYear === inst.selectedYear && drawMonth === inst.selectedMonth) { inst.selectedDay = Math.min(inst.selectedDay, daysInMonth); - var leadDays = (this._getFirstDayOfMonth(drawYear, drawMonth) - firstDay + 7) % 7; - var curRows = Math.ceil((leadDays + daysInMonth) / 7); // calculate the number of rows to generate - var numRows = (isMultiMonth ? this.maxRows > curRows ? this.maxRows : curRows : curRows); //If multiple months, use the higher number of rows (see #7043) + } + leadDays = (this._getFirstDayOfMonth(drawYear, drawMonth) - firstDay + 7) % 7; + curRows = Math.ceil((leadDays + daysInMonth) / 7); // calculate the number of rows to generate + numRows = (isMultiMonth ? this.maxRows > curRows ? this.maxRows : curRows : curRows); //If multiple months, use the higher number of rows (see #7043) this.maxRows = numRows; - var printDate = this._daylightSavingAdjust(new Date(drawYear, drawMonth, 1 - leadDays)); - for (var dRow = 0; dRow < numRows; dRow++) { // create date picker rows + printDate = this._daylightSavingAdjust(new Date(drawYear, drawMonth, 1 - leadDays)); + for (dRow = 0; dRow < numRows; dRow++) { // create date picker rows calender += ''; - var tbody = (!showWeek ? '' : ''); - for (var dow = 0; dow < 7; dow++) { // create date picker days - var daySettings = (beforeShowDay ? + for (dow = 0; dow < 7; dow++) { // create date picker days + daySettings = (beforeShowDay ? beforeShowDay.apply((inst.input ? inst.input[0] : null), [printDate]) : [true, '']); - var otherMonth = (printDate.getMonth() != drawMonth); - var unselectable = (otherMonth && !selectOtherMonths) || !daySettings[0] || + otherMonth = (printDate.getMonth() !== drawMonth); + unselectable = (otherMonth && !selectOtherMonths) || !daySettings[0] || (minDate && printDate < minDate) || (maxDate && printDate > maxDate); tbody += ''; // display selectable date printDate.setDate(printDate.getDate() + 1); @@ -1601,7 +1777,7 @@ $.extend(Datepicker.prototype, { drawYear++; } calender += '
' + this._get(inst, 'weekHeader') + '' + this._get(inst, 'weekHeader') + '
' + + tbody = (!showWeek ? '' : '' + this._get(inst, 'calculateWeek')(printDate) + '' + // actions (otherMonth && !showOtherMonths ? ' ' : // display for other months (unselectable ? '' + printDate.getDate() + '' : '' + printDate.getDate() + '')) + '
' + (isMultiMonth ? '
' + - ((numMonths[0] > 0 && col == numMonths[1]-1) ? '
' : '') : ''); + ((numMonths[0] > 0 && col === numMonths[1]-1) ? '
' : '') : ''); group += calender; } html += group; @@ -1614,52 +1790,58 @@ $.extend(Datepicker.prototype, { /* Generate the month and year header. */ _generateMonthYearHeader: function(inst, drawMonth, drawYear, minDate, maxDate, secondary, monthNames, monthNamesShort) { - var changeMonth = this._get(inst, 'changeMonth'); - var changeYear = this._get(inst, 'changeYear'); - var showMonthAfterYear = this._get(inst, 'showMonthAfterYear'); - var html = '
'; - var monthHtml = ''; + + var inMinYear, inMaxYear, month, years, thisYear, determineYear, year, endYear, + changeMonth = this._get(inst, 'changeMonth'), + changeYear = this._get(inst, 'changeYear'), + showMonthAfterYear = this._get(inst, 'showMonthAfterYear'), + html = '
', + monthHtml = ''; + // month selection - if (secondary || !changeMonth) + if (secondary || !changeMonth) { monthHtml += '' + monthNames[drawMonth] + ''; - else { - var inMinYear = (minDate && minDate.getFullYear() == drawYear); - var inMaxYear = (maxDate && maxDate.getFullYear() == drawYear); + } else { + inMinYear = (minDate && minDate.getFullYear() === drawYear); + inMaxYear = (maxDate && maxDate.getFullYear() === drawYear); monthHtml += ''; } - if (!showMonthAfterYear) + + if (!showMonthAfterYear) { html += monthHtml + (secondary || !(changeMonth && changeYear) ? ' ' : ''); + } + // year selection if ( !inst.yearshtml ) { inst.yearshtml = ''; - if (secondary || !changeYear) + if (secondary || !changeYear) { html += '' + drawYear + ''; - else { + } else { // determine range of years to display - var years = this._get(inst, 'yearRange').split(':'); - var thisYear = new Date().getFullYear(); - var determineYear = function(value) { + years = this._get(inst, 'yearRange').split(':'); + thisYear = new Date().getFullYear(); + determineYear = function(value) { var year = (value.match(/c[+\-].*/) ? drawYear + parseInt(value.substring(1), 10) : (value.match(/[+\-].*/) ? thisYear + parseInt(value, 10) : parseInt(value, 10))); return (isNaN(year) ? thisYear : year); }; - var year = determineYear(years[0]); - var endYear = Math.max(year, determineYear(years[1] || '')); + year = determineYear(years[0]); + endYear = Math.max(year, determineYear(years[1] || '')); year = (minDate ? Math.max(year, minDate.getFullYear()) : year); endYear = (maxDate ? Math.min(endYear, maxDate.getFullYear()) : endYear); inst.yearshtml += ''; @@ -1668,49 +1850,51 @@ $.extend(Datepicker.prototype, { inst.yearshtml = null; } } + html += this._get(inst, 'yearSuffix'); - if (showMonthAfterYear) + if (showMonthAfterYear) { html += (secondary || !(changeMonth && changeYear) ? ' ' : '') + monthHtml; + } html += '
'; // Close datepicker_header return html; }, /* Adjust one of the date sub-fields. */ _adjustInstDate: function(inst, offset, period) { - var year = inst.drawYear + (period == 'Y' ? offset : 0); - var month = inst.drawMonth + (period == 'M' ? offset : 0); - var day = Math.min(inst.selectedDay, this._getDaysInMonth(year, month)) + - (period == 'D' ? offset : 0); - var date = this._restrictMinMax(inst, - this._daylightSavingAdjust(new Date(year, month, day))); + var year = inst.drawYear + (period === 'Y' ? offset : 0), + month = inst.drawMonth + (period === 'M' ? offset : 0), + day = Math.min(inst.selectedDay, this._getDaysInMonth(year, month)) + (period === 'D' ? offset : 0), + date = this._restrictMinMax(inst, this._daylightSavingAdjust(new Date(year, month, day))); + inst.selectedDay = date.getDate(); inst.drawMonth = inst.selectedMonth = date.getMonth(); inst.drawYear = inst.selectedYear = date.getFullYear(); - if (period == 'M' || period == 'Y') + if (period === 'M' || period === 'Y') { this._notifyChange(inst); + } }, /* Ensure a date is within any min/max bounds. */ _restrictMinMax: function(inst, date) { - var minDate = this._getMinMaxDate(inst, 'min'); - var maxDate = this._getMinMaxDate(inst, 'max'); - var newDate = (minDate && date < minDate ? minDate : date); - newDate = (maxDate && newDate > maxDate ? maxDate : newDate); - return newDate; + var minDate = this._getMinMaxDate(inst, 'min'), + maxDate = this._getMinMaxDate(inst, 'max'), + newDate = (minDate && date < minDate ? minDate : date); + return (maxDate && newDate > maxDate ? maxDate : newDate); }, /* Notify change of month/year. */ _notifyChange: function(inst) { var onChange = this._get(inst, 'onChangeMonthYear'); - if (onChange) + if (onChange) { onChange.apply((inst.input ? inst.input[0] : null), [inst.selectedYear, inst.selectedMonth + 1, inst]); + } }, /* Determine the number of months to show. */ _getNumberOfMonths: function(inst) { var numMonths = this._get(inst, 'numberOfMonths'); - return (numMonths == null ? [1, 1] : (typeof numMonths == 'number' ? [1, numMonths] : numMonths)); + return (numMonths == null ? [1, 1] : (typeof numMonths === 'number' ? [1, numMonths] : numMonths)); }, /* Determine the current maximum date - ensure no time components are set. */ @@ -1730,24 +1914,27 @@ $.extend(Datepicker.prototype, { /* Determines if we should allow a "next/prev" month display change. */ _canAdjustMonth: function(inst, offset, curYear, curMonth) { - var numMonths = this._getNumberOfMonths(inst); - var date = this._daylightSavingAdjust(new Date(curYear, + var numMonths = this._getNumberOfMonths(inst), + date = this._daylightSavingAdjust(new Date(curYear, curMonth + (offset < 0 ? offset : numMonths[0] * numMonths[1]), 1)); - if (offset < 0) + + if (offset < 0) { date.setDate(this._getDaysInMonth(date.getFullYear(), date.getMonth())); + } return this._isInRange(inst, date); }, /* Is the given date in the accepted range? */ _isInRange: function(inst, date) { - var minDate = this._getMinMaxDate(inst, 'min'); - var maxDate = this._getMinMaxDate(inst, 'max'); - var minYear = null; - var maxYear = null; - var years = this._get(inst, 'yearRange'); + var yearSplit, currentYear, + minDate = this._getMinMaxDate(inst, 'min'), + maxDate = this._getMinMaxDate(inst, 'max'), + minYear = null, + maxYear = null, + years = this._get(inst, 'yearRange'); if (years){ - var yearSplit = years.split(':'); - var currentYear = new Date().getFullYear(); + yearSplit = years.split(':'); + currentYear = new Date().getFullYear(); minYear = parseInt(yearSplit[0], 10) + currentYear; maxYear = parseInt(yearSplit[1], 10) + currentYear; } @@ -1761,7 +1948,7 @@ $.extend(Datepicker.prototype, { /* Provide the configuration settings for formatting/parsing. */ _getFormatConfig: function(inst) { var shortYearCutoff = this._get(inst, 'shortYearCutoff'); - shortYearCutoff = (typeof shortYearCutoff != 'string' ? shortYearCutoff : + shortYearCutoff = (typeof shortYearCutoff !== 'string' ? shortYearCutoff : new Date().getFullYear() % 100 + parseInt(shortYearCutoff, 10)); return {shortYearCutoff: shortYearCutoff, dayNamesShort: this._get(inst, 'dayNamesShort'), dayNames: this._get(inst, 'dayNames'), @@ -1775,7 +1962,7 @@ $.extend(Datepicker.prototype, { inst.currentMonth = inst.selectedMonth; inst.currentYear = inst.selectedYear; } - var date = (day ? (typeof day == 'object' ? day : + var date = (day ? (typeof day === 'object' ? day : this._daylightSavingAdjust(new Date(year, month, day))) : this._daylightSavingAdjust(new Date(inst.currentYear, inst.currentMonth, inst.currentDay))); return this.formatDate(this._get(inst, 'dateFormat'), date, this._getFormatConfig(inst)); @@ -1791,15 +1978,23 @@ function bindHover(dpDiv) { var selector = 'button, .ui-datepicker-prev, .ui-datepicker-next, .ui-datepicker-calendar td a'; return dpDiv.delegate(selector, 'mouseout', function() { $(this).removeClass('ui-state-hover'); - if (this.className.indexOf('ui-datepicker-prev') != -1) $(this).removeClass('ui-datepicker-prev-hover'); - if (this.className.indexOf('ui-datepicker-next') != -1) $(this).removeClass('ui-datepicker-next-hover'); + if (this.className.indexOf('ui-datepicker-prev') !== -1) { + $(this).removeClass('ui-datepicker-prev-hover'); + } + if (this.className.indexOf('ui-datepicker-next') !== -1) { + $(this).removeClass('ui-datepicker-next-hover'); + } }) .delegate(selector, 'mouseover', function(){ if (!$.datepicker._isDisabledDatepicker( instActive.inline ? dpDiv.parent()[0] : instActive.input[0])) { $(this).parents('.ui-datepicker-calendar').find('a').removeClass('ui-state-hover'); $(this).addClass('ui-state-hover'); - if (this.className.indexOf('ui-datepicker-prev') != -1) $(this).addClass('ui-datepicker-prev-hover'); - if (this.className.indexOf('ui-datepicker-next') != -1) $(this).addClass('ui-datepicker-next-hover'); + if (this.className.indexOf('ui-datepicker-prev') !== -1) { + $(this).addClass('ui-datepicker-prev-hover'); + } + if (this.className.indexOf('ui-datepicker-next') !== -1) { + $(this).addClass('ui-datepicker-next-hover'); + } } }); } @@ -1807,9 +2002,11 @@ function bindHover(dpDiv) { /* jQuery extend now ignores nulls! */ function extendRemove(target, props) { $.extend(target, props); - for (var name in props) - if (props[name] == null) + for (var name in props) { + if (props[name] == null) { target[name] = props[name]; + } + } return target; } @@ -1832,14 +2029,16 @@ $.fn.datepicker = function(options){ } var otherArgs = Array.prototype.slice.call(arguments, 1); - if (typeof options == 'string' && (options == 'isDisabled' || options == 'getDate' || options == 'widget')) + if (typeof options === 'string' && (options === 'isDisabled' || options === 'getDate' || options === 'widget')) { return $.datepicker['_' + options + 'Datepicker']. apply($.datepicker, [this[0]].concat(otherArgs)); - if (options == 'option' && arguments.length == 2 && typeof arguments[1] == 'string') + } + if (options === 'option' && arguments.length === 2 && typeof arguments[1] === 'string') { return $.datepicker['_' + options + 'Datepicker']. apply($.datepicker, [this[0]].concat(otherArgs)); + } return this.each(function() { - typeof options == 'string' ? + typeof options === 'string' ? $.datepicker['_' + options + 'Datepicker']. apply($.datepicker, [this].concat(otherArgs)) : $.datepicker._attachDatepicker(this, options); From cc7df712cc4ca90f6d6db599c5ff91b690921581 Mon Sep 17 00:00:00 2001 From: Mike Sherov Date: Mon, 19 Nov 2012 08:37:41 -0500 Subject: [PATCH 13/28] Button: properly escape button names. Fixes #7505 - Button: Buttonset not applied to radio group with quotation/apostrophe in name. --- tests/unit/button/button.html | 7 +++++++ tests/unit/button/button_events.js | 10 +++++++++- ui/jquery.ui.button.js | 1 + 3 files changed, 17 insertions(+), 1 deletion(-) diff --git a/tests/unit/button/button.html b/tests/unit/button/button.html index b79ca1dc6..93f9af611 100644 --- a/tests/unit/button/button.html +++ b/tests/unit/button/button.html @@ -59,6 +59,13 @@
+
+
+ + + +
+
​ diff --git a/tests/unit/button/button_events.js b/tests/unit/button/button_events.js index 40d2a1a96..ad83101d0 100644 --- a/tests/unit/button/button_events.js +++ b/tests/unit/button/button_events.js @@ -1,8 +1,16 @@ /* * button_events.js */ -(function() { +(function($) { module("button: events"); +test("buttonset works with single-quote named elements (#7505)", function() { + expect( 1 ); + $("#radio3").buttonset(); + $("#radio33").click( function(){ + ok( true, "button clicks work with single-quote named elements" ); + }).click(); +}); + })(jQuery); diff --git a/ui/jquery.ui.button.js b/ui/jquery.ui.button.js index db04b63b8..508a0424a 100644 --- a/ui/jquery.ui.button.js +++ b/ui/jquery.ui.button.js @@ -29,6 +29,7 @@ var lastActive, startXPos, startYPos, clickDragged, form = radio.form, radios = $( [] ); if ( name ) { + name = name.replace( /'/g, "\\'" ); if ( form ) { radios = $( form ).find( "[name='" + name + "']" ); } else { From cf9fbce13931732dc4b06d491ef2a01c4921faf1 Mon Sep 17 00:00:00 2001 From: "mathias.stenbom" Date: Mon, 19 Nov 2012 09:06:36 -0500 Subject: [PATCH 14/28] Draggable: made handles work with complex markup. Fixes #8757 - Draggable: Resizable handle with inner element does not work, when its also draggable --- tests/unit/draggable/draggable.html | 1 + tests/unit/draggable/draggable_core.js | 29 ++++++++++++++++++++++++++ ui/jquery.ui.draggable.js | 2 +- 3 files changed, 31 insertions(+), 1 deletion(-) diff --git a/tests/unit/draggable/draggable.html b/tests/unit/draggable/draggable.html index dce226a9a..cd068eb20 100644 --- a/tests/unit/draggable/draggable.html +++ b/tests/unit/draggable/draggable.html @@ -16,6 +16,7 @@ "ui/jquery.ui.core.js", "ui/jquery.ui.widget.js", "ui/jquery.ui.mouse.js", + "ui/jquery.ui.resizable.js", "ui/jquery.ui.draggable.js" ] }); diff --git a/tests/unit/draggable/draggable_core.js b/tests/unit/draggable/draggable_core.js index 31002addc..28a19f380 100644 --- a/tests/unit/draggable/draggable_core.js +++ b/tests/unit/draggable/draggable_core.js @@ -44,4 +44,33 @@ test("No options, absolute", function() { TestHelpers.draggable.shouldMove(el); }); +test("resizable handle with complex markup (#8756 / #8757)", function() { + expect( 2 ); + + $('#draggable1') + .append( + $('
') + .addClass("ui-resizable-handle") + .addClass("ui-resizable-w") + .append($('
')) + ); + + var handle = '.ui-resizable-w div', + target = $('#draggable1').draggable().resizable({ handles: 'all' }), + drag = function(el, dx) { + $(el) + .simulate("mouseover") + .simulate("drag", { + dx: dx || 0, + speed: 'sync' + }); + }; + + drag(handle, -50); + equal( target.width(), 250, "compare width" ); + + drag(handle, 50); + equal( target.width(), 200, "compare width" ); +}); + })(jQuery); diff --git a/ui/jquery.ui.draggable.js b/ui/jquery.ui.draggable.js index dad5af074..b982ac6be 100644 --- a/ui/jquery.ui.draggable.js +++ b/ui/jquery.ui.draggable.js @@ -70,7 +70,7 @@ $.widget("ui.draggable", $.ui.mouse, { var o = this.options; // among others, prevent a drag on a resizable-handle - if (this.helper || o.disabled || $(event.target).is('.ui-resizable-handle')) { + if (this.helper || o.disabled || $(event.target).closest('.ui-resizable-handle').length > 0) { return false; } From 7ffcaa2e3b673e7e4178293224d5a15f65cbbcf9 Mon Sep 17 00:00:00 2001 From: Roman Salnikov Date: Mon, 19 Nov 2012 09:14:59 -0500 Subject: [PATCH 15/28] Datepicker: reinitialize datepicker if mainDiv isn't on the page. Fixed #5679 - Datepicker should reinitialize if dpDiv is removed --- tests/unit/datepicker/datepicker_core.js | 10 ++++++++++ ui/jquery.ui.datepicker.js | 8 ++++++-- 2 files changed, 16 insertions(+), 2 deletions(-) diff --git a/tests/unit/datepicker/datepicker_core.js b/tests/unit/datepicker/datepicker_core.js index ae51b41d0..3c88059d1 100644 --- a/tests/unit/datepicker/datepicker_core.js +++ b/tests/unit/datepicker/datepicker_core.js @@ -6,6 +6,16 @@ module("datepicker: core"); +test("initialization - Reinitialization after body had been emptied.", function() { + expect( 1 ); + var bodyContent = $('body').children(), inp = $("#inp"); + $("#inp").datepicker(); + $('body').empty().append(inp); + $("#inp").datepicker(); + ok( $("#"+$.datepicker._mainDivId).length===1, "Datepicker container added" ); + $('body').empty().append(bodyContent); // Returning to initial state for later tests +}); + test( "widget method - empty collection", function() { expect( 1 ); $( "#nonExist" ).datepicker(); // should create nothing diff --git a/ui/jquery.ui.datepicker.js b/ui/jquery.ui.datepicker.js index 584f21aaa..823934e05 100644 --- a/ui/jquery.ui.datepicker.js +++ b/ui/jquery.ui.datepicker.js @@ -2023,11 +2023,15 @@ $.fn.datepicker = function(options){ /* Initialise the date picker. */ if (!$.datepicker.initialized) { - $(document).mousedown($.datepicker._checkExternalClick). - find(document.body).append($.datepicker.dpDiv); + $(document).mousedown($.datepicker._checkExternalClick); $.datepicker.initialized = true; } + /* Append datepicker main container to body if not exist. */ + if ($("#"+$.datepicker._mainDivId).length === 0) { + $('body').append($.datepicker.dpDiv); + } + var otherArgs = Array.prototype.slice.call(arguments, 1); if (typeof options === 'string' && (options === 'isDisabled' || options === 'getDate' || options === 'widget')) { return $.datepicker['_' + options + 'Datepicker']. From 8cfee45ac9595d7ace807f7ccf22e9f428eb77b2 Mon Sep 17 00:00:00 2001 From: Mike Sherov Date: Mon, 19 Nov 2012 09:23:05 -0500 Subject: [PATCH 16/28] Button tests: replace XHTML with HTML in button test suite --- tests/unit/button/button.html | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/tests/unit/button/button.html b/tests/unit/button/button.html index 93f9af611..8c9335aeb 100644 --- a/tests/unit/button/button.html +++ b/tests/unit/button/button.html @@ -61,9 +61,9 @@
- - - + + +
​ From d5afdba4cb4e00fcd40e22beefd059464f75998b Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Scott=20Gonz=C3=A1lez?= Date: Mon, 19 Nov 2012 17:08:41 -0500 Subject: [PATCH 17/28] Autocomplete: Whitespace. --- ui/jquery.ui.autocomplete.js | 1 - 1 file changed, 1 deletion(-) diff --git a/ui/jquery.ui.autocomplete.js b/ui/jquery.ui.autocomplete.js index f5ab57bd4..f2a7089c4 100644 --- a/ui/jquery.ui.autocomplete.js +++ b/ui/jquery.ui.autocomplete.js @@ -590,5 +590,4 @@ $.widget( "ui.autocomplete", $.ui.autocomplete, { } }); - }( jQuery )); From 010e09fa62b7e71fdfaaf6b0d4e974be0704a1c8 Mon Sep 17 00:00:00 2001 From: Anika Henke Date: Tue, 20 Nov 2012 00:29:01 +0000 Subject: [PATCH 18/28] CSS: Reformatted CSS to use better coding standard --- themes/base/jquery.ui.accordion.css | 35 +++- themes/base/jquery.ui.button.css | 124 ++++++++++--- themes/base/jquery.ui.core.css | 73 ++++++-- themes/base/jquery.ui.datepicker.css | 213 ++++++++++++++++++----- themes/base/jquery.ui.dialog.css | 77 +++++++-- themes/base/jquery.ui.menu.css | 72 ++++++-- themes/base/jquery.ui.progressbar.css | 11 +- themes/base/jquery.ui.resizable.css | 79 +++++++-- themes/base/jquery.ui.selectable.css | 6 +- themes/base/jquery.ui.slider.css | 68 ++++++-- themes/base/jquery.ui.spinner.css | 57 +++++- themes/base/jquery.ui.tabs.css | 51 +++++- themes/base/jquery.ui.theme.css | 239 ++++++++++++++++++++++---- themes/base/jquery.ui.tooltip.css | 4 +- 14 files changed, 923 insertions(+), 186 deletions(-) diff --git a/themes/base/jquery.ui.accordion.css b/themes/base/jquery.ui.accordion.css index 60975acc2..d239bc49e 100644 --- a/themes/base/jquery.ui.accordion.css +++ b/themes/base/jquery.ui.accordion.css @@ -8,9 +8,32 @@ * * http://docs.jquery.com/UI/Accordion#theming */ -.ui-accordion .ui-accordion-header { display: block; cursor: pointer; position: relative; margin-top: 2px; padding: .5em .5em .5em .7em; zoom: 1; } -.ui-accordion .ui-accordion-icons { padding-left: 2.2em; } -.ui-accordion .ui-accordion-noicons { padding-left: .7em; } -.ui-accordion .ui-accordion-icons .ui-accordion-icons { padding-left: 2.2em; } -.ui-accordion .ui-accordion-header .ui-accordion-header-icon { position: absolute; left: .5em; top: 50%; margin-top: -8px; } -.ui-accordion .ui-accordion-content { padding: 1em 2.2em; border-top: 0; overflow: auto; zoom: 1; } +.ui-accordion .ui-accordion-header { + display: block; + cursor: pointer; + position: relative; + margin-top: 2px; + padding: .5em .5em .5em .7em; + zoom: 1; +} +.ui-accordion .ui-accordion-icons { + padding-left: 2.2em; +} +.ui-accordion .ui-accordion-noicons { + padding-left: .7em; +} +.ui-accordion .ui-accordion-icons .ui-accordion-icons { + padding-left: 2.2em; +} +.ui-accordion .ui-accordion-header .ui-accordion-header-icon { + position: absolute; + left: .5em; + top: 50%; + margin-top: -8px; +} +.ui-accordion .ui-accordion-content { + padding: 1em 2.2em; + border-top: 0; + overflow: auto; + zoom: 1; +} diff --git a/themes/base/jquery.ui.button.css b/themes/base/jquery.ui.button.css index 1faeff6ab..b540983f2 100644 --- a/themes/base/jquery.ui.button.css +++ b/themes/base/jquery.ui.button.css @@ -8,33 +8,109 @@ * * http://docs.jquery.com/UI/Button#theming */ -.ui-button { display: inline-block; position: relative; padding: 0; margin-right: .1em; cursor: pointer; text-align: center; zoom: 1; overflow: visible; } /* the overflow property removes extra width in IE */ -.ui-button, .ui-button:link, .ui-button:visited, .ui-button:hover, .ui-button:active { text-decoration: none; } -.ui-button-icon-only { width: 2.2em; } /* to make room for the icon, a width needs to be set here */ -button.ui-button-icon-only { width: 2.4em; } /* button elements seem to need a little more width */ -.ui-button-icons-only { width: 3.4em; } -button.ui-button-icons-only { width: 3.7em; } +.ui-button { + display: inline-block; + position: relative; + padding: 0; + margin-right: .1em; + cursor: pointer; + text-align: center; + zoom: 1; + overflow: visible; /* removes extra width in IE */ +} +.ui-button, +.ui-button:link, +.ui-button:visited, +.ui-button:hover, +.ui-button:active { + text-decoration: none; +} +/* to make room for the icon, a width needs to be set here */ +.ui-button-icon-only { + width: 2.2em; +} +/* button elements seem to need a little more width */ +button.ui-button-icon-only { + width: 2.4em; +} +.ui-button-icons-only { + width: 3.4em; +} +button.ui-button-icons-only { + width: 3.7em; +} -/*button text element */ -.ui-button .ui-button-text { display: block; line-height: 1.4; } -.ui-button-text-only .ui-button-text { padding: .4em 1em; } -.ui-button-icon-only .ui-button-text, .ui-button-icons-only .ui-button-text { padding: .4em; text-indent: -9999999px; } -.ui-button-text-icon-primary .ui-button-text, .ui-button-text-icons .ui-button-text { padding: .4em 1em .4em 2.1em; } -.ui-button-text-icon-secondary .ui-button-text, .ui-button-text-icons .ui-button-text { padding: .4em 2.1em .4em 1em; } -.ui-button-text-icons .ui-button-text { padding-left: 2.1em; padding-right: 2.1em; } +/* button text element */ +.ui-button .ui-button-text { + display: block; + line-height: 1.4; +} +.ui-button-text-only .ui-button-text { + padding: .4em 1em; +} +.ui-button-icon-only .ui-button-text, +.ui-button-icons-only .ui-button-text { + padding: .4em; + text-indent: -9999999px; +} +.ui-button-text-icon-primary .ui-button-text, +.ui-button-text-icons .ui-button-text { + padding: .4em 1em .4em 2.1em; +} +.ui-button-text-icon-secondary .ui-button-text, +.ui-button-text-icons .ui-button-text { + padding: .4em 2.1em .4em 1em; +} +.ui-button-text-icons .ui-button-text { + padding-left: 2.1em; + padding-right: 2.1em; +} /* no icon support for input elements, provide padding by default */ -input.ui-button { padding: .4em 1em; } +input.ui-button { + padding: .4em 1em; +} -/*button icon element(s) */ -.ui-button-icon-only .ui-icon, .ui-button-text-icon-primary .ui-icon, .ui-button-text-icon-secondary .ui-icon, .ui-button-text-icons .ui-icon, .ui-button-icons-only .ui-icon { position: absolute; top: 50%; margin-top: -8px; } -.ui-button-icon-only .ui-icon { left: 50%; margin-left: -8px; } -.ui-button-text-icon-primary .ui-button-icon-primary, .ui-button-text-icons .ui-button-icon-primary, .ui-button-icons-only .ui-button-icon-primary { left: .5em; } -.ui-button-text-icon-secondary .ui-button-icon-secondary, .ui-button-text-icons .ui-button-icon-secondary, .ui-button-icons-only .ui-button-icon-secondary { right: .5em; } -.ui-button-text-icons .ui-button-icon-secondary, .ui-button-icons-only .ui-button-icon-secondary { right: .5em; } +/* button icon element(s) */ +.ui-button-icon-only .ui-icon, +.ui-button-text-icon-primary .ui-icon, +.ui-button-text-icon-secondary .ui-icon, +.ui-button-text-icons .ui-icon, +.ui-button-icons-only .ui-icon { + position: absolute; + top: 50%; + margin-top: -8px; +} +.ui-button-icon-only .ui-icon { + left: 50%; + margin-left: -8px; +} +.ui-button-text-icon-primary .ui-button-icon-primary, +.ui-button-text-icons .ui-button-icon-primary, +.ui-button-icons-only .ui-button-icon-primary { + left: .5em; +} +.ui-button-text-icon-secondary .ui-button-icon-secondary, +.ui-button-text-icons .ui-button-icon-secondary, +.ui-button-icons-only .ui-button-icon-secondary { + right: .5em; +} +.ui-button-text-icons .ui-button-icon-secondary, +.ui-button-icons-only .ui-button-icon-secondary { + right: .5em; +} -/*button sets*/ -.ui-buttonset { margin-right: 7px; } -.ui-buttonset .ui-button { margin-left: 0; margin-right: -.3em; } +/* button sets */ +.ui-buttonset { + margin-right: 7px; +} +.ui-buttonset .ui-button { + margin-left: 0; + margin-right: -.3em; +} /* workarounds */ -button.ui-button::-moz-focus-inner { border: 0; padding: 0; } /* reset extra padding in Firefox */ +/* reset extra padding in Firefox */ +button.ui-button::-moz-focus-inner { + border: 0; + padding: 0; +} diff --git a/themes/base/jquery.ui.core.css b/themes/base/jquery.ui.core.css index 5bfe620b9..c68808065 100644 --- a/themes/base/jquery.ui.core.css +++ b/themes/base/jquery.ui.core.css @@ -11,31 +11,82 @@ /* Layout helpers ----------------------------------*/ -.ui-helper-hidden { display: none; } -.ui-helper-hidden-accessible { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; } -.ui-helper-reset { margin: 0; padding: 0; border: 0; outline: 0; line-height: 1.3; text-decoration: none; font-size: 100%; list-style: none; } -.ui-helper-clearfix:before, .ui-helper-clearfix:after { content: ""; display: table; } -.ui-helper-clearfix:after { clear: both; } -.ui-helper-clearfix { zoom: 1; } -.ui-helper-zfix { width: 100%; height: 100%; top: 0; left: 0; position: absolute; opacity: 0; filter:Alpha(Opacity=0); } +.ui-helper-hidden { + display: none; +} +.ui-helper-hidden-accessible { + border: 0; + clip: rect(0 0 0 0); + height: 1px; + margin: -1px; + overflow: hidden; + padding: 0; + position: absolute; + width: 1px; +} +.ui-helper-reset { + margin: 0; + padding: 0; + border: 0; + outline: 0; + line-height: 1.3; + text-decoration: none; + font-size: 100%; + list-style: none; +} +.ui-helper-clearfix:before, +.ui-helper-clearfix:after { + content: ""; + display: table; +} +.ui-helper-clearfix:after { + clear: both; +} +.ui-helper-clearfix { + zoom: 1; +} +.ui-helper-zfix { + width: 100%; + height: 100%; + top: 0; + left: 0; + position: absolute; + opacity: 0; + filter:Alpha(Opacity=0); +} -.ui-front { z-index: 100; } +.ui-front { + z-index: 100; +} /* Interaction Cues ----------------------------------*/ -.ui-state-disabled { cursor: default !important; } +.ui-state-disabled { + cursor: default !important; +} /* Icons ----------------------------------*/ /* states and images */ -.ui-icon { display: block; text-indent: -99999px; overflow: hidden; background-repeat: no-repeat; } +.ui-icon { + display: block; + text-indent: -99999px; + overflow: hidden; + background-repeat: no-repeat; +} /* Misc visuals ----------------------------------*/ /* Overlays */ -.ui-widget-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; } +.ui-widget-overlay { + position: fixed; + top: 0; + left: 0; + width: 100%; + height: 100%; +} diff --git a/themes/base/jquery.ui.datepicker.css b/themes/base/jquery.ui.datepicker.css index e25d8ea56..5ed7dfa4c 100644 --- a/themes/base/jquery.ui.datepicker.css +++ b/themes/base/jquery.ui.datepicker.css @@ -8,49 +8,178 @@ * * http://docs.jquery.com/UI/Datepicker#theming */ -.ui-datepicker { width: 17em; padding: .2em .2em 0; display: none; } -.ui-datepicker .ui-datepicker-header { position:relative; padding:.2em 0; } -.ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next { position:absolute; top: 2px; width: 1.8em; height: 1.8em; } -.ui-datepicker .ui-datepicker-prev-hover, .ui-datepicker .ui-datepicker-next-hover { top: 1px; } -.ui-datepicker .ui-datepicker-prev { left:2px; } -.ui-datepicker .ui-datepicker-next { right:2px; } -.ui-datepicker .ui-datepicker-prev-hover { left:1px; } -.ui-datepicker .ui-datepicker-next-hover { right:1px; } -.ui-datepicker .ui-datepicker-prev span, .ui-datepicker .ui-datepicker-next span { display: block; position: absolute; left: 50%; margin-left: -8px; top: 50%; margin-top: -8px; } -.ui-datepicker .ui-datepicker-title { margin: 0 2.3em; line-height: 1.8em; text-align: center; } -.ui-datepicker .ui-datepicker-title select { font-size:1em; margin:1px 0; } -.ui-datepicker select.ui-datepicker-month-year {width: 100%;} -.ui-datepicker select.ui-datepicker-month, -.ui-datepicker select.ui-datepicker-year { width: 49%;} -.ui-datepicker table {width: 100%; font-size: .9em; border-collapse: collapse; margin:0 0 .4em; } -.ui-datepicker th { padding: .7em .3em; text-align: center; font-weight: bold; border: 0; } -.ui-datepicker td { border: 0; padding: 1px; } -.ui-datepicker td span, .ui-datepicker td a { display: block; padding: .2em; text-align: right; text-decoration: none; } -.ui-datepicker .ui-datepicker-buttonpane { background-image: none; margin: .7em 0 0 0; padding:0 .2em; border-left: 0; border-right: 0; border-bottom: 0; } -.ui-datepicker .ui-datepicker-buttonpane button { float: right; margin: .5em .2em .4em; cursor: pointer; padding: .2em .6em .3em .6em; width:auto; overflow:visible; } -.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current { float:left; } +.ui-datepicker { + width: 17em; + padding: .2em .2em 0; + display: none; +} +.ui-datepicker .ui-datepicker-header { + position: relative; + padding:.2em 0; +} +.ui-datepicker .ui-datepicker-prev, +.ui-datepicker .ui-datepicker-next { + position: absolute; + top: 2px; + width: 1.8em; + height: 1.8em; +} +.ui-datepicker .ui-datepicker-prev-hover, +.ui-datepicker .ui-datepicker-next-hover { + top: 1px; +} +.ui-datepicker .ui-datepicker-prev { + left: 2px; +} +.ui-datepicker .ui-datepicker-next { + right: 2px; +} +.ui-datepicker .ui-datepicker-prev-hover { + left: 1px; +} +.ui-datepicker .ui-datepicker-next-hover { + right: 1px; +} +.ui-datepicker .ui-datepicker-prev span, +.ui-datepicker .ui-datepicker-next span { + display: block; + position: absolute; + left: 50%; + margin-left: -8px; + top: 50%; + margin-top: -8px; +} +.ui-datepicker .ui-datepicker-title { + margin: 0 2.3em; + line-height: 1.8em; + text-align: center; +} +.ui-datepicker .ui-datepicker-title select { + font-size: 1em; + margin: 1px 0; +} +.ui-datepicker select.ui-datepicker-month-year { + width: 100%; +} +.ui-datepicker select.ui-datepicker-month, +.ui-datepicker select.ui-datepicker-year { + width: 49%; +} +.ui-datepicker table { + width: 100%; + font-size: .9em; + border-collapse: collapse; + margin: 0 0 .4em; +} +.ui-datepicker th { + padding: .7em .3em; + text-align: center; + font-weight: bold; + border: 0; +} +.ui-datepicker td { + border: 0; + padding: 1px; +} +.ui-datepicker td span, +.ui-datepicker td a { + display: block; + padding: .2em; + text-align: right; + text-decoration: none; +} +.ui-datepicker .ui-datepicker-buttonpane { + background-image: none; + margin: .7em 0 0 0; + padding: 0 .2em; + border-left: 0; + border-right: 0; + border-bottom: 0; +} +.ui-datepicker .ui-datepicker-buttonpane button { + float: right; + margin: .5em .2em .4em; + cursor: pointer; + padding: .2em .6em .3em .6em; + width: auto; + overflow: visible; +} +.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current { + float: left; +} /* with multiple calendars */ -.ui-datepicker.ui-datepicker-multi { width:auto; } -.ui-datepicker-multi .ui-datepicker-group { float:left; } -.ui-datepicker-multi .ui-datepicker-group table { width:95%; margin:0 auto .4em; } -.ui-datepicker-multi-2 .ui-datepicker-group { width:50%; } -.ui-datepicker-multi-3 .ui-datepicker-group { width:33.3%; } -.ui-datepicker-multi-4 .ui-datepicker-group { width:25%; } -.ui-datepicker-multi .ui-datepicker-group-last .ui-datepicker-header { border-left-width:0; } -.ui-datepicker-multi .ui-datepicker-group-middle .ui-datepicker-header { border-left-width:0; } -.ui-datepicker-multi .ui-datepicker-buttonpane { clear:left; } -.ui-datepicker-row-break { clear:both; width:100%; font-size:0em; } +.ui-datepicker.ui-datepicker-multi { + width: auto; +} +.ui-datepicker-multi .ui-datepicker-group { + float: left; +} +.ui-datepicker-multi .ui-datepicker-group table { + width: 95%; + margin: 0 auto .4em; +} +.ui-datepicker-multi-2 .ui-datepicker-group { + width: 50%; +} +.ui-datepicker-multi-3 .ui-datepicker-group { + width: 33.3%; +} +.ui-datepicker-multi-4 .ui-datepicker-group { + width: 25%; +} +.ui-datepicker-multi .ui-datepicker-group-last .ui-datepicker-header { + border-left-width: 0; +} +.ui-datepicker-multi .ui-datepicker-group-middle .ui-datepicker-header { + border-left-width: 0; +} +.ui-datepicker-multi .ui-datepicker-buttonpane { + clear: left; +} +.ui-datepicker-row-break { + clear: both; + width: 100%; + font-size: 0em; +} /* RTL support */ -.ui-datepicker-rtl { direction: rtl; } -.ui-datepicker-rtl .ui-datepicker-prev { right: 2px; left: auto; } -.ui-datepicker-rtl .ui-datepicker-next { left: 2px; right: auto; } -.ui-datepicker-rtl .ui-datepicker-prev:hover { right: 1px; left: auto; } -.ui-datepicker-rtl .ui-datepicker-next:hover { left: 1px; right: auto; } -.ui-datepicker-rtl .ui-datepicker-buttonpane { clear:right; } -.ui-datepicker-rtl .ui-datepicker-buttonpane button { float: left; } -.ui-datepicker-rtl .ui-datepicker-buttonpane button.ui-datepicker-current { float:right; } -.ui-datepicker-rtl .ui-datepicker-group { float:right; } -.ui-datepicker-rtl .ui-datepicker-group-last .ui-datepicker-header { border-right-width:0; border-left-width:1px; } -.ui-datepicker-rtl .ui-datepicker-group-middle .ui-datepicker-header { border-right-width:0; border-left-width:1px; } +.ui-datepicker-rtl { + direction: rtl; +} +.ui-datepicker-rtl .ui-datepicker-prev { + right: 2px; + left: auto; +} +.ui-datepicker-rtl .ui-datepicker-next { + left: 2px; + right: auto; +} +.ui-datepicker-rtl .ui-datepicker-prev:hover { + right: 1px; + left: auto; +} +.ui-datepicker-rtl .ui-datepicker-next:hover { + left: 1px; + right: auto; +} +.ui-datepicker-rtl .ui-datepicker-buttonpane { + clear: right; +} +.ui-datepicker-rtl .ui-datepicker-buttonpane button { + float: left; +} +.ui-datepicker-rtl .ui-datepicker-buttonpane button.ui-datepicker-current { + float:right; +} +.ui-datepicker-rtl .ui-datepicker-group { + float: right; +} +.ui-datepicker-rtl .ui-datepicker-group-last .ui-datepicker-header { + border-right-width: 0; + border-left-width: 1px; +} +.ui-datepicker-rtl .ui-datepicker-group-middle .ui-datepicker-header { + border-right-width: 0; + border-left-width: 1px; +} diff --git a/themes/base/jquery.ui.dialog.css b/themes/base/jquery.ui.dialog.css index 2f523b30c..f1b25c104 100644 --- a/themes/base/jquery.ui.dialog.css +++ b/themes/base/jquery.ui.dialog.css @@ -8,15 +8,68 @@ * * http://docs.jquery.com/UI/Dialog#theming */ -.ui-dialog { position: absolute; top: 0; left: 0; padding: .2em; width: 300px; overflow: hidden; outline: 0; } -.ui-dialog .ui-dialog-titlebar { padding: .4em 1em; position: relative; } -.ui-dialog .ui-dialog-title { float: left; margin: .1em 16px .1em 0; } -.ui-dialog .ui-dialog-titlebar-close { position: absolute; right: .3em; top: 50%; width: 19px; margin: -10px 0 0 0; padding: 1px; height: 18px; } -.ui-dialog .ui-dialog-titlebar-close span { display: block; margin: 1px; } -.ui-dialog .ui-dialog-titlebar-close:hover, .ui-dialog .ui-dialog-titlebar-close:focus { padding: 0; } -.ui-dialog .ui-dialog-content { position: relative; border: 0; padding: .5em 1em; background: none; overflow: auto; zoom: 1; } -.ui-dialog .ui-dialog-buttonpane { text-align: left; border-width: 1px 0 0 0; background-image: none; margin: .5em 0 0 0; padding: .3em 1em .5em .4em; } -.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset { float: right; } -.ui-dialog .ui-dialog-buttonpane button { margin: .5em .4em .5em 0; cursor: pointer; } -.ui-dialog .ui-resizable-se { width: 14px; height: 14px; right: 3px; bottom: 3px; } -.ui-draggable .ui-dialog-titlebar { cursor: move; } +.ui-dialog { + position: absolute; + top: 0; + left: 0; + padding: .2em; + width: 300px; + overflow: hidden; + outline: 0; +} +.ui-dialog .ui-dialog-titlebar { + padding: .4em 1em; + position: relative; +} +.ui-dialog .ui-dialog-title { + float: left; + margin: .1em 16px .1em 0; +} +.ui-dialog .ui-dialog-titlebar-close { + position: absolute; + right: .3em; + top: 50%; + width: 19px; + margin: -10px 0 0 0; + padding: 1px; + height: 18px; +} +.ui-dialog .ui-dialog-titlebar-close span { + display: block; + margin: 1px; +} +.ui-dialog .ui-dialog-titlebar-close:hover, +.ui-dialog .ui-dialog-titlebar-close:focus { + padding: 0; +} +.ui-dialog .ui-dialog-content { + position: relative; + border: 0; + padding: .5em 1em; + background: none; + overflow: auto; + zoom: 1; +} +.ui-dialog .ui-dialog-buttonpane { + text-align: left; + border-width: 1px 0 0 0; + background-image: none; + margin: .5em 0 0 0; + padding: .3em 1em .5em .4em; +} +.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset { + float: right; +} +.ui-dialog .ui-dialog-buttonpane button { + margin: .5em .4em .5em 0; + cursor: pointer; +} +.ui-dialog .ui-resizable-se { + width: 14px; + height: 14px; + right: 3px; + bottom: 3px; +} +.ui-draggable .ui-dialog-titlebar { + cursor: move; +} diff --git a/themes/base/jquery.ui.menu.css b/themes/base/jquery.ui.menu.css index ea4b24e26..9357158b7 100644 --- a/themes/base/jquery.ui.menu.css +++ b/themes/base/jquery.ui.menu.css @@ -8,23 +8,71 @@ * * http://docs.jquery.com/UI/Menu#theming */ -.ui-menu { list-style:none; padding: 2px; margin: 0; display:block; outline: none; } -.ui-menu .ui-menu { margin-top: -3px; position: absolute; } -.ui-menu .ui-menu-item { margin: 0; padding: 0; zoom: 1; width: 100%; } -.ui-menu .ui-menu-divider { margin: 5px -2px 5px -2px; height: 0; font-size: 0; line-height: 0; border-width: 1px 0 0 0; } -.ui-menu .ui-menu-item a { text-decoration: none; display: block; padding: 2px .4em; line-height: 1.5; zoom: 1; font-weight: normal; } +.ui-menu { + list-style: none; + padding: 2px; + margin: 0; + display: block; + outline: none; +} +.ui-menu .ui-menu { + margin-top: -3px; + position: absolute; +} +.ui-menu .ui-menu-item { + margin: 0; + padding: 0; + zoom: 1; + width: 100%; +} +.ui-menu .ui-menu-divider { + margin: 5px -2px 5px -2px; + height: 0; + font-size: 0; + line-height: 0; + border-width: 1px 0 0 0; +} +.ui-menu .ui-menu-item a { + text-decoration: none; + display: block; + padding: 2px .4em; + line-height: 1.5; + zoom: 1; + font-weight: normal; +} .ui-menu .ui-menu-item a.ui-state-focus, -.ui-menu .ui-menu-item a.ui-state-active { font-weight: normal; margin: -1px; } +.ui-menu .ui-menu-item a.ui-state-active { + font-weight: normal; + margin: -1px; +} -.ui-menu .ui-state-disabled { font-weight: normal; margin: .4em 0 .2em; line-height: 1.5; } -.ui-menu .ui-state-disabled a { cursor: default; } +.ui-menu .ui-state-disabled { + font-weight: normal; + margin: .4em 0 .2em; + line-height: 1.5; +} +.ui-menu .ui-state-disabled a { + cursor: default; +} /* icon support */ -.ui-menu-icons { position: relative; } -.ui-menu-icons .ui-menu-item a { position: relative; padding-left: 2em; } +.ui-menu-icons { + position: relative; +} +.ui-menu-icons .ui-menu-item a { + position: relative; + padding-left: 2em; +} /* left-aligned */ -.ui-menu .ui-icon { position: absolute; top: .2em; left: .2em; } +.ui-menu .ui-icon { + position: absolute; + top: .2em; + left: .2em; +} /* right-aligned */ -.ui-menu .ui-menu-icon { position: static; float: right; } +.ui-menu .ui-menu-icon { + position: static; + float: right; +} diff --git a/themes/base/jquery.ui.progressbar.css b/themes/base/jquery.ui.progressbar.css index a8b3d7442..f042a120f 100644 --- a/themes/base/jquery.ui.progressbar.css +++ b/themes/base/jquery.ui.progressbar.css @@ -8,5 +8,12 @@ * * http://docs.jquery.com/UI/Progressbar#theming */ -.ui-progressbar { height:2em; text-align: left; overflow: hidden; } -.ui-progressbar .ui-progressbar-value {margin: -1px; height:100%; } \ No newline at end of file +.ui-progressbar { + height:2em; + text-align: left; + overflow: hidden; +} +.ui-progressbar .ui-progressbar-value { + margin: -1px; + height: 100%; +} diff --git a/themes/base/jquery.ui.resizable.css b/themes/base/jquery.ui.resizable.css index 291bdb209..89d12ef2f 100644 --- a/themes/base/jquery.ui.resizable.css +++ b/themes/base/jquery.ui.resizable.css @@ -8,14 +8,71 @@ * * http://docs.jquery.com/UI/Resizable#theming */ -.ui-resizable { position: relative;} -.ui-resizable-handle { position: absolute;font-size: 0.1px; display: block; } -.ui-resizable-disabled .ui-resizable-handle, .ui-resizable-autohide .ui-resizable-handle { display: none; } -.ui-resizable-n { cursor: n-resize; height: 7px; width: 100%; top: -5px; left: 0; } -.ui-resizable-s { cursor: s-resize; height: 7px; width: 100%; bottom: -5px; left: 0; } -.ui-resizable-e { cursor: e-resize; width: 7px; right: -5px; top: 0; height: 100%; } -.ui-resizable-w { cursor: w-resize; width: 7px; left: -5px; top: 0; height: 100%; } -.ui-resizable-se { cursor: se-resize; width: 12px; height: 12px; right: 1px; bottom: 1px; } -.ui-resizable-sw { cursor: sw-resize; width: 9px; height: 9px; left: -5px; bottom: -5px; } -.ui-resizable-nw { cursor: nw-resize; width: 9px; height: 9px; left: -5px; top: -5px; } -.ui-resizable-ne { cursor: ne-resize; width: 9px; height: 9px; right: -5px; top: -5px;} \ No newline at end of file +.ui-resizable { + position: relative; +} +.ui-resizable-handle { + position: absolute; + font-size: 0.1px; + display: block; +} +.ui-resizable-disabled .ui-resizable-handle, +.ui-resizable-autohide .ui-resizable-handle { + display: none; +} +.ui-resizable-n { + cursor: n-resize; + height: 7px; + width: 100%; + top: -5px; + left: 0; +} +.ui-resizable-s { + cursor: s-resize; + height: 7px; + width: 100%; + bottom: -5px; + left: 0; +} +.ui-resizable-e { + cursor: e-resize; + width: 7px; + right: -5px; + top: 0; + height: 100%; +} +.ui-resizable-w { + cursor: w-resize; + width: 7px; + left: -5px; + top: 0; + height: 100%; +} +.ui-resizable-se { + cursor: se-resize; + width: 12px; + height: 12px; + right: 1px; + bottom: 1px; +} +.ui-resizable-sw { + cursor: sw-resize; + width: 9px; + height: 9px; + left: -5px; + bottom: -5px; +} +.ui-resizable-nw { + cursor: nw-resize; + width: 9px; + height: 9px; + left: -5px; + top: -5px; +} +.ui-resizable-ne { + cursor: ne-resize; + width: 9px; + height: 9px; + right: -5px; + top: -5px; +} diff --git a/themes/base/jquery.ui.selectable.css b/themes/base/jquery.ui.selectable.css index e00779d7e..8c58aa336 100644 --- a/themes/base/jquery.ui.selectable.css +++ b/themes/base/jquery.ui.selectable.css @@ -8,4 +8,8 @@ * * http://docs.jquery.com/UI/Selectable#theming */ -.ui-selectable-helper { position: absolute; z-index: 100; border:1px dotted black; } +.ui-selectable-helper { + position: absolute; + z-index: 100; + border: 1px dotted black; +} diff --git a/themes/base/jquery.ui.slider.css b/themes/base/jquery.ui.slider.css index 5e7a9734f..d0ee1a00d 100644 --- a/themes/base/jquery.ui.slider.css +++ b/themes/base/jquery.ui.slider.css @@ -8,18 +8,60 @@ * * http://docs.jquery.com/UI/Slider#theming */ -.ui-slider { position: relative; text-align: left; } -.ui-slider .ui-slider-handle { position: absolute; z-index: 2; width: 1.2em; height: 1.2em; cursor: default; } -.ui-slider .ui-slider-range { position: absolute; z-index: 1; font-size: .7em; display: block; border: 0; background-position: 0 0; } +.ui-slider { + position: relative; + text-align: left; +} +.ui-slider .ui-slider-handle { + position: absolute; + z-index: 2; + width: 1.2em; + height: 1.2em; + cursor: default; +} +.ui-slider .ui-slider-range { + position: absolute; + z-index: 1; + font-size: .7em; + display: block; + border: 0; + background-position: 0 0; +} -.ui-slider-horizontal { height: .8em; } -.ui-slider-horizontal .ui-slider-handle { top: -.3em; margin-left: -.6em; } -.ui-slider-horizontal .ui-slider-range { top: 0; height: 100%; } -.ui-slider-horizontal .ui-slider-range-min { left: 0; } -.ui-slider-horizontal .ui-slider-range-max { right: 0; } +.ui-slider-horizontal { + height: .8em; +} +.ui-slider-horizontal .ui-slider-handle { + top: -.3em; + margin-left: -.6em; +} +.ui-slider-horizontal .ui-slider-range { + top: 0; + height: 100%; +} +.ui-slider-horizontal .ui-slider-range-min { + left: 0; +} +.ui-slider-horizontal .ui-slider-range-max { + right: 0; +} -.ui-slider-vertical { width: .8em; height: 100px; } -.ui-slider-vertical .ui-slider-handle { left: -.3em; margin-left: 0; margin-bottom: -.6em; } -.ui-slider-vertical .ui-slider-range { left: 0; width: 100%; } -.ui-slider-vertical .ui-slider-range-min { bottom: 0; } -.ui-slider-vertical .ui-slider-range-max { top: 0; } \ No newline at end of file +.ui-slider-vertical { + width: .8em; + height: 100px; +} +.ui-slider-vertical .ui-slider-handle { + left: -.3em; + margin-left: 0; + margin-bottom: -.6em; +} +.ui-slider-vertical .ui-slider-range { + left: 0; + width: 100%; +} +.ui-slider-vertical .ui-slider-range-min { + bottom: 0; +} +.ui-slider-vertical .ui-slider-range-max { + top: 0; +} diff --git a/themes/base/jquery.ui.spinner.css b/themes/base/jquery.ui.spinner.css index 95f865b92..27125d914 100644 --- a/themes/base/jquery.ui.spinner.css +++ b/themes/base/jquery.ui.spinner.css @@ -8,16 +8,57 @@ * * http://docs.jquery.com/UI/Spinner#theming */ -.ui-spinner { position:relative; display: inline-block; overflow: hidden; padding: 0; vertical-align: middle; } -.ui-spinner-input { border: none; background: none; padding: 0; margin: .2em 0; vertical-align: middle; margin-left: .4em; margin-right: 22px; } -.ui-spinner-button { width: 16px; height: 50%; font-size: .5em; padding: 0; margin: 0; text-align: center; position: absolute; cursor: default; display: block; overflow: hidden; right: 0; } -.ui-spinner a.ui-spinner-button { border-top: none; border-bottom: none; border-right: none; } /* more specificity required here to overide default borders */ -.ui-spinner .ui-icon { position: absolute; margin-top: -8px; top: 50%; left: 0; } /* vertical centre icon */ -.ui-spinner-up { top: 0; } -.ui-spinner-down { bottom: 0; } +.ui-spinner { + position: relative; + display: inline-block; + overflow: hidden; + padding: 0; + vertical-align: middle; +} +.ui-spinner-input { + border: none; + background: none; + padding: 0; + margin: .2em 0; + vertical-align: middle; + margin-left: .4em; + margin-right: 22px; +} +.ui-spinner-button { + width: 16px; + height: 50%; + font-size: .5em; + padding: 0; + margin: 0; + text-align: center; + position: absolute; + cursor: default; + display: block; + overflow: hidden; + right: 0; +} +/* more specificity required here to overide default borders */ +.ui-spinner a.ui-spinner-button { + border-top: none; + border-bottom: none; + border-right: none; +} +/* vertical centre icon */ +.ui-spinner .ui-icon { + position: absolute; + margin-top: -8px; + top: 50%; + left: 0; +} +.ui-spinner-up { + top: 0; +} +.ui-spinner-down { + bottom: 0; +} /* TR overrides */ .ui-spinner .ui-icon-triangle-1-s { /* need to fix icons sprite */ - background-position:-65px -16px; + background-position: -65px -16px; } diff --git a/themes/base/jquery.ui.tabs.css b/themes/base/jquery.ui.tabs.css index 405b6932a..f4d82f038 100644 --- a/themes/base/jquery.ui.tabs.css +++ b/themes/base/jquery.ui.tabs.css @@ -8,11 +8,46 @@ * * http://docs.jquery.com/UI/Tabs#theming */ -.ui-tabs { position: relative; padding: .2em; zoom: 1; } /* position: relative prevents IE scroll bug (element with position: relative inside container with overflow: auto appear as "fixed") */ -.ui-tabs .ui-tabs-nav { margin: 0; padding: .2em .2em 0; } -.ui-tabs .ui-tabs-nav li { list-style: none; float: left; position: relative; top: 0; margin: 1px .2em 0 0; border-bottom: 0; padding: 0; white-space: nowrap; } -.ui-tabs .ui-tabs-nav li a { float: left; padding: .5em 1em; text-decoration: none; } -.ui-tabs .ui-tabs-nav li.ui-tabs-active { margin-bottom: -1px; padding-bottom: 1px; } -.ui-tabs .ui-tabs-nav li.ui-tabs-active a, .ui-tabs .ui-tabs-nav li.ui-state-disabled a, .ui-tabs .ui-tabs-nav li.ui-tabs-loading a { cursor: text; } -.ui-tabs .ui-tabs-nav li a, .ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-active a { cursor: pointer; } /* first selector in group seems obsolete, but required to overcome bug in Opera applying cursor: text overall if defined elsewhere... */ -.ui-tabs .ui-tabs-panel { display: block; border-width: 0; padding: 1em 1.4em; background: none; } +.ui-tabs { + position: relative;/* position: relative prevents IE scroll bug (element with position: relative inside container with overflow: auto appear as "fixed") */ + padding: .2em; + zoom: 1; +} +.ui-tabs .ui-tabs-nav { + margin: 0; + padding: .2em .2em 0; +} +.ui-tabs .ui-tabs-nav li { + list-style: none; + float: left; + position: relative; + top: 0; + margin: 1px .2em 0 0; + border-bottom: 0; + padding: 0; + white-space: nowrap; +} +.ui-tabs .ui-tabs-nav li a { + float: left; + padding: .5em 1em; + text-decoration: none; +} +.ui-tabs .ui-tabs-nav li.ui-tabs-active { + margin-bottom: -1px; + padding-bottom: 1px; +} +.ui-tabs .ui-tabs-nav li.ui-tabs-active a, +.ui-tabs .ui-tabs-nav li.ui-state-disabled a, +.ui-tabs .ui-tabs-nav li.ui-tabs-loading a { + cursor: text; +} +.ui-tabs .ui-tabs-nav li a, /* first selector in group seems obsolete, but required to overcome bug in Opera applying cursor: text overall if defined elsewhere... */ +.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-active a { + cursor: pointer; +} +.ui-tabs .ui-tabs-panel { + display: block; + border-width: 0; + padding: 1em 1.4em; + background: none; +} diff --git a/themes/base/jquery.ui.theme.css b/themes/base/jquery.ui.theme.css index 67b74dcd7..459d1a212 100644 --- a/themes/base/jquery.ui.theme.css +++ b/themes/base/jquery.ui.theme.css @@ -14,47 +14,172 @@ /* Component containers ----------------------------------*/ -.ui-widget { font-family: Verdana,Arial,sans-serif/*{ffDefault}*/; font-size: 1.1em/*{fsDefault}*/; } -.ui-widget .ui-widget { font-size: 1em; } -.ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button { font-family: Verdana,Arial,sans-serif/*{ffDefault}*/; font-size: 1em; } -.ui-widget-content { border: 1px solid #aaaaaa/*{borderColorContent}*/; background: #ffffff/*{bgColorContent}*/ url(images/ui-bg_flat_75_ffffff_40x100.png)/*{bgImgUrlContent}*/ 50%/*{bgContentXPos}*/ 50%/*{bgContentYPos}*/ repeat-x/*{bgContentRepeat}*/; color: #222222/*{fcContent}*/; } -.ui-widget-content a { color: #222222/*{fcContent}*/; } -.ui-widget-header { border: 1px solid #aaaaaa/*{borderColorHeader}*/; background: #cccccc/*{bgColorHeader}*/ url(images/ui-bg_highlight-soft_75_cccccc_1x100.png)/*{bgImgUrlHeader}*/ 50%/*{bgHeaderXPos}*/ 50%/*{bgHeaderYPos}*/ repeat-x/*{bgHeaderRepeat}*/; color: #222222/*{fcHeader}*/; font-weight: bold; } +.ui-widget { + font-family: Verdana,Arial,sans-serif/*{ffDefault}*/; + font-size: 1.1em/*{fsDefault}*/; +} +.ui-widget .ui-widget { + font-size: 1em; +} +.ui-widget input, +.ui-widget select, +.ui-widget textarea, +.ui-widget button { + font-family: Verdana,Arial,sans-serif/*{ffDefault}*/; + font-size: 1em; +} +.ui-widget-content { + border: 1px solid #aaaaaa/*{borderColorContent}*/; + background: #ffffff/*{bgColorContent}*/ url(images/ui-bg_flat_75_ffffff_40x100.png)/*{bgImgUrlContent}*/ 50%/*{bgContentXPos}*/ 50%/*{bgContentYPos}*/ repeat-x/*{bgContentRepeat}*/; + color: #222222/*{fcContent}*/; +} +.ui-widget-content a { + color: #222222/*{fcContent}*/; +} +.ui-widget-header { + border: 1px solid #aaaaaa/*{borderColorHeader}*/; + background: #cccccc/*{bgColorHeader}*/ url(images/ui-bg_highlight-soft_75_cccccc_1x100.png)/*{bgImgUrlHeader}*/ 50%/*{bgHeaderXPos}*/ 50%/*{bgHeaderYPos}*/ repeat-x/*{bgHeaderRepeat}*/; + color: #222222/*{fcHeader}*/; + font-weight: bold; +} .ui-widget-header a { color: #222222/*{fcHeader}*/; } /* Interaction states ----------------------------------*/ -.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default { border: 1px solid #d3d3d3/*{borderColorDefault}*/; background: #e6e6e6/*{bgColorDefault}*/ url(images/ui-bg_glass_75_e6e6e6_1x400.png)/*{bgImgUrlDefault}*/ 50%/*{bgDefaultXPos}*/ 50%/*{bgDefaultYPos}*/ repeat-x/*{bgDefaultRepeat}*/; font-weight: normal/*{fwDefault}*/; color: #555555/*{fcDefault}*/; } -.ui-state-default a, .ui-state-default a:link, .ui-state-default a:visited { color: #555555/*{fcDefault}*/; text-decoration: none; } -.ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus { border: 1px solid #999999/*{borderColorHover}*/; background: #dadada/*{bgColorHover}*/ url(images/ui-bg_glass_75_dadada_1x400.png)/*{bgImgUrlHover}*/ 50%/*{bgHoverXPos}*/ 50%/*{bgHoverYPos}*/ repeat-x/*{bgHoverRepeat}*/; font-weight: normal/*{fwDefault}*/; color: #212121/*{fcHover}*/; } -.ui-state-hover a, .ui-state-hover a:hover, .ui-state-hover a:link, .ui-state-hover a:visited { color: #212121/*{fcHover}*/; text-decoration: none; } -.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active { border: 1px solid #aaaaaa/*{borderColorActive}*/; background: #ffffff/*{bgColorActive}*/ url(images/ui-bg_glass_65_ffffff_1x400.png)/*{bgImgUrlActive}*/ 50%/*{bgActiveXPos}*/ 50%/*{bgActiveYPos}*/ repeat-x/*{bgActiveRepeat}*/; font-weight: normal/*{fwDefault}*/; color: #212121/*{fcActive}*/; } -.ui-state-active a, .ui-state-active a:link, .ui-state-active a:visited { color: #212121/*{fcActive}*/; text-decoration: none; } +.ui-state-default, +.ui-widget-content .ui-state-default, +.ui-widget-header .ui-state-default { + border: 1px solid #d3d3d3/*{borderColorDefault}*/; + background: #e6e6e6/*{bgColorDefault}*/ url(images/ui-bg_glass_75_e6e6e6_1x400.png)/*{bgImgUrlDefault}*/ 50%/*{bgDefaultXPos}*/ 50%/*{bgDefaultYPos}*/ repeat-x/*{bgDefaultRepeat}*/; + font-weight: normal/*{fwDefault}*/; + color: #555555/*{fcDefault}*/; +} +.ui-state-default a, +.ui-state-default a:link, +.ui-state-default a:visited { + color: #555555/*{fcDefault}*/; + text-decoration: none; +} +.ui-state-hover, +.ui-widget-content .ui-state-hover, +.ui-widget-header .ui-state-hover, +.ui-state-focus, +.ui-widget-content .ui-state-focus, +.ui-widget-header .ui-state-focus { + border: 1px solid #999999/*{borderColorHover}*/; + background: #dadada/*{bgColorHover}*/ url(images/ui-bg_glass_75_dadada_1x400.png)/*{bgImgUrlHover}*/ 50%/*{bgHoverXPos}*/ 50%/*{bgHoverYPos}*/ repeat-x/*{bgHoverRepeat}*/; + font-weight: normal/*{fwDefault}*/; + color: #212121/*{fcHover}*/; +} +.ui-state-hover a, +.ui-state-hover a:hover, +.ui-state-hover a:link, +.ui-state-hover a:visited { + color: #212121/*{fcHover}*/; + text-decoration: none; +} +.ui-state-active, +.ui-widget-content .ui-state-active, +.ui-widget-header .ui-state-active { + border: 1px solid #aaaaaa/*{borderColorActive}*/; + background: #ffffff/*{bgColorActive}*/ url(images/ui-bg_glass_65_ffffff_1x400.png)/*{bgImgUrlActive}*/ 50%/*{bgActiveXPos}*/ 50%/*{bgActiveYPos}*/ repeat-x/*{bgActiveRepeat}*/; + font-weight: normal/*{fwDefault}*/; + color: #212121/*{fcActive}*/; +} +.ui-state-active a, +.ui-state-active a:link, +.ui-state-active a:visited { + color: #212121/*{fcActive}*/; + text-decoration: none; +} /* Interaction Cues ----------------------------------*/ -.ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight {border: 1px solid #fcefa1/*{borderColorHighlight}*/; background: #fbf9ee/*{bgColorHighlight}*/ url(images/ui-bg_glass_55_fbf9ee_1x400.png)/*{bgImgUrlHighlight}*/ 50%/*{bgHighlightXPos}*/ 50%/*{bgHighlightYPos}*/ repeat-x/*{bgHighlightRepeat}*/; color: #363636/*{fcHighlight}*/; } -.ui-state-highlight a, .ui-widget-content .ui-state-highlight a,.ui-widget-header .ui-state-highlight a { color: #363636/*{fcHighlight}*/; } -.ui-state-error, .ui-widget-content .ui-state-error, .ui-widget-header .ui-state-error {border: 1px solid #cd0a0a/*{borderColorError}*/; background: #fef1ec/*{bgColorError}*/ url(images/ui-bg_glass_95_fef1ec_1x400.png)/*{bgImgUrlError}*/ 50%/*{bgErrorXPos}*/ 50%/*{bgErrorYPos}*/ repeat-x/*{bgErrorRepeat}*/; color: #cd0a0a/*{fcError}*/; } -.ui-state-error a, .ui-widget-content .ui-state-error a, .ui-widget-header .ui-state-error a { color: #cd0a0a/*{fcError}*/; } -.ui-state-error-text, .ui-widget-content .ui-state-error-text, .ui-widget-header .ui-state-error-text { color: #cd0a0a/*{fcError}*/; } -.ui-priority-primary, .ui-widget-content .ui-priority-primary, .ui-widget-header .ui-priority-primary { font-weight: bold; } -.ui-priority-secondary, .ui-widget-content .ui-priority-secondary, .ui-widget-header .ui-priority-secondary { opacity: .7; filter:Alpha(Opacity=70); font-weight: normal; } -.ui-state-disabled, .ui-widget-content .ui-state-disabled, .ui-widget-header .ui-state-disabled { opacity: .35; filter:Alpha(Opacity=35); background-image: none; } -.ui-state-disabled .ui-icon { filter:Alpha(Opacity=35); } /* For IE8 - See #6059 */ +.ui-state-highlight, +.ui-widget-content .ui-state-highlight, +.ui-widget-header .ui-state-highlight { + border: 1px solid #fcefa1/*{borderColorHighlight}*/; + background: #fbf9ee/*{bgColorHighlight}*/ url(images/ui-bg_glass_55_fbf9ee_1x400.png)/*{bgImgUrlHighlight}*/ 50%/*{bgHighlightXPos}*/ 50%/*{bgHighlightYPos}*/ repeat-x/*{bgHighlightRepeat}*/; + color: #363636/*{fcHighlight}*/; +} +.ui-state-highlight a, +.ui-widget-content .ui-state-highlight a, +.ui-widget-header .ui-state-highlight a { + color: #363636/*{fcHighlight}*/; +} +.ui-state-error, +.ui-widget-content .ui-state-error, +.ui-widget-header .ui-state-error { + border: 1px solid #cd0a0a/*{borderColorError}*/; + background: #fef1ec/*{bgColorError}*/ url(images/ui-bg_glass_95_fef1ec_1x400.png)/*{bgImgUrlError}*/ 50%/*{bgErrorXPos}*/ 50%/*{bgErrorYPos}*/ repeat-x/*{bgErrorRepeat}*/; + color: #cd0a0a/*{fcError}*/; +} +.ui-state-error a, +.ui-widget-content .ui-state-error a, +.ui-widget-header .ui-state-error a { + color: #cd0a0a/*{fcError}*/; +} +.ui-state-error-text, +.ui-widget-content .ui-state-error-text, +.ui-widget-header .ui-state-error-text { + color: #cd0a0a/*{fcError}*/; +} +.ui-priority-primary, +.ui-widget-content .ui-priority-primary, +.ui-widget-header .ui-priority-primary { + font-weight: bold; +} +.ui-priority-secondary, +.ui-widget-content .ui-priority-secondary, +.ui-widget-header .ui-priority-secondary { + opacity: .7; + filter:Alpha(Opacity=70); + font-weight: normal; +} +.ui-state-disabled, +.ui-widget-content .ui-state-disabled, +.ui-widget-header .ui-state-disabled { + opacity: .35; + filter:Alpha(Opacity=35); + background-image: none; +} +.ui-state-disabled .ui-icon { + filter:Alpha(Opacity=35); /* For IE8 - See #6059 */ +} /* Icons ----------------------------------*/ /* states and images */ -.ui-icon { width: 16px; height: 16px; background-image: url(images/ui-icons_222222_256x240.png)/*{iconsContent}*/; background-position: 16px 16px; } -.ui-widget-content .ui-icon {background-image: url(images/ui-icons_222222_256x240.png)/*{iconsContent}*/; } -.ui-widget-header .ui-icon {background-image: url(images/ui-icons_222222_256x240.png)/*{iconsHeader}*/; } -.ui-state-default .ui-icon { background-image: url(images/ui-icons_888888_256x240.png)/*{iconsDefault}*/; } -.ui-state-hover .ui-icon, .ui-state-focus .ui-icon {background-image: url(images/ui-icons_454545_256x240.png)/*{iconsHover}*/; } -.ui-state-active .ui-icon {background-image: url(images/ui-icons_454545_256x240.png)/*{iconsActive}*/; } -.ui-state-highlight .ui-icon {background-image: url(images/ui-icons_2e83ff_256x240.png)/*{iconsHighlight}*/; } -.ui-state-error .ui-icon, .ui-state-error-text .ui-icon {background-image: url(images/ui-icons_cd0a0a_256x240.png)/*{iconsError}*/; } +.ui-icon { + width: 16px; + height: 16px; + background-image: url(images/ui-icons_222222_256x240.png)/*{iconsContent}*/; + background-position: 16px 16px; +} +.ui-widget-content .ui-icon { + background-image: url(images/ui-icons_222222_256x240.png)/*{iconsContent}*/; +} +.ui-widget-header .ui-icon { + background-image: url(images/ui-icons_222222_256x240.png)/*{iconsHeader}*/; +} +.ui-state-default .ui-icon { + background-image: url(images/ui-icons_888888_256x240.png)/*{iconsDefault}*/; +} +.ui-state-hover .ui-icon, +.ui-state-focus .ui-icon { + background-image: url(images/ui-icons_454545_256x240.png)/*{iconsHover}*/; +} +.ui-state-active .ui-icon { + background-image: url(images/ui-icons_454545_256x240.png)/*{iconsActive}*/; +} +.ui-state-highlight .ui-icon { + background-image: url(images/ui-icons_2e83ff_256x240.png)/*{iconsHighlight}*/; +} +.ui-state-error .ui-icon, +.ui-state-error-text .ui-icon { + background-image: url(images/ui-icons_cd0a0a_256x240.png)/*{iconsError}*/; +} /* positioning */ .ui-icon-carat-1-n { background-position: 0 0; } @@ -238,11 +363,55 @@ ----------------------------------*/ /* Corner radius */ -.ui-corner-all, .ui-corner-top, .ui-corner-left, .ui-corner-tl { -moz-border-radius-topleft: 4px/*{cornerRadius}*/; -webkit-border-top-left-radius: 4px/*{cornerRadius}*/; -khtml-border-top-left-radius: 4px/*{cornerRadius}*/; border-top-left-radius: 4px/*{cornerRadius}*/; } -.ui-corner-all, .ui-corner-top, .ui-corner-right, .ui-corner-tr { -moz-border-radius-topright: 4px/*{cornerRadius}*/; -webkit-border-top-right-radius: 4px/*{cornerRadius}*/; -khtml-border-top-right-radius: 4px/*{cornerRadius}*/; border-top-right-radius: 4px/*{cornerRadius}*/; } -.ui-corner-all, .ui-corner-bottom, .ui-corner-left, .ui-corner-bl { -moz-border-radius-bottomleft: 4px/*{cornerRadius}*/; -webkit-border-bottom-left-radius: 4px/*{cornerRadius}*/; -khtml-border-bottom-left-radius: 4px/*{cornerRadius}*/; border-bottom-left-radius: 4px/*{cornerRadius}*/; } -.ui-corner-all, .ui-corner-bottom, .ui-corner-right, .ui-corner-br { -moz-border-radius-bottomright: 4px/*{cornerRadius}*/; -webkit-border-bottom-right-radius: 4px/*{cornerRadius}*/; -khtml-border-bottom-right-radius: 4px/*{cornerRadius}*/; border-bottom-right-radius: 4px/*{cornerRadius}*/; } +.ui-corner-all, +.ui-corner-top, +.ui-corner-left, +.ui-corner-tl { + -moz-border-radius-topleft: 4px/*{cornerRadius}*/; + -webkit-border-top-left-radius: 4px/*{cornerRadius}*/; + -khtml-border-top-left-radius: 4px/*{cornerRadius}*/; + border-top-left-radius: 4px/*{cornerRadius}*/; +} +.ui-corner-all, +.ui-corner-top, +.ui-corner-right, +.ui-corner-tr { + -moz-border-radius-topright: 4px/*{cornerRadius}*/; + -webkit-border-top-right-radius: 4px/*{cornerRadius}*/; + -khtml-border-top-right-radius: 4px/*{cornerRadius}*/; + border-top-right-radius: 4px/*{cornerRadius}*/; +} +.ui-corner-all, +.ui-corner-bottom, +.ui-corner-left, +.ui-corner-bl { + -moz-border-radius-bottomleft: 4px/*{cornerRadius}*/; + -webkit-border-bottom-left-radius: 4px/*{cornerRadius}*/; + -khtml-border-bottom-left-radius: 4px/*{cornerRadius}*/; + border-bottom-left-radius: 4px/*{cornerRadius}*/; +} +.ui-corner-all, +.ui-corner-bottom, +.ui-corner-right, +.ui-corner-br { + -moz-border-radius-bottomright: 4px/*{cornerRadius}*/; + -webkit-border-bottom-right-radius: 4px/*{cornerRadius}*/; + -khtml-border-bottom-right-radius: 4px/*{cornerRadius}*/; + border-bottom-right-radius: 4px/*{cornerRadius}*/; +} /* Overlays */ -.ui-widget-overlay { background: #aaaaaa/*{bgColorOverlay}*/ url(images/ui-bg_flat_0_aaaaaa_40x100.png)/*{bgImgUrlOverlay}*/ 50%/*{bgOverlayXPos}*/ 50%/*{bgOverlayYPos}*/ repeat-x/*{bgOverlayRepeat}*/; opacity: .3;filter:Alpha(Opacity=30)/*{opacityOverlay}*/; } -.ui-widget-shadow { margin: -8px/*{offsetTopShadow}*/ 0 0 -8px/*{offsetLeftShadow}*/; padding: 8px/*{thicknessShadow}*/; background: #aaaaaa/*{bgColorShadow}*/ url(images/ui-bg_flat_0_aaaaaa_40x100.png)/*{bgImgUrlShadow}*/ 50%/*{bgShadowXPos}*/ 50%/*{bgShadowYPos}*/ repeat-x/*{bgShadowRepeat}*/; opacity: .3;filter:Alpha(Opacity=30)/*{opacityShadow}*/; -moz-border-radius: 8px/*{cornerRadiusShadow}*/; -khtml-border-radius: 8px/*{cornerRadiusShadow}*/; -webkit-border-radius: 8px/*{cornerRadiusShadow}*/; border-radius: 8px/*{cornerRadiusShadow}*/; } +.ui-widget-overlay { + background: #aaaaaa/*{bgColorOverlay}*/ url(images/ui-bg_flat_0_aaaaaa_40x100.png)/*{bgImgUrlOverlay}*/ 50%/*{bgOverlayXPos}*/ 50%/*{bgOverlayYPos}*/ repeat-x/*{bgOverlayRepeat}*/; + opacity: .3; filter:Alpha(Opacity=30)/*{opacityOverlay}*/; +} +.ui-widget-shadow { + margin: -8px/*{offsetTopShadow}*/ 0 0 -8px/*{offsetLeftShadow}*/; + padding: 8px/*{thicknessShadow}*/; + background: #aaaaaa/*{bgColorShadow}*/ url(images/ui-bg_flat_0_aaaaaa_40x100.png)/*{bgImgUrlShadow}*/ 50%/*{bgShadowXPos}*/ 50%/*{bgShadowYPos}*/ repeat-x/*{bgShadowRepeat}*/; + opacity: .3; filter:Alpha(Opacity=30)/*{opacityShadow}*/; + -moz-border-radius: 8px/*{cornerRadiusShadow}*/; + -khtml-border-radius: 8px/*{cornerRadiusShadow}*/; + -webkit-border-radius: 8px/*{cornerRadiusShadow}*/; + border-radius: 8px/*{cornerRadiusShadow}*/; +} diff --git a/themes/base/jquery.ui.tooltip.css b/themes/base/jquery.ui.tooltip.css index b7efbe10c..5330554d9 100644 --- a/themes/base/jquery.ui.tooltip.css +++ b/themes/base/jquery.ui.tooltip.css @@ -14,4 +14,6 @@ -webkit-box-shadow: 0 0 5px #aaa; box-shadow: 0 0 5px #aaa; } -body .ui-tooltip { border-width: 2px; } +body .ui-tooltip { + border-width: 2px; +} From 3c6c22b179787a118538f70c0cd56a778a16adba Mon Sep 17 00:00:00 2001 From: Mike Sherov Date: Tue, 20 Nov 2012 08:07:03 -0500 Subject: [PATCH 19/28] CSS: remove spaces from opacity filters so themeRoller can replace properly --- themes/base/jquery.ui.theme.css | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/themes/base/jquery.ui.theme.css b/themes/base/jquery.ui.theme.css index 459d1a212..89f03aa86 100644 --- a/themes/base/jquery.ui.theme.css +++ b/themes/base/jquery.ui.theme.css @@ -403,13 +403,15 @@ /* Overlays */ .ui-widget-overlay { background: #aaaaaa/*{bgColorOverlay}*/ url(images/ui-bg_flat_0_aaaaaa_40x100.png)/*{bgImgUrlOverlay}*/ 50%/*{bgOverlayXPos}*/ 50%/*{bgOverlayYPos}*/ repeat-x/*{bgOverlayRepeat}*/; - opacity: .3; filter:Alpha(Opacity=30)/*{opacityOverlay}*/; + /* no space between ".3;" and "filter" because themeRoller looks back to the first space for replacement */ + opacity: .3;filter:Alpha(Opacity=30)/*{opacityOverlay}*/; } .ui-widget-shadow { margin: -8px/*{offsetTopShadow}*/ 0 0 -8px/*{offsetLeftShadow}*/; padding: 8px/*{thicknessShadow}*/; background: #aaaaaa/*{bgColorShadow}*/ url(images/ui-bg_flat_0_aaaaaa_40x100.png)/*{bgImgUrlShadow}*/ 50%/*{bgShadowXPos}*/ 50%/*{bgShadowYPos}*/ repeat-x/*{bgShadowRepeat}*/; - opacity: .3; filter:Alpha(Opacity=30)/*{opacityShadow}*/; + /* no space between ".3;" and "filter" because themeRoller looks back to the first space for replacement */ + opacity: .3;filter:Alpha(Opacity=30)/*{opacityShadow}*/; -moz-border-radius: 8px/*{cornerRadiusShadow}*/; -khtml-border-radius: 8px/*{cornerRadiusShadow}*/; -webkit-border-radius: 8px/*{cornerRadiusShadow}*/; From c348f2890c3b44d81b54ae9a069152943a2da7e7 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Scott=20Gonz=C3=A1lez?= Date: Tue, 20 Nov 2012 12:52:26 -0500 Subject: [PATCH 20/28] Button tests: Whitespace. --- tests/unit/button/button.html | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/tests/unit/button/button.html b/tests/unit/button/button.html index 8c9335aeb..388209991 100644 --- a/tests/unit/button/button.html +++ b/tests/unit/button/button.html @@ -60,12 +60,12 @@
-
- - - -
-
​ +
+ + + +
+ From f13b5dfa7fdb480b818cfbf07e35088460e7b5c9 Mon Sep 17 00:00:00 2001 From: Mike Sherov Date: Wed, 21 Nov 2012 08:33:43 -0500 Subject: [PATCH 21/28] Button: add blur event to buttons. Fixes #8559 - Button: Button doesn't remove active state when using keyboard. --- tests/unit/button/button_events.js | 10 ++++++++++ ui/jquery.ui.button.js | 2 +- 2 files changed, 11 insertions(+), 1 deletion(-) diff --git a/tests/unit/button/button_events.js b/tests/unit/button/button_events.js index ad83101d0..bb2cb041c 100644 --- a/tests/unit/button/button_events.js +++ b/tests/unit/button/button_events.js @@ -13,4 +13,14 @@ test("buttonset works with single-quote named elements (#7505)", function() { }).click(); }); +test( "when button loses focus, ensure active state is removed (#8559)", function() { + expect( 1 ); + + $("#button").button().keypress( function() { + $("#button").blur( function() { + ok( !$("#button").is(".ui-state-active"), "button loses active state appropriately" ); + }).blur(); + }).focus().simulate( "keydown", { keyCode: $.ui.keyCode.ENTER } ).simulate( "keypress", { keyCode: $.ui.keyCode.ENTER } ); +}); + })(jQuery); diff --git a/ui/jquery.ui.button.js b/ui/jquery.ui.button.js index 508a0424a..3decc2331 100644 --- a/ui/jquery.ui.button.js +++ b/ui/jquery.ui.button.js @@ -193,7 +193,7 @@ $.widget( "ui.button", { $( this ).addClass( "ui-state-active" ); } }) - .bind( "keyup" + this.eventNamespace, function() { + .bind( "keyup" + this.eventNamespace + " blur" + this.eventNamespace, function() { $( this ).removeClass( "ui-state-active" ); }); From cb748b4a6f32aa5748d6777e7871c96f70ad2207 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Samuel=20Bov=C3=A9e?= Date: Fri, 16 Nov 2012 12:47:22 +0100 Subject: [PATCH 22/28] Slider: factorize code with Widget method call. Fixed #8772 - Wrong slider UI state when disabled at init --- tests/unit/slider/slider_methods.js | 8 ++++---- ui/jquery.ui.slider.js | 8 +++----- 2 files changed, 7 insertions(+), 9 deletions(-) diff --git a/tests/unit/slider/slider_methods.js b/tests/unit/slider/slider_methods.js index 11d679845..83e78b855 100644 --- a/tests/unit/slider/slider_methods.js +++ b/tests/unit/slider/slider_methods.js @@ -41,10 +41,10 @@ test("enable", function() { equal(actual, expected, 'enable is chainable'); el = $('
').slider({ disabled: true }); - ok(el.hasClass('ui-disabled'), 'slider has ui-disabled class before enable method call'); + ok(el.hasClass('ui-state-disabled'), 'slider has ui-state-disabled class before enable method call'); ok(el.hasClass('ui-slider-disabled'), 'slider has ui-slider-disabled class before enable method call'); el.slider('enable'); - ok(!el.hasClass('ui-disabled'), 'slider does not have ui-disabled class after enable method call'); + ok(!el.hasClass('ui-state-disabled'), 'slider does not have ui-state-disabled class after enable method call'); ok(!el.hasClass('ui-slider-disabled'), 'slider does not have ui-slider-disabled class after enable method call'); }); @@ -56,10 +56,10 @@ test("disable", function() { equal(actual, expected, 'disable is chainable'); el = $('
').slider({ disabled: false }); - ok(!el.hasClass('ui-disabled'), 'slider does not have ui-disabled class before disabled method call'); + ok(!el.hasClass('ui-state-disabled'), 'slider does not have ui-state-disabled class before disabled method call'); ok(!el.hasClass('ui-slider-disabled'), 'slider does not have ui-slider-disabled class before disable method call'); el.slider('disable'); - ok(el.hasClass('ui-disabled'), 'slider has ui-disabled class after disable method call'); + ok(el.hasClass('ui-state-disabled'), 'slider has ui-state-disabled class after disable method call'); ok(el.hasClass('ui-slider-disabled'), 'slider has ui-slider-disabled class after disable method call'); }); diff --git a/ui/jquery.ui.slider.js b/ui/jquery.ui.slider.js index 90de25316..d9fc1b132 100644 --- a/ui/jquery.ui.slider.js +++ b/ui/jquery.ui.slider.js @@ -54,8 +54,7 @@ $.widget( "ui.slider", $.ui.mouse, { " ui-slider-" + this.orientation + " ui-widget" + " ui-widget-content" + - " ui-corner-all" + - ( o.disabled ? " ui-slider-disabled ui-disabled" : "" ) ); + " ui-corner-all"); this.range = $([]); @@ -116,6 +115,8 @@ $.widget( "ui.slider", $.ui.mouse, { $( this ).data( "ui-slider-handle-index", i ); }); + this._setOption( "disabled", o.disabled ); + this._on( this.handles, { keydown: function( event ) { var allowed, curVal, newVal, step, @@ -205,7 +206,6 @@ $.widget( "ui.slider", $.ui.mouse, { .removeClass( "ui-slider" + " ui-slider-horizontal" + " ui-slider-vertical" + - " ui-slider-disabled" + " ui-widget" + " ui-widget-content" + " ui-corner-all" ); @@ -480,10 +480,8 @@ $.widget( "ui.slider", $.ui.mouse, { this.handles.filter( ".ui-state-focus" ).blur(); this.handles.removeClass( "ui-state-hover" ); this.handles.prop( "disabled", true ); - this.element.addClass( "ui-disabled" ); } else { this.handles.prop( "disabled", false ); - this.element.removeClass( "ui-disabled" ); } break; case "orientation": From 93abe02b6052143fac30393291da3fc254bde996 Mon Sep 17 00:00:00 2001 From: TJ VanToll Date: Mon, 19 Nov 2012 15:42:28 -0500 Subject: [PATCH 23/28] Button: Fixing handling of the disabled options on refresh method calls. Fixed #8828 - Button: Refresh does not re-enable disabled button. --- tests/unit/button/button_methods.js | 36 +++++++++++++++++++++++++++++ tests/unit/button/button_tickets.js | 8 ------- ui/jquery.ui.button.js | 4 +++- 3 files changed, 39 insertions(+), 9 deletions(-) diff --git a/tests/unit/button/button_methods.js b/tests/unit/button/button_methods.js index 6a305d654..c53444005 100644 --- a/tests/unit/button/button_methods.js +++ b/tests/unit/button/button_methods.js @@ -13,4 +13,40 @@ test("destroy", function() { }); }); +test( "refresh: Ensure disabled state is preserved correctly.", function() { + expect( 8 ); + + var element = $( "" ); + element.button({ disabled: true }).button( "refresh" ); + ok( element.button( "option", "disabled" ), "Anchor button should remain disabled after refresh" ); //See #8237 + + element = $( "
" ); + element.button({ disabled: true }).button( "refresh" ); + ok( element.button( "option", "disabled" ), "
buttons should remain disabled after refresh" ); + + element = $( "" ); + element.button( { disabled: true} ).button( "refresh" ); + ok( element.button( "option", "disabled" ), "" ); + element.button( { disabled: true} ).prop( "disabled", false ).button( "refresh" ); + ok( !element.button( "option", "disabled" ), "Changing a + + + +
+

Indeterminate progress bar and switching between determinate and indeterminate styles.

+
+ + diff --git a/demos/progressbar/index.html b/demos/progressbar/index.html index 5080520c2..df3483816 100644 --- a/demos/progressbar/index.html +++ b/demos/progressbar/index.html @@ -10,6 +10,7 @@
  • Default functionality
  • Animated
  • Resizable progressbar
    • +
  • Indeterminate
    • diff --git a/tests/unit/progressbar/progressbar_events.js b/tests/unit/progressbar/progressbar_events.js index bb0d3ca5c..fe05182a1 100644 --- a/tests/unit/progressbar/progressbar_events.js +++ b/tests/unit/progressbar/progressbar_events.js @@ -23,7 +23,7 @@ test( "change", function() { }); test( "complete", function() { - expect( 3 ); + expect( 4 ); var value, changes = 0, element = $( "#progressbar" ).progressbar({ @@ -32,12 +32,14 @@ test( "complete", function() { deepEqual( element.progressbar( "value" ), value, "change at " + value ); }, complete: function() { - equal( changes, 2, "complete triggered after change" ); + equal( changes, 3, "complete triggered after change and not on indeterminate" ); } }); value = 5; element.progressbar( "value", value ); + value = false; + element.progressbar( "value", value ); value = 100; element.progressbar( "value", value ); }); diff --git a/themes/base/images/animated-overlay.gif b/themes/base/images/animated-overlay.gif new file mode 100644 index 0000000000000000000000000000000000000000..d441f75ebfbdf26a265dfccd670120d25c0a341c GIT binary patch literal 1738 zcmZ|OX;ji_6b5ixNYt8>l?gOuO)6lU%W(mxn(`>1S(XO;u`D+P%xqBvMr|w-Vyr1s z7R|Cn0b8|Hu<=Zmv1mFqh9Fj!NuZfKB2MP$e75`XJ@>=!y!Ux9xR3x;EW!q1^V>X| znVFuRUN`NqJ2)ybXh%e__h!!pv(M|S3+?9F%(K}zyE40MGyhWF5-IDgL&=%2-9`Nk z!1@8uk4t%_{(K~>N;sK&dzJbwJ=$kYTlL=$%#0Pfh>U{%i@~wWbvYsD_K-D`&+u1( z#Ma`>%q<^UhzGvi(hyE`zCD{-=2|zL5>wnB=DE!U?(CZG%q4@lDnCq_%&3DCla#(X zmBhDD+RN$aMWWHm?ig*>1Onn6~r?Ma~N2JKAxN>H%UtRyRqS)6Um!-Tz%-r=& zQmTb^JFIe3W^-kAm`}`2P|niMh>RYyd)S^f(dbrx965?rzbhP|XeP}o&&DSZ4|oYQ z)I{f!SfycYw?3=9W;o-B%U5xs(pP267X~9-7L|4WzaYexC0GtG8wWygm63rF{llCEraxzkc=IxvFQ-y37=_;e5 zJLq^gsSO0Ayz?a>E_?{dmUc+t#qv$)XN8$<<}rQ#)lsiw+pmL&J>~+hgpo>i$m+;l zZIa_ZRIfSeT$~v5d`EBV&*k`apPgjv&B|+d`Q!nyu{L4rs%ZfoF0*Kq8I%ByOcFpL zK=>wzofZo<+0GZLCnWM3oQ^pb(gRSf02;~cEn@LJ>~XB9IkEX{$N#Z`m%>S!U{uPx zloI%bLdo$Adxlh(Uv^yX7s5G&C zLwNRG>~T?G{kzupp8EcyLGPoPf)@&9Wqfw_l&uU-6cexk%5;uQg%wb=0k_733{i#& z1a2p)gV3S2+QG1-K9tZ}E~I<(P0r2aFFY-c{o?TUOz3Xjod#TLE2A_c?*T7t z=1>~%YW450{Qqno4t`}gvLnuMrcu8+#xEBoY%2_+Mb#Z6S38+r*M4O`-+!zl(@m`D zQsi|GA2l3gEy}LFe<#Hv8?$_L#u8E|3-bP$*La*E>B{X!Sy4i6?TKam!49aXCAW4S*P_O^H4^*DpiA40o}Uqw~Eo&veh1`|8i zD2$x+>_b^bXE4N;AW=5>iYak2%!JAh0j1*k1{p#iRCjbB7!cSws~U{1IA@acLII$t z$>X#A+^s6iJ5~DFG!xa?>z{=lxtdi1rzbM-(nqAu3D8h-&64xo6|E!p?pK0xT;qoK z`6%+SpBk+~M?nO}>2mTw!A{yZ6O>Z@kwSd4;8aWU5z!P~tQl?u==^+R`{OmOS}oZh zOXQ3{6kuz?Is^n^L7;9ieB9C+8B{>t+pDrlq4xGDDn#T#3T5$l1g`FTQkU;b-981j zNm{zC`$wn7etklM#qHI4=3m5gwa6DNS{?Z!vSObi_od{4eUo=_S2BKNpkSdiqe(k9WtkeM79;2-%CFbb)aB=&H1?i1}uwFzoZQ(38Kn1zBP ORn*B%u*Wk|4g3!*Rv{Mv literal 0 HcmV?d00001 diff --git a/themes/base/jquery.ui.progressbar.css b/themes/base/jquery.ui.progressbar.css index f042a120f..5aba50cdf 100644 --- a/themes/base/jquery.ui.progressbar.css +++ b/themes/base/jquery.ui.progressbar.css @@ -9,11 +9,20 @@ * http://docs.jquery.com/UI/Progressbar#theming */ .ui-progressbar { - height:2em; + height: 2em; text-align: left; overflow: hidden; } .ui-progressbar .ui-progressbar-value { margin: -1px; - height: 100%; + height:100%; +} +.ui-progressbar .ui-progressbar-value .ui-progressbar-overlay { + background: url("images/animated-overlay.gif"); + height: 100%; + filter: alpha(opacity=25); + opacity: 0.25; +} +.ui-progressbar .ui-progressbar-indeterminate { + background-image: none; } diff --git a/ui/jquery.ui.progressbar.js b/ui/jquery.ui.progressbar.js index 6c3d7dadd..0b1ee8aba 100644 --- a/ui/jquery.ui.progressbar.js +++ b/ui/jquery.ui.progressbar.js @@ -36,7 +36,7 @@ $.widget( "ui.progressbar", { "aria-valuenow": this.options.value }); - this.valueDiv = $( "
    " ) + this.valueDiv = $( "
    " ) .appendTo( this.element ); this.oldValue = this.options.value; @@ -71,16 +71,19 @@ $.widget( "ui.progressbar", { val = newValue; } + this.indeterminate = val === false; + // sanitize value if ( typeof val !== "number" ) { val = 0; } - return Math.min( this.options.max, Math.max( this.min, val ) ); + return this.indeterminate ? false : Math.min( this.options.max, Math.max( this.min, val ) ); }, _setOptions: function( options ) { var val = options.value; + // Ensure "value" option is set after other values (like max) delete options.value; this._super( options ); @@ -106,26 +109,36 @@ $.widget( "ui.progressbar", { }, _percentage: function() { - return 100 * this.options.value / this.options.max; + return this.indeterminate ? 100 : 100 * this.options.value / this.options.max; }, _refreshValue: function() { - var percentage = this._percentage(); + var value = this.options.value, + percentage = this._percentage(), + overlay = this.valueDiv.children().eq( 0 ); - if ( this.oldValue !== this.options.value ) { - this.oldValue = this.options.value; + overlay.toggleClass( "ui-progressbar-overlay", this.indeterminate ); + this.valueDiv.toggleClass( "ui-progressbar-indeterminate", this.indeterminate ); + + if ( this.oldValue !== value ) { + this.oldValue = value; this._trigger( "change" ); } - if ( this.options.value === this.options.max ) { + if ( value === this.options.max ) { this._trigger( "complete" ); } this.valueDiv - .toggle( this.options.value > this.min ) - .toggleClass( "ui-corner-right", this.options.value === this.options.max ) + .toggle( this.indeterminate || value > this.min ) + .toggleClass( "ui-corner-right", value === this.options.max ) .width( percentage.toFixed(0) + "%" ); - this.element.attr( "aria-valuemax", this.options.max ); - this.element.attr( "aria-valuenow", this.options.value ); + if ( this.indeterminate ) { + this.element.removeAttr( "aria-valuemax" ); + this.element.removeAttr( "aria-valuenow" ); + } else { + this.element.attr( "aria-valuemax", this.options.max ); + this.element.attr( "aria-valuenow", value ); + } } }); From a217bd3b160960f8d2ffb9f6a72df7e408c7a52e Mon Sep 17 00:00:00 2001 From: Corey Frang Date: Thu, 22 Nov 2012 04:12:30 -0600 Subject: [PATCH 27/28] Effects: Making sure outerHeight and outerWidth make it through to the .size() implementation in all cases - Fixes IE8 effects failure --- ui/jquery.ui.effect-scale.js | 31 ++++++++++++++++++++++++------- 1 file changed, 24 insertions(+), 7 deletions(-) diff --git a/ui/jquery.ui.effect-scale.js b/ui/jquery.ui.effect-scale.js index 7fa04bed6..1307e7782 100644 --- a/ui/jquery.ui.effect-scale.js +++ b/ui/jquery.ui.effect-scale.js @@ -21,7 +21,9 @@ $.effects.effect.puff = function( o, done ) { factor = percent / 100, original = { height: elem.height(), - width: elem.width() + width: elem.width(), + outerHeight: elem.outerHeight(), + outerWidth: elem.outerWidth() }; $.extend( o, { @@ -35,7 +37,9 @@ $.effects.effect.puff = function( o, done ) { original : { height: original.height * factor, - width: original.width * factor + width: original.width * factor, + outerHeight: original.outerHeight * factor, + outerWidth: original.outerWidth * factor } }); @@ -74,7 +78,12 @@ $.effects.effect.scale = function( o, done ) { options.restore = true; } - options.from = o.from || ( mode === "show" ? { height: 0, width: 0 } : original ); + options.from = o.from || ( mode === "show" ? { + height: 0, + width: 0, + outerHeight: 0, + outerWidth: 0 + } : original ); options.to = { height: original.height * factor.y, width: original.width * factor.x, @@ -124,7 +133,9 @@ $.effects.effect.size = function( o, done ) { props = restore ? props0 : props1, zero = { height: 0, - width: 0 + width: 0, + outerHeight: 0, + outerWidth: 0 }; if ( mode === "show" ) { @@ -213,7 +224,9 @@ $.effects.effect.size = function( o, done ) { var child = $( this ), c_original = { height: child.height(), - width: child.width() + width: child.width(), + outerHeight: child.outerHeight(), + outerWidth: child.outerWidth() }; if (restore) { $.effects.save(child, props2); @@ -221,11 +234,15 @@ $.effects.effect.size = function( o, done ) { child.from = { height: c_original.height * factor.from.y, - width: c_original.width * factor.from.x + width: c_original.width * factor.from.x, + outerHeight: c_original.outerHeight * factor.from.y, + outerWidth: c_original.outerWidth * factor.from.x }; child.to = { height: c_original.height * factor.to.y, - width: c_original.width * factor.to.x + width: c_original.width * factor.to.x, + outerHeight: c_original.height * factor.to.y, + outerWidth: c_original.width * factor.to.x }; // Vertical props scaling From 421aeaa08135e747ff9f2a59974c26b350cdcda7 Mon Sep 17 00:00:00 2001 From: TJ VanToll Date: Thu, 22 Nov 2012 22:43:18 -0500 Subject: [PATCH 28/28] Slider: Explicitly apply opacity filter to disabled handles. Fixed #6727 - Slider: Visual issues with disabled slider in IE8 --- grunt.js | 2 +- themes/base/jquery.ui.slider.css | 6 ++++++ 2 files changed, 7 insertions(+), 1 deletion(-) diff --git a/grunt.js b/grunt.js index 524421be7..f43648870 100644 --- a/grunt.js +++ b/grunt.js @@ -299,8 +299,8 @@ grunt.initConfig({ }), // TODO consider reenabling some of these rules rules: { + "adjoining-classes": false, "import": false, - "important": false, "outline-none": false, // especially this one "overqualified-elements": false, diff --git a/themes/base/jquery.ui.slider.css b/themes/base/jquery.ui.slider.css index d0ee1a00d..e590a376c 100644 --- a/themes/base/jquery.ui.slider.css +++ b/themes/base/jquery.ui.slider.css @@ -28,6 +28,12 @@ background-position: 0 0; } +/* For IE8 - See #6727 */ +.ui-slider.ui-state-disabled .ui-slider-handle, +.ui-slider.ui-state-disabled .ui-slider-range { + filter: inherit; +} + .ui-slider-horizontal { height: .8em; }