Having Different Start Pages for each Browser Language

The easiest way to setup a multilanguage start page in SiteKiosk is to use the included Start Screen under Start Page & Browser in the SiteKiosk Configuration. Template 1 of the Start Screen supports different languages out of the box.

If you want to directly call different URLs based on the selected browser language you can use the following HTML page.

<!DOCTYPE html>
<html>
	<head>
		<title>Multilanguage Start Page Switcher</title>
		<script type="text/javascript">
			
			//Configuration
			
			//URLs based on their language
			var StartPage = new Array();
			StartPage[5] = "https://europa.eu/european-union/index_cs";	// Czech
			StartPage[6] = "https://europa.eu/european-union/index_da";	// Danish
			StartPage[7] = "https://europa.eu/european-union/index_de";	// German
			StartPage[8] = "https://europa.eu/european-union/index_el";	// Greek
			StartPage[9] = "https://www.usa.gov/"; // English
			StartPage[10] = "https://europa.eu/european-union/index_es"; // Spanish
			StartPage[11] = "https://europa.eu/european-union/index_fi"; // Finnish
			StartPage[12] = "https://europa.eu/european-union/index_fr"; // French
			StartPage[16] = "https://europa.eu/european-union/index_it"; // Italian
			StartPage[19] = "https://europa.eu/european-union/index_nl"; // Netherlands
			StartPage[20] = "https://www.regjeringen.no/"; // Norwegian
			StartPage[21] = "https://europa.eu/european-union/index_pl"; // Polish
			StartPage[22] = "https://europa.eu/european-union/index_pt"; // Portugese
			StartPage[24] = "https://europa.eu/european-union/index_ro"; // Romanian
			StartPage[25] = "http://government.ru/"; // Russian
			StartPage[29] = "https://europa.eu/european-union/index_sv"; // Swedish
			StartPage[37] = "https://europa.eu/european-union/index_et"; // Estonian
			StartPage[39] = "https://europa.eu/european-union/index_lt"; // Lithuanian
			StartPage[1033] = "https://www.usa.gov/"; // English US, only applies to Chrome engine
			StartPage[2057] = "https://europa.eu/european-union/index_en"; // English UK, only applies to Chrome engine
			StartPage[2222] = "https://www.un.org/"; // neutral
			//Examples of other language ids: 1 Arabic, 4 Chinese, 17 Japanese, 55 Georgian, 86 Galician
			
			//Default language to be used if no other language matches
			var skdefaultlanguage = 2222; // neutral entry
			
			//End of Configuration
			
			try{
				//Code for SiteKiosk IE engine
				window.external.InitScriptInterface();
				//Get the major language id of the currently selected language
				sklanguageid = SiteKiosk.LocaleManager.LangID & 1023;
				redirectBasedOnLanguage(sklanguageid);
			}catch(e){
				//Code for SiteKiosk Chrome engine
				(new Function(_siteKiosk.getSiteKioskObjectModelCode()))();
				
				//Get the major language id of the currently selected language with special handling for US and UK English in SiteKiosk Chrome engine
				sklanguageid = _siteKiosk.objectModel.callHostFunction("system.windows.skLegacy.executeScript", "if ((SiteKiosk.LocaleManager.LangID & 1023) !== 9) return SiteKiosk.LocaleManager.LangID & 1023; else return SiteKiosk.LocaleManager.LangID;");
				redirectBasedOnLanguage(sklanguageid);
			}
			
			function redirectBasedOnLanguage(sklanguageid){
				if (StartPage[sklanguageid] != null)
					document.location = StartPage[sklanguageid];
				else
					document.location = StartPage[skdefaultlanguage];
			}
		</script>
	</head>
	<body>
		...
	</body>
</html>

Copy and paste the code to an editor like Notepad and save it as an HTML file, e.g. multilanguagestartpageswitcher.html. Put the file in the folder ..\SiteKiosk\html. Open the configuration of SiteKiosk, go to Start Page & Browser and select the file as your start page. The example works with IE and Chrome engine.

