XETOWN

호수 공원

XE 사용에 대한 여러가지 정보들을 공유할 수 있습니다.
조회 수 247 추천 수 8 댓글 12
?

단축키

Prev이전 문서

Next다음 문서

크게 작게 댓글로 가기 인쇄 첨부
?

단축키

Prev이전 문서

Next다음 문서

크게 작게 위로 아래로 댓글로 가기 인쇄 첨부

첨부 파일 중 애니메이션 gif가 있다면 섬네일만 보여주고 클릭 후 실제 파일을 로드하자는 의도로 작성한 애드온 입니다.

아이디어만 가지고 막히는 부분은 구글링을 통해서 코드를 작성했습니다.

이모티콘등에 적용되지 않도록 외부 링크 이미지나 내 사이트 files/attach/폴더 아래의 첨부 파일에 대해서만 작동합니다.

 

pr_pause_gif.zip

 

pr_pause_gif.png

보기처럼 애니메이션 gif파일은 바로 로드되지않고 기본 섬네일이나 gif파일(첫번째 프레임?)을 섬네일로 만들어서 표시 되고 사용자가 마우스 클릭 후 실제 파일이 로드 됩니다.

 

pr_pause_gif2.png

애드온이 제공하는 옵션은 위의 3가지 입니다.

 

- 대체 이미지

섬네일을 선택 할 수 있습니다. 애드온에 포함된 기본 이미지를 사용하거나 첨부된 파일을 섬네일로 만들어서 표시합니다.

둘다 이미지는 data uri로 처리합니다.

 

- 애니메이션 GIF 체크

gif파일의 경우 무조건 적용할 것인지 애니메이션 gif인것을 확인 후 적용할 것인지 선택 합니다.

 

- 이미지 용량 표시

대기 화면에 이미지 용량을 표기 할것인지 선택 합니다.

 

테스트 해보니 의도한대로 작동하기는 합니다만 다량의 gif가 첨부된 문서나 외부 링크로 첨부된 gif가 있는경우 응답속도 하락이 눈에 띕니다. 특히 imgur같은...

 

테스트 기간이 짧고 테스트 방법이 다양하지 못해서 제가 의도한대로 완벽하게 작동하지 않을 수 있습니다. 버그나 퍼포먼스 향상을 위한 의견 주시면 감사하겠습니다.

 

주의

이 애드온은 적용할 img태그에서 editor_component="image_link" 속성을 제거 합니다. 이 속성이 있는 img태그의 경우 에디터 컴포넌트 처리단에서 대부분의 속성 태그들을 제거하더군요. 이것 때문에 한참 헤맸습니다. ㅋ

그래서 after_module_proc단계에서 해당 속성을 제거 후 content를 넘겨 주는 방식을 사용했으며 대신  image_link컴포넌트에서 진행하는 태그정리(?)작업을 이 애드온에서 동일하게 진행 합니다.

  • ?
    후하니 2017.01.25 02:24:18
    굳굳
  • profile
    Chronos 2017.01.25 07:58:28
    ㅊㅊ!
  • profile
    고양이 2017.01.25 09:19:29
    엄청난 자료입니다!!
    감사합니다.
  • profile
    socialskyo 2017.01.25 09:31:10

    역시 이미지 파일 처리 전문가 !!!

    사용해보니 말씀하신대로 imgur 과 같은 외부 링크 gif인 경우 느려지네요.

    그냥 외부든 내부든 gif든 아니든 특정 용량 기준으로 어떤 이미지든 차단 되는 기능도 있으면 완벽할듯 합니다. ^^

     

     

  • profile
    고양이 2017.01.25 10:32:24
    내부일때 외부일때만 작동하는 설정이라던지 용량 기준 설정도 있으면 더더욱 좋긴하겠네요. ㅎㅎ
  • profile
    prologos 2017.01.25 11:08:52

    콘텐츠 불러올때마다 애드온 내에서 imagecreate사용해서 섬네일 추출 작업을 했는데... 지금 생각해보니 그럴 필요가 없는거같네요.
    xe에서 제공하는 getThumbnail사용하면 편하고 속도도 빠를것을... 맞지요??

    대충 작동은하니 애드온의 직접적인 이미지 액세스 횟수 를 줄이는 방법을 생각 해 보겠습니다.

    =====

    getThumbnail은 안되겠네요,,,

  • profile
    구름이 2017.01.25 13:07:48
    감사합니다^^
  • ?
    칼럼 2017.01.25 15:11:16
    감사합니다.
  • profile
    prologos 2017.01.25 15:13:48
    타운에서 검색해보니 좋은 코드가있네요
    https://www.xetown.com/lakepark/266963
    이 코드도 적용해보고 용량체크 부분도 적용하도록 하겠습니다.

    그리고 속도 개선을 위해 섬네일 생성 방법을 변경할 예정입니다.
  • profile
    고양이 2017.01.26 16:46:29
    감사합니다!! 굿굿
  • profile
    보고하비 2017.01.25 21:36:47
    와 좋네요 전 버전업되면 적용해볼게요
  • profile
    RADIX 2017.02.08 17:54:44
    우와, 이 대박 애드온을 이제서야 봤네요. 당장 다운받았습니다. 감사합니다!!!!!

