Javascript library for RIDI EPUB Viewer written in ECMAScript 6
$ npm install @ridi/reader.js
└─┬ root
├── LICENSE
├── package.json
├── README.md
└─┬ dist
├─┬ android
| └─ index.js
├─┬ ios
| └─ index.js
└─┬ web
└─ index.js
- iOS 8-11
- Android 4-8 (API Level 14-26)
- Chrome 30~64
- Safari 9~11
- IE 11
import { Reader, Context, Util } from '@ridi/reader.js/[android|ios|web]';
offset
: 화면 내 위치를 나타내는 zero-based 오프셋 값, 페이지 보기의 경우pageOffset
, 스크롤 보기의 경우scrollY
값을 의미rect
: 화면 내 범위를 나타내는 DOMRect를 변형한MutableClientRect
(x
,y
,width
,height
,top
,left
,right
,bottom
값을 가지고 있음)range
: Range 객체node location
: (스파인 내) 위치를 나타내는 자체 포맷 (예:31#0
)serialized range
: (스파인 내) 범위를 나타내는 포맷, Range 라이브러리에서 제공하는 serialization format 사용 (예:0/171:0,0/171:30
)anchor
: HTML anchor 링크의id
애트리뷰트 값
-
렌더링에는 관여하지 않고 선택 영역에 대한 관리만 담당
-
sel.startSelectionMode(x, y)
mousedown
,touch
이벤트 등 발생 시 위 함수를 호출해 선택 모드로 진입
-
sel.expandUpperSelection(x, y)
또는sel.expandLowerSelection(x, y)
- 선택 방향에 따라 호출
- 여기에서
upper
,lower
는 선택 영역 양 끝에 나타나는 핸들을 의미
-
sel.getSelectedRange()
- 선택 영역을
range
로 반환
- 선택 영역을
sel.getSelectedSerializedRange()
- 선택 영역을
serialized range
포맷으로 반환
- 선택 영역을
getOffsetFromSerializedRange(serializedRange)
serialized range
를offset
으로 변환
getOffsetFromAnchor(anchor)
anchor
의 위치를offset
으로 변환
searchText(keyword)
- 검색 결과를
serialized range
포맷으로 반환
- 검색 결과를
textAroundSearchResult(pre, post)
- 검색 결과의 전/후 일부 문장을 포함해 반환
getPageOfSearchResult()
- 검색 결과의
pageOffset
값을 반환
- 검색 결과의
getRectsOfSearchResult()
- 검색 결과의
rect
객체를 배열로 반환
- 검색 결과의
content.getLinkFromElement(el)
- 특정 엘리먼트가
<a>
태그(이거나 그 부모가<a>
태그)일 경우 그 정보(node
,href
,type
)를 반환 type
으로epub:type
애트리뷰트의 값 반환 (예: 팝업 주석 링크일 경우type: 'noteref'
)
- 특정 엘리먼트가
content.reviseImage(imgEl, screenWidth, screenHeight)
- 이미지 크기를 조정해 이미지가 페이지를 벗어나는 일이 없도록 함
- 사용 후 페이지 계산 필요
content.getSvgElementFromPoint(x, y)
mouseup
,touch
이벤트 등 발생 시 해당 포인트에<svg>
태그 존재 여부 확인<svg>
태그가 존재하는 경우 태그의 전체 내용을 문자열로 반환
content.getImagePathFromPoint(x, y)
mouseup
,touch
이벤트 등 발생 시 해당 포인트에<img>
태그 존재 여부 확인<img>
태그가 존재하는 경우src
애트리뷰트 값 반환
/common/tts/
디렉토리 참조node location
기반으로 구현됨
You can install it with the following command:
$ git clone [email protected]:ridi/Reader.js.git
$ make setup
You can build it with the following command in Reader.js folder:
$ npm run [build|watch]
grunt-cli is required to build Reader.js