机场口岸通关物流辅助管理系统

运行版

+/*
+ * Activiti Modeler component part of the Activiti project
+ * Copyright 2005-2014 Alfresco Software, Ltd. All rights reserved.
+ * 
+ * This library is free software; you can redistribute it and/or
+ * modify it under the terms of the GNU Lesser General Public
+ * License as published by the Free Software Foundation; either
+ * version 2.1 of the License, or (at your option) any later version.
+ *
+ * This library is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
+ * Lesser General Public License for more details.
+
+ * You should have received a copy of the GNU Lesser General Public
+ * License along with this library; if not, write to the Free Software
+ * Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301  USA
+ */
+'use strict';
+
+var ACTIVITI = ACTIVITI || {};
+
+ACTIVITI.CONFIG = {
+	'contextRoot' : appContextRoot+'/service',
+};

+/*
+ * Activiti Modeler component part of the Activiti project
+ * Copyright 2005-2014 Alfresco Software, Ltd. All rights reserved.
+ * 
+ * This library is free software; you can redistribute it and/or
+ * modify it under the terms of the GNU Lesser General Public
+ * License as published by the Free Software Foundation; either
+ * version 2.1 of the License, or (at your option) any later version.
+ *
+ * This library is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
+ * Lesser General Public License for more details.
+
+ * You should have received a copy of the GNU Lesser General Public
+ * License along with this library; if not, write to the Free Software
+ * Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301  USA
+ */
+'use strict';
+
+var activitiModeler = angular.module('activitiModeler', [
+  'ngCookies',
+  'ngResource',
+  'ngSanitize',
+  'ngRoute',
+  'ngDragDrop',
+  'mgcrea.ngStrap', 
+  'ngGrid',
+  'ngAnimate',
+  'pascalprecht.translate',
+  'duScroll'
+]);
+
+var activitiModule = activitiModeler;
+
+activitiModeler
+  // Initialize routes
+  .config(['$selectProvider', '$translateProvider', function ($selectProvider, $translateProvider) {
+
+      // Override caret for bs-select directive
+      angular.extend($selectProvider.defaults, {
+          caretHtml: '&nbsp;<i class="icon icon-caret-down"></i>'
+      });
+        
+        // Initialize angular-translate
+        $translateProvider.useStaticFilesLoader({
+            prefix: './editor-app/i18n/',
+            suffix: '.json'
+        });
+
+        $translateProvider.preferredLanguage('en');
+
+        // remember language
+        $translateProvider.useCookieStorage();
+        
+  }])
+  .run(['$rootScope', '$timeout', '$modal', '$translate', '$location', '$window', '$http', '$q',
+        function($rootScope, $timeout, $modal, $translate, $location, $window, $http, $q) {
+	  
+			  $rootScope.config = ACTIVITI.CONFIG;
+			  
+			  $rootScope.editorInitialized = false;
+		      
+		      $rootScope.editorFactory = $q.defer();
+		
+		      $rootScope.forceSelectionRefresh = false;
+		
+		      $rootScope.ignoreChanges = false; // by default never ignore changes
+		      
+		      $rootScope.validationErrors = [];
+		      
+		      $rootScope.staticIncludeVersion = Date.now();
+
+			  /**
+		       * A 'safer' apply that avoids concurrent updates (which $apply allows).
+		       */
+		      $rootScope.safeApply = function(fn) {
+		          var phase = this.$root.$$phase;
+		          if(phase == '$apply' || phase == '$digest') {
+		              if(fn && (typeof(fn) === 'function')) {
+		                  fn();
+		              }
+		          } else {
+		              this.$apply(fn);
+		          }
+		      };
+	  
+	  
+            /**
+             * Initialize the event bus: couple all Oryx events with a dispatch of the
+             * event of the event bus. This way, it gets much easier to attach custom logic
+             * to any event.
+             */
+
+            /* Helper method to fetch model from server (always needed) */
+            function fetchModel(modelId) {
+
+                var modelUrl = KISBPM.URL.getModel(modelId);
+
+                $http({method: 'GET', url: modelUrl}).
+                    success(function (data, status, headers, config) {
+                        $rootScope.editor = new ORYX.Editor(data);
+                        $rootScope.modelData = angular.fromJson(data);
+                        $rootScope.editorFactory.resolve();
+                    }).
+                    error(function (data, status, headers, config) {
+                      console.log('Error loading model with id ' + modelId + ' ' + data);
+                    });
+            }
+
+
+            function initScrollHandling() {
+                var canvasSection = jQuery('#canvasSection');
+                canvasSection.scroll(function() {
+
+                    // Hides the resizer and quick menu items during scrolling
+
+                    var selectedElements = $rootScope.editor.selection;
+                    var subSelectionElements = $rootScope.editor._subSelection;
+
+                    $rootScope.selectedElements = selectedElements;
+                    $rootScope.subSelectionElements = subSelectionElements;
+                    if (selectedElements && selectedElements.length > 0) {
+                    	$rootScope.selectedElementBeforeScrolling = selectedElements[0];
+                    }
+
+                    jQuery('.Oryx_button').each(function(i, obj) {
+                    	$rootScope.orginalOryxButtonStyle = obj.style.display;
+                    	obj.style.display = 'none';
+                    });
+                    
+                    jQuery('.resizer_southeast').each(function(i, obj) {
+                    	$rootScope.orginalResizerSEStyle = obj.style.display;
+                        obj.style.display = 'none';
+                    });
+                    jQuery('.resizer_northwest').each(function(i, obj) {
+                    	$rootScope.orginalResizerNWStyle = obj.style.display;
+                        obj.style.display = 'none';
+                    });
+                    $rootScope.editor.handleEvents({type:ORYX.CONFIG.EVENT_CANVAS_SCROLL});
+                });
+
+                canvasSection.scrollStopped(function(){
+
+                    // Puts the quick menu items and resizer back when scroll is stopped.
+
+                    $rootScope.editor.setSelection([]); // needed cause it checks for element changes and does nothing if the elements are the same
+                    $rootScope.editor.setSelection($rootScope.selectedElements, $rootScope.subSelectionElements);
+                    $rootScope.selectedElements = undefined;
+                    $rootScope.subSelectionElements = undefined;
+
+                    function handleDisplayProperty(obj) {
+                        if (jQuery(obj).position().top > 0) {
+                            obj.style.display = 'block';
+                        } else {
+                            obj.style.display = 'none';
+                        }
+                    }
+
+                    jQuery('.Oryx_button').each(function(i, obj) {
+                        handleDisplayProperty(obj);
+                    });
+                    
+                    jQuery('.resizer_southeast').each(function(i, obj) {
+                        handleDisplayProperty(obj);
+                    });
+                    jQuery('.resizer_northwest').each(function(i, obj) {
+                        handleDisplayProperty(obj);
+                    });
+
+                });
+            }
+
+            /**
+             * Initialize the Oryx Editor when the content has been loaded
+             */
+            $rootScope.$on('$includeContentLoaded', function (event) {
+	            if (!$rootScope.editorInitialized) {
+
+	            	ORYX._loadPlugins();
+	
+	                var modelId = EDITOR.UTIL.getParameterByName('modelId');
+	                fetchModel(modelId);
+	
+	                $rootScope.window = {};
+	                var updateWindowSize = function() {
+	                    $rootScope.window.width = $window.innerWidth;
+	                    $rootScope.window.height  = $window.innerHeight;
+	                };
+	
+	                // Window resize hook
+	                angular.element($window).bind('resize', function() {
+	                    $rootScope.safeApply(updateWindowSize());
+	                });
+	
+	                $rootScope.$watch('window.forceRefresh', function(newValue) {
+	                    if(newValue) {
+	                        $timeout(function() {
+	                            updateWindowSize();
+	                            $rootScope.window.forceRefresh = false;
+	                        });
+	                    }
+	                });
+	
+	                updateWindowSize();
+
+	                // Hook in resizing of main panels when window resizes
+	                // TODO: perhaps move to a separate JS-file?
+	                jQuery(window).resize(function () {
+
+	                    // Calculate the offset based on the bottom of the module header
+	                    var offset = jQuery("#editor-header").offset();
+	                    var propSectionHeight = jQuery('#propertySection').height();
+	                    var canvas = jQuery('#canvasSection');
+	                    var mainHeader = jQuery('#main-header');
+
+	                    if (offset == undefined || offset === null
+	                        || propSectionHeight === undefined || propSectionHeight === null
+	                        || canvas === undefined || canvas === null || mainHeader === null) {
+	                        return;
+	                    }
+	                    
+	                    if ($rootScope.editor)
+	                	{
+	        	        	var selectedElements = $rootScope.editor.selection;
+	        	            var subSelectionElements = $rootScope.editor._subSelection;
+	        	
+	        	            $rootScope.selectedElements = selectedElements;
+	        	            $rootScope.subSelectionElements = subSelectionElements;
+	        	            if (selectedElements && selectedElements.length > 0)
+	        	            {
+	        	            	$rootScope.selectedElementBeforeScrolling = selectedElements[0];
+	        	            	
+	        	            	$rootScope.editor.setSelection([]); // needed cause it checks for element changes and does nothing if the elements are the same
+	        	                $rootScope.editor.setSelection($rootScope.selectedElements, $rootScope.subSelectionElements);
+	        	                $rootScope.selectedElements = undefined;
+	        	                $rootScope.subSelectionElements = undefined;
+	        	            }
+	                	}
+
+//	                    var totalAvailable = jQuery(window).height() - offset.top - mainHeader.height() - 21;
+	                    var totalAvailable = jQuery(window).height() - offset.top - mainHeader.height() - 42; // 隐藏顶部标题栏，调整下fix参数 ThinkGem
+	                    canvas.height(totalAvailable - propSectionHeight);
+	                    jQuery('#paletteSection').height(totalAvailable);
+
+	                    // Update positions of the resize-markers, according to the canvas
+
+	                    var actualCanvas = null;
+	                    if (canvas && canvas[0].children[1]) {
+	                        actualCanvas = canvas[0].children[1];
+	                    }
+
+	                    var canvasTop = canvas.position().top;
+	                    var canvasLeft = canvas.position().left;
+	                    var canvasHeight = canvas[0].clientHeight;
+	                    var canvasWidth = canvas[0].clientWidth;
+	                    var iconCenterOffset = 8;
+	                    var widthDiff = 0;
+
+	                    var actualWidth = 0;
+	                    if(actualCanvas) {
+	                        // In some browsers, the SVG-element clientwidth isn't available, so we revert to the parent
+	                        actualWidth = actualCanvas.clientWidth || actualCanvas.parentNode.clientWidth;
+	                    }
+
+
+	                    if(actualWidth < canvas[0].clientWidth) {
+	                        widthDiff = actualWidth - canvas[0].clientWidth;
+	                        // In case the canvas is smaller than the actual viewport, the resizers should be moved
+	                        canvasLeft -= widthDiff / 2;
+	                        canvasWidth += widthDiff;
+	                    }
+
+	                    var iconWidth = 17;
+	                    var iconOffset = 20;
+
+	                    var north = jQuery('#canvas-grow-N');
+	                    north.css('top', canvasTop + iconOffset + 'px');
+	                    north.css('left', canvasLeft - 10 + (canvasWidth - iconWidth) / 2 + 'px');
+
+	                    var south = jQuery('#canvas-grow-S');
+	                    south.css('top', (canvasTop + canvasHeight - iconOffset - iconCenterOffset) +  'px');
+	                    south.css('left', canvasLeft - 10 + (canvasWidth - iconWidth) / 2 + 'px');
+
+	                    var east = jQuery('#canvas-grow-E');
+	                    east.css('top', canvasTop - 10 + (canvasHeight - iconWidth) / 2 + 'px');
+	                    east.css('left', (canvasLeft + canvasWidth - iconOffset - iconCenterOffset) + 'px');
+
+	                    var west = jQuery('#canvas-grow-W');
+	                    west.css('top', canvasTop -10 + (canvasHeight - iconWidth) / 2 + 'px');
+	                    west.css('left', canvasLeft + iconOffset + 'px');
+
+	                    north = jQuery('#canvas-shrink-N');
+	                    north.css('top', canvasTop + iconOffset + 'px');
+	                    north.css('left', canvasLeft + 10 + (canvasWidth - iconWidth) / 2 + 'px');
+
+	                    south = jQuery('#canvas-shrink-S');
+	                    south.css('top', (canvasTop + canvasHeight - iconOffset - iconCenterOffset) +  'px');
+	                    south.css('left', canvasLeft +10 + (canvasWidth - iconWidth) / 2 + 'px');
+
+	                    east = jQuery('#canvas-shrink-E');
+	                    east.css('top', canvasTop + 10 + (canvasHeight - iconWidth) / 2 +  'px');
+	                    east.css('left', (canvasLeft + canvasWidth - iconOffset - iconCenterOffset) + 'px');
+
+	                    west = jQuery('#canvas-shrink-W');
+	                    west.css('top', canvasTop + 10 + (canvasHeight - iconWidth) / 2 + 'px');
+	                    west.css('left', canvasLeft + iconOffset + 'px');
+	                });
+
+	                jQuery(window).trigger('resize');
+
+	                jQuery.fn.scrollStopped = function(callback) {
+	                    jQuery(this).scroll(function(){
+	                        var self = this, $this = jQuery(self);
+	                        if ($this.data('scrollTimeout')) {
+	                            clearTimeout($this.data('scrollTimeout'));
+	                        }
+	                        $this.data('scrollTimeout', setTimeout(callback,50,self));
+	                    });
+	                };
+	                
+	                // Always needed, cause the DOM element on which the scroll event listeners are attached are changed for every new model
+	                initScrollHandling();
+	                
+	                $rootScope.editorInitialized = true;
+	            }
+            });
+
+            /**
+             * Initialize the event bus: couple all Oryx events with a dispatch of the
+             * event of the event bus. This way, it gets much easier to attach custom logic
+             * to any event.
+             */
+
+            $rootScope.editorFactory.promise.then(function() {
+
+                KISBPM.eventBus.editor = $rootScope.editor;
+
+                var eventMappings = [
+                    { oryxType : ORYX.CONFIG.EVENT_SELECTION_CHANGED, kisBpmType : KISBPM.eventBus.EVENT_TYPE_SELECTION_CHANGE },
+                    { oryxType : ORYX.CONFIG.EVENT_DBLCLICK, kisBpmType : KISBPM.eventBus.EVENT_TYPE_DOUBLE_CLICK },
+                    { oryxType : ORYX.CONFIG.EVENT_MOUSEOUT, kisBpmType : KISBPM.eventBus.EVENT_TYPE_MOUSE_OUT },
+                    { oryxType : ORYX.CONFIG.EVENT_MOUSEOVER, kisBpmType : KISBPM.eventBus.EVENT_TYPE_MOUSE_OVER }
+
+                ];
+
+                eventMappings.forEach(function(eventMapping) {
+                    $rootScope.editor.registerOnEvent(eventMapping.oryxType, function(event) {
+                        KISBPM.eventBus.dispatch(eventMapping.kisBpmType, event);
+                    });
+                });
+                
+                $rootScope.editor.registerOnEvent(ORYX.CONFIG.EVENT_SHAPEREMOVED, function (event) {
+    	    		var validateButton = document.getElementById(event.shape.resourceId + "-validate-button");
+    	    		if (validateButton)
+    	    		{
+    	    			validateButton.style.display = 'none';
+    	    		}
+                });
+
+                // The Oryx canvas is ready (we know since we're in this promise callback) and the
+                // event bus is ready. The editor is now ready for use
+                KISBPM.eventBus.dispatch(KISBPM.eventBus.EVENT_TYPE_EDITOR_READY, {type : KISBPM.eventBus.EVENT_TYPE_EDITOR_READY});
+
+            });
+            
+            // Alerts
+            $rootScope.alerts = {
+                queue: []
+            };
+          
+            $rootScope.showAlert = function(alert) {
+                if(alert.queue.length > 0) {
+                    alert.current = alert.queue.shift();
+                    // Start timout for message-pruning
+                    alert.timeout = $timeout(function() {
+                        if (alert.queue.length == 0) {
+                            alert.current = undefined;
+                            alert.timeout = undefined;
+                        } else {
+                            $rootScope.showAlert(alert);
+                        }
+                    }, (alert.current.type == 'error' ? 5000 : 1000));
+                } else {
+                    $rootScope.alerts.current = undefined;
+                }
+            };
+          
+            $rootScope.addAlert = function(message, type) {
+                var newAlert = {message: message, type: type};
+                if (!$rootScope.alerts.timeout) {
+                    // Timeout for message queue is not running, start one
+                    $rootScope.alerts.queue.push(newAlert);
+                    $rootScope.showAlert($rootScope.alerts);
+                } else {
+                    $rootScope.alerts.queue.push(newAlert);
+                }
+            };
+          
+            $rootScope.dismissAlert = function() {
+                if (!$rootScope.alerts.timeout) {
+                    $rootScope.alerts.current = undefined;
+                } else {
+                    $timeout.cancel($rootScope.alerts.timeout);
+                    $rootScope.alerts.timeout = undefined;
+                    $rootScope.showAlert($rootScope.alerts);
+                }
+            };
+          
+            $rootScope.addAlertPromise = function(promise, type) {
+                if (promise) {
+                    promise.then(function(data) {
+                        $rootScope.addAlert(data, type);
+                    });
+                }
+            };
+          
+        }
+  ])
+
+    // Moment-JS date-formatting filter
+    .filter('dateformat', function() {
+        return function(date, format) {
+            if (date) {
+                if (format) {
+                    return moment(date).format(format);
+                } else {
+                    return moment(date).calendar();
+                }
+            }
+            return '';
+        };
+    });

+/*
+ * Activiti Modeler component part of the Activiti project
+ * Copyright 2005-2014 Alfresco Software, Ltd. All rights reserved.
+ * 
+ * This library is free software; you can redistribute it and/or
+ * modify it under the terms of the GNU Lesser General Public
+ * License as published by the Free Software Foundation; either
+ * version 2.1 of the License, or (at your option) any later version.
+ *
+ * This library is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
+ * Lesser General Public License for more details.
+
+ * You should have received a copy of the GNU Lesser General Public
+ * License along with this library; if not, write to the Free Software
+ * Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301  USA
+ */
+
+/*
+ * Assignment
+ */
+var KisBpmAssignmentCtrl = [ '$scope', '$modal', function($scope, $modal) {
+
+    // Config for the modal window
+    var opts = {
+        template:  'editor-app/configuration/properties/assignment-popup.html?version=' + Date.now(),
+        scope: $scope
+    };
+
+    // Open the dialog
+    $modal(opts);
+}];
+
+var KisBpmAssignmentPopupCtrl = [ '$scope', function($scope) {
+    	
+    // Put json representing assignment on scope
+    if ($scope.property.value !== undefined && $scope.property.value !== null
+        && $scope.property.value.assignment !== undefined
+        && $scope.property.value.assignment !== null) 
+    {
+        $scope.assignment = $scope.property.value.assignment;
+    } else {
+        $scope.assignment = {};
+    }
+
+    if ($scope.assignment.candidateUsers == undefined || $scope.assignment.candidateUsers.length == 0)
+    {
+    	$scope.assignment.candidateUsers = [{value: ''}];
+    }
+    
+    // Click handler for + button after enum value
+    var userValueIndex = 1;
+    $scope.addCandidateUserValue = function(index) {
+        $scope.assignment.candidateUsers.splice(index + 1, 0, {value: 'value ' + userValueIndex++});
+    };
+
+    // Click handler for - button after enum value
+    $scope.removeCandidateUserValue = function(index) {
+        $scope.assignment.candidateUsers.splice(index, 1);
+    };
+    
+    if ($scope.assignment.candidateGroups == undefined || $scope.assignment.candidateGroups.length == 0)
+    {
+    	$scope.assignment.candidateGroups = [{value: ''}];
+    }
+    
+    var groupValueIndex = 1;
+    $scope.addCandidateGroupValue = function(index) {
+        $scope.assignment.candidateGroups.splice(index + 1, 0, {value: 'value ' + groupValueIndex++});
+    };
+
+    // Click handler for - button after enum value
+    $scope.removeCandidateGroupValue = function(index) {
+        $scope.assignment.candidateGroups.splice(index, 1);
+    };
+
+    $scope.save = function() {
+
+        $scope.property.value = {};
+        handleAssignmentInput($scope);
+        $scope.property.value.assignment = $scope.assignment;
+        
+        $scope.updatePropertyInModel($scope.property);
+        $scope.close();
+    };
+
+    // Close button handler
+    $scope.close = function() {
+    	handleAssignmentInput($scope);
+    	$scope.property.mode = 'read';
+    	$scope.$hide();
+    };
+    
+    var handleAssignmentInput = function($scope) {
+    	if ($scope.assignment.candidateUsers)
+    	{
+	    	var emptyUsers = true;
+	    	var toRemoveIndexes = [];
+	        for (var i = 0; i < $scope.assignment.candidateUsers.length; i++)
+	        {
+	        	if ($scope.assignment.candidateUsers[i].value != '')
+	        	{
+	        		emptyUsers = false;
+	        	}
+	        	else
+	        	{
+	        		toRemoveIndexes[toRemoveIndexes.length] = i;
+	        	}
+	        }
+	        
+	        for (var i = 0; i < toRemoveIndexes.length; i++)
+	        {
+	        	$scope.assignment.candidateUsers.splice(toRemoveIndexes[i], 1);
+	        }
+	        
+	        if (emptyUsers)
+	        {
+	        	$scope.assignment.candidateUsers = undefined;
+	        }
+    	}
+        
+    	if ($scope.assignment.candidateGroups)
+    	{
+	        var emptyGroups = true;
+	        var toRemoveIndexes = [];
+	        for (var i = 0; i < $scope.assignment.candidateGroups.length; i++)
+	        {
+	        	if ($scope.assignment.candidateGroups[i].value != '')
+	        	{
+	        		emptyGroups = false;
+	        	}
+	        	else
+	        	{
+	        		toRemoveIndexes[toRemoveIndexes.length] = i;
+	        	}
+	        }
+	        
+	        for (var i = 0; i < toRemoveIndexes.length; i++)
+	        {
+	        	$scope.assignment.candidateGroups.splice(toRemoveIndexes[i], 1);
+	        }
+	        
+	        if (emptyGroups)
+	        {
+	        	$scope.assignment.candidateGroups = undefined;
+	        }
+    	}
+    };
+}];

+/*
+ * Activiti Modeler component part of the Activiti project
+ * Copyright 2005-2014 Alfresco Software, Ltd. All rights reserved.
+ * 
+ * This library is free software; you can redistribute it and/or
+ * modify it under the terms of the GNU Lesser General Public
+ * License as published by the Free Software Foundation; either
+ * version 2.1 of the License, or (at your option) any later version.
+ *
+ * This library is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
+ * Lesser General Public License for more details.
+
+ * You should have received a copy of the GNU Lesser General Public
+ * License along with this library; if not, write to the Free Software
+ * Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301  USA
+ */
+
+/*
+ * Condition expression
+ */
+
+var KisBpmConditionExpressionCtrl = [ '$scope', '$modal', function($scope, $modal) {
+
+    // Config for the modal window
+    var opts = {
+        template:  'editor-app/configuration/properties/condition-expression-popup.html?version=' + Date.now(),
+        scope: $scope
+    };
+
+    // Open the dialog
+    $modal(opts);
+}];
+
+var KisBpmConditionExpressionPopupCtrl = [ '$scope', '$translate', '$http', function($scope, $translate, $http) {
+
+	// Put json representing condition on scope
+    if ($scope.property.value !== undefined && $scope.property.value !== null) {
+
+        $scope.conditionExpression = {value: $scope.property.value};
+        
+    } else {
+        $scope.conditionExpression = {value: ''};
+    }
+	
+    $scope.save = function() {
+        $scope.property.value = $scope.conditionExpression.value;
+        $scope.updatePropertyInModel($scope.property);
+        $scope.close();
+    };
+
+    // Close button handler
+    $scope.close = function() {
+    	$scope.property.mode = 'read';
+    	$scope.$hide();
+    };
+}];

+/*
+ * Activiti Modeler component part of the Activiti project
+ * Copyright 2005-2014 Alfresco Software, Ltd. All rights reserved.
+ * 
+ * This library is free software; you can redistribute it and/or
+ * modify it under the terms of the GNU Lesser General Public
+ * License as published by the Free Software Foundation; either
+ * version 2.1 of the License, or (at your option) any later version.
+ *
+ * This library is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
+ * Lesser General Public License for more details.
+
+ * You should have received a copy of the GNU Lesser General Public
+ * License along with this library; if not, write to the Free Software
+ * Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301  USA
+ */

