pinclub/pinclub

<%- Loader('/public/stylesheets/board.index.min.css')
.css('/public/stylesheets/board.less')
.done(assets, config.site_static_host, config.mini_assets)
%>
<%- include ../navbar.html %>

<%- partial('../user/user_card', {active:'board'}) %>

<div id="board_list" class="grid row" style="margin: 16px auto 0; width: 1466px;">
    <div class="grid-sizer"></div>
    <% if (isOwner) {%>
    <div class="add-board grid-item">
        <div class="inner">
            <i></i>
            <span>创建画板</span>
        </div>
    </div>
    <% } %>
    <% for(var i = 0; i < boards.length; i++) { %>
        <div class="grid-item">
            <a class="link" href="/boards/<%= boards[i].id %>">
                <% for(var j = 0; j < boards[i].topics.length; j++) { %>
                    <% if (j==0) {%>
                        <div class="<% if (j==0) {%>large<%}%>" style='background-image: url("<%= boards[i].topics[j].image_430 %>")'>
                        </div>
                    <% } else {%>
                        <img src="<% if (j==0) {%><%= boards[i].topics[j].image_430 %><%} else {%><%= boards[i].topics[j].image_86 %><%}%>">
                <% } } %>
                <div class="shadows"><div class="large-shadow"></div><div class="shadow"></div><div class="shadow"></div><div class="shadow"></div></div>
                <div class="over "><h3><%= boards[i].title %></h3><h4></h4><div class="pin-count"><%= boards[i].topic_count %></div></div>
            </a>
            <% if (isOwner) {%>
            <div class="FollowBoard text-center">
                <button href="/boards/<%= boards[i].id %>/edit" class="btn btn-default modify_board" data-id="<%= boards[i].id %>" data-type="<%= boards[i].type %>" data-title="<%= boards[i].title %>"><strong>编辑</strong><span></span></button>
                <button href="/boards/<%= boards[i].id %>/delete" class="btn btn-default delete_board" data-id="<%= boards[i].id %>" data-title="<%= boards[i].title %>" style="background: red;color: white;"><strong>删除</strong><span></span></button>
            </div>
            <% } %>
        </div>
    <% }%>
</div>

<div class="modal fade" id="modify_board_modal" role="dialog" aria-hidden="true" aria-labelledby="modifyBoardModalLabel">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <form class="form-horizontal" action="#" method="post">
                <div class="modal-header">
                    <h5 class="modal-title">Board 信息</h5>
                </div>
                <div class="modal-body">
                    <!--TODO 用户修改Board信息-->
                    <div class="form-group">
                        <div class="col-sm-12">
                            <input type="text" class="form-control" name="title" placeholder="名称">
                        </div>
                    </div>
                    <div class="checkbox text-right">
                        <label>
                            <input type="radio" name="type" value="private"> 私有
                            <input type="radio" name="type" value="public" checked="checked"> 公开
                        </label>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" id="modify-board-close" class="btn btn-default" data-dismiss="modal">Close
                    </button>
                    <button type="submit" id="modify-board-submit" class="btn btn-default ">保存
                    </button>
                </div>
            </form>
        </div>
    </div>
</div>

<div class="modal fade" id="delete_board_modal" role="dialog" aria-hidden="true" aria-labelledby="deleteBoardModalLabel">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <form class="form-horizontal" action="#" method="post">
                <div class="modal-header">
                    <h5 class="modal-title">删除画板 [<span class="board-name"></span>]</h5>
                </div>
                <div class="modal-body">
                    是否删除 ?
                </div>
                <div class="modal-footer">
                    <button type="button" id="delete-board-close" class="btn btn-default" data-dismiss="modal">Close
                    </button>
                    <button type="submit" id="delete-board-submit" class="btn btn-default " style="background: red;color: white;">删除
                    </button>
                </div>
            </form>
        </div>
    </div>
</div>

<%- Loader('/public/javascripts/board.index.min.js')
.js('/public/libs/select2/js/select2.full.js')
.js('/public/libs/masonry.pkgd.js')
.js('/public/libs/imagesloaded.pkgd.min.js')
.js('/public/javascripts/board.js')
.done(assets, config.site_static_host, config.mini_assets)
%>

<script>
    $(document).ready(function () {
        var gridMasonry = $('.grid').masonry({
            // options...
            itemSelector: '.grid-item',
            columnWidth: '.grid-sizer',
            gutter: 10,
            horizontalOrder: true,
                percentPosition: true,
            <% if (boards.length > 6) { %>
            fitWidth: true
            <% } %>
        });

        gridMasonry.imagesLoaded().progress(function () {
            gridMasonry.masonry('layout');
        });
    });
</script>