*&---------------------------------------------------------------------*
*&  Include           ZSOFTCOPY_HTML_BASE                              *
*&                                                                     *
*&---------------------------------------------------------------------*
*&                                                                     *
*& This file is part of ZSOFTCOPY.                                     *
*&                                                                     *
*& ZSOFTCOPY is free software: you can redistribute it and/or modify   *
*& it under the terms of the GNU General Public License as published   *
*& by the Free Software Foundation, either version 3 of the License,   *
*& or any later version.                                               *
*&                                                                     *
*& ZSOFTCOPY is distributed in the hope that it will be useful,        *
*& but WITHOUT ANY WARRANTY; without even the implied warranty of      *
*& MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the       *
*& GNU General Public License for more details.                        *
*&                                                                     *
*& You should have received a copy of the GNU General Public License   *
*& along with ZDOWNLOAD. If not, see <http://www.gnu.org/licenses/>.   *
*&                                                                     *
*&---------------------------------------------------------------------*
*&                                                                     *
*&  Author:     Ruediger von Creytz     ruediger.creytz@globalbit.net  *
*&  Copyright:  globalBIT, LLC          http://www.globalbit.net       *
*&                                                                     *
*&---------------------------------------------------------------------*


*-----------------------------------------------------------------------
* html_base
*-----------------------------------------------------------------------
FORM html_base.
  PERFORM html_base_about.
  PERFORM html_base_gpl.
  PERFORM html_base_index.
  PERFORM html_base_default_main.
ENDFORM.                    "html_base


*-----------------------------------------------------------------------
* html_base_about
*-----------------------------------------------------------------------
FORM html_base_about.

  DATA:
  ls_html TYPE string,
  lt_html TYPE it_string,
  l_laiso TYPE laiso,
  l_sptxt TYPE sptxt,
  l_gpl TYPE string,
  l_link TYPE string.

  PERFORM get_spras USING sy-langu l_laiso l_sptxt.

  l_gpl = txt_product_under_gpl.
  CONCATENATE
    '<a href="GPL.' gc_extension_htm '"'
    ' onclick="parent.openDropDownLink(''gpl'');return false">'
    'GNU General Public License'
    '</a>'
    INTO l_link.
  PERFORM replace_single
    USING '#GPL#' l_link
    CHANGING l_gpl.

  CONCATENATE
    '<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"'
    ' "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">'
    INTO ls_html.
  APPEND ls_html TO lt_html.
  CONCATENATE
    '<html xmlns="http://www.w3.org/1999/xhtml"'
    ' xml:lang="' l_laiso '" lang="' l_laiso '">'
      '<head>'
        '<title>'
          '&#x53;&#x6f;&#x66;&#x74;&#x43;&#x6f;&#x70;&#x79;'
        '</title>'
    INTO ls_html.
  APPEND ls_html TO lt_html.
  PERFORM html_add_meta CHANGING lt_html.
  APPEND '<script type="text/javascript"><!--' TO lt_html.
  CONCATENATE
    'if(top==self){'
      'window.location.href="../index.' gc_extension_htm '";'
    '}'
    INTO ls_html.
  APPEND ls_html TO lt_html.
  APPEND '//--></script>' TO lt_html.
  APPEND '<style type="text/css">' TO lt_html.
  CONCATENATE
    'h1 {'
      'color:black;'
      'font-family:arial;'
      'font-size:30px;'
      'font-style:normal;'
      'font-weight:bold;'
      'text-decoration:none;'
    '}'
    'table {'
      'width:100%;'
    '}'
    'td {'
      'font-family:arial;'
      'font-size:12px;'
      'vertical-align:middle;'
      'width:100%;'
    '}'
    INTO ls_html.
  APPEND ls_html TO lt_html.
  CONCATENATE
        '</style>'
      '</head>'
      '<body>'
        '<table>'
          '<tr>'
            '<td>'
              '<h1>'
                '&#x53;&#x6f;&#x66;&#x74;&#x43;&#x6f;&#x70;&#x79;'
              '</h1>'
            '</td>'
          '</tr>'
          '<tr>'
            '<td>'
              txt_version ':&#160;' gc_version
            '</td>'
          '</tr>'
          '<tr>'
            '<td>'
              '&#160;'
            '</td>'
          '</tr>'
          '<tr>'
            '<td>'
              '&#xa9;2008-' gc_version+0(4) ' globalBIT, LLC.'
              '<br/>'
              txt_all_rights_reserved
            '</td>'
          '</tr>'
          '<tr>'
            '<td>'
              '&#160;'
            '</td>'
          '</tr>'
          '<tr>'
            '<td>'
              l_gpl
            '</td>'
          '</tr>'
        '</table>'
      '</body>'
    '</html>'
    INTO ls_html.
  APPEND ls_html TO lt_html.

  PERFORM download
    USING
      lt_html
      'MENU'
      'HELP'
      'about'
      gc_extension_htm
      abap_false.
ENDFORM.                    "html_base_about


*-----------------------------------------------------------------------
* html_base_default_main
*-----------------------------------------------------------------------
FORM html_base_default_main.

  DATA:
  ls_html TYPE string,
  lt_html TYPE it_string,
  l_laiso TYPE laiso,
  l_sptxt TYPE sptxt.

  PERFORM get_spras USING sy-langu l_laiso l_sptxt.

  CONCATENATE
    '<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"'
    ' "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">'
    INTO ls_html.
  APPEND ls_html TO lt_html.
  CONCATENATE
    '<html xmlns="http://www.w3.org/1999/xhtml"'
    ' xml:lang="' l_laiso '" lang="' l_laiso '">'
      '<head>'
        '<title>'
          '&#x53;&#x6f;&#x66;&#x74;&#x43;&#x6f;&#x70;&#x79;'
        '</title>'
    INTO ls_html.
  APPEND ls_html TO lt_html.
  PERFORM html_add_meta CHANGING lt_html.
  APPEND '<script type="text/javascript"><!--' TO lt_html.
  CONCATENATE
    'if(top==self){'
      'window.location.href="index.' gc_extension_htm '";'
    '}'
    INTO ls_html.
  APPEND ls_html TO lt_html.
  APPEND '//--></script>' TO lt_html.
  APPEND '<style type="text/css">' TO lt_html.
  CONCATENATE
    'h1{'
      'color:black;'
      'font-family:arial;'
      'font-size:30px;'
      'font-style:normal;'
      'font-weight:bold;'
      'text-decoration:none;'
    '}'
    'table{'
      'height:100%;'
      'width:100%;'
    '}'
    'td{'
      'height:100%;'
      'text-align:center;'
      'vertical-align:middle;'
      'width:100%;'
    '}'
    INTO ls_html.
  APPEND ls_html TO lt_html.
  CONCATENATE
        '</style>'
      '</head>'
      '<body>'
        '<table>'
          '<tr>'
            '<td>'
              '<h1>'
                '&#x53;&#x6f;&#x66;&#x74;&#x43;&#x6f;&#x70;&#x79;'
              '</h1>'
            '</td>'
          '</tr>'
        '</table>'
      '</body>'
    '</html>'
    INTO ls_html.
  APPEND ls_html TO lt_html.

  PERFORM download
    USING
      lt_html
      space
      space
      'default'
      gc_extension_htm
      abap_false.