+/*
+ * Activiti Modeler component part of the Activiti project
+ * Copyright 2005-2014 Alfresco Software, Ltd. All rights reserved.
+ * 
+ * This library is free software; you can redistribute it and/or
+ * modify it under the terms of the GNU Lesser General Public
+ * License as published by the Free Software Foundation; either
+ * version 2.1 of the License, or (at your option) any later version.
+ *
+ * This library is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
+ * Lesser General Public License for more details.
+
+ * You should have received a copy of the GNU Lesser General Public
+ * License along with this library; if not, write to the Free Software
+ * Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301  USA
+ */
+
+/*
+ * String controller
+ */
+
+var KisBpmStringPropertyCtrl = [ '$scope', function ($scope) {
+
+	$scope.shapeId = $scope.selectedShape.id;
+	$scope.valueFlushed = false;
+    /** Handler called when input field is blurred */
+    $scope.inputBlurred = function() {
+    	$scope.valueFlushed = true;
+    	if ($scope.property.value) {
+    		$scope.property.value = $scope.property.value.replace(/(<([^>]+)>)/ig,"");
+    	}
+        $scope.updatePropertyInModel($scope.property);
+    };
+
+    $scope.enterPressed = function(keyEvent) {
+    	if (keyEvent && keyEvent.which === 13) {
+    		keyEvent.preventDefault();
+	        $scope.inputBlurred(); // we want to do the same as if the user would blur the input field
+    	}
+    };
+    
+    $scope.$on('$destroy', function controllerDestroyed() {
+    	if(!$scope.valueFlushed) {
+    		if ($scope.property.value) {
+        		$scope.property.value = $scope.property.value.replace(/(<([^>]+)>)/ig,"");
+        	}
+    		$scope.updatePropertyInModel($scope.property, $scope.shapeId);
+    	}
+    });
+
+}];
+
+/*
+ * Boolean controller
+ */
+
+var KisBpmBooleanPropertyCtrl = ['$scope', function ($scope) {
+
+    $scope.changeValue = function() {
+        if ($scope.property.key === 'oryx-defaultflow' && $scope.property.value) {
+            var selectedShape = $scope.selectedShape;
+            if (selectedShape) {
+                var incomingNodes = selectedShape.getIncomingShapes();
+                if (incomingNodes && incomingNodes.length > 0) {
+                    // get first node, since there can be only one for a sequence flow
+                    var rootNode = incomingNodes[0];
+                    var flows = rootNode.getOutgoingShapes();
+                    if (flows && flows.length > 1) {
+                        // in case there are more flows, check if another flow is already defined as default
+                        for (var i = 0; i < flows.length; i++) {
+                            if (flows[i].resourceId != selectedShape.resourceId) {
+                                var defaultFlowProp = flows[i].properties['oryx-defaultflow'];
+                                if (defaultFlowProp) {
+                                    flows[i].setProperty('oryx-defaultflow', false, true);
+                                }
+                            }
+                        }
+                    }
+                }
+            }
+        }
+        $scope.updatePropertyInModel($scope.property);
+    };
+
+}];
+
+/*
+ * Text controller
+ */
+
+var KisBpmTextPropertyCtrl = [ '$scope', '$modal', function($scope, $modal) {
+
+    var opts = {
+        template:  'editor-app/configuration/properties/text-popup.html?version=' + Date.now(),
+        scope: $scope
+    };
+
+    // Open the dialog
+    $modal(opts);
+}];
+
+var KisBpmTextPropertyPopupCtrl = ['$scope', function($scope) {
+    
+    $scope.save = function() {
+        $scope.updatePropertyInModel($scope.property);
+        $scope.close();
+    };
+
+    $scope.close = function() {
+        $scope.property.mode = 'read';
+        $scope.$hide();
+    };
+}];

+/*
+ * Activiti Modeler component part of the Activiti project
+ * Copyright 2005-2014 Alfresco Software, Ltd. All rights reserved.
+ * 
+ * This library is free software; you can redistribute it and/or
+ * modify it under the terms of the GNU Lesser General Public
+ * License as published by the Free Software Foundation; either
+ * version 2.1 of the License, or (at your option) any later version.
+ *
+ * This library is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
+ * Lesser General Public License for more details.
+
+ * You should have received a copy of the GNU Lesser General Public
+ * License along with this library; if not, write to the Free Software
+ * Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301  USA
+ */
+
+/*
+ * Execution listeners
+ */
+
+var KisBpmEventListenersCtrl = [ '$scope', '$modal', '$timeout', '$translate', function($scope, $modal, $timeout, $translate) {
+
+    // Config for the modal window
+    var opts = {
+        template:  'editor-app/configuration/properties/event-listeners-popup.html?version=' + Date.now(),
+        scope: $scope
+    };
+
+    // Open the dialog
+    $modal(opts);
+}];
+
+//Need a separate controller for the modal window due to https://github.com/angular-ui/bootstrap/issues/259
+// Will be fixed in a newer version of Angular UI
+var KisBpmEventListenersPopupCtrl = [ '$scope', '$q', '$translate', function($scope, $q, $translate) {
+
+    // Put json representing form properties on scope
+    if ($scope.property.value !== undefined && $scope.property.value !== null
+        && $scope.property.value.eventListeners !== undefined
+        && $scope.property.value.eventListeners !== null) {
+    	
+    	if ($scope.property.value.eventListeners.constructor == String)
+    	{
+    		$scope.eventListeners = JSON.parse($scope.property.value.eventListeners);
+    	}
+    	else
+    	{
+    		// Note that we clone the json object rather then setting it directly,
+            // this to cope with the fact that the user can click the cancel button and no changes should have happened
+    		$scope.eventListeners = angular.copy($scope.property.value.eventListeners);
+    	}
+    	
+    } else {
+        $scope.eventListeners = [];
+    }
+
+    // Array to contain selected properties (yes - we only can select one, but ng-grid isn't smart enough)
+    $scope.selectedListeners = [];
+    $scope.translationsRetrieved = false;
+    
+    $scope.labels = {};
+    
+    var eventPromise = $translate('PROPERTY.EXECUTIONLISTENERS.EVENT');
+    var implementationPromise = $translate('PROPERTY.EXECUTIONLISTENERS.FIELDS.IMPLEMENTATION');
+    var namePromise = $translate('PROPERTY.EXECUTIONLISTENERS.FIELDS.NAME');
+    
+    $q.all([eventPromise, implementationPromise, namePromise]).then(function(results) { 
+        $scope.labels.eventLabel = results[0];
+        $scope.labels.implementationLabel = results[1];
+        $scope.labels.nameLabel = results[2];
+        $scope.translationsRetrieved = true;
+        
+        // Config for grid
+        $scope.gridOptions = {
+            data: 'eventListeners',
+            enableRowReordering: true,
+            headerRowHeight: 28,
+            multiSelect: false,
+            keepLastSelected : false,
+            selectedItems: $scope.selectedListeners,
+            afterSelectionChange: function (rowItem, event) {
+            	
+            	if ($scope.selectedListeners.length > 0)
+            	{
+	            	var fields = $scope.selectedListeners[0].fields;
+	            	if (fields !== undefined && fields !== null)
+	            	{
+	            		for (var i = 0; i < fields.length; i++)
+	            		{
+	            			var field = fields[i];
+	            			if (field.stringValue !== undefined && field.stringValue !== '')
+	                    	{
+	            				field.implementation = field.stringValue;
+	                    	}
+	                    	else if (field.expression !== undefined && field.expression !== '')
+	                    	{
+	                    		field.implementation = field.expression;
+	                    	}
+	                    	else if (field.string !== undefined && field.string !== '')
+	                    	{
+	                    		field.implementation = field.string;
+	                    	}
+	            		}
+	            	}
+	            	
+	            	if (!$scope.selectedListeners[0].events || $scope.selectedListeners[0].events.length == 0)
+	                {
+	                	$scope.selectedListeners[0].events = [{event: ''}];
+	                }
+            	}
+            },
+            columnDefs: [{ field: 'event', displayName: $scope.labels.eventLabel },
+                { field: 'implementation', displayName: $scope.labels.implementationLabel }]
+        };
+    });
+    
+    // Click handler for + button after enum value
+    $scope.addEventValue = function(index) {
+        $scope.selectedListeners[0].events.splice(index + 1, 0, {event: ''});
+    };
+
+    // Click handler for - button after enum value
+    $scope.removeEventValue = function(index) {
+        $scope.selectedListeners[0].events.splice(index, 1);
+        $scope.listenerDetailsChanged();
+    };
+    
+    $scope.listenerDetailsChanged = function() {
+    	var listener = $scope.selectedListeners[0];
+    	if (listener.events)
+    	{
+    		var eventText = '';
+    		for (var i = 0; i < listener.events.length; i++)
+    		{
+    			if (i > 0)
+    			{
+    				eventText += ", ";
+    			}
+    			eventText += listener.events[i].event;
+    		}
+    		$scope.selectedListeners[0].event = eventText;
+    	}
+    	
+    	if (listener.rethrowEvent)
+    	{
+    		var implementationText = '';
+    		if (listener.rethrowType && listener.rethrowType.length > 0)
+    		{
+    			if (listener.rethrowType === 'error' && listener.errorcode !== '')
+	        	{
+	        		implementationText = "Rethrow as error " + listener.errorcode;
+	        	}
+    			else if (listener.rethrowType === 'message' && listener.messagename !== '')
+	        	{
+	        		implementationText = "Rethrow as message " + listener.messagename;
+	        	}
+    			else if ((listener.rethrowType === 'signal' || listener.rethrowType === 'globalSignal') && listener.signalname !== '')
+	        	{
+	        		implementationText = "Rethrow as signal " + listener.signalname;
+	        	}
+    		}
+    		$scope.selectedListeners[0].implementation = implementationText;
+    	}
+    	else
+    	{
+        	if ($scope.selectedListeners[0].className !== '')
+        	{
+        		$scope.selectedListeners[0].implementation = $scope.selectedListeners[0].className;
+        	}
+        	else if ($scope.selectedListeners[0].delegateExpression !== '')
+        	{
+        		$scope.selectedListeners[0].implementation = $scope.selectedListeners[0].delegateExpression;
+        	}
+        	else
+        	{
+        		$scope.selectedListeners[0].implementation = '';
+        	}
+    	}
+    };
+
+    // Click handler for add button
+    $scope.addNewListener = function() {
+        $scope.eventListeners.push({ event : '',
+            implementation : '',
+            className : '',
+            delegateExpression: '',
+            retrowEvent: false});
+    };
+
+    // Click handler for remove button
+    $scope.removeListener = function() {
+        if ($scope.selectedListeners.length > 0) {
+            var index = $scope.eventListeners.indexOf($scope.selectedListeners[0]);
+            $scope.gridOptions.selectItem(index, false);
+            $scope.eventListeners.splice(index, 1);
+
+            $scope.selectedListeners.length = 0;
+            if (index < $scope.eventListeners.length) {
+                $scope.gridOptions.selectItem(index + 1, true);
+            } else if ($scope.eventListeners.length > 0) {
+                $scope.gridOptions.selectItem(index - 1, true);
+            }
+        }
+    };
+
+    // Click handler for up button
+    $scope.moveListenerUp = function() {
+        if ($scope.selectedListeners.length > 0) {
+            var index = $scope.eventListeners.indexOf($scope.selectedListeners[0]);
+            if (index != 0) { // If it's the first, no moving up of course
+                // Reason for funny way of swapping, see https://github.com/angular-ui/ng-grid/issues/272
+                var temp = $scope.eventListeners[index];
+                $scope.eventListeners.splice(index, 1);
+                $timeout(function(){
+                    $scope.eventListeners.splice(index + -1, 0, temp);
+                }, 100);
+
+            }
+        }
+    };
+
+    // Click handler for down button
+    $scope.moveListenerDown = function() {
+        if ($scope.selectedListeners.length > 0) {
+            var index = $scope.eventListeners.indexOf($scope.selectedListeners[0]);
+            if (index != $scope.eventListeners.length - 1) { // If it's the last element, no moving down of course
+                // Reason for funny way of swapping, see https://github.com/angular-ui/ng-grid/issues/272
+                var temp = $scope.eventListeners[index];
+                $scope.eventListeners.splice(index, 1);
+                $timeout(function(){
+                    $scope.eventListeners.splice(index + 1, 0, temp);
+                }, 100);
+
+            }
+        }
+    };
+
+    // Click handler for save button
+    $scope.save = function() {
+
+        if ($scope.eventListeners.length > 0) {
+            $scope.property.value = {};
+            $scope.property.value.eventListeners = $scope.eventListeners;
+        } else {
+            $scope.property.value = null;
+        }
+
+        $scope.updatePropertyInModel($scope.property);
+        $scope.close();
+    };
+
+    $scope.cancel = function() {
+    	$scope.property.mode = 'read';
+    	$scope.$hide();
+    };
+
+    // Close button handler
+    $scope.close = function() {
+    	$scope.property.mode = 'read';
+    	$scope.$hide();
+    };
+
+}];

+/*
+ * Activiti Modeler component part of the Activiti project
+ * Copyright 2005-2014 Alfresco Software, Ltd. All rights reserved.
+ * 
+ * This library is free software; you can redistribute it and/or
+ * modify it under the terms of the GNU Lesser General Public
+ * License as published by the Free Software Foundation; either
+ * version 2.1 of the License, or (at your option) any later version.
+ *
+ * This library is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
+ * Lesser General Public License for more details.
+
+ * You should have received a copy of the GNU Lesser General Public
+ * License along with this library; if not, write to the Free Software
+ * Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301  USA
+ */
+
+/*
+ * Execution listeners
+ */
+
+var KisBpmExecutionListenersCtrl = [ '$scope', '$modal', '$timeout', '$translate', function($scope, $modal, $timeout, $translate) {
+
+    // Config for the modal window
+    var opts = {
+        template:  'editor-app/configuration/properties/execution-listeners-popup.html?version=' + Date.now(),
+        scope: $scope
+    };
+
+    // Open the dialog
+    $modal(opts);
+}];
+
+var KisBpmExecutionListenersPopupCtrl = [ '$scope', '$q', '$translate', function($scope, $q, $translate) {
+
+    // Put json representing form properties on scope
+    if ($scope.property.value !== undefined && $scope.property.value !== null
+        && $scope.property.value.executionListeners !== undefined
+        && $scope.property.value.executionListeners !== null) {
+        
+        if ($scope.property.value.executionListeners.constructor == String)
+        {
+            $scope.executionListeners = JSON.parse($scope.property.value.executionListeners);
+        }
+        else
+        {
+            // Note that we clone the json object rather then setting it directly,
+            // this to cope with the fact that the user can click the cancel button and no changes should have happened
+            $scope.executionListeners = angular.copy($scope.property.value.executionListeners);
+        }
+        
+        for (var i = 0; i < $scope.executionListeners.length; i++)
+        {
+            var executionListener = $scope.executionListeners[i];
+            if (executionListener.className !== undefined && executionListener.className !== '')
+            {
+                executionListener.implementation = executionListener.className;
+            }
+            else if (executionListener.expression !== undefined && executionListener.expression !== '')
+            {
+                executionListener.implementation = executionListener.expression;
+            }
+            else if (executionListener.delegateExpression !== undefined && executionListener.delegateExpression !== '')
+            {
+                executionListener.implementation = executionListener.delegateExpression;
+            }
+        }
+    } else {
+        $scope.executionListeners = [];
+    }
+
+    // Array to contain selected properties (yes - we only can select one, but ng-grid isn't smart enough)
+    $scope.selectedListeners = [];
+    $scope.selectedFields = [];
+    $scope.translationsRetrieved = false;
+    
+    $scope.labels = {};
+    
+    var eventPromise = $translate('PROPERTY.EXECUTIONLISTENERS.EVENT');
+    var implementationPromise = $translate('PROPERTY.EXECUTIONLISTENERS.FIELDS.IMPLEMENTATION');
+    var namePromise = $translate('PROPERTY.EXECUTIONLISTENERS.FIELDS.NAME');
+    
+    $q.all([eventPromise, implementationPromise, namePromise]).then(function(results) { 
+        $scope.labels.eventLabel = results[0];
+        $scope.labels.implementationLabel = results[1];
+        $scope.labels.nameLabel = results[2];
+        $scope.translationsRetrieved = true;
+        
+        // Config for grid
+        $scope.gridOptions = {
+            data: 'executionListeners',
+            enableRowReordering: true,
+            headerRowHeight: 28,
+            multiSelect: false,
+            keepLastSelected : false,
+            selectedItems: $scope.selectedListeners,
+            afterSelectionChange: function (rowItem, event) {
+                $scope.selectedFields.length = 0;
+                if ($scope.selectedListeners.length > 0)
+                {
+                    var fields = $scope.selectedListeners[0].fields;
+                    if (fields !== undefined && fields !== null)
+                    {
+                        for (var i = 0; i < fields.length; i++)
+                        {
+                            var field = fields[i];
+                            if (field.stringValue !== undefined && field.stringValue !== '')
+                            {
+                                field.implementation = field.stringValue;
+                            }
+                            else if (field.expression !== undefined && field.expression !== '')
+                            {
+                                field.implementation = field.expression;
+                            }
+                            else if (field.string !== undefined && field.string !== '')
+                            {
+                                field.implementation = field.string;
+                            }
+                        }
+                    }
+                }
+            },
+            columnDefs: [{ field: 'event', displayName: $scope.labels.eventLabel },
+                { field: 'implementation', displayName: $scope.labels.implementationLabel }]
+        };
+        
+        // Config for field grid
+        $scope.gridFieldOptions = {
+            data: 'selectedListeners[0].fields',
+            enableRowReordering: true,
+            headerRowHeight: 28,
+            multiSelect: false,
+            keepLastSelected : false,
+            selectedItems: $scope.selectedFields,
+            columnDefs: [{ field: 'name', displayName: $scope.labels.nameLabel },
+                { field: 'implementation', displayName: $scope.labels.implementationLabel}]
+        };
+    });
+    
+    $scope.listenerDetailsChanged = function() {
+        if ($scope.selectedListeners[0].className !== '')
+        {
+            $scope.selectedListeners[0].implementation = $scope.selectedListeners[0].className;
+        }
+        else if ($scope.selectedListeners[0].expression !== '')
+        {
+            $scope.selectedListeners[0].implementation = $scope.selectedListeners[0].expression;
+        }
+        else if ($scope.selectedListeners[0].delegateExpression !== '')
+        {
+            $scope.selectedListeners[0].implementation = $scope.selectedListeners[0].delegateExpression;
+        }
+        else
+        {
+            $scope.selectedListeners[0].implementation = '';
+        }
+    };
+
+    // Click handler for add button
+    $scope.addNewListener = function() {
+        $scope.executionListeners.push({ event : 'start',
+            implementation : '',
+            className : '',
+            expression: '',
+            delegateExpression: ''});
+    };
+
+    // Click handler for remove button
+    $scope.removeListener = function() {
+        if ($scope.selectedListeners.length > 0) {
+            var index = $scope.executionListeners.indexOf($scope.selectedListeners[0]);
+            $scope.gridOptions.selectItem(index, false);
+            $scope.executionListeners.splice(index, 1);
+
+            $scope.selectedListeners.length = 0;
+            if (index < $scope.executionListeners.length) {
+                $scope.gridOptions.selectItem(index + 1, true);
+            } else if ($scope.executionListeners.length > 0) {
+                $scope.gridOptions.selectItem(index - 1, true);
+            }
+        }
+    };
+
+    // Click handler for up button
+    $scope.moveListenerUp = function() {
+        if ($scope.selectedListeners.length > 0) {
+            var index = $scope.executionListeners.indexOf($scope.selectedListeners[0]);
+            if (index != 0) { // If it's the first, no moving up of course
+                // Reason for funny way of swapping, see https://github.com/angular-ui/ng-grid/issues/272
+                var temp = $scope.executionListeners[index];
+                $scope.executionListeners.splice(index, 1);
+                $timeout(function(){
+                    $scope.executionListeners.splice(index + -1, 0, temp);
+                }, 100);
+
+            }
+        }
+    };
+
+    // Click handler for down button
+    $scope.moveListenerDown = function() {
+        if ($scope.selectedListeners.length > 0) {
+            var index = $scope.executionListeners.indexOf($scope.selectedListeners[0]);
+            if (index != $scope.executionListeners.length - 1) { // If it's the last element, no moving down of course
+                // Reason for funny way of swapping, see https://github.com/angular-ui/ng-grid/issues/272
+                var temp = $scope.executionListeners[index];
+                $scope.executionListeners.splice(index, 1);
+                $timeout(function(){
+                    $scope.executionListeners.splice(index + 1, 0, temp);
+                }, 100);
+
+            }
+        }
+    };
+    
+    $scope.fieldDetailsChanged = function() {
+        if ($scope.selectedFields[0].stringValue !== '')
+        {
+            $scope.selectedFields[0].implementation = $scope.selectedFields[0].stringValue;
+        }
+        else if ($scope.selectedFields[0].expression !== '')
+        {
+            $scope.selectedFields[0].implementation = $scope.selectedFields[0].expression;
+        }
+        else if ($scope.selectedFields[0].string !== '')
+        {
+            $scope.selectedFields[0].implementation = $scope.selectedFields[0].string;
+        }
+        else
+        {
+            $scope.selectedFields[0].implementation = '';
+        }
+    };
+
+    // Click handler for add button
+    $scope.addNewField = function() {
+        if ($scope.selectedListeners.length > 0)
+        {
+            if ($scope.selectedListeners[0].fields == undefined)
+            {
+                $scope.selectedListeners[0].fields = [];
+            }
+            $scope.selectedListeners[0].fields.push({ name : 'fieldName',
+                implementation : '',
+                stringValue : '',
+                expression: '',
+                string: ''});
+        }
+    };
+
+    // Click handler for remove button
+    $scope.removeField = function() {
+        if ($scope.selectedFields.length > 0) {
+            var index = $scope.selectedListeners[0].fields.indexOf($scope.selectedFields[0]);
+            $scope.gridFieldOptions.selectItem(index, false);
+            $scope.selectedListeners[0].fields.splice(index, 1);
+
+            $scope.selectedFields.length = 0;
+            if (index < $scope.selectedListeners[0].fields.length) {
+                $scope.gridFieldOptions.selectItem(index + 1, true);
+            } else if ($scope.selectedListeners[0].fields.length > 0) {
+                $scope.gridFieldOptions.selectItem(index - 1, true);
+            }
+        }
+    };
+
+    // Click handler for up button
+    $scope.moveFieldUp = function() {
+        if ($scope.selectedFields.length > 0) {
+            var index = $scope.selectedListeners[0].fields.indexOf($scope.selectedFields[0]);
+            if (index != 0) { // If it's the first, no moving up of course
+                // Reason for funny way of swapping, see https://github.com/angular-ui/ng-grid/issues/272
+                var temp = $scope.selectedListeners[0].fields[index];
+                $scope.selectedListeners[0].fields.splice(index, 1);
+                $timeout(function(){
+                    $scope.selectedListeners[0].fields.splice(index + -1, 0, temp);
+                }, 100);
+
+            }
+        }
+    };
+
+    // Click handler for down button
+    $scope.moveFieldDown = function() {
+        if ($scope.selectedFields.length > 0) {
+            var index = $scope.selectedListeners[0].fields.indexOf($scope.selectedFields[0]);
+            if (index != $scope.selectedListeners[0].fields.length - 1) { // If it's the last element, no moving down of course
+                // Reason for funny way of swapping, see https://github.com/angular-ui/ng-grid/issues/272
+                var temp = $scope.selectedListeners[0].fields[index];
+                $scope.selectedListeners[0].fields.splice(index, 1);
+                $timeout(function(){
+                    $scope.selectedListeners[0].fields.splice(index + 1, 0, temp);
+                }, 100);
+
+            }
+        }
+    };
+
+    // Click handler for save button
+    $scope.save = function() {
+
+        if ($scope.executionListeners.length > 0) {
+            $scope.property.value = {};
+            $scope.property.value.executionListeners = $scope.executionListeners;
+        } else {
+            $scope.property.value = null;
+        }
+
+        $scope.updatePropertyInModel($scope.property);
+        $scope.close();
+    };
+
+    $scope.cancel = function() {
+        $scope.$hide();
+        $scope.property.mode = 'read';
+    };
+
+    // Close button handler
+    $scope.close = function() {
+        $scope.$hide();
+        $scope.property.mode = 'read';
+    };
+
+}];

