Surface Editing : Touch Screen Applications
  

Touch Screen Applications

Touch screens Printer settings

The touch screens of a TP Touch/Intro 8 printer, Intro 17 and a Vision display web pages with buttons, images and text. They do this by being connected to a Surface Application.
The printer in a TP Touch/Intro 8, Intro 17 and Vision must, of course, be set-up in the usual way.
The following settings have to be made in TP Touch/Intro 8, Intro 17 and Vision devices for the internal browser to find the unit in Orchestra to connect to:

Web Server IP

The Orchestra server’s IP number.

Web Server Port

The port number that the server uses for Surface Applications.
For central the port number should be 8080, as in the picture above, and for distributed setup the port number should be 18080.

Web Server Start Page

The format of this information is <Branch Prefix>:<Unit Id>.
The Branch Prefix can be found on the Branches tab in the Business Configuration application, in Orchestra. The Unit Id can be found in the Equipment Profile page for the applicable Branch.

Creating / Editing a Touch Screen Application

The procedure below is only an example of how a Touch Screen can be set up.
For more information about the components mentioned in the instruction, see “Components available in the Surface Editor” .
To create a new Surface Application for a Touch Screen, such as an Intro 17:
1. In the File menu, select New, then select Touch Screen in the New application window. Also select device type and resolution from the drop-down lists.
If you select Generic Touch as device type, the generic resolution(s) that you have created in the Manage resolutions window will be available in the resolution drop-down list.
2. Next, like for all Surface Applications, select Operation profile and, optionally, change the other settings, in the Application settings window.
When you click on OK, the Startpage opens. By clicking the Pages button, you open the Application Pages panel, where you can add a second page. You can also duplicate or delete a page.
The Startpage can not be deleted!
3. Click on the actual surface area. The following settings area will be displayed:
Here you can set Background color, Background image, Page locale and Return to start page.
4. Drag and drop the Button component(s) that you want to your Touch Screen Surface Application.
If you want a button with several rows of text, you should use the Extended button component instead.
5. For each button, select which Service should be connected to it, from the drop-down list. If you want other text than the external name of the Service to be displayed, check the Override check box and enter text in the Text field.
If you want to, edit the button image, add a link to the page, change the background color and change the properties for the text that is displayed.
The finished result may look like this:
6. Add text to the surface by dragging and dropping the Text component from the bottom left area of the page to the surface area.
The text color, font, size and properties of the text may be changed to your liking.
It is also possible to Change the font or Add new fonts, by clicking on the corresponding button in the Text properties window:
Clicking the Change button, opens the following window, where you can change font, font size and decide if the font should be Bold and/or Italic:
From this window it is also possible to Edit or Delete a font that has been added.
To add a font, click the Add button and the following window will be displayed:
After adding text, the finished result may look like this:
7. The next step is to add an image, by dragging and dropping the Image component from the bottom left area of the page.
When the image place-holder is placed on the surface, the Select image window is opened:
Select which image you want to upload, then click OK.
In the Surface Editor, it is also possible to change a few settings for the image, such as size.
Please note that rotation of for example images cannot be properly achieved in any layouts made with browsers IE7 / IE8. The rotation property is accessible but results will be unsatisfying.
The finished result may look like this:
At this stage, you might decide to add a second page to your Touch Screen.
A common use for a second page on a Touch Screen is to use it for a Vertical Message. When a customer has selected a service, the second page with a message targeted to that service will display.
8. Add a second page, by clicking the Pages button and selecting Add in the Application Pages panel.
9. Give the second page a suitable name:
10. To add a Vertical Message to the second page, drag and drop the Vertical Message component from the bottom left area of the page to the wanted position of your surface. The finished result may look like this:
11. When done entering and editing the components to your liking, make sure you save the Touch Screen Surface Application, before exiting the editor, by choosing Save, or Save as in the File menu in the upper left corner of the Surface Editor.