Skip to content
This repository has been archived by the owner on Feb 12, 2022. It is now read-only.

Commit

Permalink
Merge pull request #699 from ExactTarget/datepicker-restricted-focus
Browse files Browse the repository at this point in the history
Datepicker Restricted Focus
  • Loading branch information
Kevin Parkerson committed Oct 1, 2014
2 parents 285f439 + 96cd15f commit e463c0d
Show file tree
Hide file tree
Showing 8 changed files with 100 additions and 27 deletions.
15 changes: 15 additions & 0 deletions dist/css/fuelux.css

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 1 addition & 1 deletion dist/css/fuelux.css.map

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion dist/css/fuelux.min.css

Large diffs are not rendered by default.

Binary file modified dist/fuelux.zip
Binary file not shown.
70 changes: 55 additions & 15 deletions dist/js/fuelux.js
Original file line number Diff line number Diff line change
Expand Up @@ -675,6 +675,7 @@
this.$input.val( this.formatDate( date ) );
this.inputValue = this.$input.val();
this.$input.focus();
this.$element.trigger( 'dateClicked.fu.datepicker', date );
},

destroy: function() {
Expand Down Expand Up @@ -956,7 +957,7 @@
for ( i = 0; i < rows; i++ ) {
$tr = $( '<tr></tr>' );
for ( j = 0; j < 7; j++ ) {
$td = $( '<td><span><button type="button" class="datepicker-date">' + curDate + '</button></span></td>' );
$td = $( '<td></td>' );
if ( stage === -1 ) {
$td.addClass( 'last-month' );
} else if ( stage === 1 ) {
Expand Down Expand Up @@ -994,6 +995,12 @@
$td.addClass( 'selected' );
}

if ( $td.hasClass( 'restricted' ) ) {
$td.html( '<span><b class="datepicker-date">' + curDate + '</b></span>' );
} else {
$td.html( '<span><button type="button" class="datepicker-date">' + curDate + '</button></span>' );
}

curDate++;
if ( stage === -1 && curDate > lastMonthDate ) {
curDate = 1;
Expand Down Expand Up @@ -2017,7 +2024,7 @@

action: function() {
var val = this.$input.val();
var inputEmptyOrUnchanged = val === '' || val === this.activeSearch;
var inputEmptyOrUnchanged = ( val === '' || val === this.activeSearch );

if ( this.activeSearch && inputEmptyOrUnchanged ) {
this.clear();
Expand All @@ -2039,15 +2046,22 @@
},

keypressed: function( e ) {
var val, inputPresentAndUnchanged;
var remove = 'glyphicon-remove';
var search = 'glyphicon-search';
var val;

if ( e.which === 13 ) {
e.preventDefault();
this.action();
} else {
val = this.$input.val();
inputPresentAndUnchanged = val && ( val === this.activeSearch );
this.$icon.attr( 'class', inputPresentAndUnchanged ? 'glyphicon glyphicon-remove' : 'glyphicon glyphicon-search' );
if ( !val ) {
this.clear();
} else if ( val !== this.activeSearch ) {
this.$icon.removeClass( remove ).addClass( search );
} else {
this.$icon.removeClass( search ).addClass( remove );
}
}
},

Expand Down Expand Up @@ -3901,7 +3915,12 @@
el: self.$pillHTML
};

if ( value[ 'attr' ] ) {
data[ 'attr' ] = value.attr; // avoid confusion with $.attr();
}

items[ i ] = data;

} );

if ( this.options.edit && this.currentEdit ) {
Expand Down Expand Up @@ -3990,6 +4009,20 @@
$item.attr( 'data-value', item.value );
$item.find( 'span:first' ).html( item.text );

// DOM attributes
if ( item[ 'attr' ] ) {
$.each( item[ 'attr' ], function( key, value ) {

if ( key === 'cssClass' || key === 'class' ) {
$item.addClass( value );
} else {
$item.attr( key, value );
}

} );

}

newHtml += $item.wrap( '<div></div>' ).parent().html();
} );

Expand Down Expand Up @@ -4430,7 +4463,7 @@

var Repeater = function( element, options ) {
var self = this;
var currentView;
var $btn, currentView;

this.$element = $( element );

Expand Down Expand Up @@ -4504,7 +4537,12 @@

this.$loader.loader();
this.$loader.loader( 'pause' );
currentView = ( this.options.defaultView !== -1 ) ? this.options.defaultView : this.$views.find( 'label.active input' ).val();
if ( this.options.defaultView !== -1 ) {
currentView = this.options.defaultView;
} else {
$btn = this.$views.find( 'label.active input' );
currentView = ( $btn.length > 0 ) ? $btn.val() : 'list';
}

this.initViews( function() {
self.resize();
Expand Down Expand Up @@ -4578,11 +4616,11 @@

options = options || {};

opts.filter = this.$filters.selectlist( 'selectedItem' );
opts.filter = ( this.$filters.length > 0 ) ? this.$filters.selectlist( 'selectedItem' ) : 'all';
opts.view = this.currentView;

if ( !this.infiniteScrollingEnabled ) {
opts.pageSize = parseInt( this.$pageSize.selectlist( 'selectedItem' ).value, 10 );
opts.pageSize = ( this.$pageSize.length > 0 ) ? parseInt( this.$pageSize.selectlist( 'selectedItem' ).value, 10 ) : 25;
}
if ( options.pageIncrement !== undefined ) {
if ( options.pageIncrement === null ) {
Expand All @@ -4593,7 +4631,7 @@
}
opts.pageIndex = this.currentPage;

val = this.$search.find( 'input' ).val();
val = ( this.$search.length > 0 ) ? this.$search.find( 'input' ).val() : '';
if ( val !== '' ) {
opts.search = val;
}
Expand Down Expand Up @@ -5405,7 +5443,8 @@
nested: [ {
complete: function( helpers, callback ) {
var obj = {
container: helpers.container
container: helpers.container,
rowData: helpers.subset[ helpers.index ]
};
if ( helpers.item !== undefined ) {
obj.item = helpers.item;
Expand Down Expand Up @@ -5453,8 +5492,6 @@
} );
}



this.list_curRowIndex = helpers.index;
callback( {
item: $item
Expand All @@ -5464,7 +5501,9 @@
nested: [ {
after: function( helpers, callback ) {
var obj = {
container: helpers.container
container: helpers.container,
colAttr: helpers.subset[ helpers.index ].property,
rowData: helpers.data.items[ this.list_curRowIndex ]
};
if ( helpers.item !== undefined ) {
obj.item = helpers.item;
Expand Down Expand Up @@ -5590,7 +5629,8 @@
nested: [ {
after: function( helpers, callback ) {
var obj = {
container: helpers.container
container: helpers.container,
itemData: helpers.subset[ helpers.index ]
};
if ( helpers.item !== undefined ) {
obj.item = helpers.item;
Expand Down
6 changes: 3 additions & 3 deletions dist/js/fuelux.min.js

Large diffs are not rendered by default.

8 changes: 7 additions & 1 deletion js/datepicker.js
Original file line number Diff line number Diff line change
Expand Up @@ -454,7 +454,7 @@
for(i=0; i<rows; i++){
$tr = $('<tr></tr>');
for(j=0; j<7; j++){
$td = $('<td><span><button type="button" class="datepicker-date">' + curDate + '</button></span></td>');
$td = $('<td></td>');
if(stage===-1){
$td.addClass('last-month');
}else if(stage===1){
Expand Down Expand Up @@ -488,6 +488,12 @@
$td.addClass('selected');
}

if($td.hasClass('restricted')){
$td.html('<span><b class="datepicker-date">' + curDate + '</b></span>');
}else{
$td.html('<span><button type="button" class="datepicker-date">' + curDate + '</button></span>');
}

curDate++;
if(stage===-1 && curDate>lastMonthDate){
curDate = 1;
Expand Down
24 changes: 18 additions & 6 deletions less/datepicker.less
Original file line number Diff line number Diff line change
Expand Up @@ -35,14 +35,19 @@
}

td {
button {
b, button {
color: #231f20;
display: inline-block;
font-weight: normal;
height: 30px;
text-decoration: none;
width: 30px;
}

b {
line-height: 30px;
}

span {
display: block;

Expand All @@ -53,7 +58,7 @@
}

&.current-day {
button {
b, button {
border: 1px solid #1d75bb;
}
}
Expand All @@ -63,13 +68,13 @@
}

&.past {
button {
b, button {
color: #8d8787;
}
}

&.restricted {
button {
b, button {
cursor: no-drop;
position: relative;

Expand Down Expand Up @@ -97,15 +102,22 @@
&:hover {
background: #0f5f9f;
}

}

button {
b, button {
color: #fff;
}

&.current-day {
box-shadow: 0 0 0 1px #fff offset;

span {
&:hover {
b, button {
border-color: #0f5f9f;
}
}
}
}
}
}
Expand Down

0 comments on commit e463c0d

Please sign in to comment.