New Fully Accessible and Responsive Web Pages (v9.1)

Print Friendly and PDF Follow

The update will not automatically overwrite your current web pages to prevent erasing any custom work you may have added to your webpages. The default pages are available for download separately on the ILLiad Downloads page.
When implementing the new default web pages, please move your customizations to the new default web pages to ensure the compatibility of the new pages. If you have any questions or require Concierge Services when implementing the new web pages, please contact support at support@atlas-sys.com.

Highlights   

  • WCAG 2.1 & Section 508 Compliant: Makes ILLiad web content more accessible.
  • Mobile Responsive: Better support for mobile devices and varied desktop configurations.
  • Updated look: Newly designed with a modern style based on Bootstrap 4.
  • Enhanced patron experience: Easier to understand interfaces and navigation.

Features

Navigation Bar | Main Menu Page Layout | Request DetailsForms | Site Map | Cookie Notification | JSON Output of Web AlertsTables Generate by Div Elements

To ensure any changes made to the default web pages adhere to accessibility standards, please review the Bootstrap 4 documentation before making changes. For example, logo images can be made accessible in both the pc and mobile view by adding the bootstrap class img-fluid as mentioned in the Bootstrap image documentation.   

Navigation Bar

In ILLiad 9.1, the old vertical menu structure has been changed to a horizontal navigation bar to maintain accessibility when the navigation is condensed into a mobile view.

Main Menu Tab: The Main Menu will now list all Outstanding Requests, Checked Out Items, and Available PDFs. 

New Requests Tab: Each form has been redesigned with a new layout and a more streamlined appearance.

Default Forms:

  • Article (formerly named Photocopy)
  • Book
  • Book Chapter
  • Conference Paper
  • Patent

 

  • Report
  • Thesis
  • Standards Document
  • Multimedia

History Tab: The RSS feed has been removed as a notifications option since it's no longer supported in web browsers. 

Profile Tab: Notifications have been removed from the drop-down menu and moved to the main menu.

Logoff Tab: Webpage logoff.

Search Bar: A search bar has been added to the navigation menu to easily search requests in all statuses.

There are two options for the search bar:

Default-

SearchBar1.png

Alternative-

AlternativeSearchBar.png

To implement these changes, the include_menu.html page will need to be modified with the following changes:

Replace this:

<#INCLUDE filename='include_nav.html'> 

With this:

<#INCLUDE filename='include_nav_search.html'>

The search bar is also used to locate a request and undelete an electronically delivered PDF. In the search results, select a request, then click the Undelete button.

 

 

Main Menu Page Layout

The Main Menu will display tables for Outstanding Requests, Checked Out Items, and Available PDFs even if there are not currently any PDFs or Checked Out Items available. 

Each request item has quick action menu buttons that allow you to Edit, Clone Request, Cancel Request, Resubmit Request, Delete PDF, Undelete, View PDF, View Details, and Renew.

Action buttons are either hidden or greyed out if they are not applicable to the request or currently available. For example, renew would not apply for articles so it wouldn’t show at all but for a loan, it would show but be grayed out if renewals are not allowed/not available at the time.

WebPageMainMenu...png

 

 

Request Details (ViewDetails.png)

If there is no value, then the field will be left hidden.

Default Fields:

ArticleFields LoanFields OtherFields
  • Journal Title
  • Volume
  • Issue
  • Month
  • Year
  • Call Number
  • Inclusive Pages
  • Article Author
  • Article Title
  • Item Author
  • Item Title
  • Item Place
  • Item Publisher
  • Item Author
  • Item Edition
  • Title
  • Author
  • Publisher
  • Place
  • Date
  • Edition
  • ISSN/ISBN
  • Cited In
  • Cited Title
  • Cited Date
  • Cited Volume
  • Cited Pages
  • Not Wanted After
  • Accept Non-English
  • Accept AlternativeEdition
  • Document Type
  • Due Date
  • Renewals Allowed?
  • Max Cost
  • Reasons for Cancellation
 

 

Forms

New Multi-Media Form

