pyc-website

main website for pyc inc.

git clone https://9o.is/git/pyc-website.git

Forms.js

(4264B)


      1 /**
      2  * This modules simplifies the troubles of connecting with Liftweb 3.0's 
      3  * promises.
      4  * 
      5  * Included ngAlert as dependency since Forms module checks the success
      6  * of the message using ngAlert's message formatting.
      7  */
      8 angular.module("Forms", ['ngAlert'])
      9   
     10   /**
     11    * Simple form controller with helper functions like submit
     12    * which handles the complexity of sending data and handling 
     13    * response from backend server.
     14    */
     15   .controller('FormCtrl', ['$scope', function($scope) {		
     16 	
     17 	/** 
     18 	 * Client-side data 
     19 	 */
     20 	$scope.model = {};
     21 	
     22 	/** 
     23 	 * Success inputs for ng-class 
     24 	 */
     25 	$scope.stateSuccess = function(el, formName) {
     26 		var form = ((formName) ? formName : "form");
     27 		
     28 		return "{'state-success':"+form+"."+el+".$valid && !"+form+"."+el+".$pristine}";
     29 	};
     30 	
     31 	/**
     32 	 *  Success and Failure inputs in ng-class 
     33 	 */
     34 	$scope.stateSuccessError = function(el, formName) {
     35 		var form = ((formName) ? formName : "form");
     36 		
     37 		return "{'state-error':"+form+"."+el+".$invalid && !"+form+"."+el+
     38 		".$pristine,'state-success':"+form+"."+el+".$valid && !"+form+"."+el+".$pristine}";
     39 	};
     40 	
     41 	/** 
     42 	 * Sends data to server. (Useful for Liftweb's roundtrip with ngAlert at least)
     43 	 */
     44 	$scope.submit = function(className, funcName, successFunc, failureFunc, model, loading) {
     45 		$scope.loading = ((loading) ? false : true);
     46 		var toSend = ((model) ? model : $scope.model);
     47 		window[className][funcName](toSend).then(function(alert) {
     48 			$scope.$apply(function() {
     49 				$scope.loading = false;
     50 				if(alert.msg_type === "success") {
     51 					if(typeof(successFunc) === "function") {
     52 						successFunc(alert);
     53 					}
     54 				} else {
     55 					if(typeof(failureFunc) === "function") {
     56 						failureFunc(alert);
     57 					}
     58 				}
     59 			});
     60 		});
     61     };
     62     
     63 	/** 
     64 	 * Resets client-side data and the entire form. 
     65 	 */
     66     $scope.reset = function() {
     67     	$scope.model = {};
     68     	$scope.form.$setPristine();   	
     69     };
     70   }])
     71   
     72   /** 
     73    * Form controller that is initialized with server-side data. 
     74    */
     75   .controller('LoadedFormCtrl', ['$scope', '$controller', function($scope, $controller) {		
     76 	$controller('FormCtrl', {$scope: $scope});
     77 	
     78 	/** 
     79 	 * Known server-side data 
     80 	 */
     81 	$scope.master = {};
     82 	
     83 	/** 
     84 	 * Checks whether the client-side data is different 
     85 	 * from known server-side data. 
     86 	 */
     87 	$scope.diff = function(name) {
     88 		return $scope.master[name] !== $scope.model[name];
     89 	};
     90 	
     91 	/** 
     92 	 * Initiates the form with existing data from the server. 
     93 	 */
     94 	$scope.init = function(className, funcName, callback) {
     95 		window[className][funcName]().then(function(data) {
     96 			$scope.$apply(function() {
     97 				$scope.model = angular.copy(data);
     98 				$scope.master = angular.copy(data);
     99 				
    100 				if(typeof(callback) === "function") {
    101 					callback();
    102 				}
    103 			});
    104 		});
    105 	};
    106   }])
    107   
    108   /** 
    109    * Form controller to easily update (server-side data) inputs immediately.
    110    */
    111   .controller('AutoUpdateFormCtrl', ['$scope', '$controller', '$rootScope', function($scope, $controller, $rootScope) {		
    112 	$controller('LoadedFormCtrl', {$scope: $scope, $controller: $controller});
    113 	
    114 	/** 
    115 	 * Updates server-side data with client-side's data corresponding 
    116 	 * to a change of a data model 'name'.
    117 	 * 
    118 	 * Sets funcName+"_loading" scoped variable to true (useful for Ajax animations)
    119 	 */
    120 	$scope.update = function(className, funcName, successFunc, failureFunc) {		
    121 		// if values are different, update
    122 		if($scope.diff(funcName) && $scope.form[funcName].$valid === true) {
    123 			$scope[funcName+"_loading"] = true;
    124 			window[className][funcName]($scope.model[funcName]).then(function(alert) {
    125 				$scope.$apply(function() {
    126 					$scope[funcName+"_loading"] = false;
    127 					if(alert.msg_type === "success") {
    128 						$scope.master= angular.copy($scope.model);
    129 						$scope.reset();
    130 						
    131 						if(typeof(successFunc) === "function") {
    132 							successFunc();
    133 						}
    134 					} else {
    135 						$rootScope.$broadcast('alertDialog', alert);
    136 						
    137 						if(typeof(failureFunc) === "function") {
    138 							failureFunc();
    139 						}
    140 					}
    141 				});
    142 			});
    143 		} else {
    144 			$scope.reset();
    145 		}
    146 	};
    147 	
    148 	/** 
    149 	 * Sets client-side data with server and resets entire form. 
    150 	 */
    151 	$scope.reset = function() {
    152 		$scope.model = {};
    153     	$scope.form.$setPristine(); 
    154     	$scope.model = angular.copy($scope.master);
    155     };
    156   }]);