#35 Show list of candidates nodules

[WGierke]

This should add an "accordion" view that shows the candidate nodules for a selected image. The candidate fields lidc_max_sensitiv, convnet_vgg, convnett_vgg_lidc, Slice still need to be implemented in the back-end.

Description

I added the front-end Vue.js implementation to display candidate nodules of an image based on the current API.

Reference to official issue

This addresses #35 .

Motivation and Context

The doctor should be able to quickly get an overview of candidate nodules including their probability of being cancer.

How Has This Been Tested?

I created two dummy candidates by letting the API return

[{		
    "centroid": {		
        "x": 54,		
        "y": 78,		
        "z": 23,		
        "series": 0		
    },		
    "probability_concerning": 0.94,		
    "case": 1		
},		
{		
   "centroid": {		
       "x": 1,		
       "y": 2,		
       "z": 3,		
       "series": 1		
    },		
    "probability_concerning": 0.94,		
    "case": 1		
}]

The outcome was

CLA

• I have signed the CLA; if other committers are in the commit history, they have signed the CLA as well

[lamby]

I wonder if this should follow the existing style to some degree?

[WGierke]

I'm not sure what you mean? Currently, the main content of a page would be overlapped at the top to some degree by the navbar. Adding some margin to the content container in base.html solves that.

[lamby]

Existing CSS code/indentation/spacing style, not the final result.. sorry for the confusion!

[WGierke]

Oh I see! Yeah, that would be way better :)

[lamby]

I think elsewhere we are using hyphens in url name attributes

[WGierke]

Thanks for the remark. I replaced all underscores in url names by hyphens.

[lamby]

{% verbatim %} always seems like a bad smell to me in Django. How come we need it?

[WGierke]

The Vue.js template syntax collides with the Django template syntax. Django would e.g. try to render following statements like Candidate {{ index + 1 }} or {{ candidate.centroid.x }} by itself, although the variables are provided by the Vue.js template language.

[lamby]

The Vue.js template syntax collides with the Django template syntax

Getcha. I was wondering if we could move the {% verbatim %} blocks to only surround the colliding javascript in that case? That would make it a bit clearer why, and implicitly so. Alternatively, we could move the JS to an external file. What do you think?

[WGierke]

Yes, I'd also prefer moving the tags so that they surround the "problematic" syntax as tightly as possible.

[WGierke]

@lamby Thanks again for your feedback! I implemented it and squashed the commits.

[lamby]

Thanks @WGierke — lamby