+/*
+ * Activiti Modeler component part of the Activiti project
+ * Copyright 2005-2014 Alfresco Software, Ltd. All rights reserved.
+ * 
+ * This library is free software; you can redistribute it and/or
+ * modify it under the terms of the GNU Lesser General Public
+ * License as published by the Free Software Foundation; either
+ * version 2.1 of the License, or (at your option) any later version.
+ *
+ * This library is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
+ * Lesser General Public License for more details.
+
+ * You should have received a copy of the GNU Lesser General Public
+ * License along with this library; if not, write to the Free Software
+ * Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301  USA
+ */
+
+/*
+ * Task listeners
+ */
+
+var KisBpmFieldsCtrl = [ '$scope', '$modal', '$timeout', '$translate', function($scope, $modal, $timeout, $translate) {
+
+    // Config for the modal window
+    var opts = {
+        template:  'editor-app/configuration/properties/fields-popup.html',
+        scope: $scope
+    };
+
+    // Open the dialog
+    $modal(opts);
+}];
+
+var KisBpmFieldsPopupCtrl = [ '$scope', '$q', '$translate', function($scope, $q, $translate) {
+
+    // Put json representing form properties on scope
+    if ($scope.property.value !== undefined && $scope.property.value !== null
+        && $scope.property.value.fields !== undefined
+        && $scope.property.value.fields !== null) {
+        // Note that we clone the json object rather then setting it directly,
+        // this to cope with the fact that the user can click the cancel button and no changes should have happened
+        $scope.fields = angular.copy($scope.property.value.fields);
+        
+        for (var i = 0; i < $scope.fields.length; i++)
+		{
+			var field = $scope.fields[i];
+			if (field.stringValue !== undefined && field.stringValue !== '')
+        	{
+				field.implementation = field.stringValue;
+        	}
+        	else if (field.expression !== undefined && field.expression !== '')
+        	{
+        		field.implementation = field.expression;
+        	}
+        	else if (field.string !== undefined && field.string !== '')
+        	{
+        		field.implementation = field.string;
+        	}
+		}
+        
+    } else {
+        $scope.fields = [];
+    }
+
+    // Array to contain selected properties (yes - we only can select one, but ng-grid isn't smart enough)
+    $scope.selectedFields = [];
+    $scope.translationsRetrieved = false;
+    $scope.labels = {};
+
+    var namePromise = $translate('PROPERTY.FIELDS.NAME');
+    var implementationPromise = $translate('PROPERTY.FIELDS.IMPLEMENTATION');
+
+    $q.all([namePromise, implementationPromise]).then(function(results) {
+        $scope.labels.nameLabel = results[0];
+        $scope.labels.implementationLabel = results[1];
+        $scope.translationsRetrieved = true;
+
+        // Config for grid
+        $scope.gridOptions = {
+            data: 'fields',
+            enableRowReordering: true,
+            headerRowHeight: 28,
+            multiSelect: false,
+            keepLastSelected: false,
+            selectedItems: $scope.selectedFields,
+            columnDefs: [{field: 'name', displayName: $scope.labels.nameLabel},
+                {field: 'implementation', displayName: $scope.labels.implementationLabel}]
+        };
+    });
+    
+    $scope.fieldDetailsChanged = function() {
+    	if ($scope.selectedFields[0].stringValue != '')
+    	{
+    		$scope.selectedFields[0].implementation = $scope.selectedFields[0].stringValue;
+    	}
+    	else if ($scope.selectedFields[0].expression != '')
+    	{
+    		$scope.selectedFields[0].implementation = $scope.selectedFields[0].expression;
+    	}
+    	else if ($scope.selectedFields[0].string != '')
+    	{
+    		$scope.selectedFields[0].implementation = $scope.selectedFields[0].string;
+    	}
+    	else
+    	{
+    		$scope.selectedFields[0].implementation = '';
+    	}
+    };
+
+    // Click handler for add button
+    $scope.addNewField = function() {
+    	$scope.fields.push({ name : 'fieldName',
+            implementation : '',
+            stringValue : '',
+            expression: '',
+            string: ''});
+    };
+
+    // Click handler for remove button
+    $scope.removeField = function() {
+        if ($scope.selectedFields.length > 0) {
+            var index = $scope.fields.indexOf($scope.selectedFields[0]);
+            $scope.gridOptions.selectItem(index, false);
+            $scope.fields.splice(index, 1);
+
+            $scope.selectedFields.length = 0;
+            if (index < $scope.fields.length) {
+                $scope.gridOptions.selectItem(index + 1, true);
+            } else if ($scope.fields.length > 0) {
+                $scope.gridOptions.selectItem(index - 1, true);
+            }
+        }
+    };
+
+    // Click handler for up button
+    $scope.moveFieldUp = function() {
+        if ($scope.selectedFields.length > 0) {
+            var index = $scope.fields.indexOf($scope.selectedFields[0]);
+            if (index != 0) { // If it's the first, no moving up of course
+                // Reason for funny way of swapping, see https://github.com/angular-ui/ng-grid/issues/272
+                var temp = $scope.fields[index];
+                $scope.fields.splice(index, 1);
+                $timeout(function(){
+                	$scope.fields.splice(index + -1, 0, temp);
+                }, 100);
+
+            }
+        }
+    };
+
+    // Click handler for down button
+    $scope.moveFieldDown = function() {
+        if ($scope.selectedFields.length > 0) {
+            var index = $scope.fields.indexOf($scope.selectedFields[0]);
+            if (index != $scope.fields.length - 1) { // If it's the last element, no moving down of course
+                // Reason for funny way of swapping, see https://github.com/angular-ui/ng-grid/issues/272
+                var temp = $scope.fields[index];
+                $scope.fields.splice(index, 1);
+                $timeout(function(){
+                	$scope.fields.splice(index + 1, 0, temp);
+                }, 100);
+
+            }
+        }
+    };
+
+    // Click handler for save button
+    $scope.save = function() {
+
+        if ($scope.fields.length > 0) {
+            $scope.property.value = {};
+            $scope.property.value.fields = $scope.fields;
+        } else {
+            $scope.property.value = null;
+        }
+
+        $scope.updatePropertyInModel($scope.property);
+        $scope.close();
+    };
+
+    $scope.cancel = function() {
+        $scope.close();
+    };
+
+    // Close button handler
+    $scope.close = function() {
+        $scope.property.mode = 'read';
+        $scope.$hide();
+    };
+}];

+/*
+ * Activiti Modeler component part of the Activiti project
+ * Copyright 2005-2014 Alfresco Software, Ltd. All rights reserved.
+ * 
+ * This library is free software; you can redistribute it and/or
+ * modify it under the terms of the GNU Lesser General Public
+ * License as published by the Free Software Foundation; either
+ * version 2.1 of the License, or (at your option) any later version.
+ *
+ * This library is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
+ * Lesser General Public License for more details.
+
+ * You should have received a copy of the GNU Lesser General Public
+ * License along with this library; if not, write to the Free Software
+ * Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301  USA
+ */
+
+/*
+ * Form Properties
+ */
+
+var KisBpmFormPropertiesCtrl = [ '$scope', '$modal', '$timeout', '$translate', function($scope, $modal, $timeout, $translate) {
+
+    // Config for the modal window
+    var opts = {
+        template:  'editor-app/configuration/properties/form-properties-popup.html?version=' + Date.now(),
+        scope: $scope
+    };
+
+    // Open the dialog
+    $modal(opts);
+}];
+
+var KisBpmFormPropertiesPopupCtrl = ['$scope', '$q', '$translate', '$timeout', function($scope, $q, $translate, $timeout) {
+
+    // Put json representing form properties on scope
+    if ($scope.property.value !== undefined && $scope.property.value !== null
+        && $scope.property.value.formProperties !== undefined
+        && $scope.property.value.formProperties !== null) {
+        // Note that we clone the json object rather then setting it directly,
+        // this to cope with the fact that the user can click the cancel button and no changes should have happended
+        $scope.formProperties = angular.copy($scope.property.value.formProperties);
+        
+        for (var i = 0; i < $scope.formProperties.length; i++) {
+        	var formProperty = $scope.formProperties[i];
+        	if (formProperty.enumValues && formProperty.enumValues.length > 0) {
+        		for (var j = 0; j < formProperty.enumValues.length; j++) {
+        			var enumValue = formProperty.enumValues[j];
+        			if (!enumValue.id && !enumValue.name && enumValue.value) {
+        				enumValue.id = enumValue.value;
+        				enumValue.name = enumValue.value;
+        			}
+        		}
+        	}
+        }
+        
+    } else {
+        $scope.formProperties = [];
+    }
+
+    // Array to contain selected properties (yes - we only can select one, but ng-grid isn't smart enough)
+    $scope.selectedProperties = [];
+    $scope.selectedEnumValues = [];
+    
+    $scope.translationsRetrieved = false;
+    
+    $scope.labels = {};
+    
+    var idPromise = $translate('PROPERTY.FORMPROPERTIES.ID');
+    var namePromise = $translate('PROPERTY.FORMPROPERTIES.NAME');
+    var typePromise = $translate('PROPERTY.FORMPROPERTIES.TYPE');
+    
+    $q.all([idPromise, namePromise, typePromise]).then(function(results) { 
+    	$scope.labels.idLabel = results[0];
+        $scope.labels.nameLabel = results[1];
+        $scope.labels.typeLabel = results[2];
+        $scope.translationsRetrieved = true;
+        
+    	// Config for grid
+        $scope.gridOptions = {
+            data: 'formProperties',
+            enableRowReordering: true,
+            headerRowHeight: 28,
+            multiSelect: false,
+            keepLastSelected : false,
+            selectedItems: $scope.selectedProperties,
+            columnDefs: [{ field: 'id', displayName: $scope.labels.idLabel },
+                { field: 'name', displayName: $scope.labels.nameLabel},
+                { field: 'type', displayName: $scope.labels.typeLabel}]
+        };
+        
+        $scope.enumGridOptions = {
+    		data: 'selectedProperties[0].enumValues',
+            enableRowReordering: true,
+            headerRowHeight: 28,
+            multiSelect: false,
+            keepLastSelected : false,
+            selectedItems: $scope.selectedEnumValues,
+            columnDefs: [{ field: 'id', displayName: $scope.labels.idLabel },
+                { field: 'name', displayName: $scope.labels.nameLabel}]
+        }
+    });
+
+    // Handler for when the value of the type dropdown changes
+    $scope.propertyTypeChanged = function() {
+
+        // Check date. If date, show date pattern
+        if ($scope.selectedProperties[0].type === 'date') {
+            $scope.selectedProperties[0].datePattern = 'MM-dd-yyyy hh:mm';
+            
+        } else {
+            delete $scope.selectedProperties[0].datePattern;
+        }
+
+        // Check enum. If enum, show list of options
+        if ($scope.selectedProperties[0].type === 'enum') {
+            $scope.selectedProperties[0].enumValues = [ {id: 'value1', name: 'Value 1'}, {id: 'value2', name: 'Value 2'}];
+            
+        } else {
+            delete $scope.selectedProperties[0].enumValues;
+        }
+    };
+
+    // Click handler for add button
+    var propertyIndex = 1;
+    $scope.addNewProperty = function() {
+        $scope.formProperties.push({ id : 'new_property_' + propertyIndex++,
+            name : '',
+            type : 'string',
+            readable: true,
+            writable: true});
+        
+        $timeout(function(){
+        	$scope.gridOptions.selectItem($scope.formProperties.length - 1, true);
+        });
+    };
+
+    // Click handler for remove button
+    $scope.removeProperty = function() {
+        if ($scope.selectedProperties.length > 0) {
+            var index = $scope.formProperties.indexOf($scope.selectedProperties[0]);
+            $scope.gridOptions.selectItem(index, false);
+            $scope.formProperties.splice(index, 1);
+
+            $scope.selectedProperties.length = 0;
+            if (index < $scope.formProperties.length) {
+                $scope.gridOptions.selectItem(index + 1, true);
+            } else if ($scope.formProperties.length > 0) {
+                $scope.gridOptions.selectItem(index - 1, true);
+            }
+        }
+    };
+
+    // Click handler for up button
+    $scope.movePropertyUp = function() {
+        if ($scope.selectedProperties.length > 0) {
+            var index = $scope.formProperties.indexOf($scope.selectedProperties[0]);
+            if (index != 0) { // If it's the first, no moving up of course
+                // Reason for funny way of swapping, see https://github.com/angular-ui/ng-grid/issues/272
+                var temp = $scope.formProperties[index];
+                $scope.formProperties.splice(index, 1);
+                $timeout(function(){
+                    $scope.formProperties.splice(index + -1, 0, temp);
+                }, 100);
+
+            }
+        }
+    };
+
+    // Click handler for down button
+    $scope.movePropertyDown = function() {
+        if ($scope.selectedProperties.length > 0) {
+            var index = $scope.formProperties.indexOf($scope.selectedProperties[0]);
+            if (index != $scope.formProperties.length - 1) { // If it's the last element, no moving down of course
+                // Reason for funny way of swapping, see https://github.com/angular-ui/ng-grid/issues/272
+                var temp = $scope.formProperties[index];
+                $scope.formProperties.splice(index, 1);
+                $timeout(function(){
+                    $scope.formProperties.splice(index + 1, 0, temp);
+                }, 100);
+
+            }
+        }
+    };
+    
+    $scope.addNewEnumValue = function() {
+    	if ($scope.selectedProperties.length > 0) {
+	        $scope.selectedProperties[0].enumValues.push({ id : '', name : ''});
+    	}
+    	
+    	$timeout(function(){
+        	$scope.enumGridOptions.selectItem($scope.selectedProperties[0].enumValues.length - 1, true);
+        });
+    };
+
+    // Click handler for remove button
+    $scope.removeEnumValue = function() {
+    	if ($scope.selectedProperties.length > 0 && $scope.selectedEnumValues.length > 0) {
+            var index = $scope.selectedProperties[0].enumValues.indexOf($scope.selectedEnumValues[0]);
+            $scope.enumGridOptions.selectItem(index, false);
+            $scope.selectedProperties[0].enumValues.splice(index, 1);
+
+            $scope.selectedEnumValues.length = 0;
+            if (index < $scope.selectedProperties[0].enumValues.length) {
+            	$timeout(function(){
+            		$scope.enumGridOptions.selectItem(index + 1, true);
+            	});
+            	
+            } else if ($scope.selectedProperties[0].enumValues.length > 0) {
+            	$timeout(function(){
+            		$scope.enumGridOptions.selectItem(index - 1, true);
+            	});
+            }
+        }
+    };
+
+    // Click handler for up button
+    $scope.moveEnumValueUp = function() {
+    	if ($scope.selectedProperties.length > 0 && $scope.selectedEnumValues.length > 0) {
+    		var index = $scope.selectedProperties[0].enumValues.indexOf($scope.selectedEnumValues[0]);
+            if (index != 0) { // If it's the first, no moving up of course
+                // Reason for funny way of swapping, see https://github.com/angular-ui/ng-grid/issues/272
+                var temp = $scope.selectedProperties[0].enumValues[index];
+                $scope.selectedProperties[0].enumValues.splice(index, 1);
+                $timeout(function(){
+                    $scope.selectedProperties[0].enumValues.splice(index + -1, 0, temp);
+                });
+
+            }
+        }
+    };
+
+    // Click handler for down button
+    $scope.moveEnumValueDown = function() {
+    	if ($scope.selectedProperties.length > 0 && $scope.selectedEnumValues.length > 0) {
+    		var index = $scope.selectedProperties[0].enumValues.indexOf($scope.selectedEnumValues[0]);
+            if (index != $scope.selectedProperties[0].enumValues.length - 1) { // If it's the last element, no moving down of course
+                // Reason for funny way of swapping, see https://github.com/angular-ui/ng-grid/issues/272
+                var temp = $scope.selectedProperties[0].enumValues[index];
+                $scope.selectedProperties[0].enumValues.splice(index, 1);
+                $timeout(function(){
+                    $scope.selectedProperties[0].enumValues.splice(index + 1, 0, temp);
+                });
+
+            }
+        }
+    };
+
+    // Click handler for save button
+    $scope.save = function() {
+
+        if ($scope.formProperties.length > 0) {
+            $scope.property.value = {};
+            $scope.property.value.formProperties = $scope.formProperties;
+        } else {
+            $scope.property.value = null;
+        }
+
+        $scope.updatePropertyInModel($scope.property);
+        $scope.close();
+    };
+
+    $scope.cancel = function() {
+    	$scope.$hide();
+    	$scope.property.mode = 'read';
+    };
+
+    // Close button handler
+    $scope.close = function() {
+    	$scope.$hide();
+    	$scope.property.mode = 'read';
+    };
+
+}];

+/*
+ * Activiti Modeler component part of the Activiti project
+ * Copyright 2005-2014 Alfresco Software, Ltd. All rights reserved.
+ * 
+ * This library is free software; you can redistribute it and/or
+ * modify it under the terms of the GNU Lesser General Public
+ * License as published by the Free Software Foundation; either
+ * version 2.1 of the License, or (at your option) any later version.
+ *
+ * This library is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
+ * Lesser General Public License for more details.
+
+ * You should have received a copy of the GNU Lesser General Public
+ * License along with this library; if not, write to the Free Software
+ * Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301  USA
+ */
+
+/*
+ * Input parameters for call activity
+ */
+
+var KisBpmInParametersCtrl = [ '$scope', '$modal', '$timeout', '$translate', function($scope, $modal, $timeout, $translate) {
+
+    // Config for the modal window
+    var opts = {
+        template:  'editor-app/configuration/properties/in-parameters-popup.html?version=' + Date.now(),
+        scope: $scope
+    };
+
+    // Open the dialog
+    $modal(opts);
+}];
+
+var KisBpmInParametersPopupCtrl = ['$scope', '$q', '$translate', function($scope, $q, $translate) {
+
+    // Put json representing form properties on scope
+    if ($scope.property.value !== undefined && $scope.property.value !== null
+        && $scope.property.value.inParameters !== undefined
+        && $scope.property.value.inParameters !== null) {
+        // Note that we clone the json object rather then setting it directly,
+        // this to cope with the fact that the user can click the cancel button and no changes should have happened
+        $scope.parameters = angular.copy($scope.property.value.inParameters);
+    } else {
+        $scope.parameters = [];
+    }
+
+    // Array to contain selected properties (yes - we only can select one, but ng-grid isn't smart enough)
+    $scope.selectedParameters = [];
+    $scope.translationsRetrieved = false;
+    
+    $scope.labels = {};
+    
+    var sourcePromise = $translate('PROPERTY.PARAMETER.SOURCE');
+    var sourceExpressionPromise = $translate('PROPERTY.PARAMETER.SOURCEEXPRESSION');
+    var targetPromise = $translate('PROPERTY.PARAMETER.TARGET');
+    
+    $q.all([sourcePromise, sourceExpressionPromise, targetPromise]).then(function(results) { 
+        $scope.labels.sourceLabel = results[0];
+        $scope.labels.sourceExpressionLabel = results[1];
+        $scope.labels.targetLabel = results[2];
+        $scope.translationsRetrieved = true;
+
+        // Config for grid
+        $scope.gridOptions = {
+            data: 'parameters',
+            enableRowReordering: true,
+            headerRowHeight: 28,
+            multiSelect: false,
+            keepLastSelected : false,
+            selectedItems: $scope.selectedParameters,
+            columnDefs: [{ field: 'source', displayName: $scope.labels.sourceLabel },
+                         { field: 'sourceExpression', displayName: $scope.labels.sourceExpressionLabel },
+                         { field: 'target', displayName: $scope.labels.targetLabel }]
+        };
+    });
+
+    // Click handler for add button
+    $scope.addNewParameter = function() {
+        $scope.parameters.push({ source : '',
+            sourceExpression : '',
+            target : ''});
+    };
+
+    // Click handler for remove button
+    $scope.removeParameter = function() {
+        if ($scope.selectedParameters.length > 0) {
+            var index = $scope.parameters.indexOf($scope.selectedParameters[0]);
+            $scope.gridOptions.selectItem(index, false);
+            $scope.parameters.splice(index, 1);
+
+            $scope.selectedParameters.length = 0;
+            if (index < $scope.parameters.length) {
+                $scope.gridOptions.selectItem(index + 1, true);
+            } else if ($scope.parameters.length > 0) {
+                $scope.gridOptions.selectItem(index - 1, true);
+            }
+        }
+    };
+
+    // Click handler for up button
+    $scope.moveParameterUp = function() {
+        if ($scope.selectedParameters.length > 0) {
+            var index = $scope.parameters.indexOf($scope.selectedParameters[0]);
+            if (index != 0) { // If it's the first, no moving up of course
+                // Reason for funny way of swapping, see https://github.com/angular-ui/ng-grid/issues/272
+                var temp = $scope.parameters[index];
+                $scope.parameters.splice(index, 1);
+                $timeout(function(){
+                    $scope.parameters.splice(index + -1, 0, temp);
+                }, 100);
+
+            }
+        }
+    };
+
+    // Click handler for down button
+    $scope.moveParameterDown = function() {
+        if ($scope.selectedParameters.length > 0) {
+            var index = $scope.parameters.indexOf($scope.selectedParameters[0]);
+            if (index != $scope.parameters.length - 1) { // If it's the last element, no moving down of course
+                // Reason for funny way of swapping, see https://github.com/angular-ui/ng-grid/issues/272
+                var temp = $scope.parameters[index];
+                $scope.parameters.splice(index, 1);
+                $timeout(function(){
+                    $scope.parameters.splice(index + 1, 0, temp);
+                }, 100);
+
+            }
+        }
+    };
+
+    // Click handler for save button
+    $scope.save = function() {
+
+        if ($scope.parameters.length > 0) {
+            $scope.property.value = {};
+            $scope.property.value.inParameters = $scope.parameters;
+        } else {
+            $scope.property.value = null;
+        }
+
+        $scope.updatePropertyInModel($scope.property);
+        $scope.close();
+    };
+
+    $scope.cancel = function() {
+        $scope.close();
+    };
+
+    // Close button handler
+    $scope.close = function() {
+        $scope.property.mode = 'read';
+        $scope.$hide();
+    };
+
+}];

+/*
+ * Activiti Modeler component part of the Activiti project
+ * Copyright 2005-2014 Alfresco Software, Ltd. All rights reserved.
+ * 
+ * This library is free software; you can redistribute it and/or
+ * modify it under the terms of the GNU Lesser General Public
+ * License as published by the Free Software Foundation; either
+ * version 2.1 of the License, or (at your option) any later version.
+ *
+ * This library is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
+ * Lesser General Public License for more details.
+
+ * You should have received a copy of the GNU Lesser General Public
+ * License along with this library; if not, write to the Free Software
+ * Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301  USA
+ */
+
+/*
+ * Execution listeners
+ */
+
+angular.module('activitiModeler').controller('ActivitiMessageDefinitionsCtrl', ['$scope', '$modal', function ($scope, $modal) {
+
+    // Config for the modal window
+    var opts = {
+        template: 'editor-app/configuration/properties/message-definitions-popup.html?version=' + Date.now(),
+        scope: $scope
+    };
+
+    // Open the dialog
+    $modal(opts);
+}]);
+
+//Need a separate controller for the modal window due to https://github.com/angular-ui/bootstrap/issues/259
+// Will be fixed in a newer version of Angular UI
+angular.module('activitiModeler').controller('ActivitiMessageDefinitionsPopupCtrl',
+    ['$scope', '$q', '$translate', '$timeout', function ($scope, $q, $translate, $timeout) {
+
+        // Put json representing mesage definitions on scope
+        if ($scope.property.value !== undefined && $scope.property.value !== null && $scope.property.value.length > 0) {
+
+            if ($scope.property.value.constructor == String) {
+                $scope.messageDefinitions = JSON.parse($scope.property.value);
+            }
+            else {
+                // Note that we clone the json object rather then setting it directly,
+                // this to cope with the fact that the user can click the cancel button and no changes should have happened
+                $scope.messageDefinitions = angular.copy($scope.property.value);
+            }
+
+        } else {
+            $scope.messageDefinitions = [];
+        }
+
+        // Array to contain selected mesage definitions (yes - we only can select one, but ng-grid isn't smart enough)
+        $scope.selectedMessages = [];
+        $scope.translationsRetrieved = false;
+
+        $scope.labels = {};
+
+        var idPromise = $translate('PROPERTY.MESSAGEDEFINITIONS.ID');
+        var namePromise = $translate('PROPERTY.MESSAGEDEFINITIONS.NAME');
+
+        $q.all([idPromise, namePromise]).then(function (results) {
+
+            $scope.labels.idLabel = results[0];
+            $scope.labels.nameLabel = results[1];
+            $scope.translationsRetrieved = true;
+
+         // Config for grid
+            $scope.gridOptions = {
+                data: 'messageDefinitions',
+                headerRowHeight: 28,
+                enableRowSelection: true,
+                enableRowHeaderSelection: false,
+                multiSelect: false,
+                keepLastSelected : false,
+                selectedItems: $scope.selectedMessages,
+                columnDefs: [
+                    {field: 'id', displayName: $scope.labels.idLabel},
+                    {field: 'name', displayName: $scope.labels.nameLabel}]
+            };
+        });
+
+        // Click handler for add button
+        $scope.addNewMessageDefinition = function () {
+            var newMessageDefinition = {id: '', name: ''};
+
+            $scope.messageDefinitions.push(newMessageDefinition);
+            $timeout(function () {
+            	$scope.gridOptions.selectItem($scope.messageDefinitions.length - 1, true);
+            });
+        };
+
+        // Click handler for remove button
+        $scope.removeMessageDefinition = function () {
+        	if ($scope.selectedMessages && $scope.selectedMessages.length > 0) {
+            	var index = $scope.messageDefinitions.indexOf($scope.selectedMessages[0]);
+                $scope.gridOptions.selectItem(index, false);
+                $scope.messageDefinitions.splice(index, 1);
+
+                $scope.selectedMessages.length = 0;
+                if (index < $scope.messageDefinitions.length) {
+                    $scope.gridOptions.selectItem(index + 1, true);
+                } else if ($scope.messageDefinitions.length > 0) {
+                    $scope.gridOptions.selectItem(index - 1, true);
+                }
+            }
+        };
+
+        // Click handler for save button
+        $scope.save = function () {
+
+            if ($scope.messageDefinitions.length > 0) {
+                $scope.property.value = $scope.messageDefinitions;
+            } else {
+                $scope.property.value = null;
+            }
+
+            $scope.updatePropertyInModel($scope.property);
+            $scope.close();
+        };
+
+        $scope.cancel = function () {
+            $scope.property.mode = 'read';
+            $scope.$hide();
+        };
+
+        // Close button handler
+        $scope.close = function () {
+            $scope.property.mode = 'read';
+            $scope.$hide();
+        };
+
+    }]);