List of Articles
번호 분류 제목 글쓴이 날짜
4971 질문/답변 설정한 목록수 와 상관없이 최근본문 글 1개가 나오게 하고 싶습니다 3 착한악마 2017.03.22
4970 질문/답변 경험치도 포인트히스토리처럼 회원이 로그 보는법 질문입니다 newstar3014 2017.03.22
4969 질문/답변 wiris 컨포넌트를 사용하고 있는데 HTML 소스 일부가 잘라먹고 저장됩니다. 잡학쟁이 2017.03.22
4968 질문/답변 위젯 최근글 스킨 댓글수 출력 방법이 뭔가요...? 5 구미호 2017.03.22
4967 질문/답변 라이믹스 버그인가요? 4 라그릿 2017.03.22
4966 질문/답변 iwinv 라이믹스 설치가 안되요!? 7 file 로보 2017.03.22
4965 질문/답변 게시물 첫글로 바로 들어갈수 없을까요? 7 착한악마 2017.03.22
4964 질문/답변 혹시 XE최신버젼에서 데이타이전툴 정상작동하나요? 2 영흥도우럭 2017.03.22
4963 질문/답변 후하니 님이 만드신 스티커 모듈 버튼이 안눌려져요 이상한 점두 생겼구요 27 file 순결 2017.03.22
4962 질문/답변 청와통닭 레이아웃중 3 명예찬 2017.03.22
4961 질문/답변 위젯을 내용 직접 추가로 생성하면 안보여요 3 피피포 2017.03.21
4960 불편/개선 요청 XE 본문 에디터 소소한 불편한 점... 1 Blues 2017.03.21
4959 질문/답변 소셜로그인 문제 입니다 ㅠ file 낙타 2017.03.21
4958 질문/답변 모바일에서 글쓰기 하면 에디터 나오는데 이거 어떻게 없애나요 10 file 가이더 2017.03.21
4957 질문/답변 쉬운설치>>코어 업그레이드 시 "서버 접속이 원활하지 않습니다" 3 lis**** 2017.03.21
4956 질문/답변 원래 어드민 모듈도 스킨 설정할 수 있지 않았나요..? 5 하늘희 2017.03.21
4955 질문/답변 본문내 이미지 클릭시 확대 이미지 1 똑띠 2017.03.21
4954 질문/답변 게시글 작성자의 댓글에만 색상박스가 되게.. 6 라그릿 2017.03.21
4953 질문/답변 원래 관리자 페이지에서 대댓글은 여러개 삭제못하나요? 라그릿 2017.03.21
4952 질문/답변 모바일에서요 2 트리플라워 2017.03.21
Board Pagination Prev 1 2 3 4 5 6 7 8 9 10 ... 252 Next
/ 252
위로
서버에 요청 중입니다. 잠시만 기다려 주십시오...