<!doctype html>
<html lang="ru">
<head>
    <meta charset="utf-8">
    <title>Webdevkin. Интернет-магазин. Корзина</title>
    <meta name="description" content="Тестовый интернет-магазин от webdevkin-a. Корзина, редактирование и переход на оформление заказа" />
    <link href='https://fonts.googleapis.com/css?family=Ubuntu:400,700&subset=latin,cyrillic-ext' rel='stylesheet' type='text/css'>
    <link href="css/bootstrap.min.css" rel="stylesheet" type="text/css">
    <link href="css/main.css" rel="stylesheet" type="text/css">
</head>
<body data-page="cart">
    <div class="container">
        <h1>Корзина. Интернет-магазин shop.webdevkin.ru</h1>
        <br />
        Статьи на webdevkin-e. Читаем, разбираем, комментируем...
        <br />
        <br />
        <a href="https://webdevkin.ru/posts/frontend/korzina-dlya-internet-magazina-na-fronte-ili-pishem-modulnyij-javascript" target="_blank">
            "Корзина для интернет-магазина на фронте или Пишем модульный javascript".
        </a>
        <br />
        <a href="https://webdevkin.ru/posts/backend/internet-magazin-realizuem-oformlenie-zakaza-na-kliente-i-servere" target="_blank">
            "Реализуем отправку заказа в интернет-магазине на клиенте и сервере".
        </a>
        <br />
        <a href="https://webdevkin.ru/posts/frontend/kak-dobavit-dostavku-v-internet-magazine" target="_blank">
            "Как добавить доставку в интернет-магазине".
        </a>
        <br />
        <a href="https://webdevkin.ru/posts/frontend/filtryi-i-sortirovka-v-internet-magazine-na-ajax-php-mysql" target="_blank">
            "Фильтры и сортировка в интернет-магазине на ajax-php-mysql. Серия уроков".
        </a>
        <br />
        <a href="https://webdevkin.ru/posts/frontend/sravnenie-tovarov-v-internet-magazine" target="_blank">
            "Сравнение товаров в интернет-магазине".
        </a>
        <br />
        <a href="https://webdevkin.ru/posts/frontend/postranichnaya-navigacziya" target="_blank">
            "Постраничная навигация".
        </a>
        <br />
        <br />
        <br />
        <ul class="nav nav-pills">
            <li><a href="/">Каталог</a></li>
            <li><a href="catalog.html">Каталог с фильтрами</a></li>
            <li><a href="catalog-pag.html">Каталог с пагинацией</a></li>
            <li id="compare-tab"><a href="compare.html">Сравнение товаров<span class="badge"></span></a></li>
            <li class="active"><a href="cart.html">Корзина<span id="total-cart-count" class="badge"></span></a></li>
            <li><a href="order.html">Оформление заказа</a></li>
        </ul>
        <br />
        <div class="table-responsive">
            <table class="table table-hover table-bordered">
                <thead>
                    <tr>
                        <th>Артикул</th>
                        <th>Название</th>
                        <th>Цена</th>
                        <th>Количество</th>
                        <th>Сумма</th>
                        <th></th>
                    </tr>
                </thead>
                <tbody id="cart">
                    <tr><td colspan="6"><img src="img/loading.gif" alt="" /></td></tr>
                </tbody>
            </table>
        </div>
        <div>Итого: <span id="total-cart-summa">65000</span> руб.</div>
        <br />
        <a class="btn btn-info" href="order.html">Оформить заказ</a>
    </div>

    <script id="cart-template" type="text/template">
        <% _.each(goods, function(good) { %>
            <tr class="cart-item js-cart-item" data-id="<%= good.id %>">
                <td><%= good.id %></td>
                <td><%- good.name %></td>
                <td><%= good.price %> руб.</td>
                <td>
                    <span 
                        class="cart-item__btn-dec-count js-change-count" 
                        title="Уменьшить на 1" 
                        data-id="<%= good.id %>" 
                        data-delta="-1"
                    >
                        <span class="glyphicon glyphicon-minus"></span>
                    </span>
                    <span class="js-count"><%= good.count %></span>
                    <span 
                        class="cart-item__btn-inc-count js-change-count" 
                        title="Увеличить на 1" 
                        data-id="<%= good.id %>" 
                        data-delta="1"
                    >
                        <span class="glyphicon glyphicon-plus"></span>
                    </span>
                </td>
                <td><span class="js-summa"><%= good.count * good.price %></span> руб.</td>
                <td>
                    <span class="cart-item__btn-remove js-remove-from-cart" title="Удалить из корзины" data-id="<%= good.id %>">
                        <span class="glyphicon glyphicon-remove"></span>                                
                    </span>
                </td>
            </tr>
        <% }); %>
    </script>

    <script src="js/vendor/jquery.min.js" type="text/javascript"></script>
    <script src="js/vendor/jquery.cookie.js" type="text/javascript"></script>
    <script src="js/vendor/underscore.min.js" type="text/javascript"></script>
    <script src="js/modules/catalog.js" type="text/javascript"></script>
    <script src="js/modules/cart.js" type="text/javascript"></script>
    <script src="js/modules/compare.js" type="text/javascript"></script>
    <script src="js/modules/main.js" type="text/javascript"></script>
</body>
</html>