path: root/views/project.ejs



<% include header %>

</head>
<body>
    <% include navbar %>

    <!-- Wrapper
    ================================================== -->
    <div class="container" id="wrapper">
    <div class="row-fluid">
        <div class="span6 smallfullwidth">
            <div class="row-fluid">
                <div class="span2 info text-right">
                    prosjekt
                </div>
                <div class="span10">
                    <h1><%= project.name %></h1>
                </div>
            </div>
            <div class="row-fluid">
                <div class="span2 info text-right">
                    opprettet
                </div>
                <div class="span10">
                    <p>
                        <% var d = new Date(project.created); %>
                        <%= d.getFullYear() + '-' + ('0' + (d.getMonth()+1)).slice(-2) + '-' + ('0' + d.getDate()).slice(-2) + ' ' + d.toLocaleTimeString().slice(0, 5) %>
                    </p>
                </div>
            </div>
            <div class="row-fluid">
                <div class="span2 info text-right">
                    deltakere
                </div>
                <div class="span10">
                    <% access.forEach(function(participants) { %>
                        <%- participants.user.name %><% if (participants.permissions >= 6) { %> <span class="muted">(<%= participants.permissions === 9 ? 'eier' : 'admin' %>)</span><% } %><br>
                    <% }); %>
                    <small><a href="/project/<%= project.shortURL %>/participants">Legg til flere deltakere</a></small>
                </div>
            </div>
            <div class="row-fluid">
                <div class="span10 offset2">
                    <a class="btn btn-large" href="/project/<%= project.shortURL %>/post">Før utgift</a>
                </div>
            </div>
        </div><!-- /div.span6 -->


        <div class="span6 smallfullwidth" id="accordion">
            <section class="status">
                <div class="row-fluid">
                    <div class="span6 smallfullwidth">
                        <h2>Status total</h2>
                    </div>
                    <div class="span6 smallfullwidth">
                        <div class="row-fluid">
                                <table class="table table-bordered table-condensed">
                                    <tr>
                                        <td class="success"><%= pro.user[req.user._id].total %></td>
                                        <td class="error"><%= pro.total %></td>
                                        <td><%= pro.user[req.user._id].diff %></td>
                                    </tr>
                                </table><a href="#table-info" class="accordion-toggle" data-toggle="collapse"><i class="icon-info-sign"></i></a>
                        </div>
                    </div>
                </div>
                <div class="row-fluid accordion-body collapse" id="table-info">
                    <p>Det er til sammen brukt <strong><%= (pro.total).toFixed(2) %></strong> <%= project.currency %>. Deltakerne skal altså betale <strong><%= (pro.each).toFixed(2) %></strong> <%= project.currency %> hver.</p>
                    <% for (var i in pro.user) { %>
                        <%- pro.user[i].name %> har betalt <%= pro.user[i].total %> <%= project.currency %>, og <%- pro.user[i].diff >= 0 ? 'skyldes <span class="text-success">' + pro.user[i].diff : 'skylder <span class="text-error">' + Math.abs(pro.user[i].diff) %></span> <%= project.currency %><br>
                    <% } %>
                    <p><small><a href="#example" data-toggle="collapse" class="accordion-toggle">Eksempel på hvordan oppgjøret kan gjøres</a></small></p>
                </div>
                <div class="row-fluid collapse" id="example">
                    <table>
                    <%
                    // FUGLY LAST-MINUTE CODE
                    var i = 1;
                    for (var u in pro.user) {
                        if (pro.user[u].coeff === 0) {
                            if (i === 1) {%>
                            <tr>
                                <td></td>
                            <% for (var p in pro.user) { %>
                                <%- pro.user[p].coeff > 0 ? '<td>' + pro.user[p].name + '</td>' : '' %>
                            <% } %>
                            </tr>
                            <% } %>
                            <tr>
                                <td><%- pro.user[u].name %></td>
                            <% for (var p in pro.user) { %>
                                <%- pro.user[p].coeff > 0 ? '<td>' + (Math.abs(pro.user[u].diff) * pro.user[p].coeff).toFixed(2) + '</td>' : '' %>
                            <% } %>
                            </tr>
<%                          i++;
                        }} %>
                    </table>

                </div>
                <div class="row-fluid accordion-body in collapse" id="chart">
                    <canvas id="myChart" width="450" height="200"></canvas>
                </div>
            </section>
        </div>
    </div>


    <div class="row-fluid">
        <div class="span12 smallfullwidth">
            <section class="overview">
                <h2>Siste aktivitet</h2>
                <div class="lastactivity" id="lastactivity">
                    <% posts.forEach(function(post) { %>
                        <div class="row-fluid post-<%= post._id %> activity">
                            <div class="row-fluid">
                                <div class="span1 date">
                                    <%
                                        var d = new Date(post.when);
                                        var month = ['JAN', 'FEB', 'MAR', 'APR', 'MAI', 'JUN', 'JUL', 'AUG', 'SEP', 'OKT', 'NOV', 'DES'];
                                    %>
                                    <div class="row-fluid"><%= d.getDate() %></div>
                                    <div class="row-fluid info"><%= month[d.getMonth()] %></div>
                                    <div class="row-fluid"><a href="#details-<%= post._id %>" data-toggle="collapse" class="no-text-decoration" data-parent="#lastactivity">&#9660;</a></div>
                                </div>
                                <div class="span6">
                                    <div class="row-fluid">
                                        <div class="span2 info text-right smallfullwidth">av</div>
                                        <div class="span10 smallfullwidth"><%- post.user.name %></div>
                                    </div>
                                    <div class="row-fluid">
                                        <div class="span2 info text-right smallfullwidth">hva</div>
                                        <div class="span10 smallfullwidth"><%= post.what %></div>
                                    </div>
                                </div>
                                <div class="span2">
                                    <div class="row-fluid">
                                        &nbsp;
                                    </div>
                                </div>
                                <div class="span2">
                                   <div class="row-fluid text-right">
                                        <span class="info">sum</span> 
                                        <strong><%= post.value %> <%= post.currency %></strong>
                                    </div>
                                    <div class="row-fluid text-right">
                                        <i class="icon-picture"></i>
                                    </div>
                                </div>
                            </div>
                            <div class="fluid-row collapse details" id="details-<%= post._id %>">
                                <div class="span7">
                                    <div class="row-fluid">
                                        <div class="span2 info text-right smallfullwidth">kommentar</div>
                                        <div class="span10">
                                            <%= post.comment %>
                                        </div>
                                    </div>
                                </div>
                                <% if (String(post.user._id) === String(req.user._id) || req.user.permissions >= 6) { %>
                                    <div class="span1">
                                        <small><a href="/project/<%= project.shortURL %>/edit/<%= post._id %>">[edit]</a></small>
                                    </div>
                                    <div class="span1">
                                        <small><a href="/project/<%= project.shortURL %>/delete/<%= post._id %>">[delete]</a></small>
                                    </div>
                                <% } %>
                            </div>
                        </div>

                    <% }); %>
                </div>
            </section>
        </div><!-- /div.span7 -->


    </div><!-- /div.row -->
    </div><!-- /div.#wrapper -->


<% include footer %>
    <script src="/js/Chart.min.js"></script>
    <script>
        var data = {
            labels : ["January","February","March","April","May","June","July"],
            datasets : [
                {
                    fillColor : "rgba(220,220,220,0.5)",
                    strokeColor : "rgba(220,220,220,1)",
                    pointColor : "rgba(220,220,220,1)",
                    pointStrokeColor : "#fff",
                    data : [65,59,90,81,56,55,40]
                },
                {
                    fillColor : "rgba(151,187,205,0.5)",
                    strokeColor : "rgba(151,187,205,1)",
                    pointColor : "rgba(151,187,205,1)",
                    pointStrokeColor : "#fff",
                    data : [0,25,10,100,10,25,0]
                }
            ]
        }
        //var myLine = new Chart(document.getElementById("myChart").getContext("2d")).Line(data);
        var ctx = $("#myChart").get(0).getContext("2d");
        var myNewChart = new Chart(ctx).Line(data);
    </script>
</body>
</html>