codecombat/app/views/account/profile_view.coffee
2014-06-17 15:17:25 -07:00

584 lines
24 KiB
CoffeeScript

View = require 'views/kinds/RootView'
template = require 'templates/account/profile'
User = require 'models/User'
LevelSession = require 'models/LevelSession'
CocoCollection = require 'collections/CocoCollection'
{me} = require 'lib/auth'
JobProfileContactView = require 'views/modal/job_profile_contact_modal'
JobProfileView = require 'views/account/job_profile_view'
UserRemark = require 'models/UserRemark'
forms = require 'lib/forms'
ModelModal = require 'views/modal/model_modal'
class LevelSessionsCollection extends CocoCollection
url: -> "/db/user/#{@userID}/level.sessions/employer"
model: LevelSession
constructor: (@userID) ->
super()
adminContacts = [
{id: "", name: "Assign a Contact"}
{id: "512ef4805a67a8c507000001", name: "Nick"}
{id: "5162fab9c92b4c751e000274", name: "Scott"}
{id: "51eb2714fa058cb20d0006ef", name: "Michael"}
{id: "51538fdb812dd9af02000001", name: "George"}
]
module.exports = class ProfileView extends View
id: "profile-view"
template: template
subscriptions:
'linkedin-loaded': 'onLinkedInLoaded'
events:
'click #toggle-editing': 'toggleEditing'
'click #importLinkedIn': 'importLinkedIn'
'click #toggle-job-profile-active': 'toggleJobProfileActive'
'click #toggle-job-profile-approved': 'toggleJobProfileApproved'
'click #save-notes-button': 'onJobProfileNotesChanged'
'click #contact-candidate': 'onContactCandidate'
'click #enter-espionage-mode': 'enterEspionageMode'
'click #open-model-modal': 'openModelModal'
'click .editable-profile .profile-photo': 'onEditProfilePhoto'
'click .editable-profile .project-image': 'onEditProjectImage'
'click .editable-profile .editable-display': 'onEditSection'
'click .editable-profile .save-section': 'onSaveSection'
'click .editable-profile .glyphicon-remove': 'onCancelSectionEdit'
'change .editable-profile .editable-array input': 'onEditArray'
'keyup .editable-profile .editable-array input': 'onEditArray'
'click .editable-profile a': 'onClickLinkWhileEditing'
'change #admin-contact': 'onAdminContactChanged'
constructor: (options, @userID) ->
@userID ?= me.id
@onJobProfileNotesChanged = _.debounce @onJobProfileNotesChanged, 1000
@onRemarkChanged = _.debounce @onRemarkChanged, 1000
@authorizedWithLinkedIn = IN?.User?.isAuthorized()
@linkedInLoaded = Boolean(IN?.parse)
@waitingForLinkedIn = false
window.contractCallback = =>
@authorizedWithLinkedIn = IN?.User?.isAuthorized()
@render()
super options
if User.isObjectID @userID
@finishInit()
else
$.ajax "/db/user/#{@userID}/nameToID", success: (@userID) =>
@finishInit() unless @destroyed
@render()
finishInit: ->
return unless @userID
@uploadFilePath = "db/user/#{@userID}"
@highlightedContainers = []
if @userID is me.id
@user = me
else if me.isAdmin() or "employer" in me.get('permissions')
@user = User.getByID(@userID)
@user.fetch()
@listenTo @user, "sync", =>
@render()
$.post "/db/user/#{me.id}/track/view_candidate"
$.post "/db/user/#{@userID}/track/viewed_by_employer" unless me.isAdmin()
else
@user = User.getByID(@userID)
@sessions = @supermodel.loadCollection(new LevelSessionsCollection(@userID), 'candidate_sessions').model
if me.isAdmin()
# Mimicking how the VictoryModal fetches LevelFeedback
@remark = new UserRemark()
@remark.setURL "/db/user/#{@userID}/remark"
@remark.fetch()
@listenToOnce @remark, 'sync', @onRemarkLoaded
@listenToOnce @remark, 'error', @onRemarkNotFound
onRemarkLoaded: ->
@remark.setURL "/db/user.remark/#{@remark.id}"
@render()
onRemarkNotFound: ->
@remark = new UserRemark() # hmm, why do we create a new one here?
@remark.set 'user', @userID
@remark.set 'userName', name if name = @user.get('name')
onLinkedInLoaded: =>
@linkedinLoaded = true
if @waitingForLinkedIn
@renderLinkedInButton()
renderLinkedInButton: =>
IN?.parse()
afterInsert: ->
super()
linkedInButtonParentElement = document.getElementById("linkedInAuthButton")
if linkedInButtonParentElement
if @linkedinLoaded
@renderLinkedInButton()
else
@waitingForLinkedIn = true
importLinkedIn: =>
overwriteConfirm = confirm("Importing LinkedIn data will overwrite your current work experience, skills, name, descriptions, and education. Continue?")
unless overwriteConfirm then return
application.linkedinHandler.getProfileData (err, profileData) =>
@processLinkedInProfileData profileData
jobProfileSchema: -> @user.schema().properties.jobProfile.properties
processLinkedInProfileData: (p) ->
#handle formatted-name
currentJobProfile = @user.get('jobProfile')
oldJobProfile = _.cloneDeep(currentJobProfile)
jobProfileSchema = @user.schema().properties.jobProfile.properties
if p["formattedName"]? and p["formattedName"] isnt "private"
nameMaxLength = jobProfileSchema.name.maxLength
currentJobProfile.name = p["formattedName"].slice(0,nameMaxLength)
if p["skills"]?["values"].length
skillNames = []
skillMaxLength = jobProfileSchema.skills.items.maxLength
for skill in p.skills.values
skillNames.push skill.skill.name.slice(0,skillMaxLength)
currentJobProfile.skills = skillNames
if p["headline"]
shortDescriptionMaxLength = jobProfileSchema.shortDescription.maxLength
currentJobProfile.shortDescription = p["headline"].slice(0,shortDescriptionMaxLength)
if p["summary"]
longDescriptionMaxLength = jobProfileSchema.longDescription.maxLength
currentJobProfile.longDescription = p.summary.slice(0,longDescriptionMaxLength)
if p["positions"]?["values"]?.length
newWorks = []
workSchema = jobProfileSchema.work.items.properties
for position in p["positions"]["values"]
workObj = {}
descriptionMaxLength = workSchema.description.maxLength
workObj.description = position.summary?.slice(0,descriptionMaxLength)
workObj.description ?= ""
if position.startDate?.year?
workObj.duration = "#{position.startDate.year} - "
if (not position.endDate?.year) or (position.endDate?.year and position.endDate?.year > (new Date().getFullYear()))
workObj.duration += "present"
else
workObj.duration += position.endDate.year
else
workObj.duration = ""
durationMaxLength = workSchema.duration.maxLength
workObj.duration = workObj.duration.slice(0,durationMaxLength)
employerMaxLength = workSchema.employer.maxLength
workObj.employer = position.company?.name ? ""
workObj.employer = workObj.employer.slice(0,employerMaxLength)
workObj.role = position.title ? ""
roleMaxLength = workSchema.role.maxLength
workObj.role = workObj.role.slice(0,roleMaxLength)
newWorks.push workObj
currentJobProfile.work = newWorks
if p["educations"]?["values"]?.length
newEducation = []
eduSchema = jobProfileSchema.education.items.properties
for education in p["educations"]["values"]
educationObject = {}
educationObject.degree = education.degree ? "Studied"
if education.startDate?.year?
educationObject.duration = "#{education.startDate.year} - "
if (not education.endDate?.year) or (education.endDate?.year and education.endDate?.year > (new Date().getFullYear()))
educationObject.duration += "present"
if educationObject.degree is "Studied"
educationObject.degree = "Studying"
else
educationObject.duration += education.endDate.year
else
educationObject.duration = ""
if education.fieldOfStudy
if educationObject.degree is "Studied" or educationObject.degree is "Studying"
educationObject.degree += " #{education.fieldOfStudy}"
else
educationObject.degree += " in #{education.fieldOfStudy}"
educationObject.degree = educationObject.degree.slice(0,eduSchema.degree.maxLength)
educationObject.duration = educationObject.duration.slice(0,eduSchema.duration.maxLength)
educationObject.school = education.schoolName ? ""
educationObject.school = educationObject.school.slice(0,eduSchema.school.maxLength)
educationObject.description = ""
newEducation.push educationObject
currentJobProfile.education = newEducation
if p["publicProfileUrl"]
#search for linkedin link
links = currentJobProfile.links
alreadyHasLinkedIn = false
for link in links
if link.link.toLowerCase().indexOf("linkedin") > -1
alreadyHasLinkedIn = true
break
unless alreadyHasLinkedIn
newLink =
link: p["publicProfileUrl"]
name: "LinkedIn"
currentJobProfile.links.push newLink
@user.set('jobProfile',currentJobProfile)
validationErrors = @user.validate()
if validationErrors
@user.set('jobProfile',oldJobProfile)
return alert("Please notify team@codecombat.com! There were validation errors from the LinkedIn import: #{JSON.stringify validationErrors}")
else
@render()
getRenderData: ->
context = super()
context.userID = @userID
context.linkedInAuthorized = @authorizedWithLinkedIn
context.jobProfileSchema = me.schema().properties.jobProfile
if @user and not jobProfile = @user.get 'jobProfile'
jobProfile = {}
for prop, schema of context.jobProfileSchema.properties
jobProfile[prop] = _.clone schema.default if schema.default?
for prop in context.jobProfileSchema.required
jobProfile[prop] ?= {string: '', boolean: false, number: 0, integer: 0, array: []}[context.jobProfileSchema.properties[prop].type]
@user.set 'jobProfile', jobProfile
jobProfile.name ?= (@user.get('firstName') + ' ' + @user.get('lastName')).trim() if @user?.get('firstName')
context.profile = jobProfile
context.user = @user
context.myProfile = @user?.id is context.me.id
context.allowedToViewJobProfile = @user and (me.isAdmin() or "employer" in me.get('permissions') or (context.myProfile && !me.get('anonymous')))
context.allowedToEditJobProfile = @user and (me.isAdmin() or (context.myProfile && !me.get('anonymous')))
context.profileApproved = @user?.get 'jobProfileApproved'
context.progress = @progress ? @updateProgress()
@editing ?= context.myProfile and context.progress < 0.8
context.editing = @editing
context.marked = marked
context.moment = moment
context.iconForLink = @iconForLink
if links = jobProfile?.links
links = ($.extend(true, {}, link) for link in links)
link.icon = @iconForLink link for link in links
context.profileLinks = _.sortBy links, (link) -> not link.icon # icons first
if @sessions
context.sessions = (s.attributes for s in @sessions.models when (s.get('submitted') or s.get('level-id') is 'gridmancer'))
context.sessions.sort (a, b) -> (b.playtime ? 0) - (a.playtime ? 0)
else
context.sessions = []
context.adminContacts = adminContacts
context.remark = @remark
context
afterRender: ->
super()
if me.get('employerAt')
@$el.addClass 'viewed-by-employer'
return unless @user
unless @user.get('jobProfile')?.projects?.length or @editing
@$el.find('.right-column').hide()
@$el.find('.middle-column').addClass('double-column')
unless @editing
@$el.find('.editable-display').attr('title', '')
@initializeAutocomplete()
highlightNext = @highlightNext ? true
justSavedSection = @$el.find('#' + @justSavedSectionID).addClass "just-saved"
_.defer =>
@progress = @updateProgress highlightNext
_.delay ->
justSavedSection.removeClass "just-saved", duration: 1500, easing: 'easeOutQuad'
, 500
if me.isAdmin()
visibleSettings = ['history', 'tasks']
data = _.pick (@remark.attributes), (value, key) -> key in visibleSettings
data.history ?= []
data.tasks ?= []
schema = _.cloneDeep @remark.schema()
schema.properties = _.pick schema.properties, (value, key) => key in visibleSettings
schema.required = _.intersection (schema.required ? []), visibleSettings
treemaOptions =
filePath: "db/user/#{@userID}"
schema: schema
data: data
aceUseWrapMode: true
callbacks: {change: @onRemarkChanged}
@remarkTreema = @$el.find('#remark-treema').treema treemaOptions
@remarkTreema.build()
@remarkTreema.open(3)
onRemarkChanged: (e) =>
return unless @remarkTreema.isValid()
for key in ['history', 'tasks']
val = _.filter(@remarkTreema.get(key), (entry) -> entry?.content or entry?.action)
entry.date ?= (new Date()).toISOString() for entry in val if key is 'history'
@remark.set key, val
@saveRemark()
initializeAutocomplete: (container) ->
(container ? @$el).find('input[data-autocomplete]').each ->
$(@).autocomplete(source: JobProfileView[$(@).data('autocomplete')], minLength: parseInt($(@).data('autocomplete-min-length')), delay: 0, autoFocus: true)
toggleEditing: ->
@editing = not @editing
@render()
_.delay @renderLinkedInButton, 1000
@saveEdits()
toggleJobProfileApproved: ->
return unless me.isAdmin()
approved = not @user.get 'jobProfileApproved'
@user.set 'jobProfileApproved', approved
res = @user.save {jobProfileApproved: approved}, {patch: true}
res.success (model, response, options) => @render()
toggleJobProfileActive: ->
active = not @user.get('jobProfile').active
@user.get('jobProfile').active = active
@saveEdits()
if active and not (me.isAdmin() or @stackLed)
$.post "/stacklead"
@stackLed = true
enterEspionageMode: ->
postData = emailLower: @user.get('email').toLowerCase(), usernameLower: @user.get('name').toLowerCase()
$.ajax
type: "POST",
url: "/auth/spy"
data: postData
success: @espionageSuccess
espionageSuccess: (model) ->
window.location.reload()
openModelModal: (e) ->
@openModalView new ModelModal models: [@user]
onJobProfileNotesChanged: (e) =>
notes = @$el.find("#job-profile-notes").val()
@user.set 'jobProfileNotes', notes
@user.save {jobProfileNotes: notes}, {patch: true}
iconForLink: (link) ->
icons = [
{icon: 'facebook', name: 'Facebook', domain: /facebook\.com/, match: /facebook/i}
{icon: 'twitter', name: 'Twitter', domain: /twitter\.com/, match: /twitter/i}
{icon: 'github', name: 'GitHub', domain: /github\.(com|io)/, match: /github/i}
{icon: 'gplus', name: 'Google Plus', domain: /plus\.google\.com/, match: /(google|^g).?(\+|plus)/i}
{icon: 'linkedin', name: 'LinkedIn', domain: /linkedin\.com/, match: /(google|^g).?(\+|plus)/i}
]
for icon in icons
if (link.name.search(icon.match) isnt -1) or (link.link.search(icon.domain) isnt -1)
icon.url = "/images/pages/account/profile/icon_#{icon.icon}.png"
return icon
null
onContactCandidate: (e) ->
@openModalView new JobProfileContactView recipientID: @user.id, recipientUserName: @user.get('name')
showErrors: (errors) ->
section = @$el.find '.saving'
console.error "Couldn't save because of validation errors:", errors
section.removeClass 'saving'
forms.clearFormAlerts section
# This is pretty lame, since we don't easily match which field had the error like forms.applyErrorsToForm can.
section.find('form').addClass('has-error').find('.save-section').before($("<span class='help-block error-help-block'>#{errors[0].message}</span>"))
saveEdits: (highlightNext) ->
errors = @user.validate()
return @showErrors errors if errors
jobProfile = @user.get('jobProfile')
jobProfile.updated = (new Date()).toISOString() if @user is me
@user.set 'jobProfile', jobProfile
return unless res = @user.save()
res.error =>
return if @destroyed
@showErrors [message: res.responseText]
res.success (model, response, options) =>
return if @destroyed
@justSavedSectionID = @$el.find('.editable-section.saving').removeClass('saving').attr('id')
@highlightNext = highlightNext
@render()
@highlightNext = false
@justSavedSectionID = null
onEditProfilePhoto: (e) ->
onSaving = =>
@$el.find('.profile-photo').addClass('saving')
onSaved = (uploadingPath) =>
@user.get('jobProfile').photoURL = uploadingPath
@saveEdits()
filepicker.pick {mimetypes: 'image/*'}, @onImageChosen(onSaving, onSaved)
onEditProjectImage: (e) ->
img = $(e.target)
onSaving = =>
img.addClass('saving')
onSaved = (uploadingPath) =>
img.parent().find('input').val(uploadingPath)
img.css('background-image', "url('/file/#{uploadingPath}')")
img.removeClass('saving')
filepicker.pick {mimetypes: 'image/*'}, @onImageChosen(onSaving, onSaved)
formatImagePostData: (inkBlob) ->
url: inkBlob.url, filename: inkBlob.filename, mimetype: inkBlob.mimetype, path: @uploadFilePath, force: true
onImageChosen: (onSaving, onSaved) ->
(inkBlob) =>
onSaving()
uploadingPath = [@uploadFilePath, inkBlob.filename].join('/')
$.ajax '/file', type: 'POST', data: @formatImagePostData(inkBlob), success: @onImageUploaded(onSaved, uploadingPath)
onImageUploaded: (onSaved, uploadingPath) ->
(e) =>
onSaved uploadingPath
onEditSection: (e) ->
@$el.find('.emphasized').removeClass('emphasized')
section = $(e.target).closest('.editable-section').removeClass 'deemphasized'
section.find('.editable-form').show().find('select, input, textarea').first().focus()
section.find('.editable-display').hide()
@$el.find('.editable-section').not(section).addClass 'deemphasized'
column = section.closest('.full-height-column')
@$el.find('.full-height-column').not(column).addClass 'deemphasized'
onCancelSectionEdit: (e) ->
@render()
onSaveSection: (e) ->
e.preventDefault()
section = $(e.target).closest('.editable-section')
form = $(e.target).closest('form')
isEmpty = @arrayItemIsEmpty
section.find('.array-item').each ->
$(@).remove() if isEmpty @
resetOnce = false # We have to clear out arrays if we're going to redo them
serialized = form.serializeArray()
jobProfile = @user.get 'jobProfile'
rootPropertiesSeen = {}
for field in serialized
keyChain = @extractFieldKeyChain field.name
value = @extractFieldValue keyChain[0], field.value
parent = jobProfile
for key, i in keyChain
rootPropertiesSeen[key] = true unless i
break if i is keyChain.length - 1
child = parent[key]
if _.isArray(child) and not resetOnce
child = parent[key] = []
resetOnce = true
else unless child?
child = parent[key] = {}
parent = child
if key is 'link' and keyChain[0] is 'projects' and not value
delete parent[key]
else
parent[key] = value
form.find('.editable-array').each ->
key = $(@).data('property')
unless rootPropertiesSeen[key]
jobProfile[key] = []
if section.hasClass('projects-container') and not section.find('.array-item').length
jobProfile.projects = []
section.addClass 'saving'
@saveEdits true
extractFieldKeyChain: (key) ->
# "root[projects][0][name]" -> ["projects", "0", "name"]
key.replace(/^root/, '').replace(/\[(.*?)\]/g, '.$1').replace(/^\./, '').split(/\./)
extractFieldValue: (key, value) ->
switch key
when 'active' then Boolean value
when 'experience' then parseInt value or '0'
else value
arrayItemIsEmpty: (arrayItem) ->
for input in $(arrayItem).find('input[type!=hidden], textarea')
return false if $(input).val().trim()
true
onEditArray: (e) ->
# We make sure there's always an empty array item at the end for the user to add to, deleting interstitial empties.
array = $(e.target).closest('.editable-array')
arrayItems = array.find('.array-item')
toRemove = []
for arrayItem, index in arrayItems
empty = @arrayItemIsEmpty arrayItem
if index is arrayItems.length - 1
lastEmpty = empty
else if empty and not $(arrayItem).find('input:focus, textarea:focus').length
toRemove.unshift index
$(arrayItems[emptyIndex]).remove() for emptyIndex in toRemove
unless lastEmpty
clone = $(arrayItem).clone(false)
clone.find('input').each -> $(@).val('')
clone.find('textarea').each -> $(@).text('')
array.append clone
@initializeAutocomplete clone
for arrayItem, index in array.find('.array-item')
for input in $(arrayItem).find('input, textarea')
$(input).attr('name', $(input).attr('name').replace(/\[\d+\]/, "[#{index}]"))
onClickLinkWhileEditing: (e) ->
e.preventDefault()
onAdminContactChanged: (e) ->
newContact = @$el.find('#admin-contact').val()
newContactName = if newContact then _.find(adminContacts, id: newContact).name else ''
@remark.set 'contact', newContact
@remark.set 'contactName', newContactName
@saveRemark()
saveRemark: ->
@remark.set 'user', @user.id
@remark.set 'userName', @user.get('name')
if errors = @remark.validate()
return console.error "UserRemark", @remark, "failed validation with errors:", errors
res = @remark.save()
res.error =>
return if @destroyed
console.error "UserRemark", @remark, "failed to save with error:", res.responseText
res.success (model, response, options) =>
return if @destroyed
console.log "Saved UserRemark", @remark, "with response", response
updateProgress: (highlightNext) ->
return unless @user
completed = 0
totalWeight = 0
next = null
for metric in metrics = @getProgressMetrics()
done = metric.fn()
completed += metric.weight if done
totalWeight += metric.weight
next = metric unless next or done
progress = Math.round 100 * completed / totalWeight
bar = @$el.find('.profile-completion-progress .progress-bar')
bar.css 'width', "#{progress}%"
if next
text = ""
t = $.i18n.t
text = "#{progress}% #{t 'account_profile.complete'}. #{t 'account_profile.next'}: #{next.name}"
bar.parent().show().find('.progress-text').text text
if highlightNext and next?.container and not (next.container in @highlightedContainers)
@highlightedContainers.push next.container
@$el.find(next.container).addClass 'emphasized'
#@onEditSection target: next.container
#$('#page-container').scrollTop 0
else
bar.parent().hide()
completed / totalWeight
getProgressMetrics: ->
schema = me.schema().properties.jobProfile
jobProfile = @user.get('jobProfile') ? {}
exists = (field) -> -> jobProfile[field]
modified = (field) -> -> jobProfile[field] and jobProfile[field] isnt schema.properties[field].default
listStarted = (field, subfields) -> -> jobProfile[field]?.length and _.every subfields, (subfield) -> jobProfile[field][0][subfield]
t = $.i18n.t
@progressMetrics = [
{name: t('account_profile.next_name'), weight: 1, container: '#name-container', fn: modified 'name'}
{name: t('account_profile.next_short_description'), weight: 2, container: '#short-description-container', fn: modified 'shortDescription'}
{name: t('account_profile.next_skills'), weight: 2, container: '#skills-container', fn: -> jobProfile.skills?.length >= 5}
{name: t('account_profile.next_long_description'), weight: 3, container: '#long-description-container', fn: modified 'longDescription'}
{name: t('account_profile.next_work'), weight: 3, container: '#work-container', fn: listStarted 'work', ['role', 'employer']}
{name: t('account_profile.next_education'), weight: 3, container: '#education-container', fn: listStarted 'education', ['degree', 'school']}
{name: t('account_profile.next_projects'), weight: 3, container: '#projects-container', fn: listStarted 'projects', ['name']}
{name: t('account_profile.next_city'), weight: 1, container: '#basic-info-container', fn: modified 'city'}
{name: t('account_profile.next_country'), weight: 0, container: '#basic-info-container', fn: exists 'country'}
{name: t('account_profile.next_links'), weight: 2, container: '#links-container', fn: listStarted 'links', ['link', 'name']}
{name: t('account_profile.next_photo'), weight: 2, container: '#profile-photo-container', fn: modified 'photoURL'}
{name: t('account_profile.next_active'), weight: 1, fn: modified 'active'}
]