추천 수 4 댓글 90
Extra Form
자료 소개 원댓글만 리스트를 출력했다가, 대댓글은 ajax로 따로 로드하는 애드온
설치 경로 ./addons/ap_comment_list
테스트 환경 Rhymix 2.0
라이선스 GPL v2
이름 버전 날짜 다운수
ap_comment_list.0.1.1.zip 0.1.1 2022-03-30 12
ap_comment_list.0.1.0.zip 0.1.0 2022-03-28 5
ap_comment_list.0.0.1.zip 0.0.1 2022-03-26 16

- 게시판 문서 로드시에는 원댓글만 로드했다가, 대댓글은 별도의 링크를 통해 ajax로 따로 로드하는 애드온입니다.

- 바로 실사용하기보다는, 충분한 테스트를 거쳐 버그 정보 및 개선 사항을 공유하고 함께 버전업을 한 뒤 실사용하시기를 권합니다.

 

- 이런 방식의 댓글 로딩은 몇 가지 장단점이 있을 것 같습니다.

- 장점 : 체계화된 댓글 출력, 포럼식 소통의 강화, 리소스 절약

- 단점 : 댓글 관련 서드 파티 자료들의 링크 방식을 대대적으로 손볼 필요가 있음(url에 comment_srl 파라미터가 있어야 좋습니다), 검색 엔진의 대댓글 접근 약화(이건 그냥 예상입니다)

 

 

- 애드온의 작동 방식, 적용 방법, 스킨 활용 등에 대한 보다 자세한 사항은 아래의 링크를 참고해주세요.

 

- 미리보기 : https://dev.aporia.blog/board_fKje47/40977

 

- 적용 방법 : https://dev.aporia.blog/board_fKje47/41206

 

 

업데이트 0.1.0 (2022.03.28)

- 코어의 dispBoardCommentPage 액션을 통해 사용 중인 스킨의 comment.html 부분을 직접 불러들임

1) 더 이상 애드온 스킨을 사용하지 않음

2) 0.1.0에서는 애드온 설정을 사용하지 않음

3) 외부 php 파일을 사용하지 않음

: 람보님 덕분에 애드온 구조가 훨씬 깔끔해졌습니다 :D

4) 다른 서드파티 자료들과의 호환성 강화

- 대댓글을 로드할 때 스크롤 이동을 하지 않음

