Remove jQuery dependency

[FagnerMartinsBrack]

I am integrating this plugin in an angular app. I need to create a wrapper to make this work without changing the original code, but it turns out that we need a lot of workarounds.

Below is an example of a supposed "simple" application-specific wrapper:

module.directive( "maskMoneyEnabled", function( $parse ) {
    return {
        require: "ngModel",
        restrict: "A",
        link: function( scope, element, attrs, ngModelController ) {
            var options = {
                prefix: "R$ ",
                precision: 2,
                thousands: ".",
                decimal: ","    
            };

            var mask;

            attrs.$observe( "maskMoneyEnabled", function initialize( enabledAttribute ) {
                var enabled = $parse( enabledAttribute )( scope );
                if ( !enabled ) {
                    return;
                }
                mask = element.maskMoney( options );

                // github.com/plentz/jquery-maskmoney/issues/171#issuecomment-104038258
                mask.maskMoney( "mask" );
            });

            // github.com/angular-ui/ui-utils/commit/36cd714ba14196163c04eda8fc40666f140df324
            var modelViewValue = false;
            attrs.$observe( "modelViewValue", function( val ) {
                modelViewValue = val === "true";
            });
            scope.$watch( attrs.ngModel, function( val ) {
                if ( modelViewValue && val ) {
                    var value = ngModelController.$viewValue;

                    value = value.split( options.prefix ).join( "" );

                    ngModelController.$setViewValue( value );
                }

                if ( mask ) {
                    // 1. github.com/plentz/jquery-maskmoney/issues/176
                    // 2. Need to trigger inside the model watch in order to prevent a race-condition that removes the input value
                    mask.triggerHandler( "blur.maskMoney" );
                }
            });
        }
    };
});

Used as:

<input mask-money-enabled="true" ng-model="model.value">

If the jQuery dependency is removed and the algorithm for controlling the input is decoupled from the DOM manipulation, it would be easier to adapt such routine not just in angular, but in any other app. Also, it would reduce the overhead of one more dependency to be worried about.

Something similar has been done for jquery cookie a few weeks ago for the very same reason. In that case it was not necessary to decouple some responsibilities, but just the jQuery dependency removal made it easy to integrate with anything in a per-application basis.

Integration and separation of concerns might be something to think about in order to increase reusability.

[plentz]

@FagnerMartinsBrack I really like the idea, but right now I can't do it. It also could help to improve the code, since it was originally written by another guy and I've improved it little by little over time. I think that a major rethinking could be very helpful and almost necessary.