zettapi_client/lib/directives/entity/entity.view.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('entityView', function () {
  return {
    restrict: 'EA',
    scope: {
      entity: '@',
      item: '=?',
      lookup: '=?',
      form: '=',
      fetch: '@'
    },
    template: '<div ng-include src="contentUrl" include-replace></div>',
    controller: function ($scope, zapi, $interpolate, $controller, $entity, $rootScope, $routeParams, $timeout, blockUI) {
      //validate
      $scope.entity = $scope.entity || $routeParams.entity;
      var entityObj = zapi.entityMap[$scope.entity];
      if (!entityObj) return;
      if (!entityObj.view) return;

      //defaults
      var idField = entityObj.id || "_id";
      var idValue = $scope.item ? $scope.item[idField] : undefined;
      $scope.useInputLarge = zapi.useInputLarge;
      $scope.item = $scope.item || {};
      if (typeof $scope.lookup === 'undefined') $scope.lookup = {};
      $scope.fetch = $scope.fetch ? true : false;
      $scope._form = $scope.form;
      $scope.contentUrl = 'entity/' + $scope.entity + '/' + $scope.entity + '.view.html';

      //main
      if ($scope.fetch) initialize(loadFinished);
      else loadFinished();

      //private functions
      function initialize(callback) {
        blockUI.start($interpolate("{{'api.entity.getData' | translate}}")($scope));
        $entity.getMany(entityObj.lookup, function (err, lookups) {
          if (err) {
            blockUI.stop();
            callback();
            return swal("Não foi possível obter os dados", err, 'warning');
          }

          if (typeof $scope.lookup === 'undefined') $scope.lookup = {};
          for (var key in lookups) $scope.lookup[key] = lookups[key];
          if (!idValue) return;

          $entity.get($scope.entity, idValue).then(function (response) {
            $scope.item = response.data;

            //todo
            //$scope.lookup = $lookup.set($scope.entity, response.data);
          }).catch(function (response) {
            swal("Não foi possível obter os dados", $interpolate("{{'api.entity.errorData' | translate}}")($scope), 'warning');
          }).finally(function () {
            blockUI.stop();
            callback();
          });
        });
      }

      function loadFinished() {
        $timeout(function () {
          var websocket;
          if (typeof entityObj.websocket !== 'function') websocket = $scope.entity;
          else websocket = entityObj.websocket($rootScope, $routeParams) + "." + $scope.entity;
          $scope.$on('socket:' + websocket + '.remove', onThisEntityRemove);
          $scope.$on('socket:' + websocket + '.edit', onThisEntityEdit);

          //inject child controller
          try {
            if ($scope.fetch) $controller($scope.entity + 'Ctrl', { $scope: $scope });
          } catch (err) {
            console.log(err);
          }
        });
      }

      function onThisEntityEdit(ev, data) {
        //todo
        //$scope.lookup = $lookup.set($scope.entity, data);
        if (idValue != data[idField]) return;

        $scope.item = data;
      }

      function onThisEntityRemove(ev, id) {
        //todo
        //$scope.lookup = $lookup.unset($scope.entity, id);
        if (idValue != id) return;

        swal("Outro utilizador apagou este registo", "Actualize a página para ver reflitadas as alterações", "info");
      }
    }
  };
});