Comments (5)
예제에 적용된 소스코드는 아래를 참고해 주세요.
https://github.com/kimsQ/rc/tree/gh-pages/examples/extension/photoswipe
from rc.
우선 아래와 같이 기본구조는 잡았습니다.
##. 전체 구조 요약
- 바인딩
- 아래 2 가지 방식 모두 pswp 마크업을 javascript 에서 동적으로 생성하도록 했습니다.
- 아래 2 가지 방식 모두 data- 속성 값을 통해서 옵션 적용되도록 했습니다.
-
바인딩
- 마크업형
- gallery 단위로 data-extension="photoswipe" 으로 해서 바인딩을 했습니다.
- 스크립트형
- 이벤트 버튼에 data-toggle="photoswiper" 로 바인딩을 했습니다.
-
기본제공 옵션값 정리 요청
- 예를 들어 예제 상으로 script 방식에서는 history : flase 로 하고 showAnimationDuration : 0 로
하는 등 기본 옵션값이 달라지는데요....이 것들에 대한 명확한 룰이 있어야 할 것 같습니다. - 작업/문서를 먼저 만들어놓고 나중에 수정하려니 번거로워서 미리 정하고 문서작업을 하려고 합니다.
- 예를 들어 예제 상으로 script 방식에서는 history : flase 로 하고 showAnimationDuration : 0 로
이상입니다.
from rc.
수고하셨습니다
history 와 showAnimationDuration 등의 옵션은 링크목록형-마크업형
예제가 일반적인것으로 판단되니 이를 기준으로 옵션 기본값을 설정해 주시면 될 것 같습니다.
from rc.
pswp 마크업 동적 생성 관련
본 마크업을 동적생성하여 간결한 적용이 가능한 장점이 있지만, 반면, 포토모달(pswp)의 커스텀이 불가능한 단점이 있는 것 같습니다. pswp 마크업 동적생성여부를 옵션화 한후, 기본값을 동적생성으로 처리했으면 합니다.
특수한 경우( 포토모달의 구성상의 수정이 필요한 경우 ) pswp 마크업 동적생성 기능을 비활성 처리한 후, 커스텀된 포토모달(pswp) 직접 추가할 수 있으면 확장성에 도움이 될 것 같습니다.
HTML In Slides
카드뉴스 형식 구현에 활용될 수 있는 기능으로 판단됩니다. 본 기능 또한 구조화 요청 합니다.
- 예제 : https://kimsq.github.io/rc/examples/extension/photoswipe/htmlInSlides.html
- 관련내용 : http://photoswipe.com/documentation/custom-html-in-slides.html
from rc.
추가 요청사항 적용해서 완료했습니다.
문서작성도 완료했으며 모든 예제도 업데이트했습니다.
from rc.
Related Issues (20)
- backdrop 지속시간 관련
- js 소스코드 저장소 관련
- push control 작동시 photoswipe 컨테이너 생성되는 오류 HOT 1
- loader > overlay 안됐던 이슈 관련
- 컴포넌트 닫기 data-dismiss="컴포넌트명" 관련 이슈 2 가지
- swiper 도규먼트에 대한 저의 의견
- 미처리 작업 정리 -- 금주 주말내 완료 목표 HOT 7
- 단위 js 파일 위치 변경
- toggle.js 제외 및 추가 요청 HOT 5
- 브랜드 변경 ( Ratchet plus --> kimsQ RC ) HOT 2
- Accordion(collapse) 적용 컴포넌트 추가 요청 HOT 2
- 모달 content 에 infinite-scroll 적용시 이슈
- Static Backdrop with Animation 관련 HOT 7
- material-design-style drawer 옵션화 요청 HOT 1
- [공지] modal,popup 닫기 데이타속성명 변경 HOT 1
- 검색시 autocomplete 기능구현을 위한 Bootstrap-3-Typeahead 커스텀 요청 HOT 1
- [개선] modal 에서 popup,sheet 호출할 경우에 대응한 component z-index 수정
- modal에서 popup을 호출할 경우, data-dismiss 문제
- page 컴포넌트 direction 옵션의 필요성에 대하여
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from rc.