-
Notifications
You must be signed in to change notification settings - Fork 2
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
std score colors and ref/info changes
- Loading branch information
Showing
19 changed files
with
244 additions
and
152 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,10 @@ | ||
| export function Info(props: {text?: string}) { | ||
| if (props.text === null) | ||
| return <></> | ||
| return <div className="info" title={props.text}></div> | ||
| } | ||
|
|
||
| export const pubmedRef = (id: number) => { | ||
| return <sup><a href={`http://www.ncbi.nlm.nih.gov/pubmed/${id}`} target="_blank" | ||
| rel="noreferrer" title={`Source: PubMed ID ${id}`}>ref</a></sup> | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
24 changes: 13 additions & 11 deletions
24
src/ui/components/function/prediction/AlphaMissensePred.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,43 +1,56 @@ | ||
| import tinygradient from "tinygradient"; | ||
| import {ESMScore} from "../../../../types/MappingResponse"; | ||
| import {getPredRef, PredAttr, PUBMED_ID} from "./Prediction"; | ||
| import { | ||
| PredAttr, | ||
| PUBMED_ID | ||
| } from "./Prediction"; | ||
| import Spaces from "../../../elements/Spaces"; | ||
| import {STD_BENIGN_COLOR, STD_PATHOGENIC_COLOR, STD_UNCERTAIN_COLOR} from "./PredConstants"; | ||
| import {Info, pubmedRef} from "../../common/Common"; | ||
|
|
||
| // James: A score of -7.5 appears to be used for pathogenicity in ESM1b. I am not sure we can say that 0--7.5 is benign though. | ||
| // Perhaps just leave those blank for now and just label the ones -7.5 and below. | ||
| // likely pathogenic (yellow) -25 <------> 0 likely benign (blue) | ||
| export const ESM_SCORE_ATTR: PredAttr[] = [ | ||
| {color: '#460556', title: 'pathogenic' }, | ||
| {color: '#218c8f', title: '' }, | ||
| {color: '#f9e725', title: '' } // maybe benign | ||
| {color: '#460556', stdColor: STD_BENIGN_COLOR , title: 'benign', info: '-5 to 0 likely benign' }, | ||
| {color: '#218c8f', stdColor: STD_UNCERTAIN_COLOR, title: 'uncertain', info: '-10 to -5 uncertain significance' }, | ||
| {color: '#f9e725', stdColor: STD_PATHOGENIC_COLOR, title: 'pathogenic', info: '-25 to -10 likely pathogenic' } | ||
| ] | ||
|
|
||
| export const ESM_MAX_SCORE = -25 | ||
| export const ESM_PATHOGENIC_SCORE = -7.5 | ||
|
|
||
| export const ESM_COLOUR_GRADIENT = tinygradient(ESM_SCORE_ATTR.map(s => s.color)); | ||
|
|
||
| export const EsmPred = (props: { esm?: ESMScore }) => { | ||
| export const EsmPred = (props: { esm?: ESMScore, stdColor: boolean }) => { | ||
| if (props.esm === undefined || props.esm === null) { | ||
| return <></> | ||
| } | ||
| return <div className="aa-pred"> | ||
| <div>ESM-1b {getPredRef(PUBMED_ID.ESM)}</div> | ||
| <div>ESM-1b {pubmedRef(PUBMED_ID.ESM)}</div> | ||
| <div>{props.esm.score}</div> | ||
| <div><EsmPredIcon esmScore={props.esm}/></div> | ||
| <div><EsmPredIcon {...props}/></div> | ||
| </div> | ||
| } | ||
|
|
||
| function EsmPredIcon(props: {esmScore?: ESMScore}) { | ||
| if (props.esmScore) { | ||
| let title = ''; | ||
| if (props.esmScore.score < ESM_PATHOGENIC_SCORE) { | ||
| title = ESM_SCORE_ATTR[0].title | ||
| } | ||
| const colorAtPos = ESM_COLOUR_GRADIENT.rgbAt(props.esmScore.score/ ESM_MAX_SCORE).toHexString() | ||
| function EsmPredIcon(props: {esm?: ESMScore, stdColor: boolean }) { | ||
| if (props.esm) { | ||
| const colorGrad = tinygradient(ESM_SCORE_ATTR.map(s => (props.stdColor ? s.stdColor : s.color))); | ||
| const colorAtPos = colorGrad.rgbAt(props.esm.score/ ESM_MAX_SCORE).toHexString() | ||
| const esmAttr = esmScoreAttr(props.esm.score) | ||
| return <> | ||
| <i className="bi bi-circle-fill" style={{color: colorAtPos}}></i> | ||
| <Spaces/>{title} | ||
| <Spaces/>{esmAttr && <> | ||
| {esmAttr.title} | ||
| <Info text={esmAttr.info}/> | ||
| </>} | ||
| </> | ||
| } | ||
| return <></> | ||
| } | ||
|
|
||
| function esmScoreAttr(score: number) { | ||
| if (score >= -5 && score < 0) { | ||
| return ESM_SCORE_ATTR[0] | ||
| } else if (score >= -10 && score < -5) { | ||
| return ESM_SCORE_ATTR[1] | ||
| } else if (score >= -25 && score < -10) { | ||
| return ESM_SCORE_ATTR[2] | ||
| } | ||
| return null | ||
| } |
Oops, something went wrong.