suzanne.soy/pagraphcontrol
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Highlight volumes > base & norm on volume thumbnails

Browse Source
This commit is contained in:
futpib 2018-11-15 18:50:00 +03:00
parent d248870185
commit a57ff7cc08
2 changed files with 41 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

46
components/graph/index.js
View File

@ -8,6 +8,7 @@ const {
forEach, forEach,
merge, merge,
repeat, repeat,
defaultTo,
} = require('ramda'); } = require('ramda');
const React = require('react'); const React = require('react');
@ -219,7 +220,8 @@ const VolumeThumbnail = ({ pai, state }) => {
if (state.preferences.hideVolumeThumbnails) { if (state.preferences.hideVolumeThumbnails) {
return r(React.Fragment); return r(React.Fragment);
} }
const { baseVolume } = pai; const normVolume = PA_VOLUME_NORM;
const baseVolume = defaultTo(normVolume, pai && pai.baseVolume);
const volumes = getVolumesForThumbnail({ pai, state }); const volumes = getVolumesForThumbnail({ pai, state });
const muted = !pai || pai.muted; const muted = !pai || pai.muted;
@ -246,8 +248,8 @@ const VolumeThumbnail = ({ pai, state }) => {
baseVolume && r.line({ baseVolume && r.line({
className: 'volume-thumbnail-ruler-line', className: 'volume-thumbnail-ruler-line',
x1: padding + ((baseVolume / PA_VOLUME_NORM) * width), x1: padding + ((baseVolume / normVolume) * width),
x2: padding + ((baseVolume / PA_VOLUME_NORM) * width), x2: padding + ((baseVolume / normVolume) * width),
y1: padding, y1: padding,
y2: padding + height, y2: padding + height,
}), }),
@ -260,13 +262,37 @@ const VolumeThumbnail = ({ pai, state }) => {
y2: padding + height, y2: padding + height,
}), }),
...volumes.map((v, i) => r.line({ ...volumes.map((v, i) => {
className: 'volume-thumbnail-volume-line', const a = Math.min(v / normVolume, baseVolume / normVolume);
x1: padding, const b = Math.min(v / normVolume, 1);
x2: padding + ((v / PA_VOLUME_NORM) * width), const c = v / normVolume;
y1: padding + ((1 + i) * step),
y2: padding + ((1 + i) * step), return r(React.Fragment, [
})), r.line({
className: 'volume-thumbnail-volume-line',
x1: padding,
x2: padding + (a * width),
y1: padding + ((1 + i) * step),
y2: padding + ((1 + i) * step),
}),
r.line({
className: 'volume-thumbnail-volume-line volume-thumbnail-volume-line-warning',
x1: padding + (a * width),
x2: padding + (b * width),
y1: padding + ((1 + i) * step),
y2: padding + ((1 + i) * step),
}),
r.line({
className: 'volume-thumbnail-volume-line volume-thumbnail-volume-line-error',
x1: padding + (b * width),
x2: padding + (c * width),
y1: padding + ((1 + i) * step),
y2: padding + ((1 + i) * step),
}),
]);
}),
]); ]);
}; };

7
index.css
View File

@ -234,8 +234,11 @@ div {
stroke-width: 2px; stroke-width: 2px;
stroke: var(--successColor); stroke: var(--successColor);
} }
.node.selected .volume-thumbnail-volume-line { .volume-thumbnail-volume-line-warning {
stroke: var(--themeSelectedFgColor) stroke: var(--warningColor)
}
.volume-thumbnail-volume-line-error {
stroke: var(--errorColor)
} }
.volume-thumbnail-muted .volume-thumbnail-volume-line { .volume-thumbnail-muted .volume-thumbnail-volume-line {