1. Atlas Systems
  2. Aeon
  3. Release Notes

Implementing 5.2 Web Page Release Changes

Print Friendly and PDF Follow

Avatar
Brittany De Gail
Updated

The release of Aeon 5.2 comes with several changes to the default web pages. To implement these changes, you can either:

  • Download the 5.2 web pages and replace your existing pages.
  • If you have customizations, find and replace the following code changes mentioned below. Any code highlighted in yellow needs to be removed and any code highlighted in blue needs to be added. 
If you have any questions or require Concierge Services when implementing the new web pages, please contact support at support@atlas-sys.com.
5.2 Release (Appointment Scheduling Pages) | 5.2 Release (Default Web Pages)

5.2 Release (Appointment Scheduling Pages)

The Appointment Scheduling web pages have been significantly overhauled in Aeon 5.2. Please follow the instructions below to update your 5.1 Appointment Scheduling web pages to the new Appointment Scheduling web pages available for 5.2.

Please ensure that you have followed the directions to add the ReadingRoomID field to the WebValidation table for your request forms and Saved Requests page before implementing the new web pages.
In addition to the changes noted below, the Aeon 5.2 Appointment Scheduling web pages also include new feature-specific DefaultRequest.html, GenericRequestManuscript.html,  GenericRequestMonograph.html, and GenericRequestSerial.html files and their corresponding Edit files. These files differ from their default versions in that the appointment scheduling fields are included by default in place of the scheduled date fields in order to ease the appointment scheduling web page implementation process. These files do not need to be updated if you have already implemented the appointment scheduling fields on your request forms. 

Files to Remove | Files to Add | Files to Overwrite | Files to Overwrite or Modify | Updating the EAD Request Form

Files to Remove

The following files should be removed from the Aeon web directory:

  • CSS folder:
    • css/icons/dxicons.ttf
    • css/icons/dxicons.woff
    • css/icons/dxicons.woff2
    • css/appointments.css
    • css/dx.common.css
    • css/dx.light.css
  • JS folder:
    • js/dx.all.js

Files to Add 

The following files are new in Aeon 5.2 and should be added to your web directory. Please download the latest default and feature-specific web pages for Aeon 5.2 and add the new files:

  • Feature-Specific Web Pages (AppointmentScheduling folder):
    • ArchivalRequest.html
    • include_appointment_info_ead.html
    • include_appointment_info_no_site.html 
  • Default Web Pages:
    • Templates folder:
      • templates\DataRow_ArchivalRequestContainer.html
    • CSS folder:

      • css\images\fa-calendar.svg

        Note: This file should be added to the images subfolder inside the CSS folder
      • css\datepicker.min.css
    • JS folder:
      • Copy over the entire 'lang' subfolder containing:
        • js\lang\en-US.js
      • js\ArchivalRequest.js
      • js\datepicker.min.js

Files to Overwrite

The following files have been substantially updated in Aeon 5.2. Please download the latest default and feature-specific web pages and overwrite these files with the updated files:

  • include_appointment_info.html
  • include_appointment_scripts.html
  • EditAppointment.html

  • ViewAppointments.html

    If you have made customizations to your ViewAppointments.html file that you do not want to lose, please move your customizations to the new 5.2 file before copying the file to your web directory.
  • CSS folder:
    • css\cookieconsent.min.css*
  • JS folder:
    • js\appointment.js
    • js\atlasCookieConsent.js*
    • js\atlasUtility.js*
    • js\cookieconsent.min.js*
    • js\KeepInReview.js*
    • js\scheduled-date.js*

*Included in the 5.2 Default Web Pages download

Note: If you are using a customized photoduplication toggle on your EAD request form, please also follow the directions to overwrite several additional default JavaScript files in the Fix Issue with Fields Hidden by Toggle Options on Request Forms section below.

Files to Overwrite or Modify

It is strongly recommended to also overwrite the following web page files with the new updated files released for Aeon 5.2. However, if any of these files have been extensively modified for your institution, then the required code changes for each file can be made manually to your existing files following the instructions in the expandable section below:

  • include_head.html*
  • include_head_request.html*
  • ViewAppointment.html
  • CSS folder:
    • css\aeon.css*
  • Templates folder:
    • templates\DataRow_DefaultAppointment.html

*Included in the 5.2 Default Web Pages download

Click to view manual update instructions

css\aeon.css

Change this (default lines 321-330):

/*Caution: Changing form field border color can affect accessibility
For more information see WCAG 1.4.11*/
.form-control,
.form-control:focus,
.custom-select,
.custom-select:focus,
.custom-control .custom-control-label::before,
.custom-control-input:focus:not(:checked)~.custom-control-label::before {
 
    border-color: #757575;
}

To this:

/*Caution: Changing form field border color can affect accessibility
For more information see WCAG 1.4.11*/
.form-control,
.form-control:focus,
.custom-select,
.custom-select:focus,
.custom-control .custom-control-label::before,
.custom-control-input:focus:not(:checked)~.custom-control-label::before,
.control-group {
    border-color: #757575;
}

Then add this code to the end of the aeon.css file:

/* Datepicker styling */

.date-picker-control, .date-picker-control:link, .date-picker-control:visited
{
    background-image: url("images/fa-calendar.svg");
    background-position: 0,0;
}

.date-picker
{
    font-family: 'Open Sans', sans-serif;
    color:#08415c;
}

.date-picker .date-picker-today, .oldie .date-picker .date-picker-today {
    background-image: none;
    background: #fff;
}

.date-picker .day-disabled
{
    background-image: none;
    color: #555;
    background-color: #e6e6e6;
}

.day-disabled .date-picker-hover {
    color: #555;
}

.date-picker table {
    border-color: #000;
    border-radius: .25 rem;
    background-image: none;
}

.date-picker td {
    background-image: none;
    border-color: #919191;
    text-shadow: none;
}

.date-picker .date-picker-unused {
   background-color: #fcfcfc;
   background-image: none;
}

.btn-primary-append {
    margin: 0;
}

