feat: Slideshow Web Template

- Clickable slideshow items
This commit is contained in:
Faris Ansari 2020-09-10 15:28:59 +05:30
parent 4a58f2224c
commit dff53d6fab
5 changed files with 125 additions and 103 deletions

View file

@ -31,7 +31,7 @@
"fieldtype": "Select",
"in_list_view": 1,
"label": "Fieldtype",
"options": "Attach Image\nCheck\nData\nInt\nSelect\nSmall Text\nText\nMarkdown Editor\nSection Break\nColumn Break\nTable Break",
"options": "Attach Image\nCheck\nData\nInt\nLink\nSelect\nSmall Text\nText\nMarkdown Editor\nSection Break\nColumn Break\nTable Break",
"reqd": 1
},
{
@ -48,7 +48,7 @@
],
"istable": 1,
"links": [],
"modified": "2020-08-13 14:21:04.331509",
"modified": "2020-09-09 15:04:08.414432",
"modified_by": "Administrator",
"module": "Website",
"name": "Web Template Field",

View file

@ -1,110 +1,56 @@
{
"allow_copy": 0,
"allow_import": 0,
"allow_rename": 0,
"beta": 0,
"creation": "2013-03-07 12:26:33",
"custom": 0,
"docstatus": 0,
"doctype": "DocType",
"editable_grid": 1,
"actions": [],
"creation": "2013-03-07 12:26:33",
"doctype": "DocType",
"editable_grid": 1,
"engine": "InnoDB",
"field_order": [
"image",
"heading",
"description",
"url"
],
"fields": [
{
"allow_on_submit": 0,
"bold": 0,
"collapsible": 0,
"fieldname": "image",
"fieldtype": "Attach",
"hidden": 0,
"ignore_user_permissions": 0,
"ignore_xss_filter": 0,
"in_filter": 0,
"in_list_view": 1,
"label": "Image",
"length": 0,
"no_copy": 0,
"options": "",
"permlevel": 0,
"print_hide": 0,
"print_hide_if_no_value": 0,
"read_only": 0,
"report_hide": 0,
"reqd": 0,
"search_index": 0,
"set_only_once": 0,
"unique": 0
},
"fieldname": "image",
"fieldtype": "Attach",
"in_list_view": 1,
"label": "Image"
},
{
"allow_on_submit": 0,
"bold": 0,
"collapsible": 0,
"fieldname": "heading",
"fieldtype": "Data",
"hidden": 0,
"ignore_user_permissions": 0,
"ignore_xss_filter": 0,
"in_filter": 0,
"in_list_view": 1,
"label": "Heading",
"length": 0,
"no_copy": 0,
"permlevel": 0,
"print_hide": 0,
"print_hide_if_no_value": 0,
"print_width": "200px",
"read_only": 0,
"report_hide": 0,
"reqd": 0,
"search_index": 0,
"set_only_once": 0,
"unique": 0,
"fieldname": "heading",
"fieldtype": "Data",
"in_list_view": 1,
"label": "Heading",
"print_width": "200px",
"width": "200px"
},
},
{
"allow_on_submit": 0,
"bold": 0,
"collapsible": 0,
"fieldname": "description",
"fieldtype": "Text",
"hidden": 0,
"ignore_user_permissions": 0,
"ignore_xss_filter": 0,
"in_filter": 0,
"in_list_view": 1,
"label": "Description",
"length": 0,
"no_copy": 0,
"permlevel": 0,
"print_hide": 0,
"print_hide_if_no_value": 0,
"print_width": "200px",
"read_only": 0,
"report_hide": 0,
"reqd": 0,
"search_index": 0,
"set_only_once": 0,
"unique": 0,
"fieldname": "description",
"fieldtype": "Text",
"in_list_view": 1,
"label": "Description",
"print_width": "200px",
"width": "200px"
},
{
"description": "URL to go to on clicking the slideshow image",
"fieldname": "url",
"fieldtype": "Data",
"label": "URL"
}
],
"hide_heading": 0,
"hide_toolbar": 0,
"idx": 1,
"image_view": 0,
"in_create": 0,
"is_submittable": 0,
"issingle": 0,
"istable": 1,
"max_attachments": 10,
"modified": "2016-07-11 03:28:09.983213",
"modified_by": "Administrator",
"module": "Website",
"name": "Website Slideshow Item",
"owner": "Administrator",
"permissions": [],
"quick_entry": 0,
"read_only": 0,
"read_only_onload": 0,
"track_seen": 0
],
"idx": 1,
"index_web_pages_for_search": 1,
"istable": 1,
"links": [],
"max_attachments": 10,
"modified": "2020-09-10 14:44:54.537285",
"modified_by": "Administrator",
"module": "Website",
"name": "Website Slideshow Item",
"owner": "Administrator",
"permissions": [],
"sort_field": "modified",
"sort_order": "DESC"
}

View file

@ -0,0 +1,55 @@
{%- set slideshow = frappe.get_doc('Website Slideshow', website_slideshow) -%}
{%- set slides = slideshow.slideshow_items -%}
{%- set slideshow_id = 'id-' + frappe.utils.generate_hash('Slideshow', 12) -%}
{{ slideshow.header or '' }}
<div id="{{ slideshow_id }}" class="carousel slide" data-ride="carousel">
{% if slides | len > 1 %}
<!-- Indicators -->
<ol class="carousel-indicators">
{% for slide in slides %}
<li {%- if slide.idx == 1 %} class="active" {% endif %} data-target="#{{ slideshow_id }}"
data-slide-to="{{ slide.idx - 1 }}">
</li>
{% endfor %}
</ol>
{% endif %}
<!-- Wrapper for slides -->
<div class="carousel-inner">
{% for slide in slides %}
<div class="{% if slide.idx == 1 %} active {% endif %} item carousel-item">
<a href="{{ slide.url or '' }}">
<img class="d-block w-100" src="{{ slide.image }}" />
</a>
{% if slide.heading or slide.description %}
<div class="carousel-caption d-none d-md-block">
{% if slide.heading %}<h4>{{ slide.heading }}</h4>{% endif %}
{% if slide.description %}<p>{{ slide.description }}</p>{% endif %}
</div>
{% endif %}
</div>
{% endfor %}
</div>
<!-- Controls -->
{% if slides | len > 1 %}
<a class="carousel-control-prev" href="#{{ slideshow_id }}" data-slide="prev" role="button">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="sr-only">{{ _('Previous') }}</span>
</a>
<a class="carousel-control-next" href="#{{ slideshow_id }}" data-slide="next" role="button">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="sr-only">{{ _('Next') }}</span>
</a>
{% endif %}
</div>
<script>
frappe.ready(function () {
$('.carousel').carousel({
interval: 5000
})
});
</script>

View file

@ -0,0 +1,21 @@
{
"creation": "2020-09-09 15:03:39.553047",
"docstatus": 0,
"doctype": "Web Template",
"fields": [
{
"fieldname": "website_slideshow",
"fieldtype": "Link",
"label": "Website Slideshow",
"options": "Website Slideshow",
"reqd": 0
}
],
"idx": 0,
"modified": "2020-09-09 15:04:24.008644",
"modified_by": "Administrator",
"name": "Slideshow",
"owner": "Administrator",
"standard": 1,
"type": "Section"
}