ENDFORM.                    "html_base_default_main


*-----------------------------------------------------------------------
* GPL
*-----------------------------------------------------------------------
FORM html_base_gpl.

  DATA:
  l_title TYPE string,
  lt_html TYPE it_string.

*HTML
  PERFORM html_main_popupheader
    USING
      'GNU General Public License'
    CHANGING
      lt_html.
* Content
  PERFORM lic_gpl_html
    CHANGING
      l_title
      lt_html.
* Footer
  PERFORM html_main_popupfooter
    CHANGING lt_html.
*Download
  PERFORM download
    USING
      lt_html
      'MENU'
      'HELP'
      'GPL'
      gc_extension_htm
      abap_false.

ENDFORM.                    "html_base_gpl


*-----------------------------------------------------------------------
* html_base_index
*-----------------------------------------------------------------------
FORM html_base_index.

  DATA:
  ls_html TYPE string,
  lt_html TYPE it_string,
  lt_prop TYPE it_prop,
  l_laiso TYPE laiso,
  l_sptxt TYPE sptxt,
  l_height TYPE string,
  l_width TYPE string,
  l_props TYPE string,
  l_uri_props TYPE string.

  CONSTANTS:
  l_c_info_height TYPE i VALUE 400,
  l_c_info_width TYPE i VALUE 600.

  FIELD-SYMBOLS:
  <ls_prop> TYPE st_prop.

  PERFORM get_spras USING sy-langu l_laiso l_sptxt.

  CONCATENATE
    '<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"'
    ' "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">'
    INTO ls_html.
  APPEND ls_html TO lt_html.
  CONCATENATE
    '<html xmlns="http://www.w3.org/1999/xhtml"'
    ' xml:lang="' l_laiso '" lang="' l_laiso '">'
      '<head>'
        '<title>'
          '&#x53;&#x6f;&#x66;&#x74;&#x43;&#x6f;&#x70;&#x79;'
        '</title>'
    INTO ls_html.
  APPEND ls_html TO lt_html.
  PERFORM html_add_meta CHANGING lt_html.
  APPEND '<script type="text/javascript">' TO lt_html.
  APPEND '<!--' TO lt_html.
*global attributes
  CONCATENATE
    'var popupCallbacks=new Array();'
    'var popupClicked="";'
    'var popupMouseX=0;'
    'var popupMouseY=0;'
    'var popupValues=new Array();'
    'var resizeMouseX=0;'
    INTO ls_html.
  APPEND ls_html TO lt_html.
*props
  PERFORM get_props CHANGING lt_prop.
  ls_html = 'var props=new Array(new Array("page","index")'.
  l_props = 'page=index'.
  LOOP AT lt_prop ASSIGNING <ls_prop>.
    CONCATENATE ls_html
      ',new Array("' <ls_prop>-name '","' <ls_prop>-value '")'
      INTO ls_html.
    CONCATENATE l_props '&amp;' <ls_prop>-name '=' <ls_prop>-value
      INTO l_props.
  ENDLOOP.
  l_uri_props = l_props.
  PERFORM encode_uri CHANGING l_uri_props.
  CONCATENATE ls_html ');' INTO ls_html.
  APPEND ls_html TO lt_html.
*addFrame
  CONCATENATE
    'function addFrame() {'
      'var mySearch=window.location.search;'
      'if(mySearch.length>10){'
        'if(mySearch.indexOf("?")>=0){'
          'mySearch=mySearch.substring('
            'mySearch.indexOf("?")+1,'
            'mySearch.length'
          ');'
        '}'
        'var myProps=mySearch.split("&");'
        'var myPgmid="";'
        'var myObject="";'
        'var myObjName="";'
        'for(var i=0;i<myProps.length;i++){'
          'var myProp=myProps[i].split("=");'
          'switch(myProp[0]){'
            'case "pgmid":'
              'myPgmid=myProp[1];'
              'break;'
            'case "object":'
              'myObject=myProp[1];'
              'break;'
            'case "obj_name":'
              'myObjName=myProp[1];'
              'break;'
          '}'
        '}'
        'showObject(myPgmid+"_"+myObject, myObjName);'
      '}'
      'else{'
        'showObject();'
      '}'            '}'
      INTO ls_html.
  APPEND ls_html TO lt_html.
*closeDropDownMenus()
  CONCATENATE
    'function closeDropDownMenus(){'
      'var elem=document.getElementById("tm_help");'
      'if(elem) {'
        'elem.style.display="none";'
        'elem.style.visibility="hidden";'
      '}'
      'var elem=document.getElementById("tm_menu");'
      'if(elem) {'
        'elem.style.display="none";'
        'elem.style.visibility="hidden";'
      '}'
      'elem=document.getElementById("tm_system");'
      'if(elem) {'
        'elem.style.display="none";'
        'elem.style.visibility="hidden";'
      '}'
    '}'
    INTO ls_html.
  APPEND ls_html TO lt_html.
*findLinkElem
  CONCATENATE
    'function findLinkElem(objID, objName){'
      'var aElems=document.getElementsByClassName("leafLink");'
      'for(var i=0; i<aElems.length; ++i){'
        'if(aElems[i].href.endsWith(objID+"/"+objName+".htm")){'
          'return aElems[i];'
        '}'
      '}'
      'return null;'
    '}'
    INTO ls_html.
  APPEND ls_html TO lt_html.
*getLinks
  CONCATENATE
    'function getLinks(id) {'
      'var links;'
      'switch(id){'
        'case "tm_menu":'
          'links=new Array('
            'new Array('
              '"first_page",'
              '"menu_first_page",'
              '"' txt_first_page '",'
              '"",""'
            ')'
          ');'
          'break;'
        'case "tm_system":'
          'links=new Array('
            'new Array('
              '"status",'
              '"system_status",'
              '"' txt_status '",'
              '"",""'
            '),'
            'new Array('
              '"kernel",'
              '"system_kernel",'
              '"' txt_kernel_information___1 '",'
              '"",""'
            '),'
            'new Array('
              '"component",'
              '"system_component",'
              '"' txt_component_information '",'
              '"",""'
            ')'
          ');'
          'break;'
        'case "tm_help":'
          'links=new Array('
            'new Array('
              '"about",'
              '"help_about",'
              '"' txt_about '",'
              '"",""'
            '),'
            'new Array('
              '"updates",'
              '"popup",'
              '"' txt_updates '",'
              '"http://www.globalbit.org/sc/updates?'
              'langu=' l_laiso '&#38;scver=' gc_version '",'
              '"' txt_updates '"'
            '),'
            'new Array('
              '"globalbit",'
              '"newWindow",'
              '"globalBIT",'
              '"http://www.globalbit.org",""'
            ')'
          ');'
          'break;'
        'default:'
          'links=new Array();'
      '}'
      'return links;'
    '}'
    INTO ls_html.
  APPEND ls_html TO lt_html.
