Values live fix | directive value edit update
/**
* Removes unwanted characteres from input while typing/pasting
*
* @directive valuesLiveFix
*
* <input type="text" valueslivefix="amountFixer" />
*
*/
app.directive( 'valueslivefix', [ function() {
"use strict";
return {
restrict: "A",
require: 'ngModel',
scope: {
t: "@valueslivefix" // read attribute value for switching models of values fixing
},
link: function( scope, element , attrubite , model ) {
var filtered,
start,
end,
/**
* Executes filter function
*
* @function appendFilter
* @param {filter} filter callback
*/
appendFilter = function( filter ) {
start = element[0].selectionStart;
end = element[0].selectionEnd;
filtered = filter( element[0].value );
if( model ) {
model.$setViewValue( filtered.value );
model.$render();
} else {
element[0].value = filtered.value;
}
element[0].setSelectionRange(start, end - filtered.position );
return;
},
/**
* @function amountFixer
* @param {String} value string to be parsed
* @return {Object} Returns object with two properties: parsed value and variable for setting cursor position
*/
amountFixer = function( value ) {
var regEx = /[^0-9,.\s ]/ig,
position = ( regEx.test( value ) ) ? 1 : 0; // Variable for setting cursors position expression
return {
value : value.replace( regEx , ''),
position: position
};
},
dateFilter = function( value ) {
var regEx = /\D/g,
position = ( regEx.test( value ) ) ? 1 : 0;
value = value.replace( regEx , '');
// date can has only 4 numbers
if( value.length > 4 ) {
value = value.slice( 0 , - value.length + 4 );
}
return {
value : value,
position: position
};
},
declaration = function( value ) {
var regEx = /\D/g,
position = ( regEx.test( value ) ) ? 1 : 0;
return {
value : value.replace( regEx , ''),
position: position
};
},
/**
* Adds mutiple events listeners
*
* @function setEvents
* @param {Object} element directives element object
* @param {Array} array of events to be created
* @callback {Function} callback function for the events
*/
setEvents = function( element , events , filterCallback ) {
for( var i = 0, l = events.length; i < l; i++ ) {
element.bind( events[i] , function( e ) {
appendFilter( filterCallback );
});
}
return;
};
console.log( scope.t );
switch( scope.t ) {
case "amountFixer":
setEvents( element , [ "keyup" , "paste" ] , amountFixer );
break;
case "date":
setEvents( element , [ "keyup" , "paste" ] , dateFilter );
break;
case "declaration":
setEvents( element , [ "keyup" , "paste" ] , declaration );
break;
default:
setEvents( element , [ "keyup" , "paste" ] , amountFixer );
}
}
};
}]);