- url에 comment_srl 파라미터만 있고 댓글번호에 해당하는 해시(#)가 없을 경우 자동으로 해시 첨가

- 기타 코드 및 파일 정리

 

* 기존 0.0.1 버전 사용자는 게시판 스킨의 _comment.html의 대댓글 링크에서 onclick 속성을 다음과 같이 바꿔주어야 합니다.

  • onclick="getRecommentList(this, {$comment->comment_srl}); return false;"

 

 

업데이트 0.1.1 (2022.03.30)

- $target_head 변수의 스크립트 전달 구문 수정

- url로 대댓글 파라미터가 넘어왔을 때 head 번호를 가진 요소의 식별 방식 수정

- callback이 전달되지 않은 경우에 대비해서 코드 수정

제작자 윤삼

profile
아무래도 중급 초반 수준의 코딩 오타쿠인 것 같습니다.
  • ?

    "회원 정보 보기"의 "작성 댓글 보기"도 수정을 해야 하네요

    • 관리자설정 > 회원설정 > 디자인 > 스킨 확인 - 회원 기본 스킨(default)

    - /modules/member/skins/default/comment_list.html

    [수정전]
    <tr loop="$comment_list => $no,$comment">
    <td>{$no}</td>
    <td>
    <a href="{getUrl('','document_srl',$comment->document_srl)}#comment_{$comment->comment_srl}" target="_blank">{$comment->getSummary() ?: $lang->msg_no_text_comment}</a>
    </td>
    <td>{$comment->getRegdate("Y-m-d")}</td>
    </tr>

    [수정후]
    <tr loop="$comment_list => $no,$comment">
    <td>{$no}</td>
    <td>
    {@ $target_mid = ModuleModel::getModuleInfo($comment->get('module_srl'))->mid; }
    <a href="{getUrl('', 'mid', $target_mid, 'document_srl',$comment->get('document_srl'), 'comment_srl', $comment->comment_srl)}#comment_{$comment->get('comment_srl')}" target="_blank">{$comment->getSummary() ?: $lang->msg_no_text_comment}</a>
    </td>
    <td>{$comment->getRegdate("Y-m-d")}</td>
    </tr>

  • ? profile
    네ㅎㅎ 댓글 링크가 있는 거의 모든 부분에서 그렇게 해야 할 겁니다.
    제보 감사합니다!!!
  • ? profile
    아, 근데 좀 더 간단한 함수가 있었더라구요ㅜ
    {@ $target_mid = ModuleModel::getMidByModuleSrl($comment->get('module_srl')); }
  • profile
    오오 결국 애드온으로 나왔군요!! 너무 늦게봤습니다 하하하..
    스케치북게시판이 예시라그런지 적용하기 쉽지가않네요..
    꼭 적용하고 싶은데 slow 게시판 스킨의 구조가 많이다른듯합니다 ㅠㅠ 번거로우시겠지만 가능하시다면 구조를 확인한번 부탁드려도 괜찮을지요..
  • profile
    먼저 적용가이드에 1번을 넣고 댓글페이지네이션 부분에서 아래의
    li 태그에있는 a href= 구조를 수정하는데 내용이 살짝다른듯합니다 ㅠㅠ
    적어주신 순서대로 3부분을 모두수정했는데 제대로 작동이 안되구요.. 혹시 어떻게 수정해볼까요?


    {@ // 페이지네이션 }
    <div cond="$oDocument->comment_page_navigation" class="app-board-section-padding tw-border-b tw-border-gray-300">
    <ul class="app-pagination">
    <li>
    <a href="{getUrl('cpage',1)}#comment" class="app-pagination-prev">
    <ion-icon name="chevron-back-outline"></ion-icon>
    </a>
    </li>

    <li loop="$page_no=$oDocument->comment_page_navigation->getNextPage()" class="app-active"|cond="$cpage == $page_no">
    <a href="{getUrl('cpage',$page_no)}#comment">{$page_no}</a>
    </li>

    <li>
    <a href="{getUrl('cpage',$oDocument->comment_page_navigation->last_page)}#comment" class="app-pagination-prev">
    <ion-icon name="chevron-forward-outline"></ion-icon>
    </a>
    </li>
    </ul>
    </div>

    테스트페이지 주소입니다! https://svrforum.com/test/217712
  • profile profile
    - 0.1.1 로 업데이트했는데 일단 애드온을 그것으로 교체해보시구요.

    - 페이지네이션 링크는 다음과 같이 getUrl 안쪽에 'comment_srl', '', 을 넣어주시면 됩니다.

    {@ // 페이지네이션 }
    <div cond="$oDocument->comment_page_navigation" class="app-board-section-padding tw-border-b tw-border-gray-300">
    <ul class="app-pagination">
    <li>
    <a href="{getUrl('comment_srl', '', 'cpage',1)}#comment" class="app-pagination-prev">
    <ion-icon name="chevron-back-outline"></ion-icon>
    </a>
    </li>

    <li loop="$page_no=$oDocument->comment_page_navigation->getNextPage()" class="app-active"|cond="$cpage == $page_no">
    <a href="{getUrl('comment_srl', '', 'cpage',$page_no)}#comment">{$page_no}</a>
    </li>

    <li>
    <a href="{getUrl('comment_srl', '', 'cpage',$oDocument->comment_page_navigation->last_page)}#comment" class="app-pagination-prev">
    <ion-icon name="chevron-forward-outline"></ion-icon>
    </a>
    </li>
    </ul>
    </div>
  • profile profile
    헛 그새 업데이트가 되었군요!
    바로적용해보겠습니다 늦은시간에 감사드립니다!
  • profile profile
    무슨이유에서인지 콘솔로그도 별도로 안뜨고 대댓글을 눌렀을때 창이 밀리는듯(?) 한데 보이지가 않습니다..ㅠㅠ
    https://svrforum.com/test/217712
  • profile profile

    쪽지로 말씀드리긴 했는데 기록을 위해 댓글로도 남깁니다.

    slow 게시판 스킨은 스킨 폴더에 바로 comment.html이 있는 구조가 아닙니다.
    스킨으로서 체계적인 파일 관리를 위해 하위폴더들을 만든 것 같은데,
    그래서 스킨의 최상위 지점(./modules/board/skins/slow)에서 comment.html을 누락한 것 같아요.
    근데 그 위치에 그 파일이 있어야 이 애드온이 의존하는 dispBoardCommentPage라는 액션 실행이 가능해집니다.

    다만, 꼼수를 쓴다면 스킨의 최상위 위치(./modules/board/skins/slow)에 comment.html을 더미로 하나 만들어놓고, 그 안에 <include target="components/comment/comment.html" /> 이라고 적어보세요.
    제 예상이 맞다면 스킨에서 대댓글 링크를 누르면 바로 이 최상위 위치의 ./modules/board/skins/slow/comment.html을 불러들이게 될 겁니다.
    그러면 실제의 댓글 코드가 담긴 ./modules/board/skins/slow/components/comment/comment.html 으로 자동 연결되겠죠.

    그렇게 해서 성공을 한다면 다행인데,
    만약 그렇게 해도 목록 로딩이 안 된다면 다른 방법은 없을 것 같습니다.

    덧. 만약 목록 로딩에 성공한다면 댓글 및 대댓글 삭제 테스트도 부탁드립니다. 댓글 삭제가 별도의 js 함수와 연동되는 것으로 보이는데 호환성이 어떨지 궁금합니다 :)

  • profile profile

    말씀해주신대로 진행하였습니다.
    일단 대댓글을 눌렀을때 댓글이 잘보입니다!

    다만 문제점이 몇가지있는데
    1. 댓글/대댓글 작성시 글 최하단으로 스크롤 이동 및 대댓글창 접힘
    2. 대댓글의 수정/삭제/신고를 위한 ```클릭시 무반응(삭제 테스트를 못합니다 ㅠㅠ)

    정도있는것같습니다.
    https://svrforum.com/test/217712

    바쁘신와중에도 하나하나확인해주시고 정말감사드립니다ㅠㅠ

  • profile profile
    1-1.
    혹시 댓글 작성시 새로고침 없이 새 댓글이 로드되는 방식인가요?
    스크롤이 최하단으로 이동하는 건 이해가 잘 안 되긴 하네요. 새 댓글이 페이지에 존재할 때 스크롤 이동 명령이 있긴 한데 이게 작동을 한다면 새 댓글의 top으로 가야 하거든요. 없으면 스크롤 이동은 없구요.

    1-2.
    대댓글창 접힘은 혹시 모르니 대댓글 작성 직후 개발자 도구 콘솔창에서 current_url 라고 입력해보시겠어요? 댓글 작성후 url 세팅이 어떻게 되는지 확인이 필요할 것 같습니다. 제 경우에는 url에 comment_srl이 잘 찍히는데, 그렇지 않은 경우에는 대댓글창이 열리지 않을 수 있습니다.

    2. 이거는 해당 클릭 이벤트가 담겨 있는 js에서 이벤트를 수정해주든지, 아니면 애드온 js에 클릭 이벤트를 다시 넣어주든지 하면 될 거예요. 스킨에서 클릭 이벤트가 들어 있는 js를 찾아보시고, 말씀해주시면 한번 살펴보겠습니다~
  • profile profile

    답변감사드립니다.!

    1. 넵 기본 댓글작성시 새로고침없이 새 댓글이 로드됩니다.
    일반적인 상황에서는 댓글을 달아도 ajax로 댓글작성만 되고 화면 이동은 없긴합니다 ㅠㅠ

    +아마 2번상황에서 댓글작성후에 대댓글창이 자동으로 접힘으로써 이동이 되는건 아닐까.. 의심해볼수도있을거같습니다

    2 말씀해주신 콘솔창에서 current_url 명령시 아래처럼 나옵니다!
    'https://svrforum.com/?document_srl=217712&mid=test&act=dispBoardContent'

    2. components/comment/comment-vote/comment-vote.js 이파일인거같긴합니다!

  • profile profile
    1-1. 지금은 새 댓글이 로드되기는 한데 스크롤이 이동한다는 말씀이시죠?
    그렇다면 애드온의 default.js의 jQuery(document).ready(function($) { 로 시작하는 부분 전체를 지워보고 한번 테스트해주시겠어요?

    1-2. 역시 url에 comment_srl이 들어가 있지 않네요. 이게 코어에서는 새로고침했을 때 comment_srl이 들어가게 되어 있거든요. 그래야 뎃글 페이지를 자동 탐색할 수 있어서요. 현재 새로고침 없는 댓글 기능은 slow 게시판 스킨에서 자체 제공되는 것인가요? 아니면 rx_ajax 클래스명 삽입처럼 코어의 기능을 이용해서 자체적으로 기능을 구현하신 건가요?

    2. 그 파일은 댓글 추천이나 추천 취소에 해당하더라구요. app-dropdown-menu라는 클래스에 active 클래스를 토글(추가 및 삭제)시켜주는 js는 따로 있는 것 같은데, 저도 위치를 못 찾겠더라구요;;;
  • profile profile

    1-1. 댓글 작성시 대댓글창이 접히면서 스크롤이 최 하단으로 이동합니다.
    말씀해주신 jQuery쪽을 지워봤는데도 동일하네요 ㅠㅠ

    1-2. 이건 기본스킨에는없었는데 별도로 의뢰해서 구현한거라서 정확히어떤방식인지는 모르겠습니다 ㅠㅠ

    2. 헛.. 그렇군요 한번더 확인해보겠습니다.

    ++ 확인해보니 comment-item-actions.html 이 맞는거같습니다!

  • profile profile
    default.js 파일의 14행을
    $(obj).attr('onclick', '$(this).closest(\'[id^=comment_]\').siblings(".app-board-comment-list").toggle(); return false;');
    이것으로 바꿔보시겠어요?
    원래 있던 14행은 주석 처리하구요.
  • profile profile
    네, app-dropdown-menu는 comment-item-actions.html에 있기는 한데 이 부분에 스크립트 동작을 부여하는 js 위치를 찾아야 해요;;;;
  • profile profile
    변경한 뒤에 currnt url 주소입니다. 기존처럼.. 제대로 못찾는거겠죠?? ㅠㅠ
    'https://svrforum.com/?document_srl=217712&mid=test&act=dispBoardContent'
  • profile profile
    흡,, 그렇군요.. js파일은 vote.js 뿐인데 여기서
    첫 appCommentAjaxCall(targetSrl, action, callback) 이건 아닌거겠죠..??ㅠㅠ
    너무어렵네요..
  • profile profile
    네, 아마 새로고침 없는 댓글을 구현할 때만 해도 코어에서 comment_srl을 찾아주는 기능이 없었거나 잘 알려지지 않아서 반영이 안 됐던 모양이에요;;;
  • profile profile
    어쩌면 slow 게시판 스킨이 테마로 패키징되어 있다면 레이아웃 등에서 작동되는 js일 수도 있겠어요.
  • profile profile

    헛.. 그렇군요...ㅠㅠㅠㅠ 너무 아쉽지만.. 제능력밖의일이군요...

    이것만 해결되면 어찌어찌 실사용은 될거같은데.. 장고의 고민을해봐야겠습니다 하하...

  • profile profile
    근데 혹시 댓글 작성 후에 대댓글 작성 창이 열리거나 하지는 않던가요?
  • profile profile
    일반 댓글 작성시에는 글 최하단의 목록창으로 이동하고
    대댓글 작성하면 대댓글창이 닫히고 그 댓글만 보입니다. 대댓글 숫자는 카운팅 됩니다.

    현재는 비회원도 해당게시판에 작성이되서 한번 테스트해보셔도 될듯합니다!
    https://svrforum.com/test/217712
  • profile profile
    왠지 새로고침 없는 댓글 작성의 콜백 함수에 애드온의 getRecommentList 함수를 실행해주면 될 것 같은데요.
    여기서도 댓글 작성 함수가 어느 js에 있는지를 찾는 게 관건일 것 같습니다...
  • profile profile
    혹시 이런 함수일까요??
    function setTextareaReplaceComment() {
    var str = document.getElementById("temp-{$oDocument->document_srl}").value;
    str = "<p>" + str.replace(/(?:\r\n|\r|\n)/g, "</p>\r\n<p>") + "</p>";
    str = str.replaceAll("<p></p>", "<p>&nbsp;</p>");
    document.getElementById("editor-{$oDocument->document_srl}").value = str;
    };

    function refreshComments(data){
    var comment_srl = data.comment_srl;
    var selector = '.app-card.app-board-comment.app-board-section';
    var refresh_url = current_url;
    jQuery.get(refresh_url, function(response) {
    var old_comment_area = jQuery(selector);
    var new_comment_area = jQuery(response).find(selector);
    old_comment_area.empty().append(new_comment_area.contents());

    jQuery('#app-board-comment-list').find('.app-dropdown-toggle').on('click', function() {
    jQuery(this).closest('.app-dropdown').toggleClass('active')
    })

    const appDropdown = jQuery('#app-board-comment-list').find('.app-dropdown-toggle')

    jQuery(document).mouseup(e => {
    if (!appDropdown.is(e.target) && appDropdown.has(e.target).length === 0) {
    appDropdown.removeClass('active')
    }
    })
    });
    }
  • profile profile

    네, 거기인 것 같습니다.

    위의 소스들 중에서 다음 두 군데를 아래와 같이 바꿔보시겠어요?

     

    var refresh_url = current_url;

    • var refresh_url = current_url.setQuery('comment_srl', comment_srl);


    jQuery('#app-board-comment-list').find('.app-dropdown-toggle').on('click', function() {
    jQuery(this).closest('.app-dropdown').toggleClass('active')
    })

    • jQuery(document).on('click', '#app-board-comment-list .app-dropdown-toggle', function() {
      jQuery(this).closest('.app-dropdown').toggleClass('active')
      })
  • profile profile
    근데 이 소스가 어느 파일, 어느 위치에 있었어요? 역시 레이아웃인가요?
  • profile profile
    오오 일단은 스크롤이 하단으로 내려가는 현상은 사라졌습니다.

    다만 기존처럼 대댓글 작성시 대댓글이 접히면서 부모댓글이 보이는 현상 + ```이 안눌리는건 동일하네요 ㅠㅠ
  • profile profile
    commant-write.html에 있었습니다.
    혹시 파일이 누락된게있는지 봐봐야겠네요 ㄷㄷ
  • profile profile

    jQuery('#app-board-comment-list').find('.app-dropdown-toggle').on('click', function() {
    jQuery(this).closest('.app-dropdown').toggleClass('active')
    })

    이거를 function 바깥으로 빼보시거나,
    아니면 삭제하시고 수정 제안 드렸던

    jQuery(document).on('click', '#app-board-comment-list .app-dropdown-toggle', function() {
    jQuery(this).closest('.app-dropdown').toggleClass('active')
    })
    이거를 function 바깥에 놓아보시겠어요?

    좌충우돌, 시행착오 겪으면서 작업하는 타입인데, 이렇게밖에 도움을 못드리네요... 그마저도 과연 도움이 될지;;;

     

    덧. 그리고

    jQuery(document).on('click', '#app-board-comment-list .app-dropdown-toggle', function() {
    jQuery(this).closest('.app-dropdown').toggleClass('active')
    })

    사실 이거는 이 파일이 아니라 다른 파일에 있어야 할 것 같은데, 파일 구조가 복잡하다보니 어지럽네요 @[email protected]

  • profile profile

    혹시 그래도 팝업 메뉴가 뜨지 않는다면...
    업데이트가 계속 있을 것 같고 전체 구조가 누더기가 될 것 같아 권하진 않지만,

    애드온의 default.js의 jQuery(document).ready(function($) { ~~~~ });
    안쪽에

    $(document).on('click', '#app-board-comment-list .app-dropdown-toggle', function() {
    $(this).closest('.app-dropdown').toggleClass('active');
    });
    를 넣어보시는 것도 방법일 것 같습니다.

     

    그 이후로도 안 된다면, 그리고 이 기능이 꼭 필요하시다면 나머지는 제작 의뢰를 해보시는 게 어떨까 싶어요;;;

  • profile profile

    별말씀을요 ㅠㅠ 도와주시는것도 감사할 따름입니다..

     

    일단 말씀해주신부분을 모두 수정해봤는데 동일증상입니다 ㅠ

    (대댓글작성시 주소를 못찾는현상, 드롭다운버튼 안되는현상 )

     

    첫번째

    20220330_184108.png

     

    두번째, 애드온의 default.js 파일

     

    20220330_184053.png

  • profile profile
    사이트 들어가서 ... 을 누르면 app-dropdown 클래스가 깜빡거리는 걸로 봐선 분명 접근이 되기는 하는 것 같은데요..
    혹시 이벤트가 중복되거나 해서 그런 걸지도 모르겠네요;;;
  • profile profile
    오.. 뭔가 중복현상이 있긴한거같습니다.

    이제 댓글 작성시에는 작동을 안하는데 대댓글작성시에는 작동을 하네요..ㅎㅎ

    제일중요한 대댓글 작성시 접힘현상부분은 새로고침없는 댓글쪽에서 문제를 수정해야하는걸까요??
  • profile profile
    중복되는 거 꼭 잘 찾으시구요ㅜㅜ

    대댓글 접힘 현상은 refreshComments 함수가 새로고침 이후의 콜백이거든요?
    애드온의 default.js의 일부를 여기 함수에 적용해보면 어떨까 싶긴 해요.
  • profile profile

    0.png

    개발자도구로 보니까 위에서처럼 애드온이 끼워넣는 스크립트 변수가 중복되어 있는 걸 볼 수 있었습니다.

    그래서 이벤트가 중복돼서 열었다 닫혔다 이중 동작이 되는 것 같은데요.

    어떤 이유인지 체크해보시는 게 중요할 것 같아요.

    (혹시 페이지 로딩 때 getComments 함수가 두 번 실행되는 것은 아닌지...)

     

    그리고 그와는 별도로... (사실 애드온 중복 문제를 해결한다면 아래는 불필요할 수도 있는데요...)

    어제 이야기됐던 refreshComments 함수에 애드온의 스크립트 일부를 이식시켜봤습니다.

    댓글 및 대댓글 작성후 해당 위치로 스크롤 이동하는 스크립트예요.

    여기서 target_haed라는 스크립트 변수를 잘 받아와야 하는데, 새로고침 프로세스 때문에 잘 안 될 것 같기도 하고...

    댓글/대댓글 작성 후 console.log(target_head);를 확인해보셔도 좋겠구요.

    혹시 안된다면 animate 메소드가 두 군데 있는데, 거기에 있는 숫자 0을 100 단위로 올려가면서도 테스트해보시구요.

    암튼 전반적으로 한번 테스트해봐주세요.

     

    function refreshComments(data){
        var comment_srl = data.comment_srl;
        var selector = '.app-card.app-board-comment.app-board-section';
        var refresh_url = current_url.setQuery('comment_srl', comment_srl);;
        jQuery.get(refresh_url, function(response) {
            var old_comment_area = jQuery(selector);
            var new_comment_area = jQuery(response).find(selector);
            old_comment_area.empty().append(new_comment_area.contents());
    
            if ( !location.hash ) {
                history.replaceState(null, '', current_url + '#comment_' + comment_srl);
            }
    
            console.log(target_haed);
            if ( target_head ) {
                var obj = $('#comment_' + target_head).find('[onclick^="getRecommentList"]')[0];
                getRecommentList(obj, target_head, function() {
                    $('html, body').animate({
                        scrollTop: $('#comment_' + comment_srl).offset().top
                    }, 0);
                });
            } else {
                $('html, body').animate({
                    scrollTop: $('#comment_' + comment_srl).offset().top
                }, 0);
            }
    
            jQuery('#app-board-comment-list').find('.app-dropdown-toggle').on('click', function() {
                jQuery(this).closest('.app-dropdown').toggleClass('active');
            });
    
            const appDropdown = jQuery('#app-board-comment-list').find('.app-dropdown-toggle');
    
            jQuery(document).mouseup(e => {
                if (!appDropdown.is(e.target) && appDropdown.has(e.target).length === 0) {
                    appDropdown.removeClass('active')
                }
            });
        });
    }

     

  • profile profile
    헉 감사합니다 이렇게 코드까지 직접..

    말씀해주신 부분을 업데이트해봤는데 중복되는 부분때문인지 제대로 작동이 안되는듯합니다 ㅎㅎ
    시간 여유있을때 각잡고 봐봐야겠네요
  • profile profile
    근데 그것마저도 실패할 수 있어서...ㅜㅜ
  • ?

    이제 위젯에서 댓글이 있는 mid로 찾아가는 것만 알아내면 될 것 같은데 

     

    {getUrl('', 'mid', $mid, 'document_srl',$val->get('document_srl'), 'comment_srl', $val->comment_srl)}#comment_{$val->get('comment_srl')}

    $mid 값이 위젯이 삽입된 현재 mid로 나오는 것을 해당 문서의 타겟 mid로 나오게 하면 해결 되는데 그게 참 어렵네요 

     

    {getUrl('', 'mid', 타겟mid, 'document_srl',$val->get('document_srl'), 'comment_srl', $val->comment_srl)}#comment_{$val->get('comment_srl')}
    이렁게 타겟mid를 직접 적어보면 정상적으로 대댓글로 찾아가면서 열리는데 타켓mid로 가는 코드를 모르겠네요ㅠㅠ

    혼자 낑낑 살펴보다 덕두리 남깁니다~~

  • ? profile
    어떤 변수를 루프 돌려서 $val로부터 문서번호나 댓글번호를 확인하는 것 같은데요.
    이 $val에 담긴 정보를 print_r 등으로 출력해보면 거기에 타겟 mid도 담겨 있지 않을까요?
    보통의 위젯 제작자라면 그 정도 안배는 해놨을 것 같아요.
  • ? profile

    코어의 content 위젯에는 댓글 담을 때 mid도 같이 받아오네요.
    https://github.com/rhymix/rhymix/blob/173f26dc0218c228e4ed0b2dd1cc092eb6bc6cf7/widgets/content/content.class.php#L229
    여기서는 content_items를 돌린 반복문에서 $item->mid 또는 $item->get('mid')라고 하면 해당 댓글의 소속 mid값이 나올 텐데요.
    이런 식으로 응용해보시면 어떨까 싶습니다. 어떤 위젯인지는 모르지만 $val->get('mid')라고 하면 뭐가 나올지도 모르죠ㅎㅎ

  • profile ?
    content 위젯에서는 [mid] => free 가 나오는데

    아주 오래된 구식 위젯이라 module_srl 는 나오는데 mid는 안 나오네요
    [comment_srl] => 553942
    [module_srl] => 150752
    [document_srl] => 553872
    [parent_srl] => 553913

    $content_item->add('mid', $args->mid_lists[$attribute->module_srl]);
    mid를 변환을 시켜야 되는데 이것을 적용하기가 쉽지 않네요.

    {getUrl('', 'mid', $val->get('module_srl'), 'document_srl',$val->get('document_srl'), 'comment_srl', $val->comment_srl)}#comment_{$val->get('comment_srl')}
    이 코드를 적용하면 150752 모듈번호는 나오는데 모듈명이 나오질 않네요
    https://도메인/150752/553969?comment_srl=554029#comment_554029

    애드온 적용하기가 서드파티 자료들에서 제게는 너무 어렵네뇨
    무리하고 죄송한 부탁 인줄은 알지만 님께서 간단한 댓글 위젯 샘플로 하나 만들어 주실 수는 없는지요
    이제와 포기 할려니 이때까지 해본 일들이 너무 아쉽네요ㅠㅠ
  • ? profile

    {@
    $target_mid = ModuleModel::getModuleInfo($val->get('module_srl'))->mid;
    }
    반복문 내에서 이렇게 선언을 해주면 타겟 mid를 잡을 수도 있을 것 같아요.
    혹시 안 된다면 ModuleModel::getModuleInfo($val->get('module_srl'))을 print_r로 한번 찍어서 확인해보시구요.

     

    근데 이게 궁극적으로는 mid값이 잘못돼서 코어가 url을 리다이렉트해주는 경우까지 애드온에서 고려를 하면 좋겠다는 생각은 드네요ㅎㅎ

  • profile ?
    이야!! 잘 작동됩니다.
    한방에 찾아가네요.
    이제 사용에 전혀 지장이 없습니다.
    역시 윤삼님입니다👍
    감사합니다.💕

    적용한 코드 남깁니다.
    <[email protected] foreach($comment_list as $key => $val)-->
    {@ $target_mid = ModuleModel::getModuleInfo($val->get('module_srl'))->mid;}
    <div class="mhcomment">
    <a href="{getUrl('', 'mid', $target_mid, 'document_srl',$val->get('document_srl'), 'comment_srl', $val->comment_srl)}#comment_{$val->get('comment_srl')}" title="">{$val->getSummary($wi->com_cut_size)}</a>
    </div>
    <[email protected]>
  • ?

    작동이 안되는 것들

    1. 후하니님의 스티커모듈이 대댓글에서 이미지가 나오질 않고 문자로만 출력

    2. 구름이님께서 만들어주신 닉네임의 첫글자를 프로필이미지쪽에 텍스트로 적용시 대댓글 안 열림- 지금은 사라진 프로그램

    3. 대댓글의 첨부파일들이 히든이 되질 않음

    4. 대댓글의 주소 복사후 직접 링크시 댓글로 이동하지 않음

    5. "리스트/웹진 글제목 아래에 댓글을 함께 출력"하는 기능을 제가 수정해 사용중인데 문제를 야기합니다.

     

    라이믹스나 스케치북 원본의 프로그램들이 아닌 서드 파티 자료들과 편집 수정한 곳에서 문제를 일으키는 부분들이라

    딱히 말씀 드리기는 애매합니다만 제가 게시판에 적용해서 사용하는 기능들이라 글 한번 남겨 븁니다.

    다른 건 몰라도 스티커모듈은 작동되었으면 하는 바람입니다.

     

    아무쪼록 건강 잘 챙기세요...   

     

     

  • ? profile

    ajax로 내용을 불러오다보니 다른 자료들과 호환성이 많이 깨질 겁니다.
    코어 개발자분들 조언대로 모듈로 제작하는 게 나을 것 같다는 생각이 드네요;;

    2번은 어떤 자료인지도 모르겠고 어떤 문제인지 전혀 모르겠어요ㅜ 충돌이 있는 모양인데...

    3번은 직접 확인을 해봐야겠습니다. 지금 모바일 상태거든요ㅜ

    4번은 대댓글 주소 형식이 어떻게 된 건지 궁금합니다.
    comment_srl이 파라미터로 붙어야 하는데, 해시로만 지정돼 있다면 페이지 새로고침 때 대댓글은 로드돼 있지 않은 상태여서 찾아가기가 불가능하거든요.

    5번도 무슨 이야기인지 모르겠어요ㅜ 무슨 문제가 있다는 말씀이신지 이해가 어렵네요;;; 일단 여기 애드온에서는 getComments 함수를 원댓글 리스트로 대체하고, 대댓글을 추가로 불러들이는 구조이니 참고해보시면 좋을 것 같습니다~

  • ? profile
    0.1.0으로 올렸습니다.
    - 구조를 좀 바꿔서 기존의 몇몇 파일들을 삭제하고 코드도 정리했습니다.
    - 게시판 스킨에 대댓글 링크의 onclick 속성을 onclick="getRecommentList(this, {$comment->comment_srl}); return false;" 으로 바꿔주시구요.
    - 서드 파티 호환 문제 체크해주시면 감사하겠습니다~
  • profile ?

    너무 애 써시는 것 같아서 글 쓰기가 급 나네요... 천천히 쉬어가며 하세요.
    잘려고 누워서 스마트폰으로 들어왔다가 업 공지 보고 다시 테스트 하고 글 남깁니다.

     

    1. 스티커모듈 잘 작동합니다. - 이것만 되면 전 행복
    2. 프로필이미지쪽도 작동은 되는데 이상하게 선택 옵션이 작동을 안합니다.
    예를 들면 빨간색 부분 옵션을 주면 작동을 하지 않고 삭제시 잘 작동합니다.

    <block cond="$mi->pname == 'Y'">
        {@
        $nickBgPath = './modules/board/skins/sketchbook5/nick_bg_color.php';
        include_once($nickBgPath);
        $oNickBgUtil = new nickBgUtil();
        }
    </block>

    <span cond="!$comment->getProfileImage() && $mi->pname == 'Y'" class="profile img no_img " style="background:url('./modules/board/skins/sketchbook5/img/{$oNickBgUtil->getNickBgColor($comment->getNickName())}') 2px 2px no-repeat; width:50px; height:50px; font-size:12px; color:#fff; text-shadow:1px 1px 0 #444,1px 1px 0 #222; font-weight:bold;">{$second_nick_str}</span>

     

    3번, 4번  - 이 부분은 여전히 안됨

    화면 캡처 2022-03-28 014151.jpg

    5번은 패스~ 제가 사용중인 변형된 게시판리스트입니다. 근데 대댓글을 보고 아래 리스트를 보면 댓글들이 동일하게 출력됩니다.

    화면 캡처 2022-03-28 014544.jpg

     

    하나더 __setting.html 파일에 $lang->comment_on = '님에게 달린 댓글'; 주고

    <p style="margin-bottom:10px"><i class="fa fa-eye" aria-hidden="true"></i> <span style="color:red; font-weight: bold;">{$comment_parent->getNickName()}</span> {$lang->comment_on}</p>

    에서 "님에게 달린 댓글" 이 출력되지 않고 "comment_on" 이라고 출력됩니다.

     

    테스트 페이지

  • ? profile

    2. 일단 _comment.html 맨 위에
    <include target="__setting.html" cond="$comment_head" />
    이라고 선언해주세요. 대댓글이 comment.html만 불러오는 것이기 때문에 __settings.html 등 스킨에서 그 전에 선언된 변수들은 날아가게 되거든요. 아마 $mi에 아무 정보도 담겨있지 않아서 그런 것 같습니다.

    3. 대댓글의 이미지 첨부 파일이 숨김 처리되지 않는 것도 스킨의 $mi를 받지 못해서 생긴 문제 같아요.

    4. 앞으로 위젯 스킨을 비롯해 대댓글로 링크를 거는 경우에는 주소 내에 반드시 &comment_srl='댓글번호'가 있어야 합니다.

    1) 그래야 애드온에서 이 주소에 원댓글이 따로 있는지 먼저 탐색하고

    2) 원댓글이 있는 댓글 페이지를 찾아간 뒤

    3) 원댓글에 달린 대댓글 목록을 자동으로 열어서

    4) 최종적으로 대댓글로 스크롤 이동까지 하게 되거든요.

    지금 보면 링크 복사되는 주소가 https://moonhouse.co.kr/qa/544583#comment_544623 이런 식으로 되는데요. 여기에 comment_srl 파라미터가 있어야 하는 거죠.

    ... 근데 그나저나 어젯밤에는 이 대댓글 찾아가기 기능이 잘 됐는데, 지금 다시 해보니 대댓글 목록 자동 열기가 안 되네요;;;; 이 부분은 다시 좀 살펴봐야겠습니다ㅜ

    -> 0.1.0 버전 ap_comment_list.addon.php 163행에 자바스크립트로 $target_head를 넘겨주는 부분이 있는데요. 스크립트 태그 전후의 홑따옴표를 겹따옴표로 바꿔주시면, 대댓글 목록 자동 열기가 가능해질 겁니다.

    암튼 댓글 링크 주소 체계를 그렇게 고쳐주셔야 해요. 지금의 알림센터의 댓글 링크에 comment_srl 파라미터가 있는 것처럼요.

    - 댓글 링크 구성 방식 참조 : https://dev.aporia.blog/index.php?mid=board_fKje43&document_srl=11744&comment_srl=11837#comment_11837


    5. 이건 저도 전혀 예상을 못했던 기능이긴 하네요;;; 현재 애드온은 document 모듈에서 getComments 메소드를 실행할 때 애드온이 끼어들어서 이걸 원댓글 리스트나 대댓글 리스트로 바꿔주는데요. 이 기능 때문에 하단 목록에서 댓글 리스트를 수집할 때도 애드온이 끼어드는 것 같습니다. 이건 정말 희귀한 케이스여서 고민을 좀 해봐야겠습니다.

    6. 이것 역시 2번과 관계된 문제로 보입니다. 대댓글을 로드할 때 __settings.html에서 선언된 변수를 comment.html에서는 참조를 할 수가 없거든요.

  • profile ?

    <include target="__setting.html" cond="$comment_head" /> 넣어 주니 작동 잘 됩니다.
    감사합니다.^.^
    근데 "대댓글의 첨부파일들이 히든이 되질 않음"은 여전히 안됨
    5번은 저만의 문제이니 그만 패스 하세요.

    대댓글 주소에 아래의 코드를 어떻게 바꾸어 주어야 하죠?
    {$oDocument->getPermanentUrl()}#comment_{$comment->comment_srl}

  • ? profile

    {getUrl('', 'mid', $mid, 'document_srl', $comment->document_srl, 'comment_srl', $comment->comment_srl)}#comment_{$comment->comment_srl}
    이런 식으로요.

    그리고 바로 윗 댓글 4번 부분 수정했는데, 혹시 못보셨을까봐 다시 남깁니다.
    0.1.0 버전 ap_comment_list.addon.php 163행에 자바스크립트로 $target_head를 넘겨주는 부분이 있는데요. 스크립트 태그 전후의 홑따옴표를 겹따옴표로 바꿔주시면, 주소에 대댓글의 파라미터가 넘어왔을 때 대댓글 목록 자동 열기가 가능해질 겁니다 :)

  • ? profile

    첨부파일 숨김 기능은 다시 찾아봤는데요.

    혹시 이 기능이 댓글단에서는 원래 적용이 안 되는 거 아니었나요?

    제가 가진 스케치북 스킨에서는 해당 부분을 찾아볼 수가 없었어요.

  • ? profile
    5번은 패스하려고 했는데ㅜ 딱 한 번만 봐주시겠어요?
    ap_comment_list.addon.php 파일 165행 다음줄에
    unset($oDocument);
    를 넣어봐주시고 말씀 좀 부탁드리겠습니다.
  • profile ?

    예전과 같습니다.
    이 부분은 본문에서 목록 출력 하지 않으면 됩니다. 신경 쓰지 마세요.^.^

    참고로 코드 남겨 봅니다.

    <td cond="$grant->manager" class="check m_no"><input type="checkbox" name="cart" value="{$document->document_srl}" class="iCheck" title="Check This Article" onclick="doAddDocumentCart(this)" checked="checked"|cond="$document->isCarted()" /></td>
    
    <!-- 코멘트 리스트 시작 -->
    <[email protected]($mi->list_replyContent!='')-->
        <[email protected](!($oDocument->isExists() && $grant->view))-->
            {@$comments_list = $document->getComments();}
            <[email protected](!$mi->comment_order == '')-->{@$comments_list = array_reverse($comments_list );}<[email protected]>
            {@$i = 0}
            <[email protected]($document->getCommentCount())-->
                <[email protected]($comments_list as $key => $val)-->
                    <include target="list_comment.html" />
                <[email protected]>
            <[email protected]>
        <[email protected]>
    <[email protected]>
    <!-- 코멘트 리스트 끝 -->
    </tr>
    
    <tr class="replylist">
    {@$i++}
    <td scope="col" cond="$mi->display_number!='N'" class="num"> </td>
    <td scope="col" cond="$timeline_info && $mi->timeline_bview=='Y'"> </td>
    <td scope="col" cond="!$timeline_info && $module_info->include_modules"> </td>
    <td scope="col" cond="!$mi->show_cate && $mi->use_category=='Y'" class="m_no"> </td>
    
    <td class="replyContent" >
    <div <[email protected]($val->depth < 11 && $mi->comment_order == '')-->style="margin-left:{($val->depth)*1.3}em"<[email protected]> >
    <div class="replyIndent">
    <a href="{getUrl('document_srl',$document->document_srl, 'comment_srl', $val->comment_srl)}#comment_{$val->comment_srl}" class="pr_tooltip" pr_color="dark" pr_position="b_right"title="{cut_str(strip_tags($val->content),0,'...')}">
    <[email protected](!$mi->comment_cut_size) -->
    {cut_str(strip_tags($val->content),60,'...')}
    <[email protected]>
    {cut_str(strip_tags($val->content),$mi->comment_cut_size,'...')}
    <[email protected]>
    </a>
    </div>
    </div>
    </td>
    <td cond="$mi->display_author!='N'" class="author">{($val->nick_name)}</td>
    
    <td scope="col" cond="$val->type=='nick_name' && $val->idx==-1"> </td>
    <td scope="col" cond="$val->type=='user_id' && $val->idx==-1"> </td>
    <td scope="col" cond="$val->type=='user_name' && $val->idx==-1"> </td>
    <td scope="col" cond="$val->type=='regdate' && $val->idx==-1"> </td>
    <td scope="col" cond="$val->type=='last_update' && $val->idx==-1" class="m_no"> </td>
    <td scope="col" cond="$val->type=='last_post' && $val->idx==-1" class="m_no"> </td>
    <td scope="col" cond="$val->type=='readed_count' && $val->idx==-1" class="m_no"> </td>
    <td scope="col" cond="$val->type=='voted_count' && $val->idx==-1" class="m_no"> </td>
    <td scope="col" cond="$val->idx!=-1" class="m_no"|cond="$val->eid!='link_url'"> </td>
    <td scope="col" cond="$grant->manager" class="m_no"> </td>
    </tr>

     

  • profile ?

    첨부파일 숨김 기능이 원본에는 없는 기능이네요.

    <!--// 첨부파일 -->
    <block cond="$comment->hasUploadedFiles()">
    <a class="tg_btn2" href="#files_{$comment->comment_srl}"><b class="ui-icon ui-icon-disk">Files</b>{$lang->uploaded_file} <small>({$comment->get('uploaded_count')})</small></a>
    <div id="files_{$comment->comment_srl}" class="cmt_files tg_cnt2">
        <button type="button" class="tg_blur2"></button><button type="button" class="tg_close2" title="{$lang->cmd_close}"><b class="ui-icon ui-icon-closethick">X</b></button>
        <ul class="wrp">
            <li loop="$comment->getUploadedFiles()=>$key,$file"><em>&bull;</em> <a class="bubble" href="{getUrl('')}{$file->download_url}" title="[File Size:{FileHandler::filesize($file->file_size)}/Download:{number_format($file->download_count)}]" onClick="alert('{$lang->msg_not_permitted} {$mi->down_permitted_msg}'); return false"|cond="!$logged_info->member_srl && $mid==$mi->down_mid">{$file->source_filename}</a></li>
        </ul>
        <button type="button" class="tg_blur2"></button>
    </div>
    </block>

     

  • profile ?

    댓글 주소가 아래와 같이 적용되면 대댓글이 펼쳐지면서 작동되는 것은 확인했습니다.
    https://moonhouse.co.kr/free/553969?comment_srl=554029#comment_554029

     

    그런데 댓글 주소 복사 코드에 적용해 보기가 어렵네요.

    님이 위에 일러 주신 코드대로 적용해 보니 도메인도 적용되지 않고 위의 주소 같이 나오지도 않습니다.

     

    {$oDocument->getPermanentUrl('mid', $mid, 'document_srl', $comment->document_srl, 'comment_srl', $comment->comment_srl)}#comment_{$comment->comment_srl}
    이렇게 적용하면 주소는 나오는데 
    https://moonhouse.co.kr/free/553969#comment_554029 이렇게 주소가 복사됩니다.

    참고로 이곳 의 대댓글들 클릭하면 잘 작동합니다.

  • ? profile

    - 아까 봤을 때 댓글 주소 복사는 href 속성이 아니라 data-clipboard-text인가에서 클립보드로 저장되는 것 같던데요.
    이 속성값을 수정하시거나 data 속성을 뿌려주는 관련 애드온을 수정하셔야 할 것 같아요.

     

    - 하단 목록의 getComments 문제는 애드온의 영향이 분명하므로 회피할 방법을 연구해보도록 하겠습니다. 성공할지 확신은 없지만, 공유하신 소스를 저도 적용해보고 실험해볼게요 :)

     

    - 첨부파일 쪽은 거기에 걸려 있는 $mi나 $lang 객체의 키값이 __settings.html 이 아니라 다른 파일에서 선언된 것일 수도 있으니 그 부분도 확인해보시면 좋을 것 같습니다.

  • profile ?
    •data-clipboard-text 의 값을 클립보드로 저장하는 것 맞습니다.
    이래 저래 해 봐도 잘 안되네요... 실력의 한계인가 봅니다. 코알못이라ㅠㅠ

    <!--댓글 주소 복사-->
    <load target="./js/clipboard.min.js" />
    <a class="copycomLink" style="font-size:12px; color:#aaa" href="#" data-clipboard-text="{$oDocument->getPermanentUrl('', 'mid', $mid, 'document_srl', $comment->document_srl, 'comment_srl', $comment->comment_srl)}#comment_{$comment->comment_srl}" onclick="return false;">#comment_{$comment->comment_srl}</a>

    생각보다 댓글에서 comment_srl 파라미터를 가져 오는게 쉽지를 않네요.
    위젯에서도 그렇고 게시판안에서도 그렇고
    위젯에서는 $comment->document_srl 부분을 불러오는 것이 어렵네요.
    comment가 위치한 srl(free)를 불러와야 되는데 위젯이 설치된 srl(home)을 불러오는데 바꾸는 방법을 모르겠네요~ 어휴!!

    [코드]
    <a href="{getUrl('', 'mid', $mid, 'document_srl',$val->document_srl, 'comment_srl', $val->comment_srl)}#comment_{$val->get('comment_srl')}">

    [출력]
    https://moonhouse.co.kr/home/553969?comment_srl=554029#comment_554029

    •첨부파일쪽 코드는 어디서 가져온 건지 저도 잘 모르겠네요??? 아리송합니다.
    $lang->msg_not_permitted 은 라이믹스 기본 언어에 속해 있고
    $mi 는 $module_info로 바꾸어 보아도 여전히...

    이상입니다.
    수고 하셨습니다.
  • ? profile
    1. 클립보드로의 url 복사

    getPermanentUrl은 문서의 url 주소만 찾아주는 거여서요.
    https://github.com/rhymix/rhymix/blob/173f26dc0218c228e4ed0b2dd1cc092eb6bc6cf7/modules/document/document.item.php#L833

    다른 파라미터가 있는 url 주소를 생성하려면 getUrl 함수를 쓰는 게 나을 것 같아요.
    {getUrl('', 'mid', $mid, 'document_srl', $comment->document_srl, 'comment_srl', $comment->comment_srl)}#comment_{$comment->comment_srl}


    2. 위젯에서의 comment_srl 링크 연결

    예시하신 gerUrl의 파라미터 구성은 mid값이 해당 문서의 타겟 mid가 아니라 위젯이 삽입된 현재 mid로 나올 것 같은데요.
    mid값이 원래 mid를 찾아 변환되는 시점이 애드온에서 comment_srl을 찾는 시점보다 이후에 이뤄지거나 겹치는 것 같습니다.
    이건 애드온 쪽에서 좀 더 살펴봐야 할 것 같아요.


    3. 첨부파일 쪽도 한번 연구해보겠습니다~
  • profile ?

    {getUrl('', 'mid', $mid, 'document_srl', $comment->document_srl, 'comment_srl', $comment->comment_srl)}#comment_{$comment->comment_srl}
    이 코드를 사용하면 도메인이 없는 주소가 복사 됩니다.
    /free/553969?comment_srl=554029#comment_554029

    {getFullUrl('', 'mid', $mid, 'document_srl', $comment->document_srl, 'comment_srl', $comment->comment_srl)}#comment_{$comment->comment_srl}
    이렇게 getFullUrl을 적용하니 홈페이지 도메인이 적용된 주소가 나오네요
    https://moonhouse.co.kr/free/553969?comment_srl=554029#comment_554029

  • ? profile

    네, 다행입니다~
    첨부파일 쪽은 (알고보니 기본값이 그냥 파일 숨김인 것 같네요ㅎ) 스케치북에서 옛날식 jQuery 문법을 쓰고 있어서, 새로운 요소가 추가될 때 이걸 인식하지 못하게 된 듯해요.

    방법은 세 가지 정도로 보입니다.
    1) 적절한 타이밍을 잡아 대댓글 리스트를 불러들일 때 스케치북의 board.js도 함께 리로드하거나
    2) board.js가 동적으로 생성되는 요소도 포착할 수 있도록 스케치북 스킨 쪽을 수정하거나
    3) 아니면 아예 애드온에서 매뉴얼하게 첨부파일 숨기기 및 클릭 이벤트 와 마우스리브 이벤트를 걸어주거나

    ... 등등 일 것 같습니다.

  • ? profile

    첨부파일 숨김 적용 방법

    - 이것도 역시 스케치북 게시판 스킨을 수정해야 합니다. 가급적 애드온에 처리하고 싶지만 무슨 이유에서인지 js를 다시 로드하더라도 이벤트가 안 먹더라구요.

    - 두 군데 정도 수정해야 합니다.

     

    1. _comment.html

    <div id="files_{$comment->comment_srl}" class="cmt_files tg_cnt2">

    이 부분을 다음과 같이 합니다.

    => <div id="files_{$comment->comment_srl}" class="cmt_files tg_cnt2" style="display: none;">

     

    2. js/board.js

    // sketchbook's Toggle2 (Original : XE UI)

    이렇게 된 주석이 있을 텐데 해당 주석이 가리키고 있는 바로 아래의 코드들을 다음과 같이 수정합니다.

        var tgC2 = '.tg_cnt2';
        $(document).on('click', '.tg_btn2', function(){
            var t = $(this);
            var h = t.attr('data-href');
            if(t.next(h).is(':visible')){
                t.focus().next().fadeOut(200);
            } else {
                $(tgC2).filter(':visible').hide();
                t.after($(h)).next().fadeIn(200).css('display','block').find('a,input,button:not(.tg_blur2),select,textarea').eq(0).focus();
            };
            return false;
        });
        function tgClose2(){
            $(tgC2).filter(':visible').fadeOut(200).prev().focus();
        };
        $(document).on('keydown', function(event){
            if(event.keyCode != 27) return true; // ESC
            return tgClose2();
        });
        $(document).on('mouseleave', tgC2, tgClose2);
        $(document).on('focusin', '.tg_blur2', tgClose2);
        $(document).on('click', '.tg_close2,#install_ng2 .close', tgClose2);

     

    이렇게 하니까 파일 목록 숨김 처리 및 관련 이벤트가 부드럽게 작동하는 것 같아요.

    https://dev.aporia.blog/index.php?mid=board_fKje47&document_srl=40977&comment_srl=41236#comment_41236

  • profile ?
    이런 고마운 일이 맞춤형 서비스를 해 주시네요^.^
    영원한 님의 팬입니다.❤️❤️💕
  • profile

    애드온 잘 봤습니다 :)

    해당 자료를 코드 리뷰해보았는데요. 애드온으로 이렇게 멋진 기능을 만드시는 윤삼님의 실력이 돋보이는 자료인 것 같네요 乃

    다만 애드온으로써는 실행되는 위치가 잘못 잡힐 것 같아 트리거를 확실하게 활용할 수 있도록 모듈화가 필요할듯 하네요.

    한번 확인해보시고 모듈화진행을 한번 검토해보세요 ㅎㅎ

    post액션으로 요청했던 대부분의 ajax요청방식도 exec_json 으로 바꾸시고 데이터형태도 skins에서템플릿으로 만들어서 넘겨줄 필요가 없을듯 합니다 :)

  • profile profile
    아, 새로운 모듈에서 exec_json 실행할 수 있게 disp모듈명RecommentList 같은 식으로 액션을 module.xml에 설정해두고, 템플릿을 한번에 가져오는 게 낫겠다는 말씀이신가요?
    만약 그렇다면 그게 좀 더 안정적이고 효율적인 거겠죠..?
  • profile profile


    필요한경우 html으로도 리스폰 시켜줄 수 있어요
  • profile profile
    고민해보겠습니다;;;
    대댓글을 전체 목록과 어울리게 하려면 게시판 스킨의 소스를 활용을 하긴 해야 하는데, 그게 틀어지지 않게 포인트를 잡는 걸 잘 할 수 있을지 모르겠어요ㅜ
    행복한 주말밤이네요ㅋㅋㅋㅋ
  • profile profile
    어차피 HTML 으로 레이아웃없이 데이터를 넘겨주는것은 getCommentList.php에서 구현하셨던것처럼 스킨연결하여 템플릿으로 조합한뒤 넘기도록 만들어주면 되기 때문에 어려워 보이진 않을 것 같아요ㅎㅎ
  • profile profile

    조언해주신 부분을 참고해서 일단 애드온 차원에서 구조를 수정했어요.
    dispBoardCommentPage라는 액션으로 comment.html을 레이아웃 없이 가져와서 뿌려주는 것으로요.
    url에 comment_head라는 파라미터가 0이면 원댓글 목록을 가져오고, 특정 head값을 가지면 그에 해당하는 대댓글 목록을 가져오게 했구요.
    그렇게 해서 덕분에 별도 php파일이나 애드온 자체 스킨은 필요가 없게 됐습니다. 브라보!! 감사합니다!!

     

    덧. 모듈은 나중에요;;;;

  • ?
    대댓글 버튼을 누를경우 원댓글이 맨 위로 올라가는 버그가 있네요
  • ?
    처음누를때만 위로 올라가고 그 이후로는 안그러네요
  • ? profile
    스크롤이 원댓글의 top 포지션으로 이동한다는 이야기이지요?
    버그가 아니라 의도된 동작입니다.
    사용시에 불편하시면 해당 스크립트를 지우시면 될 거예요.
  • profile ?
    앗 그렇네요.
    지우니까 잘 됩니다ㅎㅎ
    은근히 스킨 만드는게 쉬운일이 아니네요ㅜ
  • ? profile

    css는 게시판 스킨의 것을 공유하니까, 소스 복사해서 변수 조작만 살짝 해준다고 생각하시면 될 거예요.
    이 정도면 (애드온 없던 시절) 스킨 수정만으로 원댓/대댓을 따로 로드하던 팁과 비교하면 완전 간단한 겁니다ㅜㅠ

  • profile ?
    당연히 간단한거 같습니다ㅎㅎ 감사할 따름이지요
  • ? profile
    작업 하시다가 막히는 거 있으면 언제든 이야기해주세요~
  • profile ?
    callback 지우니까 훨 보기가 편하네요.
    제일 아래 대댓글 부터 나오니 어떤 댓글의 대댓글인지 알아보기가 여렵더라구요.
    멋진 작품 감사합니다.
  • ? profile
    네, 별도 스킨으로 복제해서 편한 방식으로 활용하면 될 것 같아요.
    예를 들어 대댓글 로드할 때 하이라이트 효과를 준다든가, 여기 타운처럼 대댓글들의 부모자식 관계를 명확하게 볼 수 있도록 타임라인을 만들어준다든가 하는 식으로요.
  • profile
    PC, 모바일 스킨을 따로 쓰고 있을 경우 따로 적용되면 좋을것 같습니다.
  • profile profile
    그렇겠네요. 다음 버전 때 준비하겠습니다 ㅎㅎ
  • profile profile

    0.1.0으로 올렸습니다.
    - 구조를 좀 바꿔서 기존의 몇몇 파일들을 삭제하고 코드도 정리했습니다.
    - 게시판 스킨에 대댓글 링크의 onclick 속성을 onclick="getRecommentList(this, {$comment->comment_srl}); return false;" 으로 바꿔주시구요.
    - 앞으로 애드온 스킨 지정은 따로 안 하셔도 됩니다;;;
    - 모바일 스킨 적용 잘 되는지 체크해주시면 감사하겠습니다!

  • profile profile
    오!! 빠른 적용 감사합니다.
    테스트 해보겠습니다.
  • profile
    와우. 휴무날 바로 적용해보겠습니다!
  • profile profile
    네 말씀 전해주세요~~
  • profile
    와 ㅜ.ㅜ 감사합니다!
  • profile profile
    게시판 스킨에 맞춰 사용해보시면 좋을 것 같습니다~
  • profile
    먼저 감사인사먼져드립니다.
    윤삼님은 좋은 자료를 만들어 배포해주시는 것도 대단하지만, 친절하게 그에 대한 설명을 함께 해주시니 더 빛이 나는 것같네요.
    이렇게 정리해서 설명을 추가하는 것이 귀찮고 어려운 일인데 설명도 잘해주시고 정리도 잘하시는 윤삼님 정말 멋집니다.
    매번 느끼지만 배울점이 참 많은 분이시네요.
  • profile profile
    알아주시는 것만으로도 감사하죠ㅜㅜ
    자료 설명은 소스를 보고 기억을 더듬어 정리한 것이어서 어쩌면 빠진 것이 있을지도 모르겠어요.
    만약 자료 테스트를 해보신다면 이 점도 감안해서 의견 나눠주시면 좋을 것 같습니다 :)
  • ?
    오우 수고하셨습니다!한번 써보겠습니다ㅎㅎ
  • ? profile
    네 테스트 잘 부탁드립니다~