https://www.dnb.com/etc.clientlibs/core/wcm/components/commons/site/clientlibs/container.js?v=1790239791219

1/*******************************************************************************
2 * Copyright 2020 Adobe
3 *
4 * Licensed under the Apache License, Version 2.0 (the "License");
5 * you may not use this file except in compliance with the License.
6 * You may obtain a copy of the License at
7 *
8 *     http://www.apache.org/licenses/LICENSE-2.0
9 *
10 * Unless required by applicable law or agreed to in writing, software
11 * distributed under the License is distributed on an "AS IS" BASIS,
12 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13 * See the License for the specific language governing permissions and
14 * limitations under the License.
15 ******************************************************************************/
16(function() {
17    "use strict";
18
19    window.CQ = window.CQ || {};
20    window.CQ.CoreComponents = window.CQ.CoreComponents || {};
21    window.CQ.CoreComponents.container = window.CQ.CoreComponents.container || {};
22    window.CQ.CoreComponents.container.utils = {};
23
24    /**
25     * Utilities for Container Components (accordion, tabs)
26     *
27     * @namespace
28     * @alias CQ.CoreComponents.container.utils
29     * @type {{}}
30     */
31    window.CQ.CoreComponents.container.utils = {
32
33        /**
34         * Removes the hash from the URL.
35         */
36        removeUrlHash: function() {
37            history.replaceState(undefined, undefined, " ");
38        },
39
40        /**
41         * Updates the URL hash with the panel ID without scrolling to it.
42         *
43         * @param {Object} component The container component (e.g. Accordion, Carousel, Tabs).
44         * @param {String} itemType The type of the item as defined in the component.
45         * @param {Number} index The index of the container item
46         */
47        updateUrlHash: function(component, itemType, index) {
48            if (component && component._elements && component._elements[itemType] &&
49                component._elements[itemType][index] && component._elements[itemType][index].id) {
50                var ID = component._elements[itemType][index].id;
51                history.replaceState(undefined, undefined, "#" + ID);
52            }
53        },
54
55        /**
56         * Returns the index of the component item (accordion, carousel, tabs) that:
57         * - either corresponds to the deep link in the URL fragment
58         * - or contains the element that corresponds to the deep link in the URL fragment
59         *
60         * @param {Object} component The container component (Accordion, Carousel or Tabs).
61         * @param {String} itemType The type of the item as defined in the component.
62         * @param {String} itemContentType The type of the item content as defined in the component.
63         * @returns {Number} the index within the items array if the item exists, -1 otherwise.
64         */
65        getDeepLinkItemIdx: function(component, itemType, itemContentType) {
66            if (window.location.hash) {
67                var deepLinkId = window.location.hash.substring(1);
68                if (deepLinkId && document.getElementById(deepLinkId) &&
69                    component && component._config && component._config.element &&
70                    component._elements[itemType] &&
71                    component._config.element.querySelector("[id='" + deepLinkId + "']")) {
72                    for (var i = 0; i < component._elements[itemType].length; i++) {
73                        var item = component._elements[itemType][i];
74                        var itemContentContainsId = false;
75                        if (component._elements[itemContentType]) {
76                            var itemContent = component._elements[itemContentType][i];
77                            itemContentContainsId = itemContent && itemContent.querySelector("[id='" + deepLinkId + "']");
78                        }
79                        if (item.id === deepLinkId || itemContentContainsId) {
80                            return i;
81                        }
82                    }
83                }
84                return -1;
85            }
86            return -1;
87        },
88
89        /**
90         * Returns the item of the container component (accordion, carousel, tabs) that:
91         * - either corresponds to the deep link in the URL fragment
92         * - or contains the element that corresponds to the deep link in the URL fragment
93         *
94         * @param {Object} component The Accordion or Tabs component.
95         * @param {String} itemType The type of the item as defined in the component.
96         * @param {String} itemContentType The type of the item content as defined in the component.
97         * @returns {Object} the item if it exists, undefined otherwise.
98         */
99        getDeepLinkItem: function(component, itemType, itemContentType) {

100            var idx = window.CQ.CoreComponents.container.utils.getDeepLinkItemIdx(component, itemType, itemContentType);
101            if (component && component._elements && component._elements[itemType]) {
102                return component._elements[itemType][idx];
103            }
104        },
105
106        /**
107         * Scrolls the browser on page reload (if URI contains URI fragment) to the item of the container component (accordion, tabs)
108           that corresponds to the deep link in the URI fragment.
109         * This method fixes the issue existent with Chrome and related browsers, which are not scrolling on page reload (if URI contains URI fragment)
110           to the element that corresponds to the deep link in the URI fragment.
111         * Small setTimeout is needed, otherwise the scrolling will not work on Chrome.
112         */
113        scrollToAnchor: function() {
114            setTimeout(function() {
115                if (window.location.hash) {
116                    var id = decodeURIComponent(window.location.hash.substring(1));
117                    var anchorElement = document.getElementById(id);
118                    if (anchorElement && anchorElement.offsetTop) {
119                        anchorElement.scrollIntoView();
120                    }
121                }
122            }, 100);
123        }
124    };
125}());
126