https://onem.eu/fileadmin/templates/GLOBAL/EXT/powermail/Js/tabs.js?1679058888

1/***************************************************************
2 *  Copyright notice
3 *
4 *  (c) 2012 Alexander Kellner <[email protected]>, in2code
5 *
6 *  All rights reserved
7 *
8 *  This script is part of the TYPO3 project. The TYPO3 project is
9 *  free software; you can redistribute it and/or modify
10 *  it under the terms of the GNU General Public License as published by
11 *  the Free Software Foundation; either version 3 of the License, or
12 *  (at your option) any later version.
13 *
14 *  The GNU General Public License can be found at
15 *  http://www.gnu.org/copyleft/gpl.html.
16 *
17 *  This script is distributed in the hope that it will be useful,
18 *  but WITHOUT ANY WARRANTY; without even the implied warranty of
19 *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
20 *  GNU General Public License for more details.
21 *
22 *  This copyright notice MUST APPEAR in all copies of the script!
23 ***************************************************************/
24
25jQuery(document).ready(function($) {
26    $.fn.powermailTabs = function(options) {
27        'use strict';
28        var $this = jQuery(this);
29        options = jQuery.extend({
30            container: 'fieldset',
31            header: 'legend',
32            tabs: true,
33            navigation: true,
34            openTabOnError: true,
35            tabIndex: true
36        }, options);
37
38        // initial show first fieldset
39        hideAllFieldsets($this, options);
40        $this.find(options.container).first().show();
41
42        generateTabNavigation($this, options);
43        generateButtonNavigation($this, options);
44
45        if ($.fn.parsley && $('form[data-parsley-validate="data-parsley-validate"]').length && $('.powermail_morestep').length) {
46            $('form[data-parsley-validate="data-parsley-validate"]').parsley().subscribe('parsley:field:validated', function() {
47                $('#powermail_tabmenu > li').removeClass('parsley-error');
48
49                // if error occurs
50                if (!$('form[data-parsley-validate="data-parsley-validate"]').parsley().isValid()) {
51
52                    // for each field with an error
53                    $('.parsley-error').each(function() {
54                        var errorIndex = $('.powermail_fieldset').index($(this).closest('.powermail_fieldset'));
55                        var tabWithError = $('#powermail_tabmenu > li').slice(errorIndex, errorIndex + 1);
56                        tabWithError.addClass('parsley-error');
57                    });
58                }
59            });
60        }
61
62        // open tab with error
63        if (options.openTabOnError) {
64            /*$.listen('parsley:field:error', function() {
65                setTimeout(function() {
66                    $('.powermail_tabmenu > .parsley-error:first').click();
67                }, 50);
68            });*/
69        }
70    };
71
72    /**
73     * Show Tab
74     *
75     * @param tab
76     * @param form
77     * @param options
78     * @param clickedIndex
79     * @return void
80     */
81    function showTab(tab, form, options, clickedIndex) {
82        $('.powermail_tabmenu li', form).removeClass('act');
83        tab.addClass('act');
84        hideAllFieldsets(form, options)
85        $('.powermail_fieldset', form).slice(clickedIndex, clickedIndex + 1).show();
86    }
87
88    /**
89     * Hide all fieldsets
90     *
91     * @param element
92     * @param options
93     * @return void
94     */
95    function hideAllFieldsets(element, options) {
96        element.children(options.container).hide();
97    }
98
99    /**
100     * Generate Button Navigation
101     *
102     * @param object element
103     * @param array options
104     * @return void
105     */
106    function generateButtonNavigation(element, options) {
107        if (!options.navigation) {
108            return;
109        }
110
111        // buttons
112        element.children(options.container).each(function(i) {

113            var navigationContainer = $('<div />')
114                .addClass('powermail_fieldwrap')
115                .addClass('powermail_tab_navigation')
116                .appendTo($(this));
117            ;
118            if (i > 0) {
119                navigationContainer.append(createPreviousButton(element, options));
120            }
121            if (i < (element.children(options.container).length - 1)) {
122                navigationContainer.append(createNextButton(element, options));
123            }
124        });
125    }
126
127    /**
128     * Create next button
129     *
130     * @param object element
131     * @param array options
132     * @return object
133     */
134    function createPreviousButton(element, options) {
135        return $('<a />')
136            .prop('href', '#')
137            .addClass('powermail_tab_navigation_previous')
138            .html('<')
139            .click(function(e) {
140                e.preventDefault();
141                showPreviousTab(element, options);
142            });
143    }
144
145    /**
146     * Create next button
147     *
148     * @param object element
149     * @param array options
150     * @return object
151     */
152    function createNextButton(element, options) {
153        return $('<a />')
154            .prop('href', '#')
155            .addClass('powermail_tab_navigation_next')
156            .html('>')
157            .click(function(e) {
158                e.preventDefault();
159                showNextTab(element, options);
160            });
161    }
162
163    /**
164     * Show next Tab
165     *
166     * @param object element
167     * @param array options
168     * @return void
169     */
170    function showNextTab(element, options) {
171        tab = element.find('#powermail_tabmenu > li.act');
172        tab.removeClass('act');
173        tab.next().addClass('act');
174        currentActiveTab = tab.attr('tabindex');
175        hideAllFieldsets(element, options);
176        currentActiveTab++;
177        element.find('.index'+currentActiveTab).show();
178    }
179
180    /**
181     * Show previous Tab
182     *
183     * @param object element
184     * @param array options
185     * @return void
186     */
187    function showPreviousTab(element, options) {
188        tab = element.find('#powermail_tabmenu > li.act');
189        tab.removeClass('act');
190        tab.prev().addClass('act');
191        currentActiveTab = tab.attr('tabindex');
192        hideAllFieldsets(element, options);
193        currentActiveTab--;
194        element.find('.index'+currentActiveTab).show();
195    }
196
197    /**
198     * Generate Tabs
199     *
200     * @param object element
201     * @param array options
202     * @return void
203     */
204    function generateTabNavigation(element, options) {
205        if (!options.tabs) {
206            return;
207        }
208
209        // generate menu
210        var $ul = $('<ul />', {
211            'id': 'powermail_tabmenu',
212            'class': 'powermail_tabmenu'
213        }).insertBefore(
214            element.children(options.container).filter(':first')
215        );
216
217        // all containers
218        element.children(options.container).each(function(i, $fieldset){
219            //tab_menu
220            var li = $('<li/>')
221                .html($(this).children(options.header).html())
222                .addClass((i==0) ? 'act' : '')
223                .addClass('item' + i)
224                .on('click keypress', {
225                    container: element.children(options.container),
226                    fieldset: $($fieldset)
227                }, function() {
228                    var indexTab = $('.powermail_tabmenu li', element).index($(this));
229                    showTab($(this), element, options, indexTab);
230                });
231            if (options.tabIndex) {
232                li.prop('tabindex', i);
233            }
234            $ul.append(li);
235        });
236    }
237});