obook/website_snippet_carousel_product/templates/snippet.xml

196 lines
8 KiB
XML

<?xml version="1.0" encoding="utf-8" ?>
<odoo>
<!-- Modify Snippets Menu -->
<template
id="snippets"
inherit_id="website.snippets"
name="Snippet Products Carousel Panel Option"
>
<xpath
expr="//div[@id='snippet_feature']//div[hasclass('o_panel_body')]"
position="inside"
>
<t
t-snippet="website_snippet_carousel_product.s_product_carousel"
t-thumbnail="/website_snippet_carousel_product/static/description/icon.png"
/>
</xpath>
</template>
<!-- Snippet Carousel Product -->
<template id="s_product_carousel" name="Products Carousel">
<div class="oe_structure" />
<section class="s_product_carousel">
<div class="container">
<div class="js_product_carousel">
<div class='text-center'>
<i class='fa fa-circle-o-notch fa-spin fa-3x fa-fwg'></i>
<span>Loading Product Carousel</span>
</div>
</div>
</div>
</section>
</template>
<template id="s_product_carousel_items">
<div class="product_carousel_slider oe_website_sale">
<input
type="hidden"
name="product_count"
t-if="objects"
t-att-value="len(objects)"
/>
<div
t-att-id="uniqueId"
class="carousel slide d-flex"
data-ride="carousel"
>
<a
class="o_product_carousel_control carousel-control-prev position-relative"
t-att-href="'#' + uniqueId"
role="button"
data-slide="prev"
t-if='num_slides > 1'
>
<i class="fa fa-2x fa-chevron-left text-black-50" />
<span class="sr-only">Previous</span>
</a>
<div class="carousel-inner">
<t t-foreach="objects" t-as="products">
<div
t-attf-class="carousel-item #{'' if products_index else 'active'}"
>
<div class="row">
<t t-foreach="products" t-as="product">
<div t-attf-class="col-12 col-sm-6 col-md-#{int(12 / products_per_slide)}">
<div t-attf-class="oe_product #{' '.join(x.html_class for x in product.website_style_ids if x.html_class)}" >
<t t-call="website_sale.products_item"/>
</div>
</div>
</t>
</div>
</div>
</t>
</div>
<a
class="o_product_carousel_control carousel-control-next position-relative"
t-att-href="'#' + uniqueId"
role="button"
data-slide="next"
t-if='num_slides > 1'
>
<i class="fa fa-2x fa-chevron-right text-black-50" />
<span class="sr-only">Next</span>
</a>
</div>
</div>
</template>
<template id="s_product_carousel_options" inherit_id="website.snippet_options">
<xpath expr="." position="inside">
<div data-js="js_product_carousel" data-selector=".js_product_carousel">
<a href="#" class="dropdown-item s_carousel_set_domain"><i
class="fa fa-fw fa-bars"
/> Set Domain</a>
<div class="dropdown-submenu">
<a href="#" class="dropdown-item"><i
class="fa fa-fw fa-stop-circle-o"
/> Limit</a>
<div class="dropdown-menu" role="menu">
<a href="#" class="dropdown-item" data-products-limit="2">2</a>
<a
href="#"
role="menuitem"
class="dropdown-item"
data-products-limit="4"
>4</a>
<a href="#" class="dropdown-item" data-products-limit="8">8</a>
<a
href="#"
role="menuitem"
class="dropdown-item"
data-products-limit="12"
>12</a>
<a
href="#"
role="menuitem"
class="dropdown-item"
data-products-limit="24"
>24</a>
</div>
</div>
<div class="dropdown-submenu">
<a href="#" class="dropdown-item"><i
class="fa fa-fw fa-list-ol"
/> Show</a>
<div class="dropdown-menu" role="menu">
<a
href="#"
role="menuitem"
class="dropdown-item"
data-products-per-slide="2"
>2</a>
<a
href="#"
role="menuitem"
class="dropdown-item"
data-products-per-slide="3"
>3</a>
<a
href="#"
role="menuitem"
class="dropdown-item"
data-products-per-slide="4"
>4</a>
<a
href="#"
role="menuitem"
class="dropdown-item"
data-products-per-slide="6"
>6</a>
</div>
</div>
<div class="dropdown-submenu">
<a href="#" class="dropdown-item"><i
class="fa fa-fw fa-clock-o"
/>Slideshow Speed</a>
<div class="dropdown-menu" role="menu">
<a
href="#"
role="menuitem"
class="dropdown-item"
data-interval="1000"
>1s</a>
<a
href="#"
role="menuitem"
class="dropdown-item"
data-interval="2000"
>2s</a>
<a
href="#"
role="menuitem"
class="dropdown-item"
data-interval="3000"
>3s</a>
<a
href="#"
role="menuitem"
class="dropdown-item"
data-interval="5000"
>5s</a>
<a
href="#"
role="menuitem"
class="dropdown-item"
data-interval="10000"
>10s</a>
<a
href="#"
role="menuitem"
class="dropdown-item"
data-interval="0"
>Disable autoplay</a>
</div>
</div>
</div>
</xpath>
</template>
</odoo>