Patient Timeline Improvements

[Luke-Sikina]

Fix cBioPortal/cbioportal#6882

Describe changes proposed in this pull request:

• Add TSV download
• Update version of clinical-timeline to 0.0.30. This comes with the following enhancements:
  • Cut off circles
    • Issue: mousing over points on the bottom lane of the
      timeline caused them to be cut off when they expanded.
    • Fix: added 3 pixels to the height of the svg

Test with

https://deploy-preview-2950--cbioportalfrontend.netlify.com/patient?caseId=P29&studyId=lgg_ucsf_2014#navCaseIds=lgg_ucsf_2014:P01,lgg_ucsf_2014:P02,lgg_ucsf_2014:P04,lgg_ucsf_2014:P05,lgg_ucsf_2014:P06,lgg_ucsf_2014:P07,lgg_ucsf_2014:P08,lgg_ucsf_2014:P09,lgg_ucsf_2014:P10,lgg_ucsf_2014:P11,lgg_ucsf_2014:P12,lgg_ucsf_2014:P13,lgg_ucsf_2014:P15,lgg_ucsf_2014:P16,lgg_ucsf_2014:P17,lgg_ucsf_2014:P18,lgg_ucsf_2014:P21,lgg_ucsf_2014:P24,lgg_ucsf_2014:P25,lgg_ucsf_2014:P26,lgg_ucsf_2014:P27,lgg_ucsf_2014:P28,lgg_ucsf_2014:P29

Also possible to test on private portals:

localStorage.clear()
localStorage.netlify = 'deploy-preview-2950--cbioportalfrontend'

And refresh the page

[inodb]

Nice work!

Not sure if this should be part of the work but i noticed some issues with how the ticks behave at different levels of zoom. It works for the default example here: https://rawgit.com/cBioPortal/clinical-timeline/master/index.html. But not for the other example JSON we exchanged before (see slack convo). Occasionally the number of ticks calculation seems really off. E.g. if I zoom in to a really tiny part I can never get the ticks to show up every 1 day for instance (smallest tick size seems to be 10 days?).

Ideally the ticks would be readjusted 👆

It might be that the JSON example triggers a particular corner case

[jjgao]

How can I test this one?

[inodb]

Hey @Luke-Sikina - is this the PR we should be testing? The deploy preview on Netlify doesn't seem to be working

[inodb]

Hi @Luke-Sikina - somehow the zoom doesn't seem to be working for me?

https://deploy-preview-2950--cbioportalfrontend.netlify.com/patient/summary?caseId=P04&studyId=lgg_ucsf_2014

The TSV download seems to be working well 👍

[inodb]

@Luke-Sikina Noticed some missing parts in the TSV:

Might be good to follow the input spec for the TSV i.e. the data that goes into cBioPortal can be the same format as if u download it from the timeline:

https://docs.cbioportal.org/5.1-data-loading/data-loading/file-formats#timeline-data

I see for instance for P04 that the field Medical Therapy is missing:

https://deploy-preview-2950--cbioportalfrontend.netlify.com/patient/summary?caseId=P04&studyId=lgg_ucsf_2014

The raw input data for that study is here:

https://github.com/cBioPortal/datahub/tree/master/public/lgg_ucsf_2014

I'm not sure if there's a reason for having each track in a separate TSVs there. For a single patient that's prolly not necessary

UPDATE: I don't think this is a show stopper tho. If zoom works that's great and some form of TSV download is better than no TSV download at all

[inodb]

Thanks a ton @Luke-Sikina! Looks great!

Some things I found:

• the ticks look good now but it might be nice to use .y.m.d formatting of the ticks when they get > 1 month. E.g. here you see 1200+ days, which would be more comprehensible as something like 1y3m15d. Not sure how tricky this is. There should be a function that in the clinical timeline that does that calculation

  

• would be nice if the brush had a different color than black e.g. gray or blueish. Similar to the study view

• the font for scroll/drag is a little off somehow (like it's not that sharp/crisp):

  

• there's this kind of strange effect because the scroll/drag text is not part of the mouseover event:

  

• Found some issue with how the beginning+ending is calculated. https://deploy-preview-2950--cbioportalfrontend.netlify.com/patient/summary?caseId=P04&studyId=lgg_ucsf_2014

  

I'm not too worried about most of these. We can file them as a new issue. The first two and the last issue would prolly be good to fix before release. If it turns out some of those are really tricky to fix we can maybe do some workaround. Like enable zoom on demand and indicate that it's in beta or something

[Luke-Sikina]

@inodb I think I've fixed all the issues. The PR for the timeline repo is here: cBioPortal/clinical-timeline#122

One small note: using patient P04 to test trimming wont work well. There was an issue where the initial timeline wasn't getting trimmed, but when you zoomed in and out the timeline would trim. I fixed that, but P04 was an example where it was happening, so now it doesn't. P18 from the same study should be a better candidate.

[tmazor]

@Luke-Sikina There are a few issues with download of the timeline images:

1. If I have zoomed in, the "zoom out" text is visible in the download. Can it be removed?
2. The zig-zag (when present) doesn't download nicely
   
3. The time labels overlap each other a little bit in the website, and a lot when downloaded
   

The above were tested with P17 (the last one after expanding the zig-zag)
https://deploy-preview-2950--cbioportalfrontend.netlify.com/patient/summary?caseId=P17&studyId=lgg_ucsf_2014

[Luke-Sikina]

@tmazor
This is ready for you to test again: https://deploy-preview-2950--cbioportalfrontend.netlify.com/patient?studyId=lgg_ucsf_2014&caseId=P17

The zooming logic has been improved, nothing breaks when you zoom on the edge, and single click zooming works as you expected.
I couldn't fix the pdf issues- those were already broken, so we'll look to fix them in another pull request

[tmazor]

@Luke-Sikina The single click zoom is great!

A few things:

• In the link you provided above, I clicked to zoom on the right side of the plot (so the zig-zag timeline compression was still visible), and then clicked on the zig-zag to expand, at which point the "zoom out" button disappears.
• It appears to only be possible to zoom in once. Can we enable a user to zoom in and then zoom in some more?
• For this case: https://deploy-preview-2950--cbioportalfrontend.netlify.com/patient?studyId=lgg_ucsf_2014&caseId=P18
  If I click-and-drag to zoom in from 0-1y, what appears is only 0-~6months

[inodb]

Thanks so much for reviewing @tmazor !

We are hoping to release this soon. I thought it might be ok to release this without your last two comments fixed and follow up on those later. I've filed the last two things as separate issues: cBioPortal/cbioportal#7325 cBioPortal/cbioportal#7326

Let me know if you think that makes sense and if there's anything else that is required to be fixed before rolling out. Thank you!

[inodb]

Decided to disable zoom for now because we still found issues unfortunately. We will merge the other fixes & updates

[inodb]

Decided to disable zoom for now because we still found issues unfortunately. We will merge the other fixes & updates 👍