UserOfficeProject / issue-tracker

Shared place for features and bugs from all collaborators.
0 stars 0 forks source link

Implement the layout for ISIS in the proposal submission software #614

Closed TickleThePanda closed 2 years ago

TickleThePanda commented 2 years ago

Using the results of #249 and #613, implement the layout for ISIS.

We should consider whether we want to also add this to version control somewhere.

TickleThePanda commented 2 years ago

Can we delay the completion of this until October?

TickleThePanda commented 2 years ago

Defined layout: https://github.com/UserOfficeProject/user-office-project-issue-tracker/issues/249#issuecomment-1204044218

TickleThePanda commented 2 years ago

Example layout

<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Open+Sans:ital,wdth,wght@0,75..100,400..700;1,75..100,400..700&display=swap" rel="stylesheet">

<style>

body {
  font-family: "Open Sans", sans;
  font-stretch: 85%;
}

@page {
  margin: 0.5cm;
  margin-top: 2cm;
}

strong {
  font-weight: 600;
}

h1,h2,h3,h4,h5,h6 {
  margin: 0;
}

h1 {
  font-size: 1.2rem;
  padding-bottom: 0.2em;
}

h2 {
  font-size: 1.1rem;
  padding-bottom: 0.2em;
}

.content {
  font-size: 1rem;
  line-height: 1.1;
}

small {
  font-size: 0.75rem;
}

p {
  margin: 0;
  margin-top: 0.2em;
}

.request {
  padding-top: 0.2em;
  display: flex;
  gap: 1em;
}

.request h2 {
  font-size: 1rem;
}

.request p {
  margin-top: 0;
}

section::after {
  content: "";
  display: block;
  border-bottom: 1px #aaaaaa solid;
  padding-top: 0.35rem;
  margin-bottom: 0.35rem;
}

section:last-child::after {
  content: none;
}

.page {
  page-break-after: always;
}

