add moonv4

Change-Id: I247af788d0b0fb961fbc85416486b241eb1d807c
Signed-off-by: WuKong <rebirthmonkey@gmail.com>

25 files changed, 4645 insertions, 0 deletions

diff --git a/moonv4/moon_gui/static/app/policy/action/mapping/policy-map.tpl.html b/moonv4/moon_gui/static/app/policy/action/mapping/policy-map.tpl.html
new file mode 100644
index 00000000..8b787f14
--- /dev/null
+++ b/moonv4/moon_gui/static/app/policy/action/mapping/policy-map.tpl.html
@@ -0,0 +1,64 @@
+<div ng-controller="PolicyMapController as map" class="modal" tabindex="-1" data-role="modalMappingPolicy">
+
+    <div class="modal-dialog">
+
+        <div class="modal-content">
+
+            <div class="modal-header">
+                <button type="button" class="close" ng-click="$hide()">&times;</button>
+                <h4 class="modal-title" data-translate="moon.policy.map.title" data-translate-values="{ pdpName: map.pdp.name}"></h4>
+            </div>
+
+            <div class="modal-body">
+
+                <form class="form-horizontal" role="form" name="map.form">
+
+                    <div class="form-group" ng-class="{'has-error': map.form.policy.$dirty && (map.form.policy.$invalid || !map.selectedPolicy)}">
+
+                        <label class="col-sm-3 control-label" data-translate="moon.policy.map.form.list">List of Policies</label>
+
+                        <div class="col-sm-6">
+
+                            <ui-select ng-model="map.selectedPolicy" name="policy" required>
+                                <ui-select-match placeholder="(None)" ng-bind="$select.selected.name"></ui-select-match>
+                                <ui-select-choices repeat="policy in map.policies">
+                                    <div ng-bind="policy.name" ng-value="policy"></div>
+                                </ui-select-choices>
+                            </ui-select>
+
+                            <moon-loader ng-if="map.policiesLoading"></moon-loader>
+
+                            <div class="help-block" ng-show="map.form.policy.$dirty && (map.form.policy.$invalid || !map.selectedPolicy)">
+                                <small class="error" ng-show="map.form.policy.$error.required" data-translate="moon.policy.map.check.policy.required">Policy is required</small>
+                            </div>
+
+                        </div>
+
+                    </div>
+
+                </form>
+
+            </div>
+
+            <div class="modal-footer">
+                <div class="btn-toolbar" style="float: right;">
+
+                    <a href="" ng-click="$hide()" class="btn btn-default">
+                        <span data-translate="moon.policy.map.action.cancel">Cancel</span>
+                    </a>
+
+                    <a href="" ng-disabled="map.mappingLoading" ng-click="map.map()" class="btn btn-warning">
+                        <span class="glyphicon glyphicon-link"></span>
+                        <span data-translate="moon.policy.map.action.map">Map</span>
+                    </a>
+
+                    <moon-loader ng-if="map.mappingLoading"></moon-loader>
+
+                </div>
+            </div>
+
+        </div>
+
+    </div>
+
+</div>
diff --git a/moonv4/moon_gui/static/app/policy/action/mapping/policy-unmap.tpl.html b/moonv4/moon_gui/static/app/policy/action/mapping/policy-unmap.tpl.html
new file mode 100644
index 00000000..a2cda52a
--- /dev/null
+++ b/moonv4/moon_gui/static/app/policy/action/mapping/policy-unmap.tpl.html
@@ -0,0 +1,33 @@
+<div ng-controller="PolicyUnMapController as unmap" class="modal" tabindex="-1" data-role="modalUnmapPolicy">
+
+    <div class="modal-dialog">
+
+        <div class="modal-content">
+
+            <div class="modal-header">
+                <button type="button" class="close" ng-click="$hide()">&times;</button>
+                <h4 class="modal-title" data-translate="moon.policy.unmap.title"></h4>
+            </div>
+
+            <div class="modal-body">
+                <span data-translate="moon.policy.unmap.content" data-translate-values="{ policyName: unmap.policy.name, pdpName: unmap.pdp.name }"></span>
+            </div>
+
+            <div class="modal-footer">
+                <div class="btn-toolbar" style="float: right;">
+                    <a href="" ng-click="$hide()" class="btn btn-default">
+                        <span data-translate="moon.policy.unmap.action.cancel">Cancel</span>
+                    </a>
+                    <a href="" ng-disabled="unmap.unMappingLoading" ng-click="unmap.unmap()" class="btn btn-warning">
+                        <span class="glyphicon glyphicon-transfer"></span>
+                        <span data-translate="moon.policy.unmap.action.unmap">Unmap</span>
+                    </a>
+                    <moon-loader ng-if="unmap.unMappingLoading"></moon-loader>
+                </div>
+            </div>
+
+        </div>
+
+    </div>
+
+</div>
\ No newline at end of file
diff --git a/moonv4/moon_gui/static/app/policy/action/mapping/policy.controller.map.js b/moonv4/moon_gui/static/app/policy/action/mapping/policy.controller.map.js
new file mode 100644
index 00000000..6ad8caa7
--- /dev/null
+++ b/moonv4/moon_gui/static/app/policy/action/mapping/policy.controller.map.js
@@ -0,0 +1,106 @@
+(function() {
+
+    'use strict';
+
+    angular
+        .module('moon')
+        .controller('PolicyMapController', PolicyMapController);
+
+    PolicyMapController.$inject = ['$scope', 'alertService', '$translate', 'formService', 'policyService', 'pdpService', 'utilService'];
+
+    function PolicyMapController($scope, alertService, $translate, formService, policyService, pdpService,  utilService ) {
+
+        var map = this;
+
+        /*
+         *
+         */
+
+        map.pdps = [];
+
+        map.pdp = $scope.pdp;
+
+        map.addPolicyToList = false;
+
+        map.map = mapToPdp;
+
+        activate();
+
+        function activate() {
+
+            resolvePolicies();
+
+        }
+
+        function resolvePolicies() {
+
+            map.policiesLoading = true;
+
+            policyService.findAllWithCallback(function(policies){
+                    map.policies = policies;
+                    map.policiesLoading = false;
+                }
+            );
+
+        }
+
+        function mapToPdp() {
+
+            if (formService.isInvalid(map.form)) {
+
+                formService.checkFieldsValidity(map.form);
+
+            } else {
+
+                map.mappingLoading = true;
+
+                var pdpToSend = angular.copy(map.pdp);
+
+                pdpToSend.security_pipeline.push(map.selectedPolicy.id);
+
+                pdpService.update(pdpToSend, mapSuccess, mapError);
+
+            }
+
+            function mapSuccess(data) {
+
+                var pdpReceived = utilService.transformOne(data, 'pdps');
+
+
+                $translate('moon.policy.map.success', {pdpName: pdpReceived.name, policyName: map.selectedPolicy.name}).then(function (translatedValue) {
+
+                    alertService.alertSuccess(translatedValue);
+
+                });
+
+                map.mappingLoading = false;
+
+                $scope.$emit('event:policyMapToPdpSuccess', pdpReceived);
+
+            }
+
+            function mapError(response) {
+
+                $translate('moon.policy.map.error', {
+
+                    pdpName: map.pdp.name,
+                    policyName: map.selectedPolicy.name
+
+                }).then(function (translatedValue) {
+
+                    alertService.alertError(translatedValue);
+
+                });
+
+                map.mappingLoading = false;
+
+                $scope.$emit('event:policyMapToPdpError');
+
+            }
+        }
+
+
+
+    }
+
+})();
\ No newline at end of file
diff --git a/moonv4/moon_gui/static/app/policy/action/mapping/policy.controller.unmap.js b/moonv4/moon_gui/static/app/policy/action/mapping/policy.controller.unmap.js
new file mode 100644
index 00000000..d309ec0f
--- /dev/null
+++ b/moonv4/moon_gui/static/app/policy/action/mapping/policy.controller.unmap.js
@@ -0,0 +1,74 @@
+/**
+ * @author arnaud marhin<arnaud.marhin@orange.com>
+ */
+
+(function() {
+
+    'use strict';
+
+    angular
+        .module('moon')
+        .controller('PolicyUnMapController', PolicyUnMapController);
+
+    PolicyUnMapController.$inject = ['$scope', '$translate', 'alertService', 'pdpService', 'utilService'];
+
+    function PolicyUnMapController($scope, $translate, alertService, pdpService, utilService) {
+
+        var unmap = this;
+
+        /*
+         *
+         */
+
+        unmap.pdp = $scope.pdp;
+        unmap.policy = $scope.policy;
+
+        unmap.unMappingLoading = false;
+
+        unmap.unmap = unMapPolicyToPdp;
+
+        /*
+         *
+         */
+
+        function unMapPolicyToPdp() {
+
+            unmap.unMappingLoading = true;
+
+            var pdpToUpdate = angular.copy(unmap.pdp);
+
+            pdpToUpdate.security_pipeline = _.without(pdpToUpdate.security_pipeline, unmap.policy.id);
+
+            pdpService.update(pdpToUpdate, unMapSuccess, unMapError);
+
+            function unMapSuccess(data) {
+
+                $translate('moon.policy.unmap.success', { pdpName: unmap.pdp.name, policyName: unmap.policy.name })
+                    .then(function (translatedValue) {
+                        alertService.alertSuccess(translatedValue);
+                    });
+
+                unmap.unMappingLoading = false;
+
+                $scope.$emit('event:policyUnMappedToPdpSuccess',  utilService.transformOne(data, 'pdps'));
+
+            }
+
+            function unMapError(reason) {
+
+                $translate('moon.policy.unmap.error', { pdpName: unmap.pdp.name, policyName: unmap.policy.name })
+                    .then(function (translatedValue) {
+                        alertService.alertError(translatedValue);
+                    });
+
+                unmap.unMappingLoading = false;
+
+                $scope.$emit('event:policyUnMappedToPdpError');
+
+            }
+
+        }
+
+    }
+
+})();
diff --git a/moonv4/moon_gui/static/app/policy/action/policy-add.tpl.html b/moonv4/moon_gui/static/app/policy/action/policy-add.tpl.html
new file mode 100644
index 00000000..d20c41be
--- /dev/null
+++ b/moonv4/moon_gui/static/app/policy/action/policy-add.tpl.html
@@ -0,0 +1,113 @@
+<div ng-controller="PolicyAddController as add" class="modal" tabindex="-1" data-role="modalAddPolicy">
+
+    <div class="modal-dialog">
+
+        <div class="modal-content">
+
+            <div class="modal-header">
+                <button type="button" class="close" ng-click="$hide()">&times;</button>
+                <h4 class="modal-title" data-translate="moon.policy.add.title"></h4>
+            </div>
+
+            <div class="modal-body">
+
+                <form class="form-horizontal" role="form" name="add.form">
+
+                    <div class="form-group" ng-class="{'has-error': add.form.name.$invalid && add.form.name.$dirty}">
+
+                        <label for="name" class="col-sm-3 control-label" data-translate="moon.policy.add.form.name">Name</label>
+
+                        <div class="col-sm-6">
+
+                            <input name="name" id="name" class="form-control" type="text" data-ng-model="add.policy.name" required />
+
+                            <div class="help-block" ng-show="add.form.name.$dirty && add.form.name.$invalid">
+                                <small class="error" ng-show="add.form.name.$error.required" data-translate="moon.policy.add.check.name.required">Name is required</small>
+                            </div>
+
+                        </div>
+
+                    </div>
+
+
+                    <div class="form-group" ng-class="{'has-error': add.form.genre.$dirty && (add.form.genre.$invalid || !add.selectedGenre)}">
+
+                        <label class="col-sm-3 control-label" data-translate="moon.policy.add.form.genre">Genre</label>
+
+                        <div class="col-sm-6">
+
+                            <ui-select ng-model="add.selectedGenre" name="genre" required>
+                                <ui-select-match placeholder="(None)">{{$select.selected}}</ui-select-match>
+                                <ui-select-choices repeat="genre in add.genres">
+                                    <div ng-value="genre">{{genre}}</div>
+                                </ui-select-choices>
+                            </ui-select>
+
+                            <div class="help-block" ng-show="add.form.genre.$dirty && (add.form.genre.$invalid || !add.selectedPolicy)">
+                                <small class="error" ng-show="add.form.genre.$error.required" data-translate="moon.policy.add.check.genre.required">Genre is required</small>
+                            </div>
+
+                        </div>
+
+                    </div>
+
+                    <div class="form-group" ng-class="{'has-error': add.form.model.$dirty && (add.form.model.$invalid || !add.selectedModel)}">
+
+                        <label class="col-sm-3 control-label" data-translate="moon.policy.add.form.model">Models</label>
+
+                        <div class="col-sm-6">
+
+                            <ui-select ng-model="add.selectedModel" name="model" required>
+                                <ui-select-match placeholder="(None)">{{$select.selected.name}}</ui-select-match>
+                                <ui-select-choices repeat="model in add.models">
+                                    <div ng-value="model">{{model.name}}</div>
+                                </ui-select-choices>
+                            </ui-select>
+
+                            <moon-loader ng-if="add.modelsLoading"></moon-loader>
+
+                            <div class="help-block" ng-show="add.form.model.$dirty && (add.form.model.$invalid || !add.selectedModel)">
+                                <small class="error" ng-show="add.form.model.$error.required" data-translate="moon.policy.add.check.model.required">Model is required</small>
+                            </div>
+
+                        </div>
+
+                    </div>
+
+
+                    <div class="form-group">
+
+                        <label for="description" class="col-sm-3 control-label" data-translate="moon.policy.add.form.description">Description</label>
+                        <div class="col-sm-6">
+                            <textarea id="description" name="description" class="form-control" data-ng-model="add.policy.description"></textarea>
+                        </div>
+
+                    </div>
+
+                </form>
+
+            </div>
+
+            <div class="modal-footer">
+
+                <div class="btn-toolbar" style="float: right;">
+
+                    <a href="" ng-click="$hide()" class="btn btn-default">
+                        <span data-translate="moon.policy.add.action.cancel">Cancel</span>
+                    </a>
+
+                    <a href="" ng-disabled="add.loading" ng-click="add.create()" class="btn btn-warning">
+                        <span class="glyphicon glyphicon-save"></span>
+                        <span data-translate="moon.policy.add.action.create">Create Policy</span>
+                    </a>
+                    <moon-loader ng-if="add.loading"></moon-loader>
+
+                </div>
+
+            </div>
+
+        </div>
+
+    </div>
+
+</div>
diff --git a/moonv4/moon_gui/static/app/policy/action/policy-delete.tpl.html b/moonv4/moon_gui/static/app/policy/action/policy-delete.tpl.html
new file mode 100644
index 00000000..3b5df88b
--- /dev/null
+++ b/moonv4/moon_gui/static/app/policy/action/policy-delete.tpl.html
@@ -0,0 +1,40 @@
+<div ng-controller="PolicyDeleteController as del" class="modal" tabindex="-1" data-role="modalDeletePolicy">
+
+    <div class="modal-dialog">
+
+        <div class="modal-content">
+
+            <div class="modal-header">
+                <button type="button" class="close" ng-click="$hide()">&times;</button>
+                <h4 class="modal-title" data-translate="moon.policy.remove.title"></h4>
+            </div>
+
+            <div class="modal-body">
+                <p><span data-translate="moon.policy.remove.content.query" data-translate-values="{ policyName: del.policy.name }"></span></p>
+
+            </div>
+
+            <div class="modal-footer">
+
+                <div class="btn-toolbar" style="float: right;">
+
+                    <a href="" ng-click="$hide()" class="btn btn-default">
+                        <span data-translate="moon.policy.remove.action.cancel">Cancel</span>
+                    </a>
+
+                    <a href="" ng-disabled="del.loading" ng-click="del.remove()" class="btn btn-warning">
+                        <span class="glyphicon glyphicon-trash"></span>
+                        <span data-translate="moon.policy.remove.action.delete">Delete</span>
+                    </a>
+
+                    <moon-loader  ng-if="del.loading" ></moon-loader>
+
+                </div>
+
+            </div>
+
+        </div>
+
+    </div>
+
+</div>
\ No newline at end of file
diff --git a/moonv4/moon_gui/static/app/policy/action/policy.controller.add.js b/moonv4/moon_gui/static/app/policy/action/policy.controller.add.js
new file mode 100644
index 00000000..0320c2e9
--- /dev/null
+++ b/moonv4/moon_gui/static/app/policy/action/policy.controller.add.js
@@ -0,0 +1,113 @@
+(function() {
+
+    'use strict';
+
+    angular
+        .module('moon')
+        .controller('PolicyAddController', PolicyAddController);
+
+    PolicyAddController.$inject = ['$scope', '$translate', 'alertService', 'formService', 'policyService', 'utilService', 'modelService'];
+
+    function PolicyAddController($scope, $translate, alertService, formService, policyService, utilService, modelService) {
+
+        var add = this;
+
+        /*
+         *
+         */
+
+        add.loading = false;
+
+        add.form = {};
+
+        add.policy =  {name: null, genre: null, description: null, model_id: null};
+
+        add.genres = ['admin', 'authz'];
+
+        add.models = [];
+
+        add.modelsLoading = true;
+
+        add.create = createPolicy;
+
+
+        activate();
+
+        function activate(){
+
+            resolveModels();
+
+        }
+
+        /*
+         *
+         */
+
+        function resolveModels() {
+
+            modelService.findAllWithCallBack(resolveModelsCallback);
+
+        }
+
+        function resolveModelsCallback(models) {
+
+            add.models = models;
+
+            add.modelsLoading = false;
+
+        }
+
+
+        function createPolicy() {
+
+            if(formService.isInvalid(add.form)) {
+
+                formService.checkFieldsValidity(add.form);
+
+            } else {
+
+
+                add.loading = true;
+
+                policyService.data.policy.create({}, {
+
+                    name: add.policy.name,
+                    description: add.policy.description,
+                    genre: [add.selectedGenre],
+                    model_id: add.selectedModel.id
+
+                }, createSuccess, createError);
+
+            }
+
+            function createSuccess(data) {
+
+                var createdPolicy = utilService.transformOne(data, 'policies');
+
+                $translate('moon.policy.add.success', { policyName: createdPolicy.name }).then(function (translatedValue) {
+                    alertService.alertSuccess(translatedValue);
+                });
+
+                add.loading = false;
+
+                $scope.$emit('event:policyCreatedSuccess', createdPolicy);
+
+            }
+
+            function createError(reason) {
+
+                $translate('moon.policy.add.error', { policyName: add.model.name }).then(function (translatedValue) {
+                    alertService.alertError(translatedValue);
+                });
+
+                add.loading = false;
+
+                $scope.$emit('event:policyCreatedError', add.project);
+
+            }
+
+        }
+
+    }
+
+})();
diff --git a/moonv4/moon_gui/static/app/policy/action/policy.controller.delete.js b/moonv4/moon_gui/static/app/policy/action/policy.controller.delete.js
new file mode 100644
index 00000000..9a718ddc
--- /dev/null
+++ b/moonv4/moon_gui/static/app/policy/action/policy.controller.delete.js
@@ -0,0 +1,69 @@
+
+(function() {
+
+    'use strict';
+
+    angular
+        .module('moon')
+        .controller('PolicyDeleteController', PolicyDeleteController);
+
+    PolicyDeleteController.$inject = ['$scope', '$translate', 'alertService', 'policyService'];
+
+    function PolicyDeleteController($scope, $translate, alertService, policyService) {
+
+        var del = this;
+
+        /*
+         *
+         */
+
+        del.policy = $scope.policy;
+        del.loading = false;
+
+        del.remove = deletePolicy;
+
+        activate();
+
+        /**
+         *
+         */
+
+        function activate(){
+
+        }
+
+
+        function deletePolicy(){
+
+            del.loading = true;
+
+            policyService.delete(del.policy, deleteSuccess, deleteError);
+
+            function deleteSuccess(data) {
+
+                $translate('moon.policy.remove.success', { policyName: del.policy.name }).then(function (translatedValue) {
+                    alertService.alertSuccess(translatedValue);
+                });
+
+                del.loading = false;
+
+                $scope.$emit('event:policyDeletedSuccess', del.policy);
+
+            }
+
+            function deleteError(reason) {
+
+                $translate('moon.policy.remove.error', { policyName: del.policy.name, errorCode: reason.data.error.code, message : reason.data.error.message } ).then(function (translatedValue) {
+                    alertService.alertError(translatedValue);
+                });
+
+                del.loading = false;
+
+                $scope.$emit('event:policyDeletedError', del.policy);
+
+            }
+
+        }
+    }
+
+})();
diff --git a/moonv4/moon_gui/static/app/policy/edit/parameter/assignments/assignments-list.tpl.html b/moonv4/moon_gui/static/app/policy/edit/parameter/assignments/assignments-list.tpl.html
new file mode 100644
index 00000000..0f919a4a
--- /dev/null
+++ b/moonv4/moon_gui/static/app/policy/edit/parameter/assignments/assignments-list.tpl.html
@@ -0,0 +1,323 @@
+<div>
+    <div class="panel panel-default">
+
+        <div class="panel-heading">
+
+            <h4 data-translate="moon.policy.assignments.subject.title">List of associated Subjects</h4>
+
+        </div>
+
+        <div class="panel-body">
+
+            <div class="table-responsive">
+
+                <table class="table table-striped">
+
+                    <thead>
+                    <tr>
+                        <th data-translate="moon.policy.assignments.table.perimeter.name">Perimeter name</th>
+                        <th data-translate="moon.policy.assignments.table.category.name">Category name</th>
+                        <th data-translate="moon.policy.assignments.table.data.name">Data name</th>
+                        <!--<th data-translate="moon.policy.assignments.table.action.title"></th>-->
+                    </tr>
+                    </thead>
+
+                    <moon-loader ng-if="list.loadingSub"></moon-loader>
+
+                    <tbody ng-if="!list.loadingSub && list.getSubjects().length > 0">
+
+                        <tr ng-repeat="(key, value) in list.subjects">
+
+                            <td>
+                                <div ng-if="!list.getPerimeterFromAssignment(value, list.typeOfSubject)">
+                                    <moon-loader ng-if="!list.getPerimeterFromAssignment(value)" ></moon-loader>
+                                    <em data-translate="moon.policy.assignments.table.loading.perimeter">Loading </em>
+                                </div>
+
+                                <div ng-if="list.getPerimeterFromAssignment(value)">
+                                    <span ng-bind="value.category.name"></span>
+                                </div>
+
+                            </td>
+
+                            <td>
+
+                                <div ng-if="!list.getCategoryFromAssignment(value, list.typeOfSubject)">
+                                    <moon-loader ng-if="!list.getCategoryFromAssignment(value)" ></moon-loader>
+                                    <em data-translate="moon.policy.assignments.table.loading.category">Loading </em>
+                                </div>
+
+                                <div ng-if="list.getCategoryFromAssignment(value)">
+                                    <span ng-bind="value.category.name"></span>
+                                </div>
+
+                            </td>
+
+                            <td>
+
+                                <span ng-repeat="(index, id) in value.assignments">
+
+                                     <span ng-if="!list.getDataFromAssignmentsIndex(index, value, list.typeOfSubject)">
+                                        <moon-loader ng-if="!list.getDataFromAssignmentsIndex(index, value, list.typeOfSubject)" ></moon-loader>
+                                    </span>
+
+                                    <span ng-if="list.getDataFromAssignmentsIndex(index, value, list.typeOfSubject)">
+                                        <span ng-bind="value.assignments_value[index].data.name"></span>
+
+                                        <span ng-if="index < value.assignments.length-1">,</span>
+                                    </span>
+
+                                </span>
+
+                            </td>
+
+                        </tr>
+                    </tbody>
+
+
+                    <tbody ng-if="!list.loadingSub && list.getSubjects().length === 0">
+                    <tr>
+                        <td data-translate="moon.policy.assignments.subject.notFound">There is no Subjects</td>
+                        <td></td>
+                        <td></td>
+                    </tr>
+                    </tbody>
+
+                </table>
+
+            </div>
+
+        </div>
+
+    </div>
+
+    <div ng-if="list.editMode" class="panel panel-default">
+
+        <div class="panel-heading">
+
+            <h4 data-translate="moon.policy.assignments.subject.add.title">Add a Subject Category</h4>
+
+        </div>
+
+        <div class="panel-body">
+
+            <moon-meta-data-edit meta-rule="list.metaRule" meta-data-type="list.typeOfSubject"></moon-meta-data-edit>
+
+        </div>
+
+    </div>
+
+    <div class="panel panel-default">
+
+        <div class="panel-heading">
+
+            <h4 data-translate="moon.policy.assignments.object.title">List associated of Objects</h4>
+
+        </div>
+
+        <div class="panel-body">
+
+            <div class="table-responsive">
+
+                <table class="table table-striped">
+
+                    <thead>
+                    <tr>
+                        <th data-translate="moon.policy.assignments.table.perimeter.name">Perimeter name</th>
+                        <th data-translate="moon.policy.assignments.table.category.name">Category name</th>
+                        <th data-translate="moon.policy.assignments.table.data.name">Data name</th>
+
+                        <!--<th data-translate="moon.policy.assignments.table.action.title"></th>-->
+                    </tr>
+                    </thead>
+
+                    <moon-loader ng-if="list.loadingObj"></moon-loader>
+
+                    <tbody ng-if="!list.loadingObj && list.getObjects().length > 0">
+                        <tr ng-repeat="(key, value) in list.objects">
+                            <td>
+
+                                <div ng-if="!list.getPerimeterFromAssignment(value, list.typeOfObject)">
+                                    <moon-loader ng-if="!list.getPerimeterFromAssignment(value)" ></moon-loader>
+                                    <em data-translate="moon.policy.assignments.table.loading.perimeter">Loading </em>
+                                </div>
+
+                                <div ng-if="list.getPerimeterFromAssignment(value)">
+                                    <span ng-bind="value.category.name"></span>
+                                </div>
+
+                            </td>
+
+                            <td>
+
+                                <div ng-if="!list.getCategoryFromAssignment(value, list.typeOfObject)">
+                                    <moon-loader ng-if="!list.getCategoryFromAssignment(value)" ></moon-loader>
+                                    <em data-translate="moon.policy.assignments.table.loading.category">Loading </em>
+                                </div>
+
+                                <div ng-if="list.getCategoryFromAssignment(value)">
+                                    <span ng-bind="value.category.name"></span>
+                                </div>
+
+                            </td>
+
+                            <td>
+                                <span ng-repeat="(index, id) in value.assignments">
+
+                                     <span ng-if="!list.getDataFromAssignmentsIndex(index, value, list.typeOfObject)">
+                                        <moon-loader ng-if="!list.getDataFromAssignmentsIndex(index, value, list.typeOfObject)" ></moon-loader>
+                                    </span>
+
+                                    <span ng-if="list.getDataFromAssignmentsIndex(index, value, list.typeOfObject)">
+                                        <span ng-if="value.assignments_value[index].data.name" ng-bind="value.assignments_value[index].data.name"></span>
+                                        <span ng-if="value.assignments_value[index].data.value.name" ng-bind="value.assignments_value[index].data.value.name"></span>
+
+                                        <span ng-if="index < value.assignments.length-1">,</span>
+                                    </span>
+
+                                </span>
+                            </td>
+
+                        </tr>
+                    </tbody>
+
+                    <tbody ng-if="!list.loadingObj && list.getObjects().length === 0">
+                    <tr>
+                        <td data-translate="moon.policy.assignments.object.notFound">There is no Objects</td>
+                        <td></td>
+                        <td></td>
+                    </tr>
+                    </tbody>
+
+                </table>
+
+            </div>
+
+        </div>
+
+    </div>
+
+    <div ng-if="list.editMode" class="panel panel-default">
+
+        <div class="panel-heading">
+
+            <h4 data-translate="moon.policy.assignments.object.add.title">Add an Object Category</h4>
+
+        </div>
+
+        <div class="panel-body">
+
+            <moon-meta-data-edit meta-rule="list.metaRule" meta-data-type="list.typeOfObject"></moon-meta-data-edit>
+
+        </div>
+
+    </div>
+
+    <div class="panel panel-default">
+
+        <div class="panel-heading">
+
+            <h4 data-translate="moon.policy.assignments.action.title">List associated of Actions</h4>
+
+        </div>
+
+        <div class="panel-body">
+
+            <div class="table-responsive">
+
+                <table class="table table-striped">
+
+                    <thead>
+                    <tr>
+                        <th data-translate="moon.policy.assignments.table.perimeter.name">Perimeter name</th>
+                        <th data-translate="moon.policy.assignments.table.category.name">Category name</th>
+                        <th data-translate="moon.policy.assignments.table.data.name">Data name</th>
+
+                        <!--<th data-translate="moon.policy.assignments.table.action.title"></th>-->
+                    </tr>
+                    </thead>
+
+                    <moon-loader ng-if="list.loadingAct"></moon-loader>
+
+                    <tbody ng-if="!list.loadingAct && list.getActions().length > 0">
+                    <tr ng-repeat="(key, value) in list.actions">
+
+                        <td>
+                            <div ng-if="!list.getPerimeterFromAssignment(value, list.typeOfAction)">
+                                <moon-loader ng-if="!list.getPerimeterFromAssignment(value)" ></moon-loader>
+                                <em data-translate="moon.policy.assignments.table.loading.perimeter">Loading </em>
+                            </div>
+
+                            <div ng-if="list.getPerimeterFromAssignment(value)">
+                                <span ng-bind="value.perimeter.name"></span>
+                            </div>
+                        </td>
+
+                        <td>
+
+                            <div ng-if="!list.getCategoryFromAssignment(value, list.typeOfAction)">
+                                <moon-loader ng-if="!list.getCategoryFromAssignment(value)" ></moon-loader>
+                                <em data-translate="moon.policy.assignments.table.loading.category">Loading </em>
+                            </div>
+
+                            <div ng-if="list.getCategoryFromAssignment(value)">
+                                <span ng-bind="value.category.name"></span>
+                            </div>
+
+                        </td>
+
+                        <td>
+
+                            <span ng-repeat="(index, id) in value.assignments">
+
+                                <span ng-if="!list.getDataFromAssignmentsIndex(index, value, list.typeOfAction)">
+                                    <moon-loader ng-if="!list.getDataFromAssignmentsIndex(index, value, list.typeOfAction)" ></moon-loader>
+                                </span>
+
+                                <span ng-if="list.getDataFromAssignmentsIndex(index, value, list.typeOfAction)">
+                                    <span ng-if="value.assignments_value[index].data.name" ng-bind="value.assignments_value[index].data.name"></span>
+                                    <span ng-if="value.assignments_value[index].data.value.name" ng-bind="value.assignments_value[index].data.value.name"></span>
+
+                                    <span ng-if="index < value.assignments.length-1">,</span>
+                                </span>
+
+                            </span>
+
+                        </td>
+                    </tr>
+                    </tbody>
+
+                    <tbody ng-if="!list.loadingAct && list.getActions().length === 0">
+                    <tr>
+                        <td data-translate="moon.policy.assignments.action.notFound">There is no Actions</td>
+                        <td></td>
+                        <td></td>
+                    </tr>
+                    </tbody>
+
+                </table>
+
+            </div>
+
+
+        </div>
+
+    </div>
+
+    <div ng-if="list.editMode" class="panel panel-default">
+
+        <div class="panel-heading">
+
+            <h4 data-translate="moon.policy.assignments.action.add.title">Add an Action Category</h4>
+
+        </div>
+
+        <div class="panel-body">.
+
+            <moon-meta-data-edit meta-rule="list.metaRule" meta-data-type="list.typeOfAction"></moon-meta-data-edit>
+
+        </div>
+
+    </div>
+
+</div>
\ No newline at end of file
diff --git a/moonv4/moon_gui/static/app/policy/edit/parameter/assignments/assignments.list.dir.js b/moonv4/moon_gui/static/app/policy/edit/parameter/assignments/assignments.list.dir.js
new file mode 100644
index 00000000..747fd487
--- /dev/null
+++ b/moonv4/moon_gui/static/app/policy/edit/parameter/assignments/assignments.list.dir.js
@@ -0,0 +1,500 @@
+(function() {
+
+    'use strict';
+
+    angular
+        .module('moon')
+        .directive('moonAssignmentsList', moonAssignmentsList);
+
+    moonAssignmentsList.$inject = [];
+
+    function moonAssignmentsList() {
+
+        return {
+            templateUrl : 'html/policy/edit/parameter/assignments/assignments-list.tpl.html',
+            bindToController : true,
+            controller : moonAssignmentsListController,
+            controllerAs : 'list',
+            scope : {
+                policy: '=',
+                editMode : '='
+            },
+            restrict : 'E',
+            replace : true
+        };
+    }
+
+    angular
+        .module('moon')
+        .controller('moonAssignmentsListController', moonAssignmentsListController);
+
+    moonAssignmentsListController.$inject = ['$scope', '$rootScope', 'assignmentService', '$translate', 'alertService', 'policyService', 'ASSIGNMENTS_CST', 'utilService', 'metaDataService', 'perimeterService', 'dataService'];
+
+    function moonAssignmentsListController($scope, $rootScope, assignmentService, $translate, alertService, policyService, ASSIGNMENTS_CST, utilService, metaDataService, perimeterService, dataService){
+
+        var list = this;
+
+        list.policy = $scope.list.policy;
+        list.editMode = $scope.list.editMode;
+
+        list.typeOfSubject = ASSIGNMENTS_CST.TYPE.SUBJECT;
+        list.typeOfObject = ASSIGNMENTS_CST.TYPE.OBJECT;
+        list.typeOfAction = ASSIGNMENTS_CST.TYPE.ACTION;
+
+        list.unMapSub = unMapSub;
+        list.unMapObj = unMapObj;
+        list.unMapAct = unMapAct;
+
+        list.deleteSub = deleteSub;
+        list.deleteObj = deleteObj;
+        list.deleteAct = deleteAct;
+
+        list.getSubjects = getSubjects;
+        list.getObjects = getObjects;
+        list.getActions = getActions;
+
+        list.getCategoryFromAssignment = getCategoryFromAssignment;
+        list.getPerimeterFromAssignment = getPerimeterFromAssignment;
+        list.getDataFromAssignmentsIndex = getDataFromAssignmentsIndex;
+
+        activate();
+
+        function activate(){
+
+            manageSubjects();
+
+            manageObjects();
+
+            manageActions();
+
+        }
+
+        var rootListeners = {
+
+            'event:deleteDataFromDataAddSuccess': $rootScope.$on('event:deleteDataFromDataAddSuccess', deletePolicy)
+
+        };
+
+        for (var unbind in rootListeners) {
+            $scope.$on('$destroy', rootListeners[unbind]);
+        }
+
+
+        function manageSubjects(){
+
+            list.loadingSub = true;
+
+            assignmentService.subject.findAllFromPolicyWithCallback(list.policy.id, function(data){
+
+                console.log('subjects');
+                console.log(data);
+                list.subjects = data;
+                list.loadingSub = false;
+
+            });
+        }
+
+        function manageObjects(){
+
+            list.loadingObj = true;
+
+            assignmentService.object.findAllFromPolicyWithCallback(list.policy.id, function(data){
+
+                console.log('objects');
+                console.log(data);
+                list.objects = data;
+                list.loadingObj = false;
+
+            });
+
+        }
+
+        function manageActions(){
+
+            list.loadingAct = true;
+
+            assignmentService.action.findAllFromPolicyWithCallback(list.policy.id, function(data){
+
+                console.log('actions');
+                console.log(data);
+                list.actions = data;
+                list.loadingAct = false;
+
+            });
+
+        }
+
+        function getPerimeterFromAssignment(assignment, type) {
+
+            if(_.has(assignment, 'perimeter')){
+                return assignment.perimeter;
+            }
+
+            // if the call has not been made
+            if(!_.has(assignment, 'callPerimeterInProgress')){
+
+                assignment.callPerimeterInProgress = true;
+
+                switch(type){
+
+                    case ASSIGNMENTS_CST.TYPE.SUBJECT:
+                        perimeterService.subject.findOneFromPolicyWithCallback(list.policy.id, assignment.subject_id, setPerimeterToAssignment);
+                        break;
+
+                    case ASSIGNMENTS_CST.TYPE.OBJECT:
+                        perimeterService.object.findOneFromPolicyWithCallback(list.policy.id, assignment.object_id, setPerimeterToAssignment);
+                        break;
+
+                    case ASSIGNMENTS_CST.TYPE.ACTION:
+                        perimeterService.action.findOneFromPolicyWithCallback(list.policy.id, assignment.action_id, setPerimeterToAssignment);
+                        break;
+
+                }
+
+            }
+
+            // if the call is in progress return false
+            return false;
+
+            function setPerimeterToAssignment(perimeter){
+
+                assignment.callPerimeterInProgress = false;
+                assignment.perimeter = perimeter;
+
+            }
+        }
+
+        function getCategoryFromAssignment(data, type) {
+
+            if(_.has(data, 'category')){
+                return data.category;
+            }
+
+            // if the call has not been made
+            if(!_.has(data, 'callCategoryInProgress')){
+
+                data.callCategoryInProgress = true;
+
+                switch(type){
+
+                    case ASSIGNMENTS_CST.TYPE.SUBJECT:
+                        metaDataService.subject.findOne(data.subject_cat_id, setCategoryToData);
+                        break;
+
+                    case ASSIGNMENTS_CST.TYPE.OBJECT:
+                        metaDataService.object.findOne(data.object_cat_id, setCategoryToData);
+                        break;
+
+                    case ASSIGNMENTS_CST.TYPE.ACTION:
+                        metaDataService.action.findOne(data.action_cat_id, setCategoryToData);
+                        break;
+
+                }
+
+            }
+
+            // if the call is in progress return false
+            return false;
+
+            function setCategoryToData(category){
+
+                data.callCategoryInProgress = false;
+                data.category = category;
+
+            }
+        }
+
+        /**
+         * Prerequisite : meta Rule  should be completely loaded
+         * @param index
+         * @param assignment
+         * @param type
+         */
+        function getDataFromAssignmentsIndex(index, assignment, type){
+
+            if(!_.has(assignment, 'assignments_value')){
+                // setting an array which will contains every value of the category
+                assignment.assignments_value = Array.apply(null, new Array(assignment.assignments.length)).map(function(){
+                    return {
+                        data: {}
+                    }
+                });
+            }
+
+            if(_.has(assignment.assignments_value[index], 'callDataInProgress') && !assignment.assignments_value[index].callDataInProgress ){
+                return assignment.assignments_value[index].data;
+            }
+
+            // if the call has not been made
+            if(!_.has(assignment.assignments_value[index], 'callDataInProgress')){
+
+                assignment.assignments_value[index].callDataInProgress = true;
+
+                switch(type){
+
+                    case ASSIGNMENTS_CST.TYPE.SUBJECT:
+                        dataService.subject.data.findOne(list.policy.id, assignment.category_id, assignment.assignments[index], setDataToAssignment);
+                        break;
+
+                    case ASSIGNMENTS_CST.TYPE.OBJECT:
+                        dataService.object.data.findOne(list.policy.id, assignment.category_id, assignment.assignments[index], setDataToAssignment);
+                        break;
+
+                    case ASSIGNMENTS_CST.TYPE.ACTION:
+                        dataService.action.data.findOne(list.policy.id, assignment.category_id, assignment.assignments[index], setDataToAssignment);
+                        break;
+
+                }
+
+            }
+
+            // if the call is in progress return false
+            return false;
+
+            function setDataToAssignment(data){
+
+                assignment.assignments_value[index].callDataInProgress = false;
+                assignment.assignments_value[index].data = data;
+
+            }
+        }
+
+
+
+        /**
+         * UnMap
+         */
+
+        function unMapSub(subject){
+
+            subject.loader = true;
+
+            var policyToSend = angular.copy(list.policy);
+
+            policyToSend.subject_categories = _.without(policyToSend.subject_categories, subject.id);
+
+            policyService.update(policyToSend, updatePolicySuccess, updatePolicyError);
+
+            function updatePolicySuccess(data){
+
+                $translate('moon.policy.metarules.update.success', { policyName: list.policy.name }).then( function(translatedValue) {
+                    alertService.alertSuccess(translatedValue);
+                });
+
+                list.policy = policyService.findDataFromPolicy(utilService.transformOne(data, 'meta_rules'));
+
+                activate();
+
+                subject.loader = false;
+
+            }
+
+            function updatePolicyError(reason){
+
+                $translate('moon.policy.metarules.update.error', { policyName: list.policy.name, reason: reason.message}).then( function(translatedValue) {
+                    alertService.alertError(translatedValue);
+                });
+
+                subject.loader = false;
+
+            }
+
+        }
+
+        function unMapObj(object){
+
+            object.loader = true;
+
+            var policyToSend = angular.copy(list.policy);
+
+            policyToSend.object_categories = _.without(policyToSend.object_categories, object.id);
+
+            policyService.update(policyToSend, updatePolicySuccess, updatePolicyError);
+
+            function updatePolicySuccess(data){
+
+                $translate('moon.policy.metarules.update.success', { policyName: list.policy.name }).then( function(translatedValue) {
+                    alertService.alertSuccess(translatedValue);
+                });
+
+                list.policy = policyService.findDataFromPolicy(utilService.transformOne(data, 'meta_rules'));
+
+                activate();
+
+                object.loader = false;
+
+            }
+
+            function updatePolicyError(reason){
+
+                $translate('moon.policy.metarules.update.error', { policyName: list.policy.name, reason: reason.message}).then( function(translatedValue) {
+                    alertService.alertError(translatedValue);
+                });
+
+                object.loader = false;
+
+            }
+
+        }
+
+        function unMapAct(action){
+
+            action.loader = true;
+
+            var policyToSend = angular.copy(list.policy);
+
+            policyToSend.action_categories = _.without(policyToSend.action_categories, action.id);
+
+            policyService.update(policyToSend, updatePolicySuccess, updatePolicyError);
+
+            function updatePolicySuccess(data){
+
+                $translate('moon.policy.metarules.update.success', { policyName: list.policy.name }).then( function(translatedValue) {
+                    alertService.alertSuccess(translatedValue);
+                });
+
+                list.policy = policyService.findDataFromPolicy(utilService.transformOne(data, 'meta_rules'));
+
+                activate();
+
+                action.loader = false;
+
+            }
+
+            function updatePolicyError(reason){
+
+                $translate('moon.policy.metarules.update.error', { policyName: list.policy.name, reason: reason.message}).then( function(translatedValue) {
+                    alertService.alertError(translatedValue);
+                });
+
+                action.loader = false;
+
+            }
+
+        }
+
+        /**
+         * Delete
+         */
+
+        function deleteSub(subject){
+
+            subject.loader = true;
+
+            assignmentService.subject.delete(subject, deleteSubSuccess, deleteSubError);
+
+            function deleteSubSuccess(data){
+
+                $translate('moon.policy.perimeter.subject.delete.success', { subjectName: subject.name }).then( function(translatedValue) {
+                    alertService.alertSuccess(translatedValue);
+                });
+
+                removeSubFromSubList(subject);
+
+                subject.loader = false;
+
+            }
+
+            function deleteSubError(reason){
+
+                $translate('moon.policy.perimeter.subject.delete.error', { subjectName: subject.name, reason: reason.message}).then( function(translatedValue) {
+                    alertService.alertError(translatedValue);
+                });
+
+                subject.loader = false;
+
+            }
+        }
+
+        function deleteObj(object){
+
+            object.loader = true;
+
+            assignmentService.object.delete(object, deleteObjSuccess, deleteObjError);
+
+            function deleteObjSuccess(data){
+
+                $translate('moon.policy.perimeter.object.delete.success', { objectName: object.name }).then( function(translatedValue) {
+                    alertService.alertSuccess(translatedValue);
+                });
+
+                removeObjFromObjList(object);
+
+                object.loader = false;
+
+            }
+
+            function deleteObjError(reason){
+
+                $translate('moon.policy.perimeter.object.delete.error', { objectName: object.name, reason: reason.message}).then( function(translatedValue) {
+                    alertService.alertError(translatedValue);
+                });
+
+                object.loader = false;
+            }
+        }
+
+        function deleteAct(action){
+
+            action.loader = true;
+
+            assignmentService.action.delete(action, deleteActSuccess, deleteActError);
+
+            function deleteActSuccess(data){
+
+                $translate('moon.policy.perimeter.action.delete.success', { actionName: action.name }).then( function(translatedValue) {
+                    alertService.alertSuccess(translatedValue);
+                });
+
+                removeActFromActList(action);
+
+                action.loader = false;
+
+            }
+
+            function deleteActError(reason){
+
+                $translate('moon.policy.perimeter.action.delete.error', { actionName: action.name, reason: reason.message}).then( function(translatedValue) {
+                    alertService.alertError(translatedValue);
+                });
+
+                action.loader = false;
+
+            }
+        }
+
+        function getSubjects(){
+            return list.subjects ? list.subjects : [];
+        }
+
+        function getObjects(){
+            return list.objects ? list.objects : [];
+        }
+
+        function getActions(){
+            return list.actions ? list.actions : [];
+        }
+
+        function removeSubFromSubList(subject){
+            list.subjects = _.without(list.subjects, subject);
+        }
+
+        function removeObjFromObjList(object){
+            list.objects = _.without(list.objects, object);
+        }
+
+        function removeActFromActList(action){
+            list.actions = _.without(list.actions, action);
+        }
+
+        function deletePolicy( event, policy){
+
+            list.policy = policy;
+
+            activate();
+
+        }
+
+    }
+
+})();
\ No newline at end of file
diff --git a/moonv4/moon_gui/static/app/policy/edit/parameter/data/data-list.tpl.html b/moonv4/moon_gui/static/app/policy/edit/parameter/data/data-list.tpl.html
new file mode 100644
index 00000000..b2bac597
--- /dev/null
+++ b/moonv4/moon_gui/static/app/policy/edit/parameter/data/data-list.tpl.html
@@ -0,0 +1,349 @@
+<div>
+    <div class="panel panel-default">
+
+        <div class="panel-heading">
+
+            <h4 data-translate="moon.policy.data.subject.title">List of associated Subjects</h4>
+
+        </div>
+
+        <div class="panel-body">
+
+            <div class="table-responsive">
+
+                <table class="table table-striped">
+
+                    <thead>
+                    <tr>
+                        <th data-translate="moon.policy.data.table.name">Name</th>
+                        <th data-translate="moon.policy.data.table.description">Description</th>
+                        <th data-translate="moon.policy.data.table.category.name">Category</th>
+                        <!--<th data-translate="moon.policy.data.table.action.title"></th>-->
+                    </tr>
+                    </thead>
+
+                    <moon-loader ng-if="list.loadingSub"></moon-loader>
+
+                    <tbody ng-if="!list.loadingSub && list.getSubjects().length > 0">
+                    <tr ng-repeat="(key, value) in list.subjects">
+                        <td ng-bind="value.name"></td>
+                        <td ng-bind="value.description"></td>
+                        <td>
+
+                            <div ng-if="!list.getCategoryFromData(value, list.typeOfSubject)">
+                                <moon-loader ng-if="!list.getCategoryFromData(value)" ></moon-loader>
+                                <em data-translate="moon.policy.list.table.loading.category">Loading </em>
+                            </div>
+
+                            <div ng-if="list.getCategoryFromData(value)">
+                                <span ng-bind="value.category.name"></span>
+                            </div>
+
+                        </td>
+                        <!--<td>
+
+                            <div class="dropdown">
+
+                                <button class="btn btn-primary dropdown-toggle" type="button" data-toggle="dropdown">
+                                    <span data-translate="moon.policy.data.table.action.title">Actions</span>
+                                    <span class="caret"></span>
+                                </button>
+
+                                <ul class="dropdown-menu">
+
+                                    <li>
+                                        <a href="" ng-click="list.unMapSub(value)" >
+                                            <span class="glyphicon glyphicon-transfer"></span>
+                                            <span class="control-label" data-translate="moon.model.metarules.action.unmap">Unmap</span>
+                                        </a>
+                                    </li>
+
+                                    <li class="divider"></li>
+
+                                    <li>
+                                        <a href="" ng-click="list.deleteSub(value)">
+                                            <span class="glyphicon glyphicon-trash"></span>
+                                            <span class="control-label" data-translate="moon.policy.data.table.action.delete">Delete</span>
+                                        </a>
+                                    </li>
+
+                                </ul>
+
+                            </div>
+
+                            <div ng-if="value.loader">
+
+                                <moon-loader></moon-loader>
+
+                            </div>
+
+                        </td>-->
+
+                    </tr>
+                    </tbody>
+
+
+                    <tbody ng-if="!list.loadingSub && list.getSubjects().length === 0">
+                    <tr>
+                        <td data-translate="moon.policy.data.subject.notFound">There is no Subjects</td>
+                        <td></td>
+                        <td></td>
+                    </tr>
+                    </tbody>
+
+                </table>
+
+            </div>
+
+        </div>
+
+    </div>
+
+    <div ng-if="list.editMode" class="panel panel-default">
+
+        <div class="panel-heading">
+
+            <h4 data-translate="moon.policy.data.subject.add.title">Add a Subject Category</h4>
+
+        </div>
+
+        <div class="panel-body">
+
+            <moon-meta-data-edit meta-rule="list.metaRule" meta-data-type="list.typeOfSubject"></moon-meta-data-edit>
+
+        </div>
+
+    </div>
+
+    <div class="panel panel-default">
+
+        <div class="panel-heading">
+
+            <h4 data-translate="moon.policy.data.object.title">List associated of Objects</h4>
+
+        </div>
+
+        <div class="panel-body">
+
+            <div class="table-responsive">
+
+                <table class="table table-striped">
+
+                    <thead>
+                    <tr>
+                        <th data-translate="moon.policy.data.table.name">Name</th>
+                        <th data-translate="moon.policy.data.table.description">Description</th>
+                        <th data-translate="moon.policy.data.table.category.name">Category</th>
+
+                        <!--<th data-translate="moon.policy.data.table.action.title"></th>-->
+                    </tr>
+                    </thead>
+
+                    <moon-loader ng-if="list.loadingObj"></moon-loader>
+
+                    <tbody ng-if="!list.loadingObj && list.getObjects().length > 0">
+                    <tr ng-repeat="(key, value) in list.objects">
+                        <td ng-bind="value.value.name"></td>
+                        <td ng-bind="value.value.description"></td>
+                        <td>
+
+                            <div ng-if="!list.getCategoryFromData(value, list.typeOfObject)">
+                                <moon-loader ng-if="!list.getCategoryFromData(value)" ></moon-loader>
+                                <em data-translate="moon.policy.list.table.loading.category">Loading </em>
+                            </div>
+
+                            <div ng-if="list.getCategoryFromData(value)">
+                                <span ng-bind="value.category.name"></span>
+                            </div>
+
+                        </td>
+                        <!--<td>
+
+                            <div class="dropdown">
+
+                                <button class="btn btn-primary dropdown-toggle" type="button" data-toggle="dropdown">
+                                    <span data-translate="moon.policy.data.table.action.title">Actions</span>
+                                    <span class="caret"></span>
+                                </button>
+
+                                <ul class="dropdown-menu">
+
+                                    <li>
+                                        <a href="" ng-click="list.unMapObj(value)" >
+                                            <span class="glyphicon glyphicon-transfer"></span>
+                                            <span class="control-label" data-translate="moon.model.metarules.action.unmap">Unmap</span>
+                                        </a>
+                                    </li>
+
+                                    <li class="divider"></li>
+
+                                    <li>
+                                        <a href="" ng-click="list.deleteObj(value)">
+                                            <span class="glyphicon glyphicon-trash"></span>
+                                            <span class="control-label" data-translate="moon.policy.data.table.action.delete">Delete</span>
+                                        </a>
+                                    </li>
+
+                                </ul>
+
+                            </div>
+
+                            <div ng-if="value.loader">
+
+                                <moon-loader></moon-loader>
+
+                            </div>
+
+                        </td>
+                    </tr>-->
+                    </tbody>
+
+                    <tbody ng-if="!list.loadingObj && list.getObjects().length === 0">
+                    <tr>
+                        <td data-translate="moon.policy.data.object.notFound">There is no Objects</td>
+                        <td></td>
+                        <td></td>
+                    </tr>
+                    </tbody>
+
+                </table>
+
+            </div>
+
+        </div>
+
+    </div>
+
+    <div ng-if="list.editMode" class="panel panel-default">
+
+        <div class="panel-heading">
+
+            <h4 data-translate="moon.policy.data.object.add.title">Add an Object Category</h4>
+
+        </div>
+
+        <div class="panel-body">
+
+            <moon-meta-data-edit meta-rule="list.metaRule" meta-data-type="list.typeOfObject"></moon-meta-data-edit>
+
+        </div>
+
+    </div>
+
+    <div class="panel panel-default">
+
+        <div class="panel-heading">
+
+            <h4 data-translate="moon.policy.data.action.title">List associated of Actions</h4>
+
+        </div>
+
+        <div class="panel-body">
+
+            <div class="table-responsive">
+
+                <table class="table table-striped">
+
+                    <thead>
+                    <tr>
+                        <th data-translate="moon.policy.data.table.name">Name</th>
+                        <th data-translate="moon.policy.data.table.description">Description</th>
+                        <th data-translate="moon.policy.data.table.category.name">Category</th>
+
+                        <!--<th data-translate="moon.policy.data.table.action.title"></th>-->
+                    </tr>
+                    </thead>
+
+                    <moon-loader ng-if="list.loadingAct"></moon-loader>
+
+                    <tbody ng-if="!list.loadingAct && list.getActions().length > 0">
+                    <tr ng-repeat="(key, value) in list.actions">
+                        <td ng-bind="value.value.name"></td>
+                        <td ng-bind="value.value.description"></td>
+                        <td>
+
+                            <div ng-if="!list.getCategoryFromData(value, list.typeOfAction)">
+                                <moon-loader ng-if="!list.getCategoryFromData(value)" ></moon-loader>
+                                <em data-translate="moon.policy.list.table.loading.category">Loading </em>
+                            </div>
+
+                            <div ng-if="list.getCategoryFromData(value)">
+                                <span ng-bind="value.category.name"></span>
+                            </div>
+
+                        </td>
+                        <!--<td>
+
+                            <div class="dropdown">
+
+                                <button class="btn btn-primary dropdown-toggle" type="button" data-toggle="dropdown">
+                                    <span data-translate="moon.policy.data.table.action.title">Actions</span>
+                                    <span class="caret"></span>
+                                </button>
+
+                                <ul class="dropdown-menu">
+
+                                    <li>
+                                        <a href="" ng-click="list.unMapAct(value)" >
+                                            <span class="glyphicon glyphicon-transfer"></span>
+                                            <span class="control-label" data-translate="moon.model.metarules.action.unmap">Unmap</span>
+                                        </a>
+                                    </li>
+
+                                    <li class="divider"></li>
+
+                                    <li>
+                                        <a href="" ng-click="list.deleteAct(value)">
+                                            <span class="glyphicon glyphicon-trash"></span>
+                                            <span class="control-label" data-translate="moon.policy.data.table.action.delete">Delete</span>
+                                        </a>
+                                    </li>
+
+                                </ul>
+
+                            </div>
+
+                            <div ng-if="value.loader">
+
+                                <moon-loader></moon-loader>
+
+                            </div>
+
+                        </td>-->
+                    </tr>
+                    </tbody>
+
+                    <tbody ng-if="!list.loadingAct && list.getActions().length === 0">
+                    <tr>
+                        <td data-translate="moon.policy.data.action.notFound">There is no Actions</td>
+                        <td></td>
+                        <td></td>
+                    </tr>
+                    </tbody>
+
+                </table>
+
+            </div>
+
+
+        </div>
+
+    </div>
+
+    <div ng-if="list.editMode" class="panel panel-default">
+
+        <div class="panel-heading">
+
+            <h4 data-translate="moon.policy.data.action.add.title">Add an Action Category</h4>
+
+        </div>
+
+        <div class="panel-body">.
+
+            <moon-meta-data-edit meta-rule="list.metaRule" meta-data-type="list.typeOfAction"></moon-meta-data-edit>
+
+        </div>
+
+    </div>
+
+</div>
\ No newline at end of file
diff --git a/moonv4/moon_gui/static/app/policy/edit/parameter/data/data.edit.dir.js b/moonv4/moon_gui/static/app/policy/edit/parameter/data/data.edit.dir.js
new file mode 100644
index 00000000..11f0d480
--- /dev/null
+++ b/moonv4/moon_gui/static/app/policy/edit/parameter/data/data.edit.dir.js
@@ -0,0 +1,330 @@
+(function() {
+
+    'use strict';
+
+    angular
+        .module('moon')
+        .directive('moonDataEdit', moonDataEdit);
+
+    moonDataEdit.$inject = [];
+
+    function moonDataEdit() {
+
+        return {
+            templateUrl : 'html/policy/edit/parameter/data/data-edit.tpl.html',
+            bindToController : true,
+            controller : moonDataEditController,
+            controllerAs : 'edit',
+            scope : {
+                //Type can be 'ACTION', 'OBJECT', 'SUBJECT'
+                metaDataType: '=',
+                metaRule : '='
+            },
+            restrict : 'E',
+            replace : true
+        };
+    }
+
+    angular
+        .module('moon')
+        .controller('moonDataEditController', moonDataEditController);
+
+    moonDataEditController.$inject = ['$scope', 'metaDataService', 'DATA_CST', 'alertService', '$translate', 'formService', 'policyService', 'utilService'];
+
+    function moonDataEditController($scope, metaDataService, DATA_CST, alertService, $translate, formService, policyService, utilService) {
+
+        var edit = this;
+
+        edit.metaDataType = $scope.edit.metaDataType;
+        edit.metaRule = $scope.edit.metaRule;
+
+        edit.fromList = true;
+
+        edit.laoading = false;
+
+        edit.form = {};
+
+        edit.metaData = { name: null, description: null};
+
+        edit.list = [];
+
+        edit.create = createMetaData;
+        edit.addToMetaRule = addToMetaRule;
+        edit.deleteMetaData = deleteMetaData;
+
+        activate();
+
+        /*
+         *
+         */
+
+        function activate(){
+
+            switch(edit.metaDataType){
+
+                case DATA_CST.TYPE.SUBJECT:
+
+                    metaDataService.subject.findAllWithCallback(callBackList);
+                    break;
+
+                case DATA_CST.TYPE.OBJECT:
+
+                    metaDataService.object.findAllWithCallback(callBackList);
+                    break;
+
+                case DATA_CST.TYPE.ACTION:
+
+                    metaDataService.action.findAllWithCallback(callBackList);
+                    break;
+
+                default :
+
+                    edit.list = [];
+                    break;
+
+            }
+
+            function callBackList(list){
+
+                edit.list = list
+
+            }
+
+        }
+
+        /**
+         * Add
+         */
+
+        function addToMetaRule(){
+
+            if(!edit.selectedMetaData){
+
+                return;
+
+            }
+
+            var metaRuleToSend = edit.metaRule;
+
+            switch(edit.metaDataType){
+
+                case DATA_CST.TYPE.SUBJECT:
+
+                    metaRuleToSend.subject_categories.push(edit.selectedMetaData.id);
+                    break;
+
+                case DATA_CST.TYPE.OBJECT:
+
+                    metaRuleToSend.object_categories.push(edit.selectedMetaData.id);
+                    break;
+
+                case DATA_CST.TYPE.ACTION:
+
+                    metaRuleToSend.action_categories.push(edit.selectedMetaData.id);
+                    break;
+            }
+
+            policyService.update(metaRuleToSend, updateMetaRuleSuccess, updateMetaRuleError);
+
+            function updateMetaRuleSuccess(data){
+
+                $translate('moon.model.metarules.update.success', { metaRuleName: metaRuleToSend.name }).then( function(translatedValue) {
+
+                    alertService.alertSuccess(translatedValue);
+
+                });
+
+                metaRuleToSend = utilService.transformOne(data, 'meta_rules');
+
+                $scope.$emit('event:updateMetaRuleFromMetaDataAddSuccess', metaRuleToSend);
+
+                stopLoading();
+
+            }
+
+            function updateMetaRuleError(reason){
+
+                $translate('moon.model.metarules.update.error', { metaRuleName: metaRuleToSend.name, reason: reason.message}).then( function(translatedValue) {
+
+                    alertService.alertError(translatedValue);
+
+                });
+
+                stopLoading();
+
+            }
+
+        }
+
+        /**
+         * Create
+         */
+
+        function createMetaData() {
+
+            if(formService.isInvalid(edit.form)) {
+
+                formService.checkFieldsValidity(edit.form);
+
+            } else {
+
+                startLoading();
+
+                var metaDataToSend = angular.copy(edit.metaData);
+
+                switch(edit.metaDataType){
+
+                    case DATA_CST.TYPE.SUBJECT:
+
+                        metaDataService.subject.add(metaDataToSend, createSuccess, createError);
+                        break;
+
+                    case DATA_CST.TYPE.OBJECT:
+
+                        metaDataService.object.add(metaDataToSend, createSuccess, createError);
+                        break;
+
+                    case DATA_CST.TYPE.ACTION:
+
+                        metaDataService.action.add(metaDataToSend, createSuccess, createError);
+                        break;
+                }
+
+            }
+
+            function createSuccess(data) {
+
+                var created = {};
+
+                switch(edit.metaDataType){
+
+                    case DATA_CST.TYPE.SUBJECT:
+
+                        created = utilService.transformOne(data, 'subject_categories');
+                        break;
+
+                    case DATA_CST.TYPE.OBJECT:
+
+                        created = utilService.transformOne(data, 'object_categories');
+                        break;
+
+                    case DATA_CST.TYPE.ACTION:
+
+                        created = utilService.transformOne(data, 'action_categories');
+                        break;
+                }
+
+                $translate('moon.model.metadata.edit.create.success', { name: created.name }).then(function (translatedValue) {
+                    alertService.alertSuccess(translatedValue);
+                });
+
+                stopLoading();
+
+                edit.list.push(created);
+
+                displayList();
+
+            }
+
+            function createError(reason) {
+
+                $translate('moon.model.metadata.edit.create.error', { name: metaDataToSend.name }).then(function (translatedValue) {
+                    alertService.alertError(translatedValue);
+                });
+
+                stopLoading();
+
+            }
+
+        }
+
+        function deleteMetaData(){
+
+            if(!edit.selectedMetaData){
+
+                return;
+
+            }
+
+            startLoading();
+
+            var metaDataToDelete = angular.copy(edit.selectedMetaData);
+
+            switch(edit.metaDataType){
+                case DATA_CST.TYPE.SUBJECT:
+
+                    metaDataService.subject.delete(metaDataToDelete, deleteSuccess, deleteError);
+                    break;
+
+                case DATA_CST.TYPE.OBJECT:
+
+                    metaDataService.object.delete(metaDataToDelete, deleteSuccess, deleteError);
+                    break;
+
+                case DATA_CST.TYPE.ACTION:
+
+                    metaDataService.action.delete(metaDataToDelete, deleteSuccess, deleteError);
+                    break;
+            }
+
+
+            function deleteSuccess(data) {
+
+                $translate('moon.model.metadata.edit.delete.success', { name: metaDataToDelete.name }).then(function (translatedValue) {
+                    alertService.alertSuccess(translatedValue);
+                });
+
+                policyService.findOneWithMetaData(edit.metaRule.id).then( function(metaRule){
+
+                    edit.metaRule = metaRule;
+
+                    cleanSelectedValue();
+
+                    activate();
+
+                    stopLoading();
+
+                    $scope.$emit('event:deleteMetaDataFromMetaDataAddSuccess', edit.metaRule);
+
+                });
+
+            }
+
+            function deleteError(reason) {
+
+                $translate('moon.model.metadata.edit.delete.error', { name: metaDataToDelete.name }).then(function (translatedValue) {
+                    alertService.alertError(translatedValue);
+                });
+
+                stopLoading();
+
+            }
+        }
+
+        function cleanSelectedValue(){
+
+            delete edit.selectedMetaData;
+
+        }
+
+        function startLoading(){
+
+            edit.loading = true;
+
+        }
+
+        function stopLoading(){
+
+            edit.loading = false;
+
+        }
+
+        function displayList(){
+
+            edit.fromList = true;
+
+        }
+
+    }
+
+})();
\ No newline at end of file
diff --git a/moonv4/moon_gui/static/app/policy/edit/parameter/data/data.list.dir.js b/moonv4/moon_gui/static/app/policy/edit/parameter/data/data.list.dir.js
new file mode 100644
index 00000000..07afd1b9
--- /dev/null
+++ b/moonv4/moon_gui/static/app/policy/edit/parameter/data/data.list.dir.js
@@ -0,0 +1,401 @@
+(function() {
+
+    'use strict';
+
+    angular
+        .module('moon')
+        .directive('moonDataList', moonDataList);
+
+    moonDataList.$inject = [];
+
+    function moonDataList() {
+
+        return {
+            templateUrl : 'html/policy/edit/parameter/data/data-list.tpl.html',
+            bindToController : true,
+            controller : moonDataListController,
+            controllerAs : 'list',
+            scope : {
+                policy: '=',
+                editMode : '='
+            },
+            restrict : 'E',
+            replace : true
+        };
+    }
+
+    angular
+        .module('moon')
+        .controller('moonDataListController', moonDataListController);
+
+    moonDataListController.$inject = ['$scope', '$rootScope', 'dataService', '$translate', 'alertService', 'policyService', 'DATA_CST', 'utilService', 'metaDataService'];
+
+    function moonDataListController($scope, $rootScope, dataService, $translate, alertService, policyService, DATA_CST, utilService, metaDataService){
+
+        var list = this;
+
+        list.policy = $scope.list.policy;
+        list.editMode = $scope.list.editMode;
+
+        list.typeOfSubject = DATA_CST.TYPE.SUBJECT;
+        list.typeOfObject = DATA_CST.TYPE.OBJECT;
+        list.typeOfAction = DATA_CST.TYPE.ACTION;
+
+        list.unMapSub = unMapSub;
+        list.unMapObj = unMapObj;
+        list.unMapAct = unMapAct;
+
+        list.deleteSub = deleteSub;
+        list.deleteObj = deleteObj;
+        list.deleteAct = deleteAct;
+
+        list.getSubjects = getSubjects;
+        list.getObjects = getObjects;
+        list.getActions = getActions;
+
+        list.getCategoryFromData = getCategoryFromData;
+
+        activate();
+
+        function activate(){
+
+            manageSubjects();
+
+            manageObjects();
+
+            manageActions();
+
+        }
+
+        var rootListeners = {
+
+            'event:deleteDataFromDataAddSuccess': $rootScope.$on('event:deleteDataFromDataAddSuccess', deletePolicy)
+
+        };
+
+        for (var unbind in rootListeners) {
+            $scope.$on('$destroy', rootListeners[unbind]);
+        }
+
+
+        function manageSubjects(){
+
+            list.loadingSub = true;
+
+            dataService.subject.findAllFromPolicyWithCallback(list.policy.id, function(data){
+
+                console.log('subjects');
+                console.log(data);
+                list.subjects = data;
+                list.loadingSub = false;
+
+            });
+        }
+
+        function manageObjects(){
+
+            list.loadingObj = true;
+
+            dataService.object.findAllFromPolicyWithCallback(list.policy.id, function(data){
+
+                console.log('objects');
+                console.log(data);
+                list.objects = data;
+                list.loadingObj = false;
+
+            });
+
+        }
+
+        function manageActions(){
+
+            list.loadingAct = true;
+
+            dataService.action.findAllFromPolicyWithCallback(list.policy.id, function(data){
+
+                console.log('actions');
+                console.log(data);
+                list.actions = data;
+                list.loadingAct = false;
+
+            });
+
+        }
+
+        function getCategoryFromData(data, type) {
+
+            if(_.has(data, 'category')){
+                return data.category;
+            }
+
+            // if the call has not been made
+            if(!_.has(data, 'callCategoryInProgress')){
+
+                data.callCategoryInProgress = true;
+
+                switch(type){
+
+                    case DATA_CST.TYPE.SUBJECT:
+                        metaDataService.subject.findOne(data.category_id, setCategoryToData);
+                        break;
+
+                    case DATA_CST.TYPE.OBJECT:
+                        metaDataService.object.findOne(data.category_id, setCategoryToData);
+                        break;
+
+                    case DATA_CST.TYPE.ACTION:
+                        metaDataService.action.findOne(data.category_id, setCategoryToData);
+                        break;
+
+                }
+
+            }
+
+            // if the call is in progress return false
+            return false;
+
+            function setCategoryToData(category){
+
+                data.callCategoryInProgress = false;
+                data.category = category;
+
+            }
+        }
+
+        /**
+         * UnMap
+         */
+
+        function unMapSub(subject){
+
+            subject.loader = true;
+
+            var policyToSend = angular.copy(list.policy);
+
+            policyToSend.subject_categories = _.without(policyToSend.subject_categories, subject.id);
+
+            policyService.update(policyToSend, updatePolicySuccess, updatePolicyError);
+
+            function updatePolicySuccess(data){
+
+                $translate('moon.policy.metarules.update.success', { policyName: list.policy.name }).then( function(translatedValue) {
+                    alertService.alertSuccess(translatedValue);
+                });
+
+                list.policy = policyService.findDataFromPolicy(utilService.transformOne(data, 'meta_rules'));
+
+                activate();
+
+                subject.loader = false;
+
+            }
+
+            function updatePolicyError(reason){
+
+                $translate('moon.policy.metarules.update.error', { policyName: list.policy.name, reason: reason.message}).then( function(translatedValue) {
+                    alertService.alertError(translatedValue);
+                });
+
+                subject.loader = false;
+
+            }
+
+        }
+
+        function unMapObj(object){
+
+            object.loader = true;
+
+            var policyToSend = angular.copy(list.policy);
+
+            policyToSend.object_categories = _.without(policyToSend.object_categories, object.id);
+
+            policyService.update(policyToSend, updatePolicySuccess, updatePolicyError);
+
+            function updatePolicySuccess(data){
+
+                $translate('moon.policy.metarules.update.success', { policyName: list.policy.name }).then( function(translatedValue) {
+                    alertService.alertSuccess(translatedValue);
+                });
+
+                list.policy = policyService.findDataFromPolicy(utilService.transformOne(data, 'meta_rules'));
+
+                activate();
+
+                object.loader = false;
+
+            }
+
+            function updatePolicyError(reason){
+
+                $translate('moon.policy.metarules.update.error', { policyName: list.policy.name, reason: reason.message}).then( function(translatedValue) {
+                    alertService.alertError(translatedValue);
+                });
+
+                object.loader = false;
+
+            }
+
+        }
+
+        function unMapAct(action){
+
+            action.loader = true;
+
+            var policyToSend = angular.copy(list.policy);
+
+            policyToSend.action_categories = _.without(policyToSend.action_categories, action.id);
+
+            policyService.update(policyToSend, updatePolicySuccess, updatePolicyError);
+
+            function updatePolicySuccess(data){
+
+                $translate('moon.policy.metarules.update.success', { policyName: list.policy.name }).then( function(translatedValue) {
+                    alertService.alertSuccess(translatedValue);
+                });
+
+                list.policy = policyService.findDataFromPolicy(utilService.transformOne(data, 'meta_rules'));
+
+                activate();
+
+                action.loader = false;
+
+            }
+
+            function updatePolicyError(reason){
+
+                $translate('moon.policy.metarules.update.error', { policyName: list.policy.name, reason: reason.message}).then( function(translatedValue) {
+                    alertService.alertError(translatedValue);
+                });
+
+                action.loader = false;
+
+            }
+
+        }
+
+        /**
+         * Delete
+         */
+
+        function deleteSub(subject){
+
+            subject.loader = true;
+
+            dataService.subject.delete(subject, deleteSubSuccess, deleteSubError);
+
+            function deleteSubSuccess(data){
+
+                $translate('moon.policy.perimeter.subject.delete.success', { subjectName: subject.name }).then( function(translatedValue) {
+                    alertService.alertSuccess(translatedValue);
+                });
+
+                removeSubFromSubList(subject);
+
+                subject.loader = false;
+
+            }
+
+            function deleteSubError(reason){
+
+                $translate('moon.policy.perimeter.subject.delete.error', { subjectName: subject.name, reason: reason.message}).then( function(translatedValue) {
+                    alertService.alertError(translatedValue);
+                });
+
+                subject.loader = false;
+
+            }
+        }
+
+        function deleteObj(object){
+
+            object.loader = true;
+
+            dataService.object.delete(object, deleteObjSuccess, deleteObjError);
+
+            function deleteObjSuccess(data){
+
+                $translate('moon.policy.perimeter.object.delete.success', { objectName: object.name }).then( function(translatedValue) {
+                    alertService.alertSuccess(translatedValue);
+                });
+
+                removeObjFromObjList(object);
+
+                object.loader = false;
+
+            }
+
+            function deleteObjError(reason){
+
+                $translate('moon.policy.perimeter.object.delete.error', { objectName: object.name, reason: reason.message}).then( function(translatedValue) {
+                    alertService.alertError(translatedValue);
+                });
+
+                object.loader = false;
+            }
+        }
+
+        function deleteAct(action){
+
+            action.loader = true;
+
+            dataService.action.delete(action, deleteActSuccess, deleteActError);
+
+            function deleteActSuccess(data){
+
+                $translate('moon.policy.perimeter.action.delete.success', { actionName: action.name }).then( function(translatedValue) {
+                    alertService.alertSuccess(translatedValue);
+                });
+
+                removeActFromActList(action);
+
+                action.loader = false;
+
+            }
+
+            function deleteActError(reason){
+
+                $translate('moon.policy.perimeter.action.delete.error', { actionName: action.name, reason: reason.message}).then( function(translatedValue) {
+                    alertService.alertError(translatedValue);
+                });
+
+                action.loader = false;
+
+            }
+        }
+
+        function getSubjects(){
+            return list.subjects ? list.subjects : [];
+        }
+
+        function getObjects(){
+            return list.objects ? list.objects : [];
+        }
+
+        function getActions(){
+            return list.actions ? list.actions : [];
+        }
+
+        function removeSubFromSubList(subject){
+            list.subjects = _.without(list.subjects, subject);
+        }
+
+        function removeObjFromObjList(object){
+            list.objects = _.without(list.objects, object);
+        }
+
+        function removeActFromActList(action){
+            list.actions = _.without(list.actions, action);
+        }
+
+        function deletePolicy( event, policy){
+
+            list.policy = policy;
+
+            activate();
+
+        }
+
+    }
+
+})();
\ No newline at end of file
diff --git a/moonv4/moon_gui/static/app/policy/edit/parameter/perimeter/perimeter-list.tpl.html b/moonv4/moon_gui/static/app/policy/edit/parameter/perimeter/perimeter-list.tpl.html
new file mode 100644
index 00000000..6111888a
--- /dev/null
+++ b/moonv4/moon_gui/static/app/policy/edit/parameter/perimeter/perimeter-list.tpl.html
@@ -0,0 +1,320 @@
+<div>
+    <div class="panel panel-default">
+
+        <div class="panel-heading">
+
+            <h4 data-translate="moon.policy.perimeter.subject.title">List of associated Subjects</h4>
+
+        </div>
+
+        <div class="panel-body">
+
+            <div class="table-responsive">
+
+                <table class="table table-striped">
+
+                    <thead>
+                        <tr>
+                            <th data-translate="moon.policy.perimeter.table.partner.id">Id</th>
+                            <th data-translate="moon.policy.perimeter.table.name">Name</th>
+                            <th data-translate="moon.policy.perimeter.table.description">Description</th>
+                            <th data-translate="moon.policy.perimeter.table.email">Email</th>
+                            <!--<th data-translate="moon.policy.perimeter.table.action.title"></th>-->
+                        </tr>
+                    </thead>
+
+                    <moon-loader ng-if="list.loadingSub"></moon-loader>
+
+                    <tbody ng-if="!list.loadingSub && list.getSubjects().length > 0">
+                    <tr ng-repeat="(key, value) in list.subjects">
+                        <td ng-bind="value.partner_id"></td>
+                        <td ng-bind="value.name"></td>
+                        <td ng-bind="value.description"></td>
+                        <td ng-bind="value.email"></td>
+                        <!--<td>
+
+                            <div class="dropdown">
+
+                                <button class="btn btn-primary dropdown-toggle" type="button" data-toggle="dropdown">
+                                    <span data-translate="moon.policy.perimeter.table.action.title">Actions</span>
+                                    <span class="caret"></span>
+                                </button>
+
+                                <ul class="dropdown-menu">
+
+                                    <li>
+                                        <a href="" ng-click="list.unMapSub(value)" >
+                                            <span class="glyphicon glyphicon-transfer"></span>
+                                            <span class="control-label" data-translate="moon.model.metarules.action.unmap">Unmap</span>
+                                        </a>
+                                    </li>
+
+                                    <li class="divider"></li>
+
+                                    <li>
+                                        <a href="" ng-click="list.deleteSub(value)">
+                                            <span class="glyphicon glyphicon-trash"></span>
+                                            <span class="control-label" data-translate="moon.policy.perimeter.table.action.delete">Delete</span>
+                                        </a>
+                                    </li>
+
+                                </ul>
+
+                            </div>
+
+                            <div ng-if="value.loader">
+
+                                <moon-loader></moon-loader>
+
+                            </div>
+
+                        </td>-->
+
+                    </tr>
+                    </tbody>
+
+
+                    <tbody ng-if="!list.loadingSub && list.getSubjects().length === 0">
+                    <tr>
+                        <td data-translate="moon.policy.perimeter.subject.notFound">There is no Subjects</td>
+                        <td></td>
+                        <td></td>
+                        <td></td>
+                        <td></td>
+                    </tr>
+                    </tbody>
+
+                </table>
+
+            </div>
+
+        </div>
+
+    </div>
+
+    <div ng-if="list.editMode" class="panel panel-default">
+
+        <div class="panel-heading">
+
+            <h4 data-translate="moon.policy.perimeter.subject.add.title">Add a Subject Category</h4>
+
+        </div>
+
+        <div class="panel-body">
+
+            <moon-meta-data-edit meta-rule="list.metaRule" meta-data-type="list.typeOfSubject"></moon-meta-data-edit>
+
+        </div>
+
+    </div>
+
+    <div class="panel panel-default">
+
+        <div class="panel-heading">
+
+            <h4 data-translate="moon.policy.perimeter.object.title">List associated of Objects</h4>
+
+        </div>
+
+        <div class="panel-body">
+
+            <div class="table-responsive">
+
+                <table class="table table-striped">
+
+                    <thead>
+                        <tr>
+                            <th data-translate="moon.policy.perimeter.table.partner.id">Id</th>
+                            <th data-translate="moon.policy.perimeter.table.name">Name</th>
+                            <th data-translate="moon.policy.perimeter.table.description">Description</th>
+                            <!--<th data-translate="moon.policy.perimeter.table.action.title"></th>-->
+                        </tr>
+                    </thead>
+
+                    <moon-loader ng-if="list.loadingObj"></moon-loader>
+
+                    <tbody ng-if="!list.loadingObj && list.getObjects().length > 0">
+                    <tr ng-repeat="(key, value) in list.objects">
+                        <td ng-bind="value.partner_id"></td>
+                        <td ng-bind="value.name"></td>
+                        <td ng-bind="value.description"></td>
+                        <!--<td>
+
+                            <div class="dropdown">
+
+                                <button class="btn btn-primary dropdown-toggle" type="button" data-toggle="dropdown">
+                                    <span data-translate="moon.policy.perimeter.table.action.title">Actions</span>
+                                    <span class="caret"></span>
+                                </button>
+
+                                <ul class="dropdown-menu">
+
+                                    <li>
+                                        <a href="" ng-click="list.unMapObj(value)" >
+                                            <span class="glyphicon glyphicon-transfer"></span>
+                                            <span class="control-label" data-translate="moon.model.metarules.action.unmap">Unmap</span>
+                                        </a>
+                                    </li>
+
+                                    <li class="divider"></li>
+
+                                    <li>
+                                        <a href="" ng-click="list.deleteObj(value)">
+                                            <span class="glyphicon glyphicon-trash"></span>
+                                            <span class="control-label" data-translate="moon.policy.perimeter.table.action.delete">Delete</span>
+                                        </a>
+                                    </li>
+
+                                </ul>
+
+                            </div>
+
+                            <div ng-if="value.loader">
+
+                                <moon-loader></moon-loader>
+
+                            </div>
+
+                        </td>
+                    </tr>-->
+                    </tbody>
+
+                    <tbody ng-if="!list.loadingObj && list.getObjects().length === 0">
+                    <tr>
+                        <td data-translate="moon.policy.perimeter.object.notFound">There is no Objects</td>
+                        <td></td>
+                        <td></td>
+                        <td></td>
+                    </tr>
+                    </tbody>
+
+                </table>
+
+            </div>
+
+        </div>
+
+    </div>
+
+    <div ng-if="list.editMode" class="panel panel-default">
+
+        <div class="panel-heading">
+
+            <h4 data-translate="moon.policy.perimeter.object.add.title">Add an Object Category</h4>
+
+        </div>
+
+        <div class="panel-body">
+
+            <moon-meta-data-edit meta-rule="list.metaRule" meta-data-type="list.typeOfObject"></moon-meta-data-edit>
+
+        </div>
+
+    </div>
+
+    <div class="panel panel-default">
+
+        <div class="panel-heading">
+
+            <h4 data-translate="moon.policy.perimeter.action.title">List associated of Actions</h4>
+
+        </div>
+
+        <div class="panel-body">
+
+            <div class="table-responsive">
+
+                <table class="table table-striped">
+
+                    <thead>
+                        <tr>
+                            <th data-translate="moon.policy.perimeter.table.partner.id">Id</th>
+                            <th data-translate="moon.policy.perimeter.table.name">Name</th>
+                            <th data-translate="moon.policy.perimeter.table.description">Description</th>
+                            <!--<th data-translate="moon.policy.perimeter.table.action.title"></th>-->
+                        </tr>
+                    </thead>
+
+                    <moon-loader ng-if="list.loadingAct"></moon-loader>
+
+                    <tbody ng-if="!list.loadingAct && list.getActions().length > 0">
+                    <tr ng-repeat="(key, value) in list.actions">
+                        <td ng-bind="value.partner_id"></td>
+                        <td ng-bind="value.name"></td>
+                        <td ng-bind="value.description"></td>
+                        <!--<td>
+
+                            <div class="dropdown">
+
+                                <button class="btn btn-primary dropdown-toggle" type="button" data-toggle="dropdown">
+                                    <span data-translate="moon.policy.perimeter.table.action.title">Actions</span>
+                                    <span class="caret"></span>
+                                </button>
+
+                                <ul class="dropdown-menu">
+
+                                    <li>
+                                        <a href="" ng-click="list.unMapAct(value)" >
+                                            <span class="glyphicon glyphicon-transfer"></span>
+                                            <span class="control-label" data-translate="moon.model.metarules.action.unmap">Unmap</span>
+                                        </a>
+                                    </li>
+
+                                    <li class="divider"></li>
+
+                                    <li>
+                                        <a href="" ng-click="list.deleteAct(value)">
+                                            <span class="glyphicon glyphicon-trash"></span>
+                                            <span class="control-label" data-translate="moon.policy.perimeter.table.action.delete">Delete</span>
+                                        </a>
+                                    </li>
+
+                                </ul>
+
+                            </div>
+
+                            <div ng-if="value.loader">
+
+                                <moon-loader></moon-loader>
+
+                            </div>
+
+                        </td>
+                    </tr>-->
+                    </tbody>
+
+                    <tbody ng-if="!list.loadingAct && list.getActions().length === 0">
+                    <tr>
+                        <td data-translate="moon.policy.perimeter.action.notFound">There is no Actions</td>
+                        <td></td>
+                        <td></td>
+                        <td></td>
+                    </tr>
+                    </tbody>
+
+                </table>
+
+            </div>
+
+
+        </div>
+
+    </div>
+
+    <div ng-if="list.editMode" class="panel panel-default">
+
+        <div class="panel-heading">
+
+            <h4 data-translate="moon.policy.perimeter.action.add.title">Add an Action Category</h4>
+
+        </div>
+
+        <div class="panel-body">.
+
+            <moon-meta-data-edit meta-rule="list.metaRule" meta-data-type="list.typeOfAction"></moon-meta-data-edit>
+
+        </div>
+
+    </div>
+
+</div>
\ No newline at end of file
diff --git a/moonv4/moon_gui/static/app/policy/edit/parameter/perimeter/perimeter.list.dir.js b/moonv4/moon_gui/static/app/policy/edit/parameter/perimeter/perimeter.list.dir.js
new file mode 100644
index 00000000..8c50b22e
--- /dev/null
+++ b/moonv4/moon_gui/static/app/policy/edit/parameter/perimeter/perimeter.list.dir.js
@@ -0,0 +1,358 @@
+(function() {
+
+    'use strict';
+
+    angular
+        .module('moon')
+        .directive('moonPerimeterList', moonPerimeterList);
+
+    moonPerimeterList.$inject = [];
+
+    function moonPerimeterList() {
+
+        return {
+            templateUrl : 'html/policy/edit/parameter/perimeter/perimeter-list.tpl.html',
+            bindToController : true,
+            controller : moonPerimeterListController,
+            controllerAs : 'list',
+            scope : {
+                policy: '=',
+                editMode : '='
+            },
+            restrict : 'E',
+            replace : true
+        };
+    }
+
+    angular
+        .module('moon')
+        .controller('moonPerimeterListController', moonPerimeterListController);
+
+    moonPerimeterListController.$inject = ['$scope', '$rootScope', 'perimeterService', '$translate', 'alertService', 'policyService', 'PERIMETER_CST', 'utilService'];
+
+    function moonPerimeterListController($scope, $rootScope, perimeterService, $translate, alertService, policyService, PERIMETER_CST, utilService){
+
+        var list = this;
+
+        list.policy = $scope.list.policy;
+        list.editMode = $scope.list.editMode;
+
+        list.typeOfSubject = PERIMETER_CST.TYPE.SUBJECT;
+        list.typeOfObject = PERIMETER_CST.TYPE.OBJECT;
+        list.typeOfAction = PERIMETER_CST.TYPE.ACTION;
+
+        list.unMapSub = unMapSub;
+        list.unMapObj = unMapObj;
+        list.unMapAct = unMapAct;
+
+        list.deleteSub = deleteSub;
+        list.deleteObj = deleteObj;
+        list.deleteAct = deleteAct;
+
+        list.getSubjects = getSubjects;
+        list.getObjects = getObjects;
+        list.getActions = getActions;
+
+        activate();
+
+        function activate(){
+
+            manageSubjects();
+
+            manageObjects();
+
+            manageActions();
+
+        }
+
+        var rootListeners = {
+
+            'event:deletePerimeterFromPerimeterAddSuccess': $rootScope.$on('event:deletePerimeterFromPerimeterAddSuccess', deletePolicy)
+
+        };
+
+        for (var unbind in rootListeners) {
+            $scope.$on('$destroy', rootListeners[unbind]);
+        }
+
+
+        function manageSubjects(){
+
+            list.loadingSub = true;
+
+            perimeterService.subject.findAllFromPolicyWithCallback(list.policy.id, function(perimeters){
+
+                list.subjects = perimeters;
+                list.loadingSub = false;
+
+            });
+        }
+
+        function manageObjects(){
+
+            list.loadingObj = true;
+
+            perimeterService.object.findAllFromPolicyWithCallback(list.policy.id, function(perimeters){
+
+                console.log('objects');
+                console.log(perimeters);
+                list.objects = perimeters;
+                list.loadingObj = false;
+
+            });
+
+        }
+
+        function manageActions(){
+
+            list.loadingAct = true;
+
+            perimeterService.action.findAllFromPolicyWithCallback(list.policy.id, function(perimeters){
+
+                console.log('actions');
+                console.log(perimeters);
+                list.actions = perimeters;
+                list.loadingAct = false;
+
+            });
+
+        }
+
+
+        /**
+         * UnMap
+         */
+
+        function unMapSub(subject){
+
+            subject.loader = true;
+
+            var policyToSend = angular.copy(list.policy);
+
+            policyToSend.subject_categories = _.without(policyToSend.subject_categories, subject.id);
+
+            policyService.update(policyToSend, updatePolicySuccess, updatePolicyError);
+
+            function updatePolicySuccess(data){
+
+                $translate('moon.policy.metarules.update.success', { policyName: list.policy.name }).then( function(translatedValue) {
+                    alertService.alertSuccess(translatedValue);
+                });
+
+                list.policy = policyService.findPerimeterFromPolicy(utilService.transformOne(data, 'meta_rules'));
+
+                activate();
+
+                subject.loader = false;
+
+            }
+
+            function updatePolicyError(reason){
+
+                $translate('moon.policy.metarules.update.error', { policyName: list.policy.name, reason: reason.message}).then( function(translatedValue) {
+                    alertService.alertError(translatedValue);
+                });
+
+                subject.loader = false;
+
+            }
+
+        }
+
+        function unMapObj(object){
+
+            object.loader = true;
+
+            var policyToSend = angular.copy(list.policy);
+
+            policyToSend.object_categories = _.without(policyToSend.object_categories, object.id);
+
+            policyService.update(policyToSend, updatePolicySuccess, updatePolicyError);
+
+            function updatePolicySuccess(data){
+
+                $translate('moon.policy.metarules.update.success', { policyName: list.policy.name }).then( function(translatedValue) {
+                    alertService.alertSuccess(translatedValue);
+                });
+
+                list.policy = policyService.findPerimeterFromPolicy(utilService.transformOne(data, 'meta_rules'));
+
+                activate();
+
+                object.loader = false;
+
+            }
+
+            function updatePolicyError(reason){
+
+                $translate('moon.policy.metarules.update.error', { policyName: list.policy.name, reason: reason.message}).then( function(translatedValue) {
+                    alertService.alertError(translatedValue);
+                });
+
+                object.loader = false;
+
+            }
+
+        }
+
+        function unMapAct(action){
+
+            action.loader = true;
+
+            var policyToSend = angular.copy(list.policy);
+
+            policyToSend.action_categories = _.without(policyToSend.action_categories, action.id);
+
+            policyService.update(policyToSend, updatePolicySuccess, updatePolicyError);
+
+            function updatePolicySuccess(data){
+
+                $translate('moon.policy.metarules.update.success', { policyName: list.policy.name }).then( function(translatedValue) {
+                    alertService.alertSuccess(translatedValue);
+                });
+
+                list.policy = policyService.findPerimeterFromPolicy(utilService.transformOne(data, 'meta_rules'));
+
+                activate();
+
+                action.loader = false;
+
+            }
+
+            function updatePolicyError(reason){
+
+                $translate('moon.policy.metarules.update.error', { policyName: list.policy.name, reason: reason.message}).then( function(translatedValue) {
+                    alertService.alertError(translatedValue);
+                });
+
+                action.loader = false;
+
+            }
+
+        }
+
+        /**
+         * Delete
+         */
+
+        function deleteSub(subject){
+
+            subject.loader = true;
+
+            perimeterService.subject.delete(subject, deleteSubSuccess, deleteSubError);
+
+            function deleteSubSuccess(data){
+
+                $translate('moon.policy.perimeter.subject.delete.success', { subjectName: subject.name }).then( function(translatedValue) {
+                    alertService.alertSuccess(translatedValue);
+                });
+
+                removeSubFromSubList(subject);
+
+                subject.loader = false;
+
+            }
+
+            function deleteSubError(reason){
+
+                $translate('moon.policy.perimeter.subject.delete.error', { subjectName: subject.name, reason: reason.message}).then( function(translatedValue) {
+                    alertService.alertError(translatedValue);
+                });
+
+                subject.loader = false;
+
+            }
+        }
+
+        function deleteObj(object){
+
+            object.loader = true;
+
+            perimeterService.object.delete(object, deleteObjSuccess, deleteObjError);
+
+            function deleteObjSuccess(data){
+
+                $translate('moon.policy.perimeter.object.delete.success', { objectName: object.name }).then( function(translatedValue) {
+                    alertService.alertSuccess(translatedValue);
+                });
+
+                removeObjFromObjList(object);
+
+                object.loader = false;
+
+            }
+
+            function deleteObjError(reason){
+
+                $translate('moon.policy.perimeter.object.delete.error', { objectName: object.name, reason: reason.message}).then( function(translatedValue) {
+                    alertService.alertError(translatedValue);
+                });
+
+                object.loader = false;
+            }
+        }
+
+        function deleteAct(action){
+
+            action.loader = true;
+
+            perimeterService.action.delete(action, deleteActSuccess, deleteActError);
+
+            function deleteActSuccess(data){
+
+                $translate('moon.policy.perimeter.action.delete.success', { actionName: action.name }).then( function(translatedValue) {
+                    alertService.alertSuccess(translatedValue);
+                });
+
+                removeActFromActList(action);
+
+                action.loader = false;
+
+            }
+
+            function deleteActError(reason){
+
+                $translate('moon.policy.perimeter.action.delete.error', { actionName: action.name, reason: reason.message}).then( function(translatedValue) {
+                    alertService.alertError(translatedValue);
+                });
+
+                action.loader = false;
+
+            }
+        }
+
+        function getSubjects(){
+            return list.subjects ? list.subjects : [];
+        }
+
+        function getObjects(){
+            return list.objects ? list.objects : [];
+        }
+
+        function getActions(){
+            return list.actions ? list.actions : [];
+        }
+
+        function removeSubFromSubList(subject){
+            list.subjects = _.without(list.subjects, subject);
+        }
+
+        function removeObjFromObjList(object){
+            list.objects = _.without(list.objects, object);
+        }
+
+        function removeActFromActList(action){
+            list.actions = _.without(list.actions, action);
+        }
+
+        function deletePolicy( event, policy){
+
+            list.policy = policy;
+
+            activate();
+
+        }
+
+    }
+
+})();
\ No newline at end of file
diff --git a/moonv4/moon_gui/static/app/policy/edit/parameter/rules/rules-list.tpl.html b/moonv4/moon_gui/static/app/policy/edit/parameter/rules/rules-list.tpl.html
new file mode 100644
index 00000000..3ec54239
--- /dev/null
+++ b/moonv4/moon_gui/static/app/policy/edit/parameter/rules/rules-list.tpl.html
@@ -0,0 +1,102 @@
+<div>
+
+    <div class="row">
+        <div class="table-responsive" data-role="table">
+
+            <table class="table table-striped table-hover" ng-table="list.table">
+
+                <thead>
+
+                <tr>
+
+                    <th class="customTables sortable"
+                        ng-class="{ 'sort-asc': list.table.isSortBy('name', 'asc'), 'sort-desc': list.table.isSortBy('name', 'desc') }"
+                        ng-click="list.table.sorting('name', list.table.isSortBy('name', 'asc') ? 'desc' : 'asc')">
+                        <div data-translate="moon.policy.rules.list.table.id">Id</div>
+                    </th>
+
+                    <th class="customTables sortable"
+                        ng-class="{ 'sort-asc': list.table.isSortBy('description', 'asc'), 'sort-desc': list.table.isSortBy('description', 'desc') }"
+                        ng-click="list.table.sorting('description', list.table.isSortBy('description', 'asc') ? 'desc' : 'asc')">
+                        <div data-translate="moon.policy.rules.list.table.metaRule">Meta Rule</div>
+                    </th>
+
+                    <th class="customTables sortable"
+                        ng-class="{ 'sort-asc': list.table.isSortBy('enabled', 'asc'), 'sort-desc': list.table.isSortBy('enabled', 'desc') }"
+                        ng-click="list.table.sorting('enabled', list.table.isSortBy('enabled', 'asc') ? 'desc' : 'asc')">
+                        <div data-translate="moon.policy.rules.list.table.enabled">Enabled</div>
+                    </th>
+
+                    <th class="customTables sortable"
+                        ng-class="{ 'sort-asc': list.table.isSortBy('enabled', 'asc'), 'sort-desc': list.table.isSortBy('enabled', 'desc') }"
+                        ng-click="list.table.sorting('enabled', list.table.isSortBy('enabled', 'asc') ? 'desc' : 'asc')">
+                        <div data-translate="moon.policy.rules.list.table.rule">Rule</div>
+                    </th>
+                </tr>
+
+                </thead>
+
+                <moon-loader ng-if="list.loadingRules"></moon-loader>
+
+                <tbody ng-if="!list.loadingRules && !list.hasRules()">
+                    <tr>
+                        <td colspan="2"><span data-translate="moon.policy.rules.list.table.notFound">There is no Rules</span></td>
+                    </tr>
+                </tbody>
+
+                <tbody ng-if="!list.loadingRules && list.hasRules()">
+
+                <tr ng-repeat="aRule in $data | filter:list.search.find | orderBy:sort:reverse">
+                    <td ng-bind="aRule.id"></td>
+
+                    <td>
+                        <span ng-if="!list.getMetaRuleFromRule(aRule)">
+                            <moon-loader ng-if="!list.getMetaRuleFromRule(aRule)" ></moon-loader>
+                            <em data-translate="moon.policy.rules.list.table.loading.metaRule">Loading </em>
+                        </span>
+
+                        <span ng-if="list.getMetaRuleFromRule(aRule)">
+                            <span ng-bind="aRule.meta_rule.name"></span>
+                        </span>
+                    </td>
+
+                    <td>
+                        <span ng-if="aRule.enabled" class="glyphicon glyphicon-ok"></span>
+                        <span ng-if="!aRule.enabled" class="glyphicon glyphicon-remove"></span>
+                    </td>
+
+                    <td >
+
+                        <span ng-if="!list.getMetaRuleFromRule(aRule)">
+                            <moon-loader ng-if="!list.getMetaRuleFromRule(aRule)" ></moon-loader>
+                            <em data-translate="moon.policy.rules.list.table.loading.metaRule">Loading </em>
+                        </span>
+
+
+                        <span ng-if="list.getMetaRuleFromRule(aRule)" ng-repeat="(key, value) in aRule.rule">
+
+                             <span ng-if="!list.getCategoryFromRuleIndex(key, aRule)">
+                                <moon-loader ng-if="!list.getCategoryFromRuleIndex(key, aRule)" ></moon-loader>
+                            </span>
+
+                            <span ng-if="list.getCategoryFromRuleIndex(key, aRule)">
+                                <span ng-if="aRule.rule_value[key].category.name" ng-bind="aRule.rule_value[key].category.name"></span>
+                                <span ng-if="aRule.rule_value[key].category.value.name" ng-bind="aRule.rule_value[key].category.value.name"></span>
+                                <span ng-if="key < aRule.rule.length-1">,</span>
+                            </span>
+
+                        </span>
+
+                    </td>
+
+                </tr>
+
+                </tbody>
+
+            </table>
+
+        </div>
+
+    </div>
+
+</div>
\ No newline at end of file
diff --git a/moonv4/moon_gui/static/app/policy/edit/parameter/rules/rules.list.dir.js b/moonv4/moon_gui/static/app/policy/edit/parameter/rules/rules.list.dir.js
new file mode 100644
index 00000000..98e1d62b
--- /dev/null
+++ b/moonv4/moon_gui/static/app/policy/edit/parameter/rules/rules.list.dir.js
@@ -0,0 +1,254 @@
+(function() {
+
+    'use strict';
+
+    angular
+        .module('moon')
+        .directive('moonRulesList', moonRulesList);
+
+    moonRulesList.$inject = [];
+
+    function moonRulesList() {
+
+        return {
+            templateUrl : 'html/policy/edit/parameter/rules/rules-list.tpl.html',
+            bindToController : true,
+            controller : moonRulesListController,
+            controllerAs : 'list',
+            scope : {
+                policy: '=',
+                editMode : '='
+            },
+            restrict : 'E',
+            replace : true
+        };
+    }
+
+    angular
+        .module('moon')
+        .controller('moonRulesListController', moonRulesListController);
+
+    moonRulesListController.$inject = [ 'NgTableParams', '$filter', 'metaRuleService', 'ruleService', 'dataService'];
+
+    function moonRulesListController( NgTableParams, $filter, metaRuleService, ruleService, dataService) {
+
+        var list = this;
+
+        list.rules = [];
+
+        list.loadingRules = true;
+
+        list.table = {};
+
+        list.getRules = getRules;
+        list.hasRules = hasRules;
+        list.refreshRules = refreshRules;
+
+        list.getMetaRuleFromRule = getMetaRuleFromRule;
+        list.getCategoryFromRuleIndex = getCategoryFromRuleIndex;
+
+        list.isRuleIndexSubjectCategory = isRuleIndexSubjectCategory;
+        list.isRuleIndexObjectCategory = isRuleIndexObjectCategory;
+        list.isRuleIndexActionCategory = isRuleIndexActionCategory;
+
+        activate();
+
+        function activate(){
+
+
+            newRulesTable();
+
+            manageRules();
+        }
+
+
+
+        function manageRules(){
+
+            ruleService.findAllFromPolicyWithCallback(list.policy.id, function(data){
+
+                console.log('rules');
+                console.log(data);
+
+                list.rules = data;
+                list.loadingRules = false;
+
+                refreshRules();
+            });
+        }
+
+
+
+
+
+        function newRulesTable() {
+
+            list.table = new NgTableParams({
+
+                page: 1,            // show first page
+                count: 10,          // count per page
+                sorting: {
+                    name: 'asc' // initial sorting
+                }
+
+            }, {
+
+                total: function () { return list.getRules().length; }, // length of data
+                getData: function($defer, params) {
+
+                    var orderedData = params.sorting() ? $filter('orderBy')(list.getRules(), params.orderBy()) : list.getRules();
+                    $defer.resolve(orderedData.slice((params.page() - 1) * params.count(), params.page() * params.count()));
+
+                },
+                $scope: { $data: {} }
+
+            });
+
+            return list.table;
+
+        }
+
+        function getMetaRuleFromRule(rule) {
+
+            if(_.has(rule, 'meta_rule')){
+                return rule.meta_rule;
+            }
+
+            // if the call has not been made
+            if(!_.has(rule, 'callMetaRuleInProgress')){
+
+                rule.callMetaRuleInProgress = true;
+
+                metaRuleService.findOneWithCallback(rule.meta_rule_id, function(meta_rule){
+
+                    rule.callMetaRuleInProgress = false;
+                    rule.meta_rule = meta_rule;
+
+                });
+
+            }
+
+            // if the call is in progress return false
+            return false;
+        }
+
+
+        /**
+         * Prerequisite : meta Rule  should be completely loaded
+         * @param index
+         * @param rule
+         */
+        function getCategoryFromRuleIndex(index, rule){
+
+            if(!_.has(rule, 'rule_value')){
+                // setting an array which will contains every value of the category
+                rule.rule_value = Array.apply(null, new Array(rule.rule.length)).map(function(){
+                    return {
+                        category: {}
+                    }
+                });
+            }
+
+            if(_.has(rule.rule_value[index], 'callCategoryInProgress') && !rule.rule_value[index].callCategoryInProgress ){
+                return rule.rule_value[index].category;
+            }
+
+            // if the call has not been made
+            if(!_.has(rule.rule_value[index], 'callCategoryInProgress')){
+
+                rule.rule_value[index].callCategoryInProgress = true;
+
+                var categoryId = 0;
+
+                if(list.isRuleIndexSubjectCategory(index, rule)){
+
+                    categoryId = rule.meta_rule.subject_categories[index];
+
+                    dataService.subject.data.findOne(list.policy.id, categoryId, rule.rule[index], function(category){
+
+                        rule.rule_value[index].callCategoryInProgress = false;
+                        rule.rule_value[index].category = category;
+
+                    });
+
+                }else if(list.isRuleIndexObjectCategory(index, rule)){
+
+
+                    categoryId = rule.meta_rule.object_categories[index - rule.meta_rule.subject_categories.length ];
+
+                    dataService.object.data.findOne(list.policy.id, categoryId, rule.rule[index], function(category){
+
+                        rule.rule_value[index].callCategoryInProgress = false;
+                        rule.rule_value[index].category = category;
+
+                    });
+
+
+                }else if(list.isRuleIndexActionCategory(index, rule)){
+
+                    categoryId = rule.meta_rule.action_categories[index - rule.meta_rule.subject_categories.length - rule.meta_rule.object_categories.length ];
+
+                    dataService.action.data.findOne(list.policy.id, categoryId, rule.rule[index], function(category){
+
+                        rule.rule_value[index].callCategoryInProgress = false;
+                        rule.rule_value[index].category = category;
+
+                    });
+
+                }else{
+
+                    rule.rule_value[index].callCategoryInProgress = false;
+                    rule.rule_value[index].category = {
+                        name : 'ERROR'
+                    }
+                }
+
+            }
+            // if the call is in progress return false
+            return false;
+        }
+
+        function isRuleIndexSubjectCategory(index, rule){
+
+            var ind = index + 1;
+
+            return ind <= rule.meta_rule.subject_categories.length;
+
+        }
+
+        function isRuleIndexObjectCategory(index, rule){
+
+            var ind = index + 1;
+
+            return  rule.meta_rule.subject_categories.length < ind && ind <=  ( rule.meta_rule.object_categories.length + rule.meta_rule.subject_categories.length );
+
+        }
+
+        function isRuleIndexActionCategory(index, rule){
+
+            var ind = index + 1;
+
+            return ( rule.meta_rule.object_categories.length + rule.meta_rule.subject_categories.length ) < ind && ind <= ( rule.meta_rule.object_categories.length + rule.meta_rule.subject_categories.length + rule.meta_rule.action_categories.length);
+
+        }
+
+        function getRules() {
+            return (list.rules) ? list.rules : [];
+        }
+
+        function hasRules() {
+            return list.getRules().length > 0;
+        }
+
+
+        /**
+         * Refresh the table
+         */
+        function refreshRules(){
+            list.table.total(list.rules.length);
+            list.table.reload();
+        }
+
+    }
+
+})();
\ No newline at end of file
diff --git a/moonv4/moon_gui/static/app/policy/edit/policy-edit-basic.tpl.html b/moonv4/moon_gui/static/app/policy/edit/policy-edit-basic.tpl.html
new file mode 100644
index 00000000..f55c1d05
--- /dev/null
+++ b/moonv4/moon_gui/static/app/policy/edit/policy-edit-basic.tpl.html
@@ -0,0 +1,89 @@
+<div class="row">
+
+    <form class="form-horizontal" role="form" name="edit.form">
+
+        <div class="form-group">
+
+            <label for="id" class="col-sm-3 control-label" data-translate="moon.policy.edit.basic.form.id">Id</label>
+
+            <div class="col-sm-6">
+
+                <input name="id" id="id" disabled class="form-control" type="text" data-ng-model="edit.policyToEdit.id" required />
+
+            </div>
+
+        </div>
+
+        <div class="form-group" ng-class="{'has-error': edit.form.name.$invalid && edit.form.name.$dirty}">
+
+            <label for="name" class="col-sm-3 control-label" data-translate="moon.policy.edit.basic.form.name">Name</label>
+
+            <div class="col-sm-6">
+
+                <input name="name" id="name" class="form-control" type="text" data-ng-model="edit.policyToEdit.name" required />
+
+                <div class="help-block" ng-show="edit.form.name.$dirty && edit.form.name.$invalid">
+                    <small class="error" ng-show="edit.form.name.$error.required" data-translate="moon.policy.edit.basic.check.name.required">Name is required</small>
+                </div>
+
+            </div>
+
+        </div>
+
+
+        <div class="form-group" ng-class="{'has-error': edit.form.model.$dirty && (edit.form.model.$invalid || !edit.selectedModel)}">
+
+            <label class="col-sm-3 control-label" data-translate="moon.policy.edit.basic.form.model">Models</label>
+
+            <div class="col-sm-6">
+
+                <ui-select ng-model="edit.selectedModel" name="model" required>
+                    <ui-select-match placeholder="(None)">{{$select.selected.name}}</ui-select-match>
+                    <ui-select-choices repeat="model in edit.models">
+                        <div ng-value="model">{{model.name}}</div>
+                    </ui-select-choices>
+                </ui-select>
+
+                <moon-loader ng-if="edit.modelsLoading"></moon-loader>
+
+                <div class="help-block" ng-show="edit.form.model.$dirty && (edit.form.model.$invalid || !edit.selectedModel)">
+                    <small class="error" ng-show="edit.form.model.$error.required" data-translate="moon.policy.edit.basic.check.model.required">Model is required</small>
+                </div>
+
+            </div>
+
+        </div>
+
+        <div class="form-group">
+
+            <label for="description" class="col-sm-3 control-label" data-translate="moon.policy.edit.basic.form.description">Description</label>
+            <div class="col-sm-6">
+                <textarea id="description" name="description" class="form-control" data-ng-model="edit.policyToEdit.description"></textarea>
+            </div>
+
+        </div>
+
+        <div class="form-group">
+
+            <div class="col-sm-2 col-sm-offset-3">
+
+                <a href=""  ng-disabled="edit.loading" ng-click="edit.init()" class="btn btn-default">
+                    <span data-translate="moon.policy.edit.basic.action.init">Init</span>
+                </a>
+            </div>
+
+            <div class="col-sm-4 col-sm-offset-2">
+
+                <a href="" ng-disabled="edit.loading" ng-click="edit.editPolicy()" class="btn btn-warning">
+                    <span class="glyphicon glyphicon-save"></span>
+                    <span data-translate="moon.policy.edit.basic.action.update">Update</span>
+                </a>
+
+                <moon-loader ng-if="edit.loading"></moon-loader>
+            </div>
+
+        </div>
+
+    </form>
+
+</div>
\ No newline at end of file
diff --git a/moonv4/moon_gui/static/app/policy/edit/policy-edit.tpl.html b/moonv4/moon_gui/static/app/policy/edit/policy-edit.tpl.html
new file mode 100644
index 00000000..550d1e4c
--- /dev/null
+++ b/moonv4/moon_gui/static/app/policy/edit/policy-edit.tpl.html
@@ -0,0 +1,202 @@
+<div class="container">
+
+    <div class="row">
+        <h3 class="pull-left" data-translate="moon.policy.edit.title" data-translate-values="{ policyName: edit.policy.name }">Edit</h3>
+    </div>
+
+    <div class="panel panel-default">
+
+        <div class="panel-heading">
+
+            <span data-translate="moon.policy.edit.basic.title" >Basic Information</span>
+            <a href="" ng-click="edit.editBasic = !edit.editBasic">
+                <span data-translate="moon.policy.edit.update">Update</span>
+                <span class="glyphicon glyphicon-cog"></span>
+            </a>
+
+        </div>
+
+        <div class="panel-body">
+
+            <div ng-if="edit.editBasic">
+                <moon-policy-edit-basic policy="edit.policy"></moon-policy-edit-basic>
+            </div>
+
+            <div ng-if="!edit.editBasic">
+
+                <dl class="dl-horizontal">
+
+                    <dt data-translate="moon.policy.edit.basic.form.id">Id</dt>
+                    <dd ng-bind="edit.policy.id"></dd>
+
+                    <dt data-translate="moon.policy.edit.basic.form.name">Name</dt>
+                    <dd ng-bind="edit.policy.name"></dd>
+
+                    <dt data-translate="moon.policy.edit.basic.form.genre">Genre</dt>
+                    <dd ng-bind="edit.policy.genre"></dd>
+
+                    <dt data-translate="moon.policy.edit.basic.form.model">Model</dt>
+                    <dd>
+
+                        <span ng-if="edit.loadingModel">
+                            <moon-loader ng-if="edit.loadingModel"></moon-loader>
+                        </span>
+                        <span ng-if="!edit.loadingModel">
+                            <span ng-bind="edit.policy.model.name" ></span>
+                        </span>
+
+                    </dd>
+
+                    <dt data-translate="moon.policy.edit.basic.form.description">Description</dt>
+                    <dd ng-bind="edit.policy.description"></dd>
+
+                </dl>
+
+            </div>
+
+        </div>
+
+    </div>
+
+    <div class="panel panel-default">
+
+        <div class="panel-heading">
+
+            <span data-translate="moon.policy.edit.perimeter.title" >Perimeters</span>
+
+            <a href="" ng-click="edit.showPerimeters = !edit.showPerimeters">
+
+                <span ng-if="!edit.showPerimeters">
+                    <span data-translate="moon.policy.edit.show.open">Show</span>
+                    <span class="glyphicon glyphicon-eye-open"></span>
+                </span>
+
+                <span ng-if="edit.showPerimeters">
+                    <span data-translate="moon.policy.edit.show.close">Show</span>
+                    <span class="glyphicon glyphicon-eye-close"></span>
+                </span>
+
+            </a>
+
+            <!--<a href="" ng-if="edit.showPerimeters">
+                <span data-translate="moon.policy.edit.update">Update</span>
+                <span class="glyphicon glyphicon-cog"></span>
+            </a>-->
+
+        </div>
+
+        <div class="panel-body" ng-if="edit.showPerimeters">
+
+            <moon-perimeter-list edit-mode="false" policy="edit.policy" ></moon-perimeter-list>
+
+        </div>
+
+    </div>
+
+    <div class="panel panel-default">
+
+        <div class="panel-heading">
+
+            <span data-translate="moon.policy.edit.data.title" >Data</span>
+
+            <a href="" ng-click="edit.showData = !edit.showData">
+
+                <span ng-if="!edit.showData">
+                    <span data-translate="moon.policy.edit.show.open">Show</span>
+                    <span class="glyphicon glyphicon-eye-open"></span>
+                </span>
+
+                <span ng-if="edit.showData">
+                    <span data-translate="moon.policy.edit.show.close">Show</span>
+                    <span class="glyphicon glyphicon-eye-close"></span>
+                </span>
+
+            </a>
+
+            <!--<a href="" ng-if="edit.showData">
+                <span data-translate="moon.policy.edit.update">Update</span>
+                <span class="glyphicon glyphicon-cog"></span>
+            </a>-->
+
+        </div>
+
+        <div class="panel-body" ng-if="edit.showData">
+
+            <moon-data-list edit-mode="false" policy="edit.policy" ></moon-data-list>
+
+        </div>
+
+    </div>
+
+    <div class="panel panel-default">
+
+        <div class="panel-heading">
+
+            <span data-translate="moon.policy.edit.rules.title" >Rules</span>
+
+            <a href="" ng-click="edit.showRules = !edit.showRules">
+
+                <span ng-if="!edit.showRules">
+                    <span data-translate="moon.policy.edit.show.open">Show</span>
+                    <span class="glyphicon glyphicon-eye-open"></span>
+                </span>
+
+                <span ng-if="edit.showRules">
+                    <span data-showRules="moon.policy.edit.show.close">Close</span>
+                    <span class="glyphicon glyphicon-eye-close"></span>
+                </span>
+
+            </a>
+
+            <!--<a href="" ng-if="edit.showRules">
+                <span data-translate="moon.policy.edit.update">Update</span>
+                <span class="glyphicon glyphicon-cog"></span>
+            </a>-->
+
+        </div>
+
+        <div class="panel-body" ng-if="edit.showRules">
+
+            <moon-rules-list edit-mode="false" policy="edit.policy" ></moon-rules-list>
+
+        </div>
+
+    </div>
+
+
+    <div class="panel panel-default">
+
+        <div class="panel-heading">
+
+            <span data-translate="moon.policy.edit.assignments.title" >Assignments</span>
+
+            <a href="" ng-click="edit.showAssignments = !edit.showAssignments">
+
+                <span ng-if="!edit.showAssignments">
+                    <span data-translate="moon.policy.edit.show.open">Show</span>
+                    <span class="glyphicon glyphicon-eye-open"></span>
+                </span>
+
+                <span ng-if="edit.showAssignments">
+                    <span data-showRules="moon.policy.edit.show.close">Close</span>
+                    <span class="glyphicon glyphicon-eye-close"></span>
+                </span>
+
+            </a>
+
+            <!--<a href="" ng-if="edit.showRules">
+                <span data-translate="moon.policy.edit.update">Update</span>
+                <span class="glyphicon glyphicon-cog"></span>
+            </a>-->
+
+        </div>
+
+        <div class="panel-body" ng-if="edit.showAssignments">
+
+            <moon-assignments-list edit-mode="false" policy="edit.policy" ></moon-assignments-list>
+
+        </div>
+
+    </div>
+
+</div>
diff --git a/moonv4/moon_gui/static/app/policy/edit/policy.controller.edit.js b/moonv4/moon_gui/static/app/policy/edit/policy.controller.edit.js
new file mode 100644
index 00000000..123ee58b
--- /dev/null
+++ b/moonv4/moon_gui/static/app/policy/edit/policy.controller.edit.js
@@ -0,0 +1,74 @@
+(function() {
+
+    'use strict';
+
+    angular
+        .module('moon')
+        .controller('PolicyEditController', PolicyEditController);
+
+    PolicyEditController.$inject = ['$scope', '$rootScope', 'policy', 'modelService'];
+
+    function PolicyEditController($scope, $rootScope, policy, modelService) {
+
+        var edit = this;
+
+        edit.policy = policy;
+
+        edit.editBasic = false;
+
+        edit.showPerimeters = false;
+        edit.showData = false;
+        edit.showRules = false;
+        edit.showAssignments = false;
+
+
+        activate();
+
+        function activate(){
+
+            manageModel();
+
+        }
+
+        function manageModel(){
+
+            edit.loadingModel = true;
+
+            modelService.findOneWithCallback( edit.policy.model_id, function(model){
+
+                edit.loadingModel = false;
+                edit.policy.model = model;
+
+            });
+
+        }
+
+        /*
+         * ---- events
+         */
+        var rootListeners = {
+
+            'event:policyUpdatedSuccess': $rootScope.$on('event:policyUpdatedSuccess', policyUpdatedSuccess)
+
+        };
+
+        for (var unbind in rootListeners) {
+            $scope.$on('$destroy', rootListeners[unbind]);
+        }
+
+        /**
+         * When the model is updated, this function refresh the current model with the new changes
+         * @param event
+         * @param policy
+         */
+        function policyUpdatedSuccess(event, policy){
+
+            edit.policy = policy;
+
+            manageModel();
+
+        }
+
+    }
+
+})();
diff --git a/moonv4/moon_gui/static/app/policy/edit/policy.edit.basic.dir.js b/moonv4/moon_gui/static/app/policy/edit/policy.edit.basic.dir.js
new file mode 100644
index 00000000..c32d9e69
--- /dev/null
+++ b/moonv4/moon_gui/static/app/policy/edit/policy.edit.basic.dir.js
@@ -0,0 +1,134 @@
+(function() {
+
+    'use strict';
+
+    angular
+        .module('moon')
+        .directive('moonPolicyEditBasic', moonPolicyEditBasic);
+
+    moonPolicyEditBasic.$inject = [];
+
+    function moonPolicyEditBasic() {
+
+        return {
+            templateUrl : 'html/policy/edit/policy-edit-basic.tpl.html',
+            bindToController : true,
+            controller : moonPolicyEditBasicController,
+            controllerAs : 'edit',
+            scope : {
+                policy : '='
+            },
+            restrict : 'E',
+            replace : true
+        };
+    }
+
+    angular
+        .module('moon')
+        .controller('moonPolicyEditBasicController', moonPolicyEditBasicController);
+
+    moonPolicyEditBasicController.$inject = ['$scope', 'policyService', 'formService', 'alertService', '$translate', 'utilService', 'modelService'];
+
+    function moonPolicyEditBasicController($scope, policyService, formService, alertService, $translate, utilService, modelService){
+
+        var edit = this;
+
+        edit.editPolicy = editPolicy;
+        edit.init = init;
+
+        edit.form = {};
+        edit.modelsLoading = true;
+
+
+        activate();
+
+        function activate(){
+
+            edit.policy = $scope.edit.policy;
+
+            edit.policyToEdit = angular.copy(edit.policy);
+
+            console.log(edit.policyToEdit);
+
+            resolveModels();
+
+        }
+
+        /*
+         *
+         */
+
+        function resolveModels() {
+
+            modelService.findAllWithCallBack(resolveModelsCallback);
+
+        }
+
+        function resolveModelsCallback(models) {
+
+            edit.models = models;
+
+            _.each(models, function(model){
+
+                if(model.id === edit.policy.model_id){
+                    edit.selectedModel = model;
+                }
+
+            });
+
+            edit.modelsLoading = false;
+
+        }
+
+
+        function editPolicy(){
+
+            if(formService.isInvalid(edit.form)) {
+
+                formService.checkFieldsValidity(edit.form);
+
+            }else{
+
+                edit.loading = true;
+
+                delete edit.policyToEdit.model;
+
+                edit.policyToEdit.model_id = edit.selectedModel.id;
+
+                policyService.update(edit.policyToEdit, updateSuccess, updateError);
+
+            }
+
+            function updateSuccess(data) {
+
+                var updatedPolicy = utilService.transformOne(data, 'policies');
+
+                $translate('moon.policy.edit.basic.success', { policyName: updatedPolicy.name }).then( function(translatedValue) {
+                    alertService.alertSuccess(translatedValue);
+                });
+
+                edit.loading = false;
+
+                $scope.$emit('event:policyUpdatedSuccess', updatedPolicy);
+
+            }
+
+            function updateError(reason) {
+
+                $translate('moon.policy.edit.basic.error', { policyName: edit.policy.name }).then( function(translatedValue) {
+                    alertService.alertError(translatedValue);
+                });
+
+                edit.loading = false;
+
+            }
+        }
+
+        function init(){
+
+            edit.policyToEdit = angular.copy(edit.policy);
+
+        }
+    }
+
+})();
diff --git a/moonv4/moon_gui/static/app/policy/policy-list.tpl.html b/moonv4/moon_gui/static/app/policy/policy-list.tpl.html
new file mode 100644
index 00000000..aeb90f0b
--- /dev/null
+++ b/moonv4/moon_gui/static/app/policy/policy-list.tpl.html
@@ -0,0 +1,131 @@
+<div class="container">
+
+    <div>
+        <form class="form-inline pull-right">
+            <div class="form-group">
+                <div>
+                    <input id="searcPolicy" data-ng-model="list.search.query" type="text" class="form-control" placeholder="{{'moon.policy.list.search.placeholder' | translate}}" />
+                </div>
+            </div>
+            <div class="form-group">
+                <div>
+                    <button type="submit" class="btn btn-danger" data-ng-click="list.search.reset()" data-translate="moon.policy.list.search.reset">Reset</button>
+                </div>
+            </div>
+        </form>
+    </div>
+
+    <div>&nbsp;</div>
+    <div>&nbsp;</div>
+    <div>&nbsp;</div>
+
+
+    <div class="row" >
+
+        <div class="table-responsive" data-role="table">
+
+            <table class="table table-striped table-hover" ng-table="list.table">
+
+                <colgroup>
+                    <col class="col-md-4" />
+                    <col class="col-md-2" />
+                    <col class="col-md-2" />
+                    <col class="col-md-1" />
+                </colgroup>
+
+                <thead>
+
+                <tr>
+
+                    <th class="customTables sortable"
+                        ng-class="{ 'sort-asc': list.table.isSortBy('name', 'asc'), 'sort-desc': list.table.isSortBy('name', 'desc') }"
+                        ng-click="list.table.sorting('name', list.table.isSortBy('name', 'asc') ? 'desc' : 'asc')">
+                        <div data-translate="moon.policy.list.table.name">Name</div>
+                    </th>
+
+                    <th class="customTables sortable"
+                        ng-class="{ 'sort-asc': list.table.isSortBy('genre', 'asc'), 'sort-desc': list.table.isSortBy('genre', 'desc') }"
+                        ng-click="list.table.sorting('genre', list.table.isSortBy('genre', 'asc') ? 'desc' : 'asc')">
+                        <div data-translate="moon.policy.list.table.genre">Genre</div>
+                    </th>
+
+                    <th class="customTables sortable"
+                        ng-class="{ 'sort-asc': list.table.isSortBy('description', 'asc'), 'sort-desc': list.table.isSortBy('description', 'desc') }"
+                        ng-click="list.table.sorting('description', list.table.isSortBy('description', 'asc') ? 'desc' : 'asc')">
+                        <div data-translate="moon.policy.list.table.description">Description</div>
+                    </th>
+
+                    <th class="customTables sortable">
+                        <div data-translate="moon.policy.list.action.title">Actions</div>
+                    </th>
+
+                </tr>
+
+                </thead>
+
+                <tbody ng-if="!list.hasPolicies()">
+                    <tr>
+                        <td colspan="12"><span data-translate="moon.policy.list.table.notFound">There is no policy</span></td>
+                    </tr>
+                </tbody>
+
+                <tbody ng-if="list.hasPolicies()">
+
+                    <tr ng-repeat="policy in $data | filter:list.search.find | orderBy:sort:reverse">
+
+                        <td ng-bind="policy.name"></td>
+
+                        <td ng-bind="policy.genre"></td>
+
+                        <td ng-bind="policy.description"></td>
+
+                        <td>
+                            <div class="dropdown">
+                                <button class="btn btn-primary dropdown-toggle" type="button" data-toggle="dropdown">
+                                    <span data-translate="moon.policy.list.action.title">Actions</span>
+                                    <span class="caret"></span>
+                                </button>
+                                <ul class="dropdown-menu">
+
+                                    <li>
+                                        <a href="" ui-sref="moon.policy.edit({id: policy.id})">
+                                            <span class="glyphicon glyphicon-cog"></span>
+                                            <span class="control-label"  data-translate="moon.policy.list.action.edit">Edit</span>
+                                        </a>
+                                    </li>
+
+                                    <li class="divider"></li>
+
+                                    <li>
+                                        <a href="" ng-click="list.del.showModal(policy)">
+                                            <span class="glyphicon glyphicon-trash"></span>
+                                            <span class="control-label" data-translate="moon.policy.list.action.delete">Delete</span>
+                                        </a>
+                                    </li>
+
+                                </ul>
+                            </div>
+                        </td>
+
+                    </tr>
+
+                </tbody>
+
+            </table>
+
+        </div>
+
+        <div class="container">
+
+            <div class="form-inline form-group">
+                <a href="" ng-click="list.add.showModal()" class="btn btn-default">
+                    <span class="glyphicon glyphicon-plus-sign"></span>
+                    <span data-translate="moon.policy.list.action.add">Add Model</span>
+                </a>
+            </div>
+
+        </div>
+
+    </div>
+
+</div>
\ No newline at end of file
diff --git a/moonv4/moon_gui/static/app/policy/policy-mapped-list.tpl.html b/moonv4/moon_gui/static/app/policy/policy-mapped-list.tpl.html
new file mode 100644
index 00000000..127dae3b
--- /dev/null
+++ b/moonv4/moon_gui/static/app/policy/policy-mapped-list.tpl.html
@@ -0,0 +1,88 @@
+<div class="container">
+
+    <div class="row" ng-if="list.loadingPolicies">
+        <moon-loader ng-if="list.loadingPolicies"></moon-loader>
+    </div>
+
+    <div class="row" ng-if="!list.loadingPolicies" >
+
+        <div class="table-responsive" data-role="table">
+
+            <table  class="table table-striped table-hover" ng-table="list.table">
+
+                <colgroup>
+                    <col class="col-md-4" />
+                    <col class="col-md-2" />
+                    <col class="col-md-2" />
+                    <col class="col-md-1" />
+                </colgroup>
+
+                <thead>
+
+                    <tr>
+
+                        <th class="customTables sortable"
+                            ng-class="{ 'sort-asc': list.table.isSortBy('name', 'asc'), 'sort-desc': list.table.isSortBy('name', 'desc') }"
+                            ng-click="list.table.sorting('name', list.table.isSortBy('name', 'asc') ? 'desc' : 'asc')">
+                            <div data-translate="moon.policy.list.table.name">Name</div>
+                        </th>
+
+                        <th class="customTables sortable"
+                            ng-class="{ 'sort-asc': list.table.isSortBy('genre', 'asc'), 'sort-desc': list.table.isSortBy('genre', 'desc') }"
+                            ng-click="list.table.sorting('genre', list.table.isSortBy('genre', 'asc') ? 'desc' : 'asc')">
+                            <div data-translate="moon.policy.list.table.genre">Genre</div>
+                        </th>
+
+                        <th class="customTables sortable"
+                            ng-class="{ 'sort-asc': list.table.isSortBy('description', 'asc'), 'sort-desc': list.table.isSortBy('description', 'desc') }"
+                            ng-click="list.table.sorting('description', list.table.isSortBy('description', 'asc') ? 'desc' : 'asc')">
+                            <div data-translate="moon.policy.list.table.description">Description</div>
+                        </th>
+
+                        <th class="customTables sortable">
+                            <div data-translate="moon.policy.list.action.title">Actions</div>
+                        </th>
+                    </tr>
+
+                </thead>
+
+                <tbody ng-if="!list.hasPolicies()">
+                    <tr>
+                        <td colspan="12"><span data-translate="moon.policy.list.table.notFound">There is no policy</span></td>
+                    </tr>
+                </tbody>
+
+                <tbody ng-if="list.hasPolicies()">
+
+                    <tr ng-repeat="policy in $data | filter:list.search.find | orderBy:sort:reverse">
+                        <td ng-bind="policy.name"></td>
+                        <td ng-bind="policy.genre"></td>
+                        <td ng-bind="policy.description"></td>
+                        <td>
+                            <a href="" ng-click="list.unmap.showModal(policy)">
+                                <span class="glyphicon glyphicon-transfer"></span>
+                                <em data-translate="moon.policy.list.action.unmap">Unmap</em>
+                            </a>
+                        </td>
+                    </tr>
+
+                </tbody>
+
+            </table>
+
+        </div>
+
+        <div class="container">
+
+            <div class="form-inline form-group">
+                <a href="" ng-click="list.map.showModal()" class="btn btn-default">
+                    <span class="glyphicon glyphicon-link"></span>
+                    <em data-translate="moon.policy.list.action.map">Map a Policy to PDP</em>
+                </a>
+            </div>
+
+        </div>
+
+    </div>
+
+</div>
\ No newline at end of file
diff --git a/moonv4/moon_gui/static/app/policy/policy.controller.list.js b/moonv4/moon_gui/static/app/policy/policy.controller.list.js
new file mode 100644
index 00000000..dc2db2cc
--- /dev/null
+++ b/moonv4/moon_gui/static/app/policy/policy.controller.list.js
@@ -0,0 +1,175 @@
+(function() {
+
+    'use strict';
+
+    angular
+        .module('moon')
+        .controller('PolicyListController', PolicyListController);
+
+    PolicyListController.$inject = ['$scope', 'policies', 'ngTableParams', '$filter', '$modal', '$rootScope'];
+
+    function PolicyListController($scope, policies, ngTableParams, $filter, $modal, $rootScope) {
+
+        var list = this;
+
+        list.policies = policies;
+
+        list.getPolicies = getPolicies;
+        list.hasPolicies = hasPolicies;
+        list.addPolicy = addPolicy;
+        list.refreshPolicies = refreshPolicies;
+        list.deletePolicy = deletePolicy;
+
+        list.table = {};
+
+        list.search = { query: '',
+            find: searchPolicy,
+            reset: searchReset };
+
+        list.add = { modal: $modal({ template: 'html/policy/action/policy-add.tpl.html', show: false }),
+            showModal: showAddModal };
+
+        list.del = { modal: $modal({ template: 'html/policy/action/policy-delete.tpl.html', show: false }),
+            showModal: showDeleteModal };
+
+        activate();
+
+        function activate(){
+
+            newPoliciesTable();
+
+        }
+
+
+        /*
+         * ---- events
+         */
+
+        var rootListeners = {
+
+            'event:policyCreatedSuccess': $rootScope.$on('event:policyCreatedSuccess', policyCreatedSuccess),
+            'event:policyCreatedError': $rootScope.$on('event:policyCreatedError', policyCreatedError),
+
+            'event:policyDeletedSuccess': $rootScope.$on('event:policyDeletedSuccess', policyDeletedSuccess),
+            'event:policyDeletedError': $rootScope.$on('event:policyDeletedError', policyDeletedError)
+
+        };
+
+        for (var unbind in rootListeners) {
+            $scope.$on('$destroy', rootListeners[unbind]);
+        }
+
+        function getPolicies() {
+            return (list.policies) ? list.policies : [];
+        }
+
+        function hasPolicies() {
+            return list.getPolicies().length > 0;
+        }
+
+        function newPoliciesTable() {
+
+            list.table = new ngTableParams({
+
+                page: 1,            // show first page
+                count: 10,          // count per page
+                sorting: {
+                    name: 'asc',
+                    genre: 'asc'
+                }
+
+            }, {
+
+                total: function () { return list.getPolicies().length; }, // length of data
+                getData: function($defer, params) {
+
+                    var orderedData = params.sorting() ? $filter('orderBy')(list.getPolicies(), params.orderBy()) : list.getPolicies();
+                    $defer.resolve(orderedData.slice((params.page() - 1) * params.count(), params.page() * params.count()));
+
+                },
+                $scope: { $data: {} }
+
+            });
+
+            return list.table;
+
+        }
+
+
+        /*
+         * ---- search
+         */
+
+        function searchPolicy(policy){
+            return (policy.name.indexOf(list.search.query) !== -1 || policy.genre.indexOf(list.search.query) !== -1 || policy.description.indexOf(list.search.query) !== -1);
+        }
+
+        function searchReset() {
+            list.search.query = '';
+        }
+
+        /*
+         * ---- add
+         */
+        function showAddModal() {
+            list.add.modal.$promise.then(list.add.modal.show);
+        }
+
+        function policyCreatedSuccess(event, pdp) {
+
+            list.addPolicy(pdp);
+            list.refreshPolicies();
+
+            list.add.modal.hide();
+
+        }
+
+        function policyCreatedError(event, pdp) {
+            list.add.modal.hide();
+        }
+
+        function addPolicy(policy) {
+            list.policies.push(policy);
+        }
+
+        function refreshPolicies() {
+
+            list.table.total(list.policies.length);
+            list.table.reload();
+
+        }
+
+        /*
+         * ---- delete
+         */
+
+        function showDeleteModal(policy) {
+
+            list.del.modal.$scope.policy = policy;
+            list.del.modal.$promise.then(list.del.modal.show);
+
+        }
+
+        function deletePolicy(policy) {
+
+            list.policies = _.chain(list.policies).reject({id: policy.id}).value();
+
+        }
+
+        function policyDeletedSuccess(event, policy) {
+
+            list.deletePolicy(policy);
+            list.refreshPolicies();
+
+            list.del.modal.hide();
+
+        }
+
+        function policyDeletedError(event, policy) {
+            list.del.modal.hide();
+        }
+
+
+    }
+
+})();
diff --git a/moonv4/moon_gui/static/app/policy/policy.mapped.list.dir.js b/moonv4/moon_gui/static/app/policy/policy.mapped.list.dir.js
new file mode 100644
index 00000000..b3becde9
--- /dev/null
+++ b/moonv4/moon_gui/static/app/policy/policy.mapped.list.dir.js
@@ -0,0 +1,203 @@
+(function() {
+
+    'use strict';
+
+    angular
+        .module('moon')
+        .directive('moonPolicyMappedList', moonPolicyMappedList);
+
+    moonPolicyMappedList.$inject = [];
+
+    function moonPolicyMappedList() {
+
+        return {
+            templateUrl : 'html/policy/policy-mapped-list.tpl.html',
+            bindToController : true,
+            controller : moonPolicyMappedListController,
+            controllerAs : 'list',
+            scope : {
+                pdp : '='
+            },
+            restrict : 'E',
+            replace : true
+        };
+    }
+
+    angular
+        .module('moon')
+        .controller('moonPolicyMappedListController', moonPolicyMappedListController);
+
+    moonPolicyMappedListController.$inject = ['$scope', '$rootScope', 'NgTableParams', '$modal', '$filter', 'policyService'];
+
+    function moonPolicyMappedListController($scope, $rootScope, NgTableParams, $modal, $filter,  policyService){
+
+        var list = this;
+
+        list.table = {};
+
+
+        list.pdp = $scope.list.pdp;
+
+        list.getPolicies = getPolicies;
+        list.hasPolicies = hasPolicies;
+        list.refreshPolicies = refreshPolicies;
+
+        list.loadingPolicies = true;
+
+        list.policies = [];
+
+
+        activate();
+
+        function activate() {
+
+            loadPolicices(false);
+
+        }
+
+        /**
+         *
+         * @param refresh boolean, if !refresh then newPolicYtable will be called, if refresh, then refreshPolicies is called
+         */
+        function loadPolicices(refresh){
+
+            list.policiesId = list.pdp.security_pipeline;
+
+            policyService.findSomeWithCallback(list.policiesId, function(policies){
+
+
+                list.policies = policies;
+
+                list.loadingPolicies = false;
+
+                if(refresh){
+
+                    refreshPolicies();
+
+                }else{
+
+                    newMPolicyTable();
+
+                }
+
+            });
+
+        }
+
+        list.map = { modal: $modal({ template: 'html/policy/action/mapping/policy-map.tpl.html', show: false }),
+            showModal: showMapModal };
+
+        list.unmap = { modal: $modal({ template: 'html/policy/action/mapping/policy-unmap.tpl.html', show: false }),
+            showModal: showUnmapModal };
+
+        /*
+         * ---- events
+         */
+        var rootListeners = {
+
+            'event:policyMapToPdpSuccess': $rootScope.$on('event:policyMapToPdpSuccess', policyMapToPdpSuccess),
+            'event:policyMapToPdpError': $rootScope.$on('event:policyMapToPdpError', policyMapToPdpError),
+
+            'event:policyUnMappedToPdpSuccess': $rootScope.$on('event:policyUnMappedToPdpSuccess', policyUnmappedSuccess),
+            'event:policyUnMappedToPdpError': $rootScope.$on('event:policyUnMappedToPdpError', policyUnmappedError)
+
+        };
+
+        for (var unbind in rootListeners) {
+            $scope.$on('$destroy', rootListeners[unbind]);
+        }
+
+
+
+        function newMPolicyTable() {
+
+            list.table = new NgTableParams({
+
+                page: 1,            // show first page
+                count: 10,          // count per page
+                sorting: {
+                    name: 'asc' // initial sorting
+                }
+
+            }, {
+
+                total: function () { return list.getPolicies().length; }, // length of data
+                getData: function($defer, params) {
+
+                    var orderedData = params.sorting() ? $filter('orderBy')(list.getPolicies(), params.orderBy()) : list.getPolicies();
+                    $defer.resolve(orderedData.slice((params.page() - 1) * params.count(), params.page() * params.count()));
+
+                },
+                $scope: { $data: {} }
+
+            });
+
+            return list.table;
+
+        }
+
+
+        function getPolicies() {
+            return (list.policies) ? list.policies : [];
+        }
+
+        function hasPolicies() {
+            return list.getPolicies().length > 0;
+        }
+
+        function refreshPolicies(){
+
+            list.table.total(list.getPolicies().length);
+            list.table.reload();
+
+        }
+
+        function showMapModal(){
+            list.map.modal.$scope.pdp = list.pdp;
+            list.map.modal.$promise.then(list.map.modal.show);
+        }
+
+        function showUnmapModal(policy){
+
+            list.unmap.modal.$scope.pdp = list.pdp;
+            list.unmap.modal.$scope.policy = policy;
+
+            list.unmap.modal.$promise.then(list.unmap.modal.show);
+
+        }
+
+        function policyMapToPdpSuccess(event, pdp){
+
+            list.pdp = pdp;
+
+            loadPolicices(true);
+
+            list.map.modal.hide();
+
+        }
+
+
+        function policyMapToPdpError(event) {
+
+            list.map.modal.hide();
+
+        }
+
+        function policyUnmappedSuccess(event, pdp) {
+
+            list.pdp = pdp;
+
+            loadPolicices(true);
+
+            list.unmap.modal.hide();
+
+        }
+
+        function policyUnmappedError(event) {
+            list.unmap.modal.hide();
+        }
+
+
+    }
+
+})();