{"version":3,"sources":["webpack:///./React/components/Shared/SiteWrapper/Header/PVMenuLeft.js"],"names":["PVMenuLeft","props","topMenus","leftMenuName","moveCanvas","navToMenu","navToMenu2","document","getElementById","navToMenuVerticalOrder","dataset","order","navToMenuLevel","parentNode","newLevelTop","style","top","navToMenuHorizontalOrder","canvas","newCanvasLeft","left","handleClick","e","navToHref","currentTarget","getAttribute","isMenuNavigation","substr","wholeMenu","menuType","menu","isAnimationDesired","classList","remove","add","navToID","display","scrollTop","callback","moveCanvasWithAnimation","moveCanvasWithoutAnimation","preventDefault","useEffect","replace","levels","renderPvMenu","menus","map","key","menuID","id","data-order","menuOrder","data-menu-name","menuName","className","menuClass","draggable","items","menuItems","item","iconClass","itemClass","itemPageType","itemID","to","itemHref","onClick","data-menu","itemName","href","level","levelID","levelOrder","levelMenus","propTypes","PropTypes","oneOfType","any","isRequired","string","defaultProps","mapStateToProps","state","getTopMenus","connect"],"mappings":"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","file":"bundle.2.469e6f9e.js","sourcesContent":["import React, { useEffect } from 'react';\nimport { Link } from 'react-router-dom';\nimport { connect } from 'react-redux';\nimport PropTypes from 'prop-types';\nimport { getTopMenus } from '../../../../redux/menus/selectors';\n\nconst PVMenuLeft = (props) => {\n    const { topMenus, leftMenuName } = props;\n\n    function moveCanvasWithoutAnimation(wholeMenu, callback) {\n        wholeMenu.classList.remove('pv-nav-animate');\n        callback();\n    }\n\n    function moveCanvasWithAnimation(wholeMenu, callback) {\n        wholeMenu.classList.add('pv-nav-animate');\n        callback();\n    }\n\n    function moveCanvas(navToMenu) {\n        let navToMenu2 = navToMenu;\n        if (navToMenu2 === null) {\n            navToMenu2 = document.getElementById('LeftMenuShop');\n            if (navToMenu2 === null) {\n                navToMenu2 = document.getElementById('LeftMenuProducts');\n            }\n        }\n        const navToMenuVerticalOrder = navToMenu2.dataset.order;\n        const navToMenuLevel = navToMenu2.parentNode.parentNode;\n        const newLevelTop = `${(navToMenuVerticalOrder - 1) * -1200}px`;\n        navToMenuLevel.style.top = newLevelTop;\n\n        const navToMenuHorizontalOrder = navToMenuLevel.dataset.order;\n        const canvas = document.getElementById('pv-nav-canvas-left');\n        const newCanvasLeft = `${(navToMenuHorizontalOrder - 1) * -350}px`;\n        canvas.style.left = newCanvasLeft;\n    }\n\n    useEffect(() => {\n        if (leftMenuName !== '') {\n            const navToHref = `#LeftMenu${props.leftMenuName.replace('&', '')}`;\n            const navToID = navToHref.substr(1);\n            const navToMenu = document.getElementById(navToID);\n            moveCanvas(navToMenu);\n        }\n    }, [leftMenuName]);\n\n    function handleClick(e) {\n        const navToHref = e.currentTarget.getAttribute('href');\n        if (navToHref === null) {\n            return;\n        }\n        const isMenuNavigation = navToHref.substr(0, 1) === '#';\n        const wholeMenu = document.getElementById('pv-nav-menu-left');\n        const menuType = e.currentTarget.dataset.menu;\n\n        let isAnimationDesired = false;\n        if (menuType === 'main' || menuType === 'sub') {\n            isAnimationDesired = false;\n        } else {\n            isAnimationDesired = true;\n        }\n\n        if (menuType === 'main') {\n            wholeMenu.classList.remove('is-sub-menu');\n            wholeMenu.classList.add('is-main-menu');\n        }\n\n        if (menuType === 'sub') {\n            wholeMenu.classList.remove('is-main-menu');\n            wholeMenu.classList.add('is-sub-menu');\n        }\n\n        if (isMenuNavigation) {\n            const navToID = navToHref.substr(1);\n\n            if (navToID === 'Close') {\n                wholeMenu.style.display = 'none';\n            } else {\n                wholeMenu.style.display = 'block';\n                const navToMenu = document.getElementById(navToID);\n                navToMenu.scrollTop = 0;\n\n                if (isAnimationDesired) {\n                    moveCanvasWithAnimation(wholeMenu, function move() {\n                        moveCanvas(navToMenu);\n                    });\n                } else {\n                    moveCanvasWithoutAnimation(wholeMenu, function move() {\n                        moveCanvas(navToMenu);\n                    });\n                }\n            }\n            e.preventDefault();\n        }\n    }\n\n    const renderPvMenuItem = (items) => {\n        ////// console.log('*** renderPvMenuItem *** ' + JSON.stringify(items));\n        return (\n            <div>\n                {items.map((item) => {\n                    let iconClass = '';\n\n                    if (item.itemClass === 'pv-nav-forward') {\n                        iconClass = 'pv-nav-icon-angle-right';\n                    } else if (\n                        item.itemClass === 'pv-nav-back' ||\n                        item.itemClass === 'pv-nav-back-main-only'\n                    ) {\n                        iconClass = 'pv-nav-icon-angle-left';\n                    }\n\n                    if (item.itemPageType === 'React' && item.itemClass === 'pv-nav-item-link') {\n                        return (\n                            <li key={item.itemID}>\n                                <Link\n                                    to={item.itemHref}\n                                    className={`${item.itemClass} ${iconClass}`}\n                                    draggable=\"false\"\n                                    onClick={handleClick}\n                                    data-menu=\"sub\"\n                                >\n                                    {item.itemName}\n                                </Link>\n                            </li>\n                        );\n                    }\n\n                    return (\n                        <li key={item.itemID}>\n                            <a\n                                href={\n                                    item.itemHref != null\n                                        ? item.itemHref.replace('#Menu', '#LeftMenu')\n                                        : item.itemHref\n                                }\n                                className={`${item.itemClass} ${iconClass}`}\n                                draggable=\"false\"\n                                onClick={handleClick}\n                            >\n                                {item.itemName}\n                            </a>\n                        </li>\n                    );\n                })}\n            </div>\n        );\n    };\n\n    const renderPvMenu = (menus) => {\n        ////// console.log(\"*** renderPvMenu *** \" + JSON.stringify(menus));\n        return (\n            <div>\n                {menus.map((menu) => {\n                    return (\n                        <div\n                            key={menu.menuID.replace('Menu', 'LeftMenu').replace('&', '')}\n                            id={menu.menuID.replace('Menu', 'LeftMenu').replace('&', '')}\n                            data-order={menu.menuOrder}\n                            data-menu-name={menu.menuName}\n                            className={`pv-nav-menu ${menu.menuClass}`}\n                            draggable=\"false\"\n                        >\n                            <ul>{renderPvMenuItem(menu.menuItems)}</ul>\n                        </div>\n                    );\n                })}\n            </div>\n        );\n    };\n\n    const renderPvNavMenuLevel = (levels) => {\n        ////// console.log(\"*** renderPvNavMenuLevel *** \" + JSON.stringify(levels));\n        return (\n            <div id=\"pv-nav-canvas-left\">\n                {levels.map((level) => {\n                    return (\n                        <div key={level.levelID} id={level.levelID} data-order={level.levelOrder}>\n                            {renderPvMenu(level.levelMenus)}\n                        </div>\n                    );\n                })}\n            </div>\n        );\n    };\n\n    ////// console.log(\"*** PVMenuLeft *** \" + JSON.stringify(topMenus));\n    return (\n        <div id=\"pv-nav\">\n            <div id=\"stickyMenu\">\n                <div id=\"pv-nav-menu-left\">\n                    <div id=\"pv-nav-window\">{renderPvNavMenuLevel(topMenus)}</div>\n                </div>\n            </div>\n        </div>\n    );\n};\n\nPVMenuLeft.propTypes = {\n    topMenus: PropTypes.oneOfType([PropTypes.any]).isRequired,\n    leftMenuName: PropTypes.string,\n};\n\nPVMenuLeft.defaultProps = {\n    leftMenuName: 'Shop',\n};\n\nconst mapStateToProps = (state) => {\n    return { topMenus: getTopMenus(state) };\n};\n\nexport default connect(mapStateToProps, null)(PVMenuLeft);\n"],"sourceRoot":""}