{{/*
This file is part of SystemTestPortal.
Copyright (C) 2017  Institute of Software Technology, University of Stuttgart

SystemTestPortal is free software: you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.

SystemTestPortal is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
GNU General Public License for more details.

You should have received a copy of the GNU General Public License
along with SystemTestPortal.  If not, see <http://www.gnu.org/licenses/>.
*/}}

{{define "content"}}
<div class="row searchbar">
	<div class="col-12">
		<form role="search" class="search-form">
			<label class="sr-only">Search</label>
			<div class="input-group flex-nowrap">
				<input type="search" name="s" class="order-1 search-field form-control float-left" placeholder="Search..."  data-toggle="tooltip" data-placement="bottom"
					   title="" data-original-title="This feature will be available in a future version">
				{{ if .LoggedIn }}
				<a class="order-3 btn btn-primary align-middle ml-4 float-right" href="/user/projects/new">
					+ <span class="d-none d-sm-inline">New Project</span>
				</a>
				{{ end }}
				<span class="order-2 input-group-btn">
					<button class="search-submit btn btn-outline-success disabled" disabled  data-toggle="tooltip" data-placement="bottom"
							title="" data-original-title="This feature will be available in a future version">
						<i class="fa fa-search" aria-hidden="true"></i>
						<span class="d-none d-sm-inline"> Search</span>
					</button>
				</span>
			</div>
		</form>
	</div>
</div>
<div class="card">
	<div class="m-4">
		<ul class="list-group">
			{{ range .Projects }}
			<li class="list-group-item projectLine" id="{{ .ID }}">
				<div class="row">
					<div class="col-sm-2 d-none d-sm-block">
						<div class="d-flex project-small-thumbnail">
							<img src="/static/img/placeholder.png" alt="project logo">
							<div class="project-thumbnail-background"></div>
							<div class="project-thumbnail-content"></div>
							<div id="project-thumbnail-letter">P</div>
						</div>
					</div>
					<div class="col-xs-12 col-sm-10">
						<div class="card-block">
							<span class="d-none d-sm-block float-right badge badge-secondary"><span>created </span><time class="timeago" datetime="">{{ .CreationDate }}</time></span>
							<h4 class="card-title">{{ .Owner }}{{ .Name }}</h4>
							<p class="card-text font-italic">{{ .Description }}</p>
						</div>
					</div>
				</div>
			</li>
			{{ else }}
			<!-- Placeholder -->
			<p class="text-center empty-project-list">
				<span>This list contains all visible projects. Currently, there are no projects.</span><br/><br/>
				<a class="btn btn-primary align-middle" href="/user/projects/new">
					<span>New Project</span>
				</a>
			</p>
			{{ end }}
		</ul>
	</div>
</div>
<script type='text/javascript'>
    $(".projectLine").click(function(event){useProjectLink(event)});

    jQuery(document).ready(function($) {
        $("#menuExploreProjects").addClass("disabled active");
        $("#navbarExploreProjects").addClass("disabled active");
    });

    $('.timeago').each(function(i, obj) {
        var timeString = $(this).text();
        timeString = timeString.replace(" ", 'T');
        timeString = timeString.replace(" ", '');
        timeString = timeString.replace(" CET", '');
        $(this).text(timeString);
        $(this).attr("datetime", timeString);
    });
    jQuery("time.timeago").timeago();
</script>
{{end}}

