7.0 KiB
Forms
All areas you can navigate to in the AyaNova web application are described as "forms" in the documentation.
It is our goal that, AyaNova displays and acts as similarly as possible on every supported web browser, platform and operating system.
A user should have the same experience on Chrome in Linux, Safari in iOS or FireFox in Windows (for example) and we test and support each release against the most recent two releases of all major browsers at the time of release.
Responsive display
The AyaNova interface is designed to be "responsive" which means it will adapt what is displayed to accomodate to the size of the device being used.
On narrow screen devices such as smart phones and smaller tablets the form will be displayed vertically as a single column of fields:
On wider screen devices form fields will flow outwards horizontally to make the best use of screen space:
In addition to the layout changing, some elements are customized to be easiser to use with specific sizes of devices.
For example a data table list of records will show as a traditional horizontal table with columns on a wider display to take advantage of the horizontal space and on a smaller device the same list will appear as a series of vertical boxes containing each record.
This avoids the need to scroll sideways on any screen size.
The responsive display is dynamic which means it will adapt on the fly to the screen size even if it changes, so, for example if you rotate a narrow screen sideways the display will change to take advantage of the wider display area.
Some browsers and devices may not recognize a change of width and it may be necessary to refresh the page for the view to fully adapt in some cases. If you have to scroll a data table sideways hit refresh / reload in the browser.
Customizable labels
Nearly all static text displayed in AyaNova is customizable via the Translation feature
Main user interface components
The overall AyaNova user interface consists of three main components:
- App Bar at the top
- Navigation drawer to the side
- View displayed in the main largest area of the screen
App bar
The App bar is a form of tool bar and it's purpose is to show where you are in AyaNova, provide links to move to other places in AyaNova and tools to interact with the current view.
A blue app bar indicates the current view is in a main area of AyaNova, either a data list or some other form not a specific record being edited.
A green app bar indicates a specific record is being edited in an edit form.
Navigation button
The far left side of the App bar shows the button to open the navigation drawer as a "hamburger" icon which looks like three horizontal bars stacked on top of each other and is used to show or hide the navigation drawer which is used to move around in AyaNova.
The center part of the App bar shows an icon and information pertaining to which record or area of AyaNova is currently open.
The right side shows a bell icon which indicates if any unviewed notifications have arrived and is also a shortcut to open the user's notifications form to view notifications.
Finally, to the far right is the context menu which appears as three dots stacked on top of each other. On wider screen devices some commonly used context menu items will be "surfaced" between the notifcation bell icon and the context menu icon to save a click.
Navigation drawer
The navigation drawer shows all the areas of AyaNova the currently logged in user has rights to access.
It's called a 'drawer' because is slides in and out as required to save screen space.
Clicking on an item in the navigation drawer will cause that view to be displayed in the view area of AyaNova.
The navigation drawer can be displayed or hidden by clicking on the "hamburger" icon in the app bar.
Main view area
The main View area is where the currently selected data table / edit form is displayed and used.
Form context menu
The context menu icon button is located in the app bar above every form in AyaNova and looks like 3 dots stacked vertically.
When you click on the context menu icon button a context menu will open with options relevant to the particular area of AyaNova you are in.
It is called the "context" menu because the options in it will change based on the context of the particular form in use, User rights and the current state of an object being edited.
On larger screens the most commonly used options will move from inside the context menu to the main app bar to save a click.
While the top options in the context menu will change depending on the context, all context menus will have the following options at the bottom:
- Search option for searching the AyaNova database
- Help option for viewing help about the specific form being displayed (this manual)
Main forms that are not related to editing a single object also have the following options:
- About option for viewing version information and technical support information.
- View on map forms for objects with address controls will have a "View on map" menu item which when clicked will attempt to display the current objects location on a map provided there is enough information for the online map provider chosen to determine the location. The most accurate location is had by entering the latitude and longitude into the fields provided in the "Street" address section however most map providers can match to a postal code or street address when required.
For items that are mobile or may not have a street address such as a Customer unit in remote locations the latitude and longitude are available for location.
The default map provider is Google Maps but you can select from many other options or add your own under User settings map url template setting.
Data table forms
All the main AyaNova list forms are "data table forms" and documented in detail in the data table forms documentation page.
Edit forms
Individual business object editing forms have a common set of features and are documented in detail in the edit form documentation page.
Form controls
AyaNova forms consist of a common set of controls which are documented in detail including tips for faster data entry and special features they might have in the common controls documentation page.