The configuration part of the above example code starts with an array that includes the language ids for the languages supported by SiteKiosk and the URLs associated with them. Change the URLs to match your needs. You may also use the file protocol for local pages.

The skdefaultlanguage includes the language id of the above array that should be used in case no matching id can be found in the array. The example uses a special neutral value, you may as well use one of the existing languages, e.g. 9 for English.

The try part of the code contains code for the IE engine. It uses the LangID property of the SiteKiosk Object Model to determine the currently selected browser language.

The catch part contains the code for the Chrome browser. The Chrome browser Object Model code (documentation available on request from support-europe@provisio.com) calls the same LangID property of the classic SiteKiosk Object Model. Note that the Chrome browser distinguishes between US and UK English. 

Once the language id has been indentified the redirectBasedOnLanguage function calls the URL associated with that id or the one that has been set as the default, if no match can be found.

 

The Powerful Run Executable Job Action Type of SiteRemote

An often overlooked action type of the SiteRemote job system (in your SiteRemote team choose SiteKiosk from the menu and then select the job tab) is one called Run Executable. It is a more general action type than most of the others but that is what makes it so powerful. What it allows you to do is to basically run any executable including the use of parameters.  

 

You can run Windows Powershell, batch files, (silent) installers, Windows system tools and so on. This allows you to administrate your SiteKiosk Windows machines in almost every possible way in addition to the SiteKiosk administration and monitoring the SiteRemote GUI already helps you with.

It is even possible to update SiteKiosk remotely with the help of the Run Executable job action type. Please contact our support for more information, because the exact method varies based on the SiteKiosk version in use.

This job action type runs on the client invisible with administrative privileges in the context of the Local System user or visible with the rights of the user that is logged in at the moment the job is executed.

If the executable you run provides a return value you can use that to show whether the job was successful or not on the SiteRemote job page. Not using this option will show the job as successful if starting the executable did not return an error.

A simple example that starts Notepad with the SiteKiosk license text would be this command line:

"c:\windows\notepad.exe" "c:\program files (x86)\SiteKiosk\license-en.txt"

If you then choose the option Visible execution with user rights, the job will start Notepad with the license text file on the SiteKiosk Windows machine, once the job has been assigned and ececuted on a client.

