zettapi_client/lib/directives/container/container.dir.js

Admin panel and client-side CRUD operations in angular to use with zettapi_server rest api to get started quickly in any CMS project.

app.directive('zlContainer', function () {
  return {
    restrict: 'EA',
    replace: false,
    templateUrl: 'directives/container/container.html',
    scope: {
      item: '=',
      var: '@',

      key: '@',
      isObject: '@',
      allowDuplicates: '@',

      lookup: '=',

      label: '@',

      isVisible: '&?',
      isMovable: '@',
      noInsert: '@',
      removable: '@',

      approvalMaxLevel: '@'
    },
    controller: function ($scope, $rootScope, $controller, $timeout, zapi) {
      $scope.useInputLarge = zapi.useInputLarge;
      $scope.newContainerItem = $scope.isObject ? {} : "";

      $scope.append = function (newContainerItem) {
        append(newContainerItem, function (err) {
          if (err) return swal("Atenção", err, "warning");

          //clear new container item fields
          $scope.newContainerItem = $scope.isObject ? {} : "";
        });
      };

      $scope.remove = function (containerItem) {
        var index = $scope.item[$scope.var].indexOf(containerItem);
        if (index === -1) return;
        $scope.item[$scope.var].splice(index, 1);
      };

      $scope.validate = function (newContainerItem) {
        $scope.console = null;
        if (typeof $scope.getError !== 'function') return false;

        if (!newContainerItem) return true;
        if ($scope.isObject) {
          if (Object.keys(newContainerItem).length === 0 && JSON.stringify(newContainerItem) === JSON.stringify({})) return true;
        }

        var response = $scope.getError(newContainerItem, $scope.item[$scope.var]);
        $scope.console = response.disabled ? response.tooltip : null;
        return !!$scope.console;
      };

      $scope.pushBack = function (index) {
        var _containerItem = $scope.item[$scope.var].splice(index, 1);
        $scope.item[$scope.var].splice(index - 1, 0, _containerItem[0]);
      };

      $scope.pushForward = function (index) {
        var _containerItem = $scope.item[$scope.var].splice(index, 1);
        $scope.item[$scope.var].splice(index + 1, 0, _containerItem[0]);
      };

      //$timeout is only ready after directive has fully loaded
      //this way when the controller loads, $scope will be fully populated
      $timeout(initialize);

      function initialize() {
        $controller($scope.var + 'Ctrl', { $scope: $scope });
      }

      function append(newContainerItem, callback) {
        if (!newContainerItem) return callback("Registo inválido");

        if (!$scope.item[$scope.var]) $scope.item[$scope.var] = [];

        //check if containerItem is not empty
        if ($scope.isObject) {
          var key = {
            property: null,
            key: null
          };
          if (newContainerItem[$scope.key]) {
            key.key = newContainerItem[$scope.key];
          } else {
            for (var property in newContainerItem) {
              if (newContainerItem[property][$scope.key]) {
                key.property = property;
                key.key = newContainerItem[property][$scope.key];
                break;
              }
            }
          }

          if (key.key) {
            //check if containerItem already exists in container
            var duplicateKey = $scope.item[$scope.var].forEach(function (subitem) {
              var obj = key.property ? subitem[key.property] : subitem;
              return (obj[$scope.key] === key.key && typeof $scope.allowDuplicates === 'undefined');
            });
            if (duplicateKey) return callback('Registo duplicado em ' + $scope.label);
          }
        } else {
          var duplicateValue = $scope.item[$scope.var].forEach(function (subitem) {
            return (subitem === newContainerItem && typeof $scope.allowDuplicates === 'undefined');
          });
          if (duplicateValue) return callback('Registo duplicado em ' + $scope.label);
        }

        //approvable containers only
        if ($scope.approvalMaxLevel) {
          newContainerItem.approval = {
            level: $rootScope.login.role.approvalLevel,
            maxLevel: $scope.approvalMaxLevel
          };
        }

        //append item to container
        $scope.item[$scope.var].unshift(newContainerItem);

        callback();
      }
    }
  };
});