npm - @fmsim/board - Versions diffs - 2.0.0-beta.34 → 2.0.0-beta.38 - Mend

@fmsim/board 2.0.0-beta.34 → 2.0.0-beta.38

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (12) hide show

package/custom-elements.json +1027 -850
package/dist/src/ox-board-viewer.d.ts +1 -0
package/dist/src/ox-board-viewer.js +20 -14
package/dist/src/ox-board-viewer.js.map +1 -1
package/dist/src/ox-playback-controls.d.ts +5 -0
package/dist/src/ox-playback-controls.js +50 -10
package/dist/src/ox-playback-controls.js.map +1 -1
package/dist/src/playback/playback-engine.d.ts +31 -20
package/dist/src/playback/playback-engine.js +171 -56
package/dist/src/playback/playback-engine.js.map +1 -1
package/dist/tsconfig.tsbuildinfo +1 -1
package/package.json +3 -3

package/dist/src/ox-playback-controls.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ox-playback-controls.js","sourceRoot":"","sources":["../../src/ox-playback-controls.ts"],"names":[],"mappings":"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","sourcesContent":["import '@material/web/icon/icon.js'\nimport '@material/web/iconbutton/icon-button.js'\n\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\n\ntype PlaybackState = 'idle' \| 'playing' \| 'paused' \| 'stopped'\n\nconst ONE_HOUR = 3600000\n\n/*\n 플레이백 컨트롤 오버레이 바 (2행 구조)\n \n 1행: 시작 시점 설정 (datetime + ±1h 버튼) + 배속 선택\n * 2행: 재생 제어 (play/pause/stop) + 1시간 범위 시크바 + 닫기\n \n @fires playback-start - 플레이백 시작 요청 { fromTime, speed }\n * @fires playback-pause - 일시정지 요청\n * @fires playback-resume - 재개 요청\n * @fires playback-stop - 중지 요청\n * @fires playback-seek - 시크 요청 { toTime }\n * @fires playback-speed - 배속 변경 요청 { speed }\n /\n@customElement('ox-playback-controls')\nexport class PlaybackControls extends LitElement {\n static styles = css`\n :host {\n display: flex;\n justify-content: center;\n position: absolute;\n bottom: 0;\n left: 0;\n right: 0;\n z-index: 1001;\n pointer-events: none;\n }\n\n .control-bar {\n display: flex;\n flex-direction: column;\n gap: 6px;\n padding: 10px 16px;\n margin: 12px;\n max-width: 560px;\n width: 100%;\n background: rgba(0, 0, 0, 0.75);\n backdrop-filter: blur(8px);\n border-radius: 12px;\n color: #fff;\n pointer-events: auto;\n font-size: 13px;\n box-sizing: border-box;\n }\n\n / 1행: 시점 설정 + 배속 /\n .row-time {\n display: flex;\n align-items: center;\n gap: 6px;\n }\n\n md-icon-button {\n --md-icon-button-icon-color: #fff;\n --md-icon-button-hover-icon-color: #fff;\n --md-icon-button-pressed-icon-color: #fff;\n --md-icon-button-focus-icon-color: #fff;\n --md-icon-button-state-layer-color: rgba(255, 255, 255, 0.2);\n }\n\n md-icon-button:hover {\n background: rgba(255, 255, 255, 0.15);\n border-radius: 50%;\n }\n\n .row-time md-icon-button {\n --md-icon-button-icon-size: 18px;\n --md-icon-button-container-width: 32px;\n --md-icon-button-container-height: 32px;\n }\n\n .date-input {\n background: rgba(255, 255, 255, 0.15);\n border: 1px solid rgba(255, 255, 255, 0.3);\n border-radius: 6px;\n color: #fff;\n font-size: 13px;\n padding: 4px 8px;\n outline: none;\n color-scheme: dark;\n width: 130px;\n }\n\n .date-input:focus {\n border-color: rgba(255, 255, 255, 0.6);\n }\n\n .hour-select {\n background: rgba(255, 255, 255, 0.15);\n border: 1px solid rgba(255, 255, 255, 0.3);\n border-radius: 6px;\n color: #fff;\n font-size: 13px;\n padding: 4px 6px;\n outline: none;\n color-scheme: dark;\n cursor: pointer;\n }\n\n .hour-select:focus {\n border-color: rgba(255, 255, 255, 0.6);\n }\n\n .time-label {\n font-size: 12px;\n opacity: 0.7;\n white-space: nowrap;\n }\n\n .spacer {\n flex: 1;\n }\n\n .speed-group {\n display: flex;\n gap: 2px;\n }\n\n .speed-btn {\n padding: 4px 8px;\n border: 1px solid rgba(255, 255, 255, 0.3);\n border-radius: 4px;\n background: transparent;\n color: #fff;\n font-size: 12px;\n cursor: pointer;\n white-space: nowrap;\n }\n\n .speed-btn:hover {\n background: rgba(255, 255, 255, 0.15);\n }\n\n .speed-btn.active {\n background: rgba(255, 255, 255, 0.3);\n border-color: #fff;\n }\n\n / 2행: 재생 제어 + 시크바 /\n .row-seek {\n display: flex;\n align-items: center;\n gap: 8px;\n }\n\n .row-seek md-icon-button {\n --md-icon-button-icon-size: 20px;\n --md-icon-button-container-width: 36px;\n --md-icon-button-container-height: 36px;\n }\n\n .row-seek md-icon-button.primary {\n --md-icon-button-icon-size: 24px;\n --md-icon-button-container-width: 40px;\n --md-icon-button-container-height: 40px;\n }\n\n .timeline {\n flex: 1;\n display: flex;\n flex-direction: column;\n gap: 2px;\n min-width: 0;\n }\n\n .seek-bar {\n width: 100%;\n height: 4px;\n -webkit-appearance: none;\n appearance: none;\n background: rgba(255, 255, 255, 0.3);\n border-radius: 2px;\n outline: none;\n cursor: pointer;\n }\n\n .seek-bar::-webkit-slider-thumb {\n -webkit-appearance: none;\n width: 12px;\n height: 12px;\n border-radius: 50%;\n background: #fff;\n cursor: pointer;\n }\n\n .seek-labels {\n display: flex;\n justify-content: space-between;\n font-size: 11px;\n opacity: 0.8;\n }\n\n .current-time {\n font-size: 12px;\n opacity: 0.9;\n white-space: nowrap;\n min-width: 60px;\n text-align: center;\n }\n `\n\n @property({ type: String }) playbackState: PlaybackState = 'idle'\n @property({ type: Number }) speed: number = 1\n @property({ type: String }) currentTime: string = ''\n\n /* 외부에서 전달받은 초기 시간 범위 (from만 사용, to는 from+1h로 자동 계산) /\n @property({ type: Object }) timeRange: { from: Date; to: Date } = {\n from: new Date(Date.now() - ONE_HOUR),\n to: new Date()\n }\n\n @state() private _startTime: Date = PlaybackControls._floorToHour(new Date(Date.now() - ONE_HOUR))\n @state() declare private _seekValue: number\n @state() declare private _currentPlayTime: Date \| null\n\n private _speeds = [1, 1.5, 2]\n private _timer?: number\n\n private get _endTime(): Date {\n return new Date(this._startTime.getTime() + ONE_HOUR)\n }\n\n private static _floorToHour(date: Date): Date {\n const d = new Date(date)\n d.setMinutes(0, 0, 0)\n return d\n }\n\n connectedCallback() {\n super.connectedCallback()\n this._startTime = PlaybackControls._floorToHour(this.timeRange.from)\n this._seekValue = 0\n this._currentPlayTime = null\n }\n\n disconnectedCallback() {\n super.disconnectedCallback()\n this._stopTimer()\n }\n\n updated(changes: Map<string, any>) {\n if (changes.has('timeRange') && this.timeRange) {\n this._startTime = PlaybackControls._floorToHour(this.timeRange.from)\n }\n if (changes.has('currentTime') && this.currentTime) {\n this._updateSeekPosition()\n }\n }\n\n render() {\n const isPlaying = this.playbackState === 'playing'\n const isPaused = this.playbackState === 'paused'\n const isActive = isPlaying \|\| isPaused\n\n return html`\n <div class=\"control-bar\">\n <!-- 1행: 시점 설정 + 배속 -->\n <div class=\"row-time\">\n <md-icon-button @click=${this._shiftTime(-1)} title=\"-1h\">\n <md-icon>chevron_left</md-icon>\n </md-icon-button>\n\n <input\n type=\"date\"\n class=\"date-input\"\n .value=${this._toDateString(this._startTime)}\n @change=${this._onDateChange}\n />\n\n <select class=\"hour-select\" .value=${String(this._startTime.getHours())} @change=${this._onHourChange}>\n ${Array.from({ length: 24 }, (_, i) => html`\n <option value=${i} ?selected=${this._startTime.getHours() === i}>\n ${String(i).padStart(2, '0')}:00\n </option>\n `)}\n </select>\n\n <md-icon-button @click=${this._shiftTime(1)} title=\"+1h\">\n <md-icon>chevron_right</md-icon>\n </md-icon-button>\n\n <span class=\"time-label\">~ ${String(this._endTime.getHours()).padStart(2, '0')}:00</span>\n\n <span class=\"spacer\"></span>\n\n <div class=\"speed-group\">\n ${this._speeds.map(\n s => html`\n <button class=\"speed-btn ${this.speed === s ? 'active' : ''}\" @click=${() => this._onSpeedChange(s)}>\n ×${s}\n </button>\n `\n )}\n </div>\n </div>\n\n <!-- 2행: 재생 제어 + 시크바 + 닫기 -->\n <div class=\"row-seek\">\n <md-icon-button class=\"primary\" @click=${isActive ? this._onTogglePlayPause : this._onStart}>\n <md-icon>${isPlaying ? 'pause' : 'play_arrow'}</md-icon>\n </md-icon-button>\n\n <div class=\"timeline\">\n <input\n type=\"range\"\n class=\"seek-bar\"\n min=\"0\"\n max=\"1000\"\n .value=${String(this._seekValue)}\n @input=${this._onSeekInput}\n @change=${this._onSeekChange}\n />\n <div class=\"seek-labels\">\n <span>${this._formatTime(this._startTime)}</span>\n <span>${this._formatTime(this._endTime)}</span>\n </div>\n </div>\n\n <span class=\"current-time\">\n ${this._currentPlayTime ? this._formatTime(this._currentPlayTime) : '--:--:--'}\n </span>\n\n <md-icon-button @click=${this._onStop}>\n <md-icon>close</md-icon>\n </md-icon-button>\n </div>\n </div>\n `\n }\n\n private _formatTime(date: Date): string {\n return date.toLocaleTimeString('ko-KR', { hour: '2-digit', minute: '2-digit', second: '2-digit', hour12: false })\n }\n\n private _toDateString(date: Date): string {\n const pad = (n: number) => String(n).padStart(2, '0')\n return `${date.getFullYear()}-${pad(date.getMonth() + 1)}-${pad(date.getDate())}`\n }\n\n private _updateSeekPosition() {\n if (!this.currentTime) return\n const current = new Date(this.currentTime).getTime()\n const from = this._startTime.getTime()\n const to = this._endTime.getTime()\n const range = to - from\n if (range <= 0) return\n this._seekValue = Math.max(0, Math.min(1000, Math.round(((current - from) / range) 1000)))\n }\n\n private _onDateChange(e: Event) {\n const value = (e.target as HTMLInputElement).value\n if (!value) return\n const [year, month, day] = value.split('-').map(Number)\n const newStart = new Date(this._startTime)\n newStart.setFullYear(year, month - 1, day)\n this._shiftStartTime(newStart)\n }\n\n private _onHourChange(e: Event) {\n const hour = Number((e.target as HTMLSelectElement).value)\n const newStart = new Date(this._startTime)\n newStart.setHours(hour, 0, 0, 0)\n this._shiftStartTime(newStart)\n }\n\n private _shiftTime(hours: number) {\n return () => {\n const newStart = new Date(this._startTime.getTime() + hours * ONE_HOUR)\n this._shiftStartTime(newStart)\n }\n }\n\n /*\n 시작 시간 변경 시 현재 재생 시간도 같은 offset만큼 이동.\n * 재생 중이면 타이머 유지.\n /\n private _shiftStartTime(newStart: Date) {\n const delta = newStart.getTime() - this._startTime.getTime()\n this._startTime = newStart\n\n if (this._currentPlayTime) {\n const shifted = new Date(this._currentPlayTime.getTime() + delta)\n const end = this._endTime\n\n // 새 범위 안에 있으면 이동, 밖이면 시작점으로\n if (shifted.getTime() >= newStart.getTime() && shifted.getTime() <= end.getTime()) {\n this._currentPlayTime = shifted\n } else {\n this._currentPlayTime = new Date(newStart)\n }\n\n this._updateSeekFromPlayTime()\n }\n }\n\n private _onStart() {\n this._currentPlayTime = new Date(this._startTime)\n this.playbackState = 'playing'\n this._startTimer()\n\n this.dispatchEvent(\n new CustomEvent('playback-start', {\n detail: { fromTime: this._startTime, speed: this.speed },\n bubbles: true,\n composed: true\n })\n )\n }\n\n private _onTogglePlayPause() {\n if (this.playbackState === 'playing') {\n this.playbackState = 'paused'\n this._stopTimer()\n this.dispatchEvent(new CustomEvent('playback-pause', { bubbles: true, composed: true }))\n } else {\n this.playbackState = 'playing'\n this._startTimer()\n this.dispatchEvent(new CustomEvent('playback-resume', { bubbles: true, composed: true }))\n }\n }\n\n private _onStop() {\n this._stopTimer()\n this._currentPlayTime = null\n this._seekValue = 0\n this.playbackState = 'idle'\n this.dispatchEvent(new CustomEvent('playback-stop', { bubbles: true, composed: true }))\n }\n\n private _onSeekInput(e: Event) {\n this._seekValue = Number((e.target as HTMLInputElement).value)\n\n // 드래그 중 현재 시간 업데이트 (비주얼 피드백)\n const ratio = this._seekValue / 1000\n const from = this._startTime.getTime()\n const to = this._endTime.getTime()\n this._currentPlayTime = new Date(from + (to - from) ratio)\n }\n\n private _onSeekChange(e: Event) {\n const ratio = Number((e.target as HTMLInputElement).value) / 1000\n const from = this._startTime.getTime()\n const to = this._endTime.getTime()\n const targetTime = new Date(from + (to - from) * ratio)\n\n this._currentPlayTime = targetTime\n\n this.dispatchEvent(\n new CustomEvent('playback-seek', {\n detail: { toTime: targetTime },\n bubbles: true,\n composed: true\n })\n )\n\n // 재생 중이었으면 새 시점에서 타이머 계속\n if (this.playbackState === 'playing') {\n this._stopTimer()\n this._startTimer()\n }\n }\n\n private _onSpeedChange(speed: number) {\n this.speed = speed\n\n this.dispatchEvent(\n new CustomEvent('playback-speed', {\n detail: { speed },\n bubbles: true,\n composed: true\n })\n )\n\n // 재생 중이면 타이머 재시작 (새 속도 반영)\n if (this.playbackState === 'playing') {\n this._stopTimer()\n this._startTimer()\n }\n }\n\n // --- 타이머: 초 단위 진행 ---\n\n private _startTimer() {\n this._stopTimer()\n\n const intervalMs = 1000 / this.speed\n this._timer = window.setInterval(() => {\n if (!this._currentPlayTime) return\n\n const next = new Date(this._currentPlayTime.getTime() + 1000)\n\n // 종료 시점 초과 시 정지\n if (next.getTime() > this._endTime.getTime()) {\n this._onStop()\n return\n }\n\n this._currentPlayTime = next\n this._updateSeekFromPlayTime()\n\n this.dispatchEvent(\n new CustomEvent('playback-tick', {\n detail: { currentTime: this._currentPlayTime },\n bubbles: true,\n composed: true\n })\n )\n }, intervalMs)\n }\n\n private _stopTimer() {\n if (this._timer) {\n clearInterval(this._timer)\n this._timer = undefined\n }\n }\n\n private _updateSeekFromPlayTime() {\n if (!this._currentPlayTime) return\n const from = this._startTime.getTime()\n const to = this._endTime.getTime()\n const range = to - from\n if (range <= 0) return\n this._seekValue = Math.max(0, Math.min(1000, Math.round(((this._currentPlayTime.getTime() - from) / range) * 1000)))\n }\n}\n"]}
1	+ {"version":3,"file":"ox-playback-controls.js","sourceRoot":"","sources":["../../src/ox-playback-controls.ts"],"names":[],"mappings":"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","sourcesContent":["import '@material/web/icon/icon.js'\nimport '@material/web/iconbutton/icon-button.js'\n\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\n\ntype PlaybackState = 'idle' \| 'playing' \| 'paused' \| 'stopped'\n\nconst ONE_HOUR = 3600000\n\n/*\n 플레이백 컨트롤 오버레이 바 (2행 구조)\n \n 1행: 시작 시점 설정 (datetime + ±1h 버튼) + 배속 선택\n * 2행: 재생 제어 (play/pause/stop) + 1시간 범위 시크바 + 닫기\n \n @fires playback-start - 플레이백 시작 요청 { fromTime, speed }\n * @fires playback-pause - 일시정지 요청\n * @fires playback-resume - 재개 요청\n * @fires playback-stop - 중지 요청\n * @fires playback-seek - 시크 요청 { toTime }\n * @fires playback-speed - 배속 변경 요청 { speed }\n /\n@customElement('ox-playback-controls')\nexport class PlaybackControls extends LitElement {\n static styles = css`\n :host {\n display: flex;\n justify-content: center;\n position: absolute;\n bottom: 0;\n left: 0;\n right: 0;\n z-index: 1001;\n pointer-events: none;\n }\n\n .control-bar {\n display: flex;\n flex-direction: column;\n gap: 6px;\n padding: 10px 16px;\n margin: 12px;\n max-width: 560px;\n width: 100%;\n background: rgba(0, 0, 0, 0.75);\n backdrop-filter: blur(8px);\n border-radius: 12px;\n color: #fff;\n pointer-events: auto;\n font-size: 13px;\n box-sizing: border-box;\n }\n\n / 1행: 시점 설정 + 배속 /\n .row-time {\n display: flex;\n align-items: center;\n gap: 6px;\n }\n\n md-icon-button {\n --md-icon-button-icon-color: #fff;\n --md-icon-button-hover-icon-color: #fff;\n --md-icon-button-pressed-icon-color: #fff;\n --md-icon-button-focus-icon-color: #fff;\n --md-icon-button-state-layer-color: rgba(255, 255, 255, 0.2);\n }\n\n md-icon-button:hover {\n background: rgba(255, 255, 255, 0.15);\n border-radius: 50%;\n }\n\n .row-time md-icon-button {\n --md-icon-button-icon-size: 18px;\n --md-icon-button-container-width: 32px;\n --md-icon-button-container-height: 32px;\n }\n\n .date-input {\n background: rgba(255, 255, 255, 0.15);\n border: 1px solid rgba(255, 255, 255, 0.3);\n border-radius: 6px;\n color: #fff;\n font-size: 13px;\n padding: 4px 8px;\n outline: none;\n color-scheme: dark;\n width: 130px;\n }\n\n .date-input:focus {\n border-color: rgba(255, 255, 255, 0.6);\n }\n\n .hour-select {\n background: rgba(255, 255, 255, 0.15);\n border: 1px solid rgba(255, 255, 255, 0.3);\n border-radius: 6px;\n color: #fff;\n font-size: 13px;\n padding: 4px 6px;\n outline: none;\n color-scheme: dark;\n cursor: pointer;\n }\n\n .hour-select:focus {\n border-color: rgba(255, 255, 255, 0.6);\n }\n\n .time-label {\n font-size: 12px;\n opacity: 0.7;\n white-space: nowrap;\n }\n\n .spacer {\n flex: 1;\n }\n\n .speed-group {\n display: flex;\n gap: 2px;\n }\n\n .speed-btn {\n padding: 4px 8px;\n border: 1px solid rgba(255, 255, 255, 0.3);\n border-radius: 4px;\n background: transparent;\n color: #fff;\n font-size: 12px;\n cursor: pointer;\n white-space: nowrap;\n }\n\n .speed-btn:hover {\n background: rgba(255, 255, 255, 0.15);\n }\n\n .speed-btn.active {\n background: rgba(255, 255, 255, 0.3);\n border-color: #fff;\n }\n\n / 2행: 재생 제어 + 시크바 /\n .row-seek {\n display: flex;\n align-items: center;\n gap: 8px;\n }\n\n .row-seek md-icon-button {\n --md-icon-button-icon-size: 20px;\n --md-icon-button-container-width: 36px;\n --md-icon-button-container-height: 36px;\n }\n\n .row-seek md-icon-button.primary {\n --md-icon-button-icon-size: 24px;\n --md-icon-button-container-width: 40px;\n --md-icon-button-container-height: 40px;\n }\n\n .timeline {\n flex: 1;\n display: flex;\n flex-direction: column;\n gap: 2px;\n min-width: 0;\n }\n\n .seek-track {\n position: relative;\n width: 100%;\n height: 4px;\n }\n\n .buffer-bar {\n position: absolute;\n top: 0;\n height: 100%;\n background: rgba(255, 255, 255, 0.25);\n border-radius: 2px;\n pointer-events: none;\n }\n\n .seek-bar {\n position: relative;\n width: 100%;\n height: 4px;\n -webkit-appearance: none;\n appearance: none;\n background: rgba(255, 255, 255, 0.1);\n border-radius: 2px;\n outline: none;\n cursor: pointer;\n z-index: 1;\n }\n\n .seek-bar::-webkit-slider-thumb {\n -webkit-appearance: none;\n width: 12px;\n height: 12px;\n border-radius: 50%;\n background: #fff;\n cursor: pointer;\n }\n\n .seek-labels {\n display: flex;\n justify-content: space-between;\n font-size: 11px;\n opacity: 0.8;\n }\n\n .current-time {\n font-size: 12px;\n opacity: 0.9;\n white-space: nowrap;\n min-width: 60px;\n text-align: center;\n }\n `\n\n @property({ type: String }) playbackState: PlaybackState = 'idle'\n @property({ type: Number }) speed: number = 1\n @property({ type: String }) currentTime: string = ''\n @property({ type: Array }) bufferedRanges: { from: number; to: number }[] = []\n\n /* 외부에서 전달받은 초기 시간 범위 (from만 사용, to는 from+1h로 자동 계산) /\n @property({ type: Object }) timeRange: { from: Date; to: Date } = {\n from: new Date(Date.now() - ONE_HOUR),\n to: new Date()\n }\n\n @state() private _startTime: Date = PlaybackControls._floorToHour(new Date(Date.now() - ONE_HOUR))\n @state() declare private _seekValue: number\n @state() declare private _currentPlayTime: Date \| null\n\n private _speeds = [1, 1.5, 2]\n private _timer?: number\n\n private get _endTime(): Date {\n return new Date(this._startTime.getTime() + ONE_HOUR)\n }\n\n private static _floorToHour(date: Date): Date {\n const d = new Date(date)\n d.setMinutes(0, 0, 0)\n return d\n }\n\n connectedCallback() {\n super.connectedCallback()\n this._startTime = PlaybackControls._floorToHour(this.timeRange.from)\n this._seekValue = 0\n this._currentPlayTime = null\n }\n\n disconnectedCallback() {\n super.disconnectedCallback()\n this._stopTimer()\n }\n\n updated(changes: Map<string, any>) {\n if (changes.has('timeRange') && this.timeRange) {\n this._startTime = PlaybackControls._floorToHour(this.timeRange.from)\n }\n if (changes.has('currentTime') && this.currentTime) {\n this._updateSeekPosition()\n }\n }\n\n render() {\n const isPlaying = this.playbackState === 'playing'\n const isPaused = this.playbackState === 'paused'\n const isActive = isPlaying \|\| isPaused\n\n return html`\n <div class=\"control-bar\">\n <!-- 1행: 시점 설정 + 배속 -->\n <div class=\"row-time\">\n <md-icon-button @click=${this._shiftTime(-1)} title=\"-1h\">\n <md-icon>chevron_left</md-icon>\n </md-icon-button>\n\n <input\n type=\"date\"\n class=\"date-input\"\n .value=${this._toDateString(this._startTime)}\n @change=${this._onDateChange}\n />\n\n <select class=\"hour-select\" .value=${String(this._startTime.getHours())} @change=${this._onHourChange}>\n ${Array.from({ length: 24 }, (_, i) => html`\n <option value=${i} ?selected=${this._startTime.getHours() === i}>\n ${String(i).padStart(2, '0')}:00\n </option>\n `)}\n </select>\n\n <md-icon-button @click=${this._shiftTime(1)} title=\"+1h\">\n <md-icon>chevron_right</md-icon>\n </md-icon-button>\n\n <span class=\"time-label\">~ ${String(this._endTime.getHours()).padStart(2, '0')}:00</span>\n\n <span class=\"spacer\"></span>\n\n <div class=\"speed-group\">\n ${this._speeds.map(\n s => html`\n <button class=\"speed-btn ${this.speed === s ? 'active' : ''}\" @click=${() => this._onSpeedChange(s)}>\n ×${s}\n </button>\n `\n )}\n </div>\n </div>\n\n <!-- 2행: 재생 제어 + 시크바 + 닫기 -->\n <div class=\"row-seek\">\n <md-icon-button class=\"primary\" @click=${isActive ? this._onTogglePlayPause : this._onStart}>\n <md-icon>${isPlaying ? 'pause' : 'play_arrow'}</md-icon>\n </md-icon-button>\n\n <div class=\"timeline\">\n <div class=\"seek-track\">\n ${this._renderBufferBars()}\n <input\n type=\"range\"\n class=\"seek-bar\"\n min=\"0\"\n max=\"1000\"\n .value=${String(this._seekValue)}\n @input=${this._onSeekInput}\n @change=${this._onSeekChange}\n />\n </div>\n <div class=\"seek-labels\">\n <span>${this._formatTime(this._startTime)}</span>\n <span>${this._formatTime(this._endTime)}</span>\n </div>\n </div>\n\n <span class=\"current-time\">\n ${this._currentPlayTime ? this._formatTime(this._currentPlayTime) : '--:--:--'}\n </span>\n\n <md-icon-button @click=${this._onStop}>\n <md-icon>close</md-icon>\n </md-icon-button>\n </div>\n </div>\n `\n }\n\n private _formatTime(date: Date): string {\n return date.toLocaleTimeString('ko-KR', { hour: '2-digit', minute: '2-digit', second: '2-digit', hour12: false })\n }\n\n private _toDateString(date: Date): string {\n const pad = (n: number) => String(n).padStart(2, '0')\n return `${date.getFullYear()}-${pad(date.getMonth() + 1)}-${pad(date.getDate())}`\n }\n\n private _updateSeekPosition() {\n if (!this.currentTime) return\n const current = new Date(this.currentTime).getTime()\n const from = this._startTime.getTime()\n const to = this._endTime.getTime()\n const range = to - from\n if (range <= 0) return\n this._seekValue = Math.max(0, Math.min(1000, Math.round(((current - from) / range) 1000)))\n }\n\n private _onDateChange(e: Event) {\n const value = (e.target as HTMLInputElement).value\n if (!value) return\n const [year, month, day] = value.split('-').map(Number)\n const newStart = new Date(this._startTime)\n newStart.setFullYear(year, month - 1, day)\n this._shiftStartTime(newStart)\n }\n\n private _onHourChange(e: Event) {\n const hour = Number((e.target as HTMLSelectElement).value)\n const newStart = new Date(this._startTime)\n newStart.setHours(hour, 0, 0, 0)\n this._shiftStartTime(newStart)\n }\n\n private _shiftTime(hours: number) {\n return () => {\n const newStart = new Date(this._startTime.getTime() + hours * ONE_HOUR)\n this._shiftStartTime(newStart)\n }\n }\n\n /*\n 시작 시간 변경 시 현재 재생 시간도 같은 offset만큼 이동.\n * 재생 중이면 타이머 유지.\n /\n private _shiftStartTime(newStart: Date) {\n const delta = newStart.getTime() - this._startTime.getTime()\n this._startTime = newStart\n\n if (this._currentPlayTime) {\n const shifted = new Date(this._currentPlayTime.getTime() + delta)\n const end = this._endTime\n\n // 새 범위 안에 있으면 이동, 밖이면 시작점으로\n if (shifted.getTime() >= newStart.getTime() && shifted.getTime() <= end.getTime()) {\n this._currentPlayTime = shifted\n } else {\n this._currentPlayTime = new Date(newStart)\n }\n\n this._updateSeekFromPlayTime()\n }\n }\n\n private _onStart() {\n this._currentPlayTime = new Date(this._startTime)\n this.playbackState = 'playing'\n this._startTimer()\n\n this.dispatchEvent(\n new CustomEvent('playback-start', {\n detail: { fromTime: this._startTime, speed: this.speed },\n bubbles: true,\n composed: true\n })\n )\n }\n\n private _onTogglePlayPause() {\n if (this.playbackState === 'playing') {\n this.playbackState = 'paused'\n this._stopTimer()\n this.dispatchEvent(new CustomEvent('playback-pause', { bubbles: true, composed: true }))\n } else {\n this.playbackState = 'playing'\n this._startTimer()\n this.dispatchEvent(new CustomEvent('playback-resume', { bubbles: true, composed: true }))\n }\n }\n\n private _onStop() {\n this._stopTimer()\n this._currentPlayTime = null\n this._seekValue = 0\n this.playbackState = 'idle'\n this.dispatchEvent(new CustomEvent('playback-stop', { bubbles: true, composed: true }))\n }\n\n private _onSeekInput(e: Event) {\n this._seekValue = Number((e.target as HTMLInputElement).value)\n\n // 드래그 중 현재 시간 업데이트 (비주얼 피드백)\n const ratio = this._seekValue / 1000\n const from = this._startTime.getTime()\n const to = this._endTime.getTime()\n this._currentPlayTime = new Date(from + (to - from) ratio)\n }\n\n private _onSeekChange(e: Event) {\n const ratio = Number((e.target as HTMLInputElement).value) / 1000\n const from = this._startTime.getTime()\n const to = this._endTime.getTime()\n const targetTime = new Date(from + (to - from) * ratio)\n\n this._currentPlayTime = targetTime\n\n this.dispatchEvent(\n new CustomEvent('playback-seek', {\n detail: { toTime: targetTime },\n bubbles: true,\n composed: true\n })\n )\n\n // 재생 중이었으면 새 시점에서 타이머 계속\n if (this.playbackState === 'playing') {\n this._stopTimer()\n this._startTimer()\n }\n }\n\n private _renderBufferBars() {\n if (!this.bufferedRanges?.length) return ''\n\n const from = this._startTime.getTime()\n const to = this._endTime.getTime()\n const range = to - from\n if (range <= 0) return ''\n\n return this.bufferedRanges.map(r => {\n const left = Math.max(0, (r.from - from) / range) * 100\n const right = Math.min(1, (r.to - from) / range) * 100\n const width = right - left\n return html`<div class=\"buffer-bar\" style=\"left:${left}%;width:${width}%\"></div>`\n })\n }\n\n private _onSpeedChange(speed: number) {\n this.speed = speed\n\n this.dispatchEvent(\n new CustomEvent('playback-speed', {\n detail: { speed },\n bubbles: true,\n composed: true\n })\n )\n\n // 재생 중이면 타이머 재시작 (새 속도 반영)\n if (this.playbackState === 'playing') {\n this._stopTimer()\n this._startTimer()\n }\n }\n\n // --- 타이머: 초 단위 진행 ---\n\n private _startTimer() {\n this._stopTimer()\n\n const intervalMs = 1000 / this.speed\n this._timer = window.setInterval(() => {\n if (!this._currentPlayTime) return\n\n const next = new Date(this._currentPlayTime.getTime() + 1000)\n\n // 종료 시점 초과 시 정지\n if (next.getTime() > this._endTime.getTime()) {\n this._onStop()\n return\n }\n\n this._currentPlayTime = next\n this._updateSeekFromPlayTime()\n\n this.dispatchEvent(\n new CustomEvent('playback-tick', {\n detail: { currentTime: this._currentPlayTime },\n bubbles: true,\n composed: true\n })\n )\n }, intervalMs)\n }\n\n private _stopTimer() {\n if (this._timer) {\n clearInterval(this._timer)\n this._timer = undefined\n }\n }\n\n private _updateSeekFromPlayTime() {\n if (!this._currentPlayTime) return\n const from = this._startTime.getTime()\n const to = this._endTime.getTime()\n const range = to - from\n if (range <= 0) return\n this._seekValue = Math.max(0, Math.min(1000, Math.round(((this._currentPlayTime.getTime() - from) / range) * 1000)))\n }\n}\n"]}

package/dist/src/playback/playback-engine.d.ts CHANGED Viewed

@@ -1,17 +1,10 @@
 /**
- * PlaybackEngine
+ * PlaybackEngine — YouTube 스트리밍 방식의 청크 기반 플레이백
  *
- * 서버에서 받은 시계열 데이터(snapshot + diff)를 시간순으로 재생한다.
- * snapshot/diff 구분 없이 각 프레임의 data를 그대로 scene 컴포넌트에 바인딩한다.
- *
- * 사용법:
- *   const engine = new PlaybackEngine()
- *   await engine.load(startTime, endTime)
- *   engine.attachScene(scene)
- *   engine.play(speed)
- *   engine.pause()
- *   engine.seekTo(time)
- *   engine.stop()
+ * - 10분 단위로 데이터를 fetch하여 버퍼에 적재
+ * - 남은 데이터 1분 이하 시 다음 10분 prefetch
+ * - seek 시 기존 버퍼 전체 폐기 후 fresh fetch
+ * - setInterval 기반 프레임 진행 (배속 반영)
  */
 import type { PlaybackScenario } from '@fmsim/api';
 export type PlaybackState = 'idle' | 'loading' | 'playing' | 'paused' | 'stopped';