+/*
+ * Activiti Modeler component part of the Activiti project
+ * Copyright 2005-2014 Alfresco Software, Ltd. All rights reserved.
+ * 
+ * This library is free software; you can redistribute it and/or
+ * modify it under the terms of the GNU Lesser General Public
+ * License as published by the Free Software Foundation; either
+ * version 2.1 of the License, or (at your option) any later version.
+ *
+ * This library is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
+ * Lesser General Public License for more details.
+
+ * You should have received a copy of the GNU Lesser General Public
+ * License along with this library; if not, write to the Free Software
+ * Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301  USA
+ */
+
+angular.module('activitiModeler').controller('ActivitiMessageRefCtrl', [ '$scope', function($scope) {
+
+    // Find the parent shape on which the message definitions are defined
+    var messageDefinitionsProperty = undefined;
+    var parent = $scope.selectedShape;
+    while (parent !== null && parent !== undefined && messageDefinitionsProperty === undefined) {
+        if (parent.properties && parent.properties['oryx-messagedefinitions']) {
+            messageDefinitionsProperty = parent.properties['oryx-messagedefinitions'];
+        } else {
+            parent = parent.parent;
+        }
+    }
+
+    try {
+        messageDefinitionsProperty = JSON.parse(messageDefinitionsProperty);
+        if (typeof messageDefinitionsProperty == 'string') {
+            messageDefinitionsProperty = JSON.parse(messageDefinitionsProperty);
+        }
+    } catch (err) {
+        // Do nothing here, just to be sure we try-catch it
+    }
+
+    $scope.messageDefinitions = messageDefinitionsProperty;
+
+
+    $scope.messageChanged = function() {
+    	$scope.updatePropertyInModel($scope.property);
+    };
+}]);

+/*
+ * Activiti Modeler component part of the Activiti project
+ * Copyright 2005-2014 Alfresco Software, Ltd. All rights reserved.
+ * 
+ * This library is free software; you can redistribute it and/or
+ * modify it under the terms of the GNU Lesser General Public
+ * License as published by the Free Software Foundation; either
+ * version 2.1 of the License, or (at your option) any later version.
+ *
+ * This library is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
+ * Lesser General Public License for more details.
+
+ * You should have received a copy of the GNU Lesser General Public
+ * License along with this library; if not, write to the Free Software
+ * Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301  USA
+ */
+
+/*
+ * Execution listeners
+ */
+
+var KisBpmMultiInstanceCtrl = [ '$scope', function($scope) {
+
+    if ($scope.property.value == undefined && $scope.property.value == null)
+    {
+    	$scope.property.value = 'None';
+    }
+        
+    $scope.multiInstanceChanged = function() {
+    	$scope.updatePropertyInModel($scope.property);
+    };
+}];

+/*
+ * Activiti Modeler component part of the Activiti project
+ * Copyright 2005-2014 Alfresco Software, Ltd. All rights reserved.
+ * 
+ * This library is free software; you can redistribute it and/or
+ * modify it under the terms of the GNU Lesser General Public
+ * License as published by the Free Software Foundation; either
+ * version 2.1 of the License, or (at your option) any later version.
+ *
+ * This library is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
+ * Lesser General Public License for more details.
+
+ * You should have received a copy of the GNU Lesser General Public
+ * License along with this library; if not, write to the Free Software
+ * Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301  USA
+ */
+
+/*
+ * Input parameters for call activity
+ */
+
+var KisBpmOutParametersCtrl = [ '$scope' , '$modal', '$timeout', '$translate', function($scope, $modal, $timeout, $translate) {
+
+    // Config for the modal window
+    var opts = {
+        template:  'editor-app/configuration/properties/out-parameters-popup.html?version=' + Date.now(),
+        scope: $scope
+    };
+
+    // Open the dialog
+    $modal(opts);
+}];
+
+var KisBpmOutParametersPopupCtrl = [ '$scope', '$q', '$translate', function($scope, $q, $translate) {
+
+    // Put json representing form properties on scope
+    if ($scope.property.value !== undefined && $scope.property.value !== null
+        && $scope.property.value.outParameters !== undefined
+        && $scope.property.value.outParameters !== null) {
+        // Note that we clone the json object rather then setting it directly,
+        // this to cope with the fact that the user can click the cancel button and no changes should have happened
+        $scope.parameters = angular.copy($scope.property.value.outParameters);
+    } else {
+        $scope.parameters = [];
+    }
+
+    // Array to contain selected properties (yes - we only can select one, but ng-grid isn't smart enough)
+    $scope.selectedParameters = [];
+    $scope.translationsRetrieved = false;
+    
+    $scope.labels = {};
+    
+    var sourcePromise = $translate('PROPERTY.PARAMETER.SOURCE');
+    var sourceExpressionPromise = $translate('PROPERTY.PARAMETER.SOURCEEXPRESSION');
+    var targetPromise = $translate('PROPERTY.PARAMETER.TARGET');
+    
+    $q.all([sourcePromise, sourceExpressionPromise, targetPromise]).then(function(results) { 
+        $scope.labels.sourceLabel = results[0];
+        $scope.labels.sourceExpressionLabel = results[1];
+        $scope.labels.targetLabel = results[2];
+        $scope.translationsRetrieved = true;
+        
+        // Config for grid
+        $scope.gridOptions = {
+            data: 'parameters',
+            enableRowReordering: true,
+            headerRowHeight: 28,
+            multiSelect: false,
+            keepLastSelected : false,
+            selectedItems: $scope.selectedParameters,
+            columnDefs: [{ field: 'source', displayName: $scope.labels.sourceLabel },
+                         { field: 'sourceExpression', displayName: $scope.labels.sourceExpressionLabel },
+                         { field: 'target', displayName: $scope.labels.targetLabel }]
+        };
+    });
+
+    // Click handler for add button
+    $scope.addNewParameter = function() {
+        $scope.parameters.push({ source : '',
+            sourceExpression : '',
+            target : ''});
+    };
+
+    // Click handler for remove button
+    $scope.removeParameter = function() {
+        if ($scope.selectedParameters.length > 0) {
+            var index = $scope.parameters.indexOf($scope.selectedParameters[0]);
+            $scope.gridOptions.selectItem(index, false);
+            $scope.parameters.splice(index, 1);
+
+            $scope.selectedParameters.length = 0;
+            if (index < $scope.parameters.length) {
+                $scope.gridOptions.selectItem(index + 1, true);
+            } else if ($scope.parameters.length > 0) {
+                $scope.gridOptions.selectItem(index - 1, true);
+            }
+        }
+    };
+
+    // Click handler for up button
+    $scope.moveParameterUp = function() {
+        if ($scope.selectedParameters.length > 0) {
+            var index = $scope.parameters.indexOf($scope.selectedParameters[0]);
+            if (index != 0) { // If it's the first, no moving up of course
+                // Reason for funny way of swapping, see https://github.com/angular-ui/ng-grid/issues/272
+                var temp = $scope.parameters[index];
+                $scope.parameters.splice(index, 1);
+                $timeout(function(){
+                    $scope.parameters.splice(index + -1, 0, temp);
+                }, 100);
+
+            }
+        }
+    };
+
+    // Click handler for down button
+    $scope.moveParameterDown = function() {
+        if ($scope.selectedParameters.length > 0) {
+            var index = $scope.parameters.indexOf($scope.selectedParameters[0]);
+            if (index != $scope.parameters.length - 1) { // If it's the last element, no moving down of course
+                // Reason for funny way of swapping, see https://github.com/angular-ui/ng-grid/issues/272
+                var temp = $scope.parameters[index];
+                $scope.parameters.splice(index, 1);
+                $timeout(function(){
+                    $scope.parameters.splice(index + 1, 0, temp);
+                }, 100);
+
+            }
+        }
+    };
+
+    // Click handler for save button
+    $scope.save = function() {
+
+        if ($scope.parameters.length > 0) {
+            $scope.property.value = {};
+            $scope.property.value.outParameters = $scope.parameters;
+        } else {
+            $scope.property.value = null;
+        }
+
+        $scope.updatePropertyInModel($scope.property);
+        $scope.close();
+    };
+
+    $scope.cancel = function() {
+        $scope.close();
+    };
+
+    // Close button handler
+    $scope.close = function() {
+        $scope.property.mode = 'read';
+        $scope.$hide();
+    };
+
+}];

+/*
+ * Activiti Modeler component part of the Activiti project
+ * Copyright 2005-2014 Alfresco Software, Ltd. All rights reserved.
+ * 
+ * This library is free software; you can redistribute it and/or
+ * modify it under the terms of the GNU Lesser General Public
+ * License as published by the Free Software Foundation; either
+ * version 2.1 of the License, or (at your option) any later version.
+ *
+ * This library is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
+ * Lesser General Public License for more details.
+
+ * You should have received a copy of the GNU Lesser General Public
+ * License along with this library; if not, write to the Free Software
+ * Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301  USA
+ */
+
+/*
+ * Sequence flow order controller
+ */
+
+var KisBpmSequenceFlowOrderCtrl = [ '$scope', '$modal', '$timeout', '$translate', function($scope, $modal, $timeout, $translate) {
+
+    // Config for the modal window
+    var opts = {
+        template:  'editor-app/configuration/properties/sequenceflow-order-popup.html?version=' + Date.now(),
+        scope: $scope
+    };
+
+    $modal(opts);
+}];
+
+var KisBpmSequenceFlowOrderPopupCtrl = ['$scope', '$translate', function($scope, $translate) {
+
+    // Find the outgoing sequence flow of the current selected shape
+    var outgoingSequenceFlow = [];
+    var selectedShape = $scope.selectedShape;
+    if (selectedShape) {
+        var outgoingNodes = selectedShape.getOutgoingShapes();
+        for (var i=0; i<outgoingNodes.length; i++) {
+            if (outgoingNodes[i].getStencil().title() === 'Sequence flow') {
+                var targetActivity = outgoingNodes[i].getTarget();
+                // We need the resourceId of a sequence flow, not the id because that will change with every editor load
+                outgoingSequenceFlow.push({
+                    id : outgoingNodes[i].resourceId,
+                    targetTitle : targetActivity.properties['oryx-name'],
+                    targetType : targetActivity.getStencil().title()
+                });
+            }
+        }
+    } else {
+        console.log('Programmatic error: no selected shape found');
+    }
+
+    // Now we can apply the order which was (possibly) previously saved
+    var orderedOutgoingSequenceFlow = [];
+    if ($scope.property.value && $scope.property.value.sequenceFlowOrder) {
+
+        var sequenceFlowOrderList = $scope.property.value.sequenceFlowOrder;
+
+        // Loop the list of sequence flow that was saved  in the json model and match them with the outgoing sequence flow found above
+        for (var flowIndex=0; flowIndex < sequenceFlowOrderList.length; flowIndex++) {
+
+            // find the sequence flow in the outgoing sequence flows.
+
+            for (var outgoingFlowIndex=0; outgoingFlowIndex < outgoingSequenceFlow.length; outgoingFlowIndex++) {
+                if (outgoingSequenceFlow[outgoingFlowIndex].id === sequenceFlowOrderList[flowIndex]) {
+                    orderedOutgoingSequenceFlow.push(outgoingSequenceFlow[outgoingFlowIndex]);
+                    outgoingSequenceFlow.splice(outgoingFlowIndex, 1);
+                    break;
+                }
+            }
+        }
+
+        // Now all the matching sequence flow we're removed from the outgoing sequence flow list
+        // We can simply apply the remaining ones (these are new vs. the time when the values were saved to the model)
+        orderedOutgoingSequenceFlow = orderedOutgoingSequenceFlow.concat(outgoingSequenceFlow);
+
+    } else {
+        orderedOutgoingSequenceFlow = outgoingSequenceFlow;
+    }
+
+    // Now we can put it on the scope
+    $scope.outgoingSequenceFlow = orderedOutgoingSequenceFlow;
+
+    // Move up click handler
+    $scope.moveUp = function(index) {
+        var temp = $scope.outgoingSequenceFlow[index];
+        $scope.outgoingSequenceFlow[index] = $scope.outgoingSequenceFlow[index - 1];
+        $scope.outgoingSequenceFlow[index - 1] = temp;
+    };
+
+    // Move down click handler
+    $scope.moveDown = function(index) {
+        var temp = $scope.outgoingSequenceFlow[index];
+        $scope.outgoingSequenceFlow[index] = $scope.outgoingSequenceFlow[index + 1];
+        $scope.outgoingSequenceFlow[index + 1] = temp;
+    };
+
+    // Save click handler
+    $scope.save = function() {
+        if ($scope.outgoingSequenceFlow.length > 0) {
+            $scope.property.value = {};
+            $scope.property.value.sequenceFlowOrder = [];
+
+            for (var flowIndex=0; flowIndex < $scope.outgoingSequenceFlow.length; flowIndex++) {
+                $scope.property.value.sequenceFlowOrder.push($scope.outgoingSequenceFlow[flowIndex].id);
+            }
+        } else {
+            $scope.property.value = null;
+        }
+
+        $scope.updatePropertyInModel($scope.property);
+        $scope.close();
+    };
+
+    // Cancel click handler
+    $scope.cancel = function() {
+        $scope.close();
+    };
+
+    // Close button handler
+    $scope.close = function() {
+        $scope.property.mode = 'read';
+        $scope.$hide();
+    };
+
+}];

+/*
+ * Activiti Modeler component part of the Activiti project
+ * Copyright 2005-2014 Alfresco Software, Ltd. All rights reserved.
+ * 
+ * This library is free software; you can redistribute it and/or
+ * modify it under the terms of the GNU Lesser General Public
+ * License as published by the Free Software Foundation; either
+ * version 2.1 of the License, or (at your option) any later version.
+ *
+ * This library is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
+ * Lesser General Public License for more details.
+
+ * You should have received a copy of the GNU Lesser General Public
+ * License along with this library; if not, write to the Free Software
+ * Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301  USA
+ */
+
+angular.module('activitiModeler').controller('ActivitiSignalDefinitionsCtrl', ['$scope', '$modal', function ($scope, $modal) {
+
+    // Config for the modal window
+    var opts = {
+        template: 'editor-app/configuration/properties/signal-definitions-popup.html?version=' + Date.now(),
+        scope: $scope
+    };
+
+    // Open the dialog
+    $modal(opts);
+}]);
+
+//Need a separate controller for the modal window due to https://github.com/angular-ui/bootstrap/issues/259
+// Will be fixed in a newer version of Angular UI
+angular.module('activitiModeler').controller('ActivitiSignalDefinitionsPopupCtrl',
+    ['$scope', '$q', '$translate', '$timeout', function ($scope, $q, $translate, $timeout) {
+
+        // Put json representing signal definitions on scope
+        if ($scope.property.value !== undefined && $scope.property.value !== null && $scope.property.value.length > 0) {
+
+            if ($scope.property.value.constructor == String) {
+                $scope.signalDefinitions = JSON.parse($scope.property.value);
+            }
+            else {
+                // Note that we clone the json object rather then setting it directly,
+                // this to cope with the fact that the user can click the cancel button and no changes should have happened
+                $scope.signalDefinitions = angular.copy($scope.property.value);
+            }
+
+        } else {
+            $scope.signalDefinitions = [];
+        }
+
+        // Array to contain selected signal definitions (yes - we only can select one, but ng-grid isn't smart enough)
+        $scope.selectedSignals = [];
+        $scope.translationsRetrieved = false;
+
+        $scope.labels = {};
+
+        var idPromise = $translate('PROPERTY.SIGNALDEFINITIONS.ID');
+        var namePromise = $translate('PROPERTY.SIGNALDEFINITIONS.NAME');
+        var scopePromise = $translate('PROPERTY.SIGNALDEFINITIONS.SCOPE');
+
+        $q.all([idPromise, namePromise, scopePromise]).then(function (results) {
+
+            $scope.labels.idLabel = results[0];
+            $scope.labels.nameLabel = results[1];
+            $scope.labels.scopeLabel = results[2];
+            $scope.translationsRetrieved = true;
+
+            // Config for grid
+            $scope.gridOptions = {
+                data: 'signalDefinitions',
+                headerRowHeight: 28,
+                enableRowSelection: true,
+                enableRowHeaderSelection: false,
+                multiSelect: false,
+                keepLastSelected : false,
+                selectedItems: $scope.selectedSignals,
+                columnDefs: [
+                    {field: 'id', displayName: $scope.labels.idLabel},
+                    {field: 'name', displayName: $scope.labels.nameLabel},
+                    {field: 'scope', displayName: $scope.labels.scopeLabel}]
+            };
+        });
+
+        // Click handler for add button
+        $scope.addNewSignalDefinition = function () {
+            var newSignalDefinition = {id: '', name: '', scope: 'global'};
+
+            $scope.signalDefinitions.push(newSignalDefinition);
+            $timeout(function () {
+            	$scope.gridOptions.selectItem($scope.signalDefinitions.length - 1, true);
+            });
+        };
+
+        // Click handler for remove button
+        $scope.removeSignalDefinition = function () {
+            if ($scope.selectedSignals && $scope.selectedSignals.length > 0) {
+            	var index = $scope.signalDefinitions.indexOf($scope.selectedSignals[0]);
+                $scope.gridOptions.selectItem(index, false);
+                $scope.signalDefinitions.splice(index, 1);
+
+                $scope.selectedSignals.length = 0;
+                if (index < $scope.signalDefinitions.length) {
+                    $scope.gridOptions.selectItem(index + 1, true);
+                } else if ($scope.signalDefinitions.length > 0) {
+                    $scope.gridOptions.selectItem(index - 1, true);
+                }
+            }
+        };
+
+        // Click handler for save button
+        $scope.save = function () {
+
+            if ($scope.signalDefinitions.length > 0) {
+                $scope.property.value = $scope.signalDefinitions;
+            } else {
+                $scope.property.value = null;
+            }
+
+            $scope.updatePropertyInModel($scope.property);
+            $scope.close();
+        };
+
+        $scope.cancel = function () {
+            $scope.property.mode = 'read';
+            $scope.$hide();
+        };
+
+        // Close button handler
+        $scope.close = function () {
+            $scope.property.mode = 'read';
+            $scope.$hide();
+        };
+
+    }]);

+/*
+ * Activiti Modeler component part of the Activiti project
+ * Copyright 2005-2014 Alfresco Software, Ltd. All rights reserved.
+ * 
+ * This library is free software; you can redistribute it and/or
+ * modify it under the terms of the GNU Lesser General Public
+ * License as published by the Free Software Foundation; either
+ * version 2.1 of the License, or (at your option) any later version.
+ *
+ * This library is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
+ * Lesser General Public License for more details.
+
+ * You should have received a copy of the GNU Lesser General Public
+ * License along with this library; if not, write to the Free Software
+ * Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301  USA
+ */
+angular.module('activitiModeler').controller('ActivitiSignalRefCtrl', [ '$scope', function($scope) {
+
+    // Find the parent shape on which the signal definitions are defined
+    var signalDefinitionsProperty = undefined;
+    var parent = $scope.selectedShape;
+    while (parent !== null && parent !== undefined && signalDefinitionsProperty === undefined) {
+        if (parent.properties && parent.properties['oryx-signaldefinitions']) {
+            signalDefinitionsProperty = parent.properties['oryx-signaldefinitions'];
+        } else {
+            parent = parent.parent;
+        }
+    }
+
+    try {
+        signalDefinitionsProperty = JSON.parse(signalDefinitionsProperty);
+        if (typeof signalDefinitionsProperty == 'string') {
+            signalDefinitionsProperty = JSON.parse(signalDefinitionsProperty);
+        }
+    } catch (err) {
+        // Do nothing here, just to be sure we try-catch it
+    }
+
+    $scope.signalDefinitions = signalDefinitionsProperty;
+
+
+    $scope.signalChanged = function() {
+    	$scope.updatePropertyInModel($scope.property);
+    };
+}]);

