0 Replies Latest reply on Dec 30, 2016 1:34 AM by Sabir Valappil Thattath

    SAP ITS bgsound support on Enterprise Browser

    Sabir Valappil Thattath

      SAP ITS plays various sound files to notify its users whether the server transaction was a failure or success.

      SAP ITS achieves this by presenting a <bgsound> HTML tag to the browser.

      Though <bgsound> element was used for playing a sound in background; now it is obsolete and treated as a non-standard element.

      Hence this element is presently supported by only IE engines.

      This created a problem for the SAP users to run their existing SAP application on standard HTML5 browsers.

       

      We recently had an interaction with a customer where he was in need of running his application on a wm/ce webkit engine.

      As expected the <bgsound> tag was not functioning on the HTML5 webkit engines.

      We have solved his problem by a work around.

       

      However, in this discussion I would like to cover only Android scenario.

      Can we achieve it without modifying the SAP application?

      Yes and the answer is DomInjection!!.

       

      One option is to parse the html document to get the bgsound tag file and to replace it with HTML5 compatible audio tag.

      We put HTML element replacing logic to a javascript file and included the javascript file in the CustomDOMElements list.

       

      To know more about dominjection please refer the below link

      http://techdocs.zebra.com/enterprise-browser/1-5/guide/DOMinjection/

       

      Below is the script which will be injected and executed once the DOM is ready on the webview

       

      function playBgSound()

      {

      //get list of bg sound tag, ideally any page will hold one sound file only :-)

        var bgs = document.getElementsByTagName('bgsound');

       

         for (var bgElementIndex=0; bgElementIndex<bgs.length; bgElementIndex++)

         {    

           

            //get the url of the sound file

              var bgSrc = bgs[bgElementIndex].getAttribute("src");     

            //create a audio HTML element supported by webview

             var audioTag = document.createElement("AUDIO");

            audioTag.setAttribute("src",bgSrc);//set sound file url

            audioTag.setAttribute("autoplay","true");//set autoplay to true   

            document.body.appendChild(audioTag);//insert to document body

         }

       

      }

      playBgSound();

       

      Any custom javascript files to be injected to DOM has to be mentioned inside CustomDOMElements file (in our case file name is mytags.txt) as shown below

       

      <script type='text/javascript' src='http://10.17.121.52:9999/xampp/ebtest/bgsound/playBgSound.js' pages='*'/>

       

      The above tag ensures that the script will executed on all pages in the application. Please refer DOMInjection documentation for more details.

       

      Ensure always the CustomDOMElements file name is mentioned inside your config.xml as shown below

       

      <CustomDOMElements value="file://%INSTALLDIR%/mytags.txt"/>

       

       

      I am attaching a sample application along with this blog as bgsound.rar.

      Extact the rar file and host test.html on a server and place decode.wav file and playBgSound.js on the same location ( where test.html resides).

      Open mytags.txt file and update 'src' field so that playBgSound.js path is proper with respect to your server IP.

      Open Config.xml and update 'startpage' attribute so that test.html path is proper with respect to your server IP.

       

      Copy mytags.txt file and Config.xml file to com.symbol.enterprisebrowser folder in your android device.

       

      Your Enterprise Browser is ready to play the sound.

       

      Before that let us examine the content inside test.html

       

      <!DOCTYPE html>

      <html>

      <head>

      <title>HTML bgsound Tag Support on EB Android</title>

      </head>

       

       

      <body>

      <bgsound src=".\decode.wav" />

       

       

       

       

      <p>This doesn't create any result on the screen but it plays sound file in the background.</p>

       

       

      </body>

      </html>

       

      A plain HTML page which has a <bgsound> tag. We are going to play the sound in background while loading the HTML page test.html (your start page in config.hml)

       

      Launch EB to play the sound!!

       

      Underneath our script is replacing bgsound tag with an audiotag. Doesn't matter your SAP app is not aware of it. :-)