(function (win, doc, $, util) { 'use strict'; var KEYENCE = {}; var kpi_openedModalWindow = ''; var SMALL_SCREEN = 969; var smallScreenMql = win.matchMedia('only screen and (max-width: ' + SMALL_SCREEN + 'px)'); if ($ === undefined) { return; } KEYENCE.init = function () { var self = this; self.getElem = { docElement: doc.documentElement ? doc.documentElement : doc.body, spMenu: doc.getElementById('js-setMenu'), spPhoneMenu: doc.getElementById('js-setPhoneMenu'), spMenuTarget: doc.getElementById('js-setMenu-target'), spSearchTarget: doc.getElementById('js-setMenu-searchTarget'), spPhoneTarget: doc.getElementById('js-setMenu-phoneTarget'), spMenuBtn: doc.getElementById('js-setMenu-button'), spSearchBtn: doc.getElementById('js-setMenu-searchButton'), spPhoneBtn: doc.getElementById('js-setMenu-phoneButton'), changeLang: doc.getElementById('js-changeLanguage'), changeLangTrigger: doc.getElementById('js-changeLanguage-trigger'), changeLangTarget: doc.getElementById('js-changeLanguage-target'), focusOrderTrigger: doc.getElementById('js-ctrlFocusOrder'), divideMenu: doc.getElementById('js-divideMenu'), megaMenu: doc.querySelectorAll('.js-megaMenu'), slideNavTarget: doc.querySelectorAll('.js-slideNavigation-target'), slideNavPrevTrigger: doc.querySelectorAll('.js-slideNavigation-previousTrigger'), slideNavNextTrigger: doc.querySelectorAll('.js-slideNavigation-nextTrigger'), menuConversionGroup: doc.querySelector('.js-menuConversion-group'), menuConversion: doc.querySelector('.js-menuConversion'), categoryHeader: doc.querySelector('.js-categoryHeader'), carousel: doc.querySelector('.js-setHomeCarousel'), changeCategoryTarget: doc.querySelectorAll('.js-setChangeCategory-target'), changeCategoryTrigger: doc.querySelectorAll('.js-setChangeCategory-trigger'), adjustHeight: doc.querySelectorAll('.js-setHomeAdjustHeight'), toggleCart: doc.querySelector('.js-toggleCart'), richSurvey: doc.getElementById('js-setRichSurvey') }; self.CONFIG = { FOCUSABLE: 'a, area, [tabindex], input, button, select, option, textarea, output, summary, video, audio, object, embed', SHOW_CLASS: 'is-show', MENU_SHOW_CLASS: 'is-menu-show', MEGA_MENU_SHOW_CLASS: 'is-megaMenu-show', SUGGEST_SHOW_CLASS: 'is-suggest-show', HIDE_CLASS: 'is-hide', ACTIVE_CLASS: 'is-active', CURRENT_CLASS: 'is-current', FIXED_CLASS: 'is-fixed', STOP_CLASS: 'is-stop', ARIA_EXPANDED: 'aria-expanded', ARIA_CONTROLS: 'aria-controls' }; self.polyfill.setChildNodeRemove(); self.polyfill.setNodeListForEach(); self.polyfill.setElemClosest(); }; KEYENCE.ctrlHeader = function () { var self = this; var header = doc.getElementById('js-controlHeader'); var seriesHeader = doc.querySelector('[data-series-header-target="sticky"]'); var observationTarget = doc.createElement('div'); var fn = {}; var observer = null; var intersectionClassName = 'is-intersection'; var searchHiddenClassName = 'IsHidden'; var suggestTarget = doc.querySelector('.JSHeaderSuggest .JSSearchSuggestTarget'); var delayVal = 100; var resizeTimer = null; if (!header) { return; } if (seriesHeader) { return; } fn.hasIntersectionObserver = function () { return ('IntersectionObserver' in win && 'IntersectionObserverEntry' in win); }; fn.init = function () { if (fn.hasIntersectionObserver()) { observationTarget.dataset.observationTarget = 'header'; observationTarget.style.cssText = 'position: absolute; bottom: 0; width: 100%; height: 1px; z-index: 10000;'; header.insertBefore(observationTarget, header.firstChild); observer = new IntersectionObserver(fn.handleIntersect); observer.observe(observationTarget); } }; fn.adjustHeaderHeight = function () { header.style.height = self.getElem.spMenu.offsetHeight + 'px'; }; fn.passIntersection = function () { if (self.getElem.spSearchTarget) { self.getElem.spSearchTarget.classList.add(intersectionClassName); setTimeout(function () { self.getElem.spSearchTarget.classList.remove(intersectionClassName); }, delayVal); } }; fn.fixHeader = function () { header.classList.add(self.CONFIG.FIXED_CLASS); setTimeout(function () { header.classList.add(self.CONFIG.SHOW_CLASS); }, delayVal); if (self.getElem.spSearchTarget && self.getElem.spSearchBtn) { if (self.getElem.spSearchTarget.classList.contains(self.CONFIG.SHOW_CLASS)) { self.getElem.spSearchBtn.setAttribute(self.CONFIG.ARIA_EXPANDED, true); } else { self.getElem.spSearchBtn.setAttribute(self.CONFIG.ARIA_EXPANDED, false); } self.getElem.spSearchBtn.disabled = false; } fn.passIntersection(); }; fn.releaseHeader = function () { header.classList.remove(self.CONFIG.FIXED_CLASS); setTimeout(function () { header.classList.remove(self.CONFIG.SHOW_CLASS); }, delayVal); if (!smallScreenMql.matches && self.getElem.spSearchBtn && self.getElem.spSearchTarget) { self.getElem.spSearchBtn.setAttribute(self.CONFIG.ARIA_EXPANDED, true); self.getElem.spSearchBtn.disabled = true; self.getElem.spSearchTarget.classList.remove(self.CONFIG.HIDE_CLASS); } fn.passIntersection(); }; fn.handleResize = function () { if (resizeTimer !== null) { clearTimeout(resizeTimer); } resizeTimer = setTimeout(function () { fn.adjustHeaderHeight(); if (!fn.hasIntersectionObserver()) { fn.runForLegacy(); } }, delayVal); }; fn.handleIntersect = function (entries) { entries.forEach(function (entry) { if (entry.isIntersecting) { fn.releaseHeader(); fn.adjustHeaderHeight(); } else { fn.fixHeader(); fn.adjustHeaderHeight(); } }); }; fn.runForLegacy = function () { if (win.pageYOffset > Math.round(header.getBoundingClientRect().top)) { fn.fixHeader(); } else { fn.releaseHeader(); } fn.adjustHeaderHeight(); }; fn.runForEachScreen = function () { if (smallScreenMql.matches) { if (!fn.hasIntersectionObserver()) { win.removeEventListener('load', fn.runForLegacy); win.removeEventListener('scroll', fn.runForLegacy); } if (self.getElem.spSearchTarget && self.getElem.spSearchBtn) { self.getElem.spSearchBtn.disabled = false; if (self.getElem.spSearchTarget.classList.contains(self.CONFIG.SHOW_CLASS)) { self.getElem.spSearchBtn.setAttribute(self.CONFIG.ARIA_EXPANDED, true); } else { self.getElem.spSearchBtn.setAttribute(self.CONFIG.ARIA_EXPANDED, false); } } if (suggestTarget) { doc.body.classList.remove(self.CONFIG.SUGGEST_SHOW_CLASS); suggestTarget.classList.add(searchHiddenClassName); } } else { header.style.height = 'auto'; if (!fn.hasIntersectionObserver()) { win.addEventListener('load', fn.runForLegacy); win.addEventListener('scroll', fn.runForLegacy); } if (self.getElem.spSearchBtn) { setTimeout(function () { if (header.classList.contains(self.CONFIG.FIXED_CLASS)) { self.getElem.spSearchBtn.disabled = false; self.getElem.spSearchBtn.setAttribute(self.CONFIG.ARIA_EXPANDED, false); } else { self.getElem.spSearchBtn.disabled = true; self.getElem.spSearchBtn.setAttribute(self.CONFIG.ARIA_EXPANDED, true); } }, delayVal); } if (suggestTarget) { doc.body.classList.remove(self.CONFIG.SUGGEST_SHOW_CLASS); suggestTarget.classList.add(searchHiddenClassName); } } }; fn.init(); fn.runForEachScreen(); smallScreenMql.addListener(fn.runForEachScreen); win.addEventListener('resize', fn.handleResize); }; KEYENCE.setMenu = function () { var self = this; var isAnimated = false; var toggleMenu = null; var transitionEndMenu = null; var transitionEndSearch = null; var transitionEndPhone = null; var runKeydown = null; var runForEachScreen = null; var body = null; if (!self.getElem.spMenu) { return; } body = doc.body; if (doc.getElementById('js-controlHeader')) { body.dataset.header = 'full'; } toggleMenu = function (e) { var thisTrigger = e.currentTarget; e.preventDefault(); if (!isAnimated) { isAnimated = true; if (smallScreenMql.matches) { if (self.getElem.docElement.scrollTop) { self.getElem.docElement.scrollTop = 0; } if (doc.body.scrollTop) { doc.body.scrollTop = 0; } } if (this.otherTargets.length) { this.otherTargets.forEach((target) => { if (target) { target.classList.remove(self.CONFIG.SHOW_CLASS); } }); } if (this.triggers.length) { this.triggers.forEach((trigger) => { if (trigger) { trigger.setAttribute(self.CONFIG.ARIA_EXPANDED, false); } }); } if (this.target.classList.contains(self.CONFIG.SHOW_CLASS)) { thisTrigger.setAttribute(self.CONFIG.ARIA_EXPANDED, false); this.target.classList.remove(self.CONFIG.SHOW_CLASS); this.target.classList.add(self.CONFIG.HIDE_CLASS); body.classList.remove(self.CONFIG.MENU_SHOW_CLASS); } else { thisTrigger.setAttribute(self.CONFIG.ARIA_EXPANDED, true); this.target.classList.add(self.CONFIG.SHOW_CLASS); this.target.classList.remove(self.CONFIG.HIDE_CLASS); body.classList.add(self.CONFIG.MENU_SHOW_CLASS); if (self.getElem.slideNavTarget.length) { self.getElem.slideNavTarget.forEach(function (items) { items.classList.remove(self.CONFIG.SHOW_CLASS); }); } } } }; runKeydown = function (e) { if (e.key === 'Esc' || e.key === 'Escape') { e.preventDefault(); if (!this.classList.contains(self.CONFIG.MENU_SHOW_CLASS)) { return; } this.classList.remove(self.CONFIG.MENU_SHOW_CLASS); if (self.getElem.spMenuBtn && self.getElem.spMenuTarget) { self.getElem.spMenuBtn.setAttribute(self.CONFIG.ARIA_EXPANDED, false); self.getElem.spMenuTarget.classList.remove(self.CONFIG.SHOW_CLASS); self.getElem.spMenuTarget.classList.add(self.CONFIG.HIDE_CLASS); } if (self.getElem.spSearchBtn && self.getElem.spSearchTarget) { self.getElem.spSearchBtn.setAttribute(self.CONFIG.ARIA_EXPANDED, false); self.getElem.spSearchTarget.classList.remove(self.CONFIG.SHOW_CLASS); self.getElem.spSearchTarget.classList.add(self.CONFIG.HIDE_CLASS); } if (self.getElem.spPhoneBtn && self.getElem.spPhoneTarget) { self.getElem.spPhoneBtn.setAttribute(self.CONFIG.ARIA_EXPANDED, false); self.getElem.spPhoneTarget.classList.remove(self.CONFIG.SHOW_CLASS); self.getElem.spPhoneTarget.classList.add(self.CONFIG.HIDE_CLASS); } } }; transitionEndMenu = function () { isAnimated = false; if (!body.classList.contains(self.CONFIG.MENU_SHOW_CLASS)) { self.getElem.spMenuTarget.removeAttribute('style'); $(self.getElem.spMenuTarget).find(self.CONFIG.FOCUSABLE).removeAttr('tabindex'); } }; transitionEndSearch = function () { isAnimated = false; self.getElem.spMenuTarget.removeAttribute('style'); $(self.getElem.spMenuTarget).find(self.CONFIG.FOCUSABLE).removeAttr('tabindex'); if (!smallScreenMql.matches && self.getElem.spSearchTarget && self.getElem.spSearchTarget.classList.contains(self.CONFIG.SHOW_CLASS) ) { if (self.getElem.spSearchTarget.querySelector('.JSSearchSuggestInput')) { self.getElem.spSearchTarget.querySelector('.JSSearchSuggestInput').focus(); } } }; transitionEndPhone = function () { isAnimated = false; if (!body.classList.contains(self.CONFIG.MENU_SHOW_CLASS)) { self.getElem.spPhoneTarget.removeAttribute('style'); $(self.getElem.spPhoneTarget).find(self.CONFIG.FOCUSABLE).removeAttr('tabindex'); } }; if (self.getElem.spMenuBtn && self.getElem.spMenuTarget) { var triggers = [self.getElem.spSearchBtn, self.getElem.spPhoneBtn]; var otherTargets = [self.getElem.spSearchTarget, self.getElem.spPhoneTarget]; self.getElem.spMenuBtn.setAttribute(self.CONFIG.ARIA_EXPANDED, false); self.getElem.spMenuBtn.setAttribute(self.CONFIG.ARIA_CONTROLS, self.getElem.spMenuTarget.id); self.getElem.spMenuBtn.addEventListener('click', { handleEvent: toggleMenu, triggers: triggers, target: self.getElem.spMenuTarget, otherTargets: otherTargets }, false); } if (self.getElem.spSearchBtn && self.getElem.spSearchTarget) { var triggers = [self.getElem.spMenuBtn, self.getElem.spPhoneBtn]; var otherTargets = [self.getElem.spMenuTarget, self.getElem.spPhoneTarget]; self.getElem.spSearchBtn.setAttribute(self.CONFIG.ARIA_EXPANDED, false); self.getElem.spSearchBtn.setAttribute(self.CONFIG.ARIA_CONTROLS, self.getElem.spSearchTarget.id); self.getElem.spSearchBtn.addEventListener('click', { handleEvent: toggleMenu, triggers: triggers, target: self.getElem.spSearchTarget, otherTargets: otherTargets }, false); } if (self.getElem.spPhoneBtn && self.getElem.spPhoneTarget) { var triggers = [self.getElem.spMenuBtn, self.getElem.spSearchBtn]; var otherTargets = [self.getElem.spMenuTarget, self.getElem.spSearchTarget]; self.getElem.spPhoneBtn.setAttribute(self.CONFIG.ARIA_EXPANDED, false); self.getElem.spPhoneBtn.setAttribute(self.CONFIG.ARIA_CONTROLS, self.getElem.spPhoneTarget.id); self.getElem.spPhoneBtn.addEventListener('click', { handleEvent: toggleMenu, triggers: triggers, target: self.getElem.spPhoneTarget, otherTargets: otherTargets }, false); } self.getElem.spMenuBtn.children[0].addEventListener('transitionend', transitionEndMenu, false); self.getElem.spSearchBtn.addEventListener('transitionend', transitionEndSearch, false); if (self.getElem.spPhoneBtn) { self.getElem.spPhoneBtn.addEventListener('transitionend', transitionEndPhone, false); } runForEachScreen = function () { body.classList.add('is-menu-initializing'); setTimeout(function () { body.classList.remove('is-menu-initializing'); }, 200); if (smallScreenMql.matches) { body.addEventListener('keydown', runKeydown, false); body.classList.remove(self.CONFIG.MENU_SHOW_CLASS); doc.querySelector('.JSHeaderSuggest .JSSearchSuggestInput').blur(); if (self.getElem.spMenuBtn && self.getElem.spMenuTarget) { self.getElem.spMenuTarget.classList.add(self.CONFIG.HIDE_CLASS); self.getElem.spMenuTarget.classList.remove(self.CONFIG.SHOW_CLASS); self.getElem.spMenuBtn.setAttribute(self.CONFIG.ARIA_EXPANDED, false); } if (self.getElem.spSearchBtn && self.getElem.spSearchTarget) { self.getElem.spSearchTarget.classList.add(self.CONFIG.HIDE_CLASS); self.getElem.spSearchTarget.classList.remove(self.CONFIG.SHOW_CLASS); self.getElem.spSearchBtn.setAttribute(self.CONFIG.ARIA_EXPANDED, false); } if (self.getElem.spPhoneBtn && self.getElem.spPhoneTarget) { self.getElem.spPhoneTarget.classList.add(self.CONFIG.HIDE_CLASS); self.getElem.spPhoneTarget.classList.remove(self.CONFIG.SHOW_CLASS); self.getElem.spPhoneBtn.setAttribute(self.CONFIG.ARIA_EXPANDED, false); } } else { body.removeEventListener('keydown', runKeydown, false); if (self.getElem.spMenuBtn && self.getElem.spMenuTarget) { self.getElem.spMenuTarget.classList.remove(self.CONFIG.HIDE_CLASS); } if (self.getElem.spSearchBtn && self.getElem.spSearchTarget) { self.getElem.spSearchTarget.classList.remove(self.CONFIG.HIDE_CLASS); self.getElem.spSearchTarget.classList.remove(self.CONFIG.SHOW_CLASS); self.getElem.spSearchBtn.setAttribute(self.CONFIG.ARIA_EXPANDED, false); if (doc.querySelector('[data-series-header-target="sticky"]')) { self.getElem.spSearchBtn.disabled = false; self.getElem.spSearchBtn.setAttribute(self.CONFIG.ARIA_EXPANDED, false); self.getElem.spSearchTarget.classList.add(self.CONFIG.HIDE_CLASS); body.classList.remove(self.CONFIG.MENU_SHOW_CLASS); } } if (self.getElem.spPhoneBtn && self.getElem.spPhoneTarget) { self.getElem.spPhoneTarget.classList.remove(self.CONFIG.HIDE_CLASS); self.getElem.spPhoneTarget.classList.remove(self.CONFIG.SHOW_CLASS); self.getElem.spPhoneBtn.setAttribute(self.CONFIG.ARIA_EXPANDED, false); } } }; runForEachScreen(); smallScreenMql.addListener(runForEachScreen); }; KEYENCE.setPhoneMenu = function () { var self = this; var isAnimated = false; var togglePhoneMenu = null; var transitionEndPhone = null; var runForEachScreen = null; var runKeydown = null; var body = doc.body; if (!self.getElem.spPhoneMenu || !self.getElem.spPhoneBtn || !self.getElem.spPhoneTarget) { return; } togglePhoneMenu = function (e) { var thisTrigger = e.currentTarget; e.preventDefault(); if (!isAnimated) { isAnimated = true; if (this.phoneTarget.classList.contains(self.CONFIG.SHOW_CLASS)) { thisTrigger.setAttribute(self.CONFIG.ARIA_EXPANDED, false); this.phoneTarget.classList.remove(self.CONFIG.SHOW_CLASS); this.phoneTarget.classList.add(self.CONFIG.HIDE_CLASS); body.classList.remove(self.CONFIG.MENU_SHOW_CLASS); } else { thisTrigger.setAttribute(self.CONFIG.ARIA_EXPANDED, true); this.phoneTarget.classList.add(self.CONFIG.SHOW_CLASS); this.phoneTarget.classList.remove(self.CONFIG.HIDE_CLASS); body.classList.add(self.CONFIG.MENU_SHOW_CLASS); } } }; runKeydown = function (e) { if (e.key === 'Esc' || e.key === 'Escape') { e.preventDefault(); if (!this.classList.contains(self.CONFIG.MENU_SHOW_CLASS)) { return; } this.classList.remove(self.CONFIG.MENU_SHOW_CLASS); self.getElem.spPhoneBtn.setAttribute(self.CONFIG.ARIA_EXPANDED, false); self.getElem.spPhoneTarget.classList.remove(self.CONFIG.SHOW_CLASS); self.getElem.spPhoneTarget.classList.add(self.CONFIG.HIDE_CLASS); } }; transitionEndPhone = function () { isAnimated = false; }; self.getElem.spPhoneTarget.classList.add(self.CONFIG.HIDE_CLASS); self.getElem.spPhoneBtn.setAttribute(self.CONFIG.ARIA_EXPANDED, false); self.getElem.spPhoneBtn.setAttribute(self.CONFIG.ARIA_CONTROLS, self.getElem.spPhoneTarget.id); self.getElem.spPhoneBtn.addEventListener('click', { handleEvent: togglePhoneMenu, phoneTrigger: self.getElem.spPhoneBtn, phoneTarget: self.getElem.spPhoneTarget }, false); self.getElem.spPhoneBtn.addEventListener('transitionend', transitionEndPhone, false); runForEachScreen = function () { body.classList.remove(self.CONFIG.MENU_SHOW_CLASS); self.getElem.spPhoneBtn.setAttribute(self.CONFIG.ARIA_EXPANDED, false); self.getElem.spPhoneTarget.classList.remove(self.CONFIG.SHOW_CLASS); if (smallScreenMql.matches) { body.addEventListener('keydown', runKeydown, false); self.getElem.spPhoneTarget.classList.add(self.CONFIG.HIDE_CLASS); } else { body.removeEventListener('keydown', runKeydown, false); self.getElem.spPhoneTarget.classList.remove(self.CONFIG.HIDE_CLASS); } }; runForEachScreen(); smallScreenMql.addListener(runForEachScreen); }; KEYENCE.setMegaMenu = function () { var self = this; var rootSelector = '.js-megaMenu'; var targetSelector = null; var triggerSelector = null; var overlayName = 'js-menu-overlay'; var targets = null; var triggers = null; var fn = {}; var handlers = {}; var isAnimated = false; var slideNavTargetSelector = '.js-slideNavigation-target'; var arrPageX = []; var arrPageY = []; var resizeTimer = null; var delayVal = 100; if (!self.getElem.megaMenu.length) { return; } targetSelector = rootSelector + '-target'; triggerSelector = rootSelector + '-trigger'; targets = doc.querySelectorAll(targetSelector); triggers = doc.querySelectorAll(triggerSelector); if (!targets.length || !triggers.length) { return; } fn.hideMenu = function (target) { if (target && target.nodeType === 1 && target.classList.contains(self.CONFIG.SHOW_CLASS)) { target.classList.remove(self.CONFIG.SHOW_CLASS); target.classList.add(self.CONFIG.HIDE_CLASS); target.removeAttribute('style'); } }; fn.hideSuggest = function () { doc.body.classList.remove(self.CONFIG.SUGGEST_SHOW_CLASS); doc.querySelector('.JSHeaderSuggest .JSSearchSuggestTarget').classList.add('IsHidden'); }; fn.showMenu = function (target) { if (target && target.nodeType === 1) { target.classList.add(self.CONFIG.SHOW_CLASS); target.classList.remove(self.CONFIG.HIDE_CLASS); doc.body.classList.add(self.CONFIG.MEGA_MENU_SHOW_CLASS); if (doc.getElementById(overlayName)) { doc.getElementById(overlayName).setAttribute('data-owner', 'megaMenu'); } } }; fn.adjustTargetHeight = function (target) { if (target && target.nodeType === 1 && target.children[0]) { if (target.offsetHeight < target.children[0].offsetHeight) { target.style.height = target.children[0].offsetHeight + 'px'; } else { target.style.height = target.offsetHeight + 'px'; } } }; fn.activateTrigger = function (trigger) { if (trigger && trigger.nodeType === 1) { trigger.classList.add(self.CONFIG.ACTIVE_CLASS); } }; fn.deactivateTrigger = function (trigger) { if (trigger && trigger.nodeType === 1) { trigger.classList.remove(self.CONFIG.ACTIVE_CLASS); } }; fn.removeMenuShowClass = function () { doc.body.classList.remove(self.CONFIG.MEGA_MENU_SHOW_CLASS); }; handlers.onForcusinForFocusable = function (e) { if (!e.target.closest(rootSelector)) { targets.forEach(function (items) { fn.hideMenu(items); }); triggers.forEach(function (items) { fn.deactivateTrigger(items); }); fn.removeMenuShowClass(); } }; handlers.onMouseenterForTrigger = function (e) { var thisTrigger = e.currentTarget; e.preventDefault(); triggers.forEach(function (items) { fn.deactivateTrigger(items); }); targets.forEach(function (items) { fn.hideMenu(items); }); fn.showMenu(this.target); fn.adjustTargetHeight(this.target); fn.activateTrigger(thisTrigger); doc.activeElement.blur(); fn.hideSuggest(); }; handlers.onForcusinForTrigger = function (e) { var thisTrigger = e.currentTarget; triggers.forEach(function (items) { fn.deactivateTrigger(items); }); targets.forEach(function (items) { fn.hideMenu(items); }); fn.showMenu(this.target); fn.adjustTargetHeight(this.target); fn.activateTrigger(thisTrigger); fn.hideSuggest(); }; handlers.onTouchstartForTrigger = function (e) { arrPageX.length = 0; arrPageY.length = 0; arrPageX.push(e.touches[0].pageX); arrPageY.push(e.touches[0].pageY); if (doc.querySelectorAll('.JSSearchSuggestTarget').length) { doc.querySelectorAll('.JSSearchSuggestTarget').forEach(function (items) { items.classList.add('IsHidden'); }); } }; handlers.onTouchendForTrigger = function (e) { if (e.changedTouches[0].pageX !== arrPageX[0] || e.changedTouches[0].pageY !== arrPageY[0]) { e.preventDefault(); } }; handlers.onMouseleaveForTrigger = function (e) { var thisTrigger = e.currentTarget; fn.hideMenu(this.target); fn.deactivateTrigger(thisTrigger); fn.removeMenuShowClass(); }; handlers.onMouseenterForTarget = function () { fn.showMenu(this.target); fn.adjustTargetHeight(this.target); fn.activateTrigger(this.trigger); fn.hideSuggest(); }; handlers.onMouseleaveForTarget = function () { fn.hideMenu(this.target); fn.deactivateTrigger(this.trigger); fn.removeMenuShowClass(); }; handlers.onFocusinForTarget = function () { fn.showMenu(this.target); fn.hideSuggest(); }; handlers.onTouchstartForDoc = function (e) { arrPageX.length = 0; arrPageY.length = 0; arrPageX.push(e.touches[0].pageX); arrPageY.push(e.touches[0].pageY); }; handlers.onTouchstartCloseMegaMenu = function (e) { if (e.changedTouches[0].pageX === arrPageX[0] || e.changedTouches[0].pageY === arrPageY[0]) { if (!e.target.closest(rootSelector)) { if (e.target.id === overlayName) { e.preventDefault(); } fn.deactivateTrigger(this.trigger); fn.hideMenu(this.target); fn.removeMenuShowClass(); } } }; handlers.resizeTarget = function () { if (resizeTimer !== null) { clearTimeout(resizeTimer); } resizeTimer = setTimeout(function () { targets.forEach(function (items) { if (items.classList.contains(self.CONFIG.SHOW_CLASS) && items.children[0]) { items.style.height = items.children[0].offsetHeight + 'px'; } }); }, delayVal); }; handlers.slideNext = function (e) { var $this = $(this); if (!self.getElem.slideNavTarget.length) { return; } e.preventDefault(); if (!isAnimated) { isAnimated = true; if (self.getElem.docElement.scrollTop) { self.getElem.docElement.scrollTop = 0; } if (doc.body.scrollTop) { doc.body.scrollTop = 0; } self.getElem.slideNavTarget.forEach(function (items) { items.classList.remove(self.CONFIG.SHOW_CLASS); }); if (this.closest('li') && this.closest('li').querySelector(slideNavTargetSelector)) { this.closest('li').querySelector(slideNavTargetSelector).classList.add(self.CONFIG.SHOW_CLASS); $(self.getElem.spMenuTarget).find(self.CONFIG.FOCUSABLE).attr('tabindex', -1); $(this.closest('li').querySelector(slideNavTargetSelector)).find(self.CONFIG.FOCUSABLE).removeAttr('tabindex'); } if ($this.parents(slideNavTargetSelector).length) { $this.parents(slideNavTargetSelector).addClass(self.CONFIG.SHOW_CLASS); } if (self.getElem.spMenuTarget) { self.getElem.spMenuTarget.style.left = Number(self.getElem.spMenuTarget.style.left.slice(0, -1)) - 100 + '%'; } this.blur(); } }; handlers.slidePrev = function (e) { if (!self.getElem.spMenuTarget) { return; } e.preventDefault(); if (!isAnimated) { isAnimated = true; if (self.getElem.docElement.scrollTop) { self.getElem.docElement.scrollTop = 0; } if (doc.body.scrollTop) { doc.body.scrollTop = 0; } self.getElem.spMenuTarget.classList.add('is-back'); self.getElem.spMenuTarget.style.left = Number(self.getElem.spMenuTarget.style.left.slice(0, -1)) + 100 + '%'; if (this.closest(slideNavTargetSelector)) { this.closest(slideNavTargetSelector).classList.add('is-targeted'); } this.blur(); } }; handlers.slideEnd = function () { var target = null; if (this.classList.contains('is-back')) { if (self.getElem.slideNavPrevTrigger.length) { self.getElem.slideNavPrevTrigger.forEach(function (items) { target = items.closest(slideNavTargetSelector + '.is-targeted'); if (target) { target.classList.remove(self.CONFIG.SHOW_CLASS); target.classList.remove('is-targeted'); $(self.getElem.spMenuTarget).find(self.CONFIG.FOCUSABLE).attr('tabindex', -1); $(self.getElem.slideNavTarget).filter('.' + self.CONFIG.SHOW_CLASS).find(self.CONFIG.FOCUSABLE).removeAttr('tabindex'); } }); } this.classList.remove('is-back'); } if (Number(self.getElem.spMenuTarget.style.left.slice(0, -1)) === 0) { $(self.getElem.spMenuTarget).find(self.CONFIG.FOCUSABLE).removeAttr('tabindex'); } isAnimated = false; }; self.getElem.megaMenu.forEach(function (items) { var target = items.querySelector(targetSelector); var trigger = items.querySelector(triggerSelector); var objMouseenterForTrigger = { handleEvent: handlers.onMouseenterForTrigger, target: target }; var objForcusinForTrigger = { handleEvent: handlers.onForcusinForTrigger, target: target }; var objMouseleaveForTrigger = { handleEvent: handlers.onMouseleaveForTrigger, target: target }; var objMouseenterForTarget = { handleEvent: handlers.onMouseenterForTarget, trigger: trigger, target: target }; var objMouseleaveForTarget = { handleEvent: handlers.onMouseleaveForTarget, trigger: trigger, target: target }; var objFocusinForTarget = { handleEvent: handlers.onFocusinForTarget, target: target }; var objTouchstarCloseMegaMenu = { handleEvent: handlers.onTouchstartCloseMegaMenu, trigger: trigger, target: target }; fn.runForEachScreen1 = function () { if (smallScreenMql.matches) { trigger.removeEventListener('mouseenter', objMouseenterForTrigger, false); trigger.removeEventListener('touchstart', handlers.onTouchstartForTrigger, false); trigger.removeEventListener('touchmove', objMouseenterForTrigger, false); trigger.removeEventListener('touchend', handlers.onTouchendForTrigger, false); trigger.removeEventListener('focusin', objForcusinForTrigger, false); trigger.removeEventListener('mouseleave', objMouseleaveForTrigger, false); target.removeEventListener('mouseenter', objMouseenterForTarget, false); target.removeEventListener('mouseleave', objMouseleaveForTarget, false); target.removeAttribute('style'); target.querySelectorAll(self.CONFIG.FOCUSABLE).forEach(function (selectors) { selectors.removeEventListener('focusin', objFocusinForTarget, false); }); fn.removeMenuShowClass(); fn.deactivateTrigger(trigger); doc.removeEventListener('touchstart', handlers.onTouchstartForDoc, false); doc.removeEventListener('touchend', objTouchstarCloseMegaMenu, false); win.removeEventListener('resize', handlers.resizeTarget, false); } else { trigger.addEventListener('touchstart', handlers.onTouchstartForTrigger, false); trigger.addEventListener('touchend', handlers.onTouchendForTrigger, false); trigger.addEventListener('mouseenter', objMouseenterForTrigger, false); trigger.addEventListener('touchmove', objMouseenterForTrigger, false); trigger.addEventListener('focusin', objForcusinForTrigger, false); trigger.addEventListener('mouseleave', objMouseleaveForTrigger, false); target.addEventListener('mouseenter', objMouseenterForTarget, false); target.addEventListener('mouseleave', objMouseleaveForTarget, false); target.querySelectorAll(self.CONFIG.FOCUSABLE).forEach(function (selectors) { selectors.addEventListener('focusin', objFocusinForTarget, false); }); doc.addEventListener('touchstart', handlers.onTouchstartForDoc, false); doc.addEventListener('touchend', objTouchstarCloseMegaMenu, false); win.addEventListener('resize', handlers.resizeTarget, false); } }; fn.runForEachScreen1(); smallScreenMql.addListener(fn.runForEachScreen1); }); fn.spMegaMenuEvents = function () { if (self.getElem.slideNavNextTrigger.length) { self.getElem.slideNavNextTrigger.forEach(function (items) { items.addEventListener('click', handlers.slideNext, false); }); } if (self.getElem.slideNavPrevTrigger.length) { self.getElem.slideNavPrevTrigger.forEach(function (items) { items.addEventListener('click', handlers.slidePrev, false); }); } if (self.getElem.spMenuTarget) { self.getElem.spMenuTarget.addEventListener('transitionend', handlers.slideEnd, false); } }; fn.runForEachScreen2 = function () { if (smallScreenMql.matches) { fn.spMegaMenuEvents(); targets.forEach(function (items) { items.classList.remove(self.CONFIG.SHOW_CLASS); items.classList.remove(self.CONFIG.HIDE_CLASS); }); doc.querySelectorAll(self.CONFIG.FOCUSABLE).forEach(function (selectors) { selectors.removeEventListener('focusin', handlers.onForcusinForFocusable, false); }); if (self.getElem.changeLangTrigger) { self.getElem.changeLangTrigger.removeEventListener('focusin', handlers.onForcusinForFocusable, false); } } else { $(self.getElem.spMenuTarget).find(self.CONFIG.FOCUSABLE).removeAttr('tabindex'); if (self.getElem.slideNavNextTrigger.length) { self.getElem.slideNavNextTrigger.forEach(function (items) { items.removeEventListener('click', handlers.slideNext, false); }); } if (self.getElem.slideNavPrevTrigger.length) { self.getElem.slideNavPrevTrigger.forEach(function (items) { items.removeEventListener('click', handlers.slidePrev, false); }); } if (self.getElem.spMenuTarget) { self.getElem.spMenuTarget.removeAttribute('style'); self.getElem.spMenuTarget.removeEventListener('transitionend', handlers.slideEnd, false); } if (self.getElem.slideNavTarget) { self.getElem.slideNavTarget.forEach(function (items) { items.classList.remove(self.CONFIG.SHOW_CLASS); }); } doc.querySelectorAll(self.CONFIG.FOCUSABLE).forEach(function (selectors) { selectors.addEventListener('focusin', handlers.onForcusinForFocusable, false); }); if (self.getElem.changeLangTrigger) { self.getElem.changeLangTrigger.addEventListener('focusin', handlers.onForcusinForFocusable, false); } } }; fn.runForEachScreen2(); smallScreenMql.addListener(fn.runForEachScreen2); }; KEYENCE.divideMenu = function () { var self = this; var targetList = null; var targetListLength = null; var $targetList = null; var i = null; var j = null; var rowNumArrLength = null; var divideArrLength = null; var divideArrsLength = null; var rowNumArr = []; var divideArr = []; var accumulation = 0; var divideCount = 0; var groupCount = 0; var groupClassStr = 'group'; if (!self.getElem.divideMenu) { return; } targetList = self.getElem.divideMenu.querySelectorAll('.navigationMegaMenu-list'); $targetList = $(targetList); targetListLength = $targetList.length; if (!targetListLength) { return; } for (i = 0; i < targetListLength; i++) { if (!$targetList.eq(i).hasClass('smallScreen-show')) { rowNumArr.push($targetList.eq(i).find('li:not(".smallScreen-show")').length); } else { rowNumArr.push(0); } } divideArr[divideCount] = []; for (i = 0, rowNumArrLength = rowNumArr.length; i < rowNumArrLength; i++) { if (accumulation <= win.kpi_usersettings.MegaMenuRowsNum) { accumulation += rowNumArr[i]; if (accumulation + rowNumArr[i + 1] <= win.kpi_usersettings.MegaMenuRowsNum) { divideArr[divideCount].push(rowNumArr[i]); divideArr[divideCount + 1] = []; } else { divideArr[divideCount].push(rowNumArr[i]); divideArr[divideCount + 1] = []; accumulation = 0; divideCount++; } } } divideArr.pop(); $(self.getElem.divideMenu).find('.layout-megaMenuGrid').addClass('of-column-' + divideArr.length); for (i = 0, divideArrLength = divideArr.length; i < divideArrLength; i++) { for (j = 0, divideArrsLength = divideArr[i].length; j < divideArrsLength; j++) { groupCount++; $targetList.eq(groupCount - 1).addClass(groupClassStr + i); } $targetList.filter('.' + groupClassStr + i).wrapAll('
'); $targetList.filter('.' + groupClassStr + i).removeClass(groupClassStr + i); } }; KEYENCE.setCategoryHeader = function () { var self = this; var classNames = { commonInner: 'js-categoryHeader-commonInner', titleArea: 'js-categoryHeader-titleArea', navigationGroup: 'js-categoryHeader-navigationGroup', navigationListOuter: 'js-categoryHeader-navigationListOuter', trigger: 'js-categoryHeader-trigger', targetGroup: 'js-categoryHeader-targetGroup', target: 'js-categoryHeader-target', subNavigationLink: 'js-categoryHeader-subNavigationLink' }; var commonInner = doc.querySelector('.' + classNames.commonInner); var titleArea = doc.querySelector('.' + classNames.titleArea); var navigationGroup = doc.querySelector('.' + classNames.navigationGroup); var targetGroup = doc.querySelector('.' + classNames.targetGroup); var arrPageX = []; var arrPageY = []; var fn = {}; var handlers = {}; var handlersObj = {}; if (!self.getElem.categoryHeader) { return; } fn.init = function () { fn.runForEachScreen(); smallScreenMql.addListener(fn.runForEachScreen); }; fn.setAttribute = function () { var targets = doc.querySelectorAll('.' + classNames.target); targets.forEach(function (target) { target.setAttribute("aria-hidden", true); }); }; fn.setMaxWidthOfNavigation = function (mql) { var commonInnerWidth; var titleAreaWidth; var maxWidth; if (!commonInner || !titleArea || !navigationGroup) { return; } commonInnerWidth = commonInner.offsetWidth; titleAreaWidth = titleArea.offsetWidth; maxWidth = mql.matches ? "none" : commonInnerWidth - titleAreaWidth + 'px'; navigationGroup.style.maxWidth = maxWidth; }; fn.setOverflowingClass = function () { var navigationListOuter = doc.querySelector('.' + classNames.navigationListOuter); if (!navigationListOuter) { return; } fn.deActiveSubNavigation(); if (navigationListOuter.scrollWidth > navigationListOuter.clientWidth) { navigationListOuter.classList.add('is-overflowing') } else { navigationListOuter.classList.remove('is-overflowing') } }; fn.setPositionOfSubNavigation = function (currentNavigation) { var currentLeft; var currentRight; var wrapperLeft; var wrapperRight; var targetGroupWidth; var left; if (!currentNavigation || !navigationGroup || !targetGroup) { return; } setTimeout(() => { currentLeft = currentNavigation.getBoundingClientRect().left; currentRight = currentNavigation.getBoundingClientRect().right; wrapperLeft = navigationGroup.getBoundingClientRect().left; wrapperRight = navigationGroup.getBoundingClientRect().right; targetGroupWidth = targetGroup.offsetWidth; if (currentLeft < wrapperLeft) { left = wrapperLeft + 'px'; } else if (currentRight >= wrapperRight) { left = wrapperRight - targetGroupWidth + 'px'; } else if (wrapperRight - currentLeft < targetGroupWidth) { left = currentLeft - (targetGroupWidth - currentNavigation.offsetWidth) + 'px'; } else { left = currentLeft + 'px'; } targetGroup.style.left = left; }, 0); }; fn.activeSubNavigation = function (currentNavigation) { var triggers = doc.querySelectorAll('.' + classNames.trigger); var targets = doc.querySelectorAll('.' + classNames.target); var currentNavigationId = currentNavigation ? currentNavigation.getAttribute("aria-controls") : null; var hasSubNavigation = doc.querySelector('#' + currentNavigationId) ? true : false; hasSubNavigation ? targetGroup.classList.add(KEYENCE.CONFIG.SHOW_CLASS) : targetGroup.classList.remove(KEYENCE.CONFIG.SHOW_CLASS); triggers.forEach(function (trigger) { var isSelected = trigger === currentNavigation; trigger.tabIndex = isSelected ? 0 : -1; isSelected && hasSubNavigation ? trigger.classList.add(KEYENCE.CONFIG.ACTIVE_CLASS) : trigger.classList.remove(KEYENCE.CONFIG.ACTIVE_CLASS); }); targets.forEach(function (target) { var isSelected = target.id === currentNavigationId; hasSubNavigation ? target.setAttribute("aria-hidden", !isSelected) : target.setAttribute("aria-hidden", true); }); }; fn.deActiveSubNavigation = function () { var triggers = doc.querySelectorAll('.' + classNames.trigger); var targets = doc.querySelectorAll('.' + classNames.target); targetGroup.classList.remove(KEYENCE.CONFIG.SHOW_CLASS); targetGroup.style.left = ""; triggers.forEach(function (trigger) { // trigger.tabIndex = 0; trigger.classList.remove(KEYENCE.CONFIG.ACTIVE_CLASS); }); targets.forEach(function (target) { target.setAttribute("aria-hidden", true); }); }; fn.switchNavigation = function (event) { var triggers = doc.querySelectorAll('.' + classNames.trigger); switch (event.key) { case "ArrowRight": { if (triggers[fn.getSelectedNavigationIndex() + 1]) { triggers[fn.getSelectedNavigationIndex() + 1].focus(); } else { fn.getFirstNavigation().focus(); } break; } case "ArrowLeft": { if (triggers[fn.getSelectedNavigationIndex() - 1]) { triggers[fn.getSelectedNavigationIndex() - 1].focus(); } else { fn.getLastNavigation().focus(); } break; } } }; fn.getFirstNavigation = function () { var triggers = doc.querySelectorAll('.' + classNames.trigger); return triggers[0]; }; fn.getLastNavigation = function () { var triggers = doc.querySelectorAll('.' + classNames.trigger); return triggers[triggers.length - 1]; }; fn.getSelectedNavigationIndex = function () { var triggers = doc.querySelectorAll('.' + classNames.trigger); return Array.from(triggers).findIndex(function (elm) { return elm.tabIndex === 0; }); }; handlers.scrollForNavigationListOuter = function () { var navigationListOuter = doc.querySelector('.' + classNames.navigationListOuter); if (!navigationListOuter) { return; } fn.deActiveSubNavigation(); navigationListOuter.classList.add('is-hasScrolled') }; handlers.mouseenterForTrigger = function (event) { var currentNavigation = event.currentTarget; fn.setPositionOfSubNavigation(currentNavigation); fn.activeSubNavigation(currentNavigation); }; handlers.focusinForTrigger = function (event) { var currentNavigation = event.currentTarget; fn.setPositionOfSubNavigation(currentNavigation); fn.activeSubNavigation(currentNavigation); }; handlers.clickForTrigger = function (event) { var currentNavigation = event.currentTarget; var hasActiveClass = currentNavigation.classList.contains(KEYENCE.CONFIG.ACTIVE_CLASS); if (currentNavigation.getAttribute('aria-controls') || currentNavigation.getAttribute('href') === "") { event.preventDefault(); } if (hasActiveClass) { fn.deActiveSubNavigation(); } else { fn.activeSubNavigation(currentNavigation); } }; handlers.touchstart = function (event) { arrPageX.length = 0; arrPageY.length = 0; arrPageX.push(event.touches[0].pageX); arrPageY.push(event.touches[0].pageY); }; handlers.touchend = function (event) { if (event.changedTouches[0].pageX === arrPageX[0] || event.changedTouches[0].pageY === arrPageY[0]) { if (!event.target.closest('.' + classNames.navigationGroup)) { fn.deActiveSubNavigation(); } } }; handlers.mouseleaveForNavigation = function () { fn.deActiveSubNavigation(); }; handlers.keyupForTrigger = function (event) { fn.switchNavigation(event); }; handlersObj.scrollForNavigationListOuter = { handleEvent: handlers.scrollForNavigationListOuter }; handlersObj.mouseenterForTrigger = { handleEvent: handlers.mouseenterForTrigger }; handlersObj.focusinForTrigger = { handleEvent: handlers.focusinForTrigger }; handlersObj.clickForTrigger = { handleEvent: handlers.clickForTrigger }; handlersObj.mouseleaveForNavigation = { handleEvent: handlers.mouseleaveForNavigation }; handlersObj.keyupForTrigger = { handleEvent: handlers.keyupForTrigger }; handlersObj.touchstart = { handleEvent: handlers.touchstart }; handlersObj.touchend = { handleEvent: handlers.touchend }; fn.runForEachScreen = function () { var self = this; var resizeObserver = new ResizeObserver(fn.setMaxWidthOfNavigation.bind(self, smallScreenMql)); var resizeObserverOfNavigationListOuter = new ResizeObserver(fn.setOverflowingClass); var trigger = doc.querySelectorAll('.' + classNames.trigger); var navigationListOuter = doc.querySelector('.' + classNames.navigationListOuter); fn.setAttribute(); resizeObserverOfNavigationListOuter.observe(navigationListOuter); navigationListOuter.addEventListener('scroll', handlersObj.scrollForNavigationListOuter, false); doc.addEventListener('touchstart', handlersObj.touchstart, false); doc.addEventListener('touchend', handlersObj.touchend, false); if (smallScreenMql.matches) { resizeObserver.unobserve(commonInner); navigationGroup.removeEventListener('mouseleave', handlersObj.mouseleaveForNavigation, false); trigger.forEach(function(elm) { elm.removeEventListener('mouseenter', handlersObj.mouseenterForTrigger, false); elm.removeEventListener('focusin', handlersObj.focusinForTrigger, false); elm.addEventListener('click', handlersObj.clickForTrigger, false); }); targetGroup.style.left = ''; } else { resizeObserver.observe(commonInner); navigationGroup.addEventListener('mouseleave', handlersObj.mouseleaveForNavigation, false); trigger.forEach(function(elm) { elm.removeEventListener('click', handlersObj.clickForTrigger, false); elm.addEventListener('click', function (event) { if (event.currentTarget.getAttribute('href') === "") { event.preventDefault(); } }, false); elm.addEventListener('focusin', handlersObj.focusinForTrigger, false); elm.addEventListener('mouseenter', handlersObj.mouseenterForTrigger, false); elm.addEventListener('keyup', handlersObj.keyupForTrigger, false); }); doc.querySelectorAll(KEYENCE.CONFIG.FOCUSABLE).forEach(function (selectors) { selectors.addEventListener('focusin', function (event) { if (!event.target.closest('.' + classNames.navigationGroup)) { fn.deActiveSubNavigation(); } }, false); }); } }; fn.init(); }; KEYENCE.setChangeLanguage = function () { var self = this; var setToggle = null; var runClick = null; var runKeydown = null; var closeTarget = null; var runForEachScreen = null; if (!self.getElem.changeLangTrigger || !self.getElem.changeLangTarget) { return; } if (self.getElem.changeLangTarget.querySelectorAll('li').length <= 1) { return; } setToggle = function (target) { if (target.getAttribute(self.CONFIG.ARIA_EXPANDED) === 'true') { self.getElem.changeLangTarget.classList.remove(self.CONFIG.SHOW_CLASS); target.setAttribute(self.CONFIG.ARIA_EXPANDED, false); } else { self.getElem.changeLangTarget.classList.add(self.CONFIG.SHOW_CLASS); target.setAttribute(self.CONFIG.ARIA_EXPANDED, true); } }; runClick = function (e) { e.preventDefault(); setToggle(this); }; runKeydown = function (e) { if (e.key === 'Spacebar' || e.key === ' ' || e.key === 'Enter') { e.preventDefault(); setToggle(this); } }; closeTarget = function (e) { if (!e.target.closest('#' + self.getElem.changeLang.id)) { self.getElem.changeLangTarget.classList.remove(self.CONFIG.SHOW_CLASS); self.getElem.changeLangTrigger.setAttribute(self.CONFIG.ARIA_EXPANDED, false); } }; runForEachScreen = function () { if (smallScreenMql.matches) { self.getElem.changeLangTrigger.removeAttribute(self.CONFIG.ARIA_CONTROLS); self.getElem.changeLangTrigger.removeAttribute(self.CONFIG.ARIA_EXPANDED); self.getElem.changeLangTrigger.removeAttribute('tabindex'); self.getElem.changeLangTrigger.removeEventListener('click', runClick, false); self.getElem.changeLangTrigger.removeEventListener('keydown', runKeydown, false); doc.removeEventListener('click', closeTarget, false); } else { self.getElem.changeLangTrigger.setAttribute(self.CONFIG.ARIA_CONTROLS, self.getElem.changeLangTarget.id); self.getElem.changeLangTrigger.setAttribute(self.CONFIG.ARIA_EXPANDED, false); self.getElem.changeLangTrigger.tabIndex = 0; self.getElem.changeLangTrigger.addEventListener('click', runClick, false); self.getElem.changeLangTrigger.addEventListener('keydown', runKeydown, false); doc.addEventListener('click', closeTarget, false); } }; runForEachScreen(); smallScreenMql.addListener(runForEachScreen); }; KEYENCE.setCurrentNav = function () { var self = this; var nav; var href = null; var hrefRegexp = null; var pathname = win.location.pathname; if (win.suz_LanguagePath + '/' === pathname) { return; } if (!self.getElem.focusOrderTrigger) { return; } nav = self.getElem.focusOrderTrigger.querySelectorAll('.navigationGlobal > li > a'); if (!nav.length) { return; } nav.forEach(function (items) { href = items.pathname.replace(/^\/(.+)(\/index\.jsp?)$/, '/$1/'); hrefRegexp = new RegExp('^' + href); if (hrefRegexp.test(pathname)) { items.classList.add(self.CONFIG.CURRENT_CLASS); } }); }; KEYENCE.ctrlTelLink = function () { var telLink = doc.querySelectorAll('a[href^="tel:"]'); var hasTouchScreen = false; var mQ = null; var ua = win.navigator.userAgent; var cancelLink = null; if (!telLink.length) { return; } cancelLink = function (e) { e.preventDefault(); }; if ('maxTouchPoints' in navigator) { hasTouchScreen = win.navigator.maxTouchPoints > 0; if (ua.indexOf('Edge') !== -1) { if (ua.indexOf('Windows Phone') === -1 && ua.indexOf('IEMobile') === -1) { hasTouchScreen = false; } } } else if ('msMaxTouchPoints' in navigator) { hasTouchScreen = win.navigator.msMaxTouchPoints > 0; } else { mQ = win.matchMedia && matchMedia('(pointer:coarse)'); if (mQ && mQ.media === '(pointer:coarse)') { hasTouchScreen = Boolean(mQ.matches); } else if ('orientation' in win) { hasTouchScreen = true; } else { hasTouchScreen = ( /\b(BlackBerry|webOS|iPhone|IEMobile)\b/i.test(ua) || /\b(Android|Windows Phone|iPad|iPod)\b/i.test(ua) ); } } if (!hasTouchScreen) { telLink.forEach(function (item) { item.addEventListener('click', cancelLink, false); }); } }; KEYENCE.ctrlFocusOrder = function () { var self = this; var $gNav = $(self.getElem.focusOrderTrigger); var $spMenuTarget = $(self.getElem.spMenuTarget); var $spMenuBtn = $(self.getElem.spMenuBtn); var $spSearchBtn = $(self.getElem.spSearchBtn); var runForEachScreen = null; runForEachScreen = function () { if (smallScreenMql.matches) { $gNav.insertBefore($spMenuTarget.children().filter(':first')); $spSearchBtn.insertAfter($spMenuBtn); } else { $gNav.insertAfter($spMenuTarget.children().filter(':last')); $spSearchBtn.insertAfter($gNav.children().filter(':last')); } }; runForEachScreen(); smallScreenMql.addListener(runForEachScreen); }; KEYENCE.setHomeAdjustHeight = function () { var self = this; var roots = self.getElem.adjustHeight; var fn = {}; var className = { adjustHeightTarget: 'js-setHomeAdjustHeight-target' }; if (!roots.length) { return; } fn.init = function () { roots.forEach(function (root) { fn.setTargetHeight(root); fn.resizeWindow(root); }); }; fn.resizeWindow = function (root) { var timer = null; win.addEventListener('resize', function () { if (timer !== null) { clearTimeout(timer); } timer = setTimeout(function () { fn.setTargetHeight(root); }, 200); }); }; fn.getTarget = function (root) { var adjustHeightTarget = root.querySelectorAll('.' + className.adjustHeightTarget); return adjustHeightTarget; }; fn.destroyHeight = function (root) { var target = fn.getTarget(root); if (!target.length) { return; } target.forEach(function (elm) { elm.style.height = ''; }); }; fn.setTargetHeight = function (root) { var target = fn.getTarget(root); var targetHeight = 0; var maxHeight = 0; var windowWidth = win.innerWidth; if (!target.length) { return; } if (windowWidth > 640) { target.forEach(function (elm) { elm.style.height = ''; targetHeight = elm.offsetHeight; if (targetHeight > maxHeight) { maxHeight = targetHeight; } }); target.forEach(function (elm) { elm.style.height = maxHeight + 'px'; }); } else { fn.destroyHeight(root); } }; fn.init(); }; KEYENCE.setHomeCarousel = function () { var self = this; var className = { utilityTemplate: 'js-setHomeCarousel-utilityControllerTemplate', paginationListTemplate: 'js-setHomeCarousel-paginationListTemplate', targetOuter: 'js-setHomeCarousel-targetOuter', target: 'js-setHomeCarousel-target', clone: 'js-setHomeCarousel-clone', utility: 'js-setHomeCarousel-utilityController', image: 'js-setHomeCarousel-image', pagination: 'js-setHomeCarousel-pagination', paginationBtn: 'js-setHomeCarousel-paginationButton', prevBtn: 'js-setCrousel-prevButton', nextBtn: 'js-setCrousel-nextButton', controller: 'js-setHomeCarousel-controller', isInitialized: 'is-initialized' }; var root = null; var targetOuter = null; var targetWidth = null; var target = null; var targetLength = null; var arrTargetLength = []; var currentNum = 0; var timer = null; var isAnimate = false; var isAutoPlay = true; var isEnterSlide = false; var num = 0; var arrPageX = []; var arrPageY = []; var fn = {}; var DURATION = 4000; if (self.getElem.carousel === null) { return; } root = self.getElem.carousel; root.classList.add(className.isInitialized); fn.init = function () { fn.setSlide(); fn.setUtility(); fn.setSlideClone(); fn.setSlideWidth(); fn.setAlly(); fn.setPaginationCurrent(0); fn.swipe(); fn.resizeWindow(); fn.addMouseEnterEvent(); fn.addMouseLeaveEvent(); if (isAutoPlay) { fn.setAutoPlay(); } }; targetOuter = root.querySelector('.' + className.targetOuter); target = root.querySelectorAll('.' + className.target); if (targetOuter === null || !target.length) { return; } fn.setSlide = function () { targetLength = target.length; arrTargetLength.push(targetLength); num = 1; currentNum = 0; targetWidth = win.innerWidth; targetOuter.style.transform = 'translate3d(-' + (targetWidth * num) + 'px ,0, 0)'; }; fn.setSlideClone = function () { var firstClone; var lastClone; if (target.length > 1) { firstClone = targetOuter.firstElementChild.cloneNode(true); lastClone = targetOuter.lastElementChild.cloneNode(true); firstClone.classList.add(className.clone); lastClone.classList.add(className.clone); targetOuter.appendChild(firstClone); targetOuter.insertBefore(lastClone, targetOuter.firstElementChild); } }; fn.setSlideWidth = function () { target = root.querySelectorAll('.' + className.target); targetLength = target.length; if (/Macintosh|iP(hone|ad|od)/.test(win.navigator.userAgent) && 'ontouchend' in doc) { targetWidth = doc.documentElement.clientWidth; } else { targetWidth = win.innerWidth; } if (!target.length) { return; } targetOuter.style.width = (targetWidth * targetLength) + 'px'; target.forEach(function (elm) { elm.style.width = targetWidth + 'px'; }); }; fn.setSlideCurrent = function () { target.forEach(function (elm, idx) { elm.classList.remove(self.CONFIG.CURRENT_CLASS); if (elm.classList.contains(self.CONFIG.CURRENT_CLASS)) { num = idx; } }); targetOuter.style.transform = 'translate3d(-' + (targetWidth * num) + 'px ,0, 0)'; target[num].classList.add(self.CONFIG.CURRENT_CLASS); }; fn.setUtility = function () { var utility = doc.getElementById(className.utilityTemplate); var utilityClone; if (utility === null) { return; } utilityClone = fn.createNodeClone(utility, '.' + className.utility); root.appendChild(utilityClone); fn.setPagination(); fn.clickPrevBtn(); fn.clickNextBtn(); fn.clickController(); }; fn.setPagination = function () { var paginationList = doc.getElementById(className.paginationListTemplate); var image = root.querySelectorAll('.' + className.image); var fragment = doc.createDocumentFragment(); var pagination = root.querySelector('.' + className.pagination); var paginationListClone; var srcList = []; var i; var thumbnail; if (pagination === null || paginationList === null || !image.length) { return; } image.forEach(function (elm) { var img; var src; img = elm.querySelector('img'); if (img === null) { return; } src = img.getAttribute('src'); srcList.push(src); }); for (i = 0; i < arrTargetLength[0]; i++) { paginationListClone = fn.createNodeClone(paginationList, 'li'); thumbnail = paginationListClone.querySelector('img'); thumbnail.setAttribute('src', srcList[i]); thumbnail.setAttribute('alt', i + 1); fragment.appendChild(paginationListClone); } pagination.appendChild(fragment); fn.setPaginationStyle(); fn.clickPagination(); }; fn.setPaginationStyle = function () { var pagination = root.querySelector('.' + className.pagination); var paginationBtn; var styleList = []; if (pagination === null) { return; } target.forEach(function (elm) { var style; style = elm.style.background; styleList.push(style); }); paginationBtn = pagination.querySelectorAll('.' + className.paginationBtn); if (!paginationBtn.length) { return; } paginationBtn.forEach(function (elm, idx) { elm.style.background = styleList[idx]; }); }; fn.setPaginationCurrent = function (currentNumber) { var pagination = root.querySelector('.' + className.pagination); var paginationBtn; if (pagination === null) { return; } currentNum = currentNumber; paginationBtn = pagination.querySelectorAll('.' + className.paginationBtn); if (!paginationBtn.length) { return; } paginationBtn.forEach(function (elm, idx) { if (elm.classList.contains(self.CONFIG.CURRENT_CLASS)) { currentNum = idx; } elm.classList.remove(self.CONFIG.CURRENT_CLASS); }); paginationBtn[currentNum].classList.add(self.CONFIG.CURRENT_CLASS); }; fn.setAlly = function () { var $target = $('.' + className.target); if (!$target.length) { return; } $target.find(self.CONFIG.FOCUSABLE).attr('tabIndex', -1); $target.filter('.' + self.CONFIG.CURRENT_CLASS).find(self.CONFIG.FOCUSABLE).attr('tabIndex', 0); }; fn.setAutoPlay = function () { timer = setTimeout(function () { fn.slideNext(); fn.setAutoPlay(); }, DURATION); }; fn.changeSlideCurrent = function () { target.forEach(function (elm, idx) { if (idx === currentNum + 1) { elm.classList.add(self.CONFIG.CURRENT_CLASS); } else { elm.classList.remove(self.CONFIG.CURRENT_CLASS); } }); }; fn.changePaginationCurrent = function () { var pagination = root.querySelector('.' + className.pagination); var paginationBtn; if (pagination === null) { return; } paginationBtn = pagination.querySelectorAll('.' + className.paginationBtn); if (!paginationBtn.length) { return; } paginationBtn.forEach(function (elm, idx) { if (idx === currentNum) { elm.classList.add(self.CONFIG.CURRENT_CLASS); } else { elm.classList.remove(self.CONFIG.CURRENT_CLASS); } }); }; fn.clickPagination = function () { var pagination = root.querySelector('.' + className.pagination); var btn; var currentBtn; if (pagination === null) { return; } btn = pagination.querySelectorAll('.' + className.paginationBtn); if (!btn.length) { return; } btn.forEach(function (elm, idx) { if (isAnimate === false) { elm.addEventListener('click', function () { isAnimate = true; currentBtn = pagination.querySelector('.' + self.CONFIG.CURRENT_CLASS); if (currentBtn === null) { return; } currentBtn.classList.remove(self.CONFIG.CURRENT_CLASS); elm.classList.add(self.CONFIG.CURRENT_CLASS); num = idx + 1; currentNum = idx; fn.slide(); fn.changeSlideCurrent(); fn.setAlly(); }); } }); }; fn.clickController = function () { var utility = root.querySelector('.' + className.utility); var controller; var text; var playText; var stopText; if (utility === null) { return; } controller = utility.querySelector('.' + className.controller); if (controller === null) { return; } text = controller.querySelector('span'); if (text === null) { return; } playText = text.dataset.playlabel; stopText = text.dataset.stoplabel; if (isAutoPlay) { text.innerText = playText; } else { text.innerText = stopText; } controller.addEventListener('click', function () { if (isAutoPlay) { isAutoPlay = false; clearTimeout(timer); text.innerText = playText; controller.classList.add(self.CONFIG.STOP_CLASS); } else { isAutoPlay = true; fn.setAutoPlay(); text.innerText = stopText; controller.classList.remove(self.CONFIG.STOP_CLASS); } }); }; fn.clickPrevBtn = function () { var prevBtn = root.querySelector('.' + className.prevBtn); if (prevBtn === null) { return; } prevBtn.addEventListener('click', function () { fn.slidePrev(); }); }; fn.clickNextBtn = function () { var nextBtn = root.querySelector('.' + className.nextBtn); if (nextBtn === null) { return; } nextBtn.addEventListener('click', function () { fn.slideNext(); }); }; fn.slidePrev = function () { var paginationMax = arrTargetLength[0] - 1; if (isAnimate === false) { isAnimate = true; if (num === 1) { num--; currentNum = paginationMax; } if (num !== 0) { num--; currentNum--; } fn.slide(); fn.changeSlideCurrent(); fn.changePaginationCurrent(); } }; fn.slideNext = function () { var max = targetLength - 1; if (isAnimate === false) { isAnimate = true; if (num === arrTargetLength[0]) { num++; currentNum = 0; } else if (num < max) { num++; currentNum++; } fn.slide(); fn.changeSlideCurrent(); fn.changePaginationCurrent(); fn.setAlly(); } }; fn.slide = function () { var max = targetLength - 1; targetOuter.style.transform = 'translate3d(-' + (targetWidth * num) + 'px ,0, 0)'; targetOuter.style.transition = 'transform 1s ease 0s'; fn.addEventListenerOnce(targetOuter, 'transitionend', function () { isAnimate = false; targetOuter.style.transition = ''; if (num === max) { targetOuter.style.transform = 'translate3d(-' + (targetWidth) + 'px ,0, 0)'; num = 1; } else if (num === 0) { targetOuter.style.transform = 'translate3d(-' + (targetWidth * (max - 1)) + 'px ,0, 0)'; num = max - 1; } if (isAutoPlay) { clearTimeout(timer); fn.setAutoPlay(); } }); }; fn.enterSlide = function () { var utility = root.querySelector('.' + className.utility); var controller; var text; var playText; if (utility === null) { return; } controller = utility.querySelector('.' + className.controller); if (controller === null) { return; } text = controller.querySelector('span'); if (text === null) { return; } playText = text.dataset.playlabel; if (isAutoPlay && !isEnterSlide) { isAutoPlay = false; isEnterSlide = true; clearTimeout(timer); text.innerText = playText; controller.classList.add(self.CONFIG.STOP_CLASS); } }; fn.leaveSlide = function () { var utility = root.querySelector('.' + className.utility); var controller; var text; var stopText; if (utility === null) { return; } controller = utility.querySelector('.' + className.controller); if (controller === null) { return; } text = controller.querySelector('span'); if (text === null) { return; } stopText = text.dataset.stoplabel; if (!isAutoPlay && isEnterSlide) { isAutoPlay = true; isEnterSlide = false; fn.setAutoPlay(); text.innerText = stopText; controller.classList.remove(self.CONFIG.STOP_CLASS); } }; fn.swipe = function () { var startX; var startY; var moveX; var moveY; var distanceX; var distanceY; var nowPosition; var endPosition; var x; var radian; var swipeAngle; target.forEach(function (elm) { elm.addEventListener('touchstart', function (e) { arrPageX.length = 0; arrPageY.length = 0; startX = e.touches[0].pageX; startY = e.touches[0].pageY; arrPageX.push(startX); arrPageY.push(startY); distanceX = 0; clearTimeout(timer); }); elm.addEventListener('touchmove', function (e) { moveX = e.changedTouches[0].pageX; moveY = e.changedTouches[0].pageY; distanceX = moveX - arrPageX[0]; distanceY = moveY - arrPageY[0]; if (distanceX === 0 && e.cancelable) { e.preventDefault(); } if (isAnimate === true) { return; } radian = Math.atan2(distanceY, distanceX); swipeAngle = Math.round(radian * 180 / Math.PI); if (swipeAngle < 0) { swipeAngle = 360 - Math.abs(swipeAngle); } if ((0 < swipeAngle && swipeAngle < 45) || (135 < swipeAngle && swipeAngle < 225) || (315 < swipeAngle && swipeAngle < 360)) { if (Math.abs(distanceX) > 20) { doc.addEventListener('touchmove', fn.scrollControl, {passive: false}); } nowPosition = targetWidth * num; x = nowPosition + -distanceX; if (nowPosition - x < 0 && -targetWidth < nowPosition - x) { targetOuter.style.transition = ''; targetOuter.style.transform = 'translate3d(-' + x + 'px ,0, 0)'; } else if (nowPosition - x > 0 && targetWidth > nowPosition - x) { targetOuter.style.transition = ''; targetOuter.style.transform = 'translate3d(-' + x + 'px ,0, 0)'; } } else { doc.removeEventListener('touchmove', fn.scrollControl, {passive: false}); } }); elm.addEventListener('touchend', function (e) { endPosition = e.changedTouches[0].pageX; if (distanceX === 0) { return; } if (startX !== endPosition && e.cancelable) { e.preventDefault(); } doc.removeEventListener('touchmove', fn.scrollControl, {passive: false}); if (endPosition < startX) { fn.slideNext(); } else if (endPosition > startX) { fn.slidePrev(); } }); }); }; fn.scrollControl = function (e) { if (e.cancelable) { e.preventDefault(); } }; fn.resizeWindow = function () { var resizeTimer = null; win.addEventListener('resize', function () { clearTimeout(timer); if (resizeTimer !== null) { clearTimeout(resizeTimer); } resizeTimer = setTimeout(function () { fn.setSlideWidth(); fn.setSlideCurrent(); fn.setAlly(); fn.setPaginationCurrent(); if (isAutoPlay) { fn.setAutoPlay(); } }, 30); }); }; fn.addMouseEnterEvent = function () { targetOuter.addEventListener('mouseenter', fn.enterSlide); }; fn.addMouseLeaveEvent = function () { targetOuter.addEventListener('mouseleave', fn.leaveSlide); }; fn.addEventListenerOnce = function (elm, type, listener) { elm.addEventListener(type, function func() { elm.removeEventListener(type, func); listener(); }); }; fn.checkSupportsTemp = function () { return 'content' in doc.createElement('template'); }; fn.createNodeClone = function (template, selectorForIE) { if (fn.checkSupportsTemp() === true) { return doc.importNode(template.content, true); } return doc.importNode(template.querySelector(selectorForIE), true); }; fn.init(); }; KEYENCE.setHomeChangeCategory = function () { var self = this; var target; var trigger; var cookieValue; var isAnimate = false; var DELAY = 600; var ORIGINAL_DOMAIN = win.kpi_originalDomain; var CATEGORY_COOKIE_NAME = 'kpi_has_changeCategory'; var fn = {}; if (!self.getElem.changeCategoryTarget.length || !self.getElem.changeCategoryTrigger.length) { return; } target = self.getElem.changeCategoryTarget; trigger = self.getElem.changeCategoryTrigger; cookieValue = util.getCookie(CATEGORY_COOKIE_NAME); fn.init = function () { fn.setMql(); }; fn.setMql = function () { smallScreenMql.addListener(fn.checkBreakPoint); fn.checkBreakPoint(smallScreenMql); }; fn.checkBreakPoint = function () { if (smallScreenMql.matches) { fn.removeCurrentClassForTrigegr(); fn.addShowClassForTarget(); } else { fn.setTrigger(); fn.setTarget(); fn.clickTrigger(); } }; fn.setTrigger = function () { var category; if (cookieValue) { trigger.forEach(function (elm) { category = elm.getAttribute('data-category'); if (category === cookieValue) { elm.classList.add(self.CONFIG.CURRENT_CLASS); } }); } else { trigger[0].classList.add(self.CONFIG.CURRENT_CLASS); } }; fn.setTarget = function () { var category; target.forEach(function (elm) { category = elm.getAttribute('data-category'); if (cookieValue) { if (cookieValue === 'all') { elm.classList.add(self.CONFIG.SHOW_CLASS); } else { if (category === cookieValue) { elm.classList.add(self.CONFIG.SHOW_CLASS); } else { elm.style.display = 'none'; elm.classList.add(self.CONFIG.HIDE_CLASS); elm.classList.remove(self.CONFIG.SHOW_CLASS); } } } else { elm.classList.add(self.CONFIG.SHOW_CLASS); } }); }; fn.clickTrigger = function () { var category; trigger.forEach(function (elm) { elm.addEventListener('click', function () { if (isAnimate === false) { isAnimate = true; fn.removeCurrentClassForTrigegr(); elm.classList.add(self.CONFIG.CURRENT_CLASS); category = elm.getAttribute('data-category'); cookieValue = category; util.setCookie(CATEGORY_COOKIE_NAME, cookieValue); fn.changeCategory(category); } }); }); }; fn.changeCategory = function (category) { var targetCategory; target = doc.querySelectorAll('.js-setChangeCategory-target'); if (!target.length) { return; } if (category === 'all') { fn.addHideClassForTarget(); setTimeout(function () { fn.addShowClassForTarget(); }, DELAY); } else { target.forEach(function (elm) { targetCategory = elm.getAttribute('data-category'); elm.classList.add(self.CONFIG.HIDE_CLASS); elm.classList.remove(self.CONFIG.SHOW_CLASS); elm.addEventListener('animationend', function () { isAnimate = false; if (elm.classList.contains(self.CONFIG.HIDE_CLASS)) { elm.style.display = 'none'; } }); if (category === targetCategory) { setTimeout(function () { if (elm.classList.contains(self.CONFIG.HIDE_CLASS)) { elm.style.display = 'flex'; } elm.classList.remove(self.CONFIG.HIDE_CLASS); elm.classList.add(self.CONFIG.SHOW_CLASS); elm.addEventListener('animationend', function () { isAnimate = false; }); }, DELAY); } }); } }; fn.removeCurrentClassForTrigegr = function () { trigger = doc.querySelectorAll('.js-setChangeCategory-trigger'); if (!trigger.length) { return; } trigger.forEach(function (elm) { elm.classList.remove(self.CONFIG.CURRENT_CLASS); }); }; fn.addShowClassForTarget = function () { target.forEach(function (elm) { elm.classList.remove(self.CONFIG.HIDE_CLASS); elm.classList.add(self.CONFIG.SHOW_CLASS); if (elm.classList.contains(self.CONFIG.SHOW_CLASS)) { elm.style.display = 'flex'; } elm.addEventListener('animationend', function () { isAnimate = false; }); }); }; fn.addHideClassForTarget = function () { target.forEach(function (elm) { elm.classList.remove(self.CONFIG.SHOW_CLASS); elm.classList.add(self.CONFIG.HIDE_CLASS); }); }; fn.init(); }; KEYENCE.setToggleCart = function () { var self = this; var fn = {}; var className = { toggle: 'js-toggleCart', toggleItem: 'js-toggleCart-item', toggleHook: 'js-toggleCart-hook', toggleContent: 'js-toggleCart-content', toggleState: 'js-toggleCart-state', totalizer: 'totalizer', totalizerTxt: 'totalizer-text', class: { isHide: 'is-hide' } }; var elm = {}; if (self.getElem.toggleCart === null) { return; } elm.$root = $('.' + className.toggle); elm.$toggleItem = elm.$root.find('.' + className.toggleItem); elm.$toggleHook = elm.$root.find('.' + className.toggleHook); elm.$toggleContent = elm.$root.find('.' + className.toggleContent); elm.$totalizer = elm.$root.find('.' + className.totalizer); fn.init = function () { fn.setMql(); }; fn.setMql = function () { function checkBp(mq) { if (mq.matches) { fn.set(); fn.openContent(); } else { fn.unSet(); } } smallScreenMql.addListener(checkBp); checkBp(smallScreenMql); }; fn.set = function () { var i; var $totalizerTxt; var text = ''; $totalizerTxt = elm.$totalizer.find('.' + className.totalizerTxt); elm.$toggleItem.prepend(''); } }; Modal.stopBubbling = function ($target) { if ($target && $target.length) { $target.off('click').on('click', function (event) { event.stopPropagation(); }); } }; Modal.clickCloseButton = function () { $('#idNames.btnClose').off('click').on('click', function () { $.colorbox.close(); }); }; Modal.appendLowerMargin = function () { var $lowerMargin = $('#' + idNames.lowerMargin); if (!elements || !elements.$wrapper.length || $lowerMargin.length) { return; } elements.$wrapper.append( '
' ); $lowerMargin = $('#' + idNames.lowerMargin); $lowerMargin.on('click', function () { $.colorbox.close(); }); }; return Modal; }()); win.MultiStepForm = Form; }()); KEYENCE.setCurrentPageNavi = function () { var fn = {}; fn.init = function () { var self = this; var categoryValue = null; var items = self.getItems(); if (!items.pageCategory || !items.navigationLinks.length) { return; } categoryValue = self.getCategoryValue(items.pageCategory); self.addCurrentAttribute(categoryValue); }; fn.getItems = function () { var items = { pageCategory: doc.querySelector('[data-page-category]'), navigationLinks: doc.querySelectorAll('[data-navigation-link]') }; return items; }; fn.getCategoryValue = function (item) { var categoryValue = null; if (!item || item.nodeType !== 1) { return false; } categoryValue = item.dataset.pageCategory; return categoryValue; }; fn.addCurrentAttribute = function (categoryValue) { var self = this; var linkValue = null; var items = self.getItems(); if (!categoryValue || typeof categoryValue !== 'string') { return; } Array.prototype.forEach.call(items.navigationLinks, function (link) { linkValue = self.getLinkValue(link); if (!linkValue || typeof linkValue !== 'string') { return; } if (categoryValue === linkValue) { link.setAttribute('aria-current', 'page'); } }); }; fn.getLinkValue = function (item) { var linkValue = null; if (!item || item.nodeType !== 1) { return false; } linkValue = item.dataset.navigationLink; return linkValue; }; fn.init(); }; KEYENCE.setMenuConversion = function () { var self = this; var root = null; var settingObj = win.kg_cp; var links = null; var removeButton = null; var openButton = null; var closeButton = null; var list = null; var app = null; var appOpenButton = null; var appCloseButton = null; var appButton = null; var appLinkOuter = null; var header = null; var seriesHeader = null; var resizeTimer = null; var closeTimer = null; var delayVal = 200; var fn = {}; var handlers = {}; var dataLayer = win.dataLayer ? win.dataLayer : []; var config = { originalDomain: win.kpi_originalDomain ? win.kpi_originalDomain : '' }; var apiPath = { sunCode: `${config.originalDomain}/ajax/userAjax/sunCodeImage/` }; var classNames = { body: 'js-menuConversion-body', list: 'js-menuConversion-list', link: 'js-menuConversion-link', linkText: 'js-menuConversion-linkText', removeButton: 'js-menuConversion-removeButton', openButton: 'js-menuConversion-openButton', closeButton: 'js-menuConversion-closeButton', app: 'js-menuConversion-app', appOpenButton: 'js-menuConversion-appOpenButton', appCloseButton: 'js-menuConversion-appCloseButton', appImage: 'js-menuConversion-appImage', appButton: 'js-menuConversion-appButton', appLinkOuter: 'js-menuConversion-appLinkOuter', appLink: 'js-menuConversion-appLink', sunCode: 'js-menuConversion-sunCode', isShow: self.CONFIG.SHOW_CLASS, isHide: self.CONFIG.HIDE_CLASS, isVisible: 'is-visible', isHidden: 'is-hidden', isClose: 'is-close' }; var idNames = { template: 'js-menuConversion-template', appTemplate: 'js-menuConversion-appTemplate', appButtonTemplate: 'js-menuConversion-appButtonTemplate', appLinkTemplate: 'js-menuConversion-appLinkTemplate', header: 'js-controlHeader' }; var cookies = { closed: 'kpi_has_menuConversionClosed', appClosed: 'kpi_has_menuConversionAppClosed' }; if (!self.getElem.menuConversion || !settingObj || !win.kpi_menu_conversion) { return; } root = self.getElem.menuConversion; fn.init = function () { if (!fn.isShow()) { return; } fn.setHtml(); fn.getSelector(); fn.setApp(); fn.ctrlTelLink(); fn.onClickForRemoveButton(); fn.runForEachScreen(); smallScreenMql.addListener(fn.runForEachScreen); }; fn.runForEachScreen = function () { if (smallScreenMql.matches) { fn.onClickForOpenButton(); fn.onClickForCloseButton(); } else { if (list) { list.removeEventListener('transitionend', handlers.onTransitionendList, false); } fn.openMenu(); fn.onMouseenterForLink(); fn.onFocusinForLink(); fn.onFocusoutForLink(); fn.onMouseleaveForLink(); } fn.setTopPosition(); fn.onResizeWindow(); fn.onScrollWindow(); }; fn.isShow = function () { if (!win.kpi_menu_conversion.isShow || fn.isExcludedUrl() || fn.hasCookie(cookies.closed)) { return false; } return true; }; fn.isTelShow = function () { if (!win.kpi_menu_conversion.isTelShow) { return false; } return true; }; fn.openMenu = function () { var delay; if (!win.kpi_menu_conversion.openDelay || !list) { return; } delay = Number(win.kpi_menu_conversion.openDelay) >= 0 ? Number(win.kpi_menu_conversion.openDelay) : 3000; list.classList.add(classNames.isShow); if (closeTimer !== null) { clearTimeout(closeTimer); } closeTimer = setTimeout(function () { list.classList.remove(classNames.isShow); }, delay); } fn.setHtml = function () { var template = doc.getElementById(idNames.template); var clone; if (template) { clone = fn.createNodeClone(template); fn.setUrl(clone); fn.setAppHtml(clone); root.appendChild(clone); } }; fn.setAppHtml = function (clone) { var menuConversionGroup = self.getElem.menuConversionGroup; var appTemplate = doc.getElementById(idNames.appTemplate); var appButtonTemplate = doc.getElementById(idNames.appButtonTemplate); var appLinkTemplate = doc.getElementById(idNames.appLinkTemplate); var openButton = clone.querySelector(`.${classNames.openButton}`); var list = clone.querySelector(`.${classNames.list}`); var appClone; var appButtonClone; var appLinkClone; if (menuConversionGroup && appTemplate) { appClone = fn.createNodeClone(appTemplate); menuConversionGroup.appendChild(appClone); } if (openButton && appButtonTemplate) { appButtonClone = fn.createNodeClone(appButtonTemplate); openButton.parentNode.insertBefore(appButtonClone, openButton.nextElementSibling); } if (list && appLinkTemplate) { appLinkClone = fn.createNodeClone(appLinkTemplate); list.parentNode.insertBefore(appLinkClone, list.nextElementSibling); } }; fn.setApp = function () { var sunCode = doc.querySelector('.' + classNames.sunCode); if (!app) { return; } fn.onClickForAppOpenButton(); fn.onClickForAppCloseButton(); if (util.getCookie(cookies.appClosed) === 'true') { fn.closedApp(); } else { fn.openedApp(); } if (sunCode) { fn.setSunCode(); } }; fn.setSunCode = function () { var signinStat = dataLayer[1].signinStat ? dataLayer[1].signinStat : ''; var savedSunCodeImage = null; var expireDate = null; if (signinStat !== 'signin') { return; } savedSunCodeImage = localStorage.getItem("sunCodeImage") ? JSON.parse(localStorage.getItem("sunCodeImage")) : null; expireDate = savedSunCodeImage && savedSunCodeImage.expireDate ? savedSunCodeImage.expireDate : null; if (savedSunCodeImage && (expireDate && fn.isWithinDeadline(expireDate))) { fn.setSunCodePath(savedSunCodeImage); } else { fn.loadSunCodeApi(); } }; fn.setSunCodePath = function (sunCodeImageData) { var sunCodeImage = sunCodeImageData.sunCodeImage ? sunCodeImageData.sunCodeImage : null; var wechatLoginUrl = sunCodeImageData.wechatLoginUrl ? sunCodeImageData.wechatLoginUrl : null; var appImage = doc.querySelector('.' + classNames.appImage); var appButton = doc.querySelector('.' + classNames.appButton); var appLink = doc.querySelector('.' + classNames.appLink); if (sunCodeImage && appImage) { appImage.src = `data:image/png;base64, ${sunCodeImage}`; } if (wechatLoginUrl) { if (appButton) { appButton.href = wechatLoginUrl; } if (appLink) { appLink.href = wechatLoginUrl; } } }; fn.loadSunCodeApi = function () { fetch(apiPath.sunCode, { method: 'GET' }).then((response) => { if (response.ok) { return response.json(); } throw new Error('Network response was not OK'); }).then((result) => { localStorage.setItem("sunCodeImage", JSON.stringify(result)); fn.setSunCodePath(result); }).catch((error) => { console.error(error); }); }; fn.isWithinDeadline = function (expireDate) { var date = new Date(); var year = date.getFullYear(); var month = (date.getMonth() + 1).toString().padStart(2, 0); var day = date.getDate().toString().padStart(2, 0); var isWithinDeadline = false; if (Number(expireDate) > Number(`${year}${month}${day}`)) { isWithinDeadline = true; } return isWithinDeadline; }; fn.setUrl = function (clone) { var links; var linkText; var urlObj = settingObj.url ? settingObj.url: settingObj; var phoneKeys = []; const fragment = doc.createDocumentFragment(); links = clone ? clone.querySelectorAll('.' + classNames.link) : null; if (!urlObj || !links) { return; } phoneKeys = Object.keys(urlObj).filter(x => x.match(/^phone(\d)*$/g)); Array.prototype.forEach.call(links, function (link) { var data = link.dataset.menuConversionUrl; if (data === 'phone' && !fn.isTelShow()) { link.parentNode.remove(); } else { if (data && urlObj[data] && urlObj[data] !== "") { if (data === 'phone') { linkText = link.querySelector('.' + classNames.linkText); if (link.hasAttribute('href')) { link.href = 'tel:' + urlObj[data]; } if (phoneKeys.length) { phoneKeys.forEach((key) => { if (urlObj[key] && urlObj[key] !== "") { var body = doc.createElement('span'); body.classList.add('prd-menuConversion-linkTextBody'); body.innerText = urlObj[key]; fragment.appendChild(body); } }); } if (linkText) { linkText.appendChild(fragment); } } else { link.href = urlObj[data]; } } else if (!urlObj[data] || urlObj[data] === "") { link.parentNode.remove(); } } }); }; fn.getSelector = function () { links = root.querySelectorAll('.' + classNames.link); removeButton = root.querySelector('.' + classNames.removeButton); openButton = root.querySelector('.' + classNames.openButton); closeButton = root.querySelector('.' + classNames.closeButton); list = root.querySelector('.' + classNames.list); app = doc.querySelector('.' + classNames.app); appOpenButton = doc.querySelector('.' + classNames.appOpenButton); appCloseButton = doc.querySelector('.' + classNames.appCloseButton); appButton = root.querySelector('.' + classNames.appButton); appLinkOuter = root.querySelector('.' + classNames.appLinkOuter); header = doc.getElementById(idNames.header); seriesHeader = doc.querySelector('[data-series-header-target="sticky"]'); }; fn.setTopPosition = function () { var rootTop; var headerBottom; var seriesHeaderBottom; var topVal; var transformVal; var buffer = 5; root.style.top = '50%'; root.style.transform = 'translateY(-50%)'; rootTop = root.getBoundingClientRect().top; if (seriesHeader) { seriesHeaderBottom = seriesHeader.getBoundingClientRect().bottom; topVal = seriesHeaderBottom > rootTop ? (seriesHeaderBottom + buffer) + 'px' : '50%'; transformVal = seriesHeaderBottom > rootTop ? 'inherit' : 'translateY(-50%)'; } else if (header) { headerBottom = header.getBoundingClientRect().bottom; topVal = headerBottom > rootTop ? (headerBottom + buffer) + 'px' : '50%'; transformVal = headerBottom > rootTop ? 'inherit' : 'translateY(-50%)'; } else { topVal = '50%'; transformVal = 'translateY(-50%)'; } root.style.top = topVal; root.style.transform = transformVal; }; fn.openedApp = function () { if (app) { app.classList.add(classNames.isShow); } if (appOpenButton) { appOpenButton.classList.remove(classNames.isShow); } }; fn.closedApp = function () { if (app) { app.classList.remove(classNames.isShow); } if (appOpenButton) { appOpenButton.classList.add(classNames.isShow); } }; fn.onMouseenterForLink = function () { if (!links.length) { return; } links.forEach(function(link) { link.addEventListener('mouseenter', handlers.onMouseenterForLink, false); }); }; fn.onFocusinForLink = function () { if (!links.length) { return; } links.forEach(function(link) { link.addEventListener('focusin', handlers.onFocusinForLink, false); }); }; fn.onMouseleaveForLink = function () { if (!links.length) { return; } links.forEach(function(link) { link.addEventListener('mouseleave', handlers.onMouseleaveForLink, false); }); }; fn.onFocusoutForLink = function () { if (!links.length) { return; } links.forEach(function(link) { link.addEventListener('focusout', handlers.onFocusoutForLink, false); }); }; fn.onClickForRemoveButton = function () { if (!removeButton) { return; } removeButton.addEventListener('click', handlers.onClickForRemoveButton, false); }; fn.onClickForOpenButton = function () { if (!openButton) { return; } openButton.addEventListener('click', handlers.onClickForOpenButton, false); }; fn.onClickForCloseButton = function () { if (!closeButton) { return; } closeButton.addEventListener('click', handlers.onClickForCloseButton, false); }; fn.onClickForAppOpenButton = function () { if (!appOpenButton) { return; } appOpenButton.addEventListener('click', handlers.onClickForAppOpenButton, false); }; fn.onClickForAppCloseButton = function () { if (!appCloseButton) { return; } appCloseButton.addEventListener('click', handlers.onClickForAppCloseButton, false); }; fn.onResizeWindow = function () { win.addEventListener('resize', handlers.onResizeWindow); }; fn.onScrollWindow = function () { win.addEventListener('scroll', handlers.onScrollWindow); }; fn.isExcludedUrl = function () { var currentURL = win.location.pathname; var pattern = win.kpi_menu_conversion.excludedUrl; if (pattern.test(currentURL)) { return true; } return false; }; fn.setCookie = function (name, value) { var path; if (win.suz_LanguagePath) { path = win.suz_LanguagePath + '/'; } else { path = '/'; } doc.cookie = name + '=' + value + '; path=' + path; }; fn.hasCookie = function (name) { var cookieArray = doc.cookie.split(';'); var flag = false; Array.prototype.forEach.call(cookieArray, function (item) { if (item.indexOf(name + '=') > -1) { flag = true; } }); return flag; }; fn.ctrlTelLink = function () { var telLink = list.querySelectorAll('a[href^="tel:"]'); var hasTouchScreen = false; var mQ = null; var ua = win.navigator.userAgent; var cancelLink = null; if (!telLink.length) { return; } cancelLink = function (e) { e.preventDefault(); }; if ('maxTouchPoints' in navigator) { hasTouchScreen = win.navigator.maxTouchPoints > 0; if (ua.indexOf('Edge') !== -1) { if (ua.indexOf('Windows Phone') === -1 && ua.indexOf('IEMobile') === -1) { hasTouchScreen = false; } } } else if ('msMaxTouchPoints' in navigator) { hasTouchScreen = win.navigator.msMaxTouchPoints > 0; } else { mQ = win.matchMedia && matchMedia('(pointer:coarse)'); if (mQ && mQ.media === '(pointer:coarse)') { hasTouchScreen = Boolean(mQ.matches); } else if ('orientation' in win) { hasTouchScreen = true; } else { hasTouchScreen = ( /\b(BlackBerry|webOS|iPhone|IEMobile)\b/i.test(ua) || /\b(Android|Windows Phone|iPad|iPod)\b/i.test(ua) ); } } if (!hasTouchScreen) { telLink.forEach(function (item) { item.addEventListener('click', cancelLink, false); }); } }; fn.createNodeClone = function (template) { return doc.importNode(template.content, true); }; handlers.onMouseenterForLink = function () { if (!list) { return; } if (closeTimer !== null) { clearTimeout(closeTimer); } list.classList.add(classNames.isShow); }; handlers.onFocusinForLink = function () { if (!list) { return; } if (closeTimer !== null) { clearTimeout(closeTimer); } list.classList.add(classNames.isShow); }; handlers.onMouseleaveForLink = function () { if (!list) { return; } list.classList.remove(classNames.isShow); }; handlers.onFocusoutForLink = function () { if (!list) { return; } list.classList.remove(classNames.isShow); }; handlers.onClickForRemoveButton = function () { root.addEventListener('transitionend', handlers.onTransitionendRoot, false); root.classList.add(classNames.isClose); fn.setCookie(cookies.closed, '1'); }; handlers.onTransitionendList = function () { if (!list || !links.length) { return; } if (list.classList.contains(classNames.isVisible)) { list.focus(); } }; handlers.onTransitionendRoot = function () { root.remove(); }; handlers.onClickForOpenButton = function () { if (list) { list.classList.add(classNames.isVisible); list.tabIndex = 0; list.addEventListener('transitionend', handlers.onTransitionendList, false); } if (openButton) { openButton.classList.add(classNames.isHidden); } if (removeButton) { removeButton.classList.add(classNames.isHide); } if (closeButton) { closeButton.classList.add(classNames.isShow); } if (appButton) { appButton.classList.add(classNames.isHidden); } if (appLinkOuter) { appLinkOuter.classList.add(classNames.isVisible); } }; handlers.onClickForCloseButton = function () { if (list) { list.classList.remove(classNames.isVisible); list.removeEventListener('transitionend', handlers.onTransitionendList, false); } if (openButton) { openButton.classList.remove(classNames.isHidden); } if (removeButton) { removeButton.classList.remove(classNames.isHide); } if (closeButton) { closeButton.classList.remove(classNames.isShow); } if (appButton) { appButton.classList.remove(classNames.isHidden); } if (appLinkOuter) { appLinkOuter.classList.remove(classNames.isVisible); } }; handlers.onClickForAppOpenButton = function () { fn.openedApp(); fn.setCookie(cookies.appClosed, 'false'); }; handlers.onClickForAppCloseButton = function () { if (app) { app.classList.remove(classNames.isShow); } if (appOpenButton) { appOpenButton.classList.add(classNames.isShow); } fn.setCookie(cookies.appClosed, 'true'); }; handlers.onResizeWindow = function () { if (resizeTimer !== null) { clearTimeout(resizeTimer); } resizeTimer = setTimeout(function () { fn.setTopPosition(); }, delayVal); }; handlers.onScrollWindow = function () { fn.setTopPosition(); }; fn.init(); }; KEYENCE.Form = {}; KEYENCE.Form.TogglePassword = (function () { var classNames = { trigger: 'js-togglePassword', text: 'js-togglePassword-text' }; var TogglePassword = {}; TogglePassword = { classNames: classNames }; TogglePassword.init = function () { var $button = $('.' + classNames.trigger); if ($button.length) { $(doc).on('click', '.' + classNames.trigger, this.onClickButton); } }; TogglePassword.onClickButton = function () { var targetId = this.dataset.togglePasswordTarget; var textShow = this.dataset.togglePasswordTextShow; var textHide = this.dataset.togglePasswordTextHide; var pwdField; var textElement; if (typeof targetId !== 'string' || typeof textShow !== 'string' || typeof textHide !== 'string') { return; } pwdField = doc.getElementById(targetId); textElement = this.querySelector('.' + classNames.text); if (!pwdField || !textElement) { return; } if (pwdField.type === 'password') { pwdField.type = 'text'; textElement.textContent = textHide; } else { pwdField.type = 'password'; textElement.textContent = textShow; } }; return TogglePassword; }()); KEYENCE.Form.SelectCountryNumber = (function () { var classNames = { trigger: 'js-selectCountryNumber', target: 'js-selectCountryNumber-target', }; var SelectCountryNumber = { classNames: classNames, triggers: null }; SelectCountryNumber.init = function () { var html = doc.querySelector('html'); this.triggers = doc.querySelectorAll('.' + classNames.trigger); if (!this.triggers.length || html.classList.contains('gtie9')) { return; } this.attachClickSelectEvent(); }; SelectCountryNumber.changeOverrideText = function (trigger) { var select = trigger.querySelector('.' + classNames.target); var selectedOption; if (!select) { return; } selectedOption = select.options[select.selectedIndex]; if (selectedOption && typeof selectedOption.textContent === 'string') { trigger.dataset.content = selectedOption.textContent; } }; SelectCountryNumber.attachClickSelectEvent = function () { var self = this; Array.prototype.forEach.call(this.triggers, function (trigger) { self.changeOverrideText(trigger); trigger.addEventListener('change', function () { self.changeOverrideText(trigger); }); }); }; return SelectCountryNumber; }()); KEYENCE.Form.FormFilter = (function () { var FormFilter = {}; FormFilter.init = function () { FormFilter.General.init(); FormFilter.SignIn.init(); FormFilter.SendEmail.init(); }; FormFilter.General = (function () { var idNames = { mobileNumberTrigger: 'js-formFilterGeneral-mobileNumber', emailTtrigger: 'js-formFilterGeneral-email' }; var classNames = { root: 'js-formFilterGeneral', trigger: 'js-formFilterGeneral-trigger', isFilterMobilenumber: 'is-filter-mobileNumber', isFilterEmail: 'is-filter-email', itemMobileNumber: 'js-formFilterGeneralItem-mobileNumber', itemEmail: 'js-formFilterGeneralItem-email', itemFilterEmal: 'js-formFilter-registEmail', runFilterEmail: 'js-runFilter-email', runFilterMobileNumber: 'js-runFilter-mobileNumber', }; var urls = { updateFormElement: '/ajax/registrationAjax/getFormListForMobileNumber/', }; var General = { idNames: idNames, classNames: classNames, rootElement: null, triggerElements: null, disabledIds: [], urls: urls, }; var generalMessageEvent = { handleEvent: null, target: null, }; General.FORM_TYPE = { EMAIL: 'email', MOBILE_NUMBER: 'mobileNumber', DEFAULT: 'default', }; General.init = function () { this.rootElement = doc.querySelector('.' + classNames.root); this.triggerElements = doc.querySelectorAll('.' + classNames.trigger); if (!this.rootElement || !this.triggerElements.length) { return; } this.getDisalbedIds(); if (this.getFormType() === this.FORM_TYPE.MOBILE_NUMBER) { FormFilter.General.disableFields('email'); } else { FormFilter.General.disableFields('mobileNumber'); } this.attachClickFilterEvent(); this.attachClickShowEmailFormButton(); this.onMessageAction(); }; General.getFormType = function () { var formType = this.FORM_TYPE.DEFAULT; if (!this.rootElement) { return this.FORM_TYPE.DEFAULT; } if (this.rootElement.classList.contains(classNames.isFilterEmail)) { formType = this.FORM_TYPE.EMAIL; } else if (this.rootElement.classList.contains(classNames.isFilterMobilenumber)) { formType = this.FORM_TYPE.MOBILE_NUMBER; } return formType; }; General.attachClickFilterEvent = function () { var self = this; Array.prototype.forEach.call(this.triggerElements, function (trigger) { trigger.addEventListener('click', self.onClickFilter.bind(this)); }); }; General.getDisalbedIds = function () { var items = document.querySelectorAll('.' + classNames.itemMobileNumber + ', .' + classNames.itemEmail); Array.prototype.forEach.call(items, function (item) { var disabledFormElements = item.querySelectorAll('input:disabled, select:disabled, textarea:disabled'); Array.prototype.forEach.call(disabledFormElements, function (disabledFormElement) { General.disabledIds.push(disabledFormElement.id); }); }); }; General.getFilterFields = function (type) { var fields; switch (type) { case 'mobileNumber': fields = document.querySelectorAll('.' + classNames.itemMobileNumber); break; case 'email': default: fields = document.querySelectorAll('.' + classNames.itemEmail); break; } return fields; }; General.disableFields = function (type) { var fields = this.getFilterFields(type); if (!fields.length) { return; } Array.prototype.forEach.call(fields, function (item) { var formElements = item.querySelectorAll('input, select, textarea'); Array.prototype.forEach.call(formElements, function (formElement) { formElement.disabled = true; }); }); }; General.enableFields = function (type, isAll) { var items = this.getFilterFields(type); Array.prototype.forEach.call(items, function (item) { var formElements = item.querySelectorAll('input, select, textarea'); Array.prototype.forEach.call(formElements, function (formElement) { if (isAll) { formElement.disabled = false; } else if (General.disabledIds.indexOf(formElement.id) === -1) { formElement.disabled = false; } }); }); }; General.onClickFilter = function (event) { var currentTarget = event.currentTarget; var $regArea = null; generalMessageEvent.target = currentTarget; Array.prototype.forEach.call(General.triggerElements, function (trigger) { trigger.removeAttribute('aria-current'); }); currentTarget.setAttribute('aria-current', 'page'); $('.' + KEYENCE.Form.InputInterlock.classNames.trigger + ':visible').each(function () { var targetIdList = KEYENCE.Form.InputInterlock.getTargetIdListFromTrigger(this); this.value = ''; targetIdList.forEach(function (id) { var target = doc.getElementById(id); if (target && target.tagName.toLowerCase() === 'input') { target.value = ''; } KEYENCE.Form.InputInterlock.changeRelatedInputStatus(target, 'enable'); }); }); if (!win.AnalyticsViews || !win.MultiStepForm.PreForm.checkMessageTargetForm()) { $regArea = $('#suz_regArea'); if (currentTarget.id === idNames.mobileNumberTrigger) { General.rootElement.classList.remove(classNames.isFilterEmail); General.rootElement.classList.add(classNames.isFilterMobilenumber); if ($regArea.length) { General.updateFormElement(true).done(function (data) { $regArea.html(data); General.enableFields('mobileNumber'); General.disableFields('email'); }).fail(function () { General.enableFields('mobileNumber'); General.disableFields('email'); }); } else { General.enableFields('mobileNumber'); General.disableFields('email'); } } else { General.rootElement.classList.remove(classNames.isFilterMobilenumber); General.rootElement.classList.add(classNames.isFilterEmail); if ($regArea.length) { General.updateFormElement(false).done(function (data) { $regArea.html(data); General.enableFields('email'); General.disableFields('mobileNumber'); }).fail(function () { General.enableFields('email'); General.disableFields('mobileNumber'); }); } else { General.enableFields('email'); General.disableFields('mobileNumber'); } } } }; General.attachClickShowEmailFormButton = function () { var filterEmailButton = doc.querySelector('#' + idNames.emailTtrigger); $(doc).on('click', '.' + classNames.runFilterEmail, function () { if (filterEmailButton) { filterEmailButton.click(); } }); }; General.onMessageAction = function () { generalMessageEvent.handleEvent = General.changeGeneralFilterClass; win.addEventListener('message', generalMessageEvent, false); }; General.changeGeneralFilterClass = function (e) { var $regArea = $('#suz_regArea'); if (e.data === AnalyticsViews.Utility.messageNames.generalForm) { if (this.target.id === idNames.mobileNumberTrigger) { General.rootElement.classList.remove(classNames.isFilterEmail); General.rootElement.classList.add(classNames.isFilterMobilenumber); if ($regArea.length) { General.updateFormElement(true).done(function (data) { $regArea.html(data); General.enableFields('mobileNumber'); General.disableFields('email'); }).fail(function () { General.enableFields('mobileNumber'); General.disableFields('email'); }); } else { General.enableFields('mobileNumber'); General.disableFields('email'); } } else { General.rootElement.classList.remove(classNames.isFilterMobilenumber); General.rootElement.classList.add(classNames.isFilterEmail); if ($regArea.length) { General.updateFormElement(false).done(function (data) { $regArea.html(data); General.enableFields('email'); General.disableFields('mobileNumber'); }).fail(function () { General.enableFields('email'); General.disableFields('mobileNumber'); }); } else { General.enableFields('email'); General.disableFields('mobileNumber'); } } } }; General.checkRootElement = function () { if (!this.rootElement) { return false; } return true; }; General.updateFormElement = function (isFilterMobileNumber) { var deferred = new $.Deferred(); var options; var url; url = win.suz_getCurrentDomain() + this.urls.updateFormElement; options = { url: url, type: 'POST', data: { mobileNumberTabFlag: isFilterMobileNumber }, dataType: 'html', scriptCharset: 'UTF-8', }; $.ajax(options).done(function (data) { deferred.resolve(data); }).fail(function (jqXHR, textStatus, errorThrown) { deferred.reject(jqXHR, textStatus, errorThrown); }); return deferred.promise(); }; return General; }()); FormFilter.SignIn = (function () { var idNames = { passwordTrigger: 'js-formFilterLogin-password', smscode: 'js-formFilterLogin-smscode', loginCountryNumber: 'loginCountryNumber', }; var classNames = { root: 'js-formFilterLogin', trigger: 'js-formFilterLogin-trigger', isFilterPassword: 'is-filter-password', isFilterSmscode: 'is-filter-smscode', isFilterPasswordItem: 'js-formFilter-loginPassword', isFilterSMSCodeItem: 'js-formFilter-loginSMSCode', isFilterEmailItem: 'js-formFilter-loginEmail', itemPassword: 'js-formFilterLoginItem-password', itemSMSCode: 'js-formFilterLoginItem-smscode', isFilterAutoSignUp: 'is-filter-autoSignUp', itemAutoSignUp: 'js-formFilterLoginItem-autoSignUp', }; var SignIn = { idNames: idNames, classNames: classNames, rootElement: null, triggerElements: null, disabledIds: [], $passwordTrigger: $('#' + idNames.passwordTrigger), $loginCountryNumber: $('#' + idNames.loginCountryNumber), }; var asuMessageEvent = { handleEvent: null, }; SignIn.FORM_TYPE = { EMAIL: 'email', PASSWORD: 'password', SMS_CODE: 'smscode', DEFAULT: 'default', ASU: 'asu', }; SignIn.init = function () { this.rootElement = doc.querySelector('.' + classNames.root); this.triggerElements = doc.querySelectorAll('.' + classNames.trigger); if (!this.rootElement || !this.triggerElements.length) { return; } this.getDisalbedIds(); if (this.getFormType() === this.FORM_TYPE.PASSWORD) { FormFilter.SignIn.disableFields('smscode'); FormFilter.SignIn.disableFields('asu'); FormFilter.SignIn.enableFields('password', true); } else if (this.getFormType() === this.FORM_TYPE.SMS_CODE) { FormFilter.SignIn.disableFields('password'); FormFilter.SignIn.disableFields('asu'); FormFilter.SignIn.enableFields('smscode', true); } else if (this.getFormType() === this.FORM_TYPE.ASU) { FormFilter.SignIn.disableFields('password'); FormFilter.SignIn.disableFields('smscode'); FormFilter.SignIn.enableFields('asu', true); } FormFilter.SignIn.$loginCountryNumber.prop('disabled', true); win.MultiStepForm.SignIn.$loginMobileNumber.prop('disabled', true); this.attachClickFilterEvent(); // this.onMessageAction(); }; SignIn.attachClickFilterEvent = function () { var self = this; Array.prototype.forEach.call(this.triggerElements, function (trigger) { trigger.addEventListener('click', self.onClickFilter.bind(this)); }); }; SignIn.onClickFilter = function (event) { Array.prototype.forEach.call(SignIn.triggerElements, function (trigger) { trigger.removeAttribute('aria-current'); }); event.currentTarget.setAttribute('aria-current', 'page'); if (event.currentTarget.id === idNames.smscode) { SignIn.rootElement.classList.remove(classNames.isFilterPassword); SignIn.rootElement.classList.remove(classNames.isFilterAutoSignUp); SignIn.rootElement.classList.add(classNames.isFilterSmscode); $('#' + win.MultiStepForm.SignIn.idNames.loginPassword).prop('disabled', true); $('#' + win.MultiStepForm.SignIn.idNames.loginVerificationCode).prop('disabled', false); $('#' + win.MultiStepForm.SignIn.idNames.registerLoginPassword).prop('disabled', true); } else { SignIn.rootElement.classList.remove(classNames.isFilterSmscode); SignIn.rootElement.classList.remove(classNames.isFilterAutoSignUp); SignIn.rootElement.classList.add(classNames.isFilterPassword); $('#' + win.MultiStepForm.SignIn.idNames.loginPassword).prop('disabled', false); $('#' + win.MultiStepForm.SignIn.idNames.loginVerificationCode).prop('disabled', true); $('#' + win.MultiStepForm.SignIn.idNames.registerLoginPassword).prop('disabled', true); } }; SignIn.onMessageAction = function () { asuMessageEvent.handleEvent = SignIn.runValidation; win.addEventListener('message', asuMessageEvent, false); }; SignIn.changeAutoSignUp = function (isAutoSignup, formType) { if (!isAutoSignup) { return; } SignIn.rootElement.classList.add(classNames.isFilterAutoSignUp); SignIn.rootElement.classList.remove(classNames.isFilterPassword); SignIn.rootElement.classList.remove(classNames.isFilterSmscode); $('#' + win.MultiStepForm.SignIn.idNames.loginPassword).prop('disabled', true); if (formType === FormFilter.General.FORM_TYPE.MOBILE_NUMBER) { $('#' + win.MultiStepForm.SignIn.idNames.loginVerificationCode).prop('disabled', false); $('#' + win.MultiStepForm.SignIn.idNames.registerLoginPassword).prop('disabled', false); } }; SignIn.clickLoginPasswordTrigger = function () { if (SignIn.rootElement.classList.contains(classNames.isFilterAutoSignUp) && this.$passwordTrigger.length) { this.$passwordTrigger.click(); } }; SignIn.getFormType = function () { var formType = this.FORM_TYPE.DEFAULT; if (!this.rootElement) { return this.FORM_TYPE.DEFAULT; } if (this.rootElement.classList.contains(classNames.isFilterPassword)) { formType = this.FORM_TYPE.PASSWORD; } else if (this.rootElement.classList.contains(classNames.isFilterSmscode)) { formType = this.FORM_TYPE.SMS_CODE; } else if (this.rootElement.classList.contains(classNames.isFilterAutoSignUp)) { formType = this.FORM_TYPE.ASU; } return formType; }; SignIn.getDisalbedIds = function () { var items = document.querySelectorAll('.' + classNames.itemPassword + ', .' + classNames.itemSMSCode); Array.prototype.forEach.call(items, function (item) { var disabledFormElements = item.querySelectorAll('input:disabled, select:disabled, textarea:disabled'); Array.prototype.forEach.call(disabledFormElements, function (disabledFormElement) { SignIn.disabledIds.push(disabledFormElement.id); }); }); }; SignIn.getFilterFields = function (type) { var fields = []; switch (type) { case 'password': fields = document.querySelectorAll('.' + classNames.itemPassword); break; case 'smscode': fields = document.querySelectorAll('.' + classNames.itemSMSCode); break; case 'asu': fields = document.querySelectorAll('.' + classNames.itemAutoSignUp); break; default: break; } return fields; }; SignIn.disableFields = function (type) { var fields = this.getFilterFields(type); if (!fields.length) { return; } Array.prototype.forEach.call(fields, function (item) { var formElements = item.querySelectorAll('input, select, textarea'); Array.prototype.forEach.call(formElements, function (formElement) { formElement.disabled = true; }); }); }; SignIn.enableFields = function (type, isAll) { var fields = this.getFilterFields(type); Array.prototype.forEach.call(fields, function (field) { var formElements = field.querySelectorAll('input, select, textarea'); Array.prototype.forEach.call(formElements, function (formElement) { if (isAll) { formElement.disabled = false; } else if (SignIn.disabledIds.indexOf(formElement.id) === -1) { formElement.disabled = false; } }); }); }; SignIn.runValidation = function (e) { var BlankFieldValidator = win.KeyenceForm.BlankFieldValidator; var preForm = win.MultiStepForm.PreForm; var formInfo = preForm.getFormInfo(); var formType = KEYENCE.Form.FormFilter.General.getFormType(); var targetInput = doc.querySelector('input[name="' + formInfo.name + '"]'); if (e.data === AnalyticsViews.Utility.messageNames.nextForm) { if (targetInput) { if (targetInput.classList.contains('js-check-blank') && BlankFieldValidator.isBlank(targetInput)) { return; } } if (formType === KEYENCE.Form.FormFilter.General.FORM_TYPE.MOBILE_NUMBER) { if (preForm.$formCheckMobileNumber.hasClass('js-checkMobileNumberFormat')) { KeyenceForm.MobileNumberValidator.checkFormat(formInfo.countryCode, formInfo.mobileNumber ).done(function (status) { if (!status.message) { win.MultiStepForm.getMobileNumberStatus(formInfo.countryCode, formInfo.mobileNumber).done(function (status) { if (!status.message) { SignIn.changeAsuFilterClass(status.isRegistered, formInfo, preForm.isAutoSignupUser(status)); } }); } }); } else { win.MultiStepForm.getMobileNumberStatus(formInfo.countryCode, formInfo.mobileNumber).done(function (status) { if (!status.message) { SignIn.changeAsuFilterClass(status.isRegistered, formInfo, PreForm.isAutoSignupUser(status)); } }); } } } }; SignIn.changeAsuFilterClass = function (isRegistered, formInfo, isAutoSignup) { if (typeof isRegistered !== 'boolean' || !formInfo) { return; } if (isAutoSignup) { SignIn.rootElement.classList.add(classNames.isFilterAutoSignUp); SignIn.rootElement.classList.remove(classNames.isFilterPassword); SignIn.rootElement.classList.remove(classNames.isFilterSmscode); $('#' + win.MultiStepForm.SignIn.idNames.loginPassword).prop('disabled', true); $('#' + win.MultiStepForm.SignIn.idNames.loginVerificationCode).prop('disabled', false); $('#' + win.MultiStepForm.SignIn.idNames.registerLoginPassword).prop('disabled', false); } }; return SignIn; }()); FormFilter.SendEmail = (function () { var classNames = { root: 'js-formFilterSendEmail', isFilterSignin: 'is-filter-signin', isFilterAutoSignup: 'is-filter-autoSignUp', }; var SendEmail = { classNames: classNames, rootElement: null, }; SendEmail.FORM_TYPE = { SIGNIN: 'signin', ASU: 'autoSignup', }; SendEmail.init = function () { this.root = doc.querySelector(this.classNames.root); } SendEmail.changeFilterClass = function (triggerId) { var multiStepForm = win.MultiStepForm; if (typeof triggerId !== 'string' || !triggerId) { return; } if (triggerId === multiStepForm.SignIn.idNames.btnCheckSendEmail) { multiStepForm.SendEmail.root.classList.add(classNames.isFilterSignin); multiStepForm.SendEmail.root.classList.remove(classNames.isFilterAutoSignup); } else if (triggerId === multiStepForm.SignIn.idNames.asuSendMailButton) { multiStepForm.SendEmail.root.classList.add(classNames.isFilterAutoSignup); multiStepForm.SendEmail.root.classList.remove(classNames.isFilterSignin); } }; return SendEmail; }()); return FormFilter; }()); KEYENCE.Form.InputInterlock = (function () { var classNames = { trigger: 'js-input-interlock', group: 'js-input-interlockGroup', item: 'js-input-interlockItem', isHide: 'is-hide' }; var InputInterlock = { triggerElements: null, classNames: classNames }; InputInterlock.init = function () { var self = this; $(doc).off('input.formInterlock').on('input.formInterlock', '.' + classNames.trigger, this.onInput.bind(self)); }; InputInterlock.onInput = function (event) { var target = event.currentTarget; var targetIdList = this.getTargetIdListFromTrigger(target); if (!targetIdList.length) { return; } if (target.value.length > 0) { targetIdList.forEach(function (id) { InputInterlock.changeRelatedInputStatus(document.getElementById(id), 'disable'); }); } else if (target.value.length === 0) { targetIdList.forEach(function (id) { InputInterlock.changeRelatedInputStatus(document.getElementById(id), 'enable'); }); } }; InputInterlock.changeRelatedInputStatus = function (targetElement, status) { if (!targetElement || typeof status !== 'string') { return; } if (status === 'enable') { targetElement.disabled = false; if (targetElement.tagName.toLowerCase() === 'button') { targetElement.removeAttribute('aria-disabled'); } InputInterlock.toggleItems(targetElement, 'show'); } else if (status === 'disable') { targetElement.disabled = true; if (targetElement.name) { win.MultiStepForm.clearInputError(targetElement.name, true); } if (targetElement.tagName.toLowerCase() === 'button') { targetElement.setAttribute('aria-disabled', true); } InputInterlock.toggleItems(targetElement, 'hide'); } }; InputInterlock.getTargetIdListFromTrigger = function (target) { var idList = []; if (target && target.dataset.interlock) { idList = target.dataset.interlock.split(','); } return idList; }; InputInterlock.toggleItems = function (targetInputItem, status) { var $interlockGroup; var $targetItems; if (!targetInputItem || typeof status !== 'string') { return; } $interlockGroup = $(targetInputItem).closest('.' + classNames.group); if ($interlockGroup.length) { $targetItems = $interlockGroup.find('.' + classNames.item); } if (!$targetItems || !$targetItems.length) { return } if (status === 'hide') { $targetItems.addClass(classNames.isHide); } else if (status === 'show') { $targetItems.removeClass(classNames.isHide); } }; return InputInterlock; }()); KEYENCE.Form.SMSCodeButton = (function () { var classNames = { trigger: 'js-sendSMSCode', text: 'js-sendSMSCode-text', resendCount: 'js-sendSMSCode-resendCount', resendCountNumber: 'js-sendSMSCode-resendCountNumber', isHide: 'is-hide' }; var urls = { createVerificationCode: '/ajax/registrationAjax/createVerificationCode/' }; var SMSCodeButton = { urls: urls, classNames: classNames, defaultResendTime: 10, timeIds: {} }; SMSCodeButton.init = function () { var self = this; $(doc).off('click.formSMSCodeButton').on('click.formSMSCodeButton', '.' + classNames.trigger, self.onclick.bind(self)); }; SMSCodeButton.replaceButtonText = function (button, text) { var textElement; if (!button || typeof text !== 'string') { return; } textElement = button.querySelector('.' + classNames.text); if (!textElement) { return; } textElement.textContent = text; }; SMSCodeButton.toggleResendCount = function (button, status) { var countContent; if (!button || typeof status !== 'string') { return; } countContent = button.querySelector('.' + classNames.resendCount); if (!countContent) { return; } if (status === 'show') { countContent.classList.remove(classNames.isHide); } else if (status === 'hide') { countContent.classList.add(classNames.isHide); } }; SMSCodeButton.insertResetCountNumber = function (button, number) { var numberElement; if (!button || typeof number !== 'number') { return; } numberElement = button.querySelector('.' + classNames.resendCountNumber); if (!numberElement) { return; } numberElement.textContent = number; }; SMSCodeButton.removeResetCountNumber = function (button) { var numberElement; if (!button) { return; } numberElement = button.querySelector('.' + classNames.resendCountNumber); if (!numberElement) { return; } numberElement.textContent = ''; }; SMSCodeButton.onclick = function (event) { var button = event.currentTarget; var MultiStepForm = window.MultiStepForm; var input = SMSCodeButton.getInput(button); var mobileNumberInfo = SMSCodeButton.getMobileNumberInfo(button); if ( !input || ( typeof mobileNumberInfo.number !== 'string' || typeof mobileNumberInfo.countryId !== 'string' ) ) { return; } SMSCodeButton.disableButton(button); SMSCodeButton.replaceButtonText(button, button.getAttribute('data-resend-text')); SMSCodeButton.toggleResendCount(button, 'show'); SMSCodeButton.createVerificationCode( mobileNumberInfo.countryId, mobileNumberInfo.number ).done(function (status) { if (status.message && (MultiStepForm && MultiStepForm.insertErrorText)) { MultiStepForm.insertErrorText(input.name, status.message); } else { MultiStepForm.clearInputError(input.name, true); } }).fail(function (jqXHR, textStatus, errorThrown) { if (jqXHR.status !== 200) { MultiStepForm.insertErrorText(input.name, kpi_translation.ServerConnectErrorMessage); return; } MultiStepForm.asyncErrorHundler(jqXHR.status, textStatus); }); SMSCodeButton.countResendTime(button); }; SMSCodeButton.countResendTime = function (button, argCount) { var countNum = typeof argCount === 'number' ? argCount : this.getResendTime(button); SMSCodeButton.insertResetCountNumber(button, countNum); SMSCodeButton.timeIds[button.id] = {}; SMSCodeButton.timeIds[button.id].timeId = win.setInterval(function () { countNum--; SMSCodeButton.timeIds[button.id].timerCount = countNum; if (countNum === 0) { SMSCodeButton.enableButton(button); SMSCodeButton.toggleResendCount(button, 'hide'); SMSCodeButton.removeResetCountNumber(button); if (SMSCodeButton.timeIds[button.id] && typeof SMSCodeButton.timeIds[button.id].timeId === 'number') { win.clearInterval(SMSCodeButton.timeIds[button.id].timeId); } delete SMSCodeButton.timeIds[button.id]; return; } SMSCodeButton.insertResetCountNumber(button, countNum); }, 1000); }; SMSCodeButton.getMobileNumberInfo = function (button) { var id; var mobileCountrySelectId; var mobileCountrySelectElem; var mobileNumberInputId; var mobileNumberInputElem; var info = {}; if (!button) { return ''; } id = button.id; if (id === 'loginVerificationCode-getCode') { mobileNumberInputId = 'loginMobileNumber'; if (doc.getElementById('checkCountryNumber')) { mobileCountrySelectId = 'checkCountryNumber'; } else { mobileCountrySelectId = 'loginCountryNumber'; } } else if (button.id === 'suz_verificationCode-getCode') { mobileNumberInputId = 'suz_mobileNumber'; if (doc.getElementById('suz_mobileCountryID')) { mobileCountrySelectId = 'suz_mobileCountryID'; } else { mobileCountrySelectId = 'checkCountryNumber'; } } else if (id === 'remindVerificationCode-getCode') { mobileCountrySelectId = 'remindCountryNumber'; mobileNumberInputId = 'remindMobileNumber'; } mobileCountrySelectElem = doc.getElementById(mobileCountrySelectId); mobileNumberInputElem = doc.getElementById(mobileNumberInputId); if (mobileCountrySelectElem && mobileNumberInputElem) { info.number = mobileNumberInputElem.value; info.countryId = mobileCountrySelectElem.value; } return info; }; SMSCodeButton.getInput = function (button) { var $group; var $input; var $input; if (button) { $group = $(button).closest('.prd-inputGroup'); if ($group && $group.length) { $input = $group.find('input'); } if ($input && $input.length) { return $input.get(0); } } return null; }; SMSCodeButton.getResendTime = function (buttonElement) { var resendTime = ''; if (buttonElement) { resendTime = buttonElement.getAttribute('data-timeout'); if (typeof resendTime === 'string') { resendTime = win.parseInt(resendTime, 10); } else { resendTime = SMSCodeButton.defaultResendTime; } } return resendTime; }; SMSCodeButton.createVerificationCode = function (mobileCountryId, mobileNumber) { var deferred = new $.Deferred(); var options; var url; if (typeof mobileCountryId !== 'string' || typeof mobileNumber !== 'string') { return deferred.reject(); } url = win.suz_getCurrentDomain() + this.urls.createVerificationCode; options = { url: url, data: { mobileCountryId: mobileCountryId, mobileNumber: mobileNumber }, dataType: 'jsonp', jsonp: 'callback', scriptCharset: 'UTF-8', }; $.ajax(options).done(function (data) { deferred.resolve(data); }).fail(function (jqXHR, textStatus, errorThrown) { deferred.reject(jqXHR, textStatus, errorThrown); }); return deferred.promise(); }; SMSCodeButton.enableButton = function (button) { if (button) { button.disabled = false; button.setAttribute('aria-disabled', false); } }; SMSCodeButton.disableButton = function (button) { if (button) { button.disabled = true; button.setAttribute('aria-disabled', true); } }; return SMSCodeButton; }()); KEYENCE.Form.MobileNumberEdit = (function () { var idNames = { beforeMobileCountryID: 'suz_beforeMobileCountryID', beforeMobileNumberValue: 'suz_beforeMobileNumberValue', inputVerificationCode: 'suz_verificationCode', buttonGetVerificationCode: 'suz_verificationCode-getCode' }; var MobileNumberEdit = { inputVerificationCode: null, buttonGetVerificationCode: null }; MobileNumberEdit.init = function () { if (this.isEditProfilePage()) { this.attachInputMobileNumberEvent(); this.attachChangeCountryID(); this.toggleStatus(); } }; MobileNumberEdit.isEditProfilePage = function () { var beforeMobileCountryInput = document.getElementById(idNames.beforeMobileCountryID); var beforeMobileNumberValue = document.getElementById(idNames.beforeMobileNumberValue); if (beforeMobileCountryInput || beforeMobileNumberValue) { return true; } return false; }; MobileNumberEdit.attachInputMobileNumberEvent = function () { var input = document.getElementById('suz_mobileNumber'); input.addEventListener('input', function () { MobileNumberEdit.toggleStatus(); }); }; MobileNumberEdit.attachChangeCountryID = function () { var select = document.getElementById('suz_mobileCountryID'); select.addEventListener('change', function () { MobileNumberEdit.toggleStatus(); }); }; MobileNumberEdit.toggleStatus = function () { var verificationCodeInput = document.getElementById('suz_verificationCode'); var verificationCodeButton = document.getElementById('suz_verificationCode-getCode'); var afterValues; var beforeValues; if (!verificationCodeInput || !verificationCodeButton) { return; } afterValues = this.getAfterValues(); beforeValues = this.getBeforeValues(); if ( (afterValues.mobileNumber === beforeValues.mobileNumber) && (afterValues.countryId === beforeValues.countryId) ) { verificationCodeInput.disabled = true; verificationCodeButton.disabled = true; verificationCodeButton.setAttribute('aria-disabled', true); } else { verificationCodeInput.disabled = false; verificationCodeButton.disabled = false; verificationCodeButton.setAttribute('aria-disabled', false); } }; MobileNumberEdit.getBeforeValues = function () { var values = { mobileNumber: null, countryId: null }; var beforeMobileNumberElem = doc.getElementById('suz_beforeMobileNumber'); var beforeCountryElem = doc.getElementById('suz_beforeMobileCountryID'); if (beforeMobileNumberElem && beforeCountryElem) { values.mobileNumber = beforeMobileNumberElem.value; values.countryId = beforeCountryElem.value; } return values; }; MobileNumberEdit.getAfterValues = function () { var values = { mobileNumber: null, countryId: null }; var mobileNumberElem = doc.getElementById('suz_mobileNumber'); var countryElem = doc.getElementById('suz_mobileCountryID'); if (mobileNumberElem && countryElem) { values.mobileNumber = mobileNumberElem.value; values.countryId = countryElem.value; } return values; }; return MobileNumberEdit; }()); KEYENCE.Form.BlankFieldValidator = (function () { var MultiStepForm = null; var PatternValidator = null; var AvailableValidator = null; var names = { passwordAssistanceActionForm: 'user_passwordAssistanceActionForm', passwordAssistanceResetForm: 'user_passwordAssistance_resetPasswordActionForm', withdrawActionForm: 'user_profile_withdrawActionForm', reloginActionForm: 'user_reloginActionForm', loginActionForm: 'user_loginActionForm', unsubscribeConfirmActionForm: 'enews_unsubscribeConfirmActionForm', }; var classNames = { trigger: 'js-check-blank', status: 'is-error-blank' }; var config = { isClickedContinueButton: false, }; var BlankFieldValidator = { targetForm: null, formSelector: 'form[name="' + names.passwordAssistanceActionForm + '"], ' + 'form[name="' + names.passwordAssistanceResetForm + '"], ' + 'form[name="' + names.withdrawActionForm + '"], ' + 'form[name="' + names.reloginActionForm + '"], ' + 'form[name="' + names.loginActionForm + '"], ' + 'form[name="' + names.unsubscribeConfirmActionForm + '"]', fields: null, classNames: classNames, config: config, }; BlankFieldValidator.init = function () { var fields; MultiStepForm = window.MultiStepForm; this.targetForm = doc.querySelector(this.formSelector); this.multiStepForm = doc.querySelector('#' + MultiStepForm.idNames.trigger); fields = doc.querySelectorAll('.' + classNames.trigger); PatternValidator = win.KeyenceForm.PatternMatchValidator; AvailableValidator = win.KeyenceForm.AvailableValidator; if ( (this.targetForm && fields.length) || (this.multiStepForm && fields.length) ) { this.attachBlurEvent(); } }; BlankFieldValidator.isActionPwdAssistance = function () { var actionValue = $(this.targetForm).attr('action'); if (new RegExp(MultiStepForm.urls.actionPwdAssistance).test(actionValue)) { return true; } return false; }; BlankFieldValidator.attachBlurEvent = function () { $(this.formSelector + ', #' + MultiStepForm.idNames.trigger).on('blur', '.' + classNames.trigger, function () { var MobileNumberValidator = win.KeyenceForm.MobileNumberValidator; var field = this; if (((field.id === 'checkRegistered') || (field.id === 'checkMobileNumber')) && !config.isClickedContinueButton) { if (BlankFieldValidator.isBlank(field)) { MultiStepForm.clearInputError(field.name, true); field.classList.add(classNames.status); field.classList.remove(MobileNumberValidator.classNames.status); field.classList.remove(PatternValidator.classNames.status); AvailableValidator.removeUnavailableStatus(field.name); } else if (!field.classList.contains(PatternValidator.classNames.status) && !field.classList.contains(MobileNumberValidator.classNames.status)) { MultiStepForm.clearInputError(field.name, true); field.classList.remove(classNames.status); } return; } if (BlankFieldValidator.isBlank(field)) { MultiStepForm.insertErrorText(field.name, 'data-message-required'); field.classList.add(classNames.status); field.classList.remove(MobileNumberValidator.classNames.status); field.classList.remove(PatternValidator.classNames.status); AvailableValidator.removeUnavailableStatus(field.name); } else if (!field.classList.contains(PatternValidator.classNames.status) && !field.classList.contains(MobileNumberValidator.classNames.status)) { MultiStepForm.clearInputError(field.name, true); field.classList.remove(classNames.status); } }); }; BlankFieldValidator.isBlank = function (field) { if (field.value === '' && !field.disabled) { return true; } return false; }; BlankFieldValidator.validateFieldAll = function (fieldList) { var hasError = false; if (!fieldList || !fieldList.length) { return hasError; } Array.prototype.forEach.call(fieldList, function (field, index) { if ($(field).is(':visible')) { if (BlankFieldValidator.isBlank(field)) { MultiStepForm.insertErrorText(field.name, 'data-message-required'); field.classList.add(classNames.status); hasError = true; } else { MultiStepForm.clearInputError(field.name, true); field.classList.remove(classNames.status); } } }); return hasError; }; BlankFieldValidator.asyncValidateFieldAll = function (fieldList) { var deferred = new $.Deferred(); var hasError = false; var lastIndex; if (!fieldList || !fieldList.length) { return deferred.resolve(hasError); } lastIndex = fieldList.length - 1; Array.prototype.forEach.call(fieldList, function (field, index) { if ($(field).is(':visible')) { if (BlankFieldValidator.isBlank(field)) { MultiStepForm.insertErrorText(field.name, 'data-message-required'); field.classList.add(classNames.status); hasError = true; } else { MultiStepForm.clearInputError(field.name, true); field.classList.remove(classNames.status); } } if (lastIndex === index) { deferred.resolve(hasError); } }); return deferred.promise(); }; return BlankFieldValidator; }()); KEYENCE.Form.PatternMatchValidator = (function () { var MultiStepForm = null; var BlankFieldValidator = null; var AvailableValidator = null; var names = { passwordAssistanceActionForm: 'user_passwordAssistanceActionForm', passwordAssistanceResetForm: 'user_passwordAssistance_resetPasswordActionForm', withdrawActionForm: 'user_profile_withdrawActionForm', reloginActionForm: 'user_reloginActionForm', loginActionForm: 'user_loginActionForm', }; var classNames = { trigger: 'js-check-pattern', status: 'is-error-pattern' }; var PatternMatchValidator = { targetForm: null, formSelector: 'form[name="' + names.passwordAssistanceActionForm + '"], ' + 'form[name="' + names.passwordAssistanceResetForm + '"], ' + 'form[name="' + names.withdrawActionForm + '"], ' + 'form[name="' + names.reloginActionForm + '"], ' + 'form[name="' + names.loginActionForm + '"]', classNames: classNames, }; PatternMatchValidator.init = function () { var fields; MultiStepForm = win.MultiStepForm; this.targetForm = doc.querySelector(this.formSelector); this.multiStepForm = doc.querySelector('#' + MultiStepForm.idNames.trigger); fields = doc.querySelectorAll('.' + classNames.trigger); BlankFieldValidator = win.KeyenceForm.BlankFieldValidator; AvailableValidator = win.KeyenceForm.AvailableValidator; if ( (this.targetForm && fields.length) || (this.multiStepForm && fields.length) ) { this.attachBlurEvent(); } }; PatternMatchValidator.attachBlurEvent = function () { $(this.formSelector + ', #' + MultiStepForm.idNames.trigger).on('blur', '.' + classNames.trigger, function () { var field = this; if (BlankFieldValidator.isBlank(field)) { return; } else { field.classList.remove(BlankFieldValidator.classNames.status); } AvailableValidator.runValidate(field.name, true).always(function (field) { PatternMatchValidator.updateFieldStatus(field); AvailableValidator.changeDisplayNoteText(field.name); }); }); }; PatternMatchValidator.validateFieldAll = function (fieldList) { var deferred = new $.Deferred(); var hasError = false; var lastIndex = 0; if (!fieldList || !fieldList.length) { return deferred.resolve(hasError); } lastIndex = fieldList.length - 1; Array.prototype.forEach.call(fieldList, function (field, index) { if ($(field).is(':hidden') || BlankFieldValidator.isBlank(field)) { if (lastIndex === index) { deferred.resolve(hasError); } return false; } if (field.dataset.formatPattern !== 'new-password') { PatternMatchValidator.updateFieldStatus(field); if (field.classList.contains(classNames.status)) { hasError = true; } if (lastIndex === index) { deferred.resolve(hasError); } return false; } else { PatternMatchValidator.checkPasswordErrorMessage($(field)).done(function (status) { if (status.message) { MultiStepForm.insertErrorText(field.name, status.message); field.classList.add(classNames.status); hasError = true; } else { MultiStepForm.clearInputError(field.name, true); field.classList.remove(classNames.status); } if (lastIndex === index) { deferred.resolve(hasError); } }).fail(function (err) { deferred.resolve(hasError); }); } }); return deferred.promise(); }; PatternMatchValidator.updateFieldStatus = function (field) { var formatPattarn = field.dataset.formatPattern; if (typeof field !== 'object' || !field) { return; } switch (formatPattarn) { case 'tel': PatternMatchValidator.updateTelField(field); break; case 'email': PatternMatchValidator.updateMailField(field); break; case 'smscode': PatternMatchValidator.updateSmsCodeField(field); break; case 'new-password': PatternMatchValidator.updateNewPasswordField(field); break; default: break; } }; PatternMatchValidator.updateTelField = function (field) { var countryID = KeyenceForm.MobileNumberValidator.getCountryIdByInput(field); if (countryID !== 'CN' || field.value.length === 0 || !$(field).is(':visible')) { return; } if (/^[1][0-9]{10}/.test(field.value) && field.value.length <= 32) { MultiStepForm.clearInputError(field.name, true); field.classList.remove(KeyenceForm.MobileNumberValidator.classNames.status); } else { MultiStepForm.insertErrorText(field.name, 'data-message-mobile-number-format'); field.classList.add(KeyenceForm.MobileNumberValidator.classNames.status); } }; PatternMatchValidator.updateMailField = function (field) { if (/^[a-zA-Z0-9\.!#$%&'*+\/=?^_`{|}~\-]+@[a-zA-Z0-9\-]+(\.[A-Za-z0-9\-]+)+$/.test(field.value)) { MultiStepForm.clearInputError(field.name, true); field.classList.remove(classNames.status); } else { MultiStepForm.insertErrorText(field.name, 'data-message-email-address-format'); field.classList.add(classNames.status); } }; PatternMatchValidator.updateSmsCodeField = function (field) { if (/^[0-9]+$/.test(field.value)) { MultiStepForm.clearInputError(field.name, true); field.classList.remove(classNames.status); } else { MultiStepForm.insertErrorText(field.name, 'data-message-verification-code-format'); field.classList.add(classNames.status); } }; PatternMatchValidator.updateNewPasswordField = function (field) { PatternMatchValidator.checkPasswordErrorMessage($(field)).done(function (status) { if (status.message) { MultiStepForm.insertErrorText(field.name, status.message); field.classList.add(classNames.status); } else { MultiStepForm.clearInputError(field.name, true); field.classList.remove(classNames.status); } }).fail(function (err) { console.log(err); }); }; PatternMatchValidator.checkPasswordErrorMessage = function (field) { var deferred = new $.Deferred(); var val = field.val(); var requestURL = win.suz_getCurrentDomain() + '/ajax/validationAjax/customerRegistrationFieldValidator/'; if (field.attr('type')==='checkbox') { if (!field.prop('checked')) { val = ""; } } $.ajax({ url: requestURL, data: { fieldName : 'password', fieldValue : encodeURIComponent(val), token : $("input[name='org.apache.struts.taglib.html.TOKEN']").attr("value") }, dataType: "jsonp", jsonp: "callback", scriptCharset: "UTF-8" }).then(function (data) { deferred.resolve(data); }, function (req, stat, err) { if (req.status == 401) { win.location.href = win.suz_getCurrentDomain() + "/error/tokenError.jsp"; return false; } deferred.reject(err); return false; }); return deferred.promise(); }; return PatternMatchValidator; }()); KEYENCE.Form.MobileNumberValidator = (function () { var MultiStepForm = null; var classNames = { trigger: 'js-checkMobileNumberFormat', status: 'is-error-format' }; var names = { passwordAssistanceActionForm: 'user_passwordAssistanceActionForm', passwordAssistanceResetForm: 'user_passwordAssistance_resetPasswordActionForm', withdrawActionForm: 'user_profile_withdrawActionForm', reloginActionForm: 'user_reloginActionForm', loginActionForm: 'user_loginActionForm', }; var MobileNumberValidator = { targetForm: null, formSelector: 'form[name="' + names.passwordAssistanceActionForm + '"], ' + 'form[name="' + names.user_passwordAssistance_resetPasswordActionForm + '"], ' + 'form[name="' + names.withdrawActionForm + '"], ' + 'form[name="' + names.reloginActionForm + '"], ' + 'form[name="' + names.loginActionForm + '"]', classNames: classNames, multiStepForm: null }; MobileNumberValidator.init = function () { var targets = doc.querySelectorAll('.' + classNames.trigger); MultiStepForm = window.MultiStepForm; this.targetForm = doc.querySelector(win.KeyenceForm.CommonSubmitValidator.formSelector); this.multiStepForm = doc.querySelector('#' + MultiStepForm.idNames.trigger); if ((this.targetForm && targets.length) || (this.multiStepForm && targets.length)) { // Removed input event. To change to Lost Focus. // this.attachInputEvent(); } }; MobileNumberValidator.validateFieldAll = function (fields) { var deferred = new $.Deferred(); var hasError = false; var lastIndex; if (!fields) { return deferred.resolve(hasError); } lastIndex = fields.length - 1; Array.prototype.forEach.call(fields, function (field, index) { var value = field.value; var name = field.name; var countryID = MobileNumberValidator.getCountryIdByInput(field); if (countryID !== 'CN' || field.value.length === 0 || !$(field).is(':visible')) { if (lastIndex === index) { deferred.resolve(hasError); } return false; } MobileNumberValidator.checkFormat(countryID, value).done(function (data) { if (data.message) { MultiStepForm.insertErrorText(name, data.message); field.classList.add(classNames.status); hasError = true; } else { MultiStepForm.clearInputError(name, true); field.classList.remove(classNames.status); } if (lastIndex === index) { deferred.resolve(hasError); } }); }); return deferred.promise(); }; MobileNumberValidator.checkFormat = function (mobileCountryId, mobileNumber) { var options; var deferred = new $.Deferred(); var url; url = win.suz_getCurrentDomain() + '/ajax/registrationAjax/mobileNumberValidator/'; options = { url: url, data: { mobileCountryId: mobileCountryId, mobileNumber: mobileNumber }, dataType: 'jsonp', jsonp: 'callback', scriptCharset: 'UTF-8' }; $.ajax(options).done(function (data) { deferred.resolve(data); }).fail(function (jqXHR, textStatus, errorThrown) { MultiStepForm.asyncErrorHundler(jqXHR.status, textStatus); deferred.reject(jqXHR, textStatus, errorThrown); }); return deferred.promise(); }; MobileNumberValidator.getCountryIdByInput = function (input) { var $select = $(input).prev('.js-selectCountryNumber').find('.js-selectCountryNumber-target'); var contryId = ''; if ($select.length) { contryId = $select.val(); } return contryId; }; MobileNumberValidator.attachInputEvent = function () { $(this.formSelector + ', #' + MultiStepForm.idNames.trigger).on('input', '.' + classNames.trigger, function () { var field = this; var countryID = MobileNumberValidator.getCountryIdByInput(field); if (field.value.length === 0) { return; } MobileNumberValidator.checkFormat(countryID, field.value).done(function (data) { if (!data.message) { MultiStepForm.clearInputError(field.name, true); } }); }); }; return MobileNumberValidator; }()); KEYENCE.Form.CommonSubmitValidator = (function () { var MultiStepForm = null; var canSubmit = false; var names = { passwordAssistanceActionForm: 'user_passwordAssistanceActionForm', passwordAssistanceResetForm: 'user_passwordAssistance_resetPasswordActionForm', withdrawActionForm: 'user_profile_withdrawActionForm', reloginActionForm: 'user_reloginActionForm', loginActionForm: 'user_loginActionForm', unsubscribeConfirmActionForm: 'enews_unsubscribeConfirmActionForm', }; var CommonSubmitValidator = { $targetForm: null, formSelector: 'form[name="' + names.passwordAssistanceActionForm + '"], ' + 'form[name="' + names.passwordAssistanceResetForm + '"], ' + 'form[name="' + names.withdrawActionForm + '"], ' + 'form[name="' + names.reloginActionForm + '"], ' + 'form[name="' + names.loginActionForm + '"], ' + 'form[name="' + names.unsubscribeConfirmActionForm + '"]', }; CommonSubmitValidator.init = function () { MultiStepForm = window.MultiStepForm; this.$targetForm = $(this.formSelector); if (this.$targetForm.length) { MultiStepForm.focusFirstErrorItem(this.$targetForm); this.attachSubmitEvent(); } }; CommonSubmitValidator.attachSubmitEvent = function () { this.$targetForm.on('submit', this.onSubmit); }; CommonSubmitValidator.onSubmit = function () { var FormFilter = KEYENCE.Form.FormFilter; var BlankFieldValidator = win.KeyenceForm.BlankFieldValidator; var PatternValidator = win.KeyenceForm.PatternMatchValidator; var MobileNumberValidator = win.KeyenceForm.MobileNumberValidator; var mobileNumberFields = doc.querySelectorAll('.' +MobileNumberValidator.classNames.trigger); var requiredFields = doc.querySelectorAll('.' + BlankFieldValidator.classNames.trigger); var patternCheckedFields = doc.querySelectorAll('.' + PatternValidator.classNames.trigger); var deferred1 = new $.Deferred(); var formType = FormFilter.General.getFormType(); var hasBlankError = false; if ( win.KeyenceForm.BlankFieldValidator.isActionPwdAssistance() && !doc.querySelector('form[name="' + names.passwordAssistanceActionForm + '"]') && !doc.querySelector('form[name="' + names.passwordAssistanceResetForm + '"]') ) { return true; } if (canSubmit) { return true; } canSubmit = true; if ( formType === FormFilter.General.FORM_TYPE.EMAIL || formType === FormFilter.General.FORM_TYPE.DEFAULT || doc.querySelector('form[name="' + names.passwordAssistanceResetForm + '"]') ) { if (requiredFields) { hasBlankError = BlankFieldValidator.validateFieldAll(requiredFields); if (hasBlankError) { canSubmit = false; } } if (patternCheckedFields) { PatternValidator.validateFieldAll(patternCheckedFields).done(function (hasFormatError) { if (hasFormatError) { MultiStepForm.focusFirstErrorItem(CommonSubmitValidator.$targetForm); canSubmit = false; } deferred1.resolve(); }); } else { deferred1.resolve(); } } else if (formType === FormFilter.General.FORM_TYPE.MOBILE_NUMBER) { if (requiredFields) { hasBlankError = BlankFieldValidator.validateFieldAll(requiredFields); if (hasBlankError) { canSubmit = false; } } if (mobileNumberFields.length) { MobileNumberValidator.validateFieldAll(mobileNumberFields).done(function (hasFormatError) { if (hasFormatError) { MultiStepForm.focusFirstErrorItem(CommonSubmitValidator.$targetForm); canSubmit = false; } deferred1.resolve(); }); } else { deferred1.resolve(); } } deferred1.promise().done(function () { if (canSubmit) { setTimeout(function () { $(CommonSubmitValidator.formSelector).find('input[type="submit"]').trigger('click'); }, 0); } else { MultiStepForm.focusFirstErrorItem(CommonSubmitValidator.$targetForm); } }); return false; }; return CommonSubmitValidator; }()); KEYENCE.Form.AvailableValidator = (function () { var MultiStepForm = null; var BlankFieldValidator = null; var PatternMatchValidator = null; var AvailableValidator = { multiStepForm: null, preform: null, RegisterForm: null, targetWrapperClass: { email: 'js-validateEmailAvailable', phone: 'js-validatePhoneAvailable', mobile: 'js-validateMobileAvailable' }, targetClass: { emailAddress: 'js-validateEmailAvailable-target', phoneCountryId: 'js-validatePhoneAvailable-countryId', phoneNumber: 'js-validatePhoneAvailable-number', mobileCountryId: 'js-validateMobileAvailable-countryId', mobileNumber: 'js-validateMobileAvailable-number', status: 'is-unavailable' }, targetElements: { phoneNumber: null, mobileNumber: null, }, targetKey: { email: 'email', mobile: 'mobile', phone: 'phone' }, targetData: { targetWrapper: null, numberElement: null, countryIdElement: null, numberValue: '', countryIdValue: '', url: '' }, apiUrl: { email: 'https://emailvalidation.abstractapi.com/v1/?email=', phone: 'https://phonevalidation.abstractapi.com/v1/?phone=', emailKey: 'api_key=f9e036567bfc45faaa30f137cd49dbe2', phoneKey: 'api_key=0f96bf50834f431aaa97290c4df8d12d' }, config: { registerTargets: null, registerTargetsLength: 0, isRunningVerification: false, isUnavailable: false, preFormProcessingEventObject: null, registerProcessingEventObject: null, registerCurrentPanelType: '', currentArea: null, currentTarget: null, isReturnFirstTimePreForm: false, isReturnFirstTimeRegister: false, isPreFormContinueBlocked: false }, processingUnblocked: { email: false, signInMobile: false } }; AvailableValidator.init = function () { MultiStepForm = win.MultiStepForm; this.multiStepForm = doc.getElementById(MultiStepForm.idNames.trigger); this.preform = doc.getElementById(MultiStepForm.PreForm.idNames.root); this.RegisterForm = doc.getElementById(MultiStepForm.Register.idNames.regForm); BlankFieldValidator = win.KeyenceForm.BlankFieldValidator; PatternMatchValidator = win.KeyenceForm.PatternMatchValidator; if(!this.multiStepForm || win.kpi_siteSettings.siteId !== MultiStepForm.siteData.KA.id) { return; } if (this.preform) { this.setTriggerElements(this.preform); } if (this.RegisterForm) { this.setTriggerElements(this.RegisterForm); this.setNumberElements(); this.setTargetBlockStatus(); this.setMutationObserver(); } }; AvailableValidator.setTriggerElements = function (targetForm) { var targetWrapperElements = null; Object.keys(this.targetWrapperClass).forEach(function (key) { targetWrapperElements = targetForm.querySelectorAll('.' + AvailableValidator.targetWrapperClass[key]); if (targetWrapperElements.length) { targetWrapperElements.forEach(function (WrapperElement) { AvailableValidator.setValidateEvent(WrapperElement, key, targetForm); }); } }); }; AvailableValidator.setNumberElements = function () { this.targetElements.mobileNumber = this.RegisterForm.querySelector('.' + this.targetClass.mobileNumber); this.targetElements.phoneNumber = this.RegisterForm.querySelector('.' + this.targetClass.phoneNumber); this.config.registerTargets = this.RegisterForm.querySelectorAll('.' + this.targetClass.mobileNumber + ', .' + this.targetClass.phoneNumber); this.config.registerTargetsLength = this.config.registerTargets.length; }; AvailableValidator.setTargetBlockStatus = function () { if (this.config.registerTargetsLength === 2) { this.processingUnblocked.mobile = false; this.processingUnblocked.phone = false; } else if (this.config.registerTargetsLength === 1) { if (this.config.registerTargets[0].classList.contains(this.targetClass.mobileNumber)) { this.processingUnblocked.mobile = false; } else { this.processingUnblocked.phone = false; } } }; AvailableValidator.setValidateEvent = function (targetWrapper, type, targetForm) { var target = null; var countryNumber = null; switch (type) { case this.targetKey.email: target = targetWrapper.querySelector('.' + this.targetClass.emailAddress); if (!target) { break; } if (!target.classList.contains(PatternMatchValidator.classNames.trigger)) { target.addEventListener('blur', this.runEmailValidate.bind(this), false); } target.addEventListener('blur', this.changeRunningStatus, false); target.addEventListener('input', this.changeBlockStatus, false); break; case this.targetKey.mobile: target = targetWrapper.querySelector('.' + this.targetClass.mobileNumber); countryNumber = targetWrapper.querySelector('.' + this.targetClass.mobileCountryId); if (target) { if (targetForm !== this.RegisterForm && !target.classList.contains(PatternMatchValidator.classNames.trigger)) { target.addEventListener('blur', this.runMobileValidate.bind(this), false); } target.addEventListener('blur', this.changeRunningStatus, false); target.addEventListener('input', this.changeBlockStatus, false); if (targetForm === this.RegisterForm) { target.addEventListener('input', this.setCurrentTarget, false); target.addEventListener('focus', this.setCurrentTarget, false); } } if (countryNumber) { countryNumber.addEventListener('change', this.runMobileValidate.bind(this), false); } break; case this.targetKey.phone: target = targetWrapper.querySelector('.' + this.targetClass.phoneNumber); countryNumber = targetWrapper.querySelector('.' + this.targetClass.phoneCountryId); if (target) { if (targetForm !== this.RegisterForm && !target.classList.contains(PatternMatchValidator.classNames.trigger)) { target.addEventListener('blur', this.runPhoneValidate.bind(this), false); } target.addEventListener('blur', this.changeRunningStatus, false); target.addEventListener('input', this.changeBlockStatus, false); if (targetForm === this.RegisterForm) { target.addEventListener('input', this.setCurrentTarget, false); target.addEventListener('focus', this.setCurrentTarget, false); } } if (countryNumber) { countryNumber.addEventListener('change', this.runPhoneValidate.bind(this), false); } break; default: break; } }; AvailableValidator.changeRunningStatus = function (event) { var targetElement = event.currentTarget; AvailableValidator.config.isRunningVerification = true; if (targetElement.closest('.' + MultiStepForm.Register.classNames.formPanel) && (targetElement.classList.contains(AvailableValidator.targetClass.mobileNumber) || targetElement.classList.contains(AvailableValidator.targetClass.phoneNumber))) { if (AvailableValidator.config.currentTarget && AvailableValidator.config.registerProcessingEventObject) { AvailableValidator.runRegisterVerification(); } } }; AvailableValidator.changeBlockStatus = function (event) { var targetElement = event.currentTarget; if (targetElement.classList.contains(AvailableValidator.targetClass.emailAddress)) { AvailableValidator.processingUnblocked.email = false; } else if (targetElement.closest('#' + MultiStepForm.PreForm.idNames.root) && targetElement.classList.contains(AvailableValidator.targetClass.mobileNumber)) { AvailableValidator.processingUnblocked.signInMobile = false; } else if (targetElement.closest('.' + MultiStepForm.Register.classNames.formPanel) && targetElement.classList.contains(AvailableValidator.targetClass.mobileNumber)) { AvailableValidator.processingUnblocked.mobile = false; } else if (targetElement.closest('.' + MultiStepForm.Register.classNames.formPanel) && targetElement.classList.contains(AvailableValidator.targetClass.phoneNumber)) { AvailableValidator.processingUnblocked.phone = false; } }; AvailableValidator.setCurrentTarget = function (event) { AvailableValidator.config.currentTarget = event.currentTarget; }; AvailableValidator.runEmailValidate = function (target, $deferred, isErrorCheck) { var requireElementObject = this.getRequireElements(target, this.targetKey.email); if (!requireElementObject) { if ($deferred) { $deferred.resolve(target); } return; } if (BlankFieldValidator.isBlank(requireElementObject.target)) { this.clearNoteText(requireElementObject.targetWrapper); if ($deferred) { $deferred.resolve(target); } return; } this.runAvailableValidate(requireElementObject.target, requireElementObject.targetWrapper, this.apiUrl.emailKey, this.targetKey.email).done(function (resultData) { if(!resultData) { if ($deferred) { $deferred.resolve(target); } return; } AvailableValidator.updateEmailStatus(resultData, isErrorCheck); if ($deferred) { $deferred.resolve(target); } }).fail(function () { AvailableValidator.clearNoteText(requireElementObject.targetWrapper); if ($deferred) { $deferred.resolve(target); } }); }; AvailableValidator.runMobileValidate = function (target, $deferred, isErrorCheck) { var requireElementObject = this.getRequireElements(target, this.targetKey.mobile); if (!requireElementObject) { if ($deferred) { $deferred.resolve(target); } return; } if (this.isBlankNumber(requireElementObject, this.targetKey.mobile)) { this.clearNoteText(requireElementObject.targetWrapper); if ($deferred) { $deferred.resolve(target); } return; } this.runAvailableValidate(requireElementObject.target, requireElementObject.targetWrapper, this.apiUrl.phoneKey, this.targetKey.mobile).done(function (resultData) { if(!resultData) { if ($deferred) { $deferred.resolve(target); } return; } AvailableValidator.updateNumberStatus(resultData, isErrorCheck); if ($deferred) { $deferred.resolve(target); } }).fail(function () { AvailableValidator.clearNoteText(requireElementObject.targetWrapper); if ($deferred) { $deferred.resolve(target); } }); }; AvailableValidator.runPhoneValidate = function (target, $deferred, isErrorCheck) { var requireElementObject = this.getRequireElements(target, this.targetKey.phone); if (!requireElementObject) { if ($deferred) { $deferred.resolve(target); } return; } if (this.isBlankNumber(requireElementObject, this.targetKey.phone)) { this.clearNoteText(requireElementObject.targetWrapper); if ($deferred) { $deferred.resolve(target); } return; } this.runAvailableValidate(requireElementObject.target, requireElementObject.targetWrapper, this.apiUrl.phoneKey, this.targetKey.phone).done(function (resultData) { if(!resultData) { if ($deferred) { $deferred.resolve(target); } return; } AvailableValidator.updateNumberStatus(resultData, isErrorCheck); if ($deferred) { $deferred.resolve(target); } }).fail(function () { AvailableValidator.clearNoteText(requireElementObject.targetWrapper); if ($deferred) { $deferred.resolve(target); } }); }; AvailableValidator.getRequireElements = function (target, type) { var targetElement = null; var requireElements = null; var targetWrapper = null; if (target.currentTarget) { targetElement = target.currentTarget; } else { targetElement = target; } if (!targetElement || !type) { return requireElements; } targetWrapper = targetElement.closest('.' + this.targetWrapperClass[type]); if (!targetWrapper) { return requireElements; } return requireElements = { target: targetElement, targetWrapper: targetWrapper }; } AvailableValidator.hasError = function (targetWrapper) { if (targetWrapper.classList.contains(MultiStepForm.classNames.isError)) { return true; } return false; } AvailableValidator.isBlankNumber = function (requireElementObject, type) { var isBlank = true; var numberInput = null; if (requireElementObject.target.tagName === 'INPUT') { if (requireElementObject.target.value === '') { return isBlank; } else { isBlank = false; } } else { if (type === this.targetKey.mobile) { numberInput = requireElementObject.targetWrapper.querySelector('.' + this.targetClass.mobileNumber); } else { numberInput = requireElementObject.targetWrapper.querySelector('.' + this.targetClass.phoneNumber); } if (numberInput && numberInput.value === '') { return isBlank; } else { isBlank = false; } } return isBlank; }; AvailableValidator.runAvailableValidate = function (target, targetWrapper, apiKey, type) { var $deferred = new $.Deferred(); var resultData = {}; this.targetData = { targetWrapper: targetWrapper, numberElement: null, countryIdElement: null, numberValue: '', countryIdValue: '', url: '' }; if (type === this.targetKey.email) { this.targetData.url = this.apiUrl.email + target.value + '&' + apiKey; } else if (type === this.targetKey.mobile || type === this.targetKey.phone) { this.setTargetData(this.targetData.targetWrapper, apiKey, type); } if (this.targetData.url === '') { $deferred.reject(); } $.ajax({ url: this.targetData.url, type: 'GET', dataType: 'json', timeout: 10000 }).done(function (data) { if (type !== AvailableValidator.targetKey.email) { resultData = { apiData: data, targetData: AvailableValidator.targetData, targetType: type } } else { resultData = { apiData: data, targetData: AvailableValidator.targetData } } $deferred.resolve(resultData); }).fail(function () { $deferred.reject(); }); return $deferred.promise(); }; AvailableValidator.setTargetData = function (targetWrapper, apiKey, type) { var data = this.targetData; var optionElements = null; var reg = null; var inputValue = ''; if (type === this.targetKey.mobile) { data.numberElement = targetWrapper.querySelector('.' + this.targetClass.mobileNumber); data.countryIdElement = targetWrapper.querySelector('.' + this.targetClass.mobileCountryId); } else if (type === this.targetKey.phone) { data.numberElement = targetWrapper.querySelector('.' + this.targetClass.phoneNumber); data.countryIdElement = targetWrapper.querySelector('.' + this.targetClass.phoneCountryId); } if (data.numberElement && data.countryIdElement) { data.numberValue = data.numberElement.value; optionElements = data.countryIdElement.options; data.countryIdValue = optionElements[data.countryIdElement.selectedIndex].dataset.code; } if (!data.numberValue || !data.countryIdValue) { return; } if (data.numberValue.indexOf(data.countryIdValue) === 0) { inputValue = data.numberValue; reg = new RegExp('\\' + data.countryIdValue); data.numberValue = inputValue.replace(reg, ''); } data.url = this.apiUrl.phone + encodeURIComponent(data.countryIdValue + data.numberValue) + '&' + apiKey; }; AvailableValidator.updateEmailStatus = function (resultData, isErrorCheck) { var apiData = resultData.apiData; var targetData = resultData.targetData; if (!apiData.is_valid_format.value) { this.insertNoteText(targetData.targetWrapper, 'data-message-email-address-format', isErrorCheck); if (isErrorCheck) { targetData.targetWrapper.dataset.unavailable = 'true'; } else { this.showNoteText(targetData.targetWrapper); } return; } if (apiData.deliverability !== 'DELIVERABLE') { this.insertNoteText(targetData.targetWrapper, 'data-message-email-address-available', isErrorCheck); if (isErrorCheck) { targetData.targetWrapper.dataset.unavailable = 'true'; } else { this.showNoteText(targetData.targetWrapper); } return; } this.clearNoteText(targetData.targetWrapper); }; AvailableValidator.updateNumberStatus = function (resultData, isErrorCheck) { var apiData = resultData.apiData; var targetData = resultData.targetData; switch (resultData.targetType) { case this.targetKey.mobile: if (!apiData.valid) { this.insertNoteText(targetData.targetWrapper, 'data-message-mobile-number-available', isErrorCheck); if (isErrorCheck) { targetData.targetWrapper.dataset.unavailable = 'true'; } else { this.showNoteText(targetData.targetWrapper); } break; } targetData.numberElement.value = this.getLocalNumber(apiData.country.prefix, apiData.format.international, apiData.format.local); if (apiData.type !== this.targetKey.mobile) { this.insertNoteText(targetData.targetWrapper, 'data-message-mobile-number-available', isErrorCheck); if (isErrorCheck) { targetData.targetWrapper.dataset.unavailable = 'true'; } else { this.showNoteText(targetData.targetWrapper); } break; } this.clearNoteText(targetData.targetWrapper); break; case this.targetKey.phone: if (!apiData.valid) { this.insertNoteText(targetData.targetWrapper, 'data-message-phone-number-available', isErrorCheck); if (isErrorCheck) { targetData.targetWrapper.dataset.unavailable = 'true'; } else { this.showNoteText(targetData.targetWrapper); } break; } targetData.numberElement.value = this.getLocalNumber(apiData.country.prefix, apiData.format.international, apiData.format.local); this.clearNoteText(targetData.targetWrapper); if (apiData.type === this.targetKey.mobile) { this.inputMobileValue(targetData.numberElement.value, targetData.countryIdValue); } break; default: return; } }; AvailableValidator.getLocalNumber = function (countryCode, internationalValue, localValue) { var reg = new RegExp('\\' + countryCode); var internationalFormatValue = internationalValue.replace(reg, ''); var localFormatValue = ''; var localFormatRemovedFirstValue = ''; var firstValueLocalFormat = ''; var formattedValue = ''; if (localValue) { localFormatValue = localValue.replace(/[^0-9]/g, ''); } if ((internationalFormatValue && localFormatValue) && internationalFormatValue !== localFormatValue) { localFormatRemovedFirstValue = localFormatValue.slice(1); firstValueLocalFormat = localFormatValue.charAt(0); if (internationalFormatValue === localFormatRemovedFirstValue) { formattedValue = firstValueLocalFormat + internationalFormatValue; } } else { return internationalFormatValue; } return formattedValue; }; AvailableValidator.inputMobileValue = function (numberValue, countryCode) { var mobileTriggers = this.RegisterForm.querySelectorAll('.' + this.targetWrapperClass.mobile); var mobileElement = null; var mobileCountryNumber = null; var mobileOption = null; var blurEvent = new Event('blur'); var changeEvent = new Event('change'); if (!mobileTriggers.length) { return; } mobileTriggers.forEach(function (trigger) { mobileElement = trigger.querySelector('.' + AvailableValidator.targetClass.mobileNumber); mobileCountryNumber = trigger.querySelector('.' + AvailableValidator.targetClass.mobileCountryId); if (mobileElement && mobileCountryNumber) { mobileOption = mobileCountryNumber.querySelector('option[data-code="' + countryCode + '"]'); if (mobileOption) { mobileElement.value = numberValue; mobileOption.selected = true; AvailableValidator.clearNoteText(trigger); mobileCountryNumber.closest('.js-selectCountryNumber').dispatchEvent(changeEvent); mobileElement.dispatchEvent(blurEvent); } } }); }; AvailableValidator.insertNoteText = function (targetWrapper, dataName, isErrorCheck) { var errorTextElement = ''; var errorText = ''; if (!targetWrapper || (targetWrapper.classList.contains(MultiStepForm.classNames.isError) && !isErrorCheck)) { return; } errorTextElement = targetWrapper.querySelector('.' + MultiStepForm.classNames.errText); if (!errorTextElement) { return; } if (dataName === 'data-message-email-address-format' && typeof errorTextElement.dataset.messageEmailAddressFormat === 'string') { errorText = errorTextElement.dataset.messageEmailAddressFormat; } else if (dataName === 'data-message-email-address-available' && typeof errorTextElement.dataset.messageEmailAddressAvailable === 'string') { errorText = errorTextElement.dataset.messageEmailAddressAvailable; } else if (dataName === 'data-message-phone-number-available' && typeof errorTextElement.dataset.messagePhoneNumberAvailable === 'string') { errorText = errorTextElement.dataset.messagePhoneNumberAvailable; } else if (dataName === 'data-message-mobile-number-available' && typeof errorTextElement.dataset.messageMobileNumberAvailable === 'string') { errorText = errorTextElement.dataset.messageMobileNumberAvailable; } if (isErrorCheck) { errorTextElement.dataset.unavailableText = errorText; } else { errorTextElement.textContent = errorText; } }; AvailableValidator.clearNoteText = function (targetWrapper) { var errorTextElement = ''; if (!targetWrapper) { return; } targetWrapper.classList.remove(this.targetClass.status); delete targetWrapper.dataset.unavailable; delete targetWrapper.dataset.unavailableText; errorTextElement = targetWrapper.querySelector('.' + MultiStepForm.classNames.errText); if (targetWrapper.classList.contains(MultiStepForm.classNames.isError) || !errorTextElement) { return; } if (typeof errorTextElement.getAttribute('style') === 'string') { errorTextElement.style.display = 'none'; } else { errorTextElement.classList.add('is-hide'); } errorTextElement.textContent = ''; }; AvailableValidator.setMutationObserver = function () { var registerFormArea = doc.getElementById(MultiStepForm.Register.idNames.suzRegArea); var observer = null; var observersuggestConfig = { attributeFilter: ['id'], childList: true }; var $currentPanel = null; var $panels = null; var $state = null; if (!registerFormArea) { return; } observer = new MutationObserver(function (record) { if (record[0].target.id === MultiStepForm.Register.idNames.suzRegArea) { AvailableValidator.setTriggerElements(AvailableValidator.RegisterForm); AvailableValidator.setNumberElements(AvailableValidator.RegisterForm); $panels = MultiStepForm.Register.getPanels(); if ($panels.length) { $currentPanel = $panels.filter('.' + MultiStepForm.classNames.isCurrent); if ($currentPanel.length) { $state = $currentPanel.find('#' + MultiStepForm.Register.idNames.state); } } if (!$state.length) { AvailableValidator.processingUnblocked = { email: false, signInMobile: false } AvailableValidator.setTargetBlockStatus(); } } }); observer.observe(registerFormArea, observersuggestConfig); }; AvailableValidator.runValidate = function (fieldName, isErrorCheck) { var $deferred = new $.Deferred(); var field = null; if (typeof fieldName === 'string' || fieldName) { field = doc.querySelector('[name="' + fieldName + '"]'); } if (!field || win.kpi_siteSettings.siteId !== MultiStepForm.siteData.KA.id) { return $deferred.resolve(field); } if (field.classList.contains(this.targetClass.emailAddress)) { this.runEmailValidate(field, $deferred, isErrorCheck); } else if (field.classList.contains(this.targetClass.mobileNumber)) { this.runMobileValidate(field, $deferred, isErrorCheck); } else if (field.classList.contains(this.targetClass.phoneNumber)) { this.runPhoneValidate(field, $deferred, isErrorCheck); } else { $deferred.resolve(field); } return $deferred.promise(); }; AvailableValidator.showNoteText = function (targetWrapper) { var errorTextElement = targetWrapper.querySelector('.' + MultiStepForm.classNames.errText); if (!errorTextElement || this.hasError(targetWrapper)) { return; } targetWrapper.classList.add(this.targetClass.status); if (errorTextElement.dataset.unavailableText) { errorTextElement.textContent = errorTextElement.dataset.unavailableText; delete targetWrapper.dataset.unavailableText; } if (typeof errorTextElement.getAttribute('style') === 'string') { errorTextElement.style.display = 'block'; } else { errorTextElement.classList.remove('is-hide'); } }; AvailableValidator.hideNoteText = function ($targetArea) { var $targets = null; $targets = $targetArea.find('.' + this.targetClass.status); if (!$targets.length || win.kpi_siteSettings.siteId !== MultiStepForm.siteData.KA.id) { return; } $targets.each(function () { AvailableValidator.clearNoteText(this); }) }; AvailableValidator.removeUnavailableStatus = function (fieldName) { var fieldWrapper = null; if (typeof fieldName === 'string' || fieldName) { fieldWrapper = this.getFieldWrapper(fieldName); } if (fieldWrapper) { delete fieldWrapper.dataset.unavailable; delete fieldWrapper.dataset.unavailableText; fieldWrapper.classList.remove(this.targetClass.status); } if (this.config.isRunningVerification) { this.showNextArea('normal'); } this.config.isRunningVerification = false; }; AvailableValidator.changeDisplayNoteText = function (fieldName) { var fieldWrapper = null; if (typeof fieldName === 'string' || fieldName) { fieldWrapper = this.getFieldWrapper(fieldName); } if (!fieldWrapper) { return; } if (fieldWrapper.dataset.unavailable && !fieldWrapper.classList.contains(MultiStepForm.classNames.isError)) { delete fieldWrapper.dataset.unavailable; this.showNoteText(fieldWrapper); this.showNextArea('note'); } else if (fieldWrapper.classList.contains(MultiStepForm.classNames.isError)) { this.clearNoteText(fieldWrapper); if (this.config.isRunningVerification) { this.showNextArea('error'); } } else if (!fieldWrapper.dataset.unavailable || !fieldWrapper.classList.contains(MultiStepForm.classNames.isError)) { this.clearNoteText(fieldWrapper); if (this.config.isRunningVerification) { this.showNextArea('normal'); } } this.config.isRunningVerification = false; }; AvailableValidator.showNextArea = function (type) { var formType = KEYENCE.Form.FormFilter.General.getFormType(); var FormFilter = KEYENCE.Form.FormFilter; if (!this.processingUnblocked.email && !this.processingUnblocked.signInMobile) { if (this.config.preFormProcessingEventObject) { if (formType === FormFilter.General.FORM_TYPE.MOBILE_NUMBER) { if (type === 'note' && !this.processingUnblocked.signInMobile) { this.processingUnblocked.signInMobile = true; this.config.isReturnFirstTimePreForm = false; this.focusFirstTargetItem(this.config.currentArea); } else { MultiStepForm.PreForm.onClickContinue(this.config.preFormProcessingEventObject); } } else { if (type === 'note' && !this.processingUnblocked.email) { this.processingUnblocked.email = true; this.config.isReturnFirstTimePreForm = false; this.focusFirstTargetItem(this.config.currentArea); } else { MultiStepForm.PreForm.onClickContinue(this.config.preFormProcessingEventObject); } } this.config.preFormProcessingEventObject = null; return; } } if (this.config.registerTargetsLength === 2) { if (!this.config.registerProcessingEventObject) { return; } if (type === 'note' && !this.processingUnblocked.mobile && !this.processingUnblocked.phone) { if (this.targetElements.mobileNumber.value !== '') { this.processingUnblocked.mobile = true; } if (this.targetElements.phoneNumber.value !== '') { this.processingUnblocked.phone = true; } this.config.isReturnFirstTimeRegister = false; this.focusFirstTargetItem(this.config.currentArea); } else if (type === 'note' && !this.processingUnblocked.mobile && this.targetElements.mobileNumber.value !== '') { this.processingUnblocked.mobile = true; this.config.isReturnFirstTimeRegister = false; this.focusFirstTargetItem(this.config.currentArea); } else if (type === 'note' && !this.processingUnblocked.phone && this.targetElements.phoneNumber.value !== '') { this.processingUnblocked.phone = true; this.config.isReturnFirstTimeRegister = false; this.focusFirstTargetItem(this.config.currentArea); } else if (this.config.registerCurrentPanelType === 'notLastPanel') { if (this.config.registerProcessingEventObject.handleObj.type === 'mousedown') { MultiStepForm.Register.showNext(this.config.registerProcessingEventObject, true); } else { MultiStepForm.Register.showNext(this.config.registerProcessingEventObject); } } else if (this.config.registerCurrentPanelType === 'lastPanel') { MultiStepForm.Register.onSubmitForm(); } } else { if (!this.config.registerProcessingEventObject) { return; } if (typeof this.processingUnblocked.mobile !== 'undefined') { if (type === 'note' && !this.processingUnblocked.mobile && this.targetElements.mobileNumber.value !== '') { this.processingUnblocked.mobile = true; this.config.isReturnFirstTimeRegister = false; this.focusFirstTargetItem(this.config.currentArea); } else if (this.config.registerCurrentPanelType === 'notLastPanel') { if (this.config.registerProcessingEventObject.handleObj.type === 'mousedown') { MultiStepForm.Register.showNext(this.config.registerProcessingEventObject, true); } else { MultiStepForm.Register.showNext(this.config.registerProcessingEventObject); } } else if (this.config.registerCurrentPanelType === 'lastPanel') { MultiStepForm.Register.onSubmitForm(); } } if (typeof this.processingUnblocked.phone !== 'undefined') { if (type === 'note' && !this.processingUnblocked.phone && this.targetElements.phoneNumber.value !== '') { this.processingUnblocked.phone = true; this.config.isReturnFirstTimeRegister = false; this.focusFirstTargetItem(this.config.currentArea); } else if (this.config.registerCurrentPanelType === 'notLastPanel') { if (this.config.registerProcessingEventObject.handleObj.type === 'mousedown') { MultiStepForm.Register.showNext(this.config.registerProcessingEventObject, true); } else { MultiStepForm.Register.showNext(this.config.registerProcessingEventObject); } } else if (this.config.registerCurrentPanelType === 'lastPanel') { MultiStepForm.Register.onSubmitForm(); } } } this.config.registerCurrentPanelType === ''; this.config.registerProcessingEventObject = null; }; AvailableValidator.focusFirstTargetItem = function ($currentArea) { var $targetElements = null; var $targetElement = null; if (!$currentArea.length) { return; } $targetElements = $currentArea.find('[id^="suz_div_"].' + MultiStepForm.classNames.isError + ':visible , [id^="suz_div_"].' + this.targetClass.status + ':visible'); if ($targetElements.length) { $targetElement = $targetElements.eq(0).find(MultiStepForm.selectors.focusbleInputElements); if ($targetElement.length) { if ($targetElement.length === 2) { if ( $targetElement.get(0).tagName.toLowerCase() === 'select' && $targetElement.get(1).tagName.toLowerCase() === 'input' ) { $targetElement.get(1).focus(); } } else { $targetElement.get(0).focus(); } } } }; AvailableValidator.getFieldWrapper = function (fieldName) { var field = doc.querySelector('[name="' + fieldName + '"]'); if (!field || win.kpi_siteSettings.siteId !== MultiStepForm.siteData.KA.id) { return null; } if (field.classList.contains(this.targetClass.emailAddress)) { return field.closest('.' + this.targetWrapperClass.email); } else if (field.classList.contains(this.targetClass.mobileNumber)) { return field.closest('.' + this.targetWrapperClass.mobile); } else if (field.classList.contains(this.targetClass.phoneNumber)) { return field.closest('.' + this.targetWrapperClass.phone); } else { return null; } }; AvailableValidator.hasTargetClass = function (field) { if (field.classList.contains(this.targetClass.emailAddress) || field.classList.contains(this.targetClass.mobileNumber) || field.classList.contains(this.targetClass.phoneNumber)) { return true; } return false; }; AvailableValidator.isProgressStatus = function ($targetArea) { var $errorElements = $targetArea.find('.' + MultiStepForm.classNames.isError); if ($errorElements.length) { return true; } if ($targetArea.find('.' + this.targetClass.status).length) { return false; } return true; }; AvailableValidator.updatePreFormBlockStatus = function (formType, formFilter, preFormObject, event) { if (this.config.isRunningVerification || this.config.isReturnFirstTimeRegister) { if (formType === formFilter.General.FORM_TYPE.MOBILE_NUMBER) { if (!this.processingUnblocked.signInMobile && !this.config.isReturnFirstTimePreForm) { this.setPreFormContinueDate(preFormObject.$root, event); this.config.isPreFormContinueBlocked = true; return; } } else { if (!this.processingUnblocked.email && !this.config.isReturnFirstTimePreForm) { this.setPreFormContinueDate(preFormObject.$root, event); this.config.isPreFormContinueBlocked = true; return; } } } else { if (!this.isProgressStatus(preFormObject.$root)) { if (formType === formFilter.General.FORM_TYPE.MOBILE_NUMBER) { if (!this.processingUnblocked.signInMobile && preFormObject.$formCheckMobileNumber.val() !== '') { this.processingUnblocked.signInMobile = true; this.config.isPreFormContinueBlocked = true; return; } } else { if (!this.processingUnblocked.email && preFormObject.$formCheckEmail.val() !== '') { this.processingUnblocked.email = true; this.config.isPreFormContinueBlocked = true; return; } } } } this.config.isReturnFirstTimePreForm = false; this.config.isPreFormContinueBlocked = false; }; AvailableValidator.setPreFormContinueDate = function ($root, event) { this.config.currentArea = $root; this.config.preFormProcessingEventObject = event; this.config.isReturnFirstTimePreForm = true; }; AvailableValidator.updateRegisterBlockStatus = function ($currentPanel, event, currentPanel) { if (this.checkRegisterTargetElements($currentPanel)) { this.config.isRegisterContinueBlocked = false; return; } if (this.isBlankRequiredField($currentPanel)) { this.config.isRegisterContinueBlocked = false; if (typeof this.processingUnblocked.mobile !== 'undefined') { if (this.isVerificationTarget('mobile', this.targetElements.mobileNumber)) { this.processingUnblocked.mobile = true; } } if (typeof this.processingUnblocked.phone !== 'undefined') { if (this.isVerificationTarget('phone', this.targetElements.phoneNumber)) { this.processingUnblocked.phone = true; } } return; } if (this.config.currentTarget) { this.changeDuringValificationStatus(event); this.config.isRegisterContinueBlocked = true; return; } if (this.config.isRunningVerification || this.config.isReturnFirstTimeRegister) { if (this.config.registerTargetsLength === 2) { if ((this.isVerificationTarget('mobile', this.targetElements.mobileNumber) || this.isVerificationTarget('phone', this.targetElements.phoneNumber)) && !this.config.isReturnFirstTimeRegister) { this.setRegisterContinueDate($currentPanel, event, currentPanel); this.config.isRegisterContinueBlocked = true; return; } } else { if (typeof this.processingUnblocked.mobile !== 'undefined') { if (!this.processingUnblocked.mobile && !this.config.isReturnFirstTimeRegister) { this.setRegisterContinueDate($currentPanel, event, currentPanel); this.config.isRegisterContinueBlocked = true; return; } } if (typeof this.processingUnblocked.phone !== 'undefined') { if (!this.processingUnblocked.phone && !this.config.isReturnFirstTimeRegister) { this.setRegisterContinueDate($currentPanel, event, currentPanel); this.config.isRegisterContinueBlocked = true; return; } } } } else { if (!this.isProgressStatus($currentPanel)) { if (this.config.registerTargetsLength === 2) { if (this.isVerificationTarget('mobile', this.targetElements.mobileNumber) || this.isVerificationTarget('phone', this.targetElements.phoneNumber)) { if (this.isVerificationTarget('mobile', this.targetElements.mobileNumber)) { this.processingUnblocked.mobile = true; } if (this.isVerificationTarget('phone', this.targetElements.phoneNumber)) { this.processingUnblocked.phone = true; } this.config.isRegisterContinueBlocked = true; return; } } else { if (typeof this.processingUnblocked.mobile !== 'undefined') { if (this.isVerificationTarget('mobile', this.targetElements.mobileNumber)) { this.processingUnblocked.mobile = true; this.config.isRegisterContinueBlocked = true; return; } } if (typeof this.processingUnblocked.phone !== 'undefined') { if (this.isVerificationTarget('phone', this.targetElements.phoneNumber)) { this.processingUnblocked.phone = true; this.config.isRegisterContinueBlocked = true; return; } } } } } this.config.isReturnFirstTimeRegister = false; this.config.isRegisterContinueBlocked = false; }; AvailableValidator.checkRegisterTargetElements = function ($targetArea) { var $targetElements = null; $targetElements = $targetArea.find('.' + this.targetWrapperClass.mobile + ', .' + this.targetWrapperClass.phone); if (!$targetElements.length) { return true; } return false; }; AvailableValidator.isVerificationTarget = function (keyName, field) { if (!this.processingUnblocked[keyName] && !BlankFieldValidator.isBlank(field)) { return true; } return false; }; AvailableValidator.setRegisterContinueDate = function ($currentPanel, event, currentPanel) { this.config.currentArea = $currentPanel; this.config.registerProcessingEventObject = event; this.config.registerCurrentPanelType = currentPanel; this.config.isReturnFirstTimeRegister = true; }; AvailableValidator.changeDuringValificationStatus = function (event) { var blurEvent = new Event('blur'); this.config.registerProcessingEventObject = event; this.config.currentTarget.dispatchEvent(blurEvent); }; AvailableValidator.isBlankRequiredField = function ($currentPanel) { var $RequiredFields = $currentPanel.find('.' + MultiStepForm.Register.classNames.required); var isBlank = false; if (!$RequiredFields.length) { return isBlank; } $RequiredFields.each(function () { if (BlankFieldValidator.isBlank(this)) { isBlank = true; return false } }); return isBlank; }; AvailableValidator.runRegisterVerification = function () { if (this.config.currentTarget && this.config.registerProcessingEventObject) { this.config.currentTarget = null; if (this.config.registerCurrentPanelType === 'lastPanel') { MultiStepForm.Register.onSubmitForm(); } else { if (this.config.registerProcessingEventObject.handleObj.type === 'mousedown') { MultiStepForm.Register.showNext(this.config.registerProcessingEventObject, true); } else { MultiStepForm.Register.showNext(this.config.registerProcessingEventObject); } } } }; return AvailableValidator; }()); win.KeyenceForm = KEYENCE.Form; KEYENCE.Form.OTPControl = (function () { var OTPControl = {}; OTPControl.init = function () { if ('OTPCredential' in window) { var input = document.querySelector('input[autocomplete="one-time-code"]'); var ac; var form; if (!input) return; ac = new AbortController(); form = input.closest('form'); if (ac && form) { form.addEventListener('submit', function() { ac.abort(); }); } navigator.credentials.get({ otp: {transport:['sms']} }).then(function(otp){ var $otpInput = $(form).find('input[autocomplete="one-time-code"]:visible'); if ($otpInput.length === 1) { $otpInput.val(otp.code); $otpInput.get(0).dispatchEvent(new Event('change')); } }).catch(function(err){ console.log(err); }); } }; return OTPControl; }()); KEYENCE.Form.ToggleDisabled = (function () { var ToggleDisabled = {}; var classNames = { root: 'js-toggleDisabled-root', trigger: 'js-toggleDisabled-trigger', target: 'js-toggleDisabled-target' }; ToggleDisabled.init = function () { var self = this; var roots = doc.querySelectorAll('.' + classNames.root); if (!roots.length) { return; } roots.forEach(function (root) { var trigger = root.querySelector('.' + classNames.trigger); var target = root.querySelector('.' + classNames.target); if (!trigger || !target) { return; } self.default(target); self.onClick(root, trigger, target); self.onChange(trigger, target); }); }; ToggleDisabled.default = function (target) { if (target) { target.disabled = true; target.style.pointerEvents = 'none'; } }; ToggleDisabled.onClick = function (root, trigger, target) { root.addEventListener('click', function () { if (trigger.checked === false) { trigger.checked = true; target.style.pointerEvents = 'auto'; target.disabled = false; win.setTimeout(function() { target.focus(); }, 0); } }); trigger.addEventListener('focus', function () { if (trigger.checked === false) { trigger.checked = true; target.disabled = false; } }); }; ToggleDisabled.onChange = function (trigger, target) { var triggerName = trigger.name; var radioElements = doc.querySelectorAll(`[name="${triggerName}"]`); if (!triggerName) { return; } radioElements.forEach(function (radioElement) { radioElement.addEventListener('change', function (event) { if (!event.target.classList.contains('.' + classNames.trigger)) { target.disabled = true; target.style.pointerEvents = 'none'; } }); }); }; return ToggleDisabled; })(); KEYENCE.DownloadedPopup = (function () { var idNames = { cboxLoadedContent: 'cboxLoadedContent', cbox: 'colorbox', overlay: 'cboxOverlay', recommendTemplate: 'js-myKeyenceModalRecommend-template', recommendAssetListTemplate: 'js-myKeyenceModalRecommend-assetListTemplate', recommendAssetList: 'js-myKeyenceModalRecommend-assetList', }; var classNames = { trigger: 'js-myKeyence-enqueteModal', headingTrigger: 'js-myKeyence-enqHeading', headingBefore: 'js-myKeyence-enqHeadingBefore', headingAfter: 'js-myKeyence-enqHeadingAfter', thumbnail: 'js-myKeyenceModalRecommend-thumbnail', assetLink: 'js-myKeyenceModalRecommend-assetLink', assetTitle: 'js-myKeyenceModalRecommend-assetTitle', isHide: 'is-hide', isOpened: 'is-opened' }; var names = { mykeyenceActionForm: 'mykeyenceActionForm' }; var Popup = { idNames: idNames, classNames: classNames, colorbox: null, modalType: null, messageObj: {}, recommendOpenedLimit: typeof kpi_usersettings.RecommendPopupOpenedCountLimit === 'number' ? kpi_usersettings.RecommendPopupOpenedCountLimit : 3 }; var cookie = { enqueteName: 'kpi_has_downloadPopupOpened', enqueteValue: 1, recommendName: 'kpi_has_downloadRecommendPopupOpened', recommendValue: 1, }; var isRecommendModalOpenedOnce = false; Popup.init = function () { this.addSubmitEvent(); if (this.hasEnqueteError()) { Popup.modalType = 'enquete'; this.open(); } }; Popup.canLaunch = function () { var enqueteOuter = document.querySelector('.' + classNames.trigger); var dlList = doc.querySelectorAll('.buttonConversion.dlLink, .prd-button.dlLink') var dlInfo = this.getDownloadInfo(); var dlAssetObjectTypeFlag = false; var catalogArray = []; if (dlInfo.dlAssetObjectTypeList.indexOf('3dcad') > -1 || dlInfo.dlAssetObjectTypeList.indexOf('2dcad') > -1 || dlInfo.dlAssetObjectTypeList.indexOf('Manual') > -1 || dlInfo.dlAssetObjectTypeList.indexOf('Software') > -1) { dlAssetObjectTypeFlag = true; } if ( enqueteOuter && dlList.length && (dlInfo.asseIdList && dlInfo.asseIdList.length === 1) && (dlInfo.dlAssetObjectTypeList && dlInfo.dlAssetObjectTypeList.length === 1 && dlInfo.dlAssetObjectTypeList[0] === 'Catalog') && typeof kpi_translation.MyKeyenceEnqPopupHeading === 'string' ) { Popup.modalType = 'enquete'; return true; } else if ( dlList.length && dlInfo.asseIdList && (dlInfo.dlAssetObjectTypeList && dlAssetObjectTypeFlag === true) ) { dlInfo.dlAssetObjectTypeList.forEach((item) => { if (item === 'Catalog') { catalogArray.push(item); } }); if (catalogArray.length === 1) { Popup.modalType = 'enquete'; } if (catalogArray.length === 0) { Popup.modalType = 'recommend'; } return true; } return false; }; Popup.hasEnqueteError = function () { var enqueteOuter = document.querySelector('.' + classNames.trigger); var serchQueries = this.getQueryString(); if (serchQueries['action'] === 'enquete' && enqueteOuter) { return true; } return false; }; Popup.getDownloadInfo = function () { var dataLayer = window.dataLayer; var i; var len; var info = {}; if (!Array.isArray(dataLayer)) { return {}; } len = dataLayer.length; for (i = 0; i < len; i++) { if (dataLayer[i].dlAssetId) { info.asseIdList = dataLayer[i].dlAssetId.split(','); } if (dataLayer[i].dlAssetObjectType) { info.dlAssetObjectTypeList = dataLayer[i].dlAssetObjectType.split(','); } if (info.asseIdList && info.dlAssetObjectTypeList) { break; } } return info; }; Popup.open = function () { var enqueteOuter = document.querySelector('.' + classNames.trigger); var delay = 0; if (Popup.modalType === 'recommend') { Popup.recommendModalOpen(); } else if (Popup.modalType === 'enquete') { if (!enqueteOuter || (enqueteOuter && enqueteOuter.classList.contains(classNames.isOpened))) { return; } if (Popup.hasCookie(cookie.enqueteName) && !Popup.hasEnqueteError()) { return; } delay = Number(kpi_usersettings.DownloadPopupOpenDelay) > 0 ? Number(kpi_usersettings.DownloadPopupOpenDelay) : 3000; if (Popup.hasEnqueteError()) { $.colorbox({ html: enqueteOuter.children, speed: kpi_usersettings.ModalOpenSpd, initialWidth: "640px", width: '640px', height: 'auto', opacity: 0.6, onOpen: Popup.onOpen, onCleanup: Popup.onCleanup, }); } else { window.setTimeout(function () { $.colorbox({ html: enqueteOuter.children, speed: kpi_usersettings.ModalOpenSpd, initialWidth: "640px", width: '640px', height: 'auto', opacity: 0.6, onOpen: Popup.onOpen, onCleanup: Popup.onCleanup, }); }, delay); } } }; Popup.recommendModalOpen = function () { const settingObj = win.myk_modal_deqwas; const relatedObj = settingObj ? settingObj.related : []; const recommendModalHtml = Popup.setRecommendModalContent(relatedObj); const cookieValue = Number(Popup.getCookieValue(cookie.recommendName)); let delay = 0; if (!recommendModalHtml || !Array.isArray(relatedObj) || !relatedObj.length || isNaN(Popup.recommendOpenedLimit) || (cookieValue >= Popup.recommendOpenedLimit && Popup.recommendOpenedLimit !== 0) || isRecommendModalOpenedOnce) { return; } delay = Number(kpi_usersettings.DownloadRecommendPopupOpenDelay) > 0 ? Number(kpi_usersettings.DownloadRecommendPopupOpenDelay) : 1000; window.setTimeout(function () { $.colorbox({ html: recommendModalHtml, speed: kpi_usersettings.ModalOpenSpd, initialWidth: "640px", width: '640px', height: 'auto', opacity: 0.6, onOpen: Popup.recommendModalOnOpen, onComplete: Popup.recommendModalOnComplete, onCleanup: Popup.recommendModalOnCleanup, onClosed: Popup.recommendModalOnClosed, }); }, delay); }; Popup.onOpen = function () { var enqueteOuter = document.querySelector('.' + classNames.trigger); var headingElement; $('#colorbox').addClass('of-myKeyenceEnquete'); $('#cboxOverlay').addClass('of-myKeyenceEnquete'); if (enqueteOuter) { headingElement = enqueteOuter.querySelector('.' + classNames.headingTrigger); if (headingElement) { Popup.switchHeading(headingElement, 'show-after'); } enqueteOuter.classList.add(classNames.isOpened); Popup.toggleFirstQuestion('hide'); Popup.setCookie(cookie.enqueteName, cookie.enqueteValue); } }; Popup.recommendModalOnOpen = function () { const cookieValue = Number(Popup.getCookieValue(cookie.recommendName)); $('#colorbox').addClass('of-myKeyenceRecommend'); $('#cboxOverlay').addClass('of-myKeyenceRecommend'); if (cookieValue < Popup.recommendOpenedLimit && Popup.recommendOpenedLimit !== 0) { Popup.setCookie(cookie.recommendName, cookieValue + 1); } }; Popup.recommendModalOnComplete = function () { const assetLinks = doc.querySelectorAll('.js-myKeyenceModalRecommend-assetLink'); const assetIdArray = []; let assetLinkUrl; let params; let dlAssetId; if (assetLinks.length) { assetLinks.forEach((assetLink) => { assetLinkUrl = new URL(assetLink.href); params = assetLinkUrl.searchParams; dlAssetId = params.get('dlAssetId'); assetIdArray.push(dlAssetId); }); doc.body.dataset.recommendModalAsset = assetIdArray.join('/'); }; isRecommendModalOpenedOnce = true; Popup.messageObj.myKDeqwasModalState = 'show'; win.postMessage(Popup.messageObj, win.location.origin); }; Popup.onCleanup = function () { var enqueteOuter = document.querySelector('.' + classNames.trigger); var modalContent = document.getElementById(idNames.cboxLoadedContent); var headingElement; $('#colorbox').removeClass('of-myKeyenceEnquete'); $('#cboxOverlay').removeClass('of-myKeyenceEnquete'); if (enqueteOuter && modalContent) { enqueteOuter.innerHTML = modalContent.innerHTML; headingElement = enqueteOuter.querySelector('.' + classNames.headingTrigger); if (headingElement) { Popup.switchHeading(headingElement, 'show-before'); } Popup.toggleFirstQuestion('show'); Popup.addSubmitEvent(); } }; Popup.recommendModalOnCleanup = function () { $('#colorbox').removeClass('of-myKeyenceRecommend'); $('#cboxOverlay').removeClass('of-myKeyenceRecommend'); Popup.messageObj.myKDeqwasModalState = 'close'; win.postMessage(Popup.messageObj, win.location.origin); }; Popup.recommendModalOnClosed = function () { if (doc.body.dataset.recommendModalAsset) { delete doc.body.dataset.recommendModalAsset; } }; Popup.toggleFirstQuestion = function (status) { var form; var noteText; var enqueteOuter = document.querySelector('.' + classNames.trigger); var groups; if (enqueteOuter) { groups = enqueteOuter.querySelectorAll('.form-group, .prd-inputGroup'); form = enqueteOuter.querySelector('form'); if (form) { noteText = form.firstElementChild; } if (noteText.tagName.toLowerCase() === 'p') { if (status === 'show') { noteText.hidden = false; } else if (status === 'hide') { noteText.hidden = true; } } } if (groups.length) { if (status === 'show') { groups[0].hidden = false; } else if (status === 'hide') { groups[0].hidden = true; } } }; Popup.switchHeading = function (headingElement, status) { var headingBefore; var headingAfter; if (!headingElement) { return; } if (headingElement) { headingBefore = headingElement.querySelector('.' + classNames.headingBefore); headingAfter = headingElement.querySelector('.' + classNames.headingAfter); headingAfter.innerHTML = kpi_translation.MyKeyenceEnqPopupHeading; } if (status === 'show-before') { headingBefore.classList.remove(classNames.isHide); headingBefore.hidden = false; headingAfter.classList.add(classNames.isHide); headingAfter.hidden = true; } else if (status === 'show-after') { headingBefore.classList.add(classNames.isHide); headingBefore.hidden = true; headingAfter.classList.remove(classNames.isHide); headingAfter.hidden = false; } }; Popup.setRecommendModalContent = function (relatedObj) { const contentTemplate = document.getElementById(idNames.recommendTemplate); const assetListTemplate = document.getElementById(idNames.recommendAssetListTemplate); const fragment = document.createDocumentFragment(); const assetLinkParam = win.myk_modal_deqwas_link_parameter; let content = null; let assetList = null; if(!contentTemplate || !assetListTemplate || !Array.isArray(relatedObj)) { return } relatedObj.forEach((data) => { const nodeClone = assetListTemplate.content.cloneNode(true); const thumbnail = nodeClone.querySelector('.' + classNames.thumbnail); const assetLink = nodeClone.querySelector('.' + classNames.assetLink); const assetTitle = nodeClone.querySelector('.' + classNames.assetTitle); const assetIDList = data.assetID ? data.assetID.split(',') : []; const assetLinkUrl = data.assetUrl; if (assetIDList.length && window.kpi_domainSettings.originalDomain) { if (thumbnail) { thumbnail.src = `${window.kpi_domainSettings.originalDomain}/img/asset/${assetIDList[0]}.jpg`; } if (assetLink && assetLinkUrl && assetLinkParam) { assetLink.href = `${assetLinkUrl}&${assetLinkParam}`; } } if (assetTitle && data.assetTitle) { assetTitle.textContent = data.assetTitle; } fragment.appendChild(nodeClone); }); content = contentTemplate.content.cloneNode(true); assetList = content.getElementById(idNames.recommendAssetList); if (assetList) { if (relatedObj.length > 0 && relatedObj.length <= 5) { assetList.classList.remove('largeScreen-column-5'); assetList.classList.add(`largeScreen-column-${relatedObj.length}`); } assetList.appendChild(fragment); } return content; }; Popup.addSubmitEvent = function () { var enqueteOuter = document.querySelector('.' + classNames.trigger); var form; if (!enqueteOuter) { return; } form = enqueteOuter.querySelector('form[name="' + names.mykeyenceActionForm + '"]'); if (!form) { return; } form.addEventListener('submit', function () { var actionVal = form.getAttribute('action'); if (typeof actionVal === 'string' && $('#colorbox').hasClass('of-myKeyenceEnquete')) { form.setAttribute('action', actionVal + '?action=enquete'); } }); }; Popup.getQueryString = function () { var searchStr; var queries = {}; if (win.location.search.length === 0) { return queries; } searchStr = win.location.search.slice(1); searchStr.split('&').forEach(function (queryStr) { var queryArr = queryStr.split('='); queries[queryArr[0]] = queryArr[1]; }); return queries; }; Popup.setCookie = function (name, value) { var path; if (window.suz_LanguagePath) { path = window.suz_LanguagePath + '/'; } else { path = '/'; } document.cookie = name + '=' + value + '; path=' + path; }; Popup.hasCookie = function (cookieName) { var cookies = document.cookie.split(';'); var flag = false; Array.prototype.forEach.call(cookies, function (item) { if (item.indexOf(cookieName + '=') > -1) { flag = true; } }); return flag; }; Popup.getCookieValue = function (cookieName) { const cookies = doc.cookie.split(';'); if (!cookieName) { return false; } if (!cookies.some((item) => item.trim().startsWith(`${cookieName}=`))) { return false; } const targetCookie = cookies.find((item) => item.trim().startsWith(`${cookieName}=`)); return targetCookie.split('=')[1]; }; return Popup; }()); KEYENCE.oneMorePR = function () { var idNames = { root: 'js-myKeyenceOneMorePR', modalCloseButton: 'cboxClose', modalOverlay: 'cboxOverlay' }; var classNames = { video: 'js-myKeyenceOneMorePR-video', videoController: 'js-myKeyenceOneMorePR-videoController', videoControllerLabel: 'js-myKeyenceOneMorePR-videoControllerLabel', downloadButton: 'js-myKeyenceDownload-button', enqueteModal: 'js-myKeyence-enqueteModal', isHide: 'is-hide', isOpened: 'is-opened', isPaused: 'is-paused', }; var cookie = { enqueteName: 'kpi_has_downloadPopupOpened', recommendName: 'kpi_has_downloadRecommendPopupOpened' }; var root = doc.getElementById(idNames.root); var video = root ? root.querySelector(`.${classNames.video}`) : null; var videoController = root ? root.querySelector(`.${classNames.videoController}`) : null; var videoControllerLabel = videoController ? videoController.querySelector(`.${classNames.videoControllerLabel}`) : null; var downloadButton = doc.querySelector(`.${classNames.downloadButton}`); var enqueteModal = doc.querySelector(`.${classNames.enqueteModal}`); var dataLayer = win.dataLayer ? win.dataLayer : []; var fn = {}; var handlers = {}; var messageObj = {}; if (!root) { return; } fn.init = function () { if (!smallScreenMql.matches) { if (!fn.canLaunch()) { return; } fn.changeRootPosition(); fn.controlRoot(); if (video) { fn.setVideo(); } } }; fn.canLaunch = function () { var canLaunch = true; var dlAssetId = dataLayer[1].dlAssetId ? dataLayer[1].dlAssetId.split('.') : []; if (dlAssetId.length > 1) { canLaunch = false; } return canLaunch; }; fn.getModalType = function () { var modaltype = ''; var dlAssetObjectType = dataLayer[1].dlAssetObjectType; if (dlAssetObjectType === 'Catalog') { modaltype = 'enquete' } else if ( dlAssetObjectType === '3dcad' || dlAssetObjectType === '2dcad' || dlAssetObjectType === 'Manual' || dlAssetObjectType === 'Software') { modaltype = 'recommend' } return modaltype; }; fn.changeRootPosition = function () { var targetOuter = doc.querySelector('.prd-layout-grid.of-general'); var target = targetOuter ? targetOuter.firstElementChild : null; if (!target) { return; } target.prepend(root); }; fn.setVideo = function () { fn.clickVideoController(); fn.endedVideo(); }; fn.controlRoot = function () { if (fn.getModalType() === 'enquete') { if ((fn.hasCookie(cookie.enqueteName) && !fn.hasEnqueteError()) || !enqueteModal) { fn.clickDownloadButton(); } else { fn.observeEnqueteModal(); } } else if (fn.getModalType() === 'recommend') { const recommendOpenedLimit = Number(window.DownloadedPopup.recommendOpenedLimit); const cookieValue = Number(fn.getCookieValue(cookie.recommendName)); if (!isNaN(recommendOpenedLimit) && cookieValue >= recommendOpenedLimit && recommendOpenedLimit !== 0) { fn.clickDownloadButton(); } else { fn.observeRecommendModal(); } } }; fn.observeEnqueteModal = function () { var config = { childList: true }; if (!enqueteModal) { return; } var observer = new MutationObserver(() => { fn.closeModal(); observer.disconnect(); }); observer.observe(enqueteModal, config); if (enqueteModal.classList.contains(classNames.isOpened)) { fn.closeModal(); observer.disconnect(); } }; fn.observeRecommendModal = function () { var body = doc.body; var config = { attributes: true }; var observer = new MutationObserver(() => { if (body.dataset.recommendModalAsset) { fn.closeModal(); observer.disconnect(); } }); observer.observe(body, config); if (body.dataset.recommendModalAsset) { fn.closeModal(); observer.disconnect(); } }; fn.clickDownloadButton = function () { if (!downloadButton) { return; } downloadButton.addEventListener('click', handlers.onClickDownloadButton); }; fn.clickVideoController = function () { if (!videoController) { return; } videoController.addEventListener('click', handlers.onClickVideoController); }; fn.endedVideo = function () { video.addEventListener('ended', handlers.onEndedVideo); }; fn.closeModal = function () { var closeTrigger = doc.querySelectorAll(`#${idNames.modalCloseButton}, #${idNames.modalOverlay}`); if (closeTrigger.length) { closeTrigger.forEach(trigger => { trigger.addEventListener('click', handlers.onClickCloseModalTrigger); }) } }; fn.showRoot = function () { root.classList.remove(classNames.isHide); messageObj.mykOneMorePRBannerState = 'show'; win.postMessage(messageObj, win.location.origin); }; fn.playVideo = function () { video.play(); if (videoController) { videoController.classList.remove(classNames.isPaused); } if (videoControllerLabel && videoControllerLabel.dataset.pauseLabel) { videoControllerLabel.textContent = videoControllerLabel.dataset.pauseLabel; } }; fn.pauseVideo = function () { video.pause(); if (videoController) { videoController.classList.add(classNames.isPaused); } if (videoControllerLabel && videoControllerLabel.dataset.playLabel) { videoControllerLabel.textContent = videoControllerLabel.dataset.playLabel; } }; fn.hasCookie = function (cookieName) { var hasCookie = false; if (util.getCookie(cookieName)) { hasCookie = true; } return hasCookie; }; fn.getCookieValue = function (cookieName) { const cookies = doc.cookie.split(';'); if (!cookieName) { return false; } if (!cookies.some((item) => item.trim().startsWith(`${cookieName}=`))) { return false; } const targetCookie = cookies.find((item) => item.trim().startsWith(`${cookieName}=`)); return targetCookie.split('=')[1]; }; fn.hasEnqueteError = function () { var hasEnqueteError = false; var searchParams = new URLSearchParams(location.search); if (searchParams.get('action') === 'enquete' && enqueteModal) { hasEnqueteError = true; } return hasEnqueteError; }; handlers.onClickDownloadButton = function () { setTimeout(() => { fn.showRoot(); if (video) { fn.playVideo(); } }, 3000); }; handlers.onClickCloseModalTrigger = function () { fn.showRoot(); if (video) { fn.playVideo(); } }; handlers.onClickVideoController = function () { if (!videoController) { return; } if (videoController.classList.contains(classNames.isPaused)) { fn.playVideo(); } else { fn.pauseVideo(); } }; handlers.onEndedVideo = function () { fn.pauseVideo(); }; fn.init(); smallScreenMql.addListener(fn.init); }; window.DownloadedPopup = KEYENCE.DownloadedPopup; KEYENCE.omitText = function () { const fn = {}; const targets = doc.querySelectorAll('.js-omitText-target'); const maxChars = 50; if (!targets.length) { return; } fn.run = function () { targets.forEach((target) => { const root = target.closest('.js-omitText-root'); let charsLimit = maxChars; if (!isNaN(target.dataset.maxChars) && target.dataset.maxChars !== '') { charsLimit = parseFloat(target.dataset.maxChars); } else if (root && !isNaN(root.dataset.maxChars) && root.dataset.maxChars !== '') { charsLimit = parseFloat(root.dataset.maxChars); } else { charsLimit = maxChars; }; if (this.isMultiByteLang()) { charsLimit = Math.floor(charsLimit / 2); } const targetStr = target.innerHTML.replace(/<("[^"]*"|'[^']*'|[^'">])*>/gm, ''); if (targetStr.length > charsLimit) { target.textContent = `${targetStr.substring(0, charsLimit)}...`; } }); } fn.isMultiByteLang = function () { let siteLang = ''; if (win.kpi_siteSettings) { siteLang = win.kpi_siteSettings.siteLang ? win.kpi_siteSettings.siteLang : ''; } return /^zh-|^ko-/.test(siteLang); } fn.run(); }; /* deqwas.js -------------------------------------------------------- */ // ----------------------------------------- // Vertical Recommendation // ----------------------------------------- $.fn.recommend02 = function (options) { var o; if (!this.length) { return this; } o = $.extend({ ajaxPath: '', type: '', noSlider: null }, options); this.each(function () { var $this = $(this); var $recommend; var $content; var $contentUl; var $contentLi; var contentNum; var contentHei; var $slide; var $next; var $prev; var num; var speed; var boxHei; var moveFlg; var prevReset; var nextReset; $.ajax({ url: o.ajaxPath, type: 'POST', dataType: 'html', data: win.tkt_deqwas }).done(function (data) { $this.html(data); if (o.noSlider) { o.noSlider(); return; } $this.find('.jcarousel-skin-basic ul').wrapAll('