Initial commit: is_imageslider out of the box. v2.3.2
This commit is contained in:
Isabelle Anno
20
is_imageslider/views/css/form.css
Normal file
20
is_imageslider/views/css/form.css
Normal file
@ -0,0 +1,20 @@
|
||||
|
||||
#image_slider .input-group {
|
||||
flex-wrap: nowrap;
|
||||
}
|
||||
|
||||
#image_slider .dropdown {
|
||||
flex: 0 0 auto;
|
||||
align-self: end;
|
||||
}
|
||||
|
||||
#image_slider .custom-file-label,
|
||||
#image_slider .custom-file-input,
|
||||
#image_slider .custom-file {
|
||||
min-height: 39px;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
#image_slider .custom-file .custom-file-label::after {
|
||||
line-height: 1.8;
|
||||
}
|
||||
BIN
is_imageslider/views/img/placeholder.jpeg
Normal file
BIN
is_imageslider/views/img/placeholder.jpeg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 7.5 KiB |
11
is_imageslider/views/index.php
Normal file
11
is_imageslider/views/index.php
Normal file
@ -0,0 +1,11 @@
|
||||
<?php
|
||||
|
||||
header('Expires: Mon, 26 Jul 1997 05:00:00 GMT');
|
||||
header('Last-Modified: ' . gmdate('D, d M Y H:i:s') . ' GMT');
|
||||
|
||||
header('Cache-Control: no-store, no-cache, must-revalidate');
|
||||
header('Cache-Control: post-check=0, pre-check=0', false);
|
||||
header('Pragma: no-cache');
|
||||
|
||||
header('Location: ../');
|
||||
exit;
|
||||
35
is_imageslider/views/js/createForm.js
Normal file
35
is_imageslider/views/js/createForm.js
Normal file
@ -0,0 +1,35 @@
|
||||
$(document).ready(function () {
|
||||
handleFileInputChange();
|
||||
|
||||
window.prestashop.component.initComponents(
|
||||
[
|
||||
'TranslatableField',
|
||||
'TinyMCEEditor',
|
||||
'TranslatableInput',
|
||||
],
|
||||
);
|
||||
|
||||
const choiceTree = new window.prestashop.component.ChoiceTree('#image_slider_shop_association');
|
||||
choiceTree.enableAutoCheckChildren();
|
||||
});
|
||||
|
||||
|
||||
function handleFileInputChange() {
|
||||
const $fileInput = $('#image_slider [type="file"]');
|
||||
|
||||
$fileInput.on('change', (e) => {
|
||||
const $input = $(e.currentTarget);
|
||||
const $relatedImage = $(`[data-related-field="${$input.attr('id')}"]`);
|
||||
const files = $input[0].files;
|
||||
|
||||
if (FileReader && files && files.length) {
|
||||
const reader = new FileReader();
|
||||
|
||||
reader.onload = function () {
|
||||
$relatedImage.attr('src', reader.result)
|
||||
}
|
||||
|
||||
reader.readAsDataURL(files[0]);
|
||||
}
|
||||
})
|
||||
}
|
||||
15
is_imageslider/views/js/form.js
Normal file
15
is_imageslider/views/js/form.js
Normal file
@ -0,0 +1,15 @@
|
||||
$(document).ready(function () {
|
||||
window.prestashop.component.initComponents(
|
||||
[
|
||||
'MultistoreConfigField',
|
||||
'Grid',
|
||||
],
|
||||
);
|
||||
|
||||
const imageSliderkGrid = new window.prestashop.component.Grid('is_imageslider');
|
||||
|
||||
imageSliderkGrid.addExtension(new prestashop.component.GridExtensions.AsyncToggleColumnExtension());
|
||||
imageSliderkGrid.addExtension(new window.prestashop.component.GridExtensions.SortingExtension());
|
||||
imageSliderkGrid.addExtension(new window.prestashop.component.GridExtensions.PositionExtension());
|
||||
imageSliderkGrid.addExtension(new window.prestashop.component.GridExtensions.SubmitRowActionExtension());
|
||||
});
|
||||
11
is_imageslider/views/js/index.php
Normal file
11
is_imageslider/views/js/index.php
Normal file
@ -0,0 +1,11 @@
|
||||
<?php
|
||||
|
||||
header('Expires: Mon, 26 Jul 1997 05:00:00 GMT');
|
||||
header('Last-Modified: ' . gmdate('D, d M Y H:i:s') . ' GMT');
|
||||
|
||||
header('Cache-Control: no-store, no-cache, must-revalidate');
|
||||
header('Cache-Control: post-check=0, pre-check=0', false);
|
||||
header('Pragma: no-cache');
|
||||
|
||||
header('Location: ../');
|
||||
exit;
|
||||
65
is_imageslider/views/templates/admin/form.html.twig
Normal file
65
is_imageslider/views/templates/admin/form.html.twig
Normal file
@ -0,0 +1,65 @@
|
||||
{#
|
||||
/**
|
||||
* Copyright since 2007 PrestaShop SA and Contributors
|
||||
*
|
||||
* NOTICE OF LICENSE
|
||||
*
|
||||
* This source file is subject to the Academic Free License 3.0 (AFL-3.0)
|
||||
* that is bundled with this package in the file LICENSE.txt.
|
||||
* It is also available through the world-wide-web at this URL:
|
||||
* https://opensource.org/licenses/AFL-3.0
|
||||
* If you did not receive a copy of the license and are unable to
|
||||
* obtain it through the world-wide-web, please send an email
|
||||
* to license@prestashop.com so we can send you a copy immediately.
|
||||
*
|
||||
* @author PrestaShop SA and Contributors <contact@prestashop.com>
|
||||
* @copyright Since 2007 PrestaShop SA and Contributors
|
||||
* @license https://opensource.org/licenses/AFL-3.0 Academic Free License 3.0 (AFL-3.0)
|
||||
#}
|
||||
|
||||
{% extends '@PrestaShop/Admin/layout.html.twig' %}
|
||||
{% form_theme imageSliderForm '@Modules/is_imageslider/views/templates/admin/form/prestashop_ui_kit.html.twig' %}
|
||||
|
||||
{% block content %}
|
||||
{{ form_start(imageSliderForm) }}
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-xl-12">
|
||||
<div class="card">
|
||||
<h3 class="card-header">
|
||||
<i class="material-icons">image</i> {{ title }}
|
||||
</h3>
|
||||
<div class="card-block">
|
||||
<div class="card-body">
|
||||
<div class="form-wrapper">
|
||||
{{ form_widget(imageSliderForm) }}
|
||||
{{ form_rest(imageSliderForm) }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-footer">
|
||||
<div class="row">
|
||||
<div class="col-auto">
|
||||
<a href="{{ path('is_imageslider_controller') }}" class="btn btn-outline-secondary">{{ 'Cancel'|trans({}, 'Admin.Actions') }}</a>
|
||||
</div>
|
||||
|
||||
<div class="col-auto ml-auto">
|
||||
<button class="btn btn-primary" id="form-is_imageslider-save-button">{{ 'Save'|trans({}, 'Admin.Actions') }}</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{{ form_end(imageSliderForm) }}
|
||||
{% endblock %}
|
||||
|
||||
{% block javascripts %}
|
||||
{{ parent() }}
|
||||
<script src="{{ asset('../modules/is_imageslider/views/js/createForm.js') }}"></script>
|
||||
{% endblock %}
|
||||
|
||||
|
||||
{% block stylesheets %}
|
||||
{{ parent() }}
|
||||
<link rel="stylesheet" href="{{ asset('../modules/is_imageslider/views/css/form.css') }}" />
|
||||
{% endblock %}
|
||||
@ -0,0 +1,77 @@
|
||||
{% extends '@PrestaShop/Admin/TwigTemplateForm/prestashop_ui_kit.html.twig' %}
|
||||
|
||||
{% block image_preview_widget -%}
|
||||
{# This is the hidden input #}
|
||||
{% if value %}
|
||||
{{- block('form_widget_simple') -}}
|
||||
<img
|
||||
data-related-field="{{ form.vars.id|replace({'_preview': ''}) }}"
|
||||
src="{{ value }}"
|
||||
alt="{{ ('Image preview for ' ~ form.vars.name)|trim }}"
|
||||
style="max-width: 50%;"
|
||||
class="{{ form.vars.image_class }}" />
|
||||
{% endif %}
|
||||
{%- endblock image_preview_widget %}
|
||||
|
||||
{% block translatable_file_widget -%}
|
||||
|
||||
{{ form_errors(form) }}
|
||||
<style>
|
||||
.custom-file-label:after {
|
||||
content: "{{ "Browse"|trans({}, 'Admin.Actions') }}";
|
||||
}
|
||||
</style>
|
||||
<div class="input-group locale-input-group js-locale-input-group align-items-end">
|
||||
{% for translateField in form %}
|
||||
|
||||
{% set attr = attr|merge({
|
||||
class: (attr.class|default('') ~ ' custom-file-input')|trim,
|
||||
'data-locale': get_context_iso_code()
|
||||
}) -%}
|
||||
|
||||
{% set classes = translateField.vars.attr.class|default('') ~ ' js-locale-input'%}
|
||||
{% set classes = classes ~ ' js-locale-' ~ translateField.vars.label %}
|
||||
|
||||
{% if default_locale.id_lang != translateField.vars.name %}
|
||||
{% set classes = classes ~ ' d-none' %}
|
||||
{% endif %}
|
||||
|
||||
<div data-lang-id="{{ translateField.vars.name }}" class="{{ classes }}" style="flex-grow: 1;">
|
||||
|
||||
{%- set type = type|default('file') -%}
|
||||
|
||||
<div class="custom-file">
|
||||
{{ form_widget(translateField, {'attr': attr, 'type': type}) }}
|
||||
|
||||
<label class="custom-file-label" for="{{ form.vars.id }}">
|
||||
{% set attributes = form.vars.attr %}
|
||||
{{ attributes.placeholder is defined ? attributes.placeholder : 'Choose file(s)'|trans({}, 'Admin.Actions') }}
|
||||
</label>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
{{- block('form_help') -}}
|
||||
{% endfor %}
|
||||
|
||||
{% if not hide_locales %}
|
||||
<div class="dropdown">
|
||||
<button class="btn btn-outline-secondary dropdown-toggle js-locale-btn"
|
||||
type="button"
|
||||
data-toggle="dropdown"
|
||||
aria-haspopup="true"
|
||||
aria-expanded="false"
|
||||
id="{{ form.vars.id }}"
|
||||
>
|
||||
{{ form.vars.default_locale.iso_code }}
|
||||
</button>
|
||||
|
||||
<div class="dropdown-menu locale-dropdown-menu" aria-labelledby="{{ form.vars.id }}">
|
||||
{% for locale in locales %}
|
||||
<span class="dropdown-item js-locale-item" data-locale="{{ locale.iso_code }}">{{ locale.name }}</span>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
{%- endblock translatable_file_widget %}
|
||||
44
is_imageslider/views/templates/admin/index.html.twig
Normal file
44
is_imageslider/views/templates/admin/index.html.twig
Normal file
@ -0,0 +1,44 @@
|
||||
{% set layoutHeaderToolbarBtn = {
|
||||
'add' : {
|
||||
'href': path('is_imageslider_controller_create'),
|
||||
'desc': 'Add new slider'|trans({}, translationDomain),
|
||||
'icon': 'add_circle_outline'
|
||||
},
|
||||
} %}
|
||||
|
||||
|
||||
{% extends '@PrestaShop/Admin/layout.html.twig' %}
|
||||
{% form_theme configurationForm '@PrestaShop/Admin/TwigTemplateForm/prestashop_ui_kit.html.twig' %}
|
||||
|
||||
{% block content %}
|
||||
{{ form_start(configurationForm) }}
|
||||
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-xl-12">
|
||||
<div class="card">
|
||||
<h3 class="card-header">
|
||||
<i class="material-icons">settings</i> {{ 'Image slider configuration'|trans({}, translationDomain) }}
|
||||
</h3>
|
||||
<div class="card-block">
|
||||
<div class="card-body">
|
||||
<div class="form-wrapper">
|
||||
{{ form_widget(configurationForm) }}
|
||||
{{ form_rest(configurationForm) }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-footer">
|
||||
<div class="d-flex justify-content-end">
|
||||
<button class="btn btn-primary" id="form-maintenance-save-button">{{ 'Save'|trans({}, 'Admin.Actions') }}</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% include '@PrestaShop/Admin/Common/Grid/grid_panel.html.twig' with {'grid': imageSliderkGrid} %}
|
||||
{% endblock %}
|
||||
|
||||
{% block javascripts %}
|
||||
{{ parent() }}
|
||||
<script src="{{ asset('../modules/is_imageslider/views/js/form.js') }}"></script>
|
||||
{% endblock %}
|
||||
11
is_imageslider/views/templates/admin/index.php
Normal file
11
is_imageslider/views/templates/admin/index.php
Normal file
@ -0,0 +1,11 @@
|
||||
<?php
|
||||
|
||||
header('Expires: Mon, 26 Jul 1997 05:00:00 GMT');
|
||||
header('Last-Modified: ' . gmdate('D, d M Y H:i:s') . ' GMT');
|
||||
|
||||
header('Cache-Control: no-store, no-cache, must-revalidate');
|
||||
header('Cache-Control: post-check=0, pre-check=0', false);
|
||||
header('Pragma: no-cache');
|
||||
|
||||
header('Location: ../');
|
||||
exit;
|
||||
3
is_imageslider/views/templates/hook/head.tpl
Normal file
3
is_imageslider/views/templates/hook/head.tpl
Normal file
@ -0,0 +1,3 @@
|
||||
{if !empty($image)}
|
||||
<link rel="preload" href="{$image}" as="image">
|
||||
{/if}
|
||||
83
is_imageslider/views/templates/hook/slider.tpl
Normal file
83
is_imageslider/views/templates/hook/slider.tpl
Normal file
@ -0,0 +1,83 @@
|
||||
{*
|
||||
* 2007-2020 PrestaShop.
|
||||
*
|
||||
* NOTICE OF LICENSE
|
||||
*
|
||||
* This source file is subject to the Academic Free License 3.0 (AFL-3.0)
|
||||
* that is bundled with this package in the file LICENSE.txt.
|
||||
* It is also available through the world-wide-web at this URL:
|
||||
* https://opensource.org/licenses/AFL-3.0
|
||||
* If you did not receive a copy of the license and are unable to
|
||||
* obtain it through the world-wide-web, please send an email
|
||||
* to license@prestashop.com so we can send you a copy immediately.
|
||||
*
|
||||
* DISCLAIMER
|
||||
*
|
||||
* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
|
||||
* versions in the future. If you wish to customize PrestaShop for your
|
||||
* needs please refer to http://www.prestashop.com for more information.
|
||||
*
|
||||
* @author PrestaShop SA <contact@prestashop.com>
|
||||
* @copyright 2007-2020 PrestaShop SA
|
||||
* @license https://opensource.org/licenses/AFL-3.0 Academic Free License 3.0 (AFL-3.0)
|
||||
* International Registered Trademark & Property of PrestaShop SA
|
||||
*}
|
||||
|
||||
{if !empty($homeslider.slides)}
|
||||
{$sliderConfig = [
|
||||
"loop" => 1,
|
||||
"autoplay" => [
|
||||
"delay" => $homeslider.speed
|
||||
]
|
||||
]}
|
||||
|
||||
<div class="homeslider swiper bg-light" {if $homeslider.slides|count > 1} data-swiper='{$sliderConfig|json_encode}'{/if}>
|
||||
<ul class="swiper-wrapper homeslider__list">
|
||||
{images_block}
|
||||
{foreach from=$homeslider.slides item=slide}
|
||||
<li class="swiper-slide homeslider__slide">
|
||||
<a href="{$slide.url}">
|
||||
{if $slide@first}
|
||||
<img
|
||||
class="img-fluid"
|
||||
src="{$slide.image_url}"
|
||||
alt="{$slide.title}"
|
||||
{if !empty($slide.sizes)}
|
||||
width="{$slide.sizes.0}"
|
||||
height="{$slide.sizes.1}"
|
||||
{/if}
|
||||
>
|
||||
{else}
|
||||
<img
|
||||
class="img-fluid homeslider__img"
|
||||
src="{$slide.image_url}"
|
||||
alt="{$slide.title}"
|
||||
{if !empty($slide.sizes)}
|
||||
width="{$slide.sizes.0}"
|
||||
height="{$slide.sizes.1}"
|
||||
{/if}
|
||||
loading="lazy"
|
||||
>
|
||||
{/if}
|
||||
|
||||
{if $slide.title || $slide.description }
|
||||
<span class="homeslider__caption">
|
||||
<h2 class="homeslider__title">{$slide.title}</h2>
|
||||
<div class="homeslider__desc">{$slide.description nofilter}</div>
|
||||
</span>
|
||||
{/if}
|
||||
</a>
|
||||
</li>
|
||||
{/foreach}
|
||||
{/images_block}
|
||||
</ul>
|
||||
{if $homeslider.slides|count > 1}
|
||||
<div class="swiper-button-prev swiper-button-custom homeslider__arrow homeslider__arrow--prev">
|
||||
<i class="material-icons"></i>
|
||||
</div>
|
||||
<div class="swiper-button-next swiper-button-custom homeslider__arrow homeslider__arrow--next">
|
||||
<i class="material-icons"></i>
|
||||
</div>
|
||||
{/if}
|
||||
</div>
|
||||
{/if}
|
||||
11
is_imageslider/views/templates/index.php
Normal file
11
is_imageslider/views/templates/index.php
Normal file
@ -0,0 +1,11 @@
|
||||
<?php
|
||||
|
||||
header('Expires: Mon, 26 Jul 1997 05:00:00 GMT');
|
||||
header('Last-Modified: ' . gmdate('D, d M Y H:i:s') . ' GMT');
|
||||
|
||||
header('Cache-Control: no-store, no-cache, must-revalidate');
|
||||
header('Cache-Control: post-check=0, pre-check=0', false);
|
||||
header('Pragma: no-cache');
|
||||
|
||||
header('Location: ../');
|
||||
exit;
|
||||
Reference in New Issue
Block a user