+/*
+ * Activiti Modeler component part of the Activiti project
+ * Copyright 2005-2014 Alfresco Software, Ltd. All rights reserved.
+ * 
+ * This library is free software; you can redistribute it and/or
+ * modify it under the terms of the GNU Lesser General Public
+ * License as published by the Free Software Foundation; either
+ * version 2.1 of the License, or (at your option) any later version.
+ *
+ * This library is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
+ * Lesser General Public License for more details.
+
+ * You should have received a copy of the GNU Lesser General Public
+ * License along with this library; if not, write to the Free Software
+ * Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301  USA
+ */
+
+/*
+ * Task listeners
+ */
+
+var KisBpmTaskListenersCtrl = [ '$scope', '$modal', '$timeout', '$translate', function($scope, $modal, $timeout, $translate) {
+
+    // Config for the modal window
+    var opts = {
+        template:  'editor-app/configuration/properties/task-listeners-popup.html?version=' + Date.now(),
+        scope: $scope
+    };
+
+    // Open the dialog
+    $modal(opts);
+}];
+
+var KisBpmTaskListenersPopupCtrl = [ '$scope', '$q', '$translate', function($scope, $q, $translate) {
+
+    // Put json representing form properties on scope
+    if ($scope.property.value !== undefined && $scope.property.value !== null
+        && $scope.property.value.taskListeners !== undefined
+        && $scope.property.value.taskListeners !== null) {
+        
+        if ($scope.property.value.taskListeners.constructor == String)
+        {
+            $scope.taskListeners = JSON.parse($scope.property.value.taskListeners);
+        }
+        else
+        {
+            // Note that we clone the json object rather then setting it directly,
+            // this to cope with the fact that the user can click the cancel button and no changes should have happened
+            $scope.taskListeners = angular.copy($scope.property.value.taskListeners);
+        }
+        
+        for (var i = 0; i < $scope.taskListeners.length; i++)
+        {
+            var taskListener = $scope.taskListeners[i];
+            if (taskListener.className !== undefined && taskListener.className !== '')
+            {
+                taskListener.implementation = taskListener.className;
+            }
+            else if (taskListener.expression !== undefined && taskListener.expression !== '')
+            {
+                taskListener.implementation = taskListener.expression;
+            }
+            else if (taskListener.delegateExpression !== undefined && taskListener.delegateExpression !== '')
+            {
+                taskListener.implementation = taskListener.delegateExpression;
+            }
+        }
+    } else {
+        $scope.taskListeners = [];
+    }
+
+    // Array to contain selected properties (yes - we only can select one, but ng-grid isn't smart enough)
+    $scope.selectedListeners = [];
+    $scope.selectedFields = [];
+    $scope.translationsRetrieved = false;
+    
+    $scope.labels = {};
+    
+    var eventPromise = $translate('PROPERTY.TASKLISTENERS.EVENT');
+    var implementationPromise = $translate('PROPERTY.TASKLISTENERS.FIELDS.IMPLEMENTATION');
+    var namePromise = $translate('PROPERTY.TASKLISTENERS.FIELDS.NAME');
+    
+    $q.all([eventPromise, implementationPromise, namePromise]).then(function(results) { 
+        $scope.labels.eventLabel = results[0];
+        $scope.labels.implementationLabel = results[1];
+        $scope.labels.nameLabel = results[2];
+        $scope.translationsRetrieved = true;
+
+        // Config for grid
+        $scope.gridOptions = {
+            data: 'taskListeners',
+            enableRowReordering: true,
+            headerRowHeight: 28,
+            multiSelect: false,
+            keepLastSelected : false,
+            selectedItems: $scope.selectedListeners,
+            afterSelectionChange: function (rowItem, event) {
+                $scope.selectedFields.length = 0;
+                if ($scope.selectedListeners.length > 0)
+                {
+                    var fields = $scope.selectedListeners[0].fields;
+                    if (fields !== undefined && fields !== null)
+                    {
+                        for (var i = 0; i < fields.length; i++)
+                        {
+                            var field = fields[i];
+                            if (field.stringValue !== undefined && field.stringValue !== '')
+                            {
+                                field.implementation = field.stringValue;
+                            }
+                            else if (field.expression !== undefined && field.expression !== '')
+                            {
+                                field.implementation = field.expression;
+                            }
+                            else if (field.string !== undefined && field.string !== '')
+                            {
+                                field.implementation = field.string;
+                            }
+                        }
+                    }
+                }
+            },
+            columnDefs: [{ field: 'event', displayName: $scope.labels.eventLabel },
+                { field: 'implementation', displayName: $scope.labels.implementationLabel}]
+        };
+        
+        // Config for field grid
+        $scope.gridFieldOptions = {
+            data: 'selectedListeners[0].fields',
+            enableRowReordering: true,
+            headerRowHeight: 28,
+            multiSelect: false,
+            keepLastSelected : false,
+            selectedItems: $scope.selectedFields,
+            columnDefs: [{ field: 'name', displayName: $scope.labels.name },
+                { field: 'implementation', displayName: $scope.labels.implementationLabel}]
+        };
+    });
+    
+    $scope.listenerDetailsChanged = function() {
+        if ($scope.selectedListeners[0].className !== '')
+        {
+            $scope.selectedListeners[0].implementation = $scope.selectedListeners[0].className;
+        }
+        else if ($scope.selectedListeners[0].expression !== '')
+        {
+            $scope.selectedListeners[0].implementation = $scope.selectedListeners[0].expression;
+        }
+        else if ($scope.selectedListeners[0].delegateExpression !== '')
+        {
+            $scope.selectedListeners[0].implementation = $scope.selectedListeners[0].delegateExpression;
+        }
+        else
+        {
+            $scope.selectedListeners[0].implementation = '';
+        }
+    };
+
+    // Click handler for add button
+    $scope.addNewListener = function() {
+        $scope.taskListeners.push({ event : 'create',
+            implementation : '',
+            className : '',
+            expression: '',
+            delegateExpression: ''});
+    };
+
+    // Click handler for remove button
+    $scope.removeListener = function() {
+        if ($scope.selectedListeners.length > 0) {
+            var index = $scope.taskListeners.indexOf($scope.selectedListeners[0]);
+            $scope.gridOptions.selectItem(index, false);
+            $scope.taskListeners.splice(index, 1);
+
+            $scope.selectedListeners.length = 0;
+            if (index < $scope.taskListeners.length) {
+                $scope.gridOptions.selectItem(index + 1, true);
+            } else if ($scope.taskListeners.length > 0) {
+                $scope.gridOptions.selectItem(index - 1, true);
+            }
+        }
+    };
+
+    // Click handler for up button
+    $scope.moveListenerUp = function() {
+        if ($scope.selectedListeners.length > 0) {
+            var index = $scope.taskListeners.indexOf($scope.selectedListeners[0]);
+            if (index != 0) { // If it's the first, no moving up of course
+                // Reason for funny way of swapping, see https://github.com/angular-ui/ng-grid/issues/272
+                var temp = $scope.taskListeners[index];
+                $scope.taskListeners.splice(index, 1);
+                $timeout(function(){
+                    $scope.taskListeners.splice(index + -1, 0, temp);
+                }, 100);
+
+            }
+        }
+    };
+
+    // Click handler for down button
+    $scope.moveListenerDown = function() {
+        if ($scope.selectedListeners.length > 0) {
+            var index = $scope.taskListeners.indexOf($scope.selectedListeners[0]);
+            if (index != $scope.taskListeners.length - 1) { // If it's the last element, no moving down of course
+                // Reason for funny way of swapping, see https://github.com/angular-ui/ng-grid/issues/272
+                var temp = $scope.taskListeners[index];
+                $scope.taskListeners.splice(index, 1);
+                $timeout(function(){
+                    $scope.taskListeners.splice(index + 1, 0, temp);
+                }, 100);
+
+            }
+        }
+    };
+    
+    $scope.fieldDetailsChanged = function() {
+        if ($scope.selectedFields[0].stringValue != '')
+        {
+            $scope.selectedFields[0].implementation = $scope.selectedFields[0].stringValue;
+        }
+        else if ($scope.selectedFields[0].expression != '')
+        {
+            $scope.selectedFields[0].implementation = $scope.selectedFields[0].expression;
+        }
+        else if ($scope.selectedFields[0].string != '')
+        {
+            $scope.selectedFields[0].implementation = $scope.selectedFields[0].string;
+        }
+        else
+        {
+            $scope.selectedFields[0].implementation = '';
+        }
+    };
+
+    // Click handler for add button
+    $scope.addNewField = function() {
+        if ($scope.selectedListeners.length > 0)
+        {
+            if ($scope.selectedListeners[0].fields == undefined)
+            {
+                $scope.selectedListeners[0].fields = [];
+            }
+            $scope.selectedListeners[0].fields.push({ name : 'fieldName',
+                implementation : '',
+                stringValue : '',
+                expression: '',
+                string: ''});
+        }
+    };
+
+    // Click handler for remove button
+    $scope.removeField = function() {
+        if ($scope.selectedFields.length > 0) {
+            var index = $scope.selectedListeners[0].fields.indexOf($scope.selectedFields[0]);
+            $scope.gridFieldOptions.selectItem(index, false);
+            $scope.selectedListeners[0].fields.splice(index, 1);
+
+            $scope.selectedFields.length = 0;
+            if (index < $scope.selectedListeners[0].fields.length) {
+                $scope.gridFieldOptions.selectItem(index + 1, true);
+            } else if ($scope.selectedListeners[0].fields.length > 0) {
+                $scope.gridFieldOptions.selectItem(index - 1, true);
+            }
+        }
+    };
+
+    // Click handler for up button
+    $scope.moveFieldUp = function() {
+        if ($scope.selectedFields.length > 0) {
+            var index = $scope.selectedListeners[0].fields.indexOf($scope.selectedFields[0]);
+            if (index != 0) { // If it's the first, no moving up of course
+                // Reason for funny way of swapping, see https://github.com/angular-ui/ng-grid/issues/272
+                var temp = $scope.selectedListeners[0].fields[index];
+                $scope.selectedListeners[0].fields.splice(index, 1);
+                $timeout(function(){
+                    $scope.selectedListeners[0].fields.splice(index + -1, 0, temp);
+                }, 100);
+
+            }
+        }
+    };
+
+    // Click handler for down button
+    $scope.moveFieldDown = function() {
+        if ($scope.selectedFields.length > 0) {
+            var index = $scope.selectedListeners[0].fields.indexOf($scope.selectedFields[0]);
+            if (index != $scope.selectedListeners[0].fields.length - 1) { // If it's the last element, no moving down of course
+                // Reason for funny way of swapping, see https://github.com/angular-ui/ng-grid/issues/272
+                var temp = $scope.selectedListeners[0].fields[index];
+                $scope.selectedListeners[0].fields.splice(index, 1);
+                $timeout(function(){
+                    $scope.selectedListeners[0].fields.splice(index + 1, 0, temp);
+                }, 100);
+
+            }
+        }
+    };
+
+    // Click handler for save button
+    $scope.save = function() {
+
+        if ($scope.taskListeners.length > 0) {
+            $scope.property.value = {};
+            $scope.property.value.taskListeners = $scope.taskListeners;
+        } else {
+            $scope.property.value = null;
+        }
+
+        $scope.updatePropertyInModel($scope.property);
+        $scope.close();
+    };
+
+    $scope.cancel = function() {
+        $scope.close();
+    };
+
+    // Close button handler
+    $scope.close = function() {
+        $scope.property.mode = 'read';
+        $scope.$hide();
+    };
+
+}];

+/*
+ * Activiti Modeler component part of the Activiti project
+ * Copyright 2005-2014 Alfresco Software, Ltd. All rights reserved.
+ * 
+ * This library is free software; you can redistribute it and/or
+ * modify it under the terms of the GNU Lesser General Public
+ * License as published by the Free Software Foundation; either
+ * version 2.1 of the License, or (at your option) any later version.
+ *
+ * This library is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
+ * Lesser General Public License for more details.
+
+ * You should have received a copy of the GNU Lesser General Public
+ * License along with this library; if not, write to the Free Software
+ * Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301  USA
+ */
+'use strict';
+
+var KISBPM = KISBPM || {};
+KISBPM.PROPERTY_CONFIG =
+{
+    "string": {
+        "readModeTemplateUrl": "editor-app/configuration/properties/default-value-display-template.html",
+        "writeModeTemplateUrl": "editor-app/configuration/properties/string-property-write-mode-template.html"
+    },
+    "boolean": {
+        "templateUrl": "editor-app/configuration/properties/boolean-property-template.html"
+    },
+    "text" : {
+        "readModeTemplateUrl": "editor-app/configuration/properties/default-value-display-template.html",
+        "writeModeTemplateUrl": "editor-app/configuration/properties/text-property-write-template.html"
+    },
+    "kisbpm-multiinstance" : {
+        "readModeTemplateUrl": "editor-app/configuration/properties/default-value-display-template.html",
+        "writeModeTemplateUrl": "editor-app/configuration/properties/multiinstance-property-write-template.html"
+    },
+    "oryx-formproperties-complex": {
+        "readModeTemplateUrl": "editor-app/configuration/properties/form-properties-display-template.html",
+        "writeModeTemplateUrl": "editor-app/configuration/properties/form-properties-write-template.html"
+    },
+    "oryx-executionlisteners-multiplecomplex": {
+        "readModeTemplateUrl": "editor-app/configuration/properties/execution-listeners-display-template.html",
+        "writeModeTemplateUrl": "editor-app/configuration/properties/execution-listeners-write-template.html"
+    },
+    "oryx-tasklisteners-multiplecomplex": {
+        "readModeTemplateUrl": "editor-app/configuration/properties/task-listeners-display-template.html",
+        "writeModeTemplateUrl": "editor-app/configuration/properties/task-listeners-write-template.html"
+    },
+    "oryx-eventlisteners-multiplecomplex": {
+        "readModeTemplateUrl": "editor-app/configuration/properties/event-listeners-display-template.html",
+        "writeModeTemplateUrl": "editor-app/configuration/properties/event-listeners-write-template.html"
+    },
+    "oryx-usertaskassignment-complex": {
+        "readModeTemplateUrl": "editor-app/configuration/properties/assignment-display-template.html",
+        "writeModeTemplateUrl": "editor-app/configuration/properties/assignment-write-template.html"
+    },
+    "oryx-servicetaskfields-complex": {
+        "readModeTemplateUrl": "editor-app/configuration/properties/fields-display-template.html",
+        "writeModeTemplateUrl": "editor-app/configuration/properties/fields-write-template.html"
+    },
+    "oryx-callactivityinparameters-complex": {
+        "readModeTemplateUrl": "editor-app/configuration/properties/in-parameters-display-template.html",
+        "writeModeTemplateUrl": "editor-app/configuration/properties/in-parameters-write-template.html"
+    },
+    "oryx-callactivityoutparameters-complex": {
+        "readModeTemplateUrl": "editor-app/configuration/properties/out-parameters-display-template.html",
+        "writeModeTemplateUrl": "editor-app/configuration/properties/out-parameters-write-template.html"
+    },
+    "oryx-subprocessreference-complex": {
+        "readModeTemplateUrl": "editor-app/configuration/properties/subprocess-reference-display-template.html",
+        "writeModeTemplateUrl": "editor-app/configuration/properties/subprocess-reference-write-template.html"
+    },
+    "oryx-sequencefloworder-complex" : {
+        "readModeTemplateUrl": "editor-app/configuration/properties/sequenceflow-order-display-template.html",
+        "writeModeTemplateUrl": "editor-app/configuration/properties/sequenceflow-order-write-template.html"
+    },
+    "oryx-conditionsequenceflow-complex" : {
+        "readModeTemplateUrl": "editor-app/configuration/properties/condition-expression-display-template.html",
+        "writeModeTemplateUrl": "editor-app/configuration/properties/condition-expression-write-template.html"
+    },
+    "oryx-signaldefinitions-multiplecomplex" : {
+        "readModeTemplateUrl": "editor-app/configuration/properties/signal-definitions-display-template.html",
+        "writeModeTemplateUrl": "editor-app/configuration/properties/signal-definitions-write-template.html"
+    },
+    "oryx-signalref-string" : {
+        "readModeTemplateUrl": "editor-app/configuration/properties/default-value-display-template.html",
+        "writeModeTemplateUrl": "editor-app/configuration/properties/signal-property-write-template.html"
+    },
+    "oryx-messagedefinitions-multiplecomplex" : {
+        "readModeTemplateUrl": "editor-app/configuration/properties/message-definitions-display-template.html",
+        "writeModeTemplateUrl": "editor-app/configuration/properties/message-definitions-write-template.html"
+    },
+    "oryx-messageref-string" : {
+        "readModeTemplateUrl": "editor-app/configuration/properties/default-value-display-template.html",
+        "writeModeTemplateUrl": "editor-app/configuration/properties/message-property-write-template.html"
+    }
+};

+<span ng-if="property.value.assignment.assignee">{{'PROPERTY.ASSIGNMENT.ASSIGNEE_DISPLAY' | translate:property.value.assignment }} </span>
+<span ng-if="property.value.assignment.candidateUsers.length > 0">{{'PROPERTY.ASSIGNMENT.CANDIDATE_USERS_DISPLAY' | translate:property.value.assignment.candidateUsers}} </span>
+<span ng-if="property.value.assignment.candidateGroups.length > 0">{{'PROPERTY.ASSIGNMENT.CANDIDATE_GROUPS_DISPLAY' | translate:property.value.assignment.candidateGroups}} </span>
+<span ng-if="!property.value.assignment.assignee && (!property.value.assignment.candidateUsers || property.value.assignment.candidateUsers.length == 0) && (!property.value.assignment.candidateGroups || property.value.assignment.candidateGroups.length == 0)" translate>PROPERTY.ASSIGNMENT.EMPTY</span>

+<div class="modal" ng-controller="KisBpmAssignmentPopupCtrl">
+    <div class="modal-dialog">
+        <div class="modal-content">
+            <div class="modal-header">
+                <button type="button" class="close" data-dismiss="modal" aria-hidden="true" ng-click="close()">&times;</button>
+                <h2 translate>PROPERTY.ASSIGNMENT.TITLE</h2>
+            </div>
+            <div class="modal-body">
+            
+            	<div class="row row-no-gutter">
+            		<div class="form-group">
+            			<label for="assigneeField">{{'PROPERTY.ASSIGNMENT.ASSIGNEE' | translate}}</label>
+            			<input type="text" id="assigneeField" class="form-control" ng-model="assignment.assignee" placeholder="{{'PROPERTY.ASSIGNMENT.ASSIGNEE_PLACEHOLDER' | translate}}" />
+            		</div>
+            	</div>
+            	
+                <div class="row row-no-gutter">
+                    <div class="form-group">
+                    	<label for="userField">{{'PROPERTY.ASSIGNMENT.CANDIDATE_USERS' | translate}}</label>
+                        <div ng-repeat="candidateUser in assignment.candidateUsers">
+            	            <input id="userField" class="form-control" type="text" ng-model="candidateUser.value" />
+            	            <i class="glyphicon glyphicon-minus clickable-property" ng-click="removeCandidateUserValue($index)"></i>
+            	            <i ng-if="$index == (assignment.candidateUsers.length - 1)" class="glyphicon glyphicon-plus clickable-property" ng-click="addCandidateUserValue($index)"></i>
+                        </div>
+                   	</div>
+            
+                    <div class="form-group">
+                    	<label for="groupField">{{'PROPERTY.ASSIGNMENT.CANDIDATE_GROUPS' | translate}}</label>
+                        <div ng-repeat="candidateGroup in assignment.candidateGroups">
+            	          	<input id="groupField" class="form-control" type="text" ng-model="candidateGroup.value" />
+            	          	<i class="glyphicon glyphicon-minus clickable-property" ng-click="removeCandidateGroupValue($index)"></i>
+            	          	<i ng-if="$index == (assignment.candidateGroups.length - 1)" class="glyphicon glyphicon-plus clickable-property" ng-click="addCandidateGroupValue($index)"></i>
+                        </div>
+                    </div>
+                </div>
+            
+            </div>
+            <div class="modal-footer">
+                <button ng-click="close()" class="btn btn-primary" translate>ACTION.CANCEL</button>
+                <button ng-click="save()" class="btn btn-primary" translate>ACTION.SAVE</button>
+            </div>
+        </div>
+    </div>
+</div>

+
+<!-- Just need to instantiate the controller, and it will take care of showing the modal dialog -->
+<span ng-controller="KisBpmAssignmentCtrl">
+</span>

+
+<div ng-controller="KisBpmBooleanPropertyCtrl">
+    <input type="checkbox" ng-model="property.value" ng-change="changeValue()"/>
+</div>

+<span ng-if="property.value">{{property.value|limitTo:20}}</span>
+<span ng-if="!property.value">{{'PROPERTY.SEQUENCEFLOW.CONDITION.NO-CONDITION-DISPLAY' | translate}}</span>

+
+<div class="modal" ng-controller="KisBpmConditionExpressionPopupCtrl">
+<div class="modal-dialog">
+<div class="modal-content">
+<div class="modal-header">
+    <button type="button" class="close" data-dismiss="modal" aria-hidden="true" ng-click="close()">&times;</button>
+    <h2 translate>PROPERTY.SEQUENCEFLOW.CONDITION.TITLE</h2>
+</div>
+<div class="modal-body">
+
+    <div class="detail-group clearfix">
+        
+        <div class="form-group clearfix">
+            <div class="col-xs-12">
+                <label class="col-xs-3">{{'PROPERTY.SEQUENCEFLOW.CONDITION.STATIC' | translate}}</label>
+                <div class="col-xs-9">
+                    <textarea class="form-control" ng-model="conditionExpression.value" style="width:90%; height:100%; max-width: 100%; max-height: 100%; min-height: 100px"/>
+                </div>
+            </div>
+        </div>
+
+    </div>
+    <div class="modal-footer">
+        <button ng-click="close()" class="btn btn-primary" translate>ACTION.CANCEL</button>
+        <button ng-click="save()" class="btn btn-primary" translate>ACTION.SAVE</button>
+    </div>
+</div>
+</div>
+</div>

+
+<!-- Just need to instantiate the controller, and it will take care of showing the modal dialog -->
+<span ng-controller="KisBpmConditionExpressionCtrl">
+</span>

+
+<span ng-if="!property.noValue">{{property.value|limitTo:20}}</span>
+<span ng-if="!property.noValue && property.value != null && property.value.length > 20">...</span>
+<span ng-if="property.noValue" translate>PROPERTY.EMPTY</span>

+
+<span ng-if="!property.noValue">{{'PROPERTY.EVENTLISTENERS.DISPLAY' | translate:property.value.eventListeners}}</span>
+<span ng-if="property.noValue" translate>PROPERTY.EVENTLISTENERS.EMPTY</span>

