Skip to content

Commit

Permalink
Ran linter
Browse files Browse the repository at this point in the history
  • Loading branch information
guzmanvig committed Jan 8, 2024
1 parent ff19e08 commit f5a53eb
Show file tree
Hide file tree
Showing 2 changed files with 17 additions and 20 deletions.
19 changes: 7 additions & 12 deletions src/Linear/Translations.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -106,7 +106,6 @@ const TranslationRow = (props: {
index={i}
/>
</>

))}
</>
);
Expand Down Expand Up @@ -293,7 +292,6 @@ class SingleNamedElementAminoacids extends React.PureComponent<SingleNamedElemen
}
}


/**
* SingleNamedElement is a single rectangular element in the SeqBlock.
* It does a bunch of stuff to avoid edge-cases from wrapping around the 0-index, edge of blocks, etc.
Expand All @@ -313,12 +311,11 @@ const SingleNamedElementHandle = (props: {
const { color, end, name, start } = element;
const { width, x: origX } = findXAndWidthElement(index, element, elements);


// 0.591 is our best approximation of Roboto Mono's aspect ratio (width / height).
const fontSize = 12;
const characterWidth = 0.591 * fontSize;
// Use at most 1/4 of the width for the name handle.
const availableCharacters = Math.floor((width / 4) / characterWidth);
const availableCharacters = Math.floor(width / 4 / characterWidth);

let displayName = name;
if (name.length > availableCharacters) {
Expand All @@ -330,23 +327,22 @@ const SingleNamedElementHandle = (props: {
displayName = `${name.slice(0, charactersToShow)}…`;
}
}



// What's needed for the display + margin at the start + margin at the end
const nameHandleMargin = 10
const nameHandleWidth = displayName.length * characterWidth + nameHandleMargin * 2
const nameHandleMargin = 10;
const nameHandleWidth = displayName.length * characterWidth + nameHandleMargin * 2;

const x = origX;
const w = width;
const height = props.height;


let linePath = ""
let linePath = "";
// First rectangle that contains the name and has the whole height
linePath += `M 0 0 L ${nameHandleWidth} 0 L ${nameHandleWidth} ${height} L 0 ${height}`;
// Second rectangle with half the height and centered
linePath += `M ${nameHandleWidth} ${height / 4} L ${w} ${height / 4} L ${w} ${3 * height / 4} L ${nameHandleWidth} ${3 * height / 4}`;
linePath += `M ${nameHandleWidth} ${height / 4} L ${w} ${height / 4} L ${w} ${
(3 * height) / 4
} L ${nameHandleWidth} ${(3 * height) / 4}`;

return (
<g
Expand Down Expand Up @@ -404,4 +400,3 @@ const SingleNamedElementHandle = (props: {
</g>
);
};

18 changes: 10 additions & 8 deletions src/SeqViz.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -456,14 +456,16 @@ export default class SeqViz extends React.Component<SeqVizProps, SeqVizState> {
rotateOnScroll: !!this.props.rotateOnScroll,
showComplement: (!!compSeq && (typeof showComplement !== "undefined" ? showComplement : true)) || false,
showIndex: !!showIndex,
translations: (translations || []).map((t, i): { direction: 1 | -1; end: number; start: number, color: string, id: string, name: string } => ({
direction: t.direction ? (t.direction < 0 ? -1 : 1) : 1,
end: seqType === "aa" ? t.end : t.start + Math.floor((t.end - t.start) / 3) * 3,
start: t.start % seq.length,
color: t.color || colorByIndex(i, COLORS),
id: `translation${t.name}${i}${t.start}${t.end}`,
name: t.name || `${t.start}-${t.end}`
})),
translations: (translations || []).map(
(t, i): { direction: 1 | -1; end: number; start: number; color: string; id: string; name: string } => ({
direction: t.direction ? (t.direction < 0 ? -1 : 1) : 1,
end: seqType === "aa" ? t.end : t.start + Math.floor((t.end - t.start) / 3) * 3,
start: t.start % seq.length,
color: t.color || colorByIndex(i, COLORS),
id: `translation${t.name}${i}${t.start}${t.end}`,
name: t.name || `${t.start}-${t.end}`,
})
),
viewer: this.props.viewer || "both",
zoom: {
circular: typeof zoom?.circular == "number" ? Math.min(Math.max(zoom.circular, 0), 100) : 0,
Expand Down

0 comments on commit f5a53eb

Please sign in to comment.