SAPUI5 runtime can be configured using several options. In this blog post, I’ll demonstrate through a program the configuration of the SAPUI5 runtime using script tag attributes. So let’s get going.
Prerequisites
Create an Application Project for SAPUI5
Open Eclipse and go to the menu option, File -> New -> Other…. In the New window, open the node SAPUI5 Application Development and select the option Application Project. Click on the Next button.
Provide a name to the project. Let’s call it sapui5.config.demo. Select the library sap.m and uncheck the option Create an Initial View. Click on the Finish button.
A project structure similar to the one shown below should be created
Modify index.html
Open the index.html file and write the following code within the script tags.
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta http-equiv='Content-Type' content='text/html;charset=UTF-8' />
<script
src="resources/sap-ui-core.js"
id="sap-ui-bootstrap"
data-sap-ui-libs="sap.m"
data-sap-ui-accessibility="false"
data-sap-ui-debug="false"
data-sap-ui-language="de"
data-sap-ui-theme="sap_bluecrystal"
data-sap-ui-xx-fakeOS="ios">
</script>
<script>
// Set the log level to INFO
jQuery.sap.log.setLevel(jQuery.sap.log.Level.INFO);
// Get reference the Core object
var oCore = sap.ui.getCore();
// Read Core
var oLibMap = oCore.getLoadedLibraries();
for (key in oLibMap) {
jQuery.sap.log.info("Loaded Library name", key);
}
jQuery.sap.log.info("Has model?", oCore.hasModel().toString());
jQuery.sap.log.info("Is mobile?", oCore.isMobile().toString());
// Read Configuration object from the Core
var oConfig = oCore.getConfiguration();
jQuery.sap.log.info("Accessibility", oConfig.getAccessibility().toString());
jQuery.sap.log.info("Debug", oConfig.getDebug().toString());
jQuery.sap.log.info("Language", oConfig.getLanguage());
jQuery.sap.log.info("Locale", oConfig.getLocale());
jQuery.sap.log.info("Version of SAPUI5 Framework", oConfig.getVersion());
jQuery.sap.log.info("Theme", oConfig.getTheme());
jQuery.sap.log.info("User agent", navigator.userAgent);
// Reset the log level to default of ERROR
jQuery.sap.log.setLevel(jQuery.sap.log.Level.ERROR);
</script>
</head>
<body class="sapUiBody" role="application">
<div id="content"></div>
</body>
</html>
Deploy and Run Application
Start your server and deploy the application. Open a new browser window (this example uses the Chrome browser) and open the Developer Tools.
Open the following URL in browser http://localhost:8080/sapui5.config.demo/
Please use the port number according to your server configuration. Loading the index.html will print the logs in the Developer Tools console. The code within the first script area (a.k.a Bootstrap) contains several configuration parameters (in the format data-sap-ui-PARAMETER-NAME=”value”) which are read by the code in the second script area. The log level is changed from the default ERROR to INFO and back for the purpose of printing out the jQuery.sap.log.info() statements.
API Reference
In the next blog I’ll demonstrate the configuration of the SAPUI5 runtime using URL parameters with the same program. See you then!