+
+<div class="modal" ng-controller="KisBpmEventListenersPopupCtrl">
+    <div class="modal-dialog modal-wide">
+        <div class="modal-content">
+            <div class="modal-header">
+                <button type="button" class="close" data-dismiss="modal" aria-hidden="true" ng-click="close()">&times;</button>
+                <h2>{{'PROPERTY.PROPERTY.EDIT.TITLE' | translate:property}}</h2>
+            </div>
+            <div class="modal-body">
+            
+                <div class="row row-no-gutter">
+                	<div class="col-xs-10">
+            	        <div ng-if="translationsRetrieved" class="kis-listener-grid" ng-grid="gridOptions"></div>
+            	        <div class="pull-right">
+            	            <div class="btn-group">
+            	                <a class="btn btn-icon btn-lg" rel="tooltip" data-title="{{ACTION.MOVE.UP | translate}}" data-placement="bottom" data-original-title="" title="" ng-click="moveListenerUp()"><i class="glyphicon glyphicon-arrow-up"></i></a>
+            	                <a class="btn btn-icon btn-lg" rel="tooltip" data-title="{{ACTION.MOVE.DOWN | translate}}" data-placement="bottom" data-original-title="" title="" ng-click="moveListenerDown()"><i class="glyphicon glyphicon-arrow-down"></i></a>
+            	            </div>
+            	            <div class="btn-group">
+            	                <a class="btn btn-icon btn-lg" rel="tooltip" data-title="{{ACTION.ADD | translate}}" data-placement="bottom" data-original-title="" title="" ng-click="addNewListener()"><i class="glyphicon glyphicon-plus"></i></a>
+            	                <a class="btn btn-icon btn-lg" rel="tooltip" data-title="{{ACTION.REMOVE | translate}}" data-placement="bottom" data-original-title="" title="" ng-click="removeListener()"><i class="glyphicon glyphicon-minus"></i></a>
+            	            </div>
+            	        </div>
+            		</div>
+            	</div>
+            	
+            	<div class="row row-no-gutter">
+                  	<div ng-if="translationsRetrieved" ng-show="selectedListeners.length > 0" class="col-xs-6">
+            			<div class="form-group">
+            	        	<label for="userField">{{'PROPERTY.EVENTLISTENERS.EVENTS' | translate}}</label>
+            	            <div ng-repeat="eventDefinition in selectedListeners[0].events">
+            	            	<select id="eventField" class="form-control" ng-model="eventDefinition.event" ng-change="listenerDetailsChanged()">
+            	            		<option title="{{'EVENT_TYPE.ACTIVITY.COMPENSATE.TOOLTIP' | translate}}">ACTIVITY_COMPENSATE</option>
+            	            		<option title="{{'EVENT_TYPE.ACTIVITY.COMPLETED.TOOLTIP' | translate}}">ACTIVITY_COMPLETED</option>
+            	            		<option title="bla">ACTIVITY_ERROR_RECEIVED</option>
+            	            		<option>ACTIVITY_MESSAGE_RECEIVED</option>
+            	            		<option>ACTIVITY_SIGNALED</option>
+            	            		<option>ACTIVITY_STARTED</option>
+            	            		<option>ENGINE_CLOSED</option>
+            	            		<option>ENGINE_CREATED</option>
+            	            		<option>ENTITY_ACTIVATED</option>
+            	                	<option>ENTITY_CREATED</option>
+            	                	<option>ENTITY_DELETED</option>
+            	                	<option>ENTITY_INITIALIZED</option>
+            	                	<option>ENTITY_SUSPENDED</option>
+            	                	<option>ENTITY_UPDATED</option>
+            	                	<option>JOB_EXECUTION_FAILURE</option>
+            	                	<option>JOB_EXECUTION_SUCCESS</option>
+            	                	<option>JOB_RETRIES_DECREMENTED</option>
+            	                	<option title="{{'EVENT_TYPE.MEMBERSHIP.CREATED.TOOLTIP' | translate}}">MEMBERSHIP_CREATED</option>
+            	                	<option title="{{'EVENT_TYPE.MEMBERSHIP.DELETED.TOOLTIP' | translate}}">MEMBERSHIP_DELETED</option>
+            	                	<option title="{{'EVENT_TYPE.MEMBERSHIPS.DELETED.TOOLTIP' | translate}}">MEMBERSHIPS_DELETED</option>
+            	                	<option title="{{'EVENT_TYPE.TASK.ASSIGNED.TOOLTIP' | translate}}">TASK_ASSIGNED</option>
+            	                	<option title="{{'EVENT_TYPE.TASK.COMPLETED.TOOLTIP' | translate}}">TASK_COMPLETED</option>
+            	                	<option>TIMER_FIRED</option>
+            	                	<option title="{{'EVENT_TYPE.UNCAUGHT.BPMNERROR.TOOLTIP' | translate}}">UNCAUGHT_BPMN_ERROR</option>
+            	                	<option title="{{'EVENT_TYPE.VARIABLE.CREATED.TOOLTIP' | translate}}">VARIABLE_CREATED</option>
+            	                	<option title="{{'EVENT_TYPE.VARIABLE.DELETED.TOOLTIP' | translate}}">VARIABLE_DELETED</option>
+            	                	<option title="{{'EVENT_TYPE.VARIABLE.UPDATED.TOOLTIP' | translate}}">VARIABLE_UPDATED</option>
+            	               	</select>
+            		            <i ng-if="$index > 0" class="glyphicon glyphicon-minus clickable-property" ng-click="removeEventValue($index)"></i>
+            		            <i class="glyphicon glyphicon-plus clickable-property" ng-click="addEventValue($index)"></i>
+            	            </div>
+            	            <div class="form-group">
+            			   		<label for="classField">{{'PROPERTY.EVENTLISTENERS.RETHROW' | translate}}</label>
+            			   		<input type="checkbox" id="rethrowField" class="form-control" ng-model="selectedListeners[0].rethrowEvent" ng-change="listenerDetailsChanged()" />
+            				</div>
+            	       	</div>
+                     </div>
+                     <div ng-show="selectedListeners.length > 0 && selectedListeners[0].events[0].event" class="col-xs-6">
+                     	<div class="form-group" ng-if="!selectedListeners[0].rethrowEvent">
+            		   		<label for="classField">{{'PROPERTY.EVENTLISTENERS.CLASS' | translate}}</label>
+            		   		<input type="text" id="classField" class="form-control" ng-model="selectedListeners[0].className" ng-change="listenerDetailsChanged()" placeholder="{{'PROPERTY.EVENTLISTENERS.CLASS.PLACEHOLDER' | translate}}" />
+            			</div>
+            			<div class="form-group" ng-if="!selectedListeners[0].rethrowEvent">
+            		   		<label for="delegateExpressionField">{{'PROPERTY.EVENTLISTENERS.DELEGATEEXPRESSION' | translate}}</label>
+            		   		<input type="text" id="delegateExpressionField" class="form-control" ng-model="selectedListeners[0].delegateExpression" ng-change="listenerDetailsChanged()" placeholder="{{'PROPERTY.EVENTLISTENERS.DELEGATEEXPRESSION.PLACEHOLDER' | translate}}" />
+            			</div>
+            			<div class="form-group" ng-if="!selectedListeners[0].rethrowEvent">
+            		   		<label for="entityTypeField">{{'PROPERTY.EVENTLISTENERS.ENTITYTYPE' | translate}}</label>
+            		   		<input type="text" id="entityTypeField" class="form-control" ng-model="selectedListeners[0].entityType" ng-change="listenerDetailsChanged()" placeholder="{{'PROPERTY.EVENTLISTENERS.ENTITYTYPE.PLACEHOLDER' | translate}}" />
+            			</div>
+            			<div class="form-group" ng-if="selectedListeners[0].rethrowEvent">
+            		   		<label for="delegateExpressionField">{{'PROPERTY.EVENTLISTENERS.RETHROWTYPE' | translate}}</label>
+            		   		<select id="rethrowTypeField" class="form-control" ng-model="selectedListeners[0].rethrowType" ng-change="rethrowTypeChanged()">
+                                <option>error</option>
+                                <option>message</option>
+                                <option>signal</option>
+                                <option>globalSignal</option>
+                            </select>
+            			</div>
+            			<div class="form-group" ng-if="selectedListeners[0].rethrowType === 'error'">
+            		   		<label for="errorCodeField">{{'PROPERTY.EVENTLISTENERS.ERRORCODE' | translate}}</label>
+            		   		<input type="text" id="errorCodeField" class="form-control" ng-model="selectedListeners[0].errorcode" ng-change="listenerDetailsChanged()" placeholder="{{'PROPERTY.EVENTLISTENERS.ERRORCODE.PLACEHOLDER' | translate}}" />
+            			</div>
+            			<div class="form-group" ng-if="selectedListeners[0].rethrowType === 'message'">
+            		   		<label for="messageNameField">{{'PROPERTY.EVENTLISTENERS.MESSAGENAME' | translate}}</label>
+            		   		<input type="text" id="messageNameField" class="form-control" ng-model="selectedListeners[0].messagename" ng-change="listenerDetailsChanged()" placeholder="{{'PROPERTY.EVENTLISTENERS.MESSAGENAME.PLACEHOLDER' | translate}}" />
+            			</div>
+            			<div class="form-group" ng-if="selectedListeners[0].rethrowType === 'signal' || selectedListeners[0].rethrowType === 'globalSignal'">
+            		   		<label for="messageNameField">{{'PROPERTY.EVENTLISTENERS.SIGNALNAME' | translate}}</label>
+            		   		<input type="text" id="signalNameField" class="form-control" ng-model="selectedListeners[0].signalname" ng-change="listenerDetailsChanged()" placeholder="{{'PROPERTY.EVENTLISTENERS.SIGNALNAME.PLACEHOLDER' | translate}}" />
+            			</div>
+                     </div>
+                     <div ng-show="selectedListeners.length == 0" class="col-xs-6 muted no-property-selected" translate>PROPERTY.EVENTLISTENERS.UNSELECTED</div>
+                </div>
+            
+            </div>
+            <div class="modal-footer">
+                <button ng-click="cancel()" class="btn btn-primary" translate>ACTION.CANCEL</button>
+                <button ng-click="save()" class="btn btn-primary" translate>ACTION.SAVE</button>
+            </div>
+        </div>
+    </div>
+</div>

+
+<!-- Just need to instantiate the controller, and it will take care of showing the modal dialog -->
+<span ng-controller="KisBpmEventListenersCtrl">
+</span>

+
+<span ng-if="!property.noValue">{{'PROPERTY.EXECUTIONLISTENERS.DISPLAY' | translate:property.value.executionListeners}}</span>
+<span ng-if="property.noValue" translate>PROPERTY.EXECUTIONLISTENERS.EMPTY</span>

+
+<div class="modal" ng-controller="KisBpmExecutionListenersPopupCtrl">
+    <div class="modal-dialog modal-wide">
+        <div class="modal-content">
+            <div class="modal-header">
+                <button type="button" class="close" data-dismiss="modal" aria-hidden="true" ng-click="close()">&times;</button>
+                <h2>{{'PROPERTY.PROPERTY.EDIT.TITLE' | translate:property}}</h2>
+            </div>
+            <div class="modal-body">
+            
+                <div class="row row-no-gutter">
+                    <div class="col-xs-6">
+                        <div ng-if="translationsRetrieved" class="kis-listener-grid" ng-grid="gridOptions"></div>
+                        <div class="pull-right">
+                            <div class="btn-group">
+                                <a class="btn btn-icon btn-lg" rel="tooltip" data-title="{{ACTION.MOVE.UP | translate}}" data-placement="bottom" data-original-title="" title="" ng-click="moveListenerUp()"><i class="glyphicon glyphicon-arrow-up"></i></a>
+                                <a class="btn btn-icon btn-lg" rel="tooltip" data-title="{{ACTION.MOVE.DOWN | translate}}" data-placement="bottom" data-original-title="" title="" ng-click="moveListenerDown()"><i class="glyphicon glyphicon-arrow-down"></i></a>
+                            </div>
+                            <div class="btn-group">
+                                <a class="btn btn-icon btn-lg" rel="tooltip" data-title="{{ACTION.ADD | translate}}" data-placement="bottom" data-original-title="" title="" ng-click="addNewListener()"><i class="glyphicon glyphicon-plus"></i></a>
+                                <a class="btn btn-icon btn-lg" rel="tooltip" data-title="{{ACTION.REMOVE | translate}}" data-placement="bottom" data-original-title="" title="" ng-click="removeListener()"><i class="glyphicon glyphicon-minus"></i></a>
+                            </div>
+                        </div>
+                    </div>
+            
+                    <div class="col-xs-6">
+                        <div ng-show="selectedListeners.length > 0">
+            
+                            <div class="form-group">
+            			   		<label for="eventField">{{'PROPERTY.EXECUTIONLISTENERS.EVENT' | translate}}</label>
+            			   		<select id="eventField" class="form-control" ng-model="selectedListeners[0].event">
+                                    <option>start</option>
+                                    <option>end</option>
+                                    <option>take</option>
+                                </select>
+            				</div>
+            				<div class="form-group">
+            			   		<label for="classField">{{'PROPERTY.EXECUTIONLISTENERS.CLASS' | translate}}</label>
+            			   		<input type="text" id="classField" class="form-control" ng-model="selectedListeners[0].className" ng-change="listenerDetailsChanged()" placeholder="{{'PROPERTY.EXECUTIONLISTENERS.CLASS.PLACEHOLDER' | translate}}" />
+            				</div>
+            				<div class="form-group">
+            			   		<label for="expressionField">{{'PROPERTY.EXECUTIONLISTENERS.EXPRESSION' | translate}}</label>
+            			   		<input type="text" id="expressionField" class="form-control" ng-model="selectedListeners[0].expression" ng-change="listenerDetailsChanged()" placeholder="{{'PROPERTY.EXECUTIONLISTENERS.EXPRESSION.PLACEHOLDER' | translate}}" />
+            				</div>
+            				<div class="form-group">
+            			   		<label for="delegateExpressionField">{{'PROPERTY.EXECUTIONLISTENERS.DELEGATEEXPRESSION' | translate}}</label>
+            			   		<input type="text" id="delegateExpressionField" class="form-control" ng-model="selectedListeners[0].delegateExpression" ng-change="listenerDetailsChanged()" placeholder="{{'PROPERTY.EXECUTIONLISTENERS.DELEGATEEXPRESSION.PLACEHOLDER' | translate}}" />
+            				</div>
+                        </div>
+                        <div ng-show="selectedListeners.length == 0" class="muted no-property-selected" translate>PROPERTY.EXECUTIONLISTENERS.UNSELECTED</div>
+                    </div>
+                </div>
+                
+                <div class="row row-no-gutter">
+                    <div class="col-xs-6">
+                        <div ng-if="translationsRetrieved" class="kis-field-grid" ng-grid="gridFieldOptions"></div>
+                        <div class="pull-right">
+                            <div class="btn-group">
+                                <a class="btn btn-icon btn-lg" rel="tooltip" data-title="{{ACTION.MOVE.UP | translate}}" data-placement="bottom" data-original-title="" title="" ng-click="moveFieldUp()"><i class="glyphicon glyphicon-arrow-up"></i></a>
+                                <a class="btn btn-icon btn-lg" rel="tooltip" data-title="{{ACTION.MOVE.DOWN | translate}}" data-placement="bottom" data-original-title="" title="" ng-click="moveFieldDown()"><i class="glyphicon glyphicon-arrow-down"></i></a>
+                            </div>
+                            <div class="btn-group">
+                                <a class="btn btn-icon btn-lg" rel="tooltip" data-title="{{ACTION.ADD | translate}}" data-placement="bottom" data-original-title="" title="" ng-click="addNewField()"><i class="glyphicon glyphicon-plus"></i></a>
+                                <a class="btn btn-icon btn-lg" rel="tooltip" data-title="{{ACTION.REMOVE | translate}}" data-placement="bottom" data-original-title="" title="" ng-click="removeField()"><i class="glyphicon glyphicon-minus"></i></a>
+                            </div>
+                        </div>
+                    </div>
+            
+                    <div class="col-xs-6">
+                        <div ng-show="selectedFields.length > 0">
+            
+            				<div class="form-group">
+            			   		<label for="nameField">{{'PROPERTY.EXECUTIONLISTENERS.FIELDS.NAME' | translate}}</label>
+            			   		<input type="text" id="nameField" class="form-control" ng-model="selectedFields[0].name" placeholder="{{'PROPERTY.EXECUTIONLISTENERS.FIELDS.NAME.PLACEHOLDER' | translate}}" />
+            				</div>
+                            <div class="form-group">
+            			   		<label for="stringValueField">{{'PROPERTY.EXECUTIONLISTENERS.FIELDS.STRINGVALUE' | translate}}</label>
+            			   		<input type="text" id="stringValueField" class="form-control" ng-model="selectedFields[0].stringValue" ng-change="fieldDetailsChanged()" placeholder="{{'PROPERTY.EXECUTIONLISTENERS.FIELDS.STRINGVALUE.PLACEHOLDER' | translate}}" />
+            				</div>
+            				<div class="form-group">
+            			   		<label for="expressionField">{{'PROPERTY.EXECUTIONLISTENERS.FIELDS.EXPRESSION' | translate}}</label>
+            			   		<input type="text" id="expressionField" class="form-control" ng-model="selectedFields[0].expression" ng-change="fieldDetailsChanged()" placeholder="{{'PROPERTY.EXECUTIONLISTENERS.FIELDS.EXPRESSION.PLACEHOLDER' | translate}}" />
+            				</div>
+            				<div class="form-group">
+            			   		<label for="stringField">{{'PROPERTY.EXECUTIONLISTENERS.FIELDS.STRING' | translate}}</label>
+            			   		<textarea id="stringField" class="form-control" ng-model="selectedFields[0].string" ng-change="fieldDetailsChanged()" placeholder="{{'PROPERTY.EXECUTIONLISTENERS.FIELDS.STRING.PLACEHOLDER' | translate}}"></textarea>
+            				</div>
+                            
+                        </div>
+                        <div ng-show="selectedFields.length == 0" class="muted no-property-selected"translate>PROPERTY.EXECUTIONLISTENERS.FIELDS.EMPTY</div>
+                    </div>
+                </div>
+            
+            </div>
+            <div class="modal-footer">
+                <button ng-click="cancel()" class="btn btn-primary" translate>ACTION.CANCEL</button>
+                <button ng-click="save()" class="btn btn-primary" translate>ACTION.SAVE</button>
+            </div>
+        </div>
+    </div>
+</div>

+
+<!-- Just need to instantiate the controller, and it will take care of showing the modal dialog -->
+<span ng-controller="KisBpmExecutionListenersCtrl">
+</span>

+
+<div class="modal" ng-controller="BpmnFeedbackPopupCtrl">
+    <div class="modal-dialog">
+        <div class="modal-content">
+			<div class="modal-header">
+            	<h2>{{'PROPERTY.FEEDBACK.TITLE' | translate:property}}</h2>
+            </div>
+            <div class="modal-body">
+            	<p><textarea auto-focus class="form-control" ng-model="model.feedback" style="width:90%; height:100%; max-width: 100%; max-height: 100%; min-height: 300px"/></p>
+           	</div>
+           	<div class="modal-footer">
+            	<button ng-click="cancel()" class="btn btn-primary" translate >ACTION.CANCEL</button>
+              	<button ng-click="send()" ng-disabled="model.feedback.length === 0" class="btn btn-primary" translate >ACTION.SEND</button>
+            </div>
+		</div>
+	</div>
+</div>

+
+<span ng-if="!property.noValue">{{'PROPERTY.FIELDS' | translate:property.value.fields}}</span>
+<span ng-if="property.noValue">{{'PROPERTY.FIELDS.EMPTY' | translate}}</span>

+
+<div class="modal" ng-controller="KisBpmFieldsPopupCtrl">
+    <div class="modal-dialog modal-wide">
+        <div class="modal-content">
+			<div class="modal-header">
+			    <button type="button" class="close" data-dismiss="modal" aria-hidden="true" ng-click="close()">&times;</button>
+			    <h3>{{'PROPERTY.PROPERTY.EDIT.TITLE' | translate:property}}</h3>
+			</div>
+			<div class="modal-body">
+
+			    <div class="row row-no-gutter">
+			        <div class="col-xs-6">
+                        <div ng-if="translationsRetrieved" class="kis-listener-grid" ng-grid="gridOptions"></div>
+			            <div class="pull-right">
+			                <div class="btn-group">
+			                    <a href="#" class="btn btn-icon btn-lg" rel="tooltip" data-title="{{'ACTION.MOVE.UP' | translate}}" data-placement="bottom" data-original-title="" title="" ng-click="moveFieldUp()"><i class="glyphicon glyphicon-arrow-up"></i></a>
+			                    <a href="#" class="btn btn-icon btn-lg" rel="tooltip" data-title="{{'ACTION.MOVE.DOWN' | translate}}" data-placement="bottom" data-original-title="" title="" ng-click="moveFieldDown()"><i class="glyphicon glyphicon-arrow-down"></i></a>
+			                </div>
+			                <div class="btn-group">
+			                    <a href="#" class="btn btn-icon btn-lg" rel="tooltip" data-title="{{'ACTION.ADD' | translate}}" data-placement="bottom" data-original-title="" title="" ng-click="addNewField()"><i class="glyphicon glyphicon-plus"></i></a>
+			                    <a href="#" class="btn btn-icon btn-lg" rel="tooltip" data-title="{{'ACTION.REMOVE' | translate}}" data-placement="bottom" data-original-title="" title="" ng-click="removeField()"><i class="glyphicon glyphicon-minus"></i></a>
+			                </div>
+			            </div>
+			        </div>
+
+			       <div class="col-xs-6">
+			            <div ng-show="selectedFields.length > 0">
+
+			                <div class="form-group">
+                                <label for="fieldName">{{'PROPERTY.FIELDS.NAME' | translate}}</label>
+                                <input type="text" id="fieldName"  class="form-control" ng-model="selectedFields[0].name" placeholder="{{'PROPERTY.FIELDS.NAME.PLACEHOLDER' | translate}}" />
+                            </div>
+
+                            <div class="form-group">
+                            <label for="fieldStringValue">{{'PROPERTY.FIELDS.STRINGVALUE' | translate}}</label>
+                                <input type="text" id="fieldStringValue"  class="form-control" ng-model="selectedFields[0].stringValue" ng-change="fieldDetailsChanged()" placeholder="{{'PROPERTY.FIELDS.STRINGVALUE.PLACEHOLDER' | translate}}" />
+                            </div>
+
+                            <div class="form-group">
+                            <label for="fieldExpression">{{'PROPERTY.FIELDS.EXPRESSION' | translate}}</label>
+                                <input type="text" id="fieldExpression"  class="form-control" ng-model="selectedFields[0].expression" ng-change="fieldDetailsChanged()" placeholder="{{'PROPERTY.FIELDS.EXPRESSION.PLACEHOLDER' | translate}}" />
+                            </div>
+
+                            <div class="form-group">
+                            <label for="fieldString">{{'PROPERTY.FIELDS.STRING' | translate}}</label>
+			                        <textarea type="text" id="fieldString"  class="form-control" ng-model="selectedFields[0].string" ng-change="fieldDetailsChanged()" placeholder="{{'PROPERTY.FIELDS.STRING.PLACEHOLDER' | translate}}"></textarea>
+                            </div>
+
+			            </div>
+			            <div ng-show="selectedFields.length == 0" class="muted no-property-selected" translate>PROPERTY.FIELDS.EMPTY</div>
+			        </div>
+			    </div>
+			
+			</div>
+			<div class="modal-footer">
+			    <button ng-click="cancel()" class="btn btn-primary" translate>ACTION.CANCEL</button>
+			    <button ng-click="save()" class="btn btn-primary" translate>ACTION.SAVE</button>
+			</div>
+		</div>
+	</div>
+</div>

+
+<!-- Just need to instantiate the controller, and it will take care of showing the modal dialog -->
+<span ng-controller="KisBpmFieldsCtrl">
+</span>

+
+<span ng-if="!property.noValue">{{'PROPERTY.FORMPROPERTIES.VALUE' | translate:property.value.formProperties}}</span>
+<span ng-if="property.noValue" translate>PROPERTY.FORMPROPERTIES.EMPTY</span>

+
+<div class="modal" ng-controller="KisBpmFormPropertiesPopupCtrl">
+    <div class="modal-dialog modal-wide">
+        <div class="modal-content">
+            <div class="modal-header">
+                <button type="button" class="close" data-dismiss="modal" aria-hidden="true" ng-click="close()">&times;</button>
+                <h2>{{'PROPERTY.PROPERTY.EDIT.TITLE' | translate:property}}</h2>
+            </div>
+            <div class="modal-body">
+            
+                <div class="row row-no-gutter">
+                    <div class="col-xs-6">
+                        <div ng-if="translationsRetrieved" class="default-grid" ng-grid="gridOptions"></div>
+                        <div class="pull-right">
+                            <div class="btn-group">
+                                <a class="btn btn-icon btn-lg" rel="tooltip" data-title="{{'ACTION.MOVE.UP' | translate}}" data-placement="bottom" data-original-title="" title="" ng-click="movePropertyUp()"><i class="glyphicon glyphicon-arrow-up"></i></a>
+                                <a class="btn btn-icon btn-lg" rel="tooltip" data-title="{{'ACTION.MOVE.DOWN' | translate}}" data-placement="bottom" data-original-title="" title="" ng-click="movePropertyDown()"><i class="glyphicon glyphicon-arrow-down"></i></a>
+                            </div>
+                            <div class="btn-group">
+                                <a class="btn btn-icon btn-lg" rel="tooltip" data-title="{{'ACTION.ADD' | translate}}" data-placement="bottom" data-original-title="" title="" ng-click="addNewProperty()"><i class="glyphicon glyphicon-plus"></i></a>
+                                <a class="btn btn-icon btn-lg" rel="tooltip" data-title="{{'ACTION.REMOVE' | translate}}" data-placement="bottom" data-original-title="" title="" ng-click="removeProperty()"><i class="glyphicon glyphicon-minus"></i></a>
+                            </div>
+                        </div>
+                    </div>
+            
+                    <div class="col-xs-6">
+                        <div ng-show="selectedProperties.length > 0">
+            
+                            <div class="form-group">
+            			   		<label for="idField">{{'PROPERTY.FORMPROPERTIES.ID' | translate}}</label>
+            			   		<input id="idField" class="form-control" type="text" ng-model="selectedProperties[0].id" placeholder="{{'PROPERTY.FORMPROPERTIES.ID.PLACEHOLDER' | translate }}" />
+            				</div>
+            				<div class="form-group">
+            			   		<label for="nameField">{{'PROPERTY.FORMPROPERTIES.NAME' | translate}}</label>
+            			   		<input id="nameField" class="form-control" type="text" ng-model="selectedProperties[0].name" placeholder="{{'PROPERTY.FORMPROPERTIES.NAME.PLACEHOLDER' | translate }}" />
+            				</div>
+            				<div class="form-group">
+            			   		<label for="typeField">{{'PROPERTY.FORMPROPERTIES.TYPE' | translate}}</label>
+            			   		<select id="typeField" class="form-control" ng-model="selectedProperties[0].type" ng-change="propertyTypeChanged()">
+                                    <option>string</option>
+                                    <option>long</option>
+                                    <option>boolean</option>
+                                    <option>date</option>
+                                    <option>enum</option>
+                                </select>
+            				</div>
+                           	<div class="form-group" ng-show="selectedProperties[0].datePattern">
+            			   		<label for="datePatternField">{{'PROPERTY.FORMPROPERTIES.DATEPATTERN' | translate}}</label>
+            			   		<input id="datePatternField" class="form-control" type="text" ng-model="selectedProperties[0].datePattern" placeholder="{{'PROPERTY.FORMPROPERTIES.DATEPATTERN.PLACEHOLDER' | translate }}" />
+            				</div>
+                            <div ng-if="selectedProperties[0].type == 'enum'" style="padding-bottom:10px">
+            			   		<div class="row row-no-gutter">
+				                    <div class="col-xs-6">
+				                        <div ng-if="translationsRetrieved" class="kis-listener-grid" ng-grid="enumGridOptions"></div>
+				                        <div class="pull-right">
+				                            <div class="btn-group">
+				                                <a class="btn btn-icon btn-lg" rel="tooltip" data-title="{{ACTION.MOVE.UP | translate}}" data-placement="bottom" data-original-title="" title="" ng-click="moveEnumValueUp()"><i class="glyphicon glyphicon-arrow-up"></i></a>
+				                                <a class="btn btn-icon btn-lg" rel="tooltip" data-title="{{ACTION.MOVE.DOWN | translate}}" data-placement="bottom" data-original-title="" title="" ng-click="moveEnumValueDown()"><i class="glyphicon glyphicon-arrow-down"></i></a>
+				                            </div>
+				                            <div class="btn-group">
+				                                <a class="btn btn-icon btn-lg" rel="tooltip" data-title="{{ACTION.ADD | translate}}" data-placement="bottom" data-original-title="" title="" ng-click="addNewEnumValue()"><i class="glyphicon glyphicon-plus"></i></a>
+				                                <a class="btn btn-icon btn-lg" rel="tooltip" data-title="{{ACTION.REMOVE | translate}}" data-placement="bottom" data-original-title="" title="" ng-click="removeEnumValue()"><i class="glyphicon glyphicon-minus"></i></a>
+				                            </div>
+				                        </div>
+				                    </div>
+				            
+				                    <div class="col-xs-6">
+				                        <div ng-show="selectedEnumValues.length > 0">
+				            
+				                            <div class="form-group">
+				            			   		<label for="classField">{{'PROPERTY.FORMPROPERTIES.VALUES.ID' | translate}}</label>
+				            			   		<input type="text" id="classField" class="form-control" ng-model="selectedEnumValues[0].id" placeholder="{{'PROPERTY.FORMPROPERTIES.VALUES.ID.PLACEHOLDER' | translate}}" />
+				            				</div>
+				            				<div class="form-group">
+				            			   		<label for="classField">{{'PROPERTY.FORMPROPERTIES.VALUES.NAME' | translate}}</label>
+				            			   		<input type="text" id="classField" class="form-control" ng-model="selectedEnumValues[0].name" placeholder="{{'PROPERTY.FORMPROPERTIES.VALUES.NAME.PLACEHOLDER' | translate}}" />
+				            				</div>
+				                        </div>
+				                        <div ng-show="selectedEnumValues.length == 0" class="muted no-property-selected" translate>PROPERTY.FORMPROPERTIES.ENUMVALUES.EMPTY</div>
+				                    </div>
+				                </div>
+            				</div>
+                            <div class="form-group">
+            			   		<label for="expressionField">{{'PROPERTY.FORMPROPERTIES.EXPRESSION' | translate}}</label>
+            			   		<input id="expressionField" class="form-control" type="text" ng-model="selectedProperties[0].expression" placeholder="{{'PROPERTY.FORMPROPERTIES.EXPRESSION.PLACEHOLDER' | translate }}" />
+            				</div>
+            				<div class="form-group">
+            			   		<label for="variableField">{{'PROPERTY.FORMPROPERTIES.VARIABLE' | translate}}</label>
+            			   		<input id="variableField" class="form-control" type="text" ng-model="selectedProperties[0].variable" placeholder="{{'PROPERTY.FORMPROPERTIES.VARIABLE.PLACEHOLDER' | translate }}" />
+            				</div>
+            				<div class="form-inline">
+            					<div class="form-group col-xs-2" >
+            				   		<label for="requiredField">{{'PROPERTY.FORMPROPERTIES.REQUIRED' | translate}}</label>
+            				   		<input id="requiredField" class="form-control" type="checkbox" ng-model="selectedProperties[0].required" />
+            				   	</div>
+            				   	<div class="form-group col-xs-2">
+            				   		<label for="readableField">{{'PROPERTY.FORMPROPERTIES.READABLE' | translate}}</label>
+            				   		<input id="readableField" class="form-control" type="checkbox" ng-model="selectedProperties[0].readable" />
+            					</div>
+            					<div class="form-group col-xs-2">
+            						<label for="writableField">{{'PROPERTY.FORMPROPERTIES.WRITABLE' | translate}}</label>
+            			   			<input id="writableField" class="form-control" type="checkbox" ng-model="selectedProperties[0].writable" />
+            					</div>
+            				</div>
+                        </div>
+                        <div ng-show="selectedProperties.length == 0" class="muted no-property-selected" translate>PROPERTY.FORMPROPERTIES.EMPTY</div>
+                    </div>
+                </div>
+            
+            </div>
+            <div class="modal-footer">
+                <button ng-click="cancel()" class="btn btn-primary" translate>ACTION.CANCEL</button>
+                <button ng-click="save()" class="btn btn-primary" translate>ACTION.SAVE</button>
+            </div>
+        </div>
+    </div>
+</div>