.btn-secondary-append {
    margin-top: 0;
}

.date-picker .date-picker-highlight {
    color: #333;
}

.date-picker .date-picker-hover {
    text-shadow: none;
    background: #c9e7e9;
    color: #415A76;
    border-color: #000;
}

.date-picker .date-picker-hover.day-disabled {
    background-image: none;
    background-color: #e6e6e6;
}

.date-picker-focus .date-picker-hover {
    animation: none;
    -webkit-animation: none;
    -moz-animation: none;
    -ms-animation: none;
    -o-animation: none;
}

.btn-outline-secondary {
    color: #000;
}

.date-picker-button-active span, .date-picker-control:hover span {
    box-shadow: none;
}

.validation-message {
    font-style: italic;
}

@media (max-width: 767.98px) {
    .mx-w-100 {
        width: 100% !important;
    }
}

include_head_request.html

Add this code to the end of the file:

<script type="text/javascript" src="js/lang/en-US.js"></script>
<script type="text/javascript" src="js/datepicker.min.js"></script>

include_head.html

Change this (default lines 7-12):

<link rel="stylesheet" href="css/aeon.css">
<link rel="stylesheet" href="css/custom.css">
<link rel="stylesheet" href="css/print.css" media="print" />
<link rel="stylesheet" href="https://use.fontawesome.com/
releases/v5.2.0/css/all.css" 
integrity="sha384-hWVjflwFxL6sNzntih27bfxkr27PmbbK/
iSvJ+a4+0owXq79v+lsFkW54bOGbiDQ" 
crossorigin="anonymous">
<link rel="stylesheet" type="text/css" 
href="css/cookieconsent.min.css" />
 

To this:

<link rel="stylesheet" href="css/aeon.css">
<link rel="stylesheet" href="css/custom.css">
<link rel="stylesheet" href="css/print.css" media="print" />
<link rel="stylesheet" href="https://use.fontawesome.com/
releases/v5.2.0/css/all.css" 
integrity="sha384-hWVjflwFxL6sNzntih27bfxkr27PmbbK/
iSvJ+a4+0owXq79v+lsFkW54bOGbiDQ" 
crossorigin="anonymous">
<link rel="stylesheet" type="text/css" 
href="css/cookieconsent.min.css" />
<link rel="stylesheet" type="text/css" href="css/datepicker.min.css"/>

templates\DataRow_DefaultAppointment.html

Change this (default lines 6-10):

<h4 class="card-title">
<a href="aeon.dll?&Action=10&Form=95&Value=
<#DATAROW field='ID'>"><#DATAROW field="Name"></a>
</h4>
<div class="h5 card-subtitle 
text-muted"><#DATAROW field="ReadingRoomName"></div>
 
 
 

To this:

<h4 class="card-title">
<a href="aeon.dll?&Action=10&Form=95&Value=
<#DATAROW field='ID'>"><#DATAROW field="Name"></a>
</h4>
<div class="h5 card-subtitle 
text-muted"><#DATAROW field="ReadingRoomName"></div>
<span class="field text-muted">Status 
<span class="field-value font-weight-bold ml-1">
<#DATAROW field="AppointmentStatus"></span></span>

And change this (default line 27):

<div class="dropdown-menu  " 
data-noaction-message="You are not able to perform any actions 
for this appointment" 
aria-labelledby="btnGroupDrop<#DATAROW field='ID'>">

To this:

<div class="dropdown-menu dropdown-menu-right" 
data-noaction-message="You are not able to perform any actions 
for this appointment" 
aria-labelledby="btnGroupDrop<#DATAROW field='ID'>">

ViewAppointment.html

Change this (default lines 66-75):

<div class="field list-group-item">
<div class="d-flex justify-content-between">
<span class="transaction-label">Stop Time</span>
<strong>
<span class="field-value mr-1" data-formatOnly="true" 
data-formatString="LLL" data-servertime="<#APPOINTMENT 
field='StopTime'>"><#APPOINTMENT field="StopTime">
</span>
</strong>
</div>
</div>
 
 
 
 
 
 
 
 
 
</div>
</div>

To this:

<div class="field list-group-item">
<div class="d-flex justify-content-between">
<span class="transaction-label">Stop Time</span>
<strong>
<span class="field-value mr-1" data-formatOnly="true" 
data-formatString="LLL" data-servertime="<#APPOINTMENT 
field='StopTime'>"><#APPOINTMENT field="StopTime">
</span>
</strong>
</div>
</div>
<div class="field list-group-item">
<div class="d-flex justify-content-between">
<span class="transaction-label">Appointment Status</span>
<strong>
<span class="field-value mr-1"><#APPOINTMENT 
field="AppointmentStatus"></span>
</strong>
</div>
</div>
</div>
</div>

Updating the EAD Request Form

The EAD Request form (EADRequest.html) has been updated with the new appointment scheduling fields and functionality. This file should be updated differently based on whether or not you are using a photoduplication toggle and how the 5.1 appointment scheduling fields were implemented on this form.

Update Instructions for Appointment Scheduling Fields Implemented via Include File

If appointment scheduling fields were added to your EAD Request form via a link to an "include_appointment_info_ead.html" include file, please follow the instructions below to update your include_appointment_info_ead.html file:

  1. Download the latest feature-specific appointment scheduling pages from the Aeon Downloads page

  2. Overwrite your existing include_appointment_info_ead.html field with the updated file

    If you have used a different name for this file, please delete the old file and replace it with the updated include_appointment_info_ead.html file, then update the line of code used to link to the include file on EADRequest.html with the new filename (see step 3)

  3. Check to ensure that your EADRequest.html uses the following code to link to the new include file:

    <#INCLUDE filename="include_appointment_info_ead.html">

Update Instructions for Hardcoded Appointment Scheduling Fields