The Other form has been removed from the form options. The other form was too ambitious and would create extra work for the staff member who had to parse out the request information.

In its place, a Multi-Media form has been added. The DLL has been updated to properly handle how each field is put into the request form.

Hidden & Removed Default Request Form Fields

The forms have been redesigned with a new look and feel. By default, several fields have been removed or hidden from the forms since the previous default pages. These fields are still in the database. After a thorough investigation of what information ILL staff needs and what information patrons will have, it has been determined some fields are no longer necessary. The deleted fields were not accurately being filled out by patrons to warrant their continued use. The hidden fields were removed from patron view since most patrons won't know the answer to those particular questions and we don't want to completely delete the field since the information can still be passed through OpenURL or other external systems into the database.

Out of the box, the following fields are no longer default fields in the 9.1 pages:

  • Hidden Fields: OCLC/DOCLINE Number, Call Number, the entire section for Where did you learn about this item, Not Wanted After Date.
  • Removed Fields: Will you accept other languages, Account Number, and Patron Notification Methods (delivery methods for both account notifications such as cleared and request notifications such as item delivered).
    • Hidden user fields are no longer required on HTML forms to preserve the values in the user record. The DLL will only update the data in the database for user fields that exist on the HTML form instead of updating al the fields. 
  • The mm/dd/yyyy requirement for the Publication Date field has been removed.

Recommendations:

  • Since the Account Number field is no longer included by default, if your institution is using Borrowing or DocDel Billing and uses DefaultAccounts, set the ShowAccountsPageWithDefaultAccount Customization Key under Web Interface | General to Yes and the user will be shown the UserAccounts page after registration.
  • If the patron chooses to accept other languages, they can add the information into the Notes section.
  • The Not Wanted After Date hidden field will use the value set in the WebDefaultNotWantedAfter customization key (default: 365 days).
  • The Notification Method for all users will be set to Electronic by default unless an alternative value is passed through when a request is submitted. The default can be changed to one of the acceptable values of Phone or Mail by adding an entry to the RemoteAuthValidation table. The Account Notification Preferences (e.g., account cleared) and Request Notification Preferences (e.g., item shipped) will be set to Email by default for all new users. The default can be changed to Text/SMS by adding an entry to the RemoteAuthValidation table.

To add a hidden field back to the request form, remove the comment <--! --> tags. Any of the removed fields (e.g., Not Wanted After Date) may also be added back to the request form; however, these fields will not be in the default web pages.

 

Site Map

A SiteMap page has been added with links to all navigation items.

To access the site map, click the link in the footer of any page.

SiteMap.png

 

 

 

Cookie Notification

Added cookie notification in accordance with the EU cookie law. By default, the cookie notification will let patrons know that cookies are utilized to obtain data on the ILLiad web pages. Patrons must accept the cookie notification before they can create and submit a request. The notification will only appear once during the patron's initial login after the 9.1 web pages have been implemented. 

If you elect to add a link your own privacy policy on the cookie notification, please make the following change to the logon.html page:
 
Replace the "#" (referenced in the highlighted section below) with the URL of your privacy policy in your logon.html file.
<!-- Cookie notice -->
<link rel="stylesheet" type="text/css" href="css/cookieconsent.min.css" />
<script src="js/cookieconsent.min.js" data-cfasync="false"></script>
<script>window.addEventListener("load", function(){
window.cookieconsent.initialise({
"palette": {
"popup": {"background": "#333333"},
"button": { "background": "#08415c" }
},

"theme": "edgeless",

"content": {
"dismiss": "I accept",
// Add privacy link here
"href": "#"

}
})
});
</script>
<!-- Cookie notice ends -->
 

 

JSON Output of Web Alerts

As of ILLiad 9.1, a new AJAX (Asynchronous Javascript and XML) method is available to retrieve a JSON output of web alerts. This improves the ability to be able to customize web alerts. For more information, see Performing an AJAX Request to View/Customize Web Alerts.

 

 

Tables Generated by Div Elements

New #DataRepeater, #DataRow, and #TRANSACTION, and #INCLUDE tags have been added.

