onActionToggle.js

angular.module('homepage').
/**
 * On action modifies an property on scope.
 * It takes the following parameters:
 *   onActionToggle attribute - (following values seper)
 *     type: type of action,
 *     item: item name on scope,
 *     value: value that is to be set for the item
 *   scopeObj attribute - the variable,
 *   on which the items needs to be modified.
 */
 directive('onActionToggle', function (StringUtility, $timeout) {
 	return {
 		restrict: 'A',
 		link: onActionToggleLinkerFn,
 		scope: {
 			onActionToggle: '=',
 			isVisible: '=scopeObj'
 		}
 	}
 	
 	function onActionToggleLinkerFn(scope, element, attribute) {
            var parts = StringUtility.getPartsOfString(scope.onActionToggle);
            parts = convertPartToArray(parts);
            parts = checkValues(parts);

            setDefaultValues(scope, parts);

            var events = parts[0];
            for(var index in events) {
                  var eventtype = events[index];
                  if(eventtype.toLowerCase() == 'KEYUP'.toLowerCase()) {
                        element.bind('keyup', function(event) {
                              setAttributes(event, scope, parts);
                        });
                  }

                  if(eventtype.toLowerCase() == 'CLICK'.toLowerCase()) {
                        element.bind('click', function(event) {
                              setAttributes(event, scope, parts);   
                        });
                  }
            }
      }

      function setDefaultValues(scope, parts) {
            var attributes = parts[1];
            var values = parts[2];

            for(var index in attributes) {
                  var attribute = attributes[index].trim();
                  // convert value to boolean from string if string contains 'true' or 'false' value
                  var value = StringUtility.stringToBoolean(values[index].trim());
                  scope.isVisible[attribute] = value;
            }

            $timeout(function () {
                  scope.$apply();
            });
      }

      function setAttributes(event, scope, parts) {
            event.stopPropagation();

            var attributes = parts[1];
            var values = parts[2];

            for(var index in attributes) {
                  var attribute = attributes[index].trim();
                  scope.isVisible[attribute] = !scope.isVisible[attribute];
            }

            $timeout(function () {
                  scope.$apply();
            });
      }

      /* Expand from one value to multiple if needed */
      function checkValues(parts) {
            var attributes = parts[1];
            var values = parts[2];

            if(attributes.length != values.length) {
                  var value = values[0];
                  var values = [];
                  for(var index in attributes) {
                        values.push(value);
                  }
                  parts[2] = values;
            }

            return parts;
      }

      /* Extract items from string and convert to array */
      /**
       * @return parts
       * parts[1]: attributes
       * parts[2]: values
       */
       function convertPartToArray(parts) {
            for(var index in parts) {
                  var part = parts[index];
                  if(typeof part == 'string') {
                        // convert string to array
                        parts[index] = [part.trim()];
                  }
            }
            return parts;
      }
});