If your EAD Request form contains hardcoded appointment scheduling fields (i.e., the code for those fields is directly within EADRequest.html and are not in an include_appointment_info_ead.html file), please follow the instructions below to remove the old fields and implement the new fields using the new include_appointment_info_ead.html file:

  1. Locate the hardcoded appointment scheduling fields within EADRequest.html: Request For (RequestLink), Site, Reading Room (ReadingRoomID), Appointment (AppointmentID)

  2. Delete the code for the hardcoded fields and replace it with the following line of code:

    <#INCLUDE filename="include_appointment_info_ead.html">

WebValidation Table Updates for EADRequest.html (No Photoduplication Toggle)

If you are not using a photoduplication toggle on EADRequest.html, follow the steps in the documentation to ensure that the ReadingRoomID field has been added to the WebValidation table for EADRequest.html. Additionally, if you had added a rule to the WebValidation table in the Aeon Customization Manager to require the Appointment field (AppointmentID) on EADRequest.form in Aeon 5.1, delete this rule. This rule is no longer necessary to properly enforce the appointment requirement on EADRequest.html in Aeon 5.2.

5.2 Release (Default Web Pages)

New Accessible Scheduled Date Calendar | Fix Issue with Fields Hidden by Toggle Options on Request Forms | Remove Hidden Username Inputs and <div> Tags|  Fix Field Value Persistence for Safari Browser | Remove 'Required' Attribute from EditEADRequest.html | Update FAQ | Add Missing 'type' Attribute to Buttons | Improve Color Contrast for Buttons and Dropdown Menu Options | Fix Broken Web Alert Attribute | Remove Broken Attribute on ChangePassword.html | Adjust Color for Hyperlinks in Cookie Banner | Adjust Label Color for Form Fields Failing Validation | Adjust Formatting for Search Box | Improve Transaction Menu Responsiveness | Realign Actions Menu Dropdown Options | Fix Text Responsiveness Issues | Update Copyright Year on Logon.html | Add Information to Saved Requests Page

New Accessible Scheduled Date Calendar

Accessible Scheduled Date Calendar

The date picker calendar used for the Scheduled Date field in the default Aeon web pages has been updated with a significantly more accessible version for screen reader and keyboard-only users. Implementing the new accessible calendar tool will require adding new files to your web directory and modifying existing files according to the instructions below.

New Files to Add | Files to Overwrite | Files to Overwrite or Modify | Updating the EAD Request Form | Updating Other Request Forms

These changes are for updating the default Scheduled Date functionality in your Aeon web pages. If you are not using the Scheduled Date field and instead have implemented the appointment scheduling functionality, please see the appointment scheduling web page update instructions above.

New Files to Add

The following files are new in Aeon 5.2 and should be added to your web directory. Please download the latest default web pages and add the following new files:

  • include_scheduled_date.html
  • include_scheduled_date_ead.html
  • CSS folder:

    • css\images\fa-calendar.svg

      Note: This file should be added to the images subfolder inside the CSS folder
    • css\datepicker.min.css
  • JS folder:
    • Copy over the entire 'lang' subfolder containing:
      • js\lang\en-US.js
    • js\datepicker.min.js

Files to Overwrite

The following files have been updated and should be overwritten to ensure the most recent version of each file is being used. Please download the latest default web pages and overwrite these files with the updated files:

  • CSS folder:
    • css\cookieconsent.min.css
  • JS folder:
    • js\atlasCookieConsent.js
    • js\cookieconsent.min.js
    • js\scheduled-date.js

Files to Overwrite or Modify

It is strongly recommended to also overwrite the following web page files with the new updated files released for Aeon 5.2. However, if any of these files have been extensively modified for your institution, then the required code changes for each file can be made manually to your existing files following the instructions in the expandable section below:

  • include_head.html
  • include_head_request.html
  • ViewUserReviewRequests.html
  • CSS folder:
    • css\aeon.css
Click for manual update instructions

css\aeon.css

Change this (default lines 321-330):

/*Caution: Changing form field border color can affect accessibility
For more information see WCAG 1.4.11*/
.form-control,
.form-control:focus,
.custom-select,
.custom-select:focus,
.custom-control .custom-control-label::before,
.custom-control-input:focus:not(:checked)~.custom-control-label::before {
 
    border-color: #757575;
}

To this:

/*Caution: Changing form field border color can affect accessibility
For more information see WCAG 1.4.11*/
.form-control,
.form-control:focus,
.custom-select,
.custom-select:focus,
.custom-control .custom-control-label::before,
.custom-control-input:focus:not(:checked)~.custom-control-label::before,
.control-group {
    border-color: #757575;
}

Then add this code to the end of the aeon.css file:

/* Datepicker styling */

.date-picker-control, .date-picker-control:link, .date-picker-control:visited
{
    background-image: url("images/fa-calendar.svg");
    background-position: 0,0;
}

.date-picker
{
    font-family: 'Open Sans', sans-serif;
    color:#08415c;
}

.date-picker .date-picker-today, .oldie .date-picker .date-picker-today {
    background-image: none;
    background: #fff;
}

.date-picker .day-disabled
{
    background-image: none;
    color: #555;
    background-color: #e6e6e6;
}

.day-disabled .date-picker-hover {
    color: #555;
}

.date-picker table {
    border-color: #000;
    border-radius: .25 rem;
    background-image: none;
}

.date-picker td {
    background-image: none;
    border-color: #919191;
    text-shadow: none;
}

.date-picker .date-picker-unused {
   background-color: #fcfcfc;
   background-image: none;
}

.btn-primary-append {
    margin: 0;
}

.btn-secondary-append {
    margin-top: 0;
}

.date-picker .date-picker-highlight {
    color: #333;
}

.date-picker .date-picker-hover {
    text-shadow: none;
    background: #c9e7e9;
    color: #415A76;
    border-color: #000;
}

.date-picker .date-picker-hover.day-disabled {
    background-image: none;
    background-color: #e6e6e6;
}

.date-picker-focus .date-picker-hover {
    animation: none;
    -webkit-animation: none;
    -moz-animation: none;
    -ms-animation: none;
    -o-animation: none;
}

.btn-outline-secondary {
    color: #000;
}

.date-picker-button-active span, .date-picker-control:hover span {
    box-shadow: none;
}