Please note that past DevBlog posts have described how to access 64-Bit system folders and registry paths (https://devblog.provisio.com/post/2015/11/03/Accessing-64-Bit-System-Folders-and-Registry-from-the-SiteRemote-Job-System.aspx) or how to unzip zip archives uploaded with a SiteRemote job step to a specific destination folder (https://devblog.provisio.com/post/2016/02/22/Distributing-the-SiteKiosk-Windows-Start-Screen-with-SiteRemote.aspx) all with the help of the Run Executable job action type.

Keep Additional Windows Visible when Using SiteKiosk Windows in Fullscreen Mode Without a Taskbar

This example script is intended to be used when SiteKiosk Windows runs in fullscreen mode without a taskbar. When additional windows are allowed, either browser or application windows, users can intentionally or unintentionally hit the minimize button. Without a taskbar the window is then hidden to the user.

This script will scan for minimized windows and restore them. It can be used with the Chrome and Internet Explorer browser engines of SiteKiosk Windows. It works for browser windows and windows of other applications.

Please note that you need to enable the option to 'Keep the SiteKiosk main window in the background (not TopMost)' when using the Internet Explorer browser engine of SiteKiosk Windows. The option can be found under Start Page & Browser -> Internet Explorer -> Advanced. This option is not required when using the Chrome browser engine of SiteKiosk Windows as it behaves like this by default.

The script looks like this:

//If using the Internet Explorer browser engine of SiteKiosk, please activate the option 
//Keep the SiteKiosk main window in the background (not TopMost)
//when using this script. The option can be found in the SiteKiosk configuration under
//Start Page & Browser -> Internet Explorer -> Advanced.
//The Chrome browser engine of SiteKiosk behaves like this by default.

SiteKiosk.Scheduler.AddPeriodicEvent(1000, windowWatchdog);

function windowWatchdog(){
	SKWindows = SiteKiosk.WindowList.Windows;
	for (var i = 1; i <= SKWindows.Count; ++i){
		if (SKWindows.Item(i).WindowType !== 1 && SiteKiosk.WindowList.IsMinimized(SKWindows.Item(i).Handle)){
			SiteKiosk.WindowList.Restore(SKWindows.Item(i).Handle);
		}
	}
}

It uses the Scheduler object of the SiteKiosk Object Model to schedule a periodic event that calls a function that checks the status of all windows every second.

The Windows collection of the WindowList object includes all existing windows. The script steps through all of them and looks for windows, that are not the main window of SiteKiosk, which would have a WindowType of 1, and are minimized.

It will then use the Restore method to make the window visible again.

Using HTML Tags to Customize Text Fields of the SiteKiosk Windows Start Screen

When using the Start Screen of SiteKiosk Windows, you can use HTML tags in text fields to customize the appearance. This allows you to create individual projects beyond what is already possible with the standard options of the Start Screen Editor.

To give an example of the possibilities, you can open the SiteKiosk Configuration tool, go to Start Page & Browser and select the Start Screen. From there, click on Customize, then on Start Screen Editor and open the editor. For this example select Template 3, which is empty by default.

Let's add a new element of the Web link type. Note that you can do this with any element that has text fields, this is usually the caption for the element.

After the Web link element has been added, edit it by opening the properties. Go to Caption and use the Text property at the top of the page. Note that on this page you can already edit the font, size and color of the complete text. But this example wants to show that you can override all of this with HTML tags. You can give each character of the default text, which is Web, a different look and even a function.

In this example change the default Text size to 50 and write this into the Text field:

<b>W</b><span style="color: yellow;font-family:cursive;font-size:22px;">e</span><span onclick="alert('Show this alert when clicking on the b character!');" style="color:red;font-size:34px;">b</span>

This will make the W bold while it keeps the defined general size, font type and color, it will make the e yellow while giving it a size of 22 pixels and assign the cursive font to it, the b will show in red with a size of 34 pixels and display an alert window when being clicked. This just demonstrates a few of the options you have, because the text field allows HTML tags to be used.

When you start SiteKiosk, the result will look like this, with an open alert window after clicking on the b character:

Create a new project template from an existing project

It is possible to make existing SiteCaster projects in SiteCaster permanently available again as templates. This entry describes how to create a template from an existing project if you have an own server.

First you have to export the corresponding project:

1. Open the project in the editor and copy the project ID from the URL.

for example:

https://www.siteremote.net/sitecastercms/editor/assets/index.html#app-editor?projectId=5e7b5098415fcafc08348a01&variantId=5e7b5098415fcafc08348a03

2. Insert the project ID in the following line.

3. https://www.siteremote.net/sitecastercms/api/projects/5e7b5098415fcafc08348a01/export

4. Copy the URL

5. Open a new tab and paste the created export address – press Enter

6. Press Enter to download the zip file 

In the second part you have to modify the project folder and transfer it to a template folder:

1. Unpack the zip file.

2. Rename the content.json file located in the folder to content.original.json

3. Go to the following directory on the server:

C:\Program Files (x86)\PROVISIO\SiteRemote\Web.SiteCaster\server\projects\projectTemplates

4. Copy one of the existing template folders and paste it again.

5. Rename the folder (e.g. name of the template).

6. Replace the image file in the folder with an image file of your template, whereby the name preview must be retained and the file type has to be JPG.

7. Open the projectTemplate.manifest file in the folder with a text editor (e.g. Notepad)

8. Change the name of the template "name": "${string:StartScreenTemplate.name}", e.g. to "name": "TEST-Template”

9. Change the Project ID "projectID": "311f9e4eb2427f5ec02e32f1" in the file to create a unique new ID e.g. "projectID": "777f9e4eb2427f5ec02e32f1

10. Open the folder: 00000000000000000000

11. Delete the content of the folder

12. Add the complete content of the zip folder with the content.original.json file into the 00000000000000000000000000 folder

13. Open the SiteCaster Editor in a browser and click on the Create New Project button -> The new project template is now available

If you want to offer your template on your server in a team-specific manner, you must use the following path for the procedure described above:

C:\Program Files (x86)\PROVISIO\SiteRemote\Common\Teams\teamStorage\<TeamId>\projectTemplates

The team ID specified in the path is individual per team and can be found on the server administration page in the tab teams.

Starting the SiteKiosk File Manager from a Custom Button in SiteKiosk Windows Chrome Browser

As a default option the SiteKiosk file manager is only available with IE-based skins. There are different ways to also start the file manager when using the Chrome browser of SiteKiosk Windows. How to start the SiteKiosk file manager when using the Chrome Browser and the Start Screen has been described here. Now we want to take a look at how to start the file manager using the custom button option.

First we need to create a local JavaScript file that takes care of the task of opening the File Manager. The code for that file can look like this:

function openFileManager(){
 //Defines the available Window styles for the File Manager window
 var WS_OVERLAPPED = 0x00000000;
 var WS_MAXIMIZEBOX = 0x00010000;
 var WS_MINIMIZEBOX = 0x00020000;
 var WS_THICKFRAME = 0x00040000;
 var WS_SYSMENU = 0x00080000;
 var WS_BORDER = 0x00800000;
 var WS_CAPTION = 0x00C00000;
 var WS_MAXIMIZE = 0x01000000;
 var WS_MINIMIZE = 0x20000000;
 var WS_POPUP = 0x80000000;
 var WS_OVERLAPPEDWINDOW = WS_OVERLAPPED | WS_CAPTION | WS_SYSMENU | WS_THICKFRAME | WS_MINIMIZEBOX | WS_MAXIMIZEBOX;
 var WS_EX_TOOLWINDOW = 0x00000080;
             
  //Creates the File Manager window and assigns its settings
  var mediabox = SiteKiosk.SiteKioskUI.CreateHTMLDialog();
  mediabox.URL = SiteKiosk.SiteKioskDirectory + "skins\\public\\Media\\FileManager\\Selector.html";
  mediabox.Styles = 13565952;
  mediabox.Icon = SiteKiosk.SiteKioskDirectory + "skins\\public\\Media\\FileManager\\Img\\Icons\\fms_ico.ico";
  mediabox.Width = 1024;
  mediabox.Height = 700;
  mediabox.ExStyles = 0;//
  mediabox.Border = true;
  mediabox.Type = "FileManagerDlg";
  mediabox.TopMostWindow = false;
  mediabox.CloseOnInput = false;
  mediabox.Parent = SiteKiosk.WindowList.MainWindow.SiteKioskWindow.Window;
  mediabox.ShowDialog();
			
}

Just copy and paste the code to an editor and save it for example as "OpenFileManager.js" at "…\SiteKiosk\Html".
Next it's time to open the SiteKiosk configuration and adding this script file at "Start Page & Browser-->Advanced-->On startup of SiteKiosk execute the following script file".

Then create an HTML file (e.g. OpenFileManager.html) with the following content and save it in the folder "...\SiteKiosk\Html":

<html>
<head>
<script>
    (new Function(_siteKiosk.getSiteKioskObjectModelCode()))();
    _siteKiosk.objectModel.callHostFunction("system.windows.skLegacy.executeScript", "SiteKiosk.ScriptDispatch.openFileManager();");            
     window.close();
</script>
</head>       
<body>
    <!-- Body is empty as this window is only used to open the File Manager //-->
</body>
</html>

The function OpenFileManagerExt is "Using the Classic SiteKiosk Object Model in SiteKiosk Windows Chrome Browser" in combination with the "ScriptDispatch Object" from classic SiteKiosk Object Model to call the external script function "openFileManager".

Now add a button in the Chrome Browser Skin under "Start Page & Browser-->Customize-->Browser Toolbar-->Individual Buttons-->Set individual weblink or program" which calls the above HTML file.

General Note:
Which directories are displayed in the File Manager (download folder, etc.) must be specified beforehand under "Files & Downloads", while you have selected the Metro IE Skin under "Start Page & Browser".
The path for the download folder should match the download folder in the Chrome Browser skin.
Since the download folder matches with the default settings "C:\Users\Public\Documents\SiteKiosk" you normally only need to activate the File Manager and Downloads.

Finally it should look like this when the File Manager is opened:

Starting Password Protected Applications from the Start Screen of SiteKiosk Windows

SiteKiosk Windows allows you to password protect the starting of external applications. For technical reasons this feature is not available for the Application link element of the Start Screen, which is the element you would normally use to add an application to the Start Screen. By using the HTML Widget element instead, the password protection for applications can be used with the Start Screen. Here is how.

Open the SiteKiosk configuration and go to Applications. Add the external applications you need to the list. Note that you can use the arrows on the left side of the list to move applications up and down to rearrange the order.

 

Use the settings dialog for an application to make the start of it password protected.

 

Next go to Start Page & Browser in the configuration of SiteKiosk and select the Start Screen. Click on Customize, select Start Screen Editor and use the Open Editor button. Choose the template you want to use and add an HTML Widget element. Copy the following lines:

<script type="text/javascript">
    function StartPWprotectedApp() {
        parent._siteKiosk.objectModel.callHostFunction("system.windows.skLegacy.executeScript", "SiteKiosk.ExternalApps.Item(1).Run(true);");
    }
</script>
<div style="background-color:FF235A;height:100%;padding:10px;font-family:Arial;cursor:pointer;" onclick="StartPWprotectedApp();">
    <div style="height:100%;width:100%;font-size:30px;text-align:center;margin-top:42%;">Start Password<br/>Protected App</div>
</div>

Paste the code into the HTML code box in the properties dialog of the HTML Widget.

 

You can use the div tag to style the element to your liking. The line

parent._siteKiosk.objectModel.callHostFunction("system.windows.skLegacy.executeScript", "SiteKiosk.ExternalApps.Item(1).Run(true);");

is what calls the actual application. Note the number 1 as the argument for the Item method (more information can also be found here and here). This calls the actual application based on the position in the application list of the SiteKiosk configuration. 1 calls the first application in the list, 2 calls the second application and so on. Add as many HTML Widget elements as you need.

The final result based on the example code above will look like this in SiteKiosk:

Using tags to display variants of a SiteCaster project on different machines

If you want to display variants of a SiteCaster project that differ only in a few elements, you can use the tag feature in SiteCaster as a display condition.

In the following example, a SiteCaster project is published on two machines to display two variants of a project:

Log into your SiteRemote team and select the Monitoring tab. To generate tags for your machines, right click on a machine in the tree view and select Assign Tags.

 

Then enter the name of your tags e.g. Terminal 1 and Terminal 2 press Add and select it using the checkbox. Confirm the setting with Save.In SiteCaster, generate your sample project using the empty template. Use the Add button to add a swap container to the project. Insert two different images into the swap container. In order to use the Tag display condition, you will need to enable the expert mode in SiteCaster. To do so, you need to insert &expert at the end of the URL in the URL address field of your browser and then press Enter to reload the project. 

After activation of the expert mode you see the Expert Edit button in the tool bar.  

Then select one of the images and open the properties dialog by double-clicking on the image. Go to the section Display condition and select the Display under these conditions option. Activate the check box Tag and enter the tag name Terminal 1. Close the properties dialog with pressing the Save button. Activate the same setting on the other image with the tag name Terminal 2. After publishing the project to both clients the first image is displayed on the device with the tag Terminal 1 and the second image on the device with the tag Terminal 2. The described scenario can be extended with further tags as you like.   

Unload a SiteCaster Webview when it is not displayed

Generally, SiteCaster loads webviews at the point where they first appear in a session in SiteCaster. In order to avoid reloading a webview each time again when it is displayed e.g. in container types like sequence, overflow container or swap container, it is always kept in the loaded state. This has the side effect that if the displayed webview contains audio elements these are also audible in the non-displayed state. If you want to prevent this you can use the expert setting shouldUnloadWhenHidden. Additionally you can use the setting shouldUnloadWhenHidden to bring certain webviews always in a newly loaded state when they are displayed.

To activate the expert setting shouldUnloadWhenHidden, open the project in the SiteCaster editor. In the URL address field of your browser you must add &expert at the end of the URL and then press Enter to reload the project.

After activation of the expert mode you see the Expert Edit button in the tool bar. Create a webpage element on your project page, select it and press the Expert Edit button.

At the bottom of the Expert Settings dialog box enter the property shouldUnloadWhenHidden. In the dropdown menu on the right side select Boolean and activate the checkbox. Then press the plus button and save the setting.

 

After pressing the expert setting there is an additional line shouldUnloadWhenHidden with activated checkbox displayed in the expert settings. Close the expert settings dialog with pressing the save button. After activation of this setting the webview will be unloaded when it is not displayed.

 

Extend the SiteKiosk Browser workspace to multiple screens (Combine several screens to one screen)

To extend the workspace of the SiteKiosk Windows browser to multiple screens that are configured as separate screens in Windows with "Extend these screens", proceed as follows:

 

A. In the SiteKiosk configuration under "-->Start Page & Browser-->Secondary Monitor", deactivate the "Restrict mouse pointer to first monitor browser area" option. (The option "Activate secondary monitor" must remain deactivated!).

B. Now you have to allow the display of new browser windows on the second monitor.
For this open the SiteKiosk configuration file you created (e.g. ...\SiteKiosk\Config\YourConfig.skcfg) with an editor (e.g. Notepad) and search for the following line:

<windowmanager>

Add the following content to the next line:

<disallow-window-clipping>true</disallow-window-clipping>

Like this:

<windowmanager> 
   <disallow-window-clipping>true</disallow-window-clipping>  
   <show-block-msg>true</show-block-msg> 
   <use-secure-user>false</use-secure-user>
</windowmanager>

For more information see "20. Remove restriction to limit windows to the SiteKiosk display area":
https://www.provisio.com/helpconsole/SiteKiosk%20Help/en-US/default.htm?manuell_editierbare_optionen.htm

C. The next step is to adjust the "workarea" of SiteKiosk to the resolution of all your monitors combined. To do this, use the setting described at "5. Restrict SiteKiosk to a Portion of the Screen":
https://www.provisio.com/helpconsole/SiteKiosk%20Help/en-US/default.htm?manuell_editierbare_optionen.htm

Example:
Two monitors side by side with a resolution of 2560x1440 px each give a workarea of 5120x1440px on both monitors.

The corresponding "workarea" adjustment looks like this:

<workarea enabled="true" absolute-coordinates="true">
      <capture-mouse>false</capture-mouse>
      <left>0</left>
      <top>0</top>
      <right>5120</right>
      <bottom>1440</bottom>
</workarea>

After saving the changes and starting SiteKiosk, the browser extends across both monitors.

 

NOTE:
Due to Windows User Account Control (UAC) restrictions, you may need to start the text editor as an administrator (right-click-->Run as administrator) to save the changes in the Programs directory.