recentlyview's Introduction

Ранее просмотренные товары

Для работы нужен localforage (//cdnjs.cloudflare.com/ajax/libs/localforage/1.5.0/localforage.min.js)

Чтобы запомнить товар, добавьте на страницу данный дата атрибут, в значение указать product.id
<div data-recently-view="{{ product.id }}"></div>

Вызовите new RecentlyView на страницах товара и страницах где нужно вывести список товаров.

В колбек success выводится массив с json просмотренных товаров. Для отрисовки используйте js шаблонизаторы.

var myRecentlyView = new RecentlyView({
 success: function (_products) {
   console.log(_products);
 }
});

recentlyview's People

Contributors

Stargazers

Watchers

recentlyview's Issues

Лимит

Добрый день, подскажите пожалуйста, а как ограничить количество вывода товаров. Мне нужно чтобы отображались только последние три. Использую этот скрипт для вывода:

<script type="text/template" hidden data-template-id="product-card-recently">
<% _.forEach(obj, function(item){ %>
<div class="products-slider-item">
<div class="product_card product_card--shadow">
<form action="/cart_items" method="post" data-product-id="<%= item.id %>">
<input type="hidden" name="variant_id" value="<%= item.variants[0].id %>">
<input type="hidden" name="quantity" value="1">
<a href="<%= item.url %>" class="product_card-thumb product_card-thumb--1x1 product_card-thumb--contain">
<span class="product_card-thumb-item" style="background-image: url(<%= item.first_image.large_url %>);"></span>
</a><div class="product_card-title">
<a href="<%= item.url %>"><%= item.title %>
</a>
</div>
<div class="product_card-prices">
<span class="product_card-price">
<%= Shop.money.format(item.variants[0].price) %>
</span>
</div><div class="product_card-add">
<div class="row no-gutters">
<div class="col">
<% if (item.available) { %>
<% if (item.variants.length > 1) { %>
<a href="<%= item.url %>" class="button button--icon button--small button--empty button--empty--inverse">
<span class="far fa-shopping-cart fa-lg"></span>
<span>Выбрать</span>
</a>
<% } else{ %>
<button type="submit" class="button button--icon button--small button--empty button--empty--inverse" data-item-add>
<span class="far fa-shopping-cart fa-lg"></span>
<span>В корзину</span>
</button><% } %>
<% } else{ %>
<button type="button" class="button button--empty button--small button--disabled"><span>Распродано</span></button>
<% } %>
</div>
<div class="col col-auto">
<button type="button" class="button button--empty button--small button--icon button--compares" data-compare-add="<%= item.id %>">
<span class="far fa-align-right fa-lg" data-fa-transform="rotate-90"></span></button>
<button type="button" class="button button--empty button--small button--icon button--favorites" data-favorites-trigger="<%= item.id %>">
<span class="far fa-heart fa-lg"></span>
</button>
</div>
</div>
</div>
</form>
</div>
</div><% }); %>
</script>

Спасибо)