https://www.intermd.co.kr/js/ui_script_pc.js?v=20260422

1$(function(){
2    $('.dropdown__trigger').on({
3        mouseenter:function(){
4            $(this).parents('.dropdown__btn').addClass('on');
5        }
6    });
7    $('.dropdown__btn').on({
8        mouseleave:function(){
9            $(this).removeClass('on');
10        }
11    })
12    
13    // gnb 스크롤시 고정
14    if ($('.gnb').length > 0){
15    	var gnbPos = $('.gnb').offset().top;
16    	$('.topbn__close').click(function(){ // 메인 탑배너 클릭시 gnb위치 재검색
17    		setTimeout(function(){
18    			gnbPos = $('.gnb').offset().top;
19    		},500);
20    	})
21    	$(window).scroll(function(){
22    		if ($(this).scrollTop() > gnbPos) {
23    			$('body').addClass('menuSticky');
24    			// 검색창에 focus되었을경우 해제
25    			if ($('.hSearch__searchIpt:focus')){
26    				$('.hSearch__searchIpt').blur();
27    				$('body').trigger('click');
28    			}
29                // 가로 스크롤 했을경우
30                $('.gnb').css('margin-left',$(window).scrollLeft()*-1);
31    		}else {
32    			$('body').removeClass('menuSticky');
33    		}
34    	}).trigger('scroll');    	
35    }
36
37    // textarea 자동조정
38	// $('.message__textArea.auto_area').on('keyup',function(){
39		// $(this).css('height','auto');
40        // $(this).height(this.scrollHeight);
41    // });
42
43    // 검색 레이어 검색어 리스트 탭
44    $('.hSearch__tab').click(function(){
45        var targetClass = '-'+$(this).attr('data-searchCont');
46        $('.hSearch__content').hide();
47        $('.'+targetClass).show();
48        $('.hSearch__tab').removeClass('on');
49        $(this).addClass('on');
50    });
51
52    // 검색레이어 focusin 레이어 열기
53    $('.hSearch__searchIpt').on('focusin',function(){
54        $('.hSearch__layer').show();
55        searchLyrClose()
56    });
57})
58// 검색영역 외 클릭시 레이어 닫기
59function searchLyrClose(){
60    $('body').click(function(e){
61        var targetClass = $(e.target).attr('class');
62        if (targetClass == undefined || targetClass.indexOf('hSearch__') == -1) {
63            $('.hSearch__layer').hide();
64            $('.hSearch__searchIpt').trigger('focusout');
65            $('body').unbind('click');
66            // console.log('close');
67        }        
68    })
69};
70
71
72// poll '결과페이지 참여자 현황' 도넛차트
73function toPieChartItemPath(startAngle, endAngle) {
74    var x = 52, y = 52, radiusIn = 36, radiusOut = 52;
75    function _toXY(cX, cY, r, degrees) {
76        var rad = (degrees) * Math.PI / 180.0;
77
78        return {
79            x: cX + (r * Math.cos(rad)),
80            y: cY + (r * Math.sin(rad))
81        };
82    }
83    var startIn = _toXY(x, y, radiusIn, endAngle);
84    var endIn = _toXY(x, y, radiusIn, startAngle);
85    var startOut = _toXY(x, y, radiusOut, endAngle);
86    var endOut = _toXY(x, y, radiusOut, startAngle);
87    var arcSweep = (endAngle - startAngle) <= 180 ? "0" : "1";
88    var d = [
89        "M", startIn.x, startIn.y,
90        "L", startOut.x, startOut.y,
91        "A", radiusOut, radiusOut, 0, arcSweep, 0, endOut.x, endOut.y,
92        "L", endIn.x, endIn.y,
93        "A", radiusIn, radiusIn, 0, arcSweep, 1, startIn.x, startIn.y,
94        "z"
95    ].join(" ");
96    return d;
97}
98function chartDraw(chartData) {
99    var eachItemNo = new Array();
100        eachItemNo[0] = chartData.subject;			
101        eachItemNo[1] = new Array();
102        eachItemNo[2] = new Array();
103    for(var i=0; i<chartData.item.length; i++) {
104        eachItemNo[1][i] = chartData.item[i].title;
105        eachItemNo[2][i] = chartData.item[i].value;
106    }
107    draw(eachItemNo, chartData.chartBox);
108
109    function draw(eachItemNo, graphBox){
110        var $graphBox = $('.'+graphBox);
111        var textTitle = eachItemNo[0];
112        var drawPos, befDrawPos=0, graphEndPos=0;
113        var text = '';
114        var textPercent, beftextPercent = 0;
115        var allNo = 0;
116        for(var i=0; i<eachItemNo[2].length; i++) allNo = allNo + eachItemNo[2][i];
117
118        var svg = document.createElementNS("http://www.w3.org/2000/svg", "svg");
119        var path1;
120        svg.setAttribute("aria-hidden","true");
121        svg.setAttribute('viewbox', '0 0 104 104');
122        svg.setAttribute('width', '104px');
123        svg.setAttribute('height', '104px');
124
125        eachItemNo[2].forEach(function(el,idx) {
126            drawPos = Math.round(el * 360 / allNo);
127            textPercent = Math.round(el * 100 / allNo);
128            // 마지막 항목의 퍼센트: 100 - 이전 퍼센테이지, 
129            beftextPercent = parseInt(beftextPercent += textPercent)
130            textPercent = idx < eachItemNo[2].length-1 ? Math.round(el * 100 / allNo) : 100 - (beftextPercent - textPercent);
131            // 마지막 항목의 그래프 : 270
132            graphEndPos = idx < eachItemNo[2].length-1 ? drawPos+befDrawPos-90 : 270;
133            
134            text += '<li class="donutChart__percent'+(idx+1)+'"><span class="donutChart__lt">'+eachItemNo[1][idx] +'</span><span class="donutChart__rt">'+ textPercent+'%</span>'+'</li>';
135
136            path1 = document.createElementNS("http://www.w3.org/2000/svg", 'path');
137            path1.setAttribute('class', 'donutChart__arc'+(idx+1) );
138            path1.setAttribute('d', toPieChartItemPath((0+befDrawPos-90), graphEndPos));
139            path1.setAttribute('fill', 'none');
140
141            svg.appendChild(path1);
142            befDrawPos = drawPos+befDrawPos;
143        });
144        document.getElementById(graphBox).appendChild(svg);
145        $graphBox.find('.donutChart__desc').html(text)
146        $graphBox.find('.donutChart__title').html(textTitle)
147    }
148}
149
150// poll 순서형
151function pollOrderType (container,options){
152    var settings = $.extend({
153        maxlength : 3,
154        container : $(container)
155    }, options),
156    pollTyOrderNo = 1;
157
158    settings.container.find('.pollTyOrder__reset').click(function(){
159        settings.container.find('.pollTyOrder__input').val('');
160        pollTyOrderNo = 1;
161    })
162    settings.container.find('.pollTyOrder__label').click(function(){
163        var $ipt = $(this).find('.pollTyOrder__input');
164
165        if ($ipt.val().length != 0) {
166            var alignNo = $ipt.val();
167            $ipt.val('');
168            
169            pollTyOrderNo--;
170            $('.pollTyOrder__label').each(function(i){
171                var svysVal = $(this).find('.pollTyOrder__input').val();
172                if (svysVal > alignNo ) {
173                    $(this).find('.pollTyOrder__input').val(svysVal-1);
174                }
175            })
176        }else {
177            if(pollTyOrderNo > settings.maxlength) {
178                alert(settings.maxlength + '개 까지 선택 가능합니다.');
179                return false;
180            }
181            $ipt.val(pollTyOrderNo);
182            pollTyOrderNo++;
183        }
184        return false;
185    });

186}
187
188// 공통 아코디언
189// 공통 아코디언
190(function () {
191    const FAQ_SECTION_SELECTOR = '.gAccordion';
192    const FAQ_DT_SELECTOR = 'dl > dt';
193
194    function scrollWithOffset(element, offset) {
195        const rect = element.getBoundingClientRect();
196        const scrollTop = window.pageYOffset || document.documentElement.scrollTop;
197
198        window.scrollTo({
199            top: rect.top + scrollTop - offset,
200            behavior: 'smooth'
201        });
202    }
203
204    document.addEventListener('click', function (e) {
205        const dt = e.target.closest(FAQ_DT_SELECTOR);
206        if (!dt) return;
207
208        // 🔥 여기 추가
209        e.stopImmediatePropagation();
210        // 필요하면 기본 동작 방지
211        // e.preventDefault();
212
213        const section = dt.closest(FAQ_SECTION_SELECTOR);
214        if (!section) return;
215
216        const targetDl = dt.closest('dl');
217        if (!targetDl) return;
218
219        const isActive = targetDl.classList.contains('active');
220
221        if (isActive) {
222            targetDl.classList.remove('active');
223            return;
224        }
225
226        const allDls = section.querySelectorAll('dl');
227        allDls.forEach(function (dl) {
228            dl.classList.remove('active');
229        });
230
231        targetDl.classList.add('active');
232
233        scrollWithOffset(targetDl, 58);
234    });
235})();
236
237//=========================
238//공통 알럿 (동적 DOM 생성 방식 - 백틱 제거)
239//=========================
240function showAlertDialog(options) {
241 return new Promise(function (resolve) {
242     const alertEl = document.createElement("div");
243     alertEl.className = "alert-dialog";
244
245     const message = options.message || "";
246     const desc = options.desc || "";
247     const showCancel = !!options.showCancel;
248
249     const descHtml = desc ? '<p class="desc">' + desc + '</p>' : '<p class="desc" style="display:none;"></p>';
250     const cancelStyle = showCancel ? 'block' : 'none';
251
252     alertEl.innerHTML = 
253         '<div class="alert-panel">' +
254             '<div class="alert-message">' +
255                 message +
256                 descHtml +
257             '</div>' +
258             '<div class="alert-actions">' +
259                 '<button class="alert-cancel" style="display: ' + cancelStyle + ';">취소</button>' +
260                 '<button class="alert-confirm">확인</button>' +
261             '</div>' +
262         '</div>';
263
264     document.body.appendChild(alertEl);
265
266     requestAnimationFrame(() => {
267         alertEl.classList.add("active");
268     });
269
270     const confirmBtn = alertEl.querySelector(".alert-confirm");
271     const cancelBtn = alertEl.querySelector(".alert-cancel");
272
273     function cleanup(result) {
274         alertEl.classList.remove("active"); 
275         
276         setTimeout(() => {
277             alertEl.remove();
278         }, 200); 
279
280         resolve(result);
281     }
282
283     function onConfirmClick() {
284         if (typeof options.onConfirm === "function") {
285             options.onConfirm();
286         }
287         cleanup(true);
288     }
289
290     function onCancelClick() {
291         if (typeof options.onCancel === "function") {
292             options.onCancel();
293         }
294         cleanup(false);
295     }
296
297     confirmBtn.addEventListener("click", onConfirmClick);
298     cancelBtn.addEventListener("click", onCancelClick);
299 });
300}
301
302function showConfirm(options) {
303 return showAlertDialog(Object.assign({}, options, { showCancel: true }));
304}
305
306function showAlert(options) {
307 return showAlertDialog(Object.assign({}, options, { showCancel: false }));
308}
309
310//=========================
311//토스트메시지 (동적 DOM 생성 방식)
312//=========================
313var toastTimer = null;
314
315function showToast(message, duration) {
316 // 기본 유지 시간 3초(3000ms) 설정
317 duration = duration || 3000;
318
319 // 1. 기존에 떠있는 토스트가 있다면 화면에서 즉시 제거하고 타이머 초기화
320 const existingToast = document.querySelector(".toast-message");
321 if (existingToast) {
322     existingToast.remove();
323     if (toastTimer) {
324         clearTimeout(toastTimer);
325     }
326 }
327
328 // 2. 새로운 토스트 요소(div) 생성
329 const toastEl = document.createElement("div");
330 toastEl.className = "toast-message"; // 클래스 부여
331 
332 // 알려주신 구조대로 <p> 태그 안에 메시지 넣기
333 toastEl.innerHTML = "<p>" + message + "</p>";
334
335 // 3. 만들어진 토스트를 화면(body)에 추가
336 document.body.appendChild(toastEl);
337
338 // CSS 애니메이션이 자연스럽게 적용되도록 살짝 지연 후 is-active 추가
339 requestAnimationFrame(function() {
340     toastEl.classList.add("is-active");
341 });
342
343 // 4. 지정된 시간(duration)이 지나면 토스트 숨기기 및 삭제
344 toastTimer = setTimeout(function () {
345     toastEl.classList.remove("is-active"); // 먼저 화면에서 사라지는 효과
346     
347     // CSS 애니메이션이 끝날 시간(약 300ms)을 벌어준 뒤 DOM에서 완전히 삭제
348     setTimeout(function() {
349         // 그 사이에 다른 토스트가 생겨서 지워진 상태가 아닐 때만 지움
350         if (toastEl.parentNode) {
351             toastEl.remove();
352         }
353     }, 300);
354     
355     toastTimer = null;
356 }, duration);
357}
358