==========
Homescreen
==========

The home screendisplays inforamation about the telephone system for users. 
For instance contact information of the IT support reference person, texts from the company, and links to external ticket systems.

For example a download link of the Teamviewer Quicksupport can be established there.
It is especially helpful regarding the telephone support because it can easily be refered to the respective link. "Please click on the Quicksupport link in the Support app".

Administrators can be led to information of how to configure certain user objects or which specialities must be considered within the relevant customer system.

The home screenis the only function that is offered in the user version of the app as well as displayed on the front page.

.. thumbnail:: homescreen_users.png

   Arrangment of elements on the homescreen

Each element can be changed in the admin version of the app or new elements can be added.

Manage elements
===============

Elements that should be displayed on the home screenare managed via the admin version of the app. 
You will find the list of the available elements via the menu item ``Home Content`` in the menu bar.

.. thumbnail:: homescreen_list.png
   :align: right

   List of available elements

The displayed elements can be arranged or found by searching them via the search bar. 
Additionally, buttons to add new elements, edit or delete them are located here. 

Editing elements
================

Any number of elements can be created on the homescreen. 
Via the ``+`` button new elements can be created and already existing elements can be edited via the   ``✎`` button.

.. thumbnail:: homescreen_edit.png
   :align: right

   Editing features of an element

Each element has a title or content and its importance as well as CSS class for positioning. 

If ``Admin notice`` is activated the element will merely be displayed on the home screenof the app's admin version.

Title and Content 
-----------------

The element's title can contain 255 characters maximum and 
the content field 15.000 characters maximum per element. 
In reference to the content the length of the generated HTML is important, not the length of the content in the editor. 

.. list-table:: Links of the elements

   * - Externe Seite
     -  https://www.trizwo.de/
     - Will be opened in a new window
   * - Phone number
     -  tel:+49406119800
     - Will be opened in the myApps launcher of the telephone app
   * - Email
     -  mailto:support@trizwo.de
     - The email program will be opened

Order of Elements on Home screen
--------------------------------
 
The order of elements on the home screen is determined by the element's ``importance``.  
Elements of high importance will be displayed before elements of less importance. 

Size of elements
----------------

By giving ``CSS classes`` the size of elements for various screen sizes can be defined. 
As a result, important information can be placed on small screens or on the sidebar of the myApps launcher. 

A bootstrap template system is used in the app. Necessary CSS classes derive from the implemented `Grid System <https://getbootstrap.com/docs/5.1/layout/grid/>`__.
In the basic installation three elements are pre-configured, which have been defined as the following CSS classes and importance:

.. list-table:: Example of pre-configured Elements
   :widths: 25 25 50
   :header-rows: 1

   * - Title
     - Importance
     - CSS classes
   * - Support
     - 10
     - col col-12 col-md-6 col-lg-3
   * - Contact
     - 11
     - col col-12 col-md-6 col-lg-3
   * - Welcome
     - 20
     - col col-12 col-lg-6

Distinct from their size elements will basically be displayed in the following order: 'support, contact, welcome'.
On small screens all elements have the same size and are therefore spanned over the full size of the window. Hence they will be displayed vertically::

   AAAAAAAAAAAAAAAAAAAA
   BBBBBBBBBBBBBBBBBBBB
   CCCCCCCCCCCCCCCCCCCC

If the window is bigger 'support' and 'contact' are merely half the size of the window and will be displayed parallelly. 
'Welcome' is still the full size of the window::

   AAAAAAAAAA BBBBBBBBBB
   CCCCCCCCCCCCCCCCCCCCC

On full screen all elements are merely 1/3 the size of the window and will all be displayed parallelly. 

   AAAAAAAAAA BBBBBBBBBB CCCCCCCCCC

The full window length is 12.