*getProps
  CONCATENATE
    'function getProps(){'
      'return props;'
    '}'
    INTO ls_html.
  APPEND ls_html TO lt_html.
*init
  CONCATENATE
    'function init(){'
      'addFrame();'
      'makeFrameSize();'
    '}'
    INTO ls_html.
  APPEND ls_html TO lt_html.
*makeFrameSize
  CONCATENATE
    'function makeFrameSize(){'
      'var capElem=document.getElementById("cap");'
      'var contentElem=document.getElementById("content");'
      'var contentDivElem=document.getElementById("contentDiv");'
      'var linksElem=document.getElementById("links");'
      'var scElem=document.getElementById("sc");'
      'var scResizerElem=document.getElementById("scResizer");'
      'var winHeight=window.innerHeight;'
      'var winWidth=window.innerWidth;'
      'if(winHeight<4){winHeight=4;}'
      'if(winWidth<4){winWidth=4;}'
      'var capHeight=capElem.offsetHeight;'
      'var linksWidth=linksElem.offsetWidth;'
      'if(linksWidth+2>winWidth){'
        'linksWidth=winWidth-2;'
        'linksElem.style.width=winWidth-2 + "px";'
        'scResizerElem.style.left=winWidth-4 + "px";'
      '}'
      'var scHeightNew=winHeight-capHeight;'
      'var contentWidthNew=winWidth-linksWidth;'
      'scResizerElem.style.top=capHeight+"px";'
      'scElem.style.height=scHeightNew+"px";'
      'contentDivElem.style.height=scHeightNew+"px";'
      'contentElem.style.height=scHeightNew+"px";'
      'linksElem.style.height=scHeightNew+"px";'
      'scResizerElem.style.height=scHeightNew+"px";'
      'scElem.style.width=winWidth+"px";'
      'contentDivElem.style.width=contentWidthNew+"px";'
      'contentElem.style.width=contentWidthNew+"px";'
    '}'
    INTO ls_html.
  APPEND ls_html TO lt_html.
*openDropDownLink
  CONCATENATE
    'function openDropDownLink(elemId,url,title){'
      'closeDropDownMenus();'
      'switch(elemId) {'
        'case "help_about":'
          'showMenuObject('
            '"MENU_HELP/about.' gc_extension_htm '",'
            '"' txt_about '"'
          ');'
          'break;'
        'case "menu_first_page":'
          'showObject();'
          'break;'
        'case "gpl":'
          'showMenuObject('
            '"MENU_HELP/GPL.' gc_extension_htm '",'
            '"GNU General Public License"'
          ');'
          'break;'
        'case "newWindow":'
          'window.open(url);'
          'break;'
        'case "popup":'
          'showMenuObject(url,title);'
          'break;'
        'case "system_component":'
          'showMenuObject('
            '"MENU_SYSTEM/COMPONENT.' gc_extension_htm '",'
            '"' txt_system ':&#160;'
            txt_component_information '"'
          ');'
          'break;'
        'case "system_kernel":'
          'showMenuObject('
            '"MENU_SYSTEM/KERNEL.' gc_extension_htm '",'
            '"' txt_system ':&#160;'
            txt_kernel_information___1 '"'
          ');'
          'break;'
        'case "system_status":'
          'showMenuObject('
            '"MENU_SYSTEM/STATUS.' gc_extension_htm '",'
            '"' txt_system ':&#160;' txt_status '"'
          ');'
          'break;'
      '}'
    '}'
    INTO ls_html.
  APPEND ls_html TO lt_html.
*postResizeSc
  CONCATENATE
    'function postResizeSc(){'
      'resizeMouseX=0;'
      'document.onmousemove=null;'
      'document.onmouseup=null;'
      'var linksElem=document.getElementById("links");'
      'var scResizerElem=document.getElementById("scResizer");'
      'scResizerElem.style.width="4px";'
      'scResizerElem.style.left = linksElem.offsetWidth-2 + "px";'
    '}'
    INTO ls_html.
  APPEND ls_html TO lt_html.
*preResizeSc
  CONCATENATE
    'function preResizeSc(event){'
      'if(event){'
        'resizeMouseX=event.layerX;'
      '}'
      'var scResizerElem=document.getElementById("scResizer");'
      'scResizerElem.style.left="0px";'
      'scResizerElem.style.width=window.innerWidth+"px";'
      'document.onmousemove=resizeSc;'
      'document.onmouseout=postResizeSc;'
      'document.onmouseup=postResizeSc;'
    '}'
    INTO ls_html.
  APPEND ls_html TO lt_html.
*rebuildMenu
  CONCATENATE
    'function rebuildMenu(id,links){'
      'var elem = document.getElementById(id);'
      'if(elem == null){'
        'return;'
      '}'
      'var content;'
      'for(var i=0; i<links.length; i++){'
        'content += '''
          '<tr>'
            '<td class="topmenu_dropdown_td">'
              '<a class="topmenu_dropdown_link"'
              ' href="#" onclick="'
              'openDropDownLink(''+"''"+links[i][1]+"'',''"'
              '+links[i][3]+"'',''"+links[i][4]+"''"+'');'
              'return false">'
              '''+links[i][2]+'''
            '<''+''/td>'
          '<''+''/tr>'';'
      '}'
      'elem.getElementsByTagName("table")[0].innerHTML'
      ' = content;'
    '}'
    INTO ls_html.
  APPEND ls_html TO lt_html.
*resizeSc
  CONCATENATE
    'function resizeSc(event){'
      'var posX=event.pageX-resizeMouseX;'
      'if(posX<2){'
        'posX=2;'
      '}'
      'if(posX>window.innerWidth-2){'
        'posX=window.innerWidth-2;'
      '}'
      'var contentWidthNew=window.innerWidth-posX;'
      'var contentElem=document.getElementById("content");'
      'var contentDivElem=document.getElementById("contentDiv");'
      'var linksElem=document.getElementById("links");'
      'linksElem.style.width=posX+"px";'
      'contentDivElem.style.width=contentWidthNew+"px";'
      'contentElem.style.width=contentWidthNew+"px";'
    '}'
    INTO ls_html.
  APPEND ls_html TO lt_html.
