Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Lifecycle management with RxJS #90

Merged
merged 27 commits into from
Dec 10, 2018
Merged

Lifecycle management with RxJS #90

merged 27 commits into from
Dec 10, 2018

Conversation

kyungmi
Copy link
Contributor

@kyungmi kyungmi commented Dec 10, 2018 •
edited
Loading

Changes

  • RxJS 기반으로 동작하는 EventBus, Events 작성
    • 기존 Connector를 기반으로 노출되었던 react-viewer의 API를 모두 이벤트 방식으로 변경함
    • LoadService: 기존 데이터 복구 및 콘텐츠 로드를 담당
    • CalculationService: 페이지 계산 담당
    • CurrentService: 이전 위치 복구 및 현재 위치 계산 (+ 형광펜 위치 계산 -> CalculationService가 더 적합할듯)
  • 일부 데이터(annotation)를 시범적으로 RxJS로 관리하도록 함
  • react-redux의 connect와 비슷하게 동작하는 withStore HOC 작성

Remain issues

  • 스크롤보기일때 형광펜 위치가 왼쪽으로 약간 어긋나게 계산됨
  • 스크롤보기일때 터치를 시작한 지점의 콘텐트 인덱스 값을 바탕으로 reader.js를 불러와야 함 (현재는 current.contentIndex 값을 참조)
  • 스크롤보기일때 footer 영역은 SelectionLayer로 덮지 않아야 함
  • 페이지보기일때 양 옆 페이지의 형광펜이 나타남
  • 어색한 Service 이름 변경

Future Release

  • Redux를 RxJS로 대체

image

kyungmi.k added 25 commits November 22, 2018 11:15
Add RxJS package
775bd85
Setup base structures for event-driven architecture and add some exam…
a113635 
…ples [skip ci]
[emit scroll event] -> [update current offset] with RxJS and `Eve…
fdc5e52 
…ntBus`

[skip ci]

- replace `onScrolled` property of `<Reader>` with listening on `SCROLL` event
Replace onTouched prop with Events.core.TOUCH
9f78e0a
Replace onAnnotationTouched prop with Events.core.TOUCH_ANNOTATION
bab1576
Replace onSelectionChanged prop with Events.core.CHANGE_SELECTION
edf6bd7
Replace onMount and onUnmount prop with Events.core.LOADED, `Ev…
ef1c59e 
…ents.core.UNLOADED`

- `EventBus` extended with some methods (`asObservable`, `off`, `offByTarget` and `completeAll`)
- Add `AppService` charged with bootstrapping demo app
[skip ci]
contentload using rxjs
3d224d4 
[skip ci]
All calculation process replaced with RxJS
a8fc4f7 
[skip ci]
Fix calculation bugs
54fac96 
[skip ci]
Recalculation triggered with resize event working with RxJS
e07b811 
[skip ci]
Fix error of calculation process to get restore position
05d57a0 
[skip ci]
Let recalculation be triggered with setting updates using rxjs
1edc248 
[
skip ci]
Fix bug on initialState
1c19b86 
[skip ci]
fix typo error
fe62cca 
[skip ci]
Clean up whole lifecycle and define state restoring process
d9189fe 
[skip ci]
To prevent browser's own scroll restoration when to refresh, using `h…
6775a3f 
…istory.scrollRestoration = manual`

ref: https://developers.google.com/web/updates/2015/09/history-api-scroll-restoration
[skip ci]
Fix bugs page changing and restoration
d390a20 
[skip ci]
Fix lint errors
20f5b54
Filter events in listener according to current status(e.g. `readyToRe…
098ee94 
…ad`) instead of adjust when to add event listeners
Define (re-)calculation time of rects of annotations more clearly and…
7eab823 
… fix errors on calculated rects values
Fix bugs on ContentFormat === IMAGE
c822480 
[skip ci]
Fix bugs related with data for management annotations
578b186 
[skip ci]
Remove events namespacing and change Service APIs(`setContentsByValue…
8f55685 
…`, `setContentsByUri`) as Events
Change Service APIs(setContentsByValue, setContentsByUri) as Even…
c98fb27 
…ts and fix lint errors
@kyungmi kyungmi changed the title Lifecycle management with rxjs Lifecycle management with RxJS Dec 10, 2018
@kyungmi kyungmi merged commit d4718c0 into master Dec 10, 2018
@kyungmi kyungmi deleted the feature/lifecycle-management-with-rxjs branch December 10, 2018 23:30
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers
No reviews
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
1 participant
@kyungmi