{{#toolbar/t-toolbar}}

	{{#toolbar/t-links selectItem="spaces"}}
	{{/toolbar/t-links}}

	{{#toolbar/t-actions}}
		{{#if spaceSettings}}
			<div id="space-settings-button" class="button-icon-gray align-middle" data-toggle="tooltip" data-placement="top" title="Set permissions">
				<i class="material-icons" data-toggle="modal" data-target="#space-permission-modal" data-backdrop="static">security</i>
			</div>
			<div class="button-icon-gap" />
			<div id="space-invite-button" class="button-icon-gray align-middle" data-toggle="tooltip" data-placement="top" title="Invite to space">
				<i class="material-icons" data-toggle="modal" data-target="#space-invite-modal" data-backdrop="static">person_add</i>
			</div>
			<div class="button-icon-gap" />
			<div id="space-invite-modal" class="modal" tabindex="-1" role="dialog">
				<div class="modal-dialog" role="document">
					<div class="modal-content">
						<div class="modal-header">Space Invitation</div>
						<div class="modal-body">
							<form onsubmit={{action 'onSpaceInvite'}}>
								<div class="form-group">
									<label for="space-invite-email">Email for space invitation</label>
									{{input id="space-invite-email" type='email' class="form-control mousetrap" placeholder="Enter email" value=inviteEmail}}
									<small class="form-text text-muted">Comma separate multiple email addresses</small>
								</div>
								<div class="form-group">
									<label for="space-invite-msg">Message explaining space invitation</label>
									{{textarea id="space-invite-msg" value=inviteMessage class="form-control" rows="5"}}
								</div>
							</form>
						</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 'onSpaceInvite'}}>Invite</button>
						</div>
					</div>
				</div>
			</div>
		{{/if}}

		{{#if permissions.documentTemplate}}
			<div id="space-template-button" class="button-icon-gray align-middle" data-toggle="tooltip" data-placement="top" title="Manage templates">
				<i class="material-icons" data-toggle="modal" data-target="#space-template-modal" data-backdrop="static">content_copy</i>
			</div>
			<div class="button-icon-gap" />
			<div id="space-template-modal" class="modal" tabindex="-1" role="dialog">
				<div class="modal-dialog" role="document">
					<div class="modal-content">
						<div class="modal-header">Manage Templates</div>
						<div class="modal-body">
							<div class="widget-list-picker">
								<ul class="options">
									{{#each templates as |item|}}
										<li class="option {{if item.selected 'selected'}}" {{action 'onSelectTemplate' item}}>
											<div class="text text-truncate">
												{{item.title}}<br/>{{item.description}}
											</div>
											{{#if item.selected}}
												<i class="material-icons">check</i>
											{{/if}}
										</li>
									{{else}}
										No document templates
									{{/each}}
								</ul>
							</div>
						</div>
						<div class="modal-footer">
							<button type="button" class="btn btn-outline-secondary" data-dismiss="modal">Close</button>
							{{#if templates}}
								<button type="button" class="btn btn-success" onclick={{action 'onOpenTemplate'}}>Open</button>
							{{/if}}
						</div>
					</div>
				</div>
			</div>
		{{/if}}

		{{#if permissions.spaceOwner}}
			<div id="space-delete-button" class="button-icon-danger align-middle" data-toggle="tooltip" data-placement="top" title="Delete space">
				<i class="material-icons" data-toggle="modal" data-target="#space-delete-modal" data-backdrop="static">delete</i>
			</div>
			<div class="button-icon-gap" />
			<div id="space-delete-modal" class="modal" tabindex="-1" role="dialog">
				<div class="modal-dialog" role="document">
					<div class="modal-content">
						<div class="modal-header">Space Deletion</div>
						<div class="modal-body">
							<form onsubmit={{action 'onSpaceDelete'}}>
								<p>Are you sure you want to delete this space and all documents?</p>
								<div class="form-group">
									<label for="delete-space-name">Please type space name to confirm</label>
									{{input type='text' id="delete-space-name" class="form-control mousetrap" placeholder="Space name" value=deleteSpaceName}}
									<small class="form-text text-muted">This will delete all documents and templates within this space!</small>
								</div>
							</form>
						</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 'onSpaceDelete'}}>Delete</button>
						</div>
					</div>
				</div>
			</div>
		{{/if}}

		{{#if pinState.isPinned}}
			<div id="space-pin-button" class="button-icon-gold align-middle" data-toggle="tooltip" data-placement="top" title="Remove favorite" {{action 'onUnpin'}}>
				<i class="material-icons">star</i>
			</div>
			<div class="button-icon-gap" />
		{{else if session.authenticated}}
			<div id="space-pin-button" class="button-icon-gray align-middle" data-toggle="tooltip" data-placement="top" title="Save favorite" {{action 'onPin'}}>
				<i class="material-icons">star</i>
			</div>
			<div class="button-icon-gap" />
		{{/if}}

		{{#if permissions.documentAdd}}
			<div class="btn-group" role="group">
				<button id="btnGroupDocument" type="button" class="btn btn-success font-weight-bold dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">+ DOCUMENT</button>
				<div class="dropdown-menu dropdown-menu-right" aria-labelledby="btnGroupDocument">
					<a class="dropdown-item" href="#" {{action 'onShowEmptyDocModal'}}>Empty document</a>
					{{#if hasTemplates}}
						<a class="dropdown-item" href="#" {{action 'onShowTemplateDocModal'}}>From template</a>
					{{/if}}
					<a class="dropdown-item" href="#" {{action 'onShowImportDocModal'}}>Import files</a>
				</div>
			</div>
			<div id="empty-doc-modal" class="modal" tabindex="-1" role="dialog">
				<div class="modal-dialog" role="document">
					<div class="modal-content">
						<div class="modal-header">Empty Document</div>
						<div class="modal-body">
							<form onsubmit={{action 'onAddEmptyDoc'}}>
								<div class="form-group">
									<label for="empty-doc-name">Document Name</label>
									{{input id="empty-doc-name" type="text" value=emptyDocName placeholder="Enter name" class=(if emptyDocNameError 'form-control mousetrap is-invalid' 'form-control mousetrap') autocomplete="off"}}
								</div>
							</form>
						</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 'onAddEmptyDoc'}}>Add</button>
						</div>
					</div>
				</div>
			</div>
			<div id="template-doc-modal" class="modal" tabindex="-1" role="dialog">
				<div class="modal-dialog" role="document">
					<div class="modal-content">
						<div class="modal-header">Document From Template</div>
						<div class="modal-body">
							<form onsubmit={{action 'onAddTemplateDoc'}}>
								<div class="form-group">
									<label for="template-doc-name">Document Name</label>
									{{input id="template-doc-name" type="text" value=templateDocName placeholder="Enter name" class=(if templateDocNameError 'form-control mousetrap is-invalid' 'form-control mousetrap') autocomplete="off"}}
								</div>
								<div class="widget-list-picker">
									<ul class="options">
										{{#each templates as |item|}}
											<li class="option {{if item.selected 'selected'}}" {{action 'onSelectTemplate' item}}>
												<div class="text text-truncate">
													{{item.title}}<br/>{{item.description}}
												</div>
												{{#if item.selected}}
													<i class="material-icons">check</i>
												{{/if}}
											</li>
										{{/each}}
									</ul>
								</div>
							</form>
						</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 'onAddTemplateDoc'}}>Add</button>
						</div>
					</div>
				</div>
			</div>
			<div id="import-doc-modal" class="modal" tabindex="-1" role="dialog">
				<div class="modal-dialog" role="document">
					<div class="modal-content">
						<div class="modal-header">Import Documents</div>
						<div class="modal-body">
							<div class="import-zone">
								<button id="import-document-button" type="button" class="btn btn-outline-secondary btn-lg btn-block">
									<br/>
									Click to select files or drag-drop files
									<br/><br/>
									.doc, .docx, .md, .markdown
									<br/><br/>
								</button>
								<div class="import-status">
									{{#each importStatus as |status|}}
										<p>{{status}}</p>
									{{/each}}
								</div>
							</div>
						</div>
						<div class="modal-footer">
							<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
						</div>
					</div>
				</div>
			</div>
		{{/if}}
	{{/toolbar/t-actions}}

{{/toolbar/t-toolbar}}

{{folder/permission-admin folders=spaces folder=space onRefresh=onRefresh}}