In the new ILLiad default web pages, the tablesorter.css and HTML tables have been replaced by the new tags (#DataRepeater and #DataRow) that generate formatted div with elements based upon the template element file.

All tables, lists, and any organized values with the #TABLE tags produced by the DLL are populated and organized based on the new tags. The tags also determine whether to disable or enabled an option (e.g., the view item link) based on if the item is available. For example, if the item isn't available, then the option to view won't be displayed on the web page.

Click here for more details on how the new tags are configured

#DataRepeater

These customizations are made within the tag itself and can't be edited within the web interface to re-order requests or remove items from tables.

Attribute

Value(s)

Description

Name

Name of the repeater.

The title provided for the repeater element.

templateFile

“<Path/To/File>”

The relative path to the template file to be used for formatting the data rows.

noDataAction

Whatever string wanted.

The message to be displayed in lieu of a data table in the absence of any data.

orderby

“<columnName> [ASC|DESC]”

The column by which to order the input data.

Available ILLiad DataRepeaters in Borrowing Web DLL
 
  • ViewAllRequests
  • ViewSearchResults
  • ViewOutstandingRequests
  • ViewRequestHistory
  • ShowCurrentAccounts
  • ViewRenewCheckedOutItems
  • ViewResubmitCancelledItems
  • HistoryInformation
  • NotesInformation
  • TrackingInformation
  • BillingInformation
  • ElectronicDelivery
  • ElectronicDeliveryUndelete
  • ViewEmailNotifications
  • ViewSMSNotifications
  • NotificationInformation

Available ILLiad DataRepeaters in Lending Web DLL

  • BillingInformation
  • HistoryInformation
  • NotesInformation
  • NotificationInformation
  • TrackingInformation
  • ViewAllRequests
  • OutstandingLendingRequests
  • ViewLendingRequestHistory
  • ViewSearchResults
  • ViewShippedItems
  • ViewLendingCancelledItems
  • ViewNotifications

#Include

Attributes

  • "Restriction" - Attribute added to <#INCLUDE> tags that allow elements to display only if a certain condition is met. Currently only supports restriction "IsValidSession".

Values

  • "IsValidSession"- Allows elements to display only if the user is authenticated.

#Transaction

Attributes

  • "CompareValue" - Attribute added to <#TRANSACTION> and <#DATAROW> tags that allow elements to display differently based on certain database value associated with the transaction.

In the example below, the content of a div would be hidden by making the class "d-none" if the transaction is not of type "Article".

div class="<#TRANSACTION displayStyle='CompareValue' field='RequestType' compareValue='Article' disabledValue='d-none'>">This is content</div>

Values

See the field values below for the #DataRow values. The #Transaction tag can utilize the same values.

#Datarow 

Used in conjunction with the #DataRepeater tag. It provides a string replacement within DataRow templates that are being constructed by the DataRepeater. The tag will be replaced by the transaction number of the corresponding data which is being iterated through by the data repeater. It will additionally be formatted to ISO8601 (YYYY-MM-DD) by the style keyword. See example below:

<span class="convert-local" data-iso8601="<#DATAROW field="CreationDate" display="ISO8601">"><#DATAROW field="CreationDate"></span>

ISO8601 - formats date according to the ISO8601 standard.

  • Currency - Format numerical field by USD standard.
  • Percentage - Format decimal value as a percentage.

Attributes

  • "scopedRowHeader" - Used in conjunction with the hideColumnHeaders when enabled. This forces the table output to use the "TH" HTML tags for the first column instead of "TD". By default, the attribute is disabled. This option is added to prevent issues in older web pages, where CSS may not have been applied to the TH tags and may display the values differently than expected.
    • To enable the scoped row headers, use the following type of TABLE tag that sets scopedRowHeader to true.
      <#TABLE name="DetailedInformation" headerText="Transaction Information" hideColumnHeaders="true" scopedRowHeader="true">
      To produce an output like:
      <tr class="row-even">
      <th scope="row">
      ISSN/ISBN
      </th>
      <td>
      9780735262454
      </td>
      </tr></code
  • “Field” - The name of the row element which to replace the tag with.
  • “Style” - The style in which to format the replacement text.
    • Special tag replacement functions are reserved words for the “Field” attribute which allows for specialized or conditional behavior for a given DataRow and has special corresponding attributes.
  • "CompareValue" - Allows elements to display differently based on certain database value associated with the transaction.

Values

  • FileSize - "Default" is a user-friendly display (e.g., 203.99 KB). Alternatively, the file size can be set to "Bytes" which will display the file size in bytes (e.g., 208885). 
    • <#DATAROW field='FileSize'>
    • <#DATAROW field='FileSize' displayStyle='Bytes'>
  • Title - If the RequestType is Loan, then the LoanTitle will be displayed. If the RequestType is article, then the associated title in the database based on the DocumentType will be shown based on the request (e.g., PhotoJournalTitle). 
  • Author - If the RequestType is loan, the LoanAuthor will be displayed. If the RequestType is Article, then the associated author based on the DocumentType will be displayed.
  • TransactionStatus - The display status will be used. 
  • "RequestActionAllowed" - Allows for tag replacement based on whether those tags are enabled or disabled for certain transaction types on specific transactions. It can be used for building new menus. These options should be used similar to how the options were used with the <#MENU> tags in the olde web pages.
    • Borrowing DLL Action Names: Edit, Cancel, Renew, Resubmit, Clone, ViewPDF, DeletePDF, and UndeletePDF.
    • Lending DLL Action Names: Edit, Cancel, Renew, Resubmit, and Clone.
    • Other attributes available on tag:
      • Enabled/Disabled Values:
        • enabledValue - Will output this value when the action is allowed.
        • disabledValue - Will output this value when the action is not allowed. This will output "disabled" when the edit action is not allowed for a transaction. In ILLiad 9.1 web pages this is used to control which CSS classes are added to a request action.
      • CheckHasValue -Adds the ability to check if a value exists and is not blank for a transaction. Similar to RequestActionAllowed with enabledValue and disabledValue. 
        • DisplayStyle - Adds a value based on the CheckHasValue output.
          For example: The following will output the word "Missing Publisher" if the LoanPublisher field is blank.
          <#TRANSACTION field='LoanPublisher' displayStyle='CheckHasValue' disabledValue='Missing Publisher'>
      • CompareValue - Adds the ability to compare a value from a field to offer differing functionality
        • DisplayStyle- Displays request type value of the transaction from CompareValue Outout.
          For example, the transaction request will compare the loan value in the example below. If the item is not a loan, then the output will be "d-none" which is the CSS class to hide the HTML element.
          <div class="<#TRANSACTION field='RequestType' displayStyle='CompareValue' compareValue='Loan' disabledValue='d-none'>">

Request Action Allowed Example:

<a class="dropdown-item btn btn-light <#DATAROW field='RequestActionAllowed' name='ViewPDF' disabledValue='disabled'>" href="illiad.dll?Action=10&amp;Form=75&amp;Value=<#DATAROW field='TransactionNumber'>" class="ViewPDF">

If you are utilizing the RequestActionAllowed field value to specify the setting, then you can have the string look for a name-value (e.g., ViewPDF) and then choose to enableValue or disableValue.

For example, in the code above, the RequestActionAllowed, will allow for the ViewPDF to be a diabledValue so users can't see the option on the web interface if there are no current files to view. If there were files to view, then the string wouldn't substitute the values and the user would be able to see the button and click viewPDF.

Attributes

Value(s)

Description

Field

RequestActionAllowed

Specifies the setting.

name

Borrowing DLL Action Names: Edit, Cancel, Renew, Resubmit, Clone, ViewPDF, DeletePDF, UndeletePDF

The name of the specific transaction action to check if specifically Enabled/Disabled for the requested item.

disabledValue

The designated string. Usually 'disabled'

This is the replacement string substituted on the event the option is not available for the requested item and has been temporarily disabled.

enabledValue

Whatever string wanted

This is the replacement string substituted on the event the option is enabled for the requested item. 

 

DataRowAndDataRepeater.png

Questions?

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

Contact Support