드래그하여 이동 애드온 - 클래스라는거... 참 느껴집니다.
XE 바닥에 오래 있다보면
코딩의 코는 몰라도
작품 수준이 일정 수준이상인지 아닌지 알수 있을 정도는 됩니다.
그 기준이
유저 뷰에서 아이디어가 참신한지
진부한 아이디어의 상품이라도 안정적인지
뭐 여러가지 조건에 따라 다르겠지만
fafazboard.com
pjaxboard 스킨을 만든
@파파즈님이 만든 아래 애드온
https://xetown.com/index.php?mid=point_contents&member_srl=1714&document_srl=1161730
스와이프로 페이지간 이동이 가능한 이 애드온..
솔직히 오랜만에 느끼는 놀라움입니다. 일단 거두절미 하고 감사히 잘 쓰겠습니다.
이 애드온이 저에게 주는 의미는
이 제품을 시작으로
언젠가는 게시물간 이동 기능도 스와이프로 가능할수 있지 않을까하는 희망을 가져 볼수 있겠습니다. 언젠가는... 말이죠
게다가 @윤삼님의 쪽 애드온과 합쳐진다면
여러분들이 다음 기사에서 자주 보셨던 혹은 브런치 게시물 처럼
왼쪽에서 오른쪽으로 쓰윽 쓰익 게시물 쪽을 이동해서 보는것도 구현 가능해질것같은 희망도 가져 봅니다.
다시한번 @파파즈님에게 고맙습니다
댓글 23
어여 모아서 저도 적용해 보고 싶네요.
조심스레 시도해보면 가능할 것 같기도 하고... 숙원사업 중에 하나였으니 한번 시도해봐야죠ㅎㅎ
저도 벌써 두근 두근 합니다~
"언젠가는 게시물간 이동 기능도 스와이프로 가능할수 있지 않을까"에 대해서는..
정확히 어떤 형태로 구현되었으면 하시는건지 이해가 잘 안되네요.
기술적으로 복잡한 건 딱히 없을 것 같구용
좀 더 디테일한 제안 주시면 한번 구상해볼게요
쿼리 남발이 우려되신다면 필수 말고 옵션으로라도 넣어주시면 좋을 것 같아요~
넵. 윤삼님 설명 그대로 입니다.
게시물 안(읽기)에서 이전글 다음글 기능이 있는데
스와피로 해당 기능 처럼 이전/다음 글 이동이 되면 좋겠습니다.^^
스킨에서 가져온 url을 이용하면 따로 추가로 쿼리 하지 않고도 가능하지 않을까 하는 생각도 해보게 되네요.
말씀하신대로 스킨 따라 사정이 달라서 조금 애매하긴 하겠네요.
그래도 몇몇 유명 스킨의 경우엔 따다 쓸 수도 있지 싶어요.
유명한 스킨이 아닌 걸로 확인되면 그 때 쿼리 실행하구요 ㅎㅎ
대부분 스킨에서 게시글을 읽는 화면에서 이전글,다음글 의 글 번호를 쿼리해서 문서번호를 확보해 놓은다음 현재 글을 읽고 난 후 연속해서 해당 게시판의 글을 계속 읽어가는 수요를 위해 이전글,다음글 링크를 제공합니다.
별도로 본문의 영역의 id를 지정할 수 있고 해당 id 영역에서 좌우 스와이프로 다음페이지가 아닌 다음글,이전글로 동작하는 기능이 추가되었으면 하는 요청입니다.
개인적으로 계획하신 댓글 페이지 이동의 스와이프 동작보다는 사실 본문의 다음글,이전글 이동이 수요가 훨씬 많습니다. 다만 구현이 조금더 복잡하고 이전글,다음글의 주소를 확보해야 하는 작업이 필요하다는 점이 고려 할 부분이라 생각 됩니다.
- 스케치북5 스킨에는 글 하단에 링크가 있고 추가적으로 키보드의 방향키 좌,우와 매핑되어 있습니다. 이런 기능을 이야기 하는 것입니다.
https://github.com/sketchbook/xe/blob/master/modules/board/skins/sketchbook5/_read.html#L191
댓글 이동은 댓글이 페이지로 구분되는 사레가 사실 흔하지는 않습니다. 각 파트별로 개별 기능으로 동작한다면 나쁘지는 않죠.
애초에 페이지 이동이라는 컨셉을 잡고 시작한거라 댓글 쪽을 지원하는게 맞겠다 싶긴했는데..
생각해보니 다음 카페랑은 좀 다르게 댓글이 몇십개씩 달릴 일은 잘 없긴 하죠.
시간 나는대로 이전글 다음글 작업해보겠습니다. ^^
이전글-다음글 스와이프 작업하시게 되면 혹시 스와이프가 작동하지 않는 영역을 따로 설정하는 것도 가능하실까요?
쪽 나누기 애드온에 스와이프를 넣으려다보니 이게 결국엔 본문 내에서 작동하는 것이어서 충돌이 일어날 수 있겠더라구요.
저는 본문 내에 '.ap_pager_content'라는 요소를 삽입하고 여기에 국한해서 스와이프를 적용하려 하는데요. 파파즈님 애드온에서 이 영역이 예외가 되면 충돌을 막을 수 있겠다 싶거든요.
암튼 남은 휴일 잘 보내셔요~
이벤트 전파를 막는 이벤트 핸들러 내부 메서드이구요.
(같은 이벤트 타입에 등록된 핸들러의 실행을 막는 우선권 같은 기능입니다.)
제가 예외처리하려면 한번 터치할 때마다 수십번씩 실행되는 이벤트핸들러에서
지금 터치된 타겟이 어느 영역에 속하는지를 매번 비교해야해서 성능에 상당히 안좋습니다.
저희는 단순히 나열되는 것이 넘치면 스크롤이 생기는 상황입니다.
<div style="margin:0 auto 10px auto;">
위젯코드
</div>
이렇게 아주 간단한 형식입니다. 위젯스킨에서 x축이 넘치면 스크롤이 생기게 해놓아서 가로로 스와이프해서 보게 되는데요. 글쓴이의 다른 작성글 위젯입니다.
섬네일을 보여주다 보니 가로로 배치가 되었습니다.
위 영역에서 애드온의 동작이 안되게 하고 싶습니다. 저기에는 따로 스크립트같은게 전혀 쓰이지 않거든요.
최후의 수단으로는 해당 부분을 옮기는 것도 고려하고 있으나 여건상 위치를 유지하는게 좋아서요.
abc.addEventListener('touchmove', function(e) {
e.stopPropagation();
});
이 코드 넣어보세요.
위젯의 스킨에 넣으라는 말씀이시죠?
.abc-def 는 해당 앨리먼트 클래스명 입력해주시면 되요.
이제 게시글 다음글 이전글 스와이프 본문에서 문제없이 사용할 수 있게 준비가 되었네요~
애드온에서 다음글 잘 찾아갈 수 있게 되면 시도해보겠습니다.
http://labs.rampinteractive.co.uk/touchSwipe/demos/Stop_propegation.html
물론 실제로 테스트를 해봐야겠지만요ㅎ