+
+<!-- Just need to instantiate the controller, and it will take care of showing the modal dialog -->
+<span ng-controller="KisBpmFormPropertiesCtrl">
+</span>

+
+<span ng-if="!property.noValue">{{'PROPERTY.INPARAMETERS.VALUE' | translate:property.value.inParameters}}</span>
+<span ng-if="property.noValue" translate>PROPERTY.INPARAMETERS.EMPTY</span>

+
+<div class="modal" ng-controller="KisBpmInParametersPopupCtrl">
+    <div class="modal-dialog modal-wide">
+        <div class="modal-content">
+			<div class="modal-header">
+			    <button type="button" class="close" data-dismiss="modal" aria-hidden="true" ng-click="close()">&times;</button>
+			    <h2>{{'PROPERTY.PROPERTY.EDIT.TITLE' | translate:property}}</h2>
+			</div>
+			<div class="modal-body">
+			
+			    <div class="row row-no-gutter">
+			        <div class="col-xs-6">
+			            <div ng-if="translationsRetrieved" class="kis-listener-grid" ng-grid="gridOptions"></div>
+			            <div class="pull-right">
+			                <div class="btn-group">
+			                    <a class="btn btn-icon btn-lg" rel="tooltip" data-title="{{'ACTION.MOVE.UP' | translate}}" data-placement="bottom" data-original-title="" title="" ng-click="moveParameterUp()"><i class="glyphicon glyphicon-arrow-up"></i></a>
+			                    <a class="btn btn-icon btn-lg" rel="tooltip" data-title="{{'ACTION.MOVE.DOWN' | translate}}" data-placement="bottom" data-original-title="" title="" ng-click="moveParameterDown()"><i class="glyphicon glyphicon-arrow-down"></i></a>
+			                </div>
+			                <div class="btn-group">
+			                    <a class="btn btn-icon btn-lg" rel="tooltip" data-title="{{'ACTION.ADD' | translate:property}}" data-placement="bottom" data-original-title="" title="" ng-click="addNewParameter()"><i class="glyphicon glyphicon-plus"></i></a>
+			                    <a class="btn btn-icon btn-lg" rel="tooltip" data-title="{{'ACTION.REMOVE' | translate:property}}" data-placement="bottom" data-original-title="" title="" ng-click="removeParameter()"><i class="glyphicon glyphicon-minus"></i></a>
+			                </div>
+			            </div>
+			        </div>
+			
+			        <div class="col-xs-6">
+			            <div ng-show="selectedParameters.length > 0">
+							
+							<div class="form-group">
+						   		<label for="sourceField">{{'PROPERTY.PARAMETER.SOURCE' | translate}}</label>
+						   		<input type="text" id="sourceField" class="form-control" ng-model="selectedParameters[0].source" placeholder="{{'PROPERTY.PARAMETER.SOURCE.PLACEHOLDER' | translate}}" />
+							</div>
+							<div class="form-group">
+						   		<label for="expressionField">{{'PROPERTY.PARAMETER.SOURCEEXPRESSION' | translate}}</label>
+						   		<input type="text" id="expressionField" class="form-control" ng-model="selectedParameters[0].sourceExpression" placeholder="{{'PROPERTY.PARAMETER.SOURCEEXPRESSION.PLACEHOLDER' | translate}}" />
+							</div>
+							<div class="form-group">
+						   		<label for="expressionField">{{'PROPERTY.PARAMETER.TARGET' | translate}}</label>
+						   		<input type="text" id="expressionField" class="form-control" ng-model="selectedParameters[0].target" placeholder="{{'PROPERTY.PARAMETER.TARGET.PLACEHOLDER' | translate}}" />
+							</div>
+			                
+			            </div>
+			            <div ng-show="selectedParameters.length == 0" class="muted no-property-selected" translate>PROPERTY.PARAMETER.EMPTY</div>
+			        </div>
+			    </div>
+			</div>
+			<div class="modal-footer">
+			    <button ng-click="cancel()" class="btn btn-primary" translate>ACTION.CANCEL</button>
+			    <button ng-click="save()" class="btn btn-primary" translate>ACTION.SAVE</button>
+			</div>
+		</div>
+	</div>
+</div>

+
+<!-- Just need to instantiate the controller, and it will take care of showing the modal dialog -->
+<span ng-controller="KisBpmInParametersCtrl">
+</span>

+<span ng-if="!property.noValue">{{'PROPERTY.MESSAGEDEFINITIONS.DISPLAY' | translate:property.value}}</span>
+<span ng-if="property.noValue" translate>PROPERTY.MESSAGEDEFINITIONS.EMPTY</span>

+
+<div class="modal" ng-controller="ActivitiMessageDefinitionsPopupCtrl">
+    <div class="modal-dialog modal-wide">
+        <div class="modal-content">
+
+            <div class="modal-header">
+                <button type="button" class="close" data-dismiss="modal" aria-hidden="true" ng-click="close()">&times;</button>
+                <h2>{{'PROPERTY.PROPERTY.EDIT.TITLE' | translate:property}}</h2>
+            </div>
+
+            <div class="modal-body">
+            
+                <div class="row row-no-gutter">
+
+                	<div class="col-xs-8">
+                        <div ng-if="translationsRetrieved" class="kis-listener-grid" ng-grid="gridOptions"></div>
+            	        <div class="pull-right">
+            	            <div class="btn-group">
+            	                <a class="btn btn-icon btn-lg" rel="tooltip" data-title="{{ACTION.ADD | translate}}" data-placement="bottom" data-original-title="" title="" ng-click="addNewMessageDefinition()"><i class="glyphicon glyphicon-plus"></i></a>
+            	                <a class="btn btn-icon btn-lg" rel="tooltip" data-title="{{ACTION.REMOVE | translate}}" data-placement="bottom" data-original-title="" title="" ng-click="removeMessageDefinition()"><i class="glyphicon glyphicon-minus"></i></a>
+            	            </div>
+            	        </div>
+            		</div>
+
+                    <div class="col-xs-4" ng-show="selectedMessages && selectedMessages.length > 0">
+
+                        <div class="form-group">
+                            <label>{{'PROPERTY.MESSAGEDEFINITIONS.ID' | translate}}</label>
+                            <input type="text" class="form-control" ng-model="selectedMessages[0].id">
+                        </div>
+
+                        <div class="form-group">
+                            <label>{{'PROPERTY.MESSAGEDEFINITIONS.NAME' | translate}}</label>
+                            <input type="text" class="form-control" ng-model="selectedMessages[0].name">
+                        </div>
+
+                    </div>
+
+            	</div>
+            	
+            </div>
+
+            <div class="modal-footer">
+                <button ng-click="cancel()" class="btn btn-primary" translate>ACTION.CANCEL</button>
+                <button ng-click="save()" class="btn btn-primary" translate>ACTION.SAVE</button>
+            </div>
+
+        </div>
+    </div>
+</div>

+<!-- Just need to instantiate the controller, and it will take care of showing the modal dialog -->
+<span ng-controller="ActivitiMessageDefinitionsCtrl">
+</span>

+<div ng-controller="ActivitiMessageRefCtrl">
+    <select ng-model="property.value" ng-change="messageChanged()" ng-options="messageDefinition.id as (messageDefinition.name + ' (' + messageDefinition.id + ')') for messageDefinition in messageDefinitions">
+    </select>
+</div>

+
+<div ng-controller="KisBpmMultiInstanceCtrl">
+    <select ng-model="property.value" ng-change="multiInstanceChanged()">
+    	<option>None</option>
+    	<option value="Parallel">并行(Parallel)</option>
+    	<option value="Sequential">顺序(Sequential)</option>
+    </select>
+</div>

+
+<span ng-if="!property.noValue">{{'PROPERTY.OUTPARAMETERS.VALUE' | translate:property.value.outParameters}}</span>
+<span ng-if="property.noValue" translate>PROPERTY.OUTPARAMETERS.EMPTY</span>

+
+<div class="modal" ng-controller="KisBpmOutParametersPopupCtrl">
+    <div class="modal-dialog modal-wide">
+        <div class="modal-content">
+			<div class="modal-header">
+			    <button type="button" class="close" data-dismiss="modal" aria-hidden="true" ng-click="close()">&times;</button>
+			    <h2>{{'PROPERTY.PROPERTY.EDIT.TITLE' | translate:property}}</h2>
+			</div>
+			<div class="modal-body">
+			
+			    <div class="row row-no-gutter">
+			        <div class="col-xs-6">
+			            <div ng-if="translationsRetrieved" class="kis-listener-grid" ng-grid="gridOptions"></div>
+			            <div class="pull-right">
+			                <div class="btn-group">
+			                    <a class="btn btn-icon btn-lg" rel="tooltip" data-title="{{'ACTION.MOVE.UP' | translate}}" data-placement="bottom" data-original-title="" title="" ng-click="moveParameterUp()"><i class="glyphicon glyphicon-arrow-up"></i></a>
+			                    <a class="btn btn-icon btn-lg" rel="tooltip" data-title="{{'ACTION.MOVE.DOWN' | translate}}" data-placement="bottom" data-original-title="" title="" ng-click="moveParameterDown()"><i class="glyphicon glyphicon-arrow-down"></i></a>
+			                </div>
+			                <div class="btn-group">
+			                    <a class="btn btn-icon btn-lg" rel="tooltip" data-title="{{'ACTION.ADD' | translate:property}}" data-placement="bottom" data-original-title="" title="" ng-click="addNewParameter()"><i class="glyphicon glyphicon-plus"></i></a>
+			                    <a class="btn btn-icon btn-lg" rel="tooltip" data-title="{{'ACTION.REMOVE' | translate:property}}" data-placement="bottom" data-original-title="" title="" ng-click="removeParameter()"><i class="glyphicon glyphicon-minus"></i></a>
+			                </div>
+			            </div>
+			        </div>
+			
+			        <div class="col-xs-6">
+			            <div ng-show="selectedParameters.length > 0">
+							
+							<div class="form-group">
+						   		<label for="sourceField">{{'PROPERTY.PARAMETER.SOURCE' | translate}}</label>
+						   		<input type="text" id="sourceField" class="form-control" ng-model="selectedParameters[0].source" placeholder="{{'PROPERTY.PARAMETER.SOURCE.PLACEHOLDER' | translate}}" />
+							</div>
+							<div class="form-group">
+						   		<label for="expressionField">{{'PROPERTY.PARAMETER.SOURCEEXPRESSION' | translate}}</label>
+						   		<input type="text" id="expressionField" class="form-control" ng-model="selectedParameters[0].sourceExpression" placeholder="{{'PROPERTY.PARAMETER.SOURCEEXPRESSION.PLACEHOLDER' | translate}}" />
+							</div>
+							<div class="form-group">
+						   		<label for="expressionField">{{'PROPERTY.PARAMETER.TARGET' | translate}}</label>
+						   		<input type="text" id="expressionField" class="form-control" ng-model="selectedParameters[0].target" placeholder="{{'PROPERTY.PARAMETER.TARGET.PLACEHOLDER' | translate}}" />
+							</div>
+			                
+			            </div>
+			            <div ng-show="selectedParameters.length == 0" class="muted no-property-selected" translate>PROPERTY.PARAMETER.EMPTY</div>
+			        </div>
+			    </div>
+			</div>
+			<div class="modal-footer">
+			    <button ng-click="cancel()" class="btn btn-primary" translate>ACTION.CANCEL</button>
+			    <button ng-click="save()" class="btn btn-primary" translate>ACTION.SAVE</button>
+			</div>
+		</div>
+	</div>
+</div>

+
+<!-- Just need to instantiate the controller, and it will take care of showing the modal dialog -->
+<span ng-controller="KisBpmOutParametersCtrl">
+</span>

+
+<span ng-if="!property.noValue" translate>PROPERTY.SEQUENCEFLOW.ORDER.NOT.EMPTY</span>
+<span ng-if="property.noValue" translate>PROPERTY.SEQUENCEFLOW.ORDER.EMPTY</span>

+
+<div class="modal" ng-controller="KisBpmSequenceFlowOrderPopupCtrl">
+    <div class="modal-dialog">
+        <div class="modal-content">
+			<div class="modal-header">
+			    <button type="button" class="close" data-dismiss="modal" aria-hidden="true" ng-click="close()">&times;</button>
+			    <h3>{{'PROPERTY.PROPERTY.EDIT.TITLE' | translate:property}}</h3>
+			</div>
+			
+			<div class="modal-body">
+			
+			    <div translate>PROPERTY.SEQUENCEFLOW.ORDER.DESCRIPTION</div>
+			    <br/>
+			    <ol>
+			        <li class="sequence-flow-order-element" ng-repeat="sequenceFlow in outgoingSequenceFlow">
+			            {{'PROPERTY.SEQUENCEFLOW.ORDER.SEQUENCEFLOW.VALUE' | translate:sequenceFlow}}
+			            <a class="btn btn-icon btn-sm"
+			               rel="tooltip"
+			               data-title="{{'ACTION.MOVE.UP' | translate}}"
+			               data-placement="bottom"
+			               data-original-title="" title=""
+			               ng-click="moveUp($index)"
+			               ng-if="$index > 0">
+			                 <i class="glyphicon glyphicon-arrow-up"></i>
+			            </a>
+			            <a class="btn btn-icon btn-sm"
+			               rel="tooltip"
+			               data-title="{{'ACTION.MOVE.DOWN' | translate}}"
+			               data-placement="bottom"
+			               data-original-title=""
+			               title=""
+			               ng-click="moveDown($index)"
+			               ng-if="$index < outgoingSequenceFlow.length - 1">
+			                 <i class="glyphicon glyphicon-arrow-down"></i>
+			            </a>
+			        </li>
+			    </ol>
+			
+			
+			</div>
+			<div class="modal-footer">
+			    <button ng-click="cancel()" class="btn btn-primary" translate>ACTION.CANCEL</button>
+			    <button ng-click="save()" class="btn btn-primary" translate>ACTION.SAVE</button>
+			</div>
+		</div>
+	</div>
+</div>

+
+<!-- Just need to instantiate the controller, and it will take care of showing the modal dialog -->
+<span ng-controller="KisBpmSequenceFlowOrderCtrl">
+</span>

+
+<span ng-if="!property.noValue">{{'PROPERTY.SIGNALDEFINITIONS.DISPLAY' | translate:property.value}}</span>
+<span ng-if="property.noValue" translate>PROPERTY.SIGNALDEFINITIONS.EMPTY</span>

+
+<div class="modal" ng-controller="ActivitiSignalDefinitionsPopupCtrl">
+    <div class="modal-dialog modal-wide">
+        <div class="modal-content">
+
+            <div class="modal-header">
+                <button type="button" class="close" data-dismiss="modal" aria-hidden="true" ng-click="close()">&times;</button>
+                <h2>{{'PROPERTY.PROPERTY.EDIT.TITLE' | translate:property}}</h2>
+            </div>
+
+            <div class="modal-body">
+            
+                <div class="row row-no-gutter">
+
+                	<div class="col-xs-8">
+                        <div ng-if="translationsRetrieved" class="kis-listener-grid" ng-grid="gridOptions"></div>
+            	        <div class="pull-right">
+            	            <div class="btn-group">
+            	                <a class="btn btn-icon btn-lg" rel="tooltip" data-title="{{ACTION.ADD | translate}}" data-placement="bottom" data-original-title="" title="" ng-click="addNewSignalDefinition()"><i class="glyphicon glyphicon-plus"></i></a>
+            	                <a class="btn btn-icon btn-lg" rel="tooltip" data-title="{{ACTION.REMOVE | translate}}" data-placement="bottom" data-original-title="" title="" ng-click="removeSignalDefinition()"><i class="glyphicon glyphicon-minus"></i></a>
+            	            </div>
+            	        </div>
+            		</div>
+
+                    <div class="col-xs-4" ng-show="selectedSignals && selectedSignals.length > 0">
+
+                        <div class="form-group">
+                            <label>{{'PROPERTY.SIGNALDEFINITIONS.ID' | translate}}</label>
+                            <input type="text" class="form-control" ng-model="selectedSignals[0].id">
+                        </div>
+
+                        <div class="form-group">
+                            <label>{{'PROPERTY.SIGNALDEFINITIONS.NAME' | translate}}</label>
+                            <input type="text" class="form-control" ng-model="selectedSignals[0].name">
+                        </div>
+
+                        <div class="form-group">
+                            <label>{{'PROPERTY.SIGNALDEFINITIONS.SCOPE' | translate}}</label>
+                            <select class="form-control" ng-model="selectedSignals[0].scope">
+                                <option value="global">{{'PROPERTY.SIGNALDEFINITIONS.SCOPE-GLOBAL' | translate}}</option>
+                                <option value="processInstance">{{'PROPERTY.SIGNALDEFINITIONS.SCOPE-PROCESSINSTANCE' | translate}}</option>
+                            </select>
+                        </div>
+
+                    </div>
+
+            	</div>
+            	
+            </div>
+
+            <div class="modal-footer">
+                <button ng-click="cancel()" class="btn btn-primary" translate>ACTION.CANCEL</button>
+                <button ng-click="save()" class="btn btn-primary" translate>ACTION.SAVE</button>
+            </div>
+
+        </div>
+    </div>
+</div>

+
+<!-- Just need to instantiate the controller, and it will take care of showing the modal dialog -->
+<span ng-controller="ActivitiSignalDefinitionsCtrl">
+</span>

+<div ng-controller="ActivitiSignalRefCtrl">
+    <select ng-model="property.value" ng-change="signalChanged()" ng-options="signalDefinition.id as (signalDefinition.name + ' (' + signalDefinition.id + ')') for signalDefinition in signalDefinitions">
+    </select>
+</div>

+
+<div ng-controller="KisBpmStringPropertyCtrl">
+    <input type="text" ng-model="property.value"
+    	   class="form-control" 
+           auto-focus
+           ng-blur="inputBlurred()"
+           ng-keypress="enterPressed($event)"/>
+</div>

+
+<span ng-if="property.value.name">{{property.value.name}}</span>
+<span ng-if="!property.value || !property.value.name" translate>PROPERTY.SUBPROCESSREFERENCE.EMPTY</span>

+
+<div class="modal" ng-controller="KisBpmCollapsedSubprocessReferencePopupCrtl">
+    <div class="modal-dialog modal-wide">
+        <div class="modal-content">
+			<div class="modal-header">
+			    <button type="button" class="close" data-dismiss="modal" aria-hidden="true" ng-click="close()">&times;</button>
+			    <h2>
+			        {{'PROPERTY.SUBPROCESSREFERENCE.TITLE' | translate}}
+			        <span ng-show="selectedSubProcess != null"> - {{selectedSubProcess.name}}</span>
+			        <span ng-show="selectedSubProcess == null"> - {{'PROPERTY.SUBPROCESSREFERENCE.EMPTY' | translate}}</span> 
+			    
+			    </h2>
+			</div>
+			<div class="modal-body">
+			    <div class="detail-group clearfix">
+                    <div class="col-xs-12">
+			            <div class="alert alert-error" ng-show="(!state.loadingFolders && !state.loadingSubprocesses) && state.subprocessError" translate>PROPERTY.SUBPROCESSREFERENCE.ERROR.SUBPROCESS</div>
+			        </div>
+			    </div>
+			    <div class="detail-group clearfix">
+                    <div class="col-xs-12 editor-item-picker">
+			            <div ng-if="!state.loadingSubprocesses && !state.subprocessError" class="col-xs-4 editor-item-picker-component" ng-repeat="sub in subProcesses" ng-class="{'selected' : sub.id == selectedSubProcess.id}" ng-click="selectSubProcess(sub, $event)">
+			               <div class="controls">
+			                   <input type="checkbox" value="option1" ng-click="selectSubProcess(sub, $event)" ng-checked="sub.id == selectedSubProcess.id" />
+			               </div>
+			               <h4>{{sub.name}}</h4>
+			               <img src="{{config.contextRoot}}/app/rest/models/{{sub.id}}/thumbnail" />
+			             </div>
+			             <div ng-show="state.loadingSubprocesses">
+			               <p class="loading" translate>PROPERTY.SUBPROCESSREFERENCE.SUBPROCESS.LOADING</p>
+			             </div>
+			             <div ng-show="!state.loadingSubprocesses && subProcesses.length == 0">
+			                <p translate>PROPERTY.SUBPROCESSREFERENCE.SUBPROCESS.EMPTY</p>
+			             </div>
+			        </div>
+			    </div>
+			</div>
+			<div class="modal-footer">
+			    <button ng-disabled="state.subprocessError" ng-click="save()" class="btn btn-primary" translate>ACTION.SAVE</button>
+			</div>
+		</div>
+	</div>
+</div>

