{% extends 'base.html.twig' %}

{% block title %}
	{{ parent() }}
	| Profile
{% endblock %}


{% block description %}
	<meta name="description" content="Personnalisez votre profil professionnel sur Luxury Service. Exprimez votre expertise exceptionnelle dans le secteur du luxe en mettant en avant vos compétences uniques, votre parcours professionnel et votre passion pour l'excellence. Façonnez votre image de marque professionnelle et maximisez vos opportunités de carrière en créant un profil exclusif qui attirera l'attention des grandes marques du luxe."/>
{% endblock %}

{% block body %}
	<section class="section_header">
		<div class="section_header_text">
			<h2 class="white-text">Your profile</h2>
			<span class="white-text">Personnal &amp; Professionnal informations</span>
			<ul class="align-center">
				<li>
					<a href="{{ path('app_home') }}">Home</a>
				</li>
				<li class="active white-text">Profile</li>
			</ul>
		</div>
	</section>

	<main>
		{% if isComplete %}
			<section class="score-container">
				<h4 class="align-center">
					<img src="img/luxury_services_felicitation.gif" style="height: 80px; width: 201px" alt='felicitation gif'/>
					&nbsp; &nbsp; Hooray ! Your proffrrrrrrrrrrrile is complete.
				</h4>
			</section>
		{% endif %}
		{{ form_start(profileInfosForm, {'attr': {'id': 'candidateForm', 'enctype': 'multipart/form-data'}}) }}

		{% for message in app.flashes('success') %}
			<div class="success">
				{{ message }}
			</div>
		{% endfor %}
		<section id="personal_infos">
			<h3>Your personal informations</h3>
			<div class="input-field">
				<span style='color:red'>{{ form_errors(profileInfosForm.gender) }}</span>
				{{ form_label(profileInfosForm.gender, 'Gender') }}
				{{ form_widget(profileInfosForm.gender, {'attr': {'class': 'select-field'}}) }}

			</div>
			<div class="input-field">
				<span style='color:red'>{{ form_errors(profileInfosForm.firstname) }}</span>
				{{ form_widget(profileInfosForm.firstname, {'attr': {'class': 'form-control'}}) }}
				{{ form_label(profileInfosForm.firstname, 'Firt name', {'label_attr': {'class': 'input_label'}}) }}

			</div>
			<div class="input-field">
				<span style='color:red'>{{ form_errors(profileInfosForm.lastname) }}</span>
				{{ form_widget(profileInfosForm.lastname, {'attr': {'class': 'form-control'}}) }}
				{{ form_label(profileInfosForm.lastname, 'Last name', {'label_attr': {'class': 'input_label'}}) }}

			</div>
			<div class="input-field">
				<span style='color:red'>{{ form_errors(profileInfosForm.location) }}</span>
				{{ form_widget(profileInfosForm.location, {'attr': {'class': 'form-control'}}) }}
				{{ form_label(profileInfosForm.location, 'Current location ', {'label_attr': {'class': 'input_label'}}) }}

			</div>
			<div class="input-field">
				<span style='color:red'>{{ form_errors(profileInfosForm.address) }}</span>
				{{ form_widget(profileInfosForm.address, {'attr': {'class': 'form-control'}}) }}
				{{ form_label(profileInfosForm.address, 'Address', {'label_attr': {'class': 'input_label'}}) }}

			</div>

			<div class="file-input-container  input-field">
				<label for="candidate_form_profilPicture_file" class="custom-button">
					<span>
						<i class="material-icons">insert_photo</i>
						Photo
					</span>
				</label>
				<div class="file-path-wrapper"></div>
				<span id="photoUpload" class="hidden-link photoUpload">
					<i class="material-icons">&#xE24D;</i>
					<a id="uploadedFileLink" href="#" target="_blank">Fichier téléchargé</a>
				</span>
				{{ form_widget(profileInfosForm.profilPicture, {'attr': {'class': 'hidden-input file_upload'}}) }}

			</div>

			<div class="input-field">
				<span style='color:red'>{{ form_errors(profileInfosForm.country) }}</span>
				{{ form_widget(profileInfosForm.country, {'attr': {'class': 'form-control'}}) }}
				{{ form_label(profileInfosForm.country, 'Country', {'label_attr': {'class': 'input_label'}}) }}

			</div>

			<div class="input-field">
				<span style='color:red'>{{ form_errors(profileInfosForm.nationality) }}</span>
				{{ form_widget(profileInfosForm.nationality, {'attr': {'class': 'form-control'}}) }}
				{{ form_label(profileInfosForm.nationality, 'Nationality', {'label_attr': {'class': 'input_label'}}) }}

			</div>

			<div class="input-field">
				<span style='color:red'>{{ form_errors(profileInfosForm.dateOfBirth) }}</span>
				{{ form_widget(profileInfosForm.dateOfBirth, {'attr': {'class': 'form-control'}}) }}
				{{ form_label(profileInfosForm.dateOfBirth, 'Birthdate', {'label_attr': {'class': 'input_label'}}) }}

			</div>

			<div class="input-field">
				<span style='color:red'>{{ form_errors(profileInfosForm.placeOfBirth) }}</span>
				{{ form_widget(profileInfosForm.placeOfBirth, {'attr': {'class': 'form-control'}}) }}
				{{ form_label(profileInfosForm.placeOfBirth, 'BirthPlace', {'label_attr': {'class': 'input_label'}}) }}

			</div>


			<h3>Your professional profile</h3>

			<div class="card">

				<div class="file-input-container input-field">

					<label for="candidate_form_passport_file" class="custom-button">
						<span>
							<i class="material-icons">&#xE24D;</i>
							Passport
						</span>
					</label>
					<div class="file-path-wrapper">
					</div>
					<span id="photoUpload" class="hidden-link photoUpload">
						<i class="material-icons">&#xE24D;</i>
						<a id="uploadedFileLink" href="#" target="_blank">Fichier téléchargé</a>
					</span>
					{{ form_widget(profileInfosForm.passport, {'attr': {'class': 'hidden-input file_upload'}}) }}

				</div>

				<div class="file-input-container input-field">


					<label for="candidate_form_resume_file" class="custom-button">
						<span>
							<i class="material-icons">&#xE24D;</i>
							CV
						</span>
					</label>
					<div class="file-path-wrapper"></div>
					<span id="photoUpload" class="hidden-link photoUpload">
						<i class="material-icons">&#xE24D;</i>
						<a id="uploadedFileLink" href="#" target="_blank">Fichier téléchargé</a>
					</span>
					{{ form_widget(profileInfosForm.resume, {'attr': {'class': 'hidden-input file_upload'}}) }}

				</div>
			</div>

			<div class="input-field job_sector">
				<span style='color:red'>{{ form_errors(profileInfosForm.jobCategory) }}</span>
				{{ form_label(profileInfosForm.jobCategory, 'Interest in job sector') }}
				{{ form_widget(profileInfosForm.jobCategory, {'attr': {'class': 'select-field'}}) }}
			</div>

			<div class="input-field experience">
				<span style='color:red'>{{ form_errors(profileInfosForm.experience) }}</span>
				{{ form_label(profileInfosForm.experience, 'Experience') }}
				{{ form_widget(profileInfosForm.experience, {'attr': {'class': 'select-field'}}) }}
			</div>

			<div class="input-field textarea-field">

				<span style='color:red'>{{ form_errors(profileInfosForm.description) }}</span>
				{{ form_widget(profileInfosForm.description, {'attr': {'class': 'materialize-textarea'}}) }}
				{{ form_label(profileInfosForm.description, 'Short description for your profile, as well as more personnal
          informations (e.g. your hobbies/interests ). You can also paste any link you want.', {'label_attr': {'class': 'input_label'}}) }}
			</div>
		</section>

		<section id="your_account">
			<h3>Your account</h3>


			<div class="input-field">
				{{ form_widget(profileInfosForm.user.plainPassword.first, {'attr': {'class': 'form-control'}}) }}
				{{ form_label(profileInfosForm.user.plainPassword.first, 'Change your password', {'label_attr': {'class': 'input_label'}}) }}
				<span style='color:red'>{{ form_errors(profileInfosForm.user.plainPassword.first) }}</span>
			</div>

			<div class="input-field">
				{{ form_widget(profileInfosForm.user.plainPassword.second, {'attr': {'class': 'form-control'}}) }}
				{{ form_label(profileInfosForm.user.plainPassword.second, 'Confirm your new password', {'label_attr': {'class': 'input_label'}}) }}
			</div>

			<div id="delete_account" class="align-center">
				<a href="{{ path('app_candidate_delete') }}" class="btn">
					<i class="material-icons">&#xE872;</i>Delete my account
				</a>
			</div>

			<div id="back_home" class="align-center">
				<a href="{{ path('app_home') }}" class="btn">
					<i class="fa fa-long-arrow-left"></i>
					Back home</a>
			</div>

			<div id="update_account" class="align-center">
				<button type="submit" class="btn cta_golden">
					<span>
						<strong>UPDATE</strong>
						NOW</span>
				</button>
			</div>
		</section>
		{{ form_end(profileInfosForm) }}
	</main>
{% endblock %}