</style>
<div class="content">
  <div class="page">
    <h1>{{ proposal.proposalId }}: {{ proposal.title }}</h1>
    <section>
      <p>{{ answers.direct_access_route }}
        {{#if answers.previous_reference_number}}
          ({{ answers.previous_reference_number }})
        {{/if}}
      <p>{{ answers.Resubmission_Reason }}
        <p><strong>Principal Investigator:</strong> {{ principalInvestigator.preferredname }} ({{ principalInvestigator.organisation }}) 
        {{#each coProposers}}
          <p><strong>Co Investigator:</strong> {{ preferredname }} ({{ organisation }})
        {{/each}}
      <p><strong>Science Programmes:</strong> {{ answers.Proposal_Programmes }}
      <div class="request">
        <div class="request__part">
          <strong>Technique</strong>
          <p>{{ answers.scientific_technique }}
        </div>
        <div class="request__part">
          <strong>Instrument</strong>
          <p>
            {{ answers.instrument_small_angle_scattering }}
            {{ answers.instrument_muon }}
            {{ answers.instrument_electronics_irradiation }}
            {{ answers.instrument_inelastic_scattering }}
            {{ answers.instrument_quasi_elastic_scattering }}
            {{ answers.instrument_vibrational_spectroscopy }}
            {{ answers.instrument_liquid_defraction }}
            {{ answers.instrument_engineering }}
            {{ answers.instrument_defraction }}
            {{ answers.instrument_reflectometry }}
            {{ answers.instrument_excitations }}
            {{ answers.instrument_imaging }}
        </div>
        <div class="request__part">
          <strong>Days</strong>
          <p>{{ answers.days_requested.value }}
        </div>
      </div>
    </section>
    {{#if answers.other_recent_facility_submission }}
      <section>
        <strong>Similar submission:</strong> {{ answers.other_recent_facility_submission }}
      </section>
    {{/if}}
    <section>
      <h2>Grants</h2>
      {{#each answers.Research_Grants}}
        <p>
        <strong>
          {{#if other_funding_body}}
            {{ other_funding_body }}:
          {{else}}
            {{ Funding_Body }}:
          {{/if}}
        </strong>
        {{generic_template_basis}} <small>{{Grant_Objectives}}</small>
      {{/each}}
      {{#if answers.phd_details}}
        <p><strong>PhD:</strong> {{ answers.phd_details }}
      {{/if}}
      {{#if answers.other_support}}
        <p><strong>Other support:</strong> {{ answers.other_support }}
      {{/if}}
      <p><strong>Indian funding?</strong> {{ answers.indian_funding }}
    </section>
    <section>
      <h2>Publications</h2>
      {{#each answers.Associated_Publications}}
        <p>{{ publication_year }}. {{ publication_author }}. {{ publication_doi }}
      {{/each}}
    </section>
    <section>
      <h2>Abstract</h2>
      {{ proposal.abstract }}
    </section>
  </div>
  <div class="page">
    <section>
      <h2>Technique: {{ answers.scientific_technique }}</h2>

      {{#if answers.instrument_small_angle_scattering}}
        <p><strong>Instrument:</strong> {{ answers.instrument_small_angle_scattering }}
        <p><strong>Lengthscale range:</strong> {{ answers.samepl_lengthscale_text_input }}
        <p><strong>SESANS?</strong> {{ answers.sesans_options }}
        <p><strong>Already been measured?</strong> {{ answers.sans_measurement_yn }}
        <p><strong>Measure needed at ISIS?</strong> {{ answers.sans_measurement_required_yn }}
        <p><strong>Polarised SANS?</strong> {{ answers.polarised_sans_yn }}
      {{/if}}

      {{#if answers.instrument_muon}}
        <p><strong>Instrument:</strong> {{ answers.instrument_muon }}
        <p><strong>Capabilities:</strong> {{ answers.muons_capabilities_mc }}
        <p><strong>Other capabilities:</strong> {{ answers.muons_capabilities_other_text }}
        <p><strong>Beam type:</strong> {{ answers.muons_single_double_beam_mc }}
      {{/if}}

      {{#if answers.instrument_electronics_irradiation}}
        <p><strong>Instrument:</strong> {{ answers.instrument_electronics_irradiation }}
        <p><strong>Irradiation type:</strong> {{ answers.electronics_irradiation_mc }}
        <p><strong>Neutron option?</strong> {{ answers.electronics_irradiation_neutrons_mc }}
      {{/if}}

      {{#if answers.instrument_inelastic_scattering}}
        <p><strong>Instrument:</strong> {{ answers.instrument_inelastic_scattering }}
        <p><strong>Contains metals?</strong> {{ answers.deep_inelastic_metal_yn }}
        <p><strong>Weak scatterer?</strong> {{ answers.deep_inelastic_weak_scat }}
      {{/if}}

      {{#if answers.instrument_quasi_elastic_scattering}}
        <p><strong>Instrument:</strong> {{ answers.instrument_quasi_elastic_scattering }}
        <p><strong>Weak scatterer?</strong> {{ answers.qe_scattering_sample_mc }}
        <p><strong>Multiple energy ranges?</strong> {{ answers.qe_scattering_energy_ranges_mc }}
        <p><strong>Polarised neutrons?</strong> {{ answers.qe_scattering_polarised_neutrons_mc }}
        <p><strong>Energy resolution:</strong> {{ answers.qe_scattering_energy_resolution_text }}
        <p><strong>Energy range:</strong> {{ answers.qe_scattering_energy_range_text }}
        <p><strong>Q-range:</strong> {{ answers.qe_scattering_q_range_text }}
        <p><strong>Magnet?</strong> {{ answers.qe_scattering_magnet_mc }}
      {{/if}}

      {{#if answers.instrument_vibrational_spectroscopy}}
        <p><strong>Instrument:</strong> {{ answers.instrument_vibrational_spectroscopy }}
        <p><strong>Energy range:</strong> {{ answers.spectroscopy_energy_range_mc }}
      {{/if}}

      {{#if answers.instrument_liquid_defraction}}
        <p><strong>Instrument:</strong> {{ answers.instrument_liquid_defraction }}
        <p><strong>Cell geometry:</strong> {{ answers.diffraction_cell_geometry }}
        <p><strong>Cell material:</strong> {{ answers.diffraction_materials_mc }}
        <p><strong>Q-range:</strong> {{ answers.diffraction_q_range_text }}
        <p><strong>Q-resolution:</strong> {{ answers.diffraction_q_resolution_text }}
        <p><strong>Samples/state points:</strong> {{ answers.diffraction_samples_text }}
      {{/if}}

      {{#if answers.instrument_engineering}}
        <p><strong>Instrument:</strong> {{ answers.instrument_engineering }}
        <p><strong>Collimator size:</strong> {{ answers.engineering_enginx_cillimator_size_mc }} {{ answers.engineering_imat_cillimator_size_mc }}
      {{/if}}

      {{#if answers.instrument_defraction}}
        <p><strong>Instrument:</strong> {{ answers.instrument_defraction }}
        <p><strong>Crystal symmetry:</strong> {{ answers.crystal_symmetry }}
        <p><strong>Crystal cell dimensions:</strong>
        <p>a: {{ answers.Cell_Parameter_A.value }}, b: {{ answers.Cell_Parameter_B.value }}, c: {{ answers.Cell_Parameter_C.value }}
        <p>alpha: {{ answers.Cell_Parameter_Alpha.value }}, beta: {{ answers.Cell_Parameter_Beta.value }}, gamma: {{ answers.Cell_Parameter_Gamma_.value }}
        <p>volume: {{ answers.Cell_Parameter_Volume.value }}
      {{/if}}

      {{#if answers.instrument_reflectometry}}
        <p><strong>Instrument:</strong> {{ answers.instrument_reflectometry }}
        <p><strong>Type:</strong> {{ answers.reflectometry_exp_type_mc }}
        <p><strong>Sample surface area:</strong> {{ answers.reflectometry_sample_surface_area_text }}
        <p><strong>Substrate thickness:</strong> {{ answers.reflectometry_substrate_thickness_area_text }}
        <p><strong>Substrate material:</strong> {{ answers.reflectometry_substrate_material_area_text }}
        <p><strong>Interface:</strong> {{ answers.reflectometry_interface_mc }}
        <p><strong>Simultaneous measurements:</strong> {{ answers.reflectometry_simultaneous_measurements_text }}
        <p><strong>Kinetic/off-specular measurements:</strong> {{ answers.reflectometry_measurement_text }}
      {{/if}}

      {{#if answers.instrument_excitations}}
        <p><strong>Instrument:</strong> {{ answers.instrument_excitations }}
        <p><strong>Sample type:</strong> {{ answers.excitations_crystal_powder_mc }}
        <p><strong>Crystal details:</strong> {{ answers.excitations_crystal_details_text }}
        <p><strong>Have all crystals required?</strong> {{ answers.excitations_sample_quantity_text }}
        <p><strong>Sample origin:</strong> {{ answers.excitations_sample_origin_text }}
      {{/if}}

      {{#if answers.instrument_imaging}}
        <p><strong>Instrument:</strong> {{ answers.instrument_imaging }}
        <p><strong>Resolution:</strong> {{ answers.imaging_resolution_text }}
      {{/if}}

      <p><strong>Deuteration lab?</strong> {{ answers.isis_deuteration_use }}
    </section>
    <section>
      <h2>Samples</h2>
      <table>
        <tr>
          <td><strong>Details</strong></td>
          {{#each answers.sample_declaration}}
            <td>{{ generic_template_basis }}</td>
          {{/each}}
        </tr>
        <tr>
          <td><strong>Formula</strong></td>
          {{#each answers.sample_declaration}}
            <td>{{ chemical_formula }}</td>
          {{/each}}
        </tr>
        <tr>
          <td><strong>Properties</strong></td>
          {{#each answers.sample_declaration}}
            <td>{{ sample_properties }}</td>
          {{/each}}
        </tr>
        <tr>
          <td><strong>Type</strong></td>
          {{#each answers.sample_declaration}}
            <td>{{ sample_type }}</td>
          {{/each}}
        </tr>
        <tr>
          <td><strong>Container</strong></td>
          {{#each answers.sample_declaration}}
            <td>{{ sample_container }}</td>
          {{/each}}
        </tr>
        <tr>
          <td><strong>ISIS kit</strong></td>
          {{#each answers.sample_declaration}}
            <td>{{ isis_equipment_details }}</td>
          {{/each}}
        </tr>
        <tr>
          <td><strong>User kit</strong></td>
          {{#each answers.sample_declaration}}
            <td>{{ user_equipment }}</td>
          {{/each}}
        </tr>
        <tr>
          <td><strong>Beamtime</strong></td>
          {{#each answers.sample_declaration}}
            <td>{{ technique_beamtime.value }}</td>
          {{/each}}
        </tr>
        <tr>
          <td><strong>Availability</strong></td>
          {{#each answers.sample_declaration}}
            <td>{{ sample_availability }}</td>
          {{/each}}
        </tr>
        <tr>
          <td><strong>Other info</strong></td>
          {{#each answers.sample_declaration}}
            <td>{{ other_sample_details }}</td>
          {{/each}}
        </tr>
      </table>
    </section>
    <section>
      <h2>Sample environment</h2>
      <p><strong>Temperature:</strong> {{ answers.temperature_range.min }} to {{ answers.temperature_range.max }} {{ answers.temperature_range.unit.symbol }}
      <p><strong>Pressure:</strong> {{ answers.pressure_range.min }} to {{ answers.pressure_range.max }} {{ answers.pressure_range.unit.symbol }}
      <p><strong>Magnetic:</strong> {{ answers.magnetic_field.min }} to {{ answers.magnetic_field.max }} {{ answers.magnetic_field.unit.symbol }}
      <p><strong>Other:</strong> {{ answers.other_experiment_parameters }}
    </section>
    <section>
      <h2>Hazards</h2>
      <p>Only hazards the user has selected appear here.
      {{#if answers.radioactive_hazards_text}}
        <p><strong>Radioactive:</strong> {{ answers.radioactive_hazards_text }}
      {{/if}}
      {{#if answers.nuclear_materials_sample_text}}
        <p><strong>Nuclear materials:</strong> {{ answers.nuclear_materials_sample_text }}
      {{/if}}
      {{#if answers.biological_hazards_text}}
        <p><strong>Biological:</strong> {{ answers.biological_hazards_text }}
      {{/if}}
      {{#if answers.air_sensitive_sample_text}}
        <p><strong>Air sensitive:</strong> {{ answers.air_sensitive_sample_text }}
      {{/if}}
      {{#if answers.water_sensitive_samples_text}}
        <p><strong>Water sensitive:</strong>  {{ answers.water_sensitive_samples_text }}
      {{/if}}
    </section>
  </div>
</div>
TickleThePanda commented 2 years ago

For documents, see teams. I didn't upload to here for private info.

TickleThePanda commented 2 years ago

Tested in my local environment using an import of the prod questionnaire. Relies on:

mutambaraf commented 2 years ago

The documents looks great and very eligible .If possible we can also include page numbers , also some of the data can also be displayed as tables and lastly separation may look nice with (:) colons .The above are just minor cosmetics .

For documents, see teams. I didn't upload to here for private info.

mr-field commented 2 years ago

I'd make titles a bit bigger compared to normal text. For example, the "Grants" title doen't look much bigger than the bold text under it, so it's hard to see that it's a title. Maybe some <hr>s under titles would also improve visual separation between sections, a bit like the title below?

A title

Text under a horizontal line

Other than that, it looks good to me.

TickleThePanda commented 2 years ago

Updated following comments. I've not used tables everywhere as it makes the markup more complex. As these are combined further into a larger booklet which will handle the page numbers, I'm not doing page numbers here.

I've added a version made on dev which has less info but shows the new style.

mr-field commented 2 years ago

Looks good to me 👍

TickleThePanda commented 2 years ago

Released onto prod: https://proposal.facilities.rl.ac.uk/PdfTemplateEditor/33