mirror of
https://github.com/overleaf/overleaf.git
synced 2025-04-11 17:35:33 +00:00
Isolate affiliations form in a component.
This commit is contained in:
Paulo Reis
James Allen
parent
3517db8348
commit
1514e5e071
4 changed files with 134 additions and 116 deletions
|
|
@ -88,74 +88,11 @@ form.row(
|
|||
href
|
||||
ng-click="selectUniversityManually();"
|
||||
) Let us know
|
||||
.affiliations-form-group(
|
||||
ng-if="ui.showManualUniversitySelectionUI"
|
||||
affiliation-form(
|
||||
affiliation-data="newAffiliation"
|
||||
show-university-and-country="ui.showManualUniversitySelectionUI"
|
||||
show-role-and-department="ui.isValidEmail && newAffiliation.university"
|
||||
)
|
||||
ui-select(
|
||||
ng-model="newAffiliation.country"
|
||||
)
|
||||
ui-select-match(
|
||||
placeholder="Country"
|
||||
) {{ $select.selected.name }}
|
||||
ui-select-choices(
|
||||
repeat="country in countries | filter: $select.search"
|
||||
)
|
||||
span(
|
||||
ng-bind="country.name"
|
||||
s)
|
||||
.affiliations-form-group(
|
||||
ng-if="ui.showManualUniversitySelectionUI"
|
||||
)
|
||||
ui-select(
|
||||
ng-model="newAffiliation.university"
|
||||
ng-disabled="!newAffiliation.country"
|
||||
tagging="addUniversityToSelection"
|
||||
tagging-label="false"
|
||||
)
|
||||
ui-select-match(
|
||||
placeholder="Institution"
|
||||
) {{ $select.selected.name }}
|
||||
ui-select-choices(
|
||||
repeat="university in universities | filter: $select.search"
|
||||
)
|
||||
span(
|
||||
ng-bind="university.name"
|
||||
)
|
||||
.affiliations-form-group(
|
||||
ng-if="ui.isValidEmail && newAffiliation.university"
|
||||
)
|
||||
ui-select(
|
||||
ng-model="newAffiliation.role"
|
||||
tagging
|
||||
tagging-label="false"
|
||||
)
|
||||
ui-select-match(
|
||||
placeholder="Role"
|
||||
) {{ $select.selected }}
|
||||
ui-select-choices(
|
||||
repeat="role in roles | filter: $select.search"
|
||||
)
|
||||
span(
|
||||
ng-bind="role"
|
||||
)
|
||||
|
||||
.affiliations-form-group(
|
||||
ng-if="ui.isValidEmail && newAffiliation.university"
|
||||
)
|
||||
ui-select(
|
||||
ng-model="newAffiliation.department"
|
||||
tagging
|
||||
tagging-label="false"
|
||||
)
|
||||
ui-select-match(
|
||||
placeholder="Department"
|
||||
) {{ $select.selected }}
|
||||
ui-select-choices(
|
||||
repeat="department in departments | filter: $select.search"
|
||||
)
|
||||
span(
|
||||
ng-bind="department"
|
||||
)
|
||||
td
|
||||
button.btn.btn-primary(
|
||||
ng-disabled="affiliationsForm.$invalid || ui.isAddingNewEmail"
|
||||
|
|
@ -169,4 +106,74 @@ form.row(
|
|||
)
|
||||
i.fa.fa-fw.fa-spin.fa-refresh
|
||||
| Adding...
|
||||
hr
|
||||
hr
|
||||
|
||||
script(type="text/ng-template", id="affiliationFormTpl")
|
||||
.affiliations-form-group(
|
||||
ng-if="$ctrl.showUniversityAndCountry"
|
||||
)
|
||||
ui-select(
|
||||
ng-model="$ctrl.affiliationData.country"
|
||||
)
|
||||
ui-select-match(
|
||||
placeholder="Country"
|
||||
) {{ $select.selected.name }}
|
||||
ui-select-choices(
|
||||
repeat="country in $ctrl.countries | filter: $select.search"
|
||||
)
|
||||
span(
|
||||
ng-bind="country.name"
|
||||
)
|
||||
.affiliations-form-group(
|
||||
ng-if="$ctrl.showUniversityAndCountry"
|
||||
)
|
||||
ui-select(
|
||||
ng-model="$ctrl.affiliationData.university"
|
||||
ng-disabled="!$ctrl.affiliationData.country"
|
||||
tagging="$ctrladdUniversityToSelection"
|
||||
tagging-label="false"
|
||||
)
|
||||
ui-select-match(
|
||||
placeholder="Institution"
|
||||
) {{ $select.selected.name }}
|
||||
ui-select-choices(
|
||||
repeat="university in $ctrl.universities | filter: $select.search"
|
||||
)
|
||||
span(
|
||||
ng-bind="university.name"
|
||||
)
|
||||
.affiliations-form-group(
|
||||
ng-if="$ctrl.showRoleAndDepartment"
|
||||
)
|
||||
ui-select(
|
||||
ng-model="$ctrl.affiliationData.role"
|
||||
tagging
|
||||
tagging-label="false"
|
||||
)
|
||||
ui-select-match(
|
||||
placeholder="Role"
|
||||
) {{ $select.selected }}
|
||||
ui-select-choices(
|
||||
repeat="role in $ctrl.roles | filter: $select.search"
|
||||
)
|
||||
span(
|
||||
ng-bind="role"
|
||||
)
|
||||
|
||||
.affiliations-form-group(
|
||||
ng-if="$ctrl.showRoleAndDepartment"
|
||||
)
|
||||
ui-select(
|
||||
ng-model="$ctrl.affiliationData.department"
|
||||
tagging
|
||||
tagging-label="false"
|
||||
)
|
||||
ui-select-match(
|
||||
placeholder="Department"
|
||||
) {{ $select.selected }}
|
||||
ui-select-choices(
|
||||
repeat="department in $ctrl.departments | filter: $select.search"
|
||||
)
|
||||
span(
|
||||
ng-bind="department"
|
||||
)
|
||||
|
|
|
|||
|
|
@ -20,6 +20,7 @@ define [
|
|||
"main/subscription/team-invite-controller"
|
||||
"main/contact-us"
|
||||
"main/learn"
|
||||
"main/affiliations/components/affiliationForm"
|
||||
"main/affiliations/controllers/UserAffiliationsController"
|
||||
"main/affiliations/factories/UserAffiliationsDataService"
|
||||
"main/keys"
|
||||
|
|
|
|||
|
|
@ -0,0 +1,53 @@
|
|||
define [
|
||||
"base"
|
||||
], (App) ->
|
||||
affiliationFormController = ($scope, $element, $attrs, UserAffiliationsDataService) ->
|
||||
ctrl = @
|
||||
ctrl.roles = []
|
||||
ctrl.departments = []
|
||||
ctrl.countries = []
|
||||
ctrl.universities = []
|
||||
_defaultDepartments = []
|
||||
|
||||
ctrl.addUniversityToSelection = (universityName) ->
|
||||
{ name: universityName, isUserSuggested: true }
|
||||
# Populates the countries dropdown
|
||||
UserAffiliationsDataService
|
||||
.getCountries()
|
||||
.then (countries) -> ctrl.countries = countries
|
||||
# Populates the roles dropdown
|
||||
UserAffiliationsDataService
|
||||
.getDefaultRoleHints()
|
||||
.then (roles) -> ctrl.roles = roles
|
||||
# Fetches the default department hints
|
||||
UserAffiliationsDataService
|
||||
.getDefaultDepartmentHints()
|
||||
.then (departments) ->
|
||||
_defaultDepartments = departments
|
||||
# Populates the universities dropdown (after selecting a country)
|
||||
$scope.$watch "$ctrl.affiliationData.country", (newSelectedCountry, prevSelectedCountry) ->
|
||||
if newSelectedCountry? and newSelectedCountry != prevSelectedCountry
|
||||
ctrl.affiliationData.university = null
|
||||
ctrl.affiliationData.role = null
|
||||
ctrl.affiliationData.department = null
|
||||
UserAffiliationsDataService
|
||||
.getUniversitiesFromCountry(newSelectedCountry)
|
||||
.then (universities) -> ctrl.universities = universities
|
||||
# Populates the departments dropdown (after selecting a university)
|
||||
$scope.$watch "$ctrl.affiliationData.university", (newSelectedUniversity, prevSelectedUniversity) ->
|
||||
if newSelectedUniversity? and newSelectedUniversity != prevSelectedUniversity
|
||||
if newSelectedUniversity.departments?.length > 0
|
||||
ctrl.departments = _.uniq newSelectedUniversity.departments
|
||||
else
|
||||
ctrl.departments = _defaultDepartments
|
||||
|
||||
return
|
||||
|
||||
App.component "affiliationForm", {
|
||||
bindings:
|
||||
affiliationData: "="
|
||||
showUniversityAndCountry: "<"
|
||||
showRoleAndDepartment: "<"
|
||||
controller: affiliationFormController
|
||||
templateUrl: "affiliationFormTpl"
|
||||
}
|
||||
|
|
@ -3,12 +3,6 @@ define [
|
|||
], (App) ->
|
||||
App.controller "UserAffiliationsController", ["$scope", "UserAffiliationsDataService", "$q", "_", ($scope, UserAffiliationsDataService, $q, _) ->
|
||||
$scope.userEmails = []
|
||||
$scope.countries = []
|
||||
$scope.universities = []
|
||||
$scope.roles = []
|
||||
$scope.departments = []
|
||||
|
||||
_defaultDepartments = []
|
||||
|
||||
LOCAL_AND_DOMAIN_REGEX = /([^@]+)@(.+)/
|
||||
EMAIL_REGEX = /^([A-Za-z0-9_\-\.]+)@([^\.]+)\.([A-Za-z0-9_\-\.]+)([^\.])$/
|
||||
|
|
@ -20,9 +14,6 @@ define [
|
|||
else
|
||||
{ local: null, domain: null }
|
||||
|
||||
$scope.addUniversityToSelection = (universityName) ->
|
||||
{ name: universityName, isUserSuggested: true }
|
||||
|
||||
$scope.getEmailSuggestion = (userInput) ->
|
||||
userInputLocalAndDomain = _matchLocalAndDomain(userInput)
|
||||
$scope.ui.isValidEmail = EMAIL_REGEX.test userInput
|
||||
|
|
@ -97,11 +88,11 @@ define [
|
|||
.removeUserEmail email
|
||||
.then () -> _getUserEmails()
|
||||
|
||||
$scope.getDepartments = () ->
|
||||
if $scope.newAffiliation.university?.departments.length > 0
|
||||
_.uniq $scope.newAffiliation.university.departments
|
||||
else
|
||||
UserAffiliationsDataService.getDefaultDepartmentHints()
|
||||
# $scope.getDepartments = () ->
|
||||
# if $scope.newAffiliation.university?.departments.length > 0
|
||||
# _.uniq $scope.newAffiliation.university.departments
|
||||
# else
|
||||
# UserAffiliationsDataService.getDefaultDepartmentHints()
|
||||
|
||||
_reset = () ->
|
||||
$scope.newAffiliation =
|
||||
|
|
@ -129,38 +120,4 @@ define [
|
|||
$scope.ui.isLoadingEmails = false
|
||||
_getUserEmails()
|
||||
|
||||
# Populates the countries dropdown
|
||||
UserAffiliationsDataService
|
||||
.getCountries()
|
||||
.then (countries) -> $scope.countries = countries
|
||||
|
||||
# Populates the roles dropdown
|
||||
UserAffiliationsDataService
|
||||
.getDefaultRoleHints()
|
||||
.then (roles) -> $scope.roles = roles
|
||||
|
||||
# Fetches the default department hints
|
||||
UserAffiliationsDataService
|
||||
.getDefaultDepartmentHints()
|
||||
.then (departments) ->
|
||||
_defaultDepartments = departments
|
||||
|
||||
# Populates the universities dropdown (after selecting a country)
|
||||
$scope.$watch "newAffiliation.country", (newSelectedCountry, prevSelectedCountry) ->
|
||||
if newSelectedCountry? and newSelectedCountry != prevSelectedCountry
|
||||
$scope.newAffiliation.university = null
|
||||
$scope.newAffiliation.role = null
|
||||
$scope.newAffiliation.department = null
|
||||
UserAffiliationsDataService
|
||||
.getUniversitiesFromCountry(newSelectedCountry)
|
||||
.then (universities) -> $scope.universities = universities
|
||||
|
||||
# Populates the departments dropdown (after selecting a university)
|
||||
$scope.$watch "newAffiliation.university", (newSelectedUniversity, prevSelectedUniversity) ->
|
||||
if newSelectedUniversity? and newSelectedUniversity != prevSelectedUniversity
|
||||
if newSelectedUniversity.departments?.length > 0
|
||||
$scope.departments = _.uniq newSelectedUniversity.departments
|
||||
else
|
||||
$scope.departments = _defaultDepartments
|
||||
|
||||
]
|
||||
Loading…
Add table
Reference in a new issue