11/* http://home.iprimus.com.au/kbwood/jquery/timeEntry.html
2- Time entry for jQuery v1.2.1 .
2+ Time entry for jQuery v1.2.2 .
33 Written by Keith Wood ([email protected] ) June 2007. 44 Under the Creative Commons Licence http://creativecommons.org/licenses/by/3.0/
55 Share or Remix it but please Attribute the author. */
@@ -44,13 +44,11 @@ function TimeEntry() {
4444 // false to never use it
4545 minTime : null , // The earliest selectable time, or null for no limit
4646 maxTime : null , // The latest selectable time, or null for no limit
47- spinnerPath : '' , // The common path for the images below
48- spinnerImage : 'timeEntry.gif' , // The URL of the image to use for the time spinner
49- spinnerClickImages : [ 'timeEntryNow.gif' , 'timeEntryPrev.gif' ,
50- 'timeEntryNext.gif' , 'timeEntryInc.gif' , 'timeEntryDec.gif' ] ,
51- // Array of image URLs for use when "buttons" are clicked
47+ spinnerImage : 'timeEntry.png' , // The URL of the images to use for the time spinner
48+ // Six images packed horizontally for normal and then each button pressed
5249 spinnerSize : [ 20 , 20 , 8 ] , // The width and height of the spinner image,
5350 // and size of centre button for current time
51+ spinnerIncDecOnly : false , // True for increment/decrement buttons only, false for all
5452 spinnerRepeat : [ 500 , 250 ] , // Initial and subsequent waits in milliseconds
5553 // for repeats on the spinner buttons
5654 fieldSettings : null // Function that takes an input field and
@@ -109,12 +107,12 @@ $.extend(TimeEntry.prototype, {
109107 var inst = timeEntry . _getInst ( input . _timeId ) ;
110108 var fieldSize = inst . _get ( 'separator' ) . length + 2 ;
111109 inst . _field = 0 ;
112- if ( event . rangeOffset ) { // Mozilla - calc from character offset
110+ if ( $ . browser . mozilla ) { // calc from character offset
113111 var offset = event . rangeOffset ;
114112 inst . _field = ( offset > Math . max ( 1 , inst . _secondField ) * fieldSize + 2 ?
115113 inst . _ampmField : Math . floor ( offset / fieldSize ) ) ;
116114 }
117- else if ( input . createTextRange ) { // IE - check against bounding boxes
115+ else if ( $ . browser . msie ) { // check against bounding boxes
118116 var value = input . value ;
119117 for ( var field = 0 ; field <= Math . max ( 1 , inst . _secondField , inst . _ampmField ) ; field ++ ) {
120118 var end = ( field != inst . _ampmField ? ( field * fieldSize ) + 2 :
@@ -129,13 +127,24 @@ $.extend(TimeEntry.prototype, {
129127 }
130128 input . value = value ; // restore original value
131129 }
130+ else if ( $ . browser . opera ) { // use input select range
131+ var value = input . value ;
132+ for ( var field = 0 ; field <= Math . max ( 1 , inst . _secondField , inst . _ampmField ) ; field ++ ) {
133+ var start = ( field != inst . _ampmField ? ( field * fieldSize ) :
134+ ( inst . _ampmField * fieldSize ) + inst . _get ( 'ampmPrefix' ) . length ) ;
135+ if ( start >= input . selectionStart ) {
136+ inst . _field = field ;
137+ break ;
138+ }
139+ }
140+ }
132141 inst . _showField ( ) ;
133142 } ,
134143
135144 /* Handle keystrokes in the field. */
136145 _doKeyDown : function ( event ) {
137146 if ( event . keyCode >= 48 ) { // >= '0'
138- return true ;
147+ return false ;
139148 }
140149 var inst = timeEntry . _getInst ( this . _timeId ) ;
141150 switch ( event . keyCode ) {
@@ -182,6 +191,7 @@ $.extend(TimeEntry.prototype, {
182191
183192 /* Increment/decrement on mouse wheel activity. */
184193 _doMouseWheel : function ( event , delta ) {
194+ delta = ( $ . browser . opera ? - delta / Math . abs ( delta ) : delta ) ;
185195 var inst = timeEntry . _getInst ( this . _timeId ) ;
186196 inst . _adjustField ( delta ) ;
187197 event . preventDefault ( ) ;
@@ -190,14 +200,16 @@ $.extend(TimeEntry.prototype, {
190200 /* Attach the time entry handler to an input field. */
191201 _connectTimeEntry : function ( target , inst ) {
192202 var input = $ ( target ) ;
193- var spinnerPath = inst . _get ( 'spinnerPath' ) ;
194203 var spinnerImage = inst . _get ( 'spinnerImage' ) ;
195204 var spinnerText = inst . _get ( 'spinnerText' ) ;
205+ var spinnerSize = inst . _get ( 'spinnerSize' ) ;
196206 var appendText = inst . _get ( 'appendText' ) ;
197207 input . wrap ( '<span class="timeEntry_wrap"></span>' ) .
198- after ( ( spinnerImage ? '<img class="timeEntry_control" src="' +
199- spinnerPath + spinnerImage + '" alt="' + spinnerText +
200- '" title="' + spinnerText + '" _timeid="' + inst . _id + '"/>' : '' ) +
208+ after ( ( spinnerImage ? '<span class="timeEntry_control" _timeid="' + inst . _id +
209+ '" style="display: inline-block; background: url(\'' + spinnerImage + '\') 0 0 no-repeat; ' +
210+ 'width: ' + spinnerSize [ 0 ] + 'px; height: ' + spinnerSize [ 1 ] + 'px;' +
211+ ( $ . browser . mozilla ? ' padding-left: ' + spinnerSize [ 0 ] +
212+ 'px; padding-top: ' + ( spinnerSize [ 1 ] - 18 ) + 'px;' : '' ) + '"></span>' : '' ) +
201213 ( appendText ? '<span class="timeEntry_append">' + appendText + '</span>' : '' ) ) ;
202214 input . focus ( this . _doFocus ) . blur ( this . _doBlur ) . dblclick ( this . _doDblClick ) .
203215 keydown ( this . _doKeyDown ) . keypress ( this . _doKeyPress ) ;
@@ -214,7 +226,7 @@ $.extend(TimeEntry.prototype, {
214226 input . mousewheel ( this . _doMouseWheel ) ;
215227 }
216228 input [ 0 ] . _timeId = inst . _id ;
217- var spinner = $ ( '../img .timeEntry_control' , input ) ;
229+ var spinner = $ ( '../span .timeEntry_control' , input ) ;
218230 spinner . mousedown ( this . _handleSpinner ) . mouseup ( this . _endSpinner ) .
219231 mouseout ( this . _endSpinner ) . mousemove ( this . _describeSpinner ) ;
220232 if ( spinner [ 0 ] ) {
@@ -223,27 +235,31 @@ $.extend(TimeEntry.prototype, {
223235 } ,
224236
225237 /* Enable a time entry input and any associated spinner.
226- @param inputs element/object - single input field or jQuery collection of input fields
238+ @param inputs string - selector for input field(s) or
239+ element - single input field or
240+ object - jQuery collection of input fields
227241 @return void */
228242 enableFor : function ( inputs ) {
229243 inputs = ( inputs . jquery ? inputs : $ ( inputs ) ) ;
230244 inputs . each ( function ( ) {
231245 this . disabled = false ;
232- $ ( '../img .timeEntry_control' , this ) . css ( 'opacity' , '1.0' ) ;
246+ $ ( '../span .timeEntry_control' , this ) . css ( 'opacity' , '1.0' ) ;
233247 var $this = this ;
234248 timeEntry . _disabledInputs = $ . map ( timeEntry . _disabledInputs ,
235249 function ( value ) { return ( value == $this ? null : value ) ; } ) ; // delete entry
236250 } ) ;
237251 } ,
238252
239253 /* Disable a time entry input and any associated spinner.
240- @param inputs element/object - single input field or jQuery collection of input fields
254+ @param inputs string - selector for input field(s) or
255+ element - single input field or
256+ object - jQuery collection of input fields
241257 @return void */
242258 disableFor : function ( inputs ) {
243259 inputs = ( inputs . jquery ? inputs : $ ( inputs ) ) ;
244260 inputs . each ( function ( ) {
245261 this . disabled = true ;
246- $ ( '../img .timeEntry_control' , this ) . css ( 'opacity' , '0.5' ) ;
262+ $ ( '../span .timeEntry_control' , this ) . css ( 'opacity' , '0.5' ) ;
247263 var $this = this ;
248264 timeEntry . _disabledInputs = $ . map ( timeEntry . _disabledInputs ,
249265 function ( value ) { return ( value == $this ? null : value ) ; } ) ; // delete entry
@@ -319,10 +335,7 @@ $.extend(TimeEntry.prototype, {
319335 var inst = timeEntry . _getInst ( input . _timeId ) ;
320336 timeEntry . _doFocus ( input ) ;
321337 var region = timeEntry . _getSpinnerRegion ( inst , event ) ;
322- var spinnerClickImages = inst . _get ( 'spinnerClickImages' ) ;
323- if ( spinnerClickImages . length > 0 ) {
324- spinner . src = inst . _get ( 'spinnerPath' ) + spinnerClickImages [ region ] ;
325- }
338+ timeEntry . _changeSpinner ( inst , spinner , region ) ;
326339 timeEntry . _actionSpinner ( inst , region ) ;
327340 var spinnerRepeat = inst . _get ( 'spinnerRepeat' ) ;
328341 if ( region >= 3 && spinnerRepeat [ 0 ] ) { // repeat increment/decrement
@@ -363,8 +376,10 @@ $.extend(TimeEntry.prototype, {
363376 _endSpinner : function ( event ) {
364377 var spinner = timeEntry . _getSpinnerTarget ( event ) ;
365378 var inst = timeEntry . _getInst ( spinner . _timeId ) ;
366- spinner . src = inst . _get ( 'spinnerPath' ) + inst . _get ( 'spinnerImage' ) ;
367- timeEntry . _lastInput = timeEntry . _blurredInput ;
379+ timeEntry . _changeSpinner ( inst , spinner , - 1 ) ;
380+ if ( ! $ . browser . opera ) {
381+ timeEntry . _lastInput = timeEntry . _blurredInput ;
382+ }
368383 if ( timeEntry . _lastInput ) {
369384 inst . _showField ( ) ;
370385 }
@@ -380,18 +395,26 @@ $.extend(TimeEntry.prototype, {
380395 var spinner = this . _getSpinnerTarget ( event ) ;
381396 var pos = this . _findPos ( spinner ) ;
382397 var scrolled = this . _findScroll ( spinner ) ;
383- var left = event . clientX + scrolled [ 0 ] - pos [ 0 ] - ( $ . browser . msie ? 1 : 0 ) ;
398+ var spinnerIncDecOnly = inst . _get ( 'spinnerIncDecOnly' ) ;
399+ var left = ( spinnerIncDecOnly ? 99 :
400+ event . clientX + scrolled [ 0 ] - pos [ 0 ] - ( $ . browser . msie ? 1 : 0 ) ) ;
384401 var top = event . clientY + scrolled [ 1 ] - pos [ 1 ] - ( $ . browser . msie ? 1 : 0 ) ;
385402 var spinnerSize = inst . _get ( 'spinnerSize' ) ;
386- var right = spinnerSize [ 0 ] - left ;
403+ var right = ( spinnerIncDecOnly ? 99 : spinnerSize [ 0 ] - left ) ;
387404 var bottom = spinnerSize [ 1 ] - top ;
388- if ( Math . abs ( left - right ) <= spinnerSize [ 2 ] &&
405+ if ( spinnerSize [ 2 ] > 0 && Math . abs ( left - right ) <= spinnerSize [ 2 ] &&
389406 Math . abs ( top - bottom ) <= spinnerSize [ 2 ] ) {
390407 return 0 ; // centre button
391408 }
392409 var min = Math . min ( left , top , right , bottom ) ;
393410 return ( min == left ? 1 : ( min == right ? 2 : ( min == top ? 3 : 4 ) ) ) ; // nearest edge
394411 } ,
412+
413+ /* Change the spinner image depending on button clicked. */
414+ _changeSpinner : function ( inst , spinner , region ) {
415+ $ ( spinner ) . css ( 'background-position' ,
416+ '-' + ( ( region + 1 ) * inst . _get ( 'spinnerSize' ) [ 0 ] ) + ' 0' ) ;
417+ } ,
395418
396419 /* Find an object's position on the screen. */
397420 _findPos : function ( obj ) {
@@ -478,13 +501,13 @@ $.extend(TimeEntryInstance.prototype, {
478501 if ( currentTime . length >= 2 ) {
479502 var isAM = ( value . indexOf ( ampmNames [ 0 ] ) > - 1 ) ;
480503 var isPM = ( value . indexOf ( ampmNames [ 1 ] ) > - 1 ) ;
481- var hour = parseInt ( this . _trimNumber ( currentTime [ 0 ] ) ) ;
504+ var hour = parseInt ( currentTime [ 0 ] , 10 ) ;
482505 hour = ( isNaN ( hour ) ? 0 : hour ) ;
483506 hour = ( ( isAM || isPM ) && hour == 12 ? 0 : hour ) + ( isPM ? 12 : 0 ) ;
484- var minute = parseInt ( this . _trimNumber ( currentTime [ 1 ] ) ) ;
507+ var minute = parseInt ( currentTime [ 1 ] , 10 ) ;
485508 minute = ( isNaN ( minute ) ? 0 : minute ) ;
486509 var second = ( currentTime . length >= 3 ?
487- parseInt ( this . _trimNumber ( currentTime [ 2 ] ) ) : 0 ) ;
510+ parseInt ( currentTime [ 2 ] , 10 ) : 0 ) ;
488511 second = ( isNaN ( second ) || ! this . _get ( 'showSeconds' ) ? 0 : second ) ;
489512 return [ hour , minute , second ] ;
490513 }
@@ -549,17 +572,6 @@ $.extend(TimeEntryInstance.prototype, {
549572 input . focus ( ) ;
550573 } ,
551574
552- /* Ensure a number is not treated as octal. */
553- _trimNumber : function ( value ) {
554- if ( value == '' ) {
555- return '' ;
556- }
557- while ( value . charAt ( 0 ) == '0' ) {
558- value = value . substring ( 1 ) ;
559- }
560- return value ;
561- } ,
562-
563575 /* Ensure displayed single number has a leading zero. */
564576 _formatNumber : function ( value ) {
565577 return ( value < 10 ? '0' : '' ) + value ;
0 commit comments