+
+<!-- Just need to instantiate the controller, and it will take care of showing the modal dialog -->
+<span ng-controller="KisBpmCollapsedSubprocessReferenceCrtl">
+</span>

+
+<span ng-if="!property.noValue">{{'PROPERTY.TASKLISTENERS.VALUE' | translate:property.value.taskListeners}}</span>
+<span ng-if="property.noValue" translate>PROPERTY.TASKLISTENERS.EMPTY</span>

+
+<div class="modal" ng-controller="KisBpmTaskListenersPopupCtrl">
+    <div class="modal-dialog modal-wide">
+        <div class="modal-content">
+			<div class="modal-header">
+			    <button type="button" class="close" data-dismiss="modal" aria-hidden="true" ng-click="close()">&times;</button>
+			    <h2>{{'PROPERTY.PROPERTY.EDIT.TITLE' | translate:property}}</h2>
+			</div>
+			<div class="modal-body">
+			
+			    <div class="row row-no-gutter">
+			        <div class="col-xs-6">
+			            <div ng-if="translationsRetrieved" class="kis-listener-grid" ng-grid="gridOptions"></div>
+			            <div class="pull-right">
+			                <div class="btn-group">
+			                    <a class="btn btn-icon btn-lg" rel="tooltip" data-title="{{ACTION.MOVE.UP | translate}}" data-placement="bottom" data-original-title="" title="" ng-click="moveListenerUp()"><i class="glyphicon glyphicon-arrow-up"></i></a>
+			                    <a class="btn btn-icon btn-lg" rel="tooltip" data-title="{{ACTION.MOVE.DOWN | translate}}" data-placement="bottom" data-original-title="" title="" ng-click="moveListenerDown()"><i class="glyphicon glyphicon-arrow-down"></i></a>
+			                </div>
+			                <div class="btn-group">
+			                    <a class="btn btn-icon btn-lg" rel="tooltip" data-title="{{ACTION.ADD | translate}}" data-placement="bottom" data-original-title="" title="" ng-click="addNewListener()"><i class="glyphicon glyphicon-plus"></i></a>
+			                    <a class="btn btn-icon btn-lg" rel="tooltip" data-title="{{ACTION.REMOVE | translate}}" data-placement="bottom" data-original-title="" title="" ng-click="removeListener()"><i class="glyphicon glyphicon-minus"></i></a>
+			                </div>
+			            </div>
+			        </div>
+			
+			        <div class="col-xs-6">
+			            <div ng-show="selectedListeners.length > 0">
+			
+			                <div class="form-group">
+						   		<label for="eventField">{{'PROPERTY.TASKLISTENERS.EVENT' | translate}}</label>
+						   		<select id="eventField" class="form-control" ng-model="selectedListeners[0].event">
+			                        <option>create</option>
+			                        <option>assignment</option>
+			                        <option>complete</option>
+			                        <option>delete</option>
+			                    </select>
+							</div>
+							<div class="form-group">
+						   		<label for="classField">{{'PROPERTY.TASKLISTENERS.CLASS' | translate}}</label>
+						   		<input type="text" id="classField" class="form-control" ng-model="selectedListeners[0].className" ng-change="listenerDetailsChanged()" placeholder="{{'PROPERTY.TASKLISTENERS.CLASS.PLACEHOLDER' | translate}}" />
+							</div>
+							<div class="form-group">
+						   		<label for="expressionField">{{'PROPERTY.TASKLISTENERS.EXPRESSION' | translate}}</label>
+						   		<input type="text" id="expressionField" class="form-control" ng-model="selectedListeners[0].expression" ng-change="listenerDetailsChanged()" placeholder="{{'PROPERTY.TASKLISTENERS.EXPRESSION.PLACEHOLDER' | translate}}" />
+							</div>
+							<div class="form-group">
+						   		<label for="delegateExpressionField">{{'PROPERTY.TASKLISTENERS.DELEGATEEXPRESSION' | translate}}</label>
+						   		<input type="text" id="delegateExpressionField" class="form-control" ng-model="selectedListeners[0].delegateExpression" ng-change="listenerDetailsChanged()" placeholder="{{'PROPERTY.TASKLISTENERS.DELEGATEEXPRESSION.PLACEHOLDER' | translate}}" />
+							</div>
+			            </div>
+			            <div ng-show="selectedListeners.length == 0" class="muted no-property-selected" translate>PROPERTY.TASKLISTENERS.UNSELECTED</div>
+			        </div>
+			    </div>
+			    
+			    <div class="row row-no-gutter">
+			        <div class="col-xs-6">
+			            <div ng-if="translationsRetrieved" class="kis-field-grid" ng-grid="gridFieldOptions"></div>
+			            <div class="pull-right">
+			                <div class="btn-group">
+			                    <a class="btn btn-icon btn-lg" rel="tooltip" data-title="{{ACTION.MOVE.UP | translate}}" data-placement="bottom" data-original-title="" title="" ng-click="moveFieldUp()"><i class="glyphicon glyphicon-arrow-up"></i></a>
+			                    <a class="btn btn-icon btn-lg" rel="tooltip" data-title="{{ACTION.MOVE.DOWN | translate}}" data-placement="bottom" data-original-title="" title="" ng-click="moveFieldDown()"><i class="glyphicon glyphicon-arrow-down"></i></a>
+			                </div>
+			                <div class="btn-group">
+			                    <a class="btn btn-icon btn-lg" rel="tooltip" data-title="{{ACTION.ADD | translate}}" data-placement="bottom" data-original-title="" title="" ng-click="addNewField()"><i class="glyphicon glyphicon-plus"></i></a>
+			                    <a class="btn btn-icon btn-lg" rel="tooltip" data-title="{{ACTION.REMOVE | translate}}" data-placement="bottom" data-original-title="" title="" ng-click="removeField()"><i class="glyphicon glyphicon-minus"></i></a>
+			                </div>
+			            </div>
+			        </div>
+			
+			        <div class="col-xs-6">
+			            <div ng-show="selectedFields.length > 0">
+			
+							<div class="form-group">
+						   		<label for="nameField">{{'PROPERTY.TASKLISTENERS.FIELDS.NAME' | translate}}</label>
+						   		<input type="text" id="nameField" class="form-control" ng-model="selectedFields[0].name" placeholder="{{'PROPERTY.TASKLISTENERS.FIELDS.NAME.PLACEHOLDER' | translate}}" />
+							</div>
+			                <div class="form-group">
+						   		<label for="stringValueField">{{'PROPERTY.TASKLISTENERS.FIELDS.STRINGVALUE' | translate}}</label>
+						   		<input type="text" id="stringValueField" class="form-control" ng-model="selectedFields[0].stringValue" ng-change="fieldDetailsChanged()" placeholder="{{'PROPERTY.TASKLISTENERS.FIELDS.STRINGVALUE.PLACEHOLDER' | translate}}" />
+							</div>
+							<div class="form-group">
+						   		<label for="expressionField">{{'PROPERTY.TASKLISTENERS.FIELDS.EXPRESSION' | translate}}</label>
+						   		<input type="text" id="expressionField" class="form-control" ng-model="selectedFields[0].expression" ng-change="fieldDetailsChanged()" placeholder="{{'PROPERTY.TASKLISTENERS.FIELDS.EXPRESSION.PLACEHOLDER' | translate}}" />
+							</div>
+							<div class="form-group">
+						   		<label for="stringField">{{'PROPERTY.TASKLISTENERS.FIELDS.STRING' | translate}}</label>
+						   		<textarea id="stringField" class="form-control" ng-model="selectedFields[0].string" ng-change="fieldDetailsChanged()" placeholder="{{'PROPERTY.TASKLISTENERS.FIELDS.STRING.PLACEHOLDER' | translate}}"></textarea>
+							</div>
+			                
+			            </div>
+			            <div ng-show="selectedFields.length == 0" class="muted no-property-selected"translate>PROPERTY.TASKLISTENERS.FIELDS.EMPTY</div>
+			        </div>
+			    </div>
+			
+			</div>
+			<div class="modal-footer">
+			    <button ng-click="cancel()" class="btn btn-primary" translate>ACTION.CANCEL</button>
+			    <button ng-click="save()" class="btn btn-primary" translate>ACTION.SAVE</button>
+			</div>
+		</div>
+	</div>
+</div>

+
+<!-- Just need to instantiate the controller, and it will take care of showing the modal dialog -->
+<span ng-controller="KisBpmTaskListenersCtrl">
+</span>

+
+<div class="modal" ng-controller="KisBpmTextPropertyPopupCtrl">
+    <div class="modal-dialog">
+        <div class="modal-content">
+			<div class="modal-header">
+				<button type="button" class="close" data-dismiss="modal" aria-hidden="true" ng-click="close()">&times;</button>
+			    <h3>{{'PROPERTY.PROPERTY.EDIT.TITLE' | translate:property}}</h3>
+			</div>
+			<div class="modal-body">
+				<p><textarea auto-focus class="form-control" ng-model="property.value" style="width:70%; height:100%; max-width: 100%; max-height: 100%; min-height: 200px"/></p>
+			</div>
+			<div class="modal-footer">
+				<button ng-click="save()" class="btn btn-primary" translate >ACTION.SAVE</button>
+			</div>
+		</div>
+	</div>
+</div>

+
+<!-- Just need to instantiate the controller, and it will take care of showing the modal dialog -->
+<span ng-controller="KisBpmTextPropertyCtrl">
+</span>

+/*
+ * Activiti Modeler component part of the Activiti project
+ * Copyright 2005-2014 Alfresco Software, Ltd. All rights reserved.
+ * 
+ * This library is free software; you can redistribute it and/or
+ * modify it under the terms of the GNU Lesser General Public
+ * License as published by the Free Software Foundation; either
+ * version 2.1 of the License, or (at your option) any later version.
+ *
+ * This library is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
+ * Lesser General Public License for more details.
+
+ * You should have received a copy of the GNU Lesser General Public
+ * License along with this library; if not, write to the Free Software
+ * Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301  USA
+ */

+/*
+ * Activiti Modeler component part of the Activiti project
+ * Copyright 2005-2014 Alfresco Software, Ltd. All rights reserved.
+ * 
+ * This library is free software; you can redistribute it and/or
+ * modify it under the terms of the GNU Lesser General Public
+ * License as published by the Free Software Foundation; either
+ * version 2.1 of the License, or (at your option) any later version.
+ *
+ * This library is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
+ * Lesser General Public License for more details.
+
+ * You should have received a copy of the GNU Lesser General Public
+ * License along with this library; if not, write to the Free Software
+ * Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301  USA
+ */
+'use strict';
+
+var KISBPM = KISBPM || {};
+KISBPM.TOOLBAR = {
+    ACTIONS: {
+
+        saveModel: function (services) {
+
+            var modal = services.$modal({
+                backdrop: true,
+                keyboard: true,
+                template: 'editor-app/popups/save-model.html?version=' + Date.now(),
+                scope: services.$scope
+            });
+        },
+
+        undo: function (services) {
+
+            // Get the last commands
+            var lastCommands = services.$scope.undoStack.pop();
+
+            if (lastCommands) {
+                // Add the commands to the redo stack
+                services.$scope.redoStack.push(lastCommands);
+
+                // Force refresh of selection, might be that the undo command
+                // impacts properties in the selected item
+                if (services.$rootScope && services.$rootScope.forceSelectionRefresh) 
+                {
+                	services.$rootScope.forceSelectionRefresh = true;
+                }
+                
+                // Rollback every command
+                for (var i = lastCommands.length - 1; i >= 0; --i) {
+                    lastCommands[i].rollback();
+                }
+                
+                // Update and refresh the canvas
+                services.$scope.editor.handleEvents({
+                    type: ORYX.CONFIG.EVENT_UNDO_ROLLBACK,
+                    commands: lastCommands
+                });
+                
+                // Update
+                services.$scope.editor.getCanvas().update();
+                services.$scope.editor.updateSelection();
+            }
+            
+            var toggleUndo = false;
+            if (services.$scope.undoStack.length == 0)
+            {
+            	toggleUndo = true;
+            }
+            
+            var toggleRedo = false;
+            if (services.$scope.redoStack.length > 0)
+            {
+            	toggleRedo = true;
+            }
+
+            if (toggleUndo || toggleRedo) {
+                for (var i = 0; i < services.$scope.items.length; i++) {
+                    var item = services.$scope.items[i];
+                    if (toggleUndo && item.action === 'KISBPM.TOOLBAR.ACTIONS.undo') {
+                        services.$scope.safeApply(function () {
+                            item.enabled = false;
+                        });
+                    }
+                    else if (toggleRedo && item.action === 'KISBPM.TOOLBAR.ACTIONS.redo') {
+                        services.$scope.safeApply(function () {
+                            item.enabled = true;
+                        });
+                    }
+                }
+            }
+        },
+
+        redo: function (services) {
+
+            // Get the last commands from the redo stack
+            var lastCommands = services.$scope.redoStack.pop();
+
+            if (lastCommands) {
+                // Add this commands to the undo stack
+                services.$scope.undoStack.push(lastCommands);
+                
+                // Force refresh of selection, might be that the redo command
+                // impacts properties in the selected item
+                if (services.$rootScope && services.$rootScope.forceSelectionRefresh) 
+                {
+                	services.$rootScope.forceSelectionRefresh = true;
+                }
+
+                // Execute those commands
+                lastCommands.each(function (command) {
+                    command.execute();
+                });
+
+                // Update and refresh the canvas
+                services.$scope.editor.handleEvents({
+                    type: ORYX.CONFIG.EVENT_UNDO_EXECUTE,
+                    commands: lastCommands
+                });
+
+                // Update
+                services.$scope.editor.getCanvas().update();
+                services.$scope.editor.updateSelection();
+            }
+
+            var toggleUndo = false;
+            if (services.$scope.undoStack.length > 0) {
+                toggleUndo = true;
+            }
+
+            var toggleRedo = false;
+            if (services.$scope.redoStack.length == 0) {
+                toggleRedo = true;
+            }
+
+            if (toggleUndo || toggleRedo) {
+                for (var i = 0; i < services.$scope.items.length; i++) {
+                    var item = services.$scope.items[i];
+                    if (toggleUndo && item.action === 'KISBPM.TOOLBAR.ACTIONS.undo') {
+                        services.$scope.safeApply(function () {
+                            item.enabled = true;
+                        });
+                    }
+                    else if (toggleRedo && item.action === 'KISBPM.TOOLBAR.ACTIONS.redo') {
+                        services.$scope.safeApply(function () {
+                            item.enabled = false;
+                        });
+                    }
+                }
+            }
+        },
+
+        cut: function (services) {
+            KISBPM.TOOLBAR.ACTIONS._getOryxEditPlugin(services.$scope).editCut();
+            for (var i = 0; i < services.$scope.items.length; i++) {
+                var item = services.$scope.items[i];
+                if (item.action === 'KISBPM.TOOLBAR.ACTIONS.paste') {
+                    services.$scope.safeApply(function () {
+                        item.enabled = true;
+                    });
+                }
+            }
+        },
+
+        copy: function (services) {
+            KISBPM.TOOLBAR.ACTIONS._getOryxEditPlugin(services.$scope).editCopy();
+            for (var i = 0; i < services.$scope.items.length; i++) {
+                var item = services.$scope.items[i];
+                if (item.action === 'KISBPM.TOOLBAR.ACTIONS.paste') {
+                    services.$scope.safeApply(function () {
+                        item.enabled = true;
+                    });
+                }
+            }
+        },
+
+        paste: function (services) {
+            KISBPM.TOOLBAR.ACTIONS._getOryxEditPlugin(services.$scope).editPaste();
+        },
+
+        deleteItem: function (services) {
+            KISBPM.TOOLBAR.ACTIONS._getOryxEditPlugin(services.$scope).editDelete();
+        },
+
+        addBendPoint: function (services) {
+
+            var dockerPlugin = KISBPM.TOOLBAR.ACTIONS._getOryxDockerPlugin(services.$scope);
+
+            var enableAdd = !dockerPlugin.enabledAdd();
+            dockerPlugin.setEnableAdd(enableAdd);
+            if (enableAdd)
+            {
+            	dockerPlugin.setEnableRemove(false);
+            	document.body.style.cursor = 'pointer';
+            }
+            else
+            {
+            	document.body.style.cursor = 'default';
+            }
+        },
+
+        removeBendPoint: function (services) {
+
+            var dockerPlugin = KISBPM.TOOLBAR.ACTIONS._getOryxDockerPlugin(services.$scope);
+
+            var enableRemove = !dockerPlugin.enabledRemove();
+            dockerPlugin.setEnableRemove(enableRemove);
+            if (enableRemove)
+            {
+            	dockerPlugin.setEnableAdd(false);
+            	document.body.style.cursor = 'pointer';
+            }
+            else
+            {
+            	document.body.style.cursor = 'default';
+            }
+        },
+
+        /**
+         * Helper method: fetches the Oryx Edit plugin from the provided scope,
+         * if not on the scope, it is created and put on the scope for further use.
+         *
+         * It's important to reuse the same EditPlugin while the same scope is active,
+         * as the clipboard is stored for the whole lifetime of the scope.
+         */
+        _getOryxEditPlugin: function ($scope) {
+            if ($scope.oryxEditPlugin === undefined || $scope.oryxEditPlugin === null) {
+                $scope.oryxEditPlugin = new ORYX.Plugins.Edit($scope.editor);
+            }
+            return $scope.oryxEditPlugin;
+        },
+
+        zoomIn: function (services) {
+            KISBPM.TOOLBAR.ACTIONS._getOryxViewPlugin(services.$scope).zoom([1.0 + ORYX.CONFIG.ZOOM_OFFSET]);
+        },
+
+        zoomOut: function (services) {
+            KISBPM.TOOLBAR.ACTIONS._getOryxViewPlugin(services.$scope).zoom([1.0 - ORYX.CONFIG.ZOOM_OFFSET]);
+        },
+        
+        zoomActual: function (services) {
+            KISBPM.TOOLBAR.ACTIONS._getOryxViewPlugin(services.$scope).setAFixZoomLevel(1);
+        },
+        
+        zoomFit: function (services) {
+        	KISBPM.TOOLBAR.ACTIONS._getOryxViewPlugin(services.$scope).zoomFitToModel();
+        },
+        
+        alignVertical: function (services) {
+        	KISBPM.TOOLBAR.ACTIONS._getOryxArrangmentPlugin(services.$scope).alignShapes([ORYX.CONFIG.EDITOR_ALIGN_MIDDLE]);
+        },
+        
+        alignHorizontal: function (services) {
+        	KISBPM.TOOLBAR.ACTIONS._getOryxArrangmentPlugin(services.$scope).alignShapes([ORYX.CONFIG.EDITOR_ALIGN_CENTER]);
+        },
+        
+        sameSize: function (services) {
+        	KISBPM.TOOLBAR.ACTIONS._getOryxArrangmentPlugin(services.$scope).alignShapes([ORYX.CONFIG.EDITOR_ALIGN_SIZE]);
+        },
+        
+        closeEditor: function(services) {
+        	//window.location.href = "./";
+        	if(window.confirm('请确认数据是否已经保存，确定要关闭编辑器吗？'))
+			window.close();//add by cheshuyan at 2016.05.21
+        },
+        
+        /**
+         * Helper method: fetches the Oryx View plugin from the provided scope,
+         * if not on the scope, it is created and put on the scope for further use.
+         */
+        _getOryxViewPlugin: function ($scope) {
+            if ($scope.oryxViewPlugin === undefined || $scope.oryxViewPlugin === null) {
+                $scope.oryxViewPlugin = new ORYX.Plugins.View($scope.editor);
+            }
+            return $scope.oryxViewPlugin;
+        },
+        
+        _getOryxArrangmentPlugin: function ($scope) {
+            if ($scope.oryxArrangmentPlugin === undefined || $scope.oryxArrangmentPlugin === null) {
+                $scope.oryxArrangmentPlugin = new ORYX.Plugins.Arrangement($scope.editor);
+            }
+            return $scope.oryxArrangmentPlugin;
+        },
+
+        _getOryxDockerPlugin: function ($scope) {
+            if ($scope.oryxDockerPlugin === undefined || $scope.oryxDockerPlugin === null) {
+                $scope.oryxDockerPlugin = new ORYX.Plugins.AddDocker($scope.editor);
+            }
+            return $scope.oryxDockerPlugin;
+        }
+    }
+};
+
+/** Custom controller for the save dialog */
+var SaveModelCtrl = [ '$rootScope', '$scope', '$http', '$route', '$location',
+    function ($rootScope, $scope, $http, $route, $location) {
+
+    var modelMetaData = $scope.editor.getModelMetaData();
+
+    var description = '';
+    if (modelMetaData.description) {
+    	description = modelMetaData.description;
+    }
+    
+    var saveDialog = { 'name' : modelMetaData.name,
+            'description' : description};
+    
+    $scope.saveDialog = saveDialog;
+    
+    var json = $scope.editor.getJSON();
+    json = JSON.stringify(json);
+
+    var params = {
+        modeltype: modelMetaData.model.modelType,
+        json_xml: json,
+        name: 'model'
+    };
+
+    $scope.status = {
+        loading: false
+    };
+
+    $scope.close = function () {
+    	$scope.$hide();
+    };
+
+    $scope.saveAndClose = function () {
+    	$scope.save(function() {
+    		//window.location.href = "./";
+    		if(window.confirm('请确认数据是否已经保存，确定要关闭编辑器吗？'))
+    			window.close();//add by cheshuyan at 2016.05.21
+    	});
+    };
+    $scope.save = function (successCallback) {
+
+        if (!$scope.saveDialog.name || $scope.saveDialog.name.length == 0) {
+            return;
+        }
+
+        // Indicator spinner image
+        $scope.status = {
+        	loading: true
+        };
+        
+        modelMetaData.name = $scope.saveDialog.name;
+        modelMetaData.description = $scope.saveDialog.description;
+
+        var json = $scope.editor.getJSON();
+        json = JSON.stringify(json);
+        
+        var selection = $scope.editor.getSelection();
+        $scope.editor.setSelection([]);
+        
+        // Get the serialized svg image source
+        var svgClone = $scope.editor.getCanvas().getSVGRepresentation(true);
+        $scope.editor.setSelection(selection);
+        if ($scope.editor.getCanvas().properties["oryx-showstripableelements"] === false) {
+            var stripOutArray = jQuery(svgClone).find(".stripable-element");
+            for (var i = stripOutArray.length - 1; i >= 0; i--) {
+            	stripOutArray[i].remove();
+            }
+        }
+
+        // Remove all forced stripable elements
+        var stripOutArray = jQuery(svgClone).find(".stripable-element-force");
+        for (var i = stripOutArray.length - 1; i >= 0; i--) {
+            stripOutArray[i].remove();
+        }
+
+        // Parse dom to string
+        var svgDOM = DataManager.serialize(svgClone);
+
+        var params = {
+            json_xml: json,
+            svg_xml: svgDOM,
+            name: $scope.saveDialog.name,
+            description: $scope.saveDialog.description
+        };
+
+        // Update
+        $http({    method: 'PUT',
+            data: params,
+            ignoreErrors: true,
+            headers: {'Accept': 'application/json',
+                      'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'},
+            transformRequest: function (obj) {
+                var str = [];
+                for (var p in obj) {
+                    str.push(encodeURIComponent(p) + "=" + encodeURIComponent(obj[p]));
+                }
+                return str.join("&");
+            },
+            url: KISBPM.URL.putModel(modelMetaData.modelId)})
+
+            .success(function (data, status, headers, config) {
+                $scope.editor.handleEvents({
+                    type: ORYX.CONFIG.EVENT_SAVED
+                });
+                $scope.modelData.name = $scope.saveDialog.name;
+                $scope.modelData.lastUpdated = data.lastUpdated;
+                
+                $scope.status.loading = false;
+                $scope.$hide();
+
+                // Fire event to all who is listening
+                var saveEvent = {
+                    type: KISBPM.eventBus.EVENT_TYPE_MODEL_SAVED,
+                    model: params,
+                    modelId: modelMetaData.modelId,
+		            eventType: 'update-model'
+                };
+                KISBPM.eventBus.dispatch(KISBPM.eventBus.EVENT_TYPE_MODEL_SAVED, saveEvent);
+
+                // Reset state
+                $scope.error = undefined;
+                $scope.status.loading = false;
+
+                // Execute any callback
+                if (successCallback) {
+                    successCallback();
+                }
+
+            })
+            .error(function (data, status, headers, config) {
+                $scope.error = {};
+                console.log('Something went wrong when updating the process model:' + JSON.stringify(data));
+                $scope.status.loading = false;
+            });
+    };
+
+}];