fix: Creating unique hash for slider id instead of slider name

This commit is contained in:
Shariq Ansari 2021-09-20 20:52:08 +05:30
parent b0d970001a
commit 3e8e6ac4e2

View File

@ -27,12 +27,14 @@
</div> </div>
{%- endmacro -%} {%- endmacro -%}
<div id="{{ slider_name }}" class="section-carousel carousel slide" data-ride="carousel"> {%- set hero_slider_id = 'id-' + frappe.utils.generate_hash('HeroSlider', 12) -%}
<div id="{{ hero_slider_id }}" class="section-carousel carousel slide" data-ride="carousel">
{%- if show_indicators -%} {%- if show_indicators -%}
<ol class="carousel-indicators"> <ol class="carousel-indicators">
{%- for index in ['1', '2', '3', '4', '5'] -%} {%- for index in ['1', '2', '3', '4', '5'] -%}
{%- if values['slide_' + index + '_image'] -%} {%- if values['slide_' + index + '_image'] -%}
<li data-target="#{{ slider_name }}" data-slide-to="{{ frappe.utils.cint(index) - 1 }}" class="{{ 'active' if index=='1' else ''}}"></li> <li data-target="#{{ hero_slider_id }}" data-slide-to="{{ frappe.utils.cint(index) - 1 }}" class="{{ 'active' if index=='1' else ''}}"></li>
{%- endif -%} {%- endif -%}
{%- endfor -%} {%- endfor -%}
</ol> </ol>
@ -54,7 +56,7 @@
{%- endfor -%} {%- endfor -%}
</div> </div>
{%- if show_controls -%} {%- if show_controls -%}
<a class="carousel-control-prev" href="#{{ slider_name }}" role="button" data-slide="prev"> <a class="carousel-control-prev" href="#{{ hero_slider_id }}" role="button" data-slide="prev">
<div class="carousel-control"> <div class="carousel-control">
<svg class="mr-1" width="20" height="20" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"> <svg class="mr-1" width="20" height="20" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M11.625 3.75L6.375 9L11.625 14.25" stroke="#4C5A67" stroke-linecap="round" stroke-linejoin="round"/> <path d="M11.625 3.75L6.375 9L11.625 14.25" stroke="#4C5A67" stroke-linecap="round" stroke-linejoin="round"/>
@ -62,7 +64,7 @@
</div> </div>
<span class="sr-only">Previous</span> <span class="sr-only">Previous</span>
</a> </a>
<a class="carousel-control-next" href="#{{ slider_name }}" role="button" data-slide="next"> <a class="carousel-control-next" href="#{{ hero_slider_id }}" role="button" data-slide="next">
<div class="carousel-control"> <div class="carousel-control">
<svg class="ml-1" width="20" height="20" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"> <svg class="ml-1" width="20" height="20" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M6.375 14.25L11.625 9L6.375 3.75" stroke="#4C5A67" stroke-linecap="round" stroke-linejoin="round"/> <path d="M6.375 14.25L11.625 9L6.375 3.75" stroke="#4C5A67" stroke-linecap="round" stroke-linejoin="round"/>
@ -73,13 +75,12 @@
{%- endif -%} {%- endif -%}
</div> </div>
<script type="text/javascript"> <script>
$('.carousel').carousel({ frappe.ready(function () {
interval: false, $('.carousel').carousel({
pause: "hover", interval: false,
wrap: true pause: "hover",
}) wrap: true
})
});
</script> </script>
<style>
</style>