.validation-message {
    font-style: italic;
}

@media (max-width: 767.98px) {
    .mx-w-100 {
        width: 100% !important;
    }
}

include_head_request.html

Add this code to the end of the file:

<script type="text/javascript" src="js/lang/en-US.js"></script>
<script type="text/javascript" src="js/datepicker.min.js"></script>

include_head.html

Change this (default lines 7-12):

<link rel="stylesheet" href="css/aeon.css">
<link rel="stylesheet" href="css/custom.css">
<link rel="stylesheet" href="css/print.css" media="print" />
<link rel="stylesheet" href="https://use.fontawesome.com/
releases/v5.2.0/css/all.css" 
integrity="sha384-hWVjflwFxL6sNzntih27bfxkr27PmbbK/
iSvJ+a4+0owXq79v+lsFkW54bOGbiDQ" 
crossorigin="anonymous">
<link rel="stylesheet" type="text/css" 
href="css/cookieconsent.min.css" />
 

To this:

<link rel="stylesheet" href="css/aeon.css">
<link rel="stylesheet" href="css/custom.css">
<link rel="stylesheet" href="css/print.css" media="print" />
<link rel="stylesheet" href="https://use.fontawesome.com/
releases/v5.2.0/css/all.css" 
integrity="sha384-hWVjflwFxL6sNzntih27bfxkr27PmbbK/
iSvJ+a4+0owXq79v+lsFkW54bOGbiDQ" 
crossorigin="anonymous">
<link rel="stylesheet" type="text/css" 
href="css/cookieconsent.min.css" />
<link rel="stylesheet" type="text/css" href="css/datepicker.min.css"/>

ViewUserReviewRequests.html

Change this (default lines 35-48):

<div id ="scheduled-date-div" 
class="visit-date form-group col-sm-4">
<label for="ScheduledDate">
<span class="<#ERROR name='ERRORScheduledDate'>">
Date of Visit
</span>
</label>
<div class="input-group">
<input class="form-control" id="ScheduledDate" 
name="ScheduledDate" type="text" 
aria-describedby="button-datePicker-scheduledDate 
scheduledDateNotes" value="<#PARAM name='ScheduledDate'>">
<div class="input-group-append">
<button class="btn btn-outline-secondary dateTrigger" 
type="button" role="button" 
id="button-datePicker-scheduledDate" 
data-triggerDatePicker="#ScheduledDate" 
aria-label="Calendar">
<span class="fas fa-calendar ui-datepicker-trigger">
</span>
</button>
</div>
</div>

To this:

<div id ="scheduled-date-div" 
class="visit-date form-group col-sm-4">
<label for="ScheduledDate">
<span class="<#ERROR name='ERRORScheduledDate'>">
Date of Visit
</span>
</label>
<div class="input-group">
<input class="form-control" id="ScheduledDate" 
name="ScheduledDate" type="text" 
aria-describedby="scheduledDateNotes" 
value="<#PARAM name='ScheduledDate'>">
<div id="datePickerButton" 
class="input-group-append btn btn-outline-secondary"></div>
</div>
 
 
 
 
 
 
 
 

Updating the EAD Request Form

To implement the new Scheduled Date functionality on the EAD Request form, please overwrite your default EADRequest.html file with the updated file or make the changes manually following the example below:

EADRequest.html

These changes are only for updating the default Scheduled Date functionality in your Aeon web pages. If you are not using the Scheduled Date field and instead have implemented the appointment scheduling functionality, please see the appointment scheduling web page update instructions above.

Change this (default lines 100-118):

<div class="form-group col-sm-4">
<label for="ScheduledDate">
<span class="<#ERROR name='ERRORScheduledDate'>">
Date of Visit
</span>
</label>
<div class="input-group">
<input class="form-control" id="ScheduledDate" 
name="FormDataField" type="text" 
aria-describedby="button-datePicker-scheduledDate 
scheduledDateNotes" value="<#PARAM name='ScheduledDate'>">
<div class="input-group-append">
<button class="btn btn-outline-secondary dateTrigger" 
type="button" role="button" 
id="button-datePicker-scheduledDate" 
data-triggerDatePicker="#ScheduledDate" 
aria-label="Calendar">
<span class="fas fa-calendar 
ui-datepicker-trigger"></span>
</button>
</div>
</div>

<div class="small-notes" id="scheduledDateNotes">
Select the date you plan to visit.
</div>
</div>
  

To this:

<#INCLUDE filename="include_scheduled_date_ead.html">
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Updating Other Request Forms

All request forms and their corresponding edit forms (excluding EADRequest.html) that use the Scheduled Date field should be modified to use the new include_scheduled_date.html include file in place of the hardcoded Scheduled Date field. To implement these changes, make the following update on each of your request forms that contain the Scheduled Date field following the example for DefaultRequest.html below:

These changes are only for updating the default Scheduled Date functionality in your Aeon web pages. If you are not using the Scheduled Date field and instead have implemented the appointment scheduling functionality, please see the appointment scheduling web page update instructions above.

Change this (DefaultRequest.html default lines 167-185):

<div class="form-group col-sm-4">
<label for="ScheduledDate">
<span class="<#ERROR name='ERRORScheduledDate'>">
Date of Visit
</span>
</label>
<div class="input-group">
<input class="form-control" id="ScheduledDate" 
name="ScheduledDate" type="text" 
aria-describedby="button-datePicker-scheduledDate scheduledDateNotes" 
value="<#PARAM name='ScheduledDate'>">
<div class="input-group-append">
<button class="btn btn-outline-secondary dateTrigger" 
type="button" role="button" id="button-datePicker-scheduledDate" 
data-triggerDatePicker="#ScheduledDate" aria-label="Calendar">
<span class="fas fa-calendar ui-datepicker-trigger"></span>
</button>
</div>
</div>

<div class="small-notes" id="scheduledDateNotes">
Select the date you plan to visit.
</div>
</div>
  

To this:

<#INCLUDE filename="include_scheduled_date.html">
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Make the changes above on the following default request forms:

  • DefaultRequest.html (default lines 167-185)
  • EditDefaultRequest.html (default lines 176-194)
  • GenericRequestManuscript.html (default lines 133-151)
  • EditGenericRequestManuscript.html (default lines 127-145)
  • GenericRequestMonograph.html (default lines 170-188)
  • EditGenericRequestMonograph.html (default lines 182-200)
  • GenericRequestSerial.html (default lines 138-156)
  • EditGenericRequestSerial.html (default lines 167-185)

Fix Issue with Fields Hidden by Toggle Options on Request Forms

These changes were also applied in the v5.1.38 default web pages release.

To fix an issue where hidden billing fields (such as those hidden by a customized photoduplication toggle option on the EAD Request form) could become enabled (but remain hidden) on request forms and prevent submission of the form, please download the latest default web pages and overwrite your js\billingContextOptionHandler.js and js\duplicationPermissionToggle.js files with the updated files.

The fix will not apply to any affected billing fields that use the position: fixed CSS property. The following error message will be returned in the browser console when this issue occurs:

The [HTML ID for the affected billing field] SELECT element has a fixed position and 
its visibility may not be accurately determined by billingContextOptionHandler.js

To resolve this issue, please locate the affected billing field within the code for the relevant web page and remove the position: fixed property.

js\billingContextOptionHandler.js

Please overwrite this file with the updated file.

js\duplicationPermissionToggle.js

Please overwrite this file with the updated file.

Remove Hidden Username Inputs and <div> Tags

Unnecessary hidden inputs for the username field have been removed from the default web pages to improve the efficiency of the code on these pages. Please either overwrite these files with the new default files or make the changes each page manually following the examples below as a guide:

Example - Default Web Pages

The "Username" hidden input should be deleted from the default web pages following the example below:

Change this (DefaultRequest.html default line 18):

<input type="hidden" name="AeonForm" 
value="DefaultRequest">
<input type="hidden" name="Username" 
value="<#PARAM name='Username'>">
<input type="hidden" name="TransactionLink" 
value="<#PARAM name='TransactionLink'>">
  

To this:

<input type="hidden" name="AeonForm" 
value="DefaultRequest">
 
 
<input type="hidden" name="TransactionLink" 
value="<#PARAM name='TransactionLink'>">

On the following web pages at the specified default lines:

  • ChangePassword.html (default line 16)
  • DefaultRequest.html (default line 18)
  • EADRequest.html (default line 40)
  • EditDefaultRequest.html (default line 18)
  • EditEADRequest.html (default line 18)
  • EditGenericRequestManuscript.html (default line 19)
  • EditGenericRequestManuscriptPhotodup.html (default line 19)
  • EditGenericRequestMonograph.html (default line 19)
  • EditGenericRequestMonographPhotodup.html (default line 19)
  • EditGenericRequestSerial.html (default line 19)
  • EditPhotoduplicationRequest.html (default line 19)
  • GenericRequestManuscript.html (default line 19)
  • GenericRequestManuscriptPhotodup.html (default line 19)
  • GenericRequestMonograph.html (default line 19)
  • GenericRequestMonographPhotodup.html (default line 19)
  • GenericRequestSerial.html (default line 19)
  • PhotoduplicationRequest.html (default line 19)

Fix Field Value Persistence for Safari Browser

To fix an issue where fields marked with the "data-persisted-value" attribute will not properly persist their values in the Safari web browser, please download the latest default web pages and overwrite your js\atlasUtility.js file with the updated file.

js\atlasUtility.js

Please overwrite this file with the updated file.

Remove 'required' Attribute from EditEADRequest.html

To remove an unnecessary 'required' attribute from the ItemSubTitle field on EditEADRequest.html, please overwrite your default EditEADRequest.html file with the updated file or make the following changes:

EditEADRequest.html

Change this (default line 44):

<textarea class="form-control" name="ItemSubTitle" 
id="ItemSubTitle" rows="2" cols="40" required>
<#PARAM name="ItemSubTitle"></textarea>
  

To this:

<textarea class="form-control" name="ItemSubTitle" 
id="ItemSubTitle" rows="2" cols="40"  >
<#PARAM name="ItemSubTitle"></textarea>

Update FAQ

To update outdated information on the default FAQ web page, please overwrite your default FAQ.html file with the updated file or make the following changes:

FAQ.html

Change this (default line 82):

<p>
You need a Web browser that can handle forms, 
tables, and preferably cascading style sheets (CSS). 
We recommend the current versions of either 
Microsoft Internet Explorer or Mozilla Firefox.
</p>
  

To this:

<p>
You need a Web browser that can handle forms, 
tables, and preferably cascading style sheets (CSS). 
We recommend the current versions of Google Chrome, 
Microsoft Edge, Mozilla Firefox, or Apple Safari.
</p>

And change this (default lines 126-127):

<p>
The technology that we use sends a Session ID to be 
stored on your machine. You can refuse this cookie and 
still be able to use Aeon without any problems.
</p>
  

To this:

<p>
The technology that we use sends a Session ID to be 
stored on your machine. This cookie is required to 
remain logged in to the Aeon system.
</p>

Add Missing 'type' Attribute to Buttons

'Type' attributes have been added to buttons where missing to fix intermittent issues when using buttons on the order processing web pages, web alerts, and Saved Requests page. To implement these changes, please overwrite your webAlerts.js file with the updated file and either overwrite the files listed below with the updated files or make the changes manually as shown below:

js\webAlerts.js

The changes to this file are extensive. Please overwrite this file with the updated file.

ViewUserReviewRequests.html

Change this (default lines 26-27):

<button   class="selectOptions 
btn btn-link checkAll" data-form="ViewUserReviewRequests" 
aria-label="Select all of the displayed requests." 
role="button" >Select All</button>
<button   class="selectOptions 
btn btn-link checkNone" data-form="ViewUserReviewRequests" 
aria-label="Unselect all of the displayed requests." 
role="button" >Select None</button>
  

To this:

