<div class="row no-gutters align-items-center">
	<div class="col-10">
		<div class="document-structure">
			<div class="page-header">
				<span class="page-number">{{page.numbering}}</span>
				<span class="page-title">{{page.title}}</span>
			</div>
		</div>
	</div>
	<div class="col-2">
		{{#unless (eq document.protection constants.ProtectionType.Lock)}}
			<div class="document-structure">
				<div class="page-toolbar" id="page-toolbar-{{ page.id }}">
					<div class="float-right">
						{{#if canEdit}}
							<div id="page-edit-button-{{page.id}}" class="button-icon-gray align-middle d-none d-md-inline-block" {{action 'onEdit'}}>
								<i class="material-icons">mode_edit</i>
							</div>
						{{/if}}
						{{#if hasMenuPermissions}}
							<div class="button-icon-gap" />
							<div id="page-menu-button-{{page.id}}" class="button-icon-gray align-middle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
								<i class="material-icons">more_vert</i>
							</div>
							<div class="dropdown-menu dropdown-menu-right" aria-labelledby="page-menu-button-{{page.id}}">
								{{#if canEdit}}
									<a class="dropdown-item" href="#" id={{concat 'edit-page-button-' page.id}} {{action 'onEdit'}}>Edit</a>
								{{/if}}
								{{#if permissions.documentCopy}}
									<a class="dropdown-item" href="#" id={{concat 'copy-page-button-' page.id}} data-toggle="modal" data-target={{concat '#copy-page-modal-' page.id}} data-backdrop="static">Copy</a>
								{{/if}}
								{{#if canMove}}
									<a class="dropdown-item" href="#" id={{concat 'move-page-button-' page.id}} data-toggle="modal" data-target={{concat '#move-page-modal-' page.id}} data-backdrop="static">Move</a>
								{{/if}}
								{{#if permissions.documentTemplate}}
									<a class="dropdown-item" href="#" id={{concat 'publish-page-button-' page.id}} data-toggle="modal" data-target={{concat '#publish-page-modal-' page.id}} data-backdrop="static">Publish</a>
								{{/if}}
								{{#if canDelete}}
									<a class="dropdown-item text-danger" href="#" id={{concat 'delete-page-button-' page.id}} data-toggle="modal" data-target={{concat '#delete-page-modal-' page.id}} data-backdrop="static">Delete</a>
								{{/if}}
							</div>
						{{/if}}
					</div>
				</div>
			</div>
		{{/unless}}
	</div>
</div>

{{#if permissions.documentCopy}}
	<div id={{concat 'copy-page-modal-' page.id}} class="modal" tabindex="-1" role="dialog">
		<div class="modal-dialog" role="document">
			<div class="modal-content">
				<div class="modal-header">Copy Section</div>
				<div class="modal-body">
					<div class="form-group">
						<label>Destination Document</label>
						{{focus-input type="text" value=docSearchFilter class="form-control mb-4" placeholder='a OR b, x AND y, "phrase mat*"'}}				
					</div>
					<div class="my-5 document-copy-move">
						{{#if emptySearch}}
							<p>No matching documents found.</p>
						{{/if}}
						<ul class="documents-list">
							{{#each docSearchResults key="id" as |result index|}}
								<li class="document {{if result.selected 'selected'}}" {{action 'onSelectSearchResult' result.documentId}}>
									<div class="title">{{result.document}}</div>
									<div class="space">{{result.space}}</div>
									<div class="snippet">{{result.excerpt}}</div>
									{{#if result.selected}}
										<i class="material-icons">check</i>
									{{/if}}
								</li>
							{{/each}}
						</ul>
					</div>
				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-outline-secondary" data-dismiss="modal">Cancel</button>
					<button type="button" class="btn btn-success" onclick={{action 'onCopyPage'}}>Copy</button>
				</div>
			</div>
		</div>
	</div>
{{/if}}

{{#if permissions.documentMove}}
	<div id={{concat 'move-page-modal-' page.id}} class="modal" tabindex="-1" role="dialog">
		<div class="modal-dialog" role="document">
			<div class="modal-content">
				<div class="modal-header">Move Section</div>
				<div class="modal-body">
					<div class="form-group">
						<label>Destination Document</label>
						{{focus-input type="text" value=docSearchFilter class="form-control mb-4" placeholder='a OR b, x AND y, "phrase mat*"'}}				
					</div>
					<div class="my-5 document-copy-move">
						{{#if emptySearch}}
							<p>No matching documents found.</p>
						{{/if}}
						<ul class="documents-list">
							{{#each docSearchResults key="id" as |result index|}}
								<li class="document {{if result.selected 'selected'}}" {{action 'onSelectSearchResult' result.documentId}}>
									<div class="title">{{result.document}}</div>
									<div class="space">{{result.space}}</div>
									<div class="snippet">{{result.excerpt}}</div>
									{{#if result.selected}}
										<i class="material-icons">check</i>
									{{/if}}
								</li>
							{{/each}}
						</ul>
					</div>
				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-outline-secondary" data-dismiss="modal">Cancel</button>
					<button type="button" class="btn btn-success" onclick={{action 'onMovePage'}}>Move</button>
				</div>
			</div>
		</div>
	</div>
{{/if}}

{{#if permissions.documentDelete}}
	<div id= {{concat 'delete-page-modal-' page.id}} class="modal" tabindex="-1" role="dialog">
		<div class="modal-dialog" role="document">
			<div class="modal-content">
				<div class="modal-header">Delete Section</div>
				<div class="modal-body">
					<p>Are you sure you want to delete this section?</p>
					<div class="form-group">
						<div class="form-check">
							{{input type="checkbox" class="form-check-input" checked=deleteChildren  id=(concat 'delete-page-check-' page.id)}}
							<label class="form-check-label" for= {{concat 'delete-page-check-' page.id}}>
								Also delete child sections
							</label>
						</div>
					</div>
				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-outline-secondary" data-dismiss="modal">Cancel</button>
					<button type="button" class="btn btn-danger" onclick= {{action 'onDeletePage'}}>Delete</button>
				</div>
			</div>
		</div>
	</div>
{{/if}}

{{#if permissions.documentTemplate}}
	<div id={{concat 'publish-page-modal-' page.id}} class="modal" tabindex="-1" role="dialog">
		<div class="modal-dialog" role="document">
			<div class="modal-content">
				<div class="modal-header">Publish Reusable Content Block</div>
				<div class="modal-body">
					<div class="form-group">
						<label for="block-title-{{page.id}}">Name</label>
						{{input id=(concat 'block-title-' page.id) type='text' class="form-control mousetrap" placeholder="Enter name" value=blockTitle}}
						<small class="form-text text-muted">Provide a short title for the reusable content block</small>
					</div>
					<div class="form-group">
						<label for="block-desc-{{page.id}}">Description</label>
						{{textarea id=(concat 'block-desc-' page.id) rows="3" class="form-control mousetrap" placeholder="Enter description" value=blockExcerpt}}
						<small class="form-text text-muted">Short description to help others understand the reusable content block</small>
					</div>
				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-outline-secondary" data-dismiss="modal">Cancel</button>
					<button type="button" class="btn btn-success" onclick={{action 'onSavePageAsBlock'}}>Publish</button>
				</div>
			</div>
		</div>
	</div>
{{/if}}