working with requirejs

services/web/app/views/project/list.jade

@@ -101,7 +101,7 @@ block content
 						ul#projectList
 							mixin projectList(projects)
 
-					.span3#userProfileInformation(ng-app="userProfileInformationApp")
+					.span3#userProfileInformation()
 						div(ng-controller="UpdateForm").userProfileInformationArea
 							div(ng-hide="hidePersonalInfoSection").alert.alert-info
 
@@ -159,15 +159,20 @@ block content
 	script
 		window.requirejs = {
 			"paths" : {
-				"moment": "libs/moment"
-			}
+				"moment": "libs/moment",
+				"angular":"libs/angular"
+			},
+			shim: {
+				'angular' : {'exports' : 'angular'}
+			},
+			priority: [
+				"angular"
+			]
 		};
+
 	script(
 		data-main=jsPath+'list.js?fingerprint='+fingerprint(jsPath + 'list.js'), 
 		baseurl=jsPath,
 		src=jsPath+'libs/require.js?fingerprint='+fingerprint(jsPath + 'libs/require.js')
 	)
 
-	script(src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.5.2/underscore-min.js")
-	script(src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.17/angular.js")
-	script(src=jsPath+"/UserDetailsUpdater.js")

services/web/public/coffee/UserDetailsUpdater.coffee

@@ -1,32 +1,36 @@
+define ["libs/angular"], (a)->
 
-app = angular.module("userProfileInformationApp", [])
+	angular.element(document).ready ->
 
-app.controller "UpdateForm", ($scope, $http)->
+		app = angular.module("userProfileInformationApp", [])
 
-	$scope.hidePersonalInfoSection = true
+		app.controller "UpdateForm", ($scope, $http)->
 
-	$http.get("/user/personal_info").success (data)->
-		$scope.userInfoForm = 
-			first_name: data.first_name
-			last_name: data.last_name
-			role: 	   data.role
-			institution: data.institution
-			_csrf : window.csrfToken
+			$scope.hidePersonalInfoSection = true
 
-		if getPercentComplete() != 100
-			$scope.percentComplete = getPercentComplete()
-			$scope.hidePersonalInfoSection = false
+			$http.get("/user/personal_info").success (data)->
+				$scope.userInfoForm = 
+					first_name: data.first_name
+					last_name: data.last_name
+					role: 	   data.role
+					institution: data.institution
+					_csrf : window.csrfToken
 
-	$scope.sendUpdate = ->
-		request = $http.post "/user/personal_info", $scope.userInfoForm
-		request.success (data, status)->
-			console.log "the post worked"
-		request.error (data, status)->
-			console.log "the request failed"
-		$scope.percentComplete = getPercentComplete()
+				if getPercentComplete() != 100
+					$scope.percentComplete = getPercentComplete()
+					$scope.hidePersonalInfoSection = false
 
-	getPercentComplete = ->
-		results = _.filter $scope.userInfoForm, (value)-> value? and value?.length != 0
-		results.length * 20
+			$scope.sendUpdate = ->
+				request = $http.post "/user/personal_info", $scope.userInfoForm
+				request.success (data, status)->
+					console.log "the post worked"
+				request.error (data, status)->
+					console.log "the request failed"
+				$scope.percentComplete = getPercentComplete()
 
+			getPercentComplete = ->
+				results = _.filter $scope.userInfoForm, (value)-> value? and value?.length != 0
+				results.length * 20
+
+		angular.bootstrap(document, ['userProfileInformationApp'])
 

services/web/public/coffee/list.coffee

@@ -9,6 +9,7 @@ require [
 	"UserDetailsUpdater"
 ], (tagsManager, moment)->
 
+
 	$('.isoDate').each (i, d)->
 		html = $(d)
 		unparsedDate = html.text().trim()