extends ../layout

block scripts
	script(type="text/javascript").
		window.data = {
			projects: !{projects},
			tags: !{tags}
		};

	script(src=jsPath+'project-list.js')

block content
	.content.content-alt(ng-app="ProjectPageApp", ng-controller="ProjectPageController")
		.container
			.row
				.col-md-2
					#newProject.dropdown
						a.btn.btn-primary.dropdown-toggle(data-toggle="dropdown", href="#") New Project
						ul.dropdown-menu(role="menu")
							li
								a#blankNewProject(href="#", data-csrf=csrfToken) Blank Project
							li
								a#newProjectExample(href="#", data-csrf=csrfToken) Example Project
							li
								a#uploadNewProject(href="#", data-csrf=csrfToken) Upload Project
							li.divider
							li.dropdown-header Templates
							li
								a.menu-indent(href="/templates/cv") CV or Resume
							li
								a.menu-indent(href="/templates/cover-letters") Cover Letter
							li
								a.menu-indent(href="/templates/journals") Journal Article
							li
								a.menu-indent(href="/templates/presentations") Presentation
							li
								a.menu-indent(href="/templates/thesis") Thesis
							li
								a.menu-indent(href="/templates/bibliographies") Bibliographies
							li
								a.menu-indent(href="/templates") View All »
					.row-spaced
						ul.list-unstyled.folders-menu.js-folders-menu(ng-controller="TagListController")
							li(ng-class="{active: (view == 'all')}")
								a.menu-indent(href="#", ng-click="selectAllProjects()") All projects
							//- li
							//- 	a.menu-indent(href="#") Your projects
							//- li
							//- 	a.menu-indent(href="#") Shared with you
							li 
								h2 Folders
							li(
								ng-repeat="tag in tags",
								ng-controller="TagListItemController",
								ng-class="{active: tag.selected}"
							)
								a.menu-indent(href="#", ng-click="selectTag()")
									i.icon.fa(
										ng-class="{'fa-folder-open-o': tag.selected, 'fa-folder-o': !tag.selected}"
									)
									|  {{tag.name}} 
								span.small ({{tag.project_ids.length}})

					.row-spaced-small
						ul.list-unstyled.folders-menu
							li
								a.menu-indent(href="#")
									i.icon.fa.fa-plus
									|  New Folder

					-if (settings.enableSubscriptions)
						.row-spaced
							a(href="/user/bonus").btn.btn-info Upgrade Account

				.col-md-10
					.container-fluid
						.row
							.col-md-12
								form.project-search.form-horizontal(role="form")
									.form-group.has-feedback.col-md-7
										input.form-control.col-md-7(
											placeholder='Search projects…',
											autofocus='autofocus',
											ng-model="searchText"
										)
										i.fa.fa-search.form-control-feedback
									//- i.fa.fa-remove

								.project-tools.js-toggle-tools
									.btn-toolbar
										.btn-group(ng-hide="selectedProjects.length < 1")
											a.btn.btn-default(
												href='#',
												data-original-title="Download",
												data-toggle="tooltip",
												data-placement="bottom",
												title=""
											)
												i.fa.fa-cloud-download
											a.btn.btn-default(
												href='#',
												data-original-title="Delete",
												data-toggle="tooltip",
												data-placement="bottom",
												ng-click="deleteSelectedProjects()"
											)
												i.fa.fa-trash-o

										.btn-group(ng-hide="selectedProjects.length < 1")
											a.btn.btn-default.dropdown-toggle(
												href="#",
												data-toggle="dropdown"
											)
												i.fa.fa-folder-open-o
												|  
												span.caret
											ul.dropdown-menu.dropdown-menu-right.js-tags-dropdown-menu(
												role="menu"
											)
												li.dropdown-header Add to folder
												li(
													ng-repeat="tag in tags | orderBy:'name'",
													ng-controller="TagDropdownItemController"
												)
													a(href="#", ng-click="addOrRemoveProjectsFromTag()")
														i.fa(
															ng-class="{\
																'fa-check-square-o': areSelectedProjectsInTag,\
																'fa-square-o': !areSelectedProjectsInTag\
															}"
														)
														|  {{tag.name}}
												li.divider
												li
													a(href="#", ng-click="openNewTagModal()") Create New Folder

										.btn-group(ng-hide="selectedProjects.length != 1")
											a.btn.btn-default.dropdown-toggle(
												href='#',
												data-toggle="dropdown"
											) More 
												span.caret
											ul.dropdown-menu.dropdown-menu-right(role="menu")
												li
													a(
														href='#',
														ng-click="openRenameProjectModal()"
													) Rename
						.row.row-spaced
							.col-md-12
								.card.card-thin
									- if (projects.length > 0)
										ul.list-unstyled.project-list
											li.container-fluid
												.row
													.col-md-6
														input.select-all(type="checkbox", ng-model="allSelected", ng-change="onSelectAllChange()")
														span.title TITLE
													.col-md-2
														span.owner OWNER
													.col-md-4
														span.last-modified LAST MODIFIED
											li.project_entry.container-fluid(
												ng-repeat="project in visibleProjects | orderBy:'lastUpdated':true",
												ng-controller="ProjectListItemController"
											)
												.row
													.col-md-6
														input.select-item(type="checkbox", ng-model="project.selected", ng-change="onSelectedChange()")
														span.title
															a.projectName(href="/project/{{project.id}}") {{project.name}}
														span
															span.label.label-default(ng-repeat='tag in project.tags')
																| {{tag.name}}
													.col-md-2
														span.owner {{project.publicAccesLevel}}
													.col-md-4
														span.last-modified.isoDate {{project.lastUpdated | formatDate}}
									- else
										.row
											.span12
												.welcome
													h1
														i.fa.fa-arrow-left
														| Welcome! Follow the arrow to get started
													p New to LaTeX? Start by having a look at our
														a(href="/templates")  templates
														|  or
														a(href="/learn")  help guides
														| .

		script(type='text/ng-template', id='newTagModalTemplate')
			.modal-header
				h3 Create New Folder
			.modal-body
				input.form-control(
					type="text",
					placeholder="New Folder Name",
					ng-model="inputs.newTagName",
					ng-enter="create()",
					ng-focus-on="open"
				)
			.modal-footer
				button.btn.btn-default(ng-click="cancel()") Cancel
				button.btn.btn-primary(ng-click="create()") Create

		script(type='text/ng-template', id='renameProjectModalTemplate')
			.modal-header
				h3 Rename Project
			.modal-body
				input.form-control(
					type="text",
					placeholder="Project Name",
					ng-model="inputs.projectName",
					ng-enter="rename()",
					ng-focus-on="open"
				)
			.modal-footer
				button.btn.btn-default(ng-click="cancel()") Cancel
				button.btn.btn-primary(ng-click="rename()") Rename