<button type="button" class="selectOptions 
btn btn-link checkAll" data-form="ViewUserReviewRequests" 
aria-label="Select all of the displayed requests." 
role="button" >Select All</button>
<button type="button" class="selectOptions 
btn btn-link checkNone" data-form="ViewUserReviewRequests" 
aria-label="Unselect all of the displayed requests." 
role="button" >Select None</button>

ViewOrderEstimates.html

Change this (default lines 30-31):

<button   class="selectOptions 
btn btn-link checkAll" data-form="orderEstimates" 
aria-label="Select all of the displayed requests." 
role="button">Select All</button>
<button   class="selectOptions 
btn btn-link checkNone" data-form="orderEstimates" 
aria-label="Unselect all of the displayed requests." 
role="button">Select None</button>
  

To this:

<button type="button" class="selectOptions 
btn btn-link checkAll" data-form="orderEstimates" 
aria-label="Select all of the displayed requests." 
role="button">Select All</button>
<button type="button" class="selectOptions 
btn btn-link checkNone" data-form="orderEstimates" 
aria-label="Unselect all of the displayed requests." 
role="button">Select None</button>

ViewOrderApprovals.html

Change this (default lines 29-30):

<button   class="selectOptions 
btn btn-link checkAll" data-form="orderApprovals" 
aria-label="Select all of the displayed requests." 
role="button" >Select All</button>
<button   class="selectOptions 
btn btn-link checkNone" data-form="orderApprovals" 
aria-label="Unselect all of the displayed requests." 
role="button" >Select None</button>
  

To this:

<button type="button" class="selectOptions 
btn btn-link checkAll" data-form="orderApprovals" 
aria-label="Select all of the displayed requests." 
role="button" >Select All</button>
<button type="button" class="selectOptions 
btn btn-link checkNone" data-form="orderApprovals" 
aria-label="Unselect all of the displayed requests." 
role="button" >Select None</button>

templates\payment\include_payment_buttons.html

Change this (default line 2):

<button id="cancel"   name="SubmitButton" 
value="Cancel - Exit to Main Menu" 
class="btn btn-primary btn-block" 
formnovalidate>Cancel - Exit to Main Menu</button>
  

To this:

<button id="cancel" type="button" name="SubmitButton" 
value="Cancel - Exit to Main Menu" 
class="btn btn-primary btn-block" 
formnovalidate>Cancel - Exit to Main Menu</button>

Improve Color Contrast for Buttons and Dropdown Menu Options

The "text-info" class has been removed from several buttons and dropdown menu items in the DataRow template files to improve color contrast against the default Aeon web pages. To implement these changes, please either overwrite the files listed below with the updated files or make the changes manually as shown below:

templates\DataRow_BillingDetail.html

Change this (default line 6):

<button type="button" 
class="text-info btn btn-light ml-1" 
data-toggle="collapse" aria-expanded="false" 
aria-controls="collapseBillingDetail
<#DATAROW field='ID'>" 
data-target="#collapseBillingDetail
<#DATAROW field='ID'>" 
aria-label="Toggle billing details for 
<#DATAROW field='BillingContext'>">
<span aria-hidden="true" 
class="fa fa-chevron-down text-info mr-1">
</span></button>
  

To this:

<button type="button" 
class="  btn btn-light ml-1" 
data-toggle="collapse" aria-expanded="false" 
aria-controls="collapseBillingDetail
<#DATAROW field='ID'>" 
data-target="#collapseBillingDetail
<#DATAROW field='ID'>" 
aria-label="Toggle billing details for 
<#DATAROW field='BillingContext'>">
<span aria-hidden="true" 
class="fa fa-chevron-down   mr-1">
</span></button>

templates\DataRow_CreditCardOrder.html

Change this (default line 15):

<a class="text-info btn btn-light" 
aria-controls="collapseRequest<#DATAROW 
field='TransactionNumber'>" 
href="<#DLL queryFields='false'>
?Action=10&Form=63&Value=
<#DATAROW field='TransactionNumber'>">
<span aria-hidden="true" 
class="fa fa-info-circle text-info mr-1">
</span>Details</a>
  

To this:

<a class="  btn btn-light" 
aria-controls="collapseRequest<#DATAROW 
field='TransactionNumber'>" 
href="<#DLL queryFields='false'>
?Action=10&Form=63&Value=
<#DATAROW field='TransactionNumber'>">
<span aria-hidden="true" 
class="fa fa-info-circle   mr-1">
</span>Details</a>

templates\DataRow_ElectronicDelivery.html

Change this (default line 22):

<a class="dropdown-item text-info btn btn-light" 
href="aeon.dll?Action=10&amp;Form=63&amp;Value=
<#DATAROW field='TransactionNumber'>">
<span class="fa fa-info-circle text-info mr-1">
</span>Details</a>
  

To this:

<a class="dropdown-item   btn btn-light" 
href="aeon.dll?Action=10&amp;Form=63&amp;Value=
<#DATAROW field='TransactionNumber'>">
<span class="fa fa-info-circle   mr-1">
</span>Details</a>

templates\DataRow_OrderBilling.html

Change this (default line 50):

<span aria-hidden="true" 
class="fas fa-eye text-info mr-2"></span>View Item
</a>
  

To this:

<span aria-hidden="true" 
class="fas fa-eye   mr-2"></span>View Item
</a>

templates\DataRow_OrderEstimate.html

Change this (default line 48):

<span aria-hidden="true" 
class="fas fa-eye text-info mr-2"></span>View Request
</a>
  

To this:

<span aria-hidden="true" 
class="fas fa-eye   mr-2"></span>View Request
</a>

Fix Broken Web Alert Attribute

These changes were also applied in the v5.1.38 default web pages release.

To fix a broken 'aria-labelledby' attribute causing an accessibility issue on the modal dialog for web alerts, please download the latest default web pages and overwrite your js\webAlerts.js file with the updated file.

js\webAlerts.js

Please overwrite this file with the updated file.

Remove Broken Attribute on ChangePassword.html

These changes were also applied in the v5.1.38 default web pages release.