*setObjectTitle
  CONCATENATE
    'function setObjectTitle(objID, objName){'
      'var objIDarr;'
      'var pgmid="";'
      'var object="";'
      'var title="SoftCopy";'
      'var name="";'
      'var ppID="";'

      'if(objID!=null){'
        'objIDarr=objID.split("_");'
        'if(objIDarr.length>1){'
          'pgmid=objIDarr[0];'
          'object=objIDarr[1];'

          'aElem=findLinkElem(objID, objName);'
          'if(aElem!=null){'
            'name=aElem.innerHTML;'
          '}'
        '}'
      '}'



      'switch(pgmid){'
        'case "R3TR":'
          'switch(object){'
            'case "CLAS":'
              'title="' tpt_seo_clas '";'
              'break;'
            'case "DOMA":'
              'title="' tpt_ddic_doma '";'
              'break;'
            'case "DTEL":'
              'title="' tpt_ddic_dtel '";'
              'break;'
            'case "ENQU":'
              'title="' tpt_ddic_enqu '";'
              'break;'
            'case "FUGR":'
              'ppID=aElem.parentElement.parentElement.id;'
              'if(ppID="R3TR_FUGR"){'
                'title="' tpt_fugr_fugr '";'
              '}'
              'else if(ppID.startsWith("fugr_fuba")){'
                'title="' tpt_fugr_fuba '";'
              '}'
              'else if(ppID.startsWith("fugr_scr")){'
                'title="' tpt_fugr_scr '";'
              '}'
              'else if(ppID.startsWith("fugr_incl")){'
                'title="' tpt_fugr_incl '";'
              '}'
              'break;'
            'case "INTF":'
              'title="' tpt_seo_intf '";'
              'break;'
            'case "MSAG":'
              'title="' tpt_msag '";'
              'break;'
            'case "PARA":'
              'title="' tpt_para '";'
              'break;'
            'case "PROG":'
              'ppID=aElem.parentElement.parentElement.id;'
              'if(ppID="prog_1"){'
                'title="' tpt_prog_repo '";'
              '}'
              'else if(ppID="prog_I"){'
                'title="' tpt_prog_incl '";'
              '}'
              'break;'
            'case "SHLP":'
              'title="' tpt_ddic_shlp '";'
              'break;'
            'case "SUSO":'
              'title="' tpt_tobj '";'
              'break;'
            'case "TABL":'
              'ppID=aElem.parentElement.parentElement.id;'
              'if(ppID="R3TR_TABL_2"){'
                'title="' tpt_ddic_tabl '";'
              '}'
              'else if(ppID="R3TR_TABL_VIEWAPPEND"){'
                'title="' tpt_ddic_stru '";'
              '}'
              'break;'
            'case "TRAN":'
              'title="' tpt_tran '";'
              'if(aElem.id==null || aElem.id==""){'
              '}'
              'else if(aElem.id.startsWith("R3TR_TRAN_'
                  gc_tcode_dialog '")){'
                'title="' tpt_tran_dialog '";'
              '}'
              'else if(aElem.id.startsWith("R3TR_TRAN_'
                  gc_tcode_object '")){'
                'title="' tpt_tran_obj '";'
              '}'
              'else if(aElem.id.startsWith("R3TR_TRAN_'
                  gc_tcode_parameter '")){'
                'title="' tpt_tran_param '";'
              '}'
              'else if(aElem.id.startsWith("R3TR_TRAN_'
                  gc_tcode_report '")){'
                'title="' tpt_tran_repo '";'
              '}'
              'else if(aElem.id.startsWith("R3TR_TRAN_'
                  gc_tcode_variant '")){'
                'title="' tpt_tran_vari '";'
              '}'
              'break;'
            'case "TTYP":'
              'title="' tpt_ddic_ttyp '";'
              'break;'
            'case "TYPE":'
              'title="' tpt_ddic_type '";'
              'break;'
            'case "VIEW":'
              'title="' tpt_ddic_view '";'
              'break;'
            'case "WAPA":'
              'title="' tpt_o2_wapa '";'
              'if(aElem.id==null || aElem.id==""){'
              '}'
              'else if(aElem.id.startsWith("bsp")){'
                'title="' txt_page '";'
              '}'
              'else if(aElem.id.startsWith("ctrl")){'
                'title="' tpt_o2_wapa_ctrl '";'
              '}'
              'else if(aElem.id.startsWith("incl")){'
                'title="' txt_page '";'
              '}'
              'else if(aElem.id.startsWith("mime")){'
                'title="' tpt_o2_wapa_page '";'
              '}'
              'else if(aElem.id.startsWith("view")){'
                'title="' tpt_o2_wapa_page '";'
              '}'
              'break;'
            'case "WTAG":'
              'title="' tpt_o2_wtag '";'
              'break;'
            'case "XSLT":'
              'title="' tpt_o2_xslt '";'
              'break;'
          '}'
          'break;'
      '}'
      'setTitle(title.replace("#NAME_VALUE#", name));'
    '}'
    INTO ls_html.
  APPEND ls_html TO lt_html.
*setTitle
  CONCATENATE
    'function setTitle(theTitle){'
      'closeDropDownMenus();'
      'var elem;'
      'var myCaption;'
      'var myTitle;'
      'myTitle="SoftCopy";'
      'if(theTitle==null || theTitle==""){'
        'myCaption = myTitle;'
      '}'
      'else {'
        'myCaption=theTitle;'
        'myTitle+=" - "+theTitle;'
      '}'
      'document.title=myTitle;'
      'elem=document.getElementById("title");'
      'elem.innerHTML=myCaption;'
    '}'
    INTO ls_html.
  APPEND ls_html TO lt_html.
*showMenuObject
  l_height = l_c_info_height.
  CONDENSE l_height.
  l_width = l_c_info_width.
  CONDENSE l_width.
  CONCATENATE
    'function showMenuObject(url, caption){'
      'closeDropDownMenus();'
      'var content=''<iframe frameborder="0"'
        ' height="' l_height '"'
        ' id="infoscroll" scrolling="auto"'
        ' src="''+url+''"'
        ' width="' l_width '"><''+''/iframe>'';'
      'displayPopupLayer("info",caption,content);'
    '}'
    INTO ls_html.
  APPEND ls_html TO lt_html.
