source: main/trunk/greenstone3/web/interfaces/default/transform/pages/login.xsl@ 35322

<?xml version="1.0" encoding="UTF-8"?>
<!-- this page is used when the user clicks the Login button. If they have been directed to Login by trying to access a restricted page when they are not already logged in, then they will go to the Login section of authen.xsl -->
<xsl:stylesheet version="1.0"
    xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
    xmlns:java="http://xml.apache.org/xslt/java"
    xmlns:util="xalan://org.greenstone.gsdl3.util.XSLTUtil"
    xmlns:gslib="http://www.greenstone.org/skinning"
    xmlns:gsf="http://www.greenstone.org/greenstone3/schema/ConfigFormat"
    extension-element-prefixes="java util"
    exclude-result-prefixes="java util">

    <!-- use the 'main' layout -->
    <xsl:include href="layouts/main.xsl"/>

    <!-- set page title -->
    <xsl:template name="pageTitle"><xsl:value-of select="util:getInterfaceText($interface_name, /page/@lang, 'login_b')"/></xsl:template>

    <!-- set page breadcrumbs -->
    <xsl:template name="breadcrumbs"><gslib:siteLink/></xsl:template>

    <!-- the page content -->
    <xsl:template match="/page">
      <gsf:style>
        <xsl:text disable-output-escaping="yes">
        /* Based on: https://stackoverflow.com/questions/2812770/add-centered-text-to-the-middle-of-a-horizontal-rule */
.hr-with-text {
  display: flex;
  align-items: center;
  text-align: center;
}

.hr-with-text::before,
.hr-with-text::after {
  content: '';
  flex: 1;
  border-bottom: 1px solid #000;
}

.hr-with-text:not(:empty)::before {
  margin-right: .25em;
}

.hr-with-text:not(:empty)::after {
  margin-left: .25em;
}


input.gsloginform[type=submit] {
    float: right;
    margin-right: 10px;
    margin-top: 5px;
    width: 80px;
    height: 30px;
}
  
            </xsl:text>
      </gsf:style>
      
        <xsl:if test="/page/pageRequest/paramList/param[@name = 'loginMessage']/@value">
            <div id="gs_error" class="ui-state-error ui-corner-all">
                <span class="ui-icon ui-icon-alert" style="float: left;"><xsl:text> </xsl:text></span><xsl:value-of select="/page/pageRequest/paramList/param[@name = 'loginMessage']/@value"/>
            </div>
        <br/>
        </xsl:if>
        <form method="POST"
              id="login-form"
              action="{/page/pageRequest/paramList/param[@name = 'redirectURL']/@value}">
            <table id="loginTable">
              <tr>
                <td colspan="2">
                  <input type="text" name="username" style="width:95%;">
                <xsl:attribute name="placeholder">
                  <xsl:value-of select="util:getInterfaceText($interface_name, /page/@lang, 'authen.username')"/>
                </xsl:attribute>
                  </input>
                </td>
              </tr>
              <tr>
                <td colspan="2">
                  <input type="password" name="password" style="width:95%;">
                <xsl:attribute name="placeholder">
                  <xsl:value-of select="util:getInterfaceText($interface_name, /page/@lang, 'authen.password')"/>
                </xsl:attribute>
                </input>
                </td>
              </tr>
              <tr>
                <td colspan="2">
                  <input type="submit" class="gsloginform"><xsl:attribute name="value"><xsl:value-of select="util:getInterfaceText($interface_name, /page/@lang, 'login_b')"/></xsl:attribute></input>
                </td>
              </tr>
              <xsl:if test="$googlesignin_client_id">
                <tr>
                  <td colspan="2">
                    <div class="hr-with-text">or</div>
                  </td>
                </tr>
                <tr>
                  <td colspan="2">
                    <input type="hidden" id="googlesignin_id_token" name="googlesignin_id_token"></input>
                    <gsf:div id="mygoogle-signin2" />
                  </td>
                </tr>
              </xsl:if>

            </table>
        </form>
        
        <gsf:variable name="googleSigninClientId"><xsl:value-of select="/page/pageResponse/interfaceOptions/option[@name = 'googlesignin_client_id']/@value"/></gsf:variable>

        <gsf:script>
             
          function onGoogleSigninSuccess(googleUser)
          {

             var google_fullname = googleUser.getBasicProfile().getName();
             console.log('Google-authenicated login as: ' + google_fullname);

             var googlesignin_id_token = googleUser.getAuthResponse().id_token;
             //console.log('Google ID Token: ' + googlesignin_id_token);

             $("#googlesignin_id_token").val(googlesignin_id_token);
             $("#login-form").submit();
          }

          function onGoogleSigninFailure(error)
          {
            console.error(error);
          }

          function renderButton()
          {
             gapi.signin2.render('mygoogle-signin2', {
               'scope': 'profile email',
               'width': 240,
               'height': 50,
               'longtitle': true,
               'theme': 'dark',
               'onsuccess': onGoogleSigninSuccess,
               'onfailure': onGoogleSigninFailure
             });
          }

          window.onload = function()  {
            if (gs.variables['googleSigninClientId']) {
              renderButton();
            }
          }

         </gsf:script>

         <script type="text/javascript">
            <xsl:text disable-output-escaping="yes">
            {
                $("#loginTable input[name=\"username\"]").focus();
            }
            </xsl:text>
        </script>
    </xsl:template>
</xsl:stylesheet>