You can not select more than 25 topics
			Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
		
		
		
		
		
			
		
			
				
					
					
						
							325 lines
						
					
					
						
							13 KiB
						
					
					
				
			
		
		
		
			
			
			
				
					
				
				
					
				
			
		
		
	
	
							325 lines
						
					
					
						
							13 KiB
						
					
					
				
								/* Licensed under the Apache License, Version 2.0 (the "License");
							 | 
						|
								 * you may not use this file except in compliance with the License.
							 | 
						|
								 * You may obtain a copy of the License at
							 | 
						|
								 *
							 | 
						|
								 *      http://www.apache.org/licenses/LICENSE-2.0
							 | 
						|
								 *
							 | 
						|
								 * Unless required by applicable law or agreed to in writing, software
							 | 
						|
								 * distributed under the License is distributed on an "AS IS" BASIS,
							 | 
						|
								 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
							 | 
						|
								 * See the License for the specific language governing permissions and
							 | 
						|
								 * limitations under the License.
							 | 
						|
								 */
							 | 
						|
								angular.module('flowableModeler')
							 | 
						|
								  .controller('AppDefinitionBuilderController', ['$rootScope', '$scope', '$translate', '$http', '$location', '$routeParams', '$modal', '$popover', '$timeout', 
							 | 
						|
								                              function ($rootScope, $scope, $translate, $http, $location, $routeParams, $modal, $popover, $timeout) {
							 | 
						|
								
							 | 
						|
								    // Main page (needed for visual indicator of current page)
							 | 
						|
								    $rootScope.setMainPageById('apps');
							 | 
						|
								    
							 | 
						|
								    // Initialize model
							 | 
						|
								    $scope.model = {
							 | 
						|
								        // Store the main model id, this points to the current version of a model,
							 | 
						|
								        // even when we're showing history
							 | 
						|
								        latestModelId: $routeParams.modelId
							 | 
						|
								    };
							 | 
						|
								    
							 | 
						|
								    $scope.appBuilder = {
							 | 
						|
								        activeTab: 'bpmn'
							 | 
						|
								    };
							 | 
						|
								    
							 | 
						|
								    $scope.tabs = [
							 | 
						|
								        {
							 | 
						|
								            id: 'bpmn',
							 | 
						|
								            title: 'BPMN models'
							 | 
						|
								        },
							 | 
						|
								        {
							 | 
						|
								            id: 'cmmn',
							 | 
						|
								            title: 'CMMN models'
							 | 
						|
								        }
							 | 
						|
								    ];
							 | 
						|
								    
							 | 
						|
								    $scope.loadApp = function() {
							 | 
						|
								    	$http({method: 'GET', url: FLOWABLE.APP_URL.getAppDefinitionUrl($routeParams.modelId)}).
							 | 
						|
								        	success(function(data, status, headers, config) {
							 | 
						|
								        	    $rootScope.currentAppDefinition = data;
							 | 
						|
								        	    if (!$rootScope.currentAppDefinition.definition.theme) {
							 | 
						|
								        	        $rootScope.currentAppDefinition.definition.theme = 'theme-1';
							 | 
						|
								        	    }
							 | 
						|
								                if (!$rootScope.currentAppDefinition.definition.icon) {
							 | 
						|
								                    $rootScope.currentAppDefinition.definition.icon = 'glyphicon-asterisk';
							 | 
						|
								                }
							 | 
						|
								
							 | 
						|
								        	}).error(function(data, status, headers, config) {
							 | 
						|
								        		console.log("Error loading model");
							 | 
						|
								        	});
							 | 
						|
								    };
							 | 
						|
								
							 | 
						|
								    // Cleanup app definition on rootscope when scope is destroyed
							 | 
						|
								    $scope.$on('$destroy', function() {
							 | 
						|
								        $rootScope.currentAppDefinition = undefined;
							 | 
						|
								    });
							 | 
						|
								    
							 | 
						|
								    $scope.editIncludedModels = function() {
							 | 
						|
								        _internalCreateModal({
							 | 
						|
								            template: 'views/popup/app-definition-models-included.html?version=' + Date.now(),
							 | 
						|
								            scope: $scope
							 | 
						|
								        }, $modal, $scope);
							 | 
						|
								    };
							 | 
						|
								
							 | 
						|
								    $scope.availableIcons = [
							 | 
						|
								        'glyphicon-asterisk', 'glyphicon-plus',
							 | 
						|
								        'glyphicon-euro', 'glyphicon-cloud', 'glyphicon-envelope',
							 | 
						|
								        'glyphicon-pencil', 'glyphicon-glass', 'glyphicon-music',
							 | 
						|
								        'glyphicon-search', 'glyphicon-heart', 'glyphicon-star',
							 | 
						|
								        'glyphicon-star-empty', 'glyphicon-user', 'glyphicon-film',
							 | 
						|
								        'glyphicon-th-large', 'glyphicon-th', 'glyphicon-th-list',
							 | 
						|
								        'glyphicon-ok', 'glyphicon-remove', 'glyphicon-zoom-in',
							 | 
						|
								        'glyphicon-zoom-out', 'glyphicon-off', 'glyphicon-signal',
							 | 
						|
								        'glyphicon-cog', 'glyphicon-trash', 'glyphicon-home',
							 | 
						|
								        'glyphicon-file', 'glyphicon-time', 'glyphicon-road',
							 | 
						|
								        'glyphicon-download-alt', 'glyphicon-download',
							 | 
						|
								        'glyphicon-upload', 'glyphicon-inbox', 'glyphicon-play-circle',
							 | 
						|
								        'glyphicon-repeat', 'glyphicon-refresh', 'glyphicon-list-alt',
							 | 
						|
								        'glyphicon-lock', 'glyphicon-flag', 'glyphicon-headphones',
							 | 
						|
								        'glyphicon-volume-up', 'glyphicon-tag', 'glyphicon-tags',
							 | 
						|
								        'glyphicon-book', 'glyphicon-bookmark', 'glyphicon-print',
							 | 
						|
								        'glyphicon-camera', 'glyphicon-list', 'glyphicon-facetime-video',
							 | 
						|
								        'glyphicon-picture', 'glyphicon-map-marker', 'glyphicon-adjust',
							 | 
						|
								        'glyphicon-tint', 'glyphicon-edit', 'glyphicon-share',
							 | 
						|
								        'glyphicon-check', 'glyphicon-move', 'glyphicon-play',
							 | 
						|
								        'glyphicon-eject', 'glyphicon-plus-sign', 'glyphicon-minus-sign',
							 | 
						|
								        'glyphicon-remove-sign', 'glyphicon-ok-sign',
							 | 
						|
								        'glyphicon-question-sign', 'glyphicon-info-sign',
							 | 
						|
								        'glyphicon-screenshot', 'glyphicon-remove-circle',
							 | 
						|
								        'glyphicon-ok-circle', 'glyphicon-ban-circle',
							 | 
						|
								        'glyphicon-share-alt', 'glyphicon-exclamation-sign',
							 | 
						|
								        'glyphicon-gift', 'glyphicon-leaf', 'glyphicon-fire',
							 | 
						|
								        'glyphicon-eye-open', 'glyphicon-eye-close',
							 | 
						|
								        'glyphicon-warning-sign', 'glyphicon-plane',
							 | 
						|
								        'glyphicon-calendar', 'glyphicon-random', 'glyphicon-comment',
							 | 
						|
								        'glyphicon-magnet', 'glyphicon-retweet',
							 | 
						|
								        'glyphicon-shopping-cart', 'glyphicon-folder-close',
							 | 
						|
								        'glyphicon-folder-open', 'glyphicon-hdd', 'glyphicon-bullhorn',
							 | 
						|
								        'glyphicon-bell', 'glyphicon-certificate', 'glyphicon-thumbs-up',
							 | 
						|
								        'glyphicon-thumbs-down', 'glyphicon-hand-left',
							 | 
						|
								        'glyphicon-globe', 'glyphicon-wrench', 'glyphicon-tasks',
							 | 
						|
								        'glyphicon-filter', 'glyphicon-briefcase', 'glyphicon-dashboard',
							 | 
						|
								        'glyphicon-paperclip', 'glyphicon-heart-empty', 'glyphicon-link',
							 | 
						|
								        'glyphicon-phone', 'glyphicon-pushpin', 'glyphicon-usd',
							 | 
						|
								        'glyphicon-gbp', 'glyphicon-sort', 'glyphicon-flash',
							 | 
						|
								        'glyphicon-record', 'glyphicon-save', 'glyphicon-open',
							 | 
						|
								        'glyphicon-saved', 'glyphicon-send', 'glyphicon-floppy-disk',
							 | 
						|
								        'glyphicon-credit-card', 'glyphicon-cutlery',
							 | 
						|
								        'glyphicon-earphone', 'glyphicon-phone-alt', 'glyphicon-tower',
							 | 
						|
								        'glyphicon-stats', 'glyphicon-cloud-download',
							 | 
						|
								        'glyphicon-cloud-upload', 'glyphicon-tree-conifer',
							 | 
						|
								        'glyphicon-tree-deciduous' 
							 | 
						|
								    ];
							 | 
						|
								    
							 | 
						|
								    // TODO: add themes and perhaps have colors inside JS instead of different css-classes for each theme
							 | 
						|
								    $scope.availableThemes = [
							 | 
						|
								        'theme-1', 'theme-2', 'theme-3',
							 | 
						|
								        'theme-4', 'theme-5', 'theme-6',
							 | 
						|
								        'theme-7', 'theme-8', 'theme-9',
							 | 
						|
								        'theme-10'
							 | 
						|
								    ];
							 | 
						|
								    
							 | 
						|
								    $scope.changeIcon = function($event) {
							 | 
						|
								      if (!$scope.changeIconState) {
							 | 
						|
								        var state = {};
							 | 
						|
								        $scope.changeIconState = state;
							 | 
						|
								        
							 | 
						|
								        // Create popover
							 | 
						|
								        state.popover = $popover(angular.element($event.currentTarget), {
							 | 
						|
								          template: 'views/popover/select-app-icon.html',
							 | 
						|
								          placement: 'bottom-left',
							 | 
						|
								          show: true,
							 | 
						|
								          scope: $scope
							 | 
						|
								        });
							 | 
						|
								        
							 | 
						|
								        var destroy = function() {
							 | 
						|
								          state.popover.destroy();
							 | 
						|
								          delete $scope.changeIconState;
							 | 
						|
								        };
							 | 
						|
								        
							 | 
						|
								        // When popup is hidden or scope is destroyed, hide popup
							 | 
						|
								        state.popover.$scope.$on('tooltip.hide', destroy);
							 | 
						|
								        $scope.$on('$destroy', destroy);
							 | 
						|
								      }
							 | 
						|
								    };
							 | 
						|
								    
							 | 
						|
								    $scope.selectIcon = function(icon) {
							 | 
						|
								        $rootScope.currentAppDefinition.definition.icon = icon;
							 | 
						|
								    };
							 | 
						|
								    
							 | 
						|
								    $scope.changeTheme = function($event) {
							 | 
						|
								      if(!$scope.changeThemeState) {
							 | 
						|
								        var state = {};
							 | 
						|
								        $scope.changeThemeState = state;
							 | 
						|
								        
							 | 
						|
								        // Create popover
							 | 
						|
								        state.popover = $popover(angular.element($event.currentTarget), {
							 | 
						|
								          template: 'views/popover/select-app-theme.html',
							 | 
						|
								          placement: 'bottom-left',
							 | 
						|
								          show: true,
							 | 
						|
								          scope: $scope
							 | 
						|
								        });
							 | 
						|
								        
							 | 
						|
								        var destroy = function() {
							 | 
						|
								          state.popover.destroy();
							 | 
						|
								          delete $scope.changeThemeState;
							 | 
						|
								        };
							 | 
						|
								        
							 | 
						|
								        // When popup is hidden or scope is destroyed, hide popup
							 | 
						|
								        state.popover.$scope.$on('tooltip.hide', destroy);
							 | 
						|
								        $scope.$on('$destroy', destroy);
							 | 
						|
								      }
							 | 
						|
								    };
							 | 
						|
								    
							 | 
						|
								    $scope.selectTheme = function(theme) {
							 | 
						|
								        $rootScope.currentAppDefinition.definition.theme = theme;
							 | 
						|
								    };
							 | 
						|
								    
							 | 
						|
								    $scope.loadApp();
							 | 
						|
								}]);
							 | 
						|
								
							 | 
						|
								angular.module('flowableModeler')
							 | 
						|
								.controller('ModelsIncludedPopupCtrl', ['$rootScope', '$scope', '$translate', '$http', '$timeout', '$location', function ($rootScope, $scope, $translate, $http, $timeout, $location) {
							 | 
						|
								
							 | 
						|
								    $scope.popup = {
							 | 
						|
								        loading: false,
							 | 
						|
								        selectedModels: [],
							 | 
						|
								        selectedCmmnModels: [],
							 | 
						|
								        activeTab: 'bpmn'
							 | 
						|
								    };
							 | 
						|
								    
							 | 
						|
								    if ($rootScope.currentAppDefinition.definition.models) {
							 | 
						|
								        for (var i = 0; i < $rootScope.currentAppDefinition.definition.models.length; i++) {
							 | 
						|
								            $scope.popup.selectedModels.push($rootScope.currentAppDefinition.definition.models[i].id);
							 | 
						|
								        }
							 | 
						|
								    }
							 | 
						|
								    
							 | 
						|
								    if ($rootScope.currentAppDefinition.definition.cmmnModels) {
							 | 
						|
								        for (var i = 0; i < $rootScope.currentAppDefinition.definition.cmmnModels.length; i++) {
							 | 
						|
								            $scope.popup.selectedCmmnModels.push($rootScope.currentAppDefinition.definition.cmmnModels[i].id);
							 | 
						|
								        }
							 | 
						|
								    }
							 | 
						|
								    
							 | 
						|
								    $scope.tabs = [
							 | 
						|
								        {
							 | 
						|
								            id: 'bpmn',
							 | 
						|
								            title: 'BPMN models'
							 | 
						|
								        },
							 | 
						|
								        {
							 | 
						|
								            id: 'cmmn',
							 | 
						|
								            title: 'CMMN models'
							 | 
						|
								        }
							 | 
						|
								    ];
							 | 
						|
								    
							 | 
						|
								    $scope.loadModels = function() {
							 | 
						|
								        $scope.popup.loading = true;
							 | 
						|
								        
							 | 
						|
								        $http({method: 'GET', url: FLOWABLE.APP_URL.getModelsForAppDefinitionUrl()}).
							 | 
						|
								          success(function(data, status, headers, config) {
							 | 
						|
								              $scope.popup.models = data;
							 | 
						|
								              $scope.popup.loading = false;
							 | 
						|
								          }).
							 | 
						|
								          error(function(data, status, headers, config) {
							 | 
						|
								             $scope.popup.loading = false;
							 | 
						|
								          });
							 | 
						|
								          
							 | 
						|
								        $http({method: 'GET', url: FLOWABLE.APP_URL.getCmmnModelsForAppDefinitionUrl()}).
							 | 
						|
								          success(function(data, status, headers, config) {
							 | 
						|
								              $scope.popup.cmmnModels = data;
							 | 
						|
								              $scope.popup.loading = false;
							 | 
						|
								          }).
							 | 
						|
								          error(function(data, status, headers, config) {
							 | 
						|
								             $scope.popup.loading = false;
							 | 
						|
								          });
							 | 
						|
								    };
							 | 
						|
								    
							 | 
						|
								    $scope.selectModel = function(model) {
							 | 
						|
								        var index = $scope.popup.selectedModels.indexOf(model.id);
							 | 
						|
								        if (index >= 0) {
							 | 
						|
								            $scope.popup.selectedModels.splice(index, 1);
							 | 
						|
								        } else {
							 | 
						|
								            $scope.popup.selectedModels.push(model.id);
							 | 
						|
								        }
							 | 
						|
								        
							 | 
						|
								        var modelArray = [];
							 | 
						|
								        for (var i = 0; i < $scope.popup.models.data.length; i++) {
							 | 
						|
								            if ($scope.popup.selectedModels.indexOf($scope.popup.models.data[i].id) >= 0) {
							 | 
						|
								                var selectedModel = $scope.popup.models.data[i];
							 | 
						|
								                var summaryModel = {
							 | 
						|
								                    id: selectedModel.id,
							 | 
						|
								                    name: selectedModel.name,
							 | 
						|
								                    version: selectedModel.version,
							 | 
						|
								                    modelType: selectedModel.modelType,
							 | 
						|
								                    description: selectedModel.description,
							 | 
						|
								                    stencilSetId: selectedModel.stencilSet,
							 | 
						|
								                    createdByFullName: selectedModel.createdByFullName,
							 | 
						|
								                    createdBy: selectedModel.createdBy,
							 | 
						|
								                    lastUpdatedByFullName: selectedModel.lastUpdatedByFullName,
							 | 
						|
								                    lastUpdatedBy: selectedModel.lastUpdatedBy,
							 | 
						|
								                    lastUpdated: selectedModel.lastUpdated
							 | 
						|
								                };
							 | 
						|
								                modelArray.push(summaryModel);
							 | 
						|
								            }
							 | 
						|
								        }
							 | 
						|
								        $rootScope.currentAppDefinition.definition.models = modelArray;
							 | 
						|
								    };
							 | 
						|
								    
							 | 
						|
								    $scope.selectCmmnModel = function(model) {
							 | 
						|
								        var index = $scope.popup.selectedCmmnModels.indexOf(model.id);
							 | 
						|
								        if (index >= 0) {
							 | 
						|
								            $scope.popup.selectedCmmnModels.splice(index, 1);
							 | 
						|
								        } else {
							 | 
						|
								            $scope.popup.selectedCmmnModels.push(model.id);
							 | 
						|
								        }
							 | 
						|
								        
							 | 
						|
								        var modelArray = [];
							 | 
						|
								        for (var i = 0; i < $scope.popup.cmmnModels.data.length; i++) {
							 | 
						|
								            if ($scope.popup.selectedCmmnModels.indexOf($scope.popup.cmmnModels.data[i].id) >= 0) {
							 | 
						|
								                var selectedModel = $scope.popup.cmmnModels.data[i];
							 | 
						|
								                var summaryModel = {
							 | 
						|
								                    id: selectedModel.id,
							 | 
						|
								                    name: selectedModel.name,
							 | 
						|
								                    version: selectedModel.version,
							 | 
						|
								                    modelType: selectedModel.modelType,
							 | 
						|
								                    description: selectedModel.description,
							 | 
						|
								                    stencilSetId: selectedModel.stencilSet,
							 | 
						|
								                    createdByFullName: selectedModel.createdByFullName,
							 | 
						|
								                    createdBy: selectedModel.createdBy,
							 | 
						|
								                    lastUpdatedByFullName: selectedModel.lastUpdatedByFullName,
							 | 
						|
								                    lastUpdatedBy: selectedModel.lastUpdatedBy,
							 | 
						|
								                    lastUpdated: selectedModel.lastUpdated
							 | 
						|
								                };
							 | 
						|
								                modelArray.push(summaryModel);
							 | 
						|
								            }
							 | 
						|
								        }
							 | 
						|
								        $rootScope.currentAppDefinition.definition.cmmnModels = modelArray;
							 | 
						|
								    };
							 | 
						|
								    
							 | 
						|
								    $scope.isModelSelected = function(model) {
							 | 
						|
								        if ($scope.popup.selectedModels.indexOf(model.id) >= 0) {
							 | 
						|
								            return true;
							 | 
						|
								        } else {
							 | 
						|
								            return false;
							 | 
						|
								        }
							 | 
						|
								    };
							 | 
						|
								    
							 | 
						|
								    $scope.isCmmnModelSelected = function(model) {
							 | 
						|
								        if ($scope.popup.selectedCmmnModels.indexOf(model.id) >= 0) {
							 | 
						|
								            return true;
							 | 
						|
								        } else {
							 | 
						|
								            return false;
							 | 
						|
								        }
							 | 
						|
								    };
							 | 
						|
								    
							 | 
						|
								    $scope.close = function() {
							 | 
						|
								        $scope.$hide();
							 | 
						|
								    };
							 | 
						|
								    
							 | 
						|
								    $scope.loadModels();
							 | 
						|
								}]);
							 | 
						|
								
							 |