<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags" %>

<spring:url value="/resources/static/css/projects.css" var="projectsCss" />
<link href="${projectsCss}" rel="stylesheet" />

<div class="container">
    <div class="feedback">
        <div class="alert alert-success general-success" role="alert">
            <span class="glyphicon glyphicon-ok" aria-hidden="true"></span>
            <span><strong>Success: </strong></span>
            <span class="text"></span>
            <span class="glyphicon glyphicon-remove"></span>
        </div>

        <div class="alert alert-danger general-error" role="alert">
            <span class="glyphicon glyphicon-exclamation-sign" aria-hidden="true"></span>
            <span class="sr-only">Error:</span>
            <span class="text"></span>
            <span class="glyphicon glyphicon-remove"></span>
        </div>
    </div>

    <div class="projects-list"></div>

    <button type="button" class="btn btn-info add-project-btn" data-toggle="modal" data-target="#add-project-modal">
        <span class="glyphicon glyphicon-plus"></span>
        Add a new project
    </button>

    <!-- modal add project -->
    <div class="modal fade" id="add-project-modal" tabindex="-1" role="dialog" aria-labelledby="#add-project-modal-label">
        <div class="modal-dialog">
            <div class="modal-content">
                <form id="add-project-form" action="#">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                        <h4 class="modal-title" id="add-project-modal-label">New project</h4>
                    </div>

                    <div class="modal-body">
                        <input type="text" name="projectName" id="projectName" class="form-control" placeholder="Project name" required maxlength="30" />
                        <input type="text" name="role" id="role" class="form-control" placeholder="Your role" required maxlength="30" />
                    </div>

                    <div class="modal-footer">
                        <button type="button" id="add-project-close" class="btn btn-default" data-dismiss="modal">Cancel</button>
                        <button type="submit" id="add-project-btn" class="btn btn-primary">Create project</button>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>

<spring:url value="/resources/static/js/projects.js" var="projectsJs" />
<script src="${projectsJs}"></script>