File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
/*
Author : hyojeong yang
Date : 2025-09-22
Project : 온세종
*/
const toggleCommonFunc = ({ obj, className, hasClass, noneClass }) => {
$(obj).toggleClass(className);
if ($(obj).hasClass(className)) {
hasClass(obj);
} else {
noneClass();
}
};
let openPopupsPub = [];
let dimZIndexPub = 97;
let lastFocusedElement = null;
const popupOpenPub = (target) => {
lastFocusedElement = document.activeElement;
const $pop = $(`[data-popuppub="${target}"]`);
if ($pop.hasClass('popup-alert-area')) {
$pop.css({ 'display': 'flex' });
setTimeout(() => {
$pop.find('button, a[href], input, select, textarea, [tabindex]:not([tabindex="-1"]), [contenteditable]').first().focus();
}, 10);
return;
} else {
openPopupsPub.push(target);
dimZIndexPub += 2;
$pop.css({ 'display': 'flex', 'z-index': dimZIndexPub + 1 }).addClass('is-active');
$('.dim').css({ 'z-index': dimZIndexPub }).show();
$('body').css({ 'overflow-y': 'hidden' });
setTimeout(() => {
$pop.find('button, a, input, select, textarea, [tabindex]:not([tabindex="-1"]), [contenteditable]').first().focus();
}, 10);
}
};
const popupClosePub = (target) => {
const $pop = $(`[data-popuppub="${target}"]`);
if ($pop.hasClass('popup-alert-area')) {
$pop.fadeOut(200, () => {
if (lastFocusedElement) {
lastFocusedElement.focus(); // 이전 요소로 포커스 복귀
}
});
return;
} else {
openPopupsPub = openPopupsPub.filter(item => item !== target);
if (openPopupsPub.length === 0) {
$('body').css({ 'overflow-y': 'auto' });
$pop.add('.dim').fadeOut(100).removeClass('is-active');
dimZIndexPub = 97;
} else {
dimZIndexPub -= 2;
$pop.fadeOut(200, () => {
$('.dim').css({ 'z-index': dimZIndexPub });
});
}
setTimeout(() => {
if (lastFocusedElement) {
lastFocusedElement.focus(); // 이전 요소로 포커스 복귀
}
}, 10);
}
};
$(document).on('click', '[data-popuppub] .pop-close', function () {
const target = $(this).closest($('[class^=popup][data-popuppub]')).data('popuppub');
popupClosePub(target);
});
$('.dim').on('click', () => {
if (openPopupsPub.length > 0) {
const topPopup = openPopupsPub[openPopupsPub.length - 1];
popupClosePub(topPopup);
}
});
//toast
let toastTimer;
const toastShow = function (message) {
clearTimeout(toastTimer);
$(".toast").text(message);
$(".toast").removeClass("is-hidden").removeClass("is-hide").addClass("is-show");
toastTimer = setTimeout(function () {
toastHide();
}, 2000);
}
const toastHide = function () {
clearTimeout(toastTimer);
$(".toast").removeClass("is-show").addClass("is-hide");
toastTimer = setTimeout(function () {
$(".toast").addClass("is-hidden");
}, 1000);
}
if (jQuery) (function ($) {
// accordionFunc
$.extend($.fn, {
accordionFunc: function () {
var init = function (obj) {
$(document).on('click', '.btn-accordion-toggle', function (e) {
const $targetBtn = $(e.target).closest('.btn-accordion-toggle');
const $currentLi = $targetBtn.closest('li');
const $accordion = $currentLi.closest('.accordion');
const $btns = $accordion.find('li .btn-accordion-toggle');
$currentLi.siblings('li').removeClass('is-active');
toggleCommonFunc({
obj: $currentLi,
className: 'is-active',
hasClass: function () {
$btns.html('열기');
$targetBtn.html('닫기');
},
noneClass: function () {
$btns.html('열기');
}
});
});
};
init(this);
return $(this);
},
});
// sectionAccordionFunc
$.extend($.fn, {
sectionAccordionFunc: function () {
var init = function (obj) {
$(document).on('click', '.btn-section-accordion-toggle', function () {
const $btn = $(this);
const $area = $(this).closest('.section-accordion');
toggleCommonFunc({
obj: $area,
className: 'is-close',
hasClass: function () {
$btn.html('열기');
},
noneClass: function () {
$btn.html('접기');
}
});
});
};
init(this);
return $(this);
},
});
// stepUnitAccordionFunc
$.extend($.fn, {
stepUnitAccordionFunc: function () {
var init = function (obj) {
$(document).on('click', '.btn-step-unit-accordion-toggle', function () {
const $btn = $(this);
const $area = $(this).closest('.step-unit-accordion');
toggleCommonFunc({
obj: $area,
className: 'is-close',
hasClass: function () {},
noneClass: function () {}
});
});
};
init(this);
return $(this);
},
});
// tabsNormalFunc
$.extend($.fn, {
tabsNormalFunc: function () {
const init = function (obj) {
const showTab = function (tabSelector) {
$(tabSelector).addClass('is-active');
const $tabsNav = $(tabSelector).find("[class^='tabs-nav'] a.is-active");
if ($tabsNav.length > 0) {
const tabHref = $tabsNav.attr('href');
const $tabsCont = $(tabSelector).find('.tabs-cont' + tabHref);
$tabsCont.addClass('is-active');
}
};
const showInitialTabs = function () {
const $currentTab = $(obj).children("[class^='tabs-nav']").find('a.is-active');
const $currentTabCont = $currentTab.attr('href');
showTab($currentTabCont);
$(obj).find('.tabs-normal').not(':first').each(function () {
init(this);
});
};
const setActiveTab = function (tabLink) {
if (!$(tabLink).hasClass("is-active")) {
$(tabLink).closest("[class^='tabs-nav']").find('a').removeClass("is-active").removeAttr("title");
$(tabLink).addClass("is-active").attr("title", "선택됨");
}
};
const hideTabs = function (tabsContainer) {
$(tabsContainer).find('.tabs-cont').removeClass('is-active').removeAttr("title");
};
const handleTabClick = function (e) {
const $tabLink = $(this);
const $tabsNormal = $tabLink.closest('.tabs-normal');
setActiveTab($tabLink);
hideTabs($tabsNormal);
const $activeTab = $tabLink.attr('href');
showTab($activeTab);
e.preventDefault();
};
$(document).on('click', ".tabs-normal .tabs-nav-lg a, .tabs-normal .tabs-nav a, .tabs-normal .tabs-nav-sm a, .tabs-normal .tabs-nav-xsm a,.tabs-normal .tabs-nav-img a", handleTabClick);
showInitialTabs();
};
$(this).each(function () {
init(this);
});
return this;
},
});
// toggleFunc
$.extend($.fn, {
toggleFunc: function () {
var init = function (obj) {
var $currentTab = $(obj).find("[data-toggle]").find('a.is-active').attr('href');
$($currentTab).show();
$(document).on('click', '[data-toggle]', function (e) {
var val = $(this).data('toggle');
var $el = $('[data-toggleobj="' + val + '"]');
var $btn = $('[data-toggle="' + val + '"]');
toggleCommonFunc({
obj: $btn,
className: 'is-active',
hasClass: function () {
$el.css({'display': 'flex'});
},
noneClass: function () {
$el.css({'display': 'none'});
}
});
});
};
init(this);
return $(this);
},
});
// btnToggleFunc
$.extend($.fn, {
btnToggleFunc: function () {
var init = function (obj) {
$(document).on('click', '.btn-toggle, .btn.toggle, .btn-text.toggle', function (e) {
let $btn = $(this);
toggleCommonFunc({
obj: $btn,
className: 'is-active',
hasClass: function () {
if ($btn.attr("data-txt")) $btn.html($btn.data("txt"));
if ($btn.attr("data-toast")) toastShow($btn.data("toast"));
if ($btn.attr('data-btntoggle')) $('[data-btntoggleobj="' + $btn.data('btntoggle') + '"]').addClass('is-active');
},
noneClass: function () {
if ($btn.attr("data-txt-inactive")) $btn.html($btn.data("txt-inactive"));
if ($btn.attr("data-toast-inactive")) toastShow($btn.data("toast-inactive"));
if ($btn.attr('data-btntoggle')) $('[data-btntoggleobj="' + $btn.data('btntoggle') + '"]').removeClass('is-active');
}
});
});
};
init(this);
return $(this);
},
});
// tipFunc
$.extend($.fn, {
tipFunc: function () {
var init = function (obj) {
var txt = $(obj).find("[data-tip]:checked").data('tip');
var $tip = $(obj).find('.tip-txt');
$tip.css({'display': 'flex'}).html(txt);
$(document).on('click', '[data-tip]', function (e) {
var $area = $(this).closest('.tip-area');
$tip = $area.find('.tip-txt');
$tip.css({'display': 'flex'}).html($(this).data('tip'));
});
};
init(this);
return $(this);
},
});
// tooltipFunc
$.extend($.fn, {
tooltipFunc: function () {
var init = function (obj) {
$(document).on('click', '.btn-tooltip', function (e) {
var $area = $(this).closest('.tooltip');
$('.tooltip').removeClass('is-active');
toggleCommonFunc({
obj: $area,
className: 'is-active'
});
});
$(document).click(function (e) {
if (!$(e.target).is('.btn-tooltip')) {
$('.tooltip').removeClass('is-active');
}
});
};
init(this);
return $(this);
},
});
// etcFunc
$.extend($.fn, {
etcFunc: function () {
var init = function (obj) {
$(document).on('click', '.btn-etc-fnc', function (e) {
var $area = $(this).closest('.etc-fnc-area');
var $el = $area.find('.etc-fnc');
toggleCommonFunc({
obj: $area,
className: 'is-active',
hasClass: function () {
// TweenMax.fromTo($el, .5, { opacity: 0 }, { opacity: 1 });
$('.etc-fnc-area').not($area).removeClass('is-active');
},
noneClass: function () {
// TweenMax.fromTo($el, .5, { opacity: 1 }, { opacity: 0 });
}
});
});
$(document).click(function (e) {
if (!$(e.target).is('.btn-etc-fnc')) {
$('.etc-fnc-area').removeClass('is-active');
}
});
};
init(this);
return $(this);
},
});
// headerUserFunc
$.extend($.fn, {
headerUserFunc: function () {
var init = function (obj) {
$(document).on('click', '.site-header .btn-user-fnc-toggle', function (e) {
var $btn = $(this);
var $area = $btn.closest('.user-area');
toggleCommonFunc({
obj: $area,
className: 'is-active',
hasClass: function () {
$btn.html('열기');
},
noneClass: function () {
$btn.html('닫기');
}
});
});
$(document).click(function (e) {
if (!$(e.target).is('.site-header .btn-user-fnc-toggle')) {
$('.site-header .user-area').removeClass('is-active');
}
});
};
init(this);
return $(this);
},
});
// btnUtilFunc
$.extend($.fn, {
btnUtilFunc: function () {
var init = function (obj) {
$(document).on('click', '.btn-util-toggle', function (e) {
e.stopPropagation();
var $btn = $(this);
var $area = $btn.closest('.btn-util-area');
toggleCommonFunc({
obj: $area,
className: 'is-active'
});
});
$(document).click(function (e) {
if (!$(e.target).closest('.btn-util-area').length) {
$('.btn-util-area').removeClass('is-active');
}
});
};
init(this);
return $(this);
},
});
// siteMenuFunc
$.extend($.fn, {
siteMenuFunc: function () {
var init = function (obj) {
$(document).on("click", ".btn-site-menu-open", function () {
$(".site-menu-area").addClass("is-active");
});
$(document).on("click", ".btn-site-menu-close", function () {
$(".menu > li > ul > li").removeClass("is-active");
$(".site-menu-area").removeClass("is-active");
});
$(document).on("click", ".site-menu-area", function (e) {
if (!$(e.target).closest(".site-menu").length) {
$(".btn-site-menu-close").trigger("click");
}
});
$(document).on("click", ".site-header .menu > li > ul > li > a", function (e) {
if ($(this).next("ul").length) {
e.preventDefault();
let $parentLi = $(this).closest('li');
let isActive = $parentLi.hasClass("is-active");
$(".menu > li > ul > li").removeClass("is-active");
if (!isActive) $parentLi.addClass("is-active");
}
});
};
init(this);
return $(this);
},
});
})(jQuery);
// $(document).ready(function () {
// $('.accordion, .accordion-nav, .accordion-list').accordionFunc();
// $('.tabs-normal').tabsNormalFunc();
// $('[data-toggle]').toggleFunc();
// $('.btn-toggle, .btn.toggle, .btn-text.toggle').btnToggleFunc();
// $('.tip-area').tipFunc();
// $('.tooltip').tooltipFunc();
// $('.etc-fnc-area').etcFunc();
// $('.site-menu-area').siteMenuFunc();
// });
$(document).ready(function () {
$('.accordion, .accordion-nav, .accordion-list').accordionFunc();
$('.section-accordion').sectionAccordionFunc();
$('.step-unit-accordion').stepUnitAccordionFunc();
$('.tabs-normal').tabsNormalFunc();
$('[data-toggle]').toggleFunc();
$('.btn-toggle, .btn.toggle, .btn-text.toggle').btnToggleFunc();
$('.tip-area').tipFunc();
$('.tooltip').tooltipFunc();
$('.etc-fnc-area').etcFunc();
//$('.search-box').schboxFunc();
$('.site-header .user-area').headerUserFunc();
$('.btn-util-area').btnUtilFunc();
$('.site-menu-area').siteMenuFunc();
$('input[type=date]').on('focus', function() {
this.showPicker();
});
});
$(document).on('keydown', '.site-header .gnb > ul > li > a, .site-header .gnb > ul > li > button', function (event) {
if (event.key === 'Enter') {
$(this).closest('li').addClass('is-active');
}
});
$(document).on('focusout', '.site-header .gnb > ul > li.is-active > ul > li:last-child a', function (event) {
setTimeout(() => {
if (!$('.site-header .gnb > ul > li.is-active ul li a').is(':focus')) {
$(this).closest('ul').closest('li').removeClass('is-active');
}
}, 10);
});
$(document).on('focusout', 'input[type=date]', function () {
$(this).showPicker();
});
$(document).on('click', '.btn-pw-toggle', function () {
const $btn = $(this);
const $pwArea = $btn.closest('.pw-area');
const $input = $pwArea.find('.pw-input');
if ($input.attr('type') === 'password') {
$input.attr('type', 'text');
$btn.text('비밀번호숨기기');
$pwArea.addClass('is-active');
} else {
$input.attr('type', 'password');
$btn.text('비밀번호보기');
$pwArea.removeClass('is-active');
}
});