RadioLogicCreator HTML

The HTML 5 code for the RadioLogicCreator homepage is located in the folder /RadioLogic/WebApplication/. The jQuery Mobile framework is used to build the different elements of the webpage displayed below:

The RadioLogicCreator home-page is composed of three items:

• a page-header with the title RadioLogicCreator, a button Orthanc in the left corner and a button Jobs in the rigth corner
• a page-footer with the copyright
• a main-container segmented in three sections

Top Section

The top section contains three columns:

1. logo
2. text input field for author; output fields for case type and info messages
3. text input fields for clininical case name and description; output field for DICOM ID; switch button to select or upload DICOM files

Mid Section

The mid section contains two columns:

1. text input fields for possible diagnoses 0, 2, 4, 6, 8
2. text input fields for possible diagnoses 1, 3, 5, 7, 9

Bottom Section

The bottom section contains four columns:

1. observation picture selector
2. answer picture selector
3. text input fields for correct diagnosis, scramble key and date; buttons for validation and submission
4. DICOM files selector; drop zone for DICOM folders; text field to display list of DICOM files

The following figure shows the sections and columns with different colors.

The segmentation of the content is specified with jQuery Mobile grids and blocks.

The CSS code of the RadioLogicCreator webpage is shown in the next chapter.