summaryrefslogtreecommitdiff
path: root/animism-align/frontend/views/align/components/timeline/ticks.component.js
diff options
context:
space:
mode:
authorJules Laplace <julescarbon@gmail.com>2020-07-22 14:05:15 +0200
committerJules Laplace <julescarbon@gmail.com>2020-07-22 14:05:15 +0200
commitef78bc6a084f92b4794e987b5832240d85b6479e (patch)
treeb314b630800db6aa60f28ef0b115625e6ca176db /animism-align/frontend/views/align/components/timeline/ticks.component.js
parent85d4cb9addf9ca887d3440b2786665d67d9917c4 (diff)
refactor app using babel module-resolver
Diffstat (limited to 'animism-align/frontend/views/align/components/timeline/ticks.component.js')
-rw-r--r--animism-align/frontend/views/align/components/timeline/ticks.component.js88
1 files changed, 0 insertions, 88 deletions
diff --git a/animism-align/frontend/views/align/components/timeline/ticks.component.js b/animism-align/frontend/views/align/components/timeline/ticks.component.js
deleted file mode 100644
index 747fb7a..0000000
--- a/animism-align/frontend/views/align/components/timeline/ticks.component.js
+++ /dev/null
@@ -1,88 +0,0 @@
-import React, { Component } from 'react'
-
-import { ZOOM_STEPS, ZOOM_LABEL_STEPS, ZOOM_TICK_STEPS, INNER_HEIGHT } from '../../constants'
-import { timestamp } from '../../../../util'
-
-export default class Ticks extends Component {
- render() {
- let { start_ts, zoom, duration } = this.props.timeline
-
- let secondsPerPixel = ZOOM_STEPS[zoom] * 0.1 // 0.1 sec / step
-
- let widthTimeDuration = INNER_HEIGHT * secondsPerPixel // secs per pixel
-
- let timeMin = start_ts
- let timeMax = Math.min(start_ts + widthTimeDuration, duration)
- let timeWidth = timeMax - timeMin
-
- let pixelMin = timeMin / secondsPerPixel
-
- let secondsPerLabel = ZOOM_LABEL_STEPS[zoom] // secs
- let pixelsPerLabel = secondsPerLabel / secondsPerPixel
- let secondsPerTick = ZOOM_TICK_STEPS[zoom]
- let pixelsPerTick = secondsPerTick / secondsPerPixel
-
- let startOffset = pixelsPerLabel - (pixelMin % pixelsPerLabel)
- let startTiming = (pixelMin + startOffset) * secondsPerPixel
-
- let labelCount = Math.ceil(INNER_HEIGHT / pixelsPerLabel) + 1
- let offset, timing, tickLabels = [], ticks = []
- for (var i = -1; i < labelCount; i++) {
- offset = i * pixelsPerLabel + startOffset
- if (offset > INNER_HEIGHT) continue
- timing = i * secondsPerLabel + startTiming
- if (timing > duration) {
- break
- }
- tickLabels.push(
- <div className='tickLabel' key={"tickLabel_" + i}
- style={{
- top: Math.floor(offset)
- }}>
- {timestamp(timing)}
- </div>
- )
- }
-
- let durationOffset = duration / secondsPerPixel - pixelMin
- if (timing > duration) {
- tickLabels.push(
- <div className='tickLabel tickLabelTotal' key={"tickLabel_total"}
- style={{
- top: durationOffset
- }}>
- {timestamp(duration, 1)}
- </div>
- )
- ticks.push(
- <div className='tick' key={"tick_total"}
- style={{
- top: Math.floor(durationOffset),
- }}
- />
- )
- }
- let tickCount = Math.ceil(INNER_HEIGHT / pixelsPerTick) + 6
- for (var i = 0; i < tickCount; i += 1) {
- offset = i * pixelsPerTick + startOffset - pixelsPerLabel
- if (offset > durationOffset) {
- break
- }
- ticks.push(
- <div className='tick' key={"tick_" + i}
- style={{
- top: Math.floor(offset),
- }}
- />
- )
- }
- // console.log(ticks.length)
-
- return (
- <div className='ticks'>
- {ticks}
- {tickLabels}
- </div>
- )
- }
-}