diff options
Diffstat (limited to 'src')
| -rw-r--r-- | src/components/TimeLine.vue | 8 | ||||
| -rw-r--r-- | src/lib.ts | 20 |
2 files changed, 24 insertions, 4 deletions
diff --git a/src/components/TimeLine.vue b/src/components/TimeLine.vue index 009abd8..30d5404 100644 --- a/src/components/TimeLine.vue +++ b/src/components/TimeLine.vue @@ -36,10 +36,10 @@ <line v-for="id in eventLines.keys()" :key="id" x1="0" y1="0" :x2="eventLines.get(id)![2]" y2="0.01" stroke="url('#eventLineGradient')" stroke-width="1px" - :stroke-dasharray="idToEvent.get(id)!.startUpper == null ? '' : '16,4'" + :stroke-dasharray="getEventPrecision(idToEvent.get(id)!) <= minorScale ? '' : '16,4'" :style="eventLineStyles(id)" class="animate-fadein"/> <!-- Note: With a fully vertical or horizontal line, nothing gets displayed --> - <!-- Note: Can't use :x2="1" and scale in style, as it makes dashed-lines non-uniform --> + <!-- Note: Can't use :x2="1" with scaling in :style="", as it makes dashed-lines non-uniform --> </svg> <!-- Events --> <div v-for="id in idToPos.keys()" :key="id" class="absolute animate-fadein" :style="eventStyles(id)"> @@ -66,8 +66,8 @@ import IconButton from './IconButton.vue'; // Icons import CloseIcon from './icon/CloseIcon.vue'; // Other -import {WRITING_MODE_HORZ, MIN_DATE, MAX_DATE, MONTH_SCALE, DAY_SCALE, SCALES, - MIN_CAL_YEAR, HistDate, CalDate, stepDate, getScaleRatio, getNumSubUnits, getUnitDiff, getDaysInMonth, +import {WRITING_MODE_HORZ, MIN_DATE, MAX_DATE, MONTH_SCALE, DAY_SCALE, SCALES, MIN_CAL_YEAR, + getDaysInMonth, HistDate, CalDate, stepDate, getScaleRatio, getNumSubUnits, getUnitDiff, getEventPrecision, moduloPositive, TimelineState, HistEvent, getImagePath} from '../lib'; import {useStore} from '../store'; import {RBTree} from '../rbtree'; @@ -473,6 +473,26 @@ export function getUnitDiff(date: HistDate, date2: HistDate, scale: number): num return date.getYearDiff(date2) / scale; } } +export function getEventPrecision(event: HistEvent): number { + // Returns smallest scale at which 'event's start-startUpper range is within one unit, or infinity + // Note: Intentionally not adding an exception for century and millenia ranges like + // 101 to 200 (as opposed to 100 to 199) being interpreted as 'within' one 100/1000-year scale unit + const {start, startUpper} = event; + if (startUpper == null || start.getDayDiff(startUpper) == 0){ + return DAY_SCALE; + } + if (start.getMonthDiff(startUpper) == 0){ + return MONTH_SCALE; + } + const yearScaleIdx = SCALES.length - 1 - 2; + for (let scaleIdx = yearScaleIdx; scaleIdx >= 0; scaleIdx--){ + const scale = SCALES[scaleIdx]; + if (Math.floor(start.year / scale) == Math.floor(startUpper.year / scale)){ + return scale; + } + } + return Number.POSITIVE_INFINITY; +} // For sending timeline-bound data to BaseLine export class TimelineState { |