To remove a broken 'aria-describedby' attribute causing an accessibility issue on ChangePassword.html, please overwrite your default ChangePassword.html file with the updated file or make the following changes:

ChangePassword.html

Change this (default lines 23-30):

<div class="form-group col-md-5">
<label for="CurrentPassword">
<span class="<#ERROR name='ERRORCurrentPassword'>">
Current Password
</span>
</label>
<input type="password" class="form-control" 
name="CurrentPassword" id="CurrentPassword" 
aria-describedby="passwordHelp" autocomplete="off">
</div>
  

To this:

<div class="form-group col-md-5">
<label for="CurrentPassword">
<span class="<#ERROR name='ERRORCurrentPassword'>">
Current Password
</span>
</label>
<input type="password" class="form-control" 
name="CurrentPassword" id="CurrentPassword" 
  autocomplete="off">
</div>

Adjust Color for Hyperlinks in Cookie Banner

These changes were also applied in the v5.1.38 default web pages release.

To fix contrast issues with the default color used for hyperlinks added to the cookie consent banner, please overwrite your default css\aeon.css file with the updated file or make the following changes:

css\aeon.css

Change this (default lines 450-452):

.theme_atlas .cc_div a {
     
    color: var(--cc-btn-primary-bg);
}
  

To this:

.theme_atlas .cc_div a, .theme_atlas .cc_div .cc-link {
    border-color: #d6d6d6;
    color: #d6d6d6;
}

Adjust Label Color for Form Fields Failing Validation

These changes were also applied in the v5.1.38 default web pages release.

The default label color used to highlight fields that fail server validation when a form is submitted was changed to fix contrast issues against the default web page background colors. To implement this change, please overwrite your default js\atlasUtility.js file with the updated file and overwrite your css\aeon.css file with the updated file or make the following changes:

js\atlasUtility.js

Please overwrite this file with the updated file.

css\aeon.css

Change this (default line 126-129):

 
 
 

.fas {
    font-size: 16px;
}
  

To this:

.validationError {
    color: #b81f18;
}

.fas {
    font-size: 16px;
}

Adjust Formatting for Search Box

These changes were also applied in the v5.1.38 default web pages release.

To fix color contrast issues with the default color used for the border around the search box and to improve the overall layout of the web page, please overwrite your default ViewSearchResults.html file with the updated file or make the following changes:

ViewSearchResults.html

Change this (default lines 19-23):

<input type="hidden" name="AeonForm" value="Search">
 
<input id="SearchCriteria" 
 
value="<#PARAM name='SearchCriteria'>" 
name="SearchCriteria" type="text" 
title="Search criteria">
<input class="btn btn-primary btn-sm" 
type="submit" name="SubmitButton" value="Search" 
title="Search" data-button-nodisable>
 
  

To this:

<input type="hidden" name="AeonForm" value="Search">
<div class="form-inline m-0">
<input id="SearchCriteria" 
class="form-control mr-1" 
value="<#PARAM name='SearchCriteria'>" 
name="SearchCriteria" type="text" 
title="Search criteria">
<input class="btn btn-primary  " 
type="submit" name="SubmitButton" value="Search" 
title="Search" data-button-nodisable>
</div>

And change this (default lines 32-33):

<!--Radio control for search filtering-->
<br>
  

To this:

<!--Radio control for search filtering-->
 

Improve Transaction Menu Responsiveness

These changes were also applied in the v5.1.38 default web pages release.

To fix issues with the responsiveness and readability of the transaction menu on smaller display sizes and to add an underline on hover for its enabled menu buttons, please overwrite your default aeon.css and include_TransactionMenu.html files with the updated files or make the following changes:

aeon.css

Change this (default lines 237-240):

 
 
 

.badge-primary {
     background-color: #08415c;
}
  

To this:

#transaction-menu .btn:hover {
    text-decoration: underline;
}

.badge-primary {
    background-color: #08415c;
}

include_TransactionMenu.html

Change this (default lines 1-2):

<div   class="d-flex 
justify-content-center  ">
<div class="btn-group 
 "
role="group">
  

To this:

<div id="transaction-menu" class="d-flex 
justify-content-center mb-1 mt-4">
<div class="btn-group 
flex-column flex-grow-1 flex-md-row flex-md-grow-0" 
role="group">

Then follow the example for the Edit Request button to add the "my-1 py-2" class to the code for all buttons on this page at the default lines listed below:

Edit Request Button Example

Change this (default lines 4-7):

<a class="btn btn-light menuEdit  
<#TRANSACTION field='RequestActionAllowed' 
name='Edit' disabledValue='disabled'>"
href="aeon.dll?Action=20&amp;Form=63&amp;Value=
<#TRANSACTION field='TransactionNumber'>">
<span aria-hidden="true" 
class="fas fa-edit text-primary"></span>
 Edit Request
</a>
  

To this:

<a class="btn btn-light menuEdit my-1 py-2 
<#TRANSACTION field='RequestActionAllowed' 
name='Edit' disabledValue='disabled'>"
href="aeon.dll?Action=20&amp;Form=63&amp;Value=
<#TRANSACTION field='TransactionNumber'>">
<span aria-hidden="true" 
class="fas fa-edit text-primary"></span>
 Edit Request
</a>

Add the "my-1 py-2" class to these default lines:

  • 4 (Edit Request button)
  • 9 (Cancel Request button)
  • 14 (Remove from Hold button)
  • 19 (Resubmit Request button)
  • 24 (Request Copy button)
  • 29 (Clone Request button)
  • 34 (Clone to Copy button)
  • 39 (View Item button)
  • 44 (Delete Item button)
  • 49 (Submit Request button)
  • 54 (Approve Estimate button)
  • 59 (Approve Billing button)
  • 64 (Export Citation button)

Realign Actions Menu Dropdown Options

These changes were also applied in the v5.1.38 default web pages release.

To fix an issue where the Actions menu dropdown options are not fully visible on smaller display sizes, please overwrite the files listed below with the new default files or make the change on each page manually following the example below:

Example

Add the "dropdown-menu-right" class to the code for the dropdown menu <div> container:

Change this (DataRow_DefaultActivity.html default line 30):

<div class="dropdown-menu  " 
aria-labelledby="btnGroupActivityDrop<#DATAROW field='Id'>">
  

To this:

<div class="dropdown-menu dropdown-menu-right" 
aria-labelledby="btnGroupActivityDrop<#DATAROW field='Id'>">

On the following web pages at the specified default lines:

  • DataRow_DefaultActivity.html (default line 30)
  • DataRow_DefaultRequest.html (default line 20)
  • DataRow_ElectronicDelivery.html (default line 21)
  • DataRow_OrderBilling.html (default line 48)
  • DataRow_OrderEstimate.html (default line 46)
  • DataRow_ReviewRequest.html (default line 24)

Fix Text Responsiveness Issues

These changes were also applied in the v5.1.38 default web pages release.

To fix issues where text would cross over other text and cause readability issues on various web pages when viewed on small screen sizes or high zoom levels, please overwrite the files noted below with the updated files or make the following changes manually:

Note: These changes will also fix text responsiveness issues on ViewAppointment.html though no changes are required for the code within this file.

aeon.css

Change this (default lines 336-338):

.transaction-label {
    width: 33%;
}
  

To this:

.transaction-label {
    flex-basis: 33%;
}

ActivityInformation.html

Follow the example for the Name field on ActivityInformation.html to add the "transaction-label" class to the code within each file listed below for the fields located at the default lines indicated:

Name Field Example

Change this (default lines 6-13):

<div class="field list-group-item">
<div class="d-flex justify-content-between">
<span  >Name</span>
<strong>
<span class="field-value"><#ACTIVITY field="Name">
</span>
</strong>
</div>
</div>
  

To this:

<div class="field list-group-item">
<div class="d-flex justify-content-between">
<span class="transaction-label">Name</span>
<strong>
<span class="field-value"><#ACTIVITY field="Name">
</span>
</strong>
</div>
</div>

Add the "transaction-label" class to the fields located at the default lines on the following web page files:

ActivityInformation.html:

  • 8 (Name field)
  • 17 (Description field)
  • 26 (Type [ActivityType] field)
  • 35 (Status [ActivityStatus] field)
  • 44 (Status Date [ActivityStatusDate] field)
  • 53 (Location field)
  • 62 (Begin Date field)
  • 71 (End Date field)

include_ResearcherTagsUpdate.html:

  • 7 (Current Tags [ResearcherTags] field)

ViewDetailedManuscriptInformation.html:

  • 7 (Transaction Number field)
  • 16 (Title [ItemTitle] field)
  • 25 (Author [ItemAuthor] field)
  • 34 (Date [ItemDate] field)
  • 43 (Collection Name/Location [Location] field)
  • 52 (Call Number field)
  • 61 (Box(es)/Folder(s) [ItemVolume] field)
  • 70 (Requested For [ResearcherUsername] field)
  • 79 (Activity Number [ActivityID] field)
  • 88 (Scheduled Date field)
  • 97 (Special Request field)

ViewDetailedMonographInformation.html:

  • 7 (Transaction Number field)
  • 16 (Title [ItemTitle] field)
  • 25 (Author [ItemAuthor] field)
  • 34 (Place of Publication [ItemPlace] field)
  • 43 (Publisher [ItemPublisher] field)
  • 52 (Date [ItemDate] field)
  • 61 (Edition [ItemEdition] field)
  • 70 (Volume/Box [ItemVolume] field)
  • 79 (Issue/Copy [ItemIssue] field)
  • 88 (Size/Physical Description [ItemCitation] field)
  • 97 (Call Number field)
  • 106 (Collection Name/Location [Location] field)
  • 115 (Requested For [ResearcherUsername] field)
  • 124 (Activity Number [ActivityID] field)
  • 133 (ScheduledDate field)
  • 142 (Special Request field)

ViewDetailedSerialInformation.html:

  • 8 (Transaction Number field)
  • 17 (Title [ItemTitle] field)
  • 26 (Place of Publication [ItemPlace] field)
  • 35 (Date [ItemDate] field)
  • 44 (Volume/Box [ItemVolume] field)
  • 53 (Issue/Copy [ItemIssue] field)
  • 62 (Call Number field)
  • 71 (Collection Name/Location [Location] field)
  • 80 (Requested For [ResearcherUsername] field)
  • 89 (Activity Number [ActivityID] field)
  • 98 (Scheduled Date field)
  • 107 (Special Request field)

Update Copyright Year on Logon.html

These changes were also applied in the v5.1.38 default web pages release.

To update the hardcoded copyright year on the Logon web page to the current year, please overwrite your default Logon.html file with the updated file or make the following changes:

Logon.html

Change this (default line 78):

<div> &copy; 2022 <a href="http://www.atlas-sys.com"> 
Atlas Systems, Inc.</a> All Rights Reserved.</div>
  

To this:

<div> &copy; 2023 <a href="http://www.atlas-sys.com"> 
Atlas Systems, Inc.</a> All Rights Reserved.</div>

Add Information to Saved Requests Page

To add transaction number and site information to requests listed on the Saved Requests web page, please overwrite your default DataRow_ReviewRequest.html file with the updated file or make the following changes:

templates\DataRow_ReviewRequest.html

Change this (default line 13):

<div class="card-subtitle text-muted h5">
<#DATAROW field="ItemSubtitle"></div>
 
 
 
 
 
  

To this:

<div class="card-subtitle text-muted h5">
<#DATAROW field="ItemSubtitle"></div>
<div class="field text-muted">Transaction Number
<span class="field-value font-weight-bold ml-1">
<#DATAROW field="TransactionNumber"></span></div>
<div class="field text-muted">Site<span class="field-value 
font-weight-bold ml-1"><#DATAROW field="Site"></span></div>

Questions?

If this article didn’t resolve your issue, please contact Atlas Support for assistance:

Contact Support

Articles in this section

See more