001002003004005006007008009010011012013014015016017018019020021022023024025026027028029030031032033034035036037038039040041042043044045046047048049050051052053054055056057058059060061062063064065066067068069070071072073074075076077078079080081082083084085086087088089090091092093094095096097098099100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287
// (2019.5.27, 차재복, Cha Jae Bok, http://www.ktword.co.kr) // (웹브라우저 뒤로가기,앞으로가기), (다큐먼트 준비시 이벤트 발생) $( function () { // 웹브라우저 뒤로가기,앞으로가기 이벤트 발생시 (본 루틴은, 향후 더욱 개선 필요) $(window).on("popstate", function(e) { var id = e.originalEvent.state['id'], no = e.originalEvent.state['no']; $.ajax ({ type : 'POST', url : './yoyak_contents_ajax.php', data : { 'id' : id, 'win' : 'left' }, success : function(result){ // 사용자 모드 $('#contents').html(result); }, error : function(request, status, error ) { console.log ("code:"+request.status+"\n"+"message:"+request.responseText+"\n"+"error:"+error); } }); }); // 다큐먼트 준비 이벤트 발생시 $(document).ready( function() { // url query string으로부터 id=?&no=? 추출 var urlParams = new URLSearchParams(window.location.search); var id = urlParams.get('id'), no = urlParams.get('no'); if (!no) return; $('.detail_view[data-id='+id+'][data-no='+no+']').toggle(); $('.view[data-id='+id+'][data-no='+no+']').toggleClass('toggleBold'); $.ajax ({ type : 'POST', url : 'yoyak_view_ajax.php', data : { 'no' : no, 'id' : id }, success : function(result){ // console.log(result); $('.detail_view[data-id='+id+'][data-no='+no+']').html(result[0]); // web storage 활용 저장 for (var sub_no=1; sub_no<Object.keys(result).length; sub_no++) { sessionStorage.setItem('no_'+no+'_'+sub_no,result[sub_no]); } }, error : function(request, status, error ) { console.log ("code:"+request.status+"\n"+"message:"+request.responseText+"\n"+"error:"+error); } }); }); }); // 항목목차 보이기/숨기기 및 ajax 호출 $( function () { // 페이지 기반으로, 해당 id에 대한 하부 항목들을 보여줌 // ▷를 누르면, ajax 호출 => yoyak_contents_ajax.php 또는 yoyak_contents_right_ajax.php) $(document).on("click", ".ajax_page", function(event){ // a 링크 디폴트 이벤트 방지 event.preventDefault(); // ▷ 누를때, 잠깐 볼드체 적용됨 $(this).css({'font-weight':'bold','color':'black'}); var id = $(this).data('id') ; // div 좌우 구분 win = $(this).closest('div').data('win'); // 좌/우 화면 구분 if ( win == 'right') { var filename = './yoyak_contents_right_ajax.php', moved_id = $('#contents_right').data('id'), moved_title = $('#contents_right').data('title'); } else { var filename = './yoyak_contents_ajax.php'; // var filename = './yoyak_contents_id_ajax.php'; } $.ajax ({ type : 'POST', // GET/POST 구분, 기본값은 GET url : filename, data : { 'id' : id, 'win' : win }, success : function(result){ // eitor 모드 if ( win == 'right') { // $('#contents_right').html(result); $('#contents_right_down').html(result); // $('#source').text('"'+moved_title+'"('+moved_id+')'); $('.no_move_submit').prop('disabled', true); // 사용자 모드 } else { $('#contents').html(result); /* if ($('#ol_'+id).length==0) { $('#li_'+id).append(result); $('.ajax_page[data-id='+id+']').text('▽'); $('.ajax_page[data-id='+id+']') .removeClass('ajax_page') .addClass('lower_ol_hideshow'); } */ } // history 기록 history.pushState({'id':id},null,'./yoyak.php?id='+id); }, error : function(request, status, error ) { console.log("code:"+request.status+"\n"+"message:"+request.responseText+"\n"+"error:"+error); } }); } ); // 클릭하면, ajax 호출 없이, 조건에 따라 해당 하위 요소를 숨기거나 나타나게 함 $(document).on('click','.lower_ol_hideshow', function(event) { // a 링크 디폴트 이벤트 방지 event.preventDefault(); if ( $(this).text() == '▽' ) { $(this).siblings('ol').hide(); // $(this).children('ol').hide(); $(this).text('▷'); $(this).next('a').css('color',''); } else if ( $(this).text() == '▷' ) { $(this).siblings('ol').show(); $(this).text('▽'); $(this).next('a').css('color','Crimson'); } event.preventDefault(); } ); }); // (jQuery) 항목 View 보기 $( function () { // 해당 항목(.view) 클릭하면, .detail_view div에 분류항목 또는 용어해설 세부내용 나타남 $(document).on("click", ".view", function(event) { // a 링크 디폴트 이벤트 방지 event.preventDefault(); // view 클릭시, toggleClass $(this).toggleClass('toggleBold'); var no = $(this).data('no'), id = $(this).data('id'); if(!no) no = ''; var unique = ( no ? 'no_'+no+'_'+'0' : 'id_'+id+'_'+'0' ); // 해당 항목 일 때, div toggle // (web storage 기저장 여부 확인) if (no) { $('.detail_view[data-id='+id+'][data-no='+no+']').toggle(); if (sessionStorage.getItem(unique)) { // web storage 활용, 직접 추출 및 표시 ( $('.detail_view[data-id='+id+'][data-no='+no+']').html(sessionStorage.getItem(unique)); return; } } else { $('.detail_view[data-id='+id+'][data-no='+no+']').toggle(); if (sessionStorage.getItem(unique)) { // web storage 활용, 직접 추출 및 표시 $('.detail_view[data-id='+id+'][data-no='+no+']').html(sessionStorage.getItem(unique)); return; } } $.ajax ({ type : 'POST', url : 'yoyak_view_ajax.php', data : { 'no' : no, 'id' : id }, success : function(result){ console.log(result); $('.detail_view[data-id='+id+'][data-no='+no+']').html(result[0]); // mathjax let startDisp = result[1].indexOf('[#'), endDisp = result[1].indexOf('#]',startDisp+1), startInline = result[1].indexOf('{#'), endInline = result[1].indexOf('#}',startInline+1); if ( (startDisp > -1 && endDisp > -1) || (startInline > -1 && endInline > -1) ) { let sub_div = 'sub_div_'+id+'_'+no; let math = document.getElementById(sub_div); MathJax.Hub.Queue(["Typeset",MathJax.Hub,math]); } // web storage 저장 for (var sub_no=0 in result ) { if (no) { sessionStorage.setItem('no_'+no+'_'+sub_no,result[sub_no]); } else { sessionStorage.setItem('id_'+id+'_'+sub_no,result[sub_no]); } } // history 기록 history.replaceState({'id':id,'no':no},null,'./yoyak.php?id='+id+'&no='+no); }, error : function(request, status, error ) { console.log ("code:"+request.status+"\n"+"message:"+request.responseText+"\n"+"error:"+error); } }); } ); // 각 sub_name 버튼 클릭하면, 각 구절 세부내용이 그때그때 나타남 $(document).on("click", ".sub_no_click", function(event) { // a 링크 디폴트 이벤트 방지 event.preventDefault(); var id = $(this).data('id'), no = $(this).data('no'), sub_no = $(this).data('sub_no'), unique = ( no ? 'no_'+no+'_'+sub_no : 'id_'+id+'_'+sub_no ), sub_div = 'sub_div_'+id+'_'+no, sub_div_content = sessionStorage.getItem(unique); // 해당 버튼 만 글자 강조 if (no) { $(this).css('font-weight','bold'); } else { $(this).css({'font-weight':'bold','color':'red'}); } $('.sub_no_click[data-id='+id+'][data-no='+no+']') .not('[data-sub_no='+sub_no+']') .css({'font-weight':'normal','color':'black'}); // web storage 활용 추출 및 표시 $('#'+sub_div) .html('<pre>'+sub_div_content+'</pre>'); // mathjax let startDisp = sub_div_content.indexOf('[#'), endDisp = sub_div_content.indexOf('#]',startDisp+1), startInline = sub_div_content.indexOf('{#'), endInline = sub_div_content.indexOf('#}',startInline+1); if ( (startDisp > -1 && endDisp > -1) || (startInline > -1 && endInline > -1) ) { let math = document.getElementById(sub_div); MathJax.Hub.Queue(["Typeset",MathJax.Hub,math]); } } ); }); // strip tags 함수 (출처 : 인터넷, but 불명확) function strip_tags (input, allowed) { allowed = (((allowed || "") + "").toLowerCase().match(/<[a-z][a-z0-9]*>/g) || []).join(''); // making sure the allowed arg is a string containing only tags in lowercase (<a><b><c>) var tags = /<\/?([a-z][a-z0-9]*)\b[^>]*>/gi, commentsAndPhpTags = /<!--[\s\S]*?-->|<\?(?:php)?[\s\S]*?\?>/gi; return input.replace(commentsAndPhpTags, '').replace(tags, function ($0, $1) { return allowed.indexOf('<' + $1.toLowerCase() + '>') > -1 ? $0 : ''; }); }