*showObject
  CONCATENATE
    'function showObject(objID, objName, target, caption){'
      'var src="default.htm";'
      'if(objName!=null){'
        'src=objID+"/"+objName+".htm";'
      '}'
      'if(target=="POPUP"){'
        'showMenuObject(src,caption);'
      '}'
      'else{'
        'var height=400;'
        'var width=400;'
        'var contentElem=document.getElementById("content");'
        'if(contentElem){'
          'height=contentElem.offsetHeight;'
          'width=contentElem.offsetWidth;'
        '}'
        'document.getElementById("contentDiv").innerHTML'
        '=''<iframe class="content" frameborder="0" id="content"'
        ' name="content" scrolling="auto" src="''+src+''"'
        ' style="height:''+height+''px;width:''+width+''px">'
        '</iframe>'';'
        'setObjectTitle(objID, objName);'
      '}'
    '}'
    INTO ls_html.
  APPEND ls_html TO lt_html.
*toggleDropDown
  CONCATENATE
    'function toggleDropDown(elemId) {'
      'var elem=document.getElementById(elemId);'
      'if(elem==null){'
        'return;'
      '}'
      'var isOpen=(elem.style.visibility=="visible");'
      'closeDropDownMenus();'
      'if(!isOpen) {'
        'elem.style.top="19px";'
        'elem.style.visibility="visible";'
        'elem.style.display="block";'
      '}'
    '}'
    INTO ls_html.
  APPEND ls_html TO lt_html.
*toggleVisibility
  CONCATENATE
    'function toggleVisibility(elemID){'
      'try{'
        'if(elemID==null)'
          'return false;'
        'elem=document.getElementById(elemID);'
        'if(elem==null)'
          'return false;'
        'if(elem.style.visibility==null'
        ' || elem.style.visibility==""'
        ' || elem.style.visibility=="hidden"){'
          'elem.style.visibility="visible";'
          'elem.style.display="block";'
        '}'
        'else{'
          'elem.style.visibility="hidden";'
          'elem.style.display="none";'
        '}'
      '}'
      'catch(e){}'
    '}'
    INTO ls_html.
  APPEND ls_html TO lt_html.
*popup
  PERFORM html_base_popup_js CHANGING lt_html.
  APPEND '//-->' TO lt_html.
  APPEND '</script>' TO lt_html.
*CSS
  APPEND '<style type="text/css">' TO lt_html.
  CONCATENATE
    'body{'
      'margin-left:0px;'
      'margin-top:0px;'
      'margin-right:0px;'
      'margin-bottom:0px;'
      'overflow:hidden;'
    '}'
    'iframe{'
      'margin-left:0px;'
      'margin-top:0px;'
      'margin-right:0px;'
      'margin-bottom:0px;'
    '}'
    'li{'
      'color:black;'
      'font-family:arial;'
      'font-size:10px;'
      'font-style:normal;'
      'font-weight:normal;'
      'text-decoration:none;'
    '}'
    'ul{'
      'margin-left:15px;'
      'padding-left:0px;'
    '}'
    'ul ul * ul{'
      'display:none;'
      'visibility:hidden;'
    '}'
    'table{'
      'border:0;'
      'margin:0;'
      'padding:0;'
      'spacing:0;'
    '}'
    'td{'
      'border:0;'
      'margin:0;'
      'padding:0;'
      'spacing:0;'
    '}'
    'tr{'
      'border:0;'
      'margin:0;'
      'padding:0;'
      'spacing:0;'
    '}'
    '.cap{'
      'border-bottom:1px solid #3a3d3a;'
      'height:56px;'
      'width:100%;'
    '}'
    '.content{'
      'float:left'
    '}'
    '.contentDiv{'
      'float:left'
    '}'
    '.info{'
      'color:#0000ff !important;'
      'font-family:arial;'
      'font-size:10px;'
      'font-style:normal;'
      'text-decoration:none;'
      'vertical-align:top;'
    '}'
    '.leaf{'
    '}'
    '.leafLink{'
      'color:#666666 !important;'
      'font-family:arial;'
      'font-size:10px;'
      'font-style:normal;'
      'font-weight:normal;'
      'text-decoration:none;'
    '}'
    '.node{'
    '}'
    '.nodeLink{'
      'color:black;'
      'font-family:arial;'
      'font-size:10px;'
      'font-style:normal;'
      'font-weight:normal;'
      'text-decoration:none;'
    '}'
    '.nodeLink:active{'
      'color:darkred;'
    '}'
    '.nodeLink:focus{'
      'color:darkred;'
    '}'
    '.nodeLink:hover{'
      'color:red'
    '}'
    '.nodeLink:link{'
      'color:black;'
    '}'
    '.nodeLink:visited{'
      'color:black;'
    '}'
    '.links{'
      'float:left;'
      'height:400px;'
      'margin-bottom:0px;'
      'margin-left:0px;'
      'margin-right:0px;'
      'margin-top:0px;'
      'overflow:scroll;'
      'scrolling:auto;'
      'width:200px;'
    '}'
    '.scResizer{'
      'cursor:col-resize;'
      'height:400px;'
      'left:198px;'
      'position:absolute;'
      'top:57px;'
      'user-select:none;'
      'width:4px;'
      'z-index:10;'
    '}'
    '.topmenu{'
      'background-color:#102873;'
      'border-bottom:1px solid #4a5973;'
      'color:#9ca6c5;'
      'font-family:arial;'
      'font-size:12px;'
      'font-style:normal;'
      'font-weight:normal;'
      'height:14px;'
      'padding-left:10px;'
      'text-align:left;'
      'text-decoration:none;'
      'vertical-align:middle;'
    '}'
    '.topmenu_dropdown{'
      'border-bottom:1px solid #3a3d3a;'
      'border-left:1px solid #a59e94;'
      'border-right:1px solid #3a3d3a;'
      'border-top:1px solid #a59e94;'
      'display:none;'
      'position:absolute;'
      'visibility:hidden;'
      'z-index:80;'
    '}'
    '.topmenu_dropdown_tab{'
      'border-bottom:1px solid #cecabd;'
      'border-left:1px solid #ffffef;'
      'border-right:1px solid #cecabd;'
      'border-top:1px solid #cecabd;'
    '}'
    '.topmenu_dropdown_td{'
      'background-color:#f7f3e6;'
      'border:1px solid #f7f3e6;'
      'color:#000000;'
      'font-family:arial;'
      'font-size:12px;'
      'font-style:normal;'
      'font-weight:normal;'
      'height:16px;'
      'padding-left:5px;'
      'padding-right:5px;'
      'text-align:left;'
      'text-decoration:none;'
      'vertical-align:middle;'
    '}'
    '.topmenu_dropdown_td:hover{'
      'background-color:#cecabd;'
      'border-bottom:1px solid #ffffef;'
      'border-left:1px solid #f7f3e6;'
      'border-right:1px solid #c5c2b5;'
      'border-top:1px solid #73716b;'
    '}'
    '.topmenu_dropdown_link{'
      'color:#000000;'
      'font-family:arial;'
      'font-size:12px;'
      'font-style:normal;'
      'font-weight:normal;'
      'text-align:left;'
      'text-decoration:none;'
      'vertical-align:middle;'
    '}'
    '.topmenu_link{'
      'color:#9ca6c5;'
      'font-family:arial;'
      'font-size:12px;'
      'font-style:normal;'
      'font-weight:normal;'
      'text-align:left;'
      'text-decoration:none;'
      'vertical-align:middle;'
    '}'
    '.topmenu_link:hover{'
      'color:#ffffff;'
    '}'
    '.topmenu_tab{'
      'background-color:#102873;'
      'color:#9ca6c5;'
      'font-family:arial;'
      'font-size:12px;'
      'font-style:normal;'
      'font-weight:normal;'
      'height:14px;'
      'padding-left:10px;'
      'text-align:left;'
      'text-decoration:none;'
      'vertical-align:middle;'
    '}'
    '.topmenu_td{'
      'color:#9ca6c5;'
      'font-family:arial;'
      'font-size:12px;'
      'font-style:normal;'
      'font-weight:normal;'
      'padding-right:10px;'
      'text-align:left;'
      'text-decoration:none;'
      'vertical-align:middle;'
    '}'
    '.toptitle{'
      'border-bottom:4px solid #ded7c5;'
      'border-top:4px solid #bdbebd;'
      'color:#5a699c;'
      'font-family:arial;'
      'font-size:20px;'
      'font-style:italic;'
      'font-weight:bold;'
      'height:32px;'
      'padding-left:10px;'
      'text-align:left;'
      'text-decoration:none;'
      'vertical-align:middle;'
    '}'
    INTO ls_html.
  APPEND ls_html TO lt_html.
  PERFORM html_base_popup_css CHANGING lt_html.
  CONCATENATE
          '</style>'
        '</head>'
        '<body onload="init()">'
          '<table border="0" cellpadding="1" cellspacing="0"'
          ' class="cap" id="cap">'