@@ -27,6 +20,12 @@ export interface PlaybackEventMap {
         totalFrames: number;
         scenarios: string[];
     };
+    'buffer-update': {
+        bufferedRanges: {
+            from: number;
+            to: number;
+        }[];
+    };
 }
 type PlaybackListener<K extends keyof PlaybackEventMap> = (detail: PlaybackEventMap[K]) => void;
 export declare class PlaybackEngine {
@@ -38,13 +37,25 @@ export declare class PlaybackEngine {
     private _scene;
     private _scenarioNames;
     private _listeners;
+    private _fetchFn?;
+    private _totalRange?;
+    private _prefetching;
+    private _bufferedEnd;
     get state(): PlaybackState;
     get currentIndex(): number;
     get totalFrames(): number;
     get currentTime(): string | null;
     get scenarioNames(): string[];
     /**
-     * 데이터 로드. fetchPlayback을 외부에서 호출하여 결과를 전달한다.
+     * fetch 함수 주입 (페이지에서 제공)
+     */
+    setFetchFunction(fn: (startTime: string, endTime: string) => Promise<any>): void;
+    /**
+     * 청크 기반 시작: fromTime에서 10분 분량을 가져와 재생 시작
+     */
+    startChunked(fromTime: Date, endTime: Date, speed?: number): Promise<void>;
+    /**
+     * 이전 방식 호환: 전체 데이터를 한번에 로드
      */
     loadData(scenarios: PlaybackScenario[]): void;
     attachScene(scene: any): void;
@@ -55,22 +66,22 @@ export declare class PlaybackEngine {
     stop(): void;
     setSpeed(speed: number): void;
     /**
-     * 특정 시간으로 이동.
-     * 해당 시간 이하의 가장 가까운 프레임을 찾고,
-     * snapshot부터 그 프레임까지 누적 적용한다.
-     */
-    seekTo(time: Date): void;
-    /**
-     * 이벤트 리스너 등록
+     * seek — 기존 버퍼 전체 폐기 + 새 위치에서 fresh fetch
      */
+    seekTo(time: Date): Promise<void>;
     on<K extends keyof PlaybackEventMap>(event: K, listener: PlaybackListener<K>): void;
     off<K extends keyof PlaybackEventMap>(event: K, listener: PlaybackListener<K>): void;
     dispose(): void;
+    private _fetchAndAppend;
+    private _appendScenarios;
+    private _mergeScenarios;
+    private _checkPrefetch;
     private _startTimer;
     private _stopTimer;
     private _applyCurrentFrame;
     private _applyFrame;
     private _emitFrame;
+    private _emitBufferUpdate;
     private _setState;
     private _emit;
     private _formatTime;

package/dist/src/playback/playback-engine.js CHANGED Viewed

@@ -1,18 +1,13 @@
 /**
- * PlaybackEngine
+ * PlaybackEngine — YouTube 스트리밍 방식의 청크 기반 플레이백
  *
- * 서버에서 받은 시계열 데이터(snapshot + diff)를 시간순으로 재생한다.
- * snapshot/diff 구분 없이 각 프레임의 data를 그대로 scene 컴포넌트에 바인딩한다.
- *
- * 사용법:
- *   const engine = new PlaybackEngine()
- *   await engine.load(startTime, endTime)
- *   engine.attachScene(scene)
- *   engine.play(speed)
- *   engine.pause()
- *   engine.seekTo(time)
- *   engine.stop()
+ * - 10분 단위로 데이터를 fetch하여 버퍼에 적재
+ * - 남은 데이터 1분 이하 시 다음 10분 prefetch
+ * - seek 시 기존 버퍼 전체 폐기 후 fresh fetch
+ * - setInterval 기반 프레임 진행 (배속 반영)
  */
+const CHUNK_DURATION = 10 * 60 * 1000; // 10분
+const PREFETCH_THRESHOLD = 1 * 60 * 1000; // 1분
 export class PlaybackEngine {
     constructor() {
         this._state = 'idle';
@@ -22,6 +17,8 @@ export class PlaybackEngine {
         this._scene = null;
         this._scenarioNames = [];
         this._listeners = new Map();
+        this._prefetching = false;
+        this._bufferedEnd = 0;
     }
     // ── 공개 API ──
     get state() { return this._state; }
@@ -30,27 +27,40 @@ export class PlaybackEngine {
     get currentTime() { var _a, _b; return (_b = (_a = this._frames[this._currentIndex]) === null || _a === void 0 ? void 0 : _a.time) !== null && _b !== void 0 ? _b : null; }
     get scenarioNames() { return this._scenarioNames; }
     /**
-     * 데이터 로드. fetchPlayback을 외부에서 호출하여 결과를 전달한다.
+     * fetch 함수 주입 (페이지에서 제공)
      */
-    loadData(scenarios) {
+    setFetchFunction(fn) {
+        this._fetchFn = fn;
+    }
+    /**
+     * 청크 기반 시작: fromTime에서 10분 분량을 가져와 재생 시작
+     */
+    async startChunked(fromTime, endTime, speed = 1) {
+        this._stopTimer();
+        this._frames = [];
+        this._currentIndex = 0;
+        this._speed = speed;
+        this._totalRange = { from: fromTime.getTime(), to: endTime.getTime() };
+        this._bufferedEnd = 0;
+        this._prefetching = false;
         this._setState('loading');
-        this._scenarioNames = scenarios.map(s => s.scenarioName);
-        // 모든 시나리오의 프레임을 시간 기준으로 병합
-        const timeMap = new Map();
-        for (const scenario of scenarios) {
-            for (const frame of scenario.snapshots) {
-                if (!timeMap.has(frame.time)) {
-                    timeMap.set(frame.time, new Map());
-                }
-                timeMap.get(frame.time).set(scenario.scenarioName, frame.data);
-            }
+        const chunkEnd = Math.min(fromTime.getTime() + CHUNK_DURATION, endTime.getTime());
+        await this._fetchAndAppend(fromTime.getTime(), chunkEnd);
+        if (this._frames.length === 0) {
+            this._setState('stopped');
+            return;
         }
-        // 시간순 정렬
-        const sortedTimes = [...timeMap.keys()].sort();
-        this._frames = sortedTimes.map(time => ({
-            time,
-            data: timeMap.get(time)
-        }));
+        // 첫 프레임 즉시 적용
+        this._applyCurrentFrame();
+        this._setState('playing');
+        this._startTimer();
+    }
+    /**
+     * 이전 방식 호환: 전체 데이터를 한번에 로드
+     */
+    loadData(scenarios) {
+        this._setState('loading');
+        this._mergeScenarios(scenarios);
         this._currentIndex = 0;
         this._setState('stopped');
         this._emit('load-complete', {
@@ -69,7 +79,6 @@ export class PlaybackEngine {
             return;
         if (speed != null)
             this._speed = speed;
-        // 첫 프레임 즉시 적용
         this._applyCurrentFrame();
         this._setState('playing');
         this._startTimer();
@@ -87,6 +96,9 @@ export class PlaybackEngine {
     stop() {
         this._stopTimer();
         this._currentIndex = 0;
+        this._frames = [];
+        this._bufferedEnd = 0;
+        this._prefetching = false;
         this._setState('stopped');
     }
     setSpeed(speed) {
@@ -97,36 +109,47 @@ export class PlaybackEngine {
         }
     }
     /**
-     * 특정 시간으로 이동.
-     * 해당 시간 이하의 가장 가까운 프레임을 찾고,
-     * snapshot부터 그 프레임까지 누적 적용한다.
+     * seek — 기존 버퍼 전체 폐기 + 새 위치에서 fresh fetch
      */
-    seekTo(time) {
-        const target = this._formatTime(time);
-        let targetIndex = 0;
-        for (let i = 0; i < this._frames.length; i++) {
-            if (this._frames[i].time <= target) {
-                targetIndex = i;
-            }
-            else {
-                break;
+    async seekTo(time) {
+        const wasPlaying = this._state === 'playing';
+        this._stopTimer();
+        // 버퍼 전체 폐기
+        this._frames = [];
+        this._currentIndex = 0;
+        this._bufferedEnd = 0;
+        this._prefetching = false;
+        if (this._fetchFn && this._totalRange) {
+            this._setState('loading');
+            const chunkEnd = Math.min(time.getTime() + CHUNK_DURATION, this._totalRange.to);
+            await this._fetchAndAppend(time.getTime(), chunkEnd);
+            // 첫 프레임 적용
+            if (this._frames.length > 0) {
+                this._applyCurrentFrame();
+                this._emitFrame();
             }
         }
-        // snapshot(첫 프레임)부터 targetIndex까지 순차 적용
-        for (let i = 0; i <= targetIndex; i++) {
-            this._applyFrame(i);
+        else {
+            // 이전 방식: 메모리 내 탐색 (fallback, 사용되지 않음)
+            const target = this._formatTime(time);
+            for (let i = 0; i < this._frames.length; i++) {
+                if (this._frames[i].time <= target) {
+                    this._currentIndex = i;
+                }
+                else {
+                    break;
+                }
+            }
+            this._applyCurrentFrame();
         }
-        this._currentIndex = targetIndex;
-        this._emitFrame();
-        // 재생 중이었으면 타이머 재시작
-        if (this._state === 'playing') {
-            this._stopTimer();
+        if (wasPlaying && this._frames.length > 0) {
+            this._setState('playing');
             this._startTimer();
         }
+        else if (this._frames.length > 0) {
+            this._setState('paused');
+        }
     }
-    /**
-     * 이벤트 리스너 등록
-     */
     on(event, listener) {
         if (!this._listeners.has(event))
             this._listeners.set(event, new Set());
@@ -142,14 +165,90 @@ export class PlaybackEngine {
         this._frames = [];
         this._listeners.clear();
     }
-    // ── 내부 ──
+    // ── 내부: 청크 관리 ──
+    async _fetchAndAppend(fromMs, toMs) {
+        if (!this._fetchFn)
+            return;
+        try {
+            const result = await this._fetchFn(this._formatTime(new Date(fromMs)), this._formatTime(new Date(toMs)));
+            if ((result === null || result === void 0 ? void 0 : result.status) && result.playback) {
+                this._appendScenarios(result.playback.scenarios);
+                this._bufferedEnd = Math.max(this._bufferedEnd, toMs);
+                this._emitBufferUpdate();
+            }
+        }
+        catch (e) {
+            console.error('[PlaybackEngine] chunk fetch error:', e);
+            this._emit('error', String(e));
+        }
+    }
+    _appendScenarios(scenarios) {
+        if (!this._scenarioNames.length) {
+            this._scenarioNames = scenarios.map(s => s.scenarioName);
+        }
+        const existingTimes = new Set(this._frames.map(f => f.time));
+        for (const scenario of scenarios) {
+            for (const frame of scenario.snapshots) {
+                if (existingTimes.has(frame.time)) {
+                    // 기존 프레임에 시나리오 데이터 추가
+                    const existing = this._frames.find(f => f.time === frame.time);
+                    if (existing) {
+                        existing.data.set(scenario.scenarioName, frame.data);
+                    }
+                }
+                else {
+                    const data = new Map();
+                    data.set(scenario.scenarioName, frame.data);
+                    this._frames.push({
+                        time: frame.time,
+                        timeMs: new Date(frame.time.replace(' ', 'T')).getTime() || new Date(frame.time).getTime(),
+                        data
+                    });
+                    existingTimes.add(frame.time);
+                }
+            }
+        }
+        // 시간순 재정렬
+        this._frames.sort((a, b) => a.time.localeCompare(b.time));
+    }
+    _mergeScenarios(scenarios) {
+        this._scenarioNames = scenarios.map(s => s.scenarioName);
+        this._frames = [];
+        this._appendScenarios(scenarios);
+    }
+    async _checkPrefetch() {
+        if (this._prefetching || !this._fetchFn || !this._totalRange)
+            return;
+        const currentFrame = this._frames[this._currentIndex];
+        if (!currentFrame)
+            return;
+        const remaining = this._bufferedEnd - currentFrame.timeMs;
+        if (remaining <= PREFETCH_THRESHOLD && this._bufferedEnd < this._totalRange.to) {
+            this._prefetching = true;
+            try {
+                const chunkEnd = Math.min(this._bufferedEnd + CHUNK_DURATION, this._totalRange.to);
+                await this._fetchAndAppend(this._bufferedEnd, chunkEnd);
+            }
+            finally {
+                this._prefetching = false;
+            }
+        }
+    }
+    // ── 내부: 타이머 ──
     _startTimer() {
         this._stopTimer();
         const intervalMs = 1000 / this._speed;
         this._timer = window.setInterval(() => {
             this._currentIndex++;
             if (this._currentIndex >= this._frames.length) {
-                // 재생 완료
+                // 버퍼 끝 도달
+                if (this._totalRange && this._bufferedEnd < this._totalRange.to) {
+                    // 아직 더 가져올 데이터 있음 — 대기
+                    this._currentIndex = this._frames.length - 1;
+                    this._checkPrefetch();
+                    return;
+                }
+                // 전체 재생 완료
                 this._currentIndex = this._frames.length - 1;
                 this._stopTimer();
                 this._setState('stopped');
@@ -157,6 +256,8 @@ export class PlaybackEngine {
             }
             this._applyCurrentFrame();
             this._emitFrame();
+            // prefetch 체크 (비동기)
+            this._checkPrefetch();
         }, intervalMs);
     }
     _stopTimer() {
@@ -165,6 +266,7 @@ export class PlaybackEngine {
             this._timer = undefined;
         }
     }
+    // ── 내부: 프레임 적용 ──
     _applyCurrentFrame() {
         this._applyFrame(this._currentIndex);
         this._emitFrame();
@@ -195,6 +297,19 @@ export class PlaybackEngine {
             });
         }
     }
+    _emitBufferUpdate() {
+        if (!this._totalRange)
+            return;
+        const ranges = [];
+        if (this._frames.length > 0) {
+            ranges.push({
+                from: this._frames[0].timeMs,
+                to: this._bufferedEnd
+            });
+        }
+        this._emit('buffer-update', { bufferedRanges: ranges });
+    }
+    // ── 유틸 ──
     _setState(state) {
         this._state = state;
         this._emit('state-change', state);

package/dist/src/playback/playback-engine.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"playback-engine.js","sourceRoot":"","sources":["../../../src/playback/playback-engine.ts"],"names":[],"mappings":"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","sourcesContent":["/*\n PlaybackEngine\n \n 서버에서 받은 시계열 데이터(snapshot + diff)를 시간순으로 재생한다.\n * snapshot/diff 구분 없이 각 프레임의 data를 그대로 scene 컴포넌트에 바인딩한다.\n \n 사용법:\n * const engine = new PlaybackEngine()\n * await engine.load(startTime, endTime)\n * engine.attachScene(scene)\n * engine.play(speed)\n * engine.pause()\n * engine.seekTo(time)\n * engine.stop()\n /\n\nimport type { PlaybackFrame, PlaybackScenario } from '@fmsim/api'\n\nexport type PlaybackState = 'idle' \| 'loading' \| 'playing' \| 'paused' \| 'stopped'\n\nexport interface PlaybackEventMap {\n 'state-change': PlaybackState\n 'frame': { time: string; index: number; total: number }\n 'error': string\n 'load-complete': { totalFrames: number; scenarios: string[] }\n}\n\ntype PlaybackListener<K extends keyof PlaybackEventMap> = (detail: PlaybackEventMap[K]) => void\n\n/* 시간순 정렬된 통합 프레임 /\ninterface MergedFrame {\n time: string\n /* scenario → records /\n data: Map<string, any[]>\n}\n\nexport class PlaybackEngine {\n private _state: PlaybackState = 'idle'\n private _frames: MergedFrame[] = []\n private _currentIndex = 0\n private _timer?: number\n private _speed = 1\n private _scene: any = null\n private _scenarioNames: string[] = []\n private _listeners = new Map<string, Set<Function>>()\n\n // ── 공개 API ──\n\n get state(): PlaybackState { return this._state }\n get currentIndex(): number { return this._currentIndex }\n get totalFrames(): number { return this._frames.length }\n get currentTime(): string \| null { return this._frames[this._currentIndex]?.time ?? null }\n get scenarioNames(): string[] { return this._scenarioNames }\n\n /\n 데이터 로드. fetchPlayback을 외부에서 호출하여 결과를 전달한다.\n /\n loadData(scenarios: PlaybackScenario[]): void {\n this._setState('loading')\n this._scenarioNames = scenarios.map(s => s.scenarioName)\n\n // 모든 시나리오의 프레임을 시간 기준으로 병합\n const timeMap = new Map<string, Map<string, any[]>>()\n\n for (const scenario of scenarios) {\n for (const frame of scenario.snapshots) {\n if (!timeMap.has(frame.time)) {\n timeMap.set(frame.time, new Map())\n }\n timeMap.get(frame.time)!.set(scenario.scenarioName, frame.data)\n }\n }\n\n // 시간순 정렬\n const sortedTimes = [...timeMap.keys()].sort()\n this._frames = sortedTimes.map(time => ({\n time,\n data: timeMap.get(time)!\n }))\n\n this._currentIndex = 0\n this._setState('stopped')\n\n this._emit('load-complete', {\n totalFrames: this._frames.length,\n scenarios: this._scenarioNames\n })\n }\n\n attachScene(scene: any): void {\n this._scene = scene\n }\n\n detachScene(): void {\n this._scene = null\n }\n\n play(speed?: number): void {\n if (this._frames.length === 0) return\n\n if (speed != null) this._speed = speed\n\n // 첫 프레임 즉시 적용\n this._applyCurrentFrame()\n this._setState('playing')\n this._startTimer()\n }\n\n pause(): void {\n this._stopTimer()\n this._setState('paused')\n }\n\n resume(): void {\n if (this._state !== 'paused') return\n this._setState('playing')\n this._startTimer()\n }\n\n stop(): void {\n this._stopTimer()\n this._currentIndex = 0\n this._setState('stopped')\n }\n\n setSpeed(speed: number): void {\n this._speed = speed\n if (this._state === 'playing') {\n this._stopTimer()\n this._startTimer()\n }\n }\n\n /\n 특정 시간으로 이동.\n * 해당 시간 이하의 가장 가까운 프레임을 찾고,\n * snapshot부터 그 프레임까지 누적 적용한다.\n /\n seekTo(time: Date): void {\n const target = this._formatTime(time)\n let targetIndex = 0\n\n for (let i = 0; i < this._frames.length; i++) {\n if (this._frames[i].time <= target) {\n targetIndex = i\n } else {\n break\n }\n }\n\n // snapshot(첫 프레임)부터 targetIndex까지 순차 적용\n for (let i = 0; i <= targetIndex; i++) {\n this._applyFrame(i)\n }\n\n this._currentIndex = targetIndex\n this._emitFrame()\n\n // 재생 중이었으면 타이머 재시작\n if (this._state === 'playing') {\n this._stopTimer()\n this._startTimer()\n }\n }\n\n /\n 이벤트 리스너 등록\n */\n on<K extends keyof PlaybackEventMap>(event: K, listener: PlaybackListener<K>): void {\n if (!this._listeners.has(event)) this._listeners.set(event, new Set())\n this._listeners.get(event)!.add(listener)\n }\n\n off<K extends keyof PlaybackEventMap>(event: K, listener: PlaybackListener<K>): void {\n this._listeners.get(event)?.delete(listener)\n }\n\n dispose(): void {\n this._stopTimer()\n this._scene = null\n this._frames = []\n this._listeners.clear()\n }\n\n // ── 내부 ──\n\n private _startTimer(): void {\n this._stopTimer()\n const intervalMs = 1000 / this._speed\n\n this._timer = window.setInterval(() => {\n this._currentIndex++\n\n if (this._currentIndex >= this._frames.length) {\n // 재생 완료\n this._currentIndex = this._frames.length - 1\n this._stopTimer()\n this._setState('stopped')\n return\n }\n\n this._applyCurrentFrame()\n this._emitFrame()\n }, intervalMs)\n }\n\n private _stopTimer(): void {\n if (this._timer != null) {\n clearInterval(this._timer)\n this._timer = undefined\n }\n }\n\n private _applyCurrentFrame(): void {\n this._applyFrame(this._currentIndex)\n this._emitFrame()\n }\n\n private _applyFrame(index: number): void {\n const frame = this._frames[index]\n if (!frame \|\| !this._scene) return\n\n for (const [_scenarioName, records] of frame.data) {\n for (const record of records) {\n if (!record.NAME) continue\n const component = this._scene.root?.findById?.(record.NAME)\n if (component) {\n component.data = record\n }\n }\n }\n }\n\n private _emitFrame(): void {\n const frame = this._frames[this._currentIndex]\n if (frame) {\n this._emit('frame', {\n time: frame.time,\n index: this._currentIndex,\n total: this._frames.length\n })\n }\n }\n\n private _setState(state: PlaybackState): void {\n this._state = state\n this._emit('state-change', state)\n }\n\n private _emit<K extends keyof PlaybackEventMap>(event: K, detail: PlaybackEventMap[K]): void {\n const listeners = this._listeners.get(event)\n if (listeners) {\n for (const fn of listeners) {\n (fn as PlaybackListener<K>)(detail)\n }\n }\n }\n\n private _formatTime(date: Date): string {\n const pad = (n: number) => String(n).padStart(2, '0')\n return `${date.getFullYear()}-${pad(date.getMonth() + 1)}-${pad(date.getDate())} ${pad(date.getHours())}:${pad(date.getMinutes())}:${pad(date.getSeconds())}`\n }\n}\n"]}
1	+ {"version":3,"file":"playback-engine.js","sourceRoot":"","sources":["../../../src/playback/playback-engine.ts"],"names":[],"mappings":"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","sourcesContent":["/*\n PlaybackEngine — YouTube 스트리밍 방식의 청크 기반 플레이백\n \n - 10분 단위로 데이터를 fetch하여 버퍼에 적재\n * - 남은 데이터 1분 이하 시 다음 10분 prefetch\n * - seek 시 기존 버퍼 전체 폐기 후 fresh fetch\n * - setInterval 기반 프레임 진행 (배속 반영)\n /\n\nimport type { PlaybackFrame, PlaybackScenario } from '@fmsim/api'\n\nexport type PlaybackState = 'idle' \| 'loading' \| 'playing' \| 'paused' \| 'stopped'\n\nexport interface PlaybackEventMap {\n 'state-change': PlaybackState\n 'frame': { time: string; index: number; total: number }\n 'error': string\n 'load-complete': { totalFrames: number; scenarios: string[] }\n 'buffer-update': { bufferedRanges: { from: number; to: number }[] }\n}\n\ntype PlaybackListener<K extends keyof PlaybackEventMap> = (detail: PlaybackEventMap[K]) => void\n\n/* 시간순 정렬된 통합 프레임 /\ninterface MergedFrame {\n time: string\n timeMs: number\n /* scenario → records /\n data: Map<string, any[]>\n}\n\nconst CHUNK_DURATION = 10 60 * 1000 // 10분\nconst PREFETCH_THRESHOLD = 1 * 60 * 1000 // 1분\n\nexport class PlaybackEngine {\n private _state: PlaybackState = 'idle'\n private _frames: MergedFrame[] = []\n private _currentIndex = 0\n private _timer?: number\n private _speed = 1\n private _scene: any = null\n private _scenarioNames: string[] = []\n private _listeners = new Map<string, Set<Function>>()\n\n // 청크 버퍼링\n private _fetchFn?: (startTime: string, endTime: string) => Promise<any>\n private _totalRange?: { from: number; to: number }\n private _prefetching = false\n private _bufferedEnd = 0\n\n // ── 공개 API ──\n\n get state(): PlaybackState { return this._state }\n get currentIndex(): number { return this._currentIndex }\n get totalFrames(): number { return this._frames.length }\n get currentTime(): string \| null { return this._frames[this._currentIndex]?.time ?? null }\n get scenarioNames(): string[] { return this._scenarioNames }\n\n /*\n fetch 함수 주입 (페이지에서 제공)\n /\n setFetchFunction(fn: (startTime: string, endTime: string) => Promise<any>): void {\n this._fetchFn = fn\n }\n\n /\n 청크 기반 시작: fromTime에서 10분 분량을 가져와 재생 시작\n /\n async startChunked(fromTime: Date, endTime: Date, speed: number = 1): Promise<void> {\n this._stopTimer()\n this._frames = []\n this._currentIndex = 0\n this._speed = speed\n this._totalRange = { from: fromTime.getTime(), to: endTime.getTime() }\n this._bufferedEnd = 0\n this._prefetching = false\n\n this._setState('loading')\n\n const chunkEnd = Math.min(fromTime.getTime() + CHUNK_DURATION, endTime.getTime())\n await this._fetchAndAppend(fromTime.getTime(), chunkEnd)\n\n if (this._frames.length === 0) {\n this._setState('stopped')\n return\n }\n\n // 첫 프레임 즉시 적용\n this._applyCurrentFrame()\n this._setState('playing')\n this._startTimer()\n }\n\n /\n 이전 방식 호환: 전체 데이터를 한번에 로드\n /\n loadData(scenarios: PlaybackScenario[]): void {\n this._setState('loading')\n this._mergeScenarios(scenarios)\n this._currentIndex = 0\n this._setState('stopped')\n this._emit('load-complete', {\n totalFrames: this._frames.length,\n scenarios: this._scenarioNames\n })\n }\n\n attachScene(scene: any): void {\n this._scene = scene\n }\n\n detachScene(): void {\n this._scene = null\n }\n\n play(speed?: number): void {\n if (this._frames.length === 0) return\n if (speed != null) this._speed = speed\n this._applyCurrentFrame()\n this._setState('playing')\n this._startTimer()\n }\n\n pause(): void {\n this._stopTimer()\n this._setState('paused')\n }\n\n resume(): void {\n if (this._state !== 'paused') return\n this._setState('playing')\n this._startTimer()\n }\n\n stop(): void {\n this._stopTimer()\n this._currentIndex = 0\n this._frames = []\n this._bufferedEnd = 0\n this._prefetching = false\n this._setState('stopped')\n }\n\n setSpeed(speed: number): void {\n this._speed = speed\n if (this._state === 'playing') {\n this._stopTimer()\n this._startTimer()\n }\n }\n\n /\n seek — 기존 버퍼 전체 폐기 + 새 위치에서 fresh fetch\n */\n async seekTo(time: Date): Promise<void> {\n const wasPlaying = this._state === 'playing'\n this._stopTimer()\n\n // 버퍼 전체 폐기\n this._frames = []\n this._currentIndex = 0\n this._bufferedEnd = 0\n this._prefetching = false\n\n if (this._fetchFn && this._totalRange) {\n this._setState('loading')\n const chunkEnd = Math.min(time.getTime() + CHUNK_DURATION, this._totalRange.to)\n await this._fetchAndAppend(time.getTime(), chunkEnd)\n\n // 첫 프레임 적용\n if (this._frames.length > 0) {\n this._applyCurrentFrame()\n this._emitFrame()\n }\n } else {\n // 이전 방식: 메모리 내 탐색 (fallback, 사용되지 않음)\n const target = this._formatTime(time)\n for (let i = 0; i < this._frames.length; i++) {\n if (this._frames[i].time <= target) {\n this._currentIndex = i\n } else {\n break\n }\n }\n this._applyCurrentFrame()\n }\n\n if (wasPlaying && this._frames.length > 0) {\n this._setState('playing')\n this._startTimer()\n } else if (this._frames.length > 0) {\n this._setState('paused')\n }\n }\n\n on<K extends keyof PlaybackEventMap>(event: K, listener: PlaybackListener<K>): void {\n if (!this._listeners.has(event)) this._listeners.set(event, new Set())\n this._listeners.get(event)!.add(listener)\n }\n\n off<K extends keyof PlaybackEventMap>(event: K, listener: PlaybackListener<K>): void {\n this._listeners.get(event)?.delete(listener)\n }\n\n dispose(): void {\n this._stopTimer()\n this._scene = null\n this._frames = []\n this._listeners.clear()\n }\n\n // ── 내부: 청크 관리 ──\n\n private async _fetchAndAppend(fromMs: number, toMs: number): Promise<void> {\n if (!this._fetchFn) return\n\n try {\n const result = await this._fetchFn(this._formatTime(new Date(fromMs)), this._formatTime(new Date(toMs)))\n if (result?.status && result.playback) {\n this._appendScenarios(result.playback.scenarios)\n this._bufferedEnd = Math.max(this._bufferedEnd, toMs)\n this._emitBufferUpdate()\n }\n } catch (e) {\n console.error('[PlaybackEngine] chunk fetch error:', e)\n this._emit('error', String(e))\n }\n }\n\n private _appendScenarios(scenarios: PlaybackScenario[]): void {\n if (!this._scenarioNames.length) {\n this._scenarioNames = scenarios.map(s => s.scenarioName)\n }\n\n const existingTimes = new Set(this._frames.map(f => f.time))\n\n for (const scenario of scenarios) {\n for (const frame of scenario.snapshots) {\n if (existingTimes.has(frame.time)) {\n // 기존 프레임에 시나리오 데이터 추가\n const existing = this._frames.find(f => f.time === frame.time)\n if (existing) {\n existing.data.set(scenario.scenarioName, frame.data)\n }\n } else {\n const data = new Map<string, any[]>()\n data.set(scenario.scenarioName, frame.data)\n this._frames.push({\n time: frame.time,\n timeMs: new Date(frame.time.replace(' ', 'T')).getTime() \|\| new Date(frame.time).getTime(),\n data\n })\n existingTimes.add(frame.time)\n }\n }\n }\n\n // 시간순 재정렬\n this._frames.sort((a, b) => a.time.localeCompare(b.time))\n }\n\n private _mergeScenarios(scenarios: PlaybackScenario[]): void {\n this._scenarioNames = scenarios.map(s => s.scenarioName)\n this._frames = []\n this._appendScenarios(scenarios)\n }\n\n private async _checkPrefetch(): Promise<void> {\n if (this._prefetching \|\| !this._fetchFn \|\| !this._totalRange) return\n\n const currentFrame = this._frames[this._currentIndex]\n if (!currentFrame) return\n\n const remaining = this._bufferedEnd - currentFrame.timeMs\n if (remaining <= PREFETCH_THRESHOLD && this._bufferedEnd < this._totalRange.to) {\n this._prefetching = true\n try {\n const chunkEnd = Math.min(this._bufferedEnd + CHUNK_DURATION, this._totalRange.to)\n await this._fetchAndAppend(this._bufferedEnd, chunkEnd)\n } finally {\n this._prefetching = false\n }\n }\n }\n\n // ── 내부: 타이머 ──\n\n private _startTimer(): void {\n this._stopTimer()\n const intervalMs = 1000 / this._speed\n\n this._timer = window.setInterval(() => {\n this._currentIndex++\n\n if (this._currentIndex >= this._frames.length) {\n // 버퍼 끝 도달\n if (this._totalRange && this._bufferedEnd < this._totalRange.to) {\n // 아직 더 가져올 데이터 있음 — 대기\n this._currentIndex = this._frames.length - 1\n this._checkPrefetch()\n return\n }\n\n // 전체 재생 완료\n this._currentIndex = this._frames.length - 1\n this._stopTimer()\n this._setState('stopped')\n return\n }\n\n this._applyCurrentFrame()\n this._emitFrame()\n\n // prefetch 체크 (비동기)\n this._checkPrefetch()\n }, intervalMs)\n }\n\n private _stopTimer(): void {\n if (this._timer != null) {\n clearInterval(this._timer)\n this._timer = undefined\n }\n }\n\n // ── 내부: 프레임 적용 ──\n\n private _applyCurrentFrame(): void {\n this._applyFrame(this._currentIndex)\n this._emitFrame()\n }\n\n private _applyFrame(index: number): void {\n const frame = this._frames[index]\n if (!frame \|\| !this._scene) return\n\n for (const [_scenarioName, records] of frame.data) {\n for (const record of records) {\n if (!record.NAME) continue\n const component = this._scene.root?.findById?.(record.NAME)\n if (component) {\n component.data = record\n }\n }\n }\n }\n\n private _emitFrame(): void {\n const frame = this._frames[this._currentIndex]\n if (frame) {\n this._emit('frame', {\n time: frame.time,\n index: this._currentIndex,\n total: this._frames.length\n })\n }\n }\n\n private _emitBufferUpdate(): void {\n if (!this._totalRange) return\n\n const ranges: { from: number; to: number }[] = []\n if (this._frames.length > 0) {\n ranges.push({\n from: this._frames[0].timeMs,\n to: this._bufferedEnd\n })\n }\n\n this._emit('buffer-update', { bufferedRanges: ranges })\n }\n\n // ── 유틸 ──\n\n private _setState(state: PlaybackState): void {\n this._state = state\n this._emit('state-change', state)\n }\n\n private _emit<K extends keyof PlaybackEventMap>(event: K, detail: PlaybackEventMap[K]): void {\n const listeners = this._listeners.get(event)\n if (listeners) {\n for (const fn of listeners) {\n (fn as PlaybackListener<K>)(detail)\n }\n }\n }\n\n private _formatTime(date: Date): string {\n const pad = (n: number) => String(n).padStart(2, '0')\n return `${date.getFullYear()}-${pad(date.getMonth() + 1)}-${pad(date.getDate())} ${pad(date.getHours())}:${pad(date.getMinutes())}:${pad(date.getSeconds())}`\n }\n}\n"]}