클리앙을 보면 종종 댓글 추첨하는 분들이 보이는데, 추첨 작업을 수작업으로 하시느라 힘들어하시는 경우들이 가끔 생기더군요.
아래 스크립트를 콘솔창에 복붙만 하시면 비교적 간편하게 댓글 추첨할 수 있습니다.
※ 댓글의 내용과는 무관하게, 그냥 해당 글에 달린 댓글 모두(또는 선착순 n개 제한)를 추첨 대상에 놓고 랜덤으로 뽑는 스크립트입니다.
(대댓글, 중복 ID 댓글, 차단 유저의 댓글은 추첨 대상에서 제외)
예전 텍스트 버전( https://www.clien.net/service/board/lecture/12835815CLIEN )에서 여러명 추첨하는 기능 넣으려다보니 옵션 물어보는 과정이 복잡해지길래,
그냥 간단한 GUI라도 있는게 나을 것 같아서, 이참에 뜯어고쳤어요.
▶ 실행하는 방법
1. 댓글을 추첨할 글로 이동한다.
2. 브라우저 단축키 F12를 눌러 콘솔창을 열고, 콘솔창을 클릭하여 커서가 뜨도록 한다.
3. 아래 스크립트를 콘솔에 붙여넣기 한 후 Enter!
4. 화면에서 옵션을 선택한 후 [추첨 시작] 버튼을 누른다.
4-1. 추첨 대상을 n번째 댓글까지 제한할 경우, [추첨 시작] 버튼을 누른 후 제한을 하고 싶은 댓글 옆에 [여기까지 추첨] 버튼을 누른다.
※ 옵션 선택창이 뜨는 것과 동시에 댓글 전체 목록을 불러오고 있으니,
옵션창에서 잠시 기다려서 댓글 로딩이 끝나 스크롤바가 확장되는걸 확인 한 후에 [추첨 시작] 버튼을 누르세요.
그냥 옵션창 띄우고 몇 초 기다리면 됩니다.
뽑을 인원: 추첨으로 뽑을 인원을 선택합니다. 기본값 1
대상 범위: 추첨할 댓글의 범위를 지정합니다. 선착순 n번째 댓글까지만 추첨하고 싶다면, 옵션을 [인원 제한]으로 바꾸세요.
글 작성자: 글 작성자의 댓글도 추첨 대상에 포함시킬지를 선택합니다.
/* 클리앙 댓글 랜덤 추첨 스크립트 (대댓글, 중복ID 제외) */
app.getCommentList('all');(()=>{let o,c='.post_comment .comment_row:not(.hidden):not(.re)',t='클리앙 댓글 랜덤 추첨기',s={'outline':'solid 5px orange'},ro=p=>{let a=new Set(),r,h="";$(c).each((i,e)=>{if(p&&i>p)return false;a.add(e.dataset.authorId);});a=[...a].filter(Boolean);r=[...a];for(let i=r.length-1;i>0;i--){const j=Math.floor(Math.random()*(i+1));[r[i],r[j]]=[r[j],r[i]];}o=Math.min(o,r.length);r=r.slice(0,o);for(let [i,v] of r.entries()){const $t=$(c+`[data-author-id=${v}]`).first().css(s),$k=$t.find('.nickname>*'),n=$k.attr('alt')||$k.text();h+=`<button data-id="${v}" style="display:block;padding:2px 5px;background:#fff;margin:4px 0;box-shadow:1px 1px 3px -1px #222;">${i+1}. ${n}(${v})</button>`;}console.log("대상",a);console.log("결과",r);const $o=$(`<div class="cmt_lottery" style="position:fixed;top:50%;right:0;transform:translateY(-50%);font-size:13px;background:#aaa;color:#000;padding:10px;max-height:100%;overflow-y:auto;z-index:100;border:solid 3px #666;max-height:90%;line-height:1.5;"><div style="font-size:1.5em">${t}</div><div>추첨 결과 (대상 총 ${a.length}명)</div><div>${o}명 당첨 (클릭하면 댓글로 이동)</div>${h}</div>`).on("click","button",e=>{$('html,body').stop(true).animate({scrollTop:$(c+`[data-author-id=${e.target.dataset.id}]`).css(s).offset().top-10},500);}).appendTo("body");setTimeout(()=>$o.css("transform",`translateY(-${Math.floor($o.outerHeight()/2)}px)`),0);},cn=()=>{$(c).each((i,e)=>{$(`<button class='rCnt' data-n='${i}' style="padding:0 2px;background:#822;color:#fff;margin:0 5px 0 -50px;box-shadow:1px 1px 3px #222;">${i+1} 여기까지 추첨</button>`).on("click",e=>{$('.rCnt').remove();ro(e.target.dataset.n);}).prependTo($(e).find('.post_contact'));});if($(c).offset().top>window.scrollY)window.scrollTo(0,$(c).offset().top);};$(".cmt_lottery").remove();$(`<div class="cmt_lottery" style="position:fixed;left:calc(50% - 115px);top:calc(50% - 130px);width:260px;height:230px;background:#aaa;padding:15px 20px;font-size:16px;display:flex;flex-direction:column;justify-content:space-between;z-index:10000;border:solid 3px #666;color:#000;line-height:1.5;"><div style="font-size:20px;text-align:center">${t}</div><div>뽑을 인원: <input style="background:#fff;text-align:center;max-width:80px;" type="number" min="1" max="99" value="1"></div><div>대상 범위: <select class="a" style="background:#fff;padding:2px 10px;"><option value="a" selected>전체 추첨</option><option value="b">인원 제한</option></select></div><div>글 작성자: <select class="b" style="background:#fff;padding:2px 10px;"><option value="a" selected>추첨 제외</option><option value="b">추첨 포함</option></select></div><button style="background:#ccc;padding:10px;">추첨 시작</button></div>`).find("button").on("click",e=>{const $p=$(e.target.parentNode);o=Math.floor(Number($p.find("input").val()));if(!(o>0))return;if($p.find(".b").val()==='a')c+=":not(.by-author)";$p.find(".a").val()==='a'?ro():cn();$p.remove();}).end().appendTo("body");})()
게시판에서 힘들게 댓글 추첨하는 분들을 위해 만들었는데,
이거 올린 뒤에도 이 방법의 존재를 몰라서 수동으로 한땀한땀 추첨하시는 분들이 종종 있으시더라구요.
댓글 추첨하실 때, 이 게시물 링크 한번씩 남겨서 퍼트려주세요. ㅎ
가칭 'on spot scripting' 같습니다