* Top Menu
            '<tr>'
              '<td class="topmenu">'
                '<table border="0" cellpadding="0" cellspacing="0"'
                ' class="topmenu_tab">'
                  '<tr id="tm">'
*   Menu
                    '<td class="topmenu_td">'
                      '<a class="topmenu_link" href="#"'
                      ' onclick="toggleDropDown(''tm_menu'');'
                      'return false">'
                        txt_menu
                      '</a>'
                      '<br/>'
                      '<div class="topmenu_dropdown" id="tm_menu">'
                        '<table border="0" cellpadding="0"'
                        ' cellspacing="0"'
                        ' class="topmenu_dropdown_tab">'
                          '<tr>'
                            '<td class="topmenu_dropdown_td">'
                              '<a class="topmenu_dropdown_link"'
                              ' href="default.' gc_extension_htm '"'
                              ' onclick="'
                              'openDropDownLink(''menu_first_page'');'
                              'return false">'
                                txt_first_page
                              '</a>'
                            '</td>'
                          '</tr>'
                        '</table>'
                      '</div>'
                    '</td>'
*   System
                    '<td class="topmenu_td">'
                      '<a class="topmenu_link" href="#"'
                      ' onclick="toggleDropDown(''tm_system'');'
                      'return false">'
                        txt_system
                      '</a>'
                      '<br/>'
                      '<div class="topmenu_dropdown" id="tm_system">'
                        '<table border="0" cellpadding="0"'
                        ' cellspacing="0"'
                        ' class="topmenu_dropdown_tab">'
                          '<tr>'
                            '<td class="topmenu_dropdown_td">'
                              '<a class="topmenu_dropdown_link"'
                              ' href="MENU_SYSTEM/STATUS.'
                                gc_extension_htm '" onclick="'
                              'openDropDownLink(''system_status'');'
                              'return false">'
                                txt_status
                              '</a>'
                            '</td>'
                          '</tr>'
                          '<tr>'
                            '<td class="topmenu_dropdown_td">'
                              '<a class="topmenu_dropdown_link"'
                              ' href="MENU_SYSTEM/KERNEL.'
                                gc_extension_htm '" onclick="'
                              'openDropDownLink(''system_kernel'');'
                              'return false">'
                                txt_kernel_information___1
                              '</a>'
                            '</td>'
                          '</tr>'
                          '<tr>'
                            '<td class="topmenu_dropdown_td">'
                              '<a class="topmenu_dropdown_link"'
                              ' href="MENU_SYSTEM/COMPONENT.'
                                gc_extension_htm '" onclick="'
                              'openDropDownLink(''system_component'');'
                              'return false">'
                                txt_component_information
                              '</a>'
                            '</td>'
                          '</tr>'
                        '</table>'
                      '</div>'
                    '</td>'
