extends ../../layout

block vars
	- var suppressFooter = true
	- var suppressSkipToContent = true

block content

	script(type="template", id="overleaf-token-access-data")!= StringHelper.stringifyJsonForScript({ postUrl: postUrl, csrfToken: csrfToken})

	div(
		ng-controller="TokenAccessPageController",
		ng-init="post()"
	)
		.editor.full-size
			div
				| &nbsp;
				a(href="/project", style="font-size: 2rem; margin-left: 1rem; color: #ddd;")
					i.fa.fa-arrow-left

			.loading-screen(
				ng-show="mode == 'accessAttempt'"
			)
				.loading-screen-brand-container
					.loading-screen-brand()

				h3.loading-screen-label.text-center
					| #{translate('join_project')}
					span(ng-show="accessInFlight == true")
						span.loading-screen-ellip .
						span.loading-screen-ellip .
						span.loading-screen-ellip .


				.global-alerts.text-center(ng-cloak)
					div(ng-show="accessError", ng-cloak)
						br
						div(ng-switch="accessError", ng-cloak)
							div(ng-switch-when="not_found")
								h4(aria-live="assertive")
									| Project not found

							div(ng-switch-default)
								.alert.alert-danger(aria-live="assertive") #{translate('token_access_failure')}
								p
									a(href="/") #{translate('home')}

			.loading-screen(
				ng-show="mode == 'v1Import'"
			)
				.container
					.row
						.col-sm-8.col-sm-offset-2
							h1.text-center
								span(ng-if="v1ImportData.status != 'mustLogin'") Overleaf v1 Project
								span(ng-if="v1ImportData.status == 'mustLogin'") Please Log In
							img.v2-import__img(
								src="/img/v1-import/v2-editor.png"
								alt="The new V2 editor."
							)

							div(ng-if="v1ImportData.status == 'cannotImport'")
								h2.text-center
									| Cannot Access Overleaf v1 Project
								p.text-center.row-spaced-small
									| Please contact the project owner or
									|
									a(href="/contact") contact support
									|
									| for assistance.

							div(ng-if="v1ImportData.status == 'mustLogin'")
								p.text-center.row-spaced-small
									| You will need to log in to access this project.

								.row-spaced.text-center
									a.btn.btn-primary(
										href="/login?redir={{ currentPath() }}"
									) Log In To Access Project

							div(ng-if="v1ImportData.status == 'canDownloadZip'")
								p.text-center.row-spaced.small
									| #[strong() {{ getProjectName() }}] has not yet been moved into
									| the new version of Overleaf. This project was created
									| anonymously and therefore cannot be automatically imported.
									| Please download a zip file of the project and upload that to
									| continue editing it. If you would like to delete this project
									| after you have made a copy, please contact support.

								.row-spaced.text-center
									a.btn.btn-primary(ng-href="{{ buildZipDownloadPath(v1ImportData.projectId) }}")
										| Download project zip file

			.loading-screen(
				ng-show="mode == 'requireAccept'"
			)
				.container
					.row
						.col-md-8.col-md-offset-2
							.card
								.page-header.text-centered
									h1 #{translate("invited_to_join")}
										br
										em {{ getProjectName() }}
								.row.text-center
									.col-md-12
										p
											if user
												| #{translate("accepting_invite_as")}
												|
												em #{user.email}
								.row.text-center
									.col-md-12
											button.btn.btn-lg.btn-primary(
												type='submit'
												ng-click="postConfirmedByUser()"
											) #{translate("join_project")}


block append foot-scripts
	script(type="text/javascript", nonce=scriptNonce).
		$(document).ready(function () {
			setTimeout(function() {
				$('.loading-screen-brand').css('height', '20%')
			}, 500);
		});
