커뮤니티토픽게시판

컴포넌트에 '위젯 빌더'라는 제목을 붙이고 작업 중입니다 :)

(탭, 이미지 슬라이더, 롤링 배너/캐러셋, 토글/아코디언, 사용자 페이지네이션* 등등을 생성해줍니다)

* 스킨 개발 중이긴 한데 기존에 제가 만들었던 쪽 나누기 애드온 기능을 대신해줄 수 있을 것 같습니다

 

이번에는 활용폭을 넓히기 위해 문서의 첨부 파일을 가져와서 편집창에 드래그-앤-드롭할 수 있도록 해봤습니다.

자랑해볼게요ㅋ

 

 

1. 문서에 첨부된 파일이 있으면 목록 버튼이 활성화됩니다.

0.jpg

 

 

2. 목록 버튼을 클릭하면 당연히 목록이 나오겠죠ㅎ 섬네일 처리를 해서 이미지 파일은 섬네일로, 기타 파일은 일반 아이콘 이미지가 나오도록 했어요(트래픽을 아끼자!).

1.jpg

 

 

3. 섬네일을 드래그해보겠습니다. dragstart 이벤트가 있어서 드래그를 시작하는 순간 이미지의 src 속성값이 섬네일 주소가 아니라 '업로드 파일 네임' 주소로 바꿔치기됩니다.

2.jpg

 

 

4. 따라서 섬네일을 드롭하면 이미지 원본이 붙여넣기됩니다. 이후의 이미지 편집은 어렵지 않겠죠?

3.jpg

 

 

5. 물론 일반 파일도 드래그-앤-드롭이 가능합니다. 파일 이미지에 dragstart가 걸리면 이번에는 a 링크 태그로 변환됩니다.

4.jpg

 

 

6. 그렇게 드롭하면, 당연히 링크 태그로 붙여넣기가 되죠.

5.jpg

 

 

... 자랑 끝! '위젯 빌더' 에디터 컴포넌트 기대해주세용~

 

글쓴이 윤삼

profile
사물이 거울에 보이는 것보다 가까이 있음
  • profile
    대단하시네요...
    능력이 있어야 베푸는 나눔도 할 수 있을텐데 부럽습니다!!
  • profile profile

    대단까진 아니예요. 본문에 탭을 넣고 싶은데 코딩을 모르는 관리자그룹이 있어서 어찌어찌하다가 일이 커졌어요ㅜ 이미 벌린 일 잘 주워담을 수 있도록 더 노력해야죠ㅎㅎ

  • profile
    기다리고. 있습니다~
  • profile profile

    짬나는대로 손을 보고는 있는데 만족할 만한 완성도가
    여의치 않네요ㅜ 어쨌든 지난번 탭 위젯 컴포넌트에 대해 피드백 주셨던 부분 반영하면서 노력하고 있습니다ㅎㅎ

  • profile
    캬악 대단합니다
  • profile profile
    감사합니다ㅎㅎ
    (지난번 스킨은 만져보고 계신지요..)
  • profile profile
    주섬주섬 만들어서 일단 완료는 했는데 아무리 생각해도 버그가 너무 많아서 차차 고쳐보려고요ㅋ :)
  • profile profile

    오옷 조만간 기본 스킨으로 얹고 베타버전 꼬리표 뗄 수 있겠군요. 화이팅입니다요!

  • profile profile
    끙...ㅎ;
  • profile profile
    앗, 그렇다고 절대 부담은 갖지 마세요. 절대요!
  • profile
    여러 곳에 활용하기 좋겠습니다. 수고 많으세요.
  • profile profile
    에디터 확장 컴포넌트가 의외로 쓸모가 있더라구요. 격려 감사합니다~
  • profile
    수고 많으십니다. 멋진 기능이네요....^^
  • profile profile
    진짜 멋지고 싶은데 거기까진 참 어렵네요ㅎㅎ
  • ?
    역시 컴포넌트 장인이십니다
  • ? profile
    사실 코어와의 기본적인 원리와 에디터 호환성 정도의 문턱을 넘으면 되는데, 그 문턱이란 게 참;;;
  • ?
    능력이 부럽네요.^^ 멋진 작품 기대해 봅니다.
  • ? profile
    능력이라뇨;; 늘 헤매면서 구글링을 벗어나지 못하는 신세예요ㅎㅎ
  • ?

    멋진 작품 기대됩니다.
    빨리 보고 싶군요~~~~

    윤삼님 작품들 잘 사용할려고 php7버전 사용하는 호스팅으로 이사했습니다.^.^

  • ? profile
    아이고, 심혈을 기울여야 하겠네요;;; 시간 나는대로 열심히 해보겠습니다~!
  • profile
    와 엄청나네요 ..ㄷㄷ
  • profile profile
    근데 모바일이랑 브라우저 호환성 때문에 일이 2배 3배로 늘어나고 있습니다ㅎㅎㅎ

서버에 요청 중입니다. 잠시만 기다려 주십시오...