*   Help
                    '<td class="topmenu_td">'
                      '<a class="topmenu_link" href="#"'
                      ' onclick="toggleDropDown(''tm_help'');'
                      'return false">'
                        txt_help
                      '</a>'
                      '<br/>'
                      '<div class="topmenu_dropdown" id="tm_help">'
                        '<table border="0" cellpadding="0"'
                        ' cellspacing="0"'
                        ' class="topmenu_dropdown_tab">'
                          '<tr>'
                            '<td class="topmenu_dropdown_td">'
                              '<a class="topmenu_dropdown_link"'
                              ' href="http://www.globalbit.org"'
                              ' onclick="'
                              'openDropDownLink(''newWindow'','
                              '''http://www.globalbit.org'');'
                              'return false">'
                                'globalBIT'
                              '</a>'
                            '</td>'
                          '</tr>'
                          '<tr>'
                            '<td class="topmenu_dropdown_td">'
                              '<a class="topmenu_dropdown_link"'
                              ' href="http://www.globalbit.org/'
                                'opensource/softcopy"'
                              ' onclick="'
                              'openDropDownLink(''popup'','
                              '''http://www.globalbit.org/sc/updates?'
                              'langu=' l_laiso '&#38;'
                              'scver=' gc_version ''','''
                              txt_updates ''');'
                              'return false">'
                                txt_updates
                              '</a>'
                            '</td>'
                          '</tr>'
                          '<tr>'
                            '<td class="topmenu_dropdown_td">'
                              '<a class="topmenu_dropdown_link"'
                              ' href="MENU_HELP/about.'
                                gc_extension_htm '"'
                              ' onclick="'
                              'openDropDownLink(''help_about'');'
                              'return false">'
                                txt_about
                              '</a>'
                            '</td>'
                          '</tr>'
                        '</table>'
                      '</div>'
                    '</td>'
                  '</tr>'
                '</table>'
              '</td>'
              '<td class="topmenu"'
              ' style="padding-right:5px;text-align:right">'
                'powered by globalBIT'
              '</td>'
            '</tr>'
* Title
            '<tr>'
              '<td class="toptitle" colspan="2" id="title">'
                '&#x53;&#x6f;&#x66;&#x74;&#x43;&#x6f;&#x70;&#x79;'
              '</td>'
            '</tr>'
          '</table>'

          '<table border="0" cellpadding="0" cellspacing="0" id="sc">'
            '<tr>'
              '<td class="links" id="links">'
    INTO ls_html.
  APPEND ls_html TO lt_html.
*Links
  PERFORM links
    CHANGING
      lt_html.
  CONCATENATE
              '</td>'
              '<td id="contentDiv" class="content"></td>'
            '</tr>'
          '</table>'
          '<div class="scResizer" id="scResizer"'
          ' onmousedown="preResizeSc(event); return false;"></div>'
    INTO ls_html.
  APPEND ls_html TO lt_html.
  PERFORM html_base_popup
    USING 'info' l_c_info_width l_c_info_height
    CHANGING lt_html.
  APPEND '<script type="text/javascript"><!--' TO lt_html.
  APPEND 'window.onresize = makeFrameSize;' TO lt_html.
  APPEND '//--></script>' TO lt_html.
  CONCATENATE
*          '<div id="plDiv"'
*          ' style="display:none;visibility:hidden">'
*            '<iframe id="pl"'
*            ' src="http://www.globalbit.org/sc/postload?'
*            l_uri_props
*            '"></iframe>'
*            '&#160;'
*          '</div>'
        '</body>'
      '</html>'
      INTO ls_html.
  APPEND ls_html TO lt_html.

  PERFORM download
    USING
      lt_html
      space
      space
      'index'
      gc_extension_htm
      abap_false.
ENDFORM.                    "html_base_index


*-----------------------------------------------------------------------
* html_base_popup
*-----------------------------------------------------------------------
FORM html_base_popup
  USING
    value(i_id) TYPE string
    value(i_width) TYPE i
    value(i_height) TYPE i
  CHANGING
    ct_html TYPE it_string.

  DATA:
  l_width TYPE string,
  l_height TYPE string,
  l_caption_width TYPE string,
  l_div_width TYPE string,
  l_div_height TYPE string,
  ls_html TYPE string.

  l_width = i_width.
  CONDENSE l_width.
  l_height = i_height.
  CONDENSE l_height.
  l_caption_width = i_width - 16.
  CONDENSE l_caption_width.
  l_div_width = i_width + 4.
  CONDENSE l_div_width.
  l_div_height = i_height + 20.
  CONDENSE l_div_height.

  CONCATENATE
    '<div class="popupDiv" id="popup' i_id '"'
    ' style="height:' l_div_height 'px;width:' l_div_width 'px">'
      '<table border="0" cellpadding="0" cellspacing="0"'
      ' class="popupTable" style="width:' l_width 'px">'
        '<tr>'
          '<td align="left" class="popupTitle"'
          ' id="popupCaption' i_id '"'
          ' nowrap="nowrap"'
          ' onmousedown="preMovePopupLayer(event,''' i_id
          '''); return false;"'
          ' style="width:' l_caption_width 'px"'
          ' width="90%">'
            'Filter'
          '</td>'
          '<td class="popupClose">'
            '<div class="popupCloseButton">'
              '<a class="popupCloseLink"'
              ' href="JavaScript:hidePopupLayer(''' i_id
              ''')">'
                '&#215;'
              '</a>'
            '</div>'
          '</td>'
        '</tr>'
        '<tr>'
          '<td align="center" class="popupContentArea" colspan="2">'
            '<table border="0" cellpadding="0" cellspacing="0"'
            ' class="popupContentTable">'
              '<tr>'
                '<td class="popupContent" id="popupContent' i_id '"'
                ' nowrap="nowrap"'
                ' style="height:' l_height 'px;width:' l_width 'px">'
                  '&#160;'
                '</td>'
              '</tr>'
            '</table>'
          '</td>'
        '</tr>'
      '</table>'
    '</div>'
    INTO ls_html.
  APPEND ls_html TO ct_html.
  APPEND '<script type="text/javascript"><!--' TO ct_html.
  CONCATENATE
      'popupValues[popupValues.length]'
      ' = new Array("' i_id '", ' l_width ', ' l_height ');'
    INTO ls_html.
  APPEND ls_html TO ct_html.
  APPEND '//--></script>' TO ct_html.

ENDFORM.                    "html_base_popup


*-----------------------------------------------------------------------
* html_base_popup_css
*-----------------------------------------------------------------------
FORM html_base_popup_css
  CHANGING
    ct_html TYPE it_string.

  DATA:
  ls_html TYPE string.

  CONCATENATE
    '.popupClose{'
      'background-color:#102873;'
      'border-bottom:1px solid #63828c;'
      'border-left-width:0px;'
      'border-right:1px solid #63828c;'
      'border-top:1px solid #adb6ce;'
      'border-spacing:0px;'
      'font-size:12px;'
      'padding-bottom:0px;'
      'padding-left:3px;'
      'padding-right:0px;'
      'padding-top:1px;'
      'text-align:right !important;'
      'vertical-align:top !important;'
      'width:20px;'
    '}'
    '.popupCloseButton{'
      'background-color:#102873;'
      'border:1px solid #5a69a5;'
      'color:#5a69a5;'
      'height:12px;'
      'overflow:hidden;'
      'text-align:center;'
      'vertical-align:top;'
      'width:12px;'
    '}'
    '.popupCloseLink{'
      'color:#5a69a5;'
      'font-size:13px;'
      'font-style:normal;'
      'font-weight:normal;'
      'line-height:13px;'
      'margin:0px;'
      'text-align:right !important;'
      'text-decoration:none;'
      'vertical-align:top;'
    '}'
    '.popupContent{'
      'background-color:#94b2c5;'
      'border-width:0px;'
      'border-spacing:0px;'
      'color:#000000;'
      'font-family:arial,helvetica,sans-serif;'
      'font-size:12px;'
      'font-style:normal;'
      'font-weight:normal;'
      'margin:0px 0px;'
      'padding:2px;'
      'text-align:left;'
    '}'
    '.popupContentArea{'
      'background-color:#94b2c5;'
      'border-bottom:1px solid #3a3d3a;'
      'border-left:1px solid #b5b6ad;'
      'border-right:1px solid #cecabd;'
      'border-top:1px solid #849ead;'
      'border-spacing:0px;'
      'color:#000000;'
      'font-family:arial,helvetica,sans-serif;'
      'font-size:12px;'
      'font-style:normal;'
      'font-weight:normal;'
      'margin:0px 0px;'
      'padding:0px;'
      'text-align:center;'
    '}'
    '.popupContentTable{'
      'background-color:#94b2c5;'
      'border-bottom:1px solid #63828c;'
      'border-left:1px solid #94b2c5;'
      'border-right:1px solid #63828c;'
      'border-top:1px solid #8caab5;'
      'border-spacing:0px;'
      'color:#000000;'
      'font-family:arial,helvetica,sans-serif;'
      'font-size:12px;'
      'font-style:normal;'
      'font-weight:normal;'
      'margin:0px 0px;'
      'padding:0px;'
      'text-align:center;'
    '}'
    '.popupDiv{'
      'background-color:#94b2c5;'
      'display:none;'
      'left:0px;'
      'position:absolute;'
      'top:0px;'
      'visibility:hidden;'
      'z-index:90;'
    '}'
    '.popupTable{'
      'background-color:#d6d2ce;'
      'border-width:0px;'
      'border-spacing:0px;'
      'padding:0px;'
    '}'
    '.popupTitle{'
      'background-color:#102873;'
      'border-bottom:1px solid #63828c;'
      'border-left:1px solid #adb6ce;'
      'border-right-width:0px;'
      'border-top:1px solid #adb6ce;'
      'border-spacing:0px;'
      'color:#9ca6c5;'
      'cursor:move;'
      'font-family:arial,helvetica,sans-serif;'
      'font-size:12px;'
      'font-style:normal;'
      'font-weight:normal;'
      'padding-bottom:1px;'
      'padding-left:3px;'
      'padding-right:3px;'
      'padding-top:1px;'
      'text-align:left;'
      'white-space:nowrap;'
    '}'
    INTO ls_html.
  APPEND ls_html TO ct_html.

ENDFORM.                    "html_base_popup_css


*-----------------------------------------------------------------------
* html_base_popup_js
*-----------------------------------------------------------------------
FORM html_base_popup_js
  CHANGING
    ct_html TYPE it_string.

  DATA:
  ls_html TYPE string.

  CONCATENATE
    'var popupCallbacks=new Array();'
    'var popupClicked="";'
    'var popupMouseX=0;'
    'var popupMouseY=0;'
    'var popupValues=new Array();'
    INTO ls_html.
  APPEND ls_html TO ct_html.

*Sets new content and caption and displays a popup layer
  CONCATENATE
    'function displayPopupLayer(id,caption,content,callback){'
      'var width;'
      'var height;'
      'for(var i=0;i<popupValues.length;i++){'
        'if(popupValues[i][0] == id){'
          'width=popupValues[i][1]+4;'
          'height=popupValues[i][2]+20;'
        '}'
      '}'
      'for(var i=0; i<popupCallbacks.length; i++){'
        'if(popupCallbacks[i]!=null && popupCallbacks[i][0]==id){'
          'if(popupCallbacks[i][1]==callback)'
            'return;'
          'window.setTimeout(popupCallbacks[i][1],1);'
          'popupCallbacks[i]=null;'
        '}'
      '}'
      'if(content!=null)'
        'document.getElementById("popupContent"+id).innerHTML=content;'
      'if(caption!=null)'
        'document.getElementById("popupCaption"+id).innerHTML=caption;'

      'var userAgent=navigator.userAgent.toLowerCase();'
      'var msieVersion=0;'
      'if(userAgent.indexOf("msie")){'
        'var myArr=userAgent.split("(")[1].split(")")[0].split(";");'
        'for(var j=0;j<myArr.length;j++){'
          'if(myArr[j].indexOf("msie")>=0){'
            'msieVersion=((((myArr[j].replace(/^[^\S]+/,"")'
            '.replace(/[^\S]+$/,"")).split(" "))[1]).split("."))[0];'
          '}'
        '}'
      '}'

      'var filterDivObj=document.getElementById("popup"+id);'
      'var left = (document.body.clientWidth - width) / 2;'
      'var top = (document.body.clientHeight - height) / 2;'
      'left=((window.innerWidth/2)+window.pageXOffset)'
        '-((parseInt(filterDivObj.style.width))/2)+"px";'
      'top=((window.innerHeight/2)+window.pageYOffset)'
        '-((parseInt(filterDivObj.style.height))/2)+"px";'
      'filterDivObj.style.left=left;'
      'filterDivObj.style.top=top;'
      'filterDivObj.style.display="block";'
      'filterDivObj.style.visibility="visible";'
      'if(callback!=null && callback!="")'
        'popupCallbacks[popupCallbacks.length]=new Array(id,callback);'
    '}'
    INTO ls_html.
  APPEND ls_html TO ct_html.
* Hides a popup layer
  CONCATENATE
    'function hidePopupLayer(id){'
      'document.getElementById("popup"+id).style.display="none";'
      'for(var i=0;i<popupCallbacks.length;i++){'
        'if(popupCallbacks[i]!=null && popupCallbacks[i][0]==id){'
          'window.setTimeout(popupCallbacks[i][1],100);'
          'popupCallbacks[i]=null;'
        '}'
      '}'
    '}'
    INTO ls_html.
  APPEND ls_html TO ct_html.
* Moves a popup layer
  CONCATENATE
    'function movePopupLayer(event){'
      'var filterDivObj=document.getElementById("popup"+popupClicked);'
      'filterDivObj.style.left=event.pageX-popupMouseX+"px";'
      'filterDivObj.style.top=event.pageY-popupMouseY+"px";'
    '}'
    INTO ls_html.
  APPEND ls_html TO ct_html.
* Stops moving a popup layer
  CONCATENATE
    'function postMovePopupLayer(){'
      'popupClicked="";'
      'popupMouseX=0;'
      'popupMouseY=0;'
      'document.onmousemove=null;'
      'document.onmouseup=null;'
    '}'
    INTO ls_html.
  APPEND ls_html TO ct_html.
* Prepares for moving a popup layer.
  CONCATENATE
    'function preMovePopupLayer(event,id){'
      'popupClicked=id;'
      'if(event){'
        'popupMouseX=event.layerX;'
        'popupMouseY=event.layerY;'
      '}'
      'document.onmousemove=movePopupLayer;'
      'document.onmouseup=postMovePopupLayer;'
    '}'
    INTO ls_html.
  APPEND ls_html TO ct_html.
* Updated the popup caption
  CONCATENATE
    'function updatePopupCaption(id, caption){'
      'if(caption!=null)'
        'document.getElementById("popupCaption"+id).innerHTML=caption;'
    '}'
    INTO ls_html.
  APPEND ls_html TO ct_html.
ENDFORM.                    "html_base_popup_js
