Changeset 35322


Ignore:
Timestamp:
2021-08-31T22:42:54+12:00 (3 years ago)
Author:
davidb
Message:

Front-end (web-browser) changes that introduce the option of signing in via Google Sign-in API rather than the user/password credentials stored in the JDBM Database Greenstone provides. This needs a Google Client ID, specified in servlet.xml as googlesignin_client_id as an 'init-param'. NOTE ALSO that this commit is inly the front-end part -- the backend server needed to support this is not part of the commit (more programming work needed to get this functional). The client-side commit is safe to include at this point in the sense that (without setting googlesignin_client_id) the Google Sign-in features lay dormant and are not shown

Location:
main/trunk/greenstone3/web/interfaces/default/transform
Files:
3 edited

Legend:

Unmodified
Added
Removed
  • main/trunk/greenstone3/web/interfaces/default/transform/gslib.xsl

    r35138 r35322  
    2424  <xsl:param name="filepath"/>
    2525  <xsl:param name="google_tracking_id"/>
     26  <xsl:param name="googlesignin_client_id"/>
    2627
    2728  <xsl:variable name="berry_icon">berry.png</xsl:variable>
  • main/trunk/greenstone3/web/interfaces/default/transform/layouts/header.xsl

    r35319 r35322  
    8080    </xsl:if>
    8181
    82    <!-- <xsl:call-template name="addGoogleTracking"/>-->
     82    <!-- <xsl:call-template name="addGoogleTracking"/>-->
     83
     84    <script>
     85      <xsl:text disable-output-escaping="yes"> 
     86    // Too soon to use gsf:variable, as 'gs' not yet defined, so roll-our-own JS variable
     87    var googlesignin_client_id = '</xsl:text><xsl:value-of select="$googlesignin_client_id"/><xsl:text disable-output-escaping="yes">';
     88      </xsl:text>
     89    </script>
     90
     91    <xsl:if test="$googlesignin_client_id != ''">
     92      <xsl:call-template name="addGoogleSignOn"/>
     93    </xsl:if>
     94
     95    <script>
     96      <xsl:text disable-output-escaping="yes">
     97    function gslogout(logout_action_url) {
     98      if (googlesignin_client_id != '') {
     99        googleSignout();
     100      }
     101      window.location = logout_action_url;
     102    }
     103      </xsl:text>
     104    </script>
     105
    83106    <xsl:choose>
    84107      <xsl:when test="/page/pageResponse/interfaceOptions/option[@name = 'cssTheme']/@value">
     
    143166
    144167  <xsl:template name="addGoogleTracking">
    145     <xsl:variable name="trackid">UA-xxx-1</xsl:variable>
     168    <xsl:variable name="trackid">UA-xxx-1</xsl:variable> <!-- TODO: this no longer seems to be used, now google_tracking_id passed in, and so can be deleted -->
    146169    <!-- Global site tag (gtag.js) - Google Analytics -->
    147170    <script async="async" src="https://www.googletagmanager.com/gtag/js?id={$google_tracking_id}"><xsl:text> </xsl:text></script>
     
    156179  </xsl:template>
    157180
     181  <xsl:template name="addGoogleSignOn">   
     182    <meta name="google-signin-client_id" content="{$googlesignin_client_id}" />
     183   
     184    <script>
     185      <xsl:text disable-output-escaping="yes">
     186   
     187    function googleSigninInit() {
     188      gapi.load('auth2', function() {
     189        auth2 = gapi.auth2.init({
     190           client_id: googlesignin_client_id,
     191           //scope: 'email' // don't need to top up 'profile' with 'email' as not used client side (email is retrieved via GS3 Servlet)
     192        });
     193      });
     194    }
     195         
     196    function googleSignout() {
     197      var auth2 = gapi.auth2.getAuthInstance();
     198      auth2.signOut().then(function () {
     199        console.log("Google-authenticated User signed out");
     200      });
     201      return false;
     202    }
     203      </xsl:text>
     204    </script>
     205    <script src="https://apis.google.com/js/platform.js?onload=googleSigninInit" async="async" defer="defer" ><xsl:text> </xsl:text></script>
     206   
     207  </xsl:template>
     208 
    158209  <xsl:template name="favicon">
    159210    <link rel="shortcut icon" href="interfaces/{$interface_name}/images/favicon.ico"/>
     
    457508    menu.append(editingLink);
    458509      </xsl:text></xsl:if><xsl:text disable-output-escaping="yes">
     510
     511        var logout_url_action = url + (hasQueryString ? "&amp;" : "?") + "logout=" + (hashPart ? hashPart : "");
     512    var logout_javascript_call = "javascript:gslogout('"+logout_url_action+"')";
    459513   
    460514    var logoutLink = $("&lt;a&gt;")
    461     .attr("href", url + (hasQueryString ? "&amp;" : "?") + "logout=" + (hashPart ? hashPart : ""));
     515      .attr("href", logout_javascript_call);
     516   
    462517    var logoutButton = $("&lt;LI&gt;")
    463     .css("padding", "3px")
    464     .html("</xsl:text><xsl:value-of select="util:getInterfaceText($interface_name, /page/@lang, 'menu.logout')"/><xsl:text disable-output-escaping="yes">")
    465     .addClass("ui-state-default");
     518      .css("padding", "3px")
     519      .html("</xsl:text><xsl:value-of select="util:getInterfaceText($interface_name, /page/@lang, 'menu.logout')"/><xsl:text disable-output-escaping="yes">")
     520      .addClass("ui-state-default");
    466521    logoutLink.append(logoutButton);
    467522    menu.append(logoutLink);
  • main/trunk/greenstone3/web/interfaces/default/transform/pages/login.xsl

    r33755 r35322  
    66    xmlns:util="xalan://org.greenstone.gsdl3.util.XSLTUtil"
    77    xmlns:gslib="http://www.greenstone.org/skinning"
     8    xmlns:gsf="http://www.greenstone.org/greenstone3/schema/ConfigFormat"
    89    extension-element-prefixes="java util"
    910    exclude-result-prefixes="java util">
    10  
     11
    1112    <!-- use the 'main' layout -->
    1213    <xsl:include href="layouts/main.xsl"/>
     
    2021    <!-- the page content -->
    2122    <xsl:template match="/page">
     23      <gsf:style>
     24        <xsl:text disable-output-escaping="yes">
     25        /* Based on: https://stackoverflow.com/questions/2812770/add-centered-text-to-the-middle-of-a-horizontal-rule */
     26.hr-with-text {
     27  display: flex;
     28  align-items: center;
     29  text-align: center;
     30}
     31
     32.hr-with-text::before,
     33.hr-with-text::after {
     34  content: '';
     35  flex: 1;
     36  border-bottom: 1px solid #000;
     37}
     38
     39.hr-with-text:not(:empty)::before {
     40  margin-right: .25em;
     41}
     42
     43.hr-with-text:not(:empty)::after {
     44  margin-left: .25em;
     45}
     46
     47
     48input.gsloginform[type=submit] {
     49    float: right;
     50    margin-right: 10px;
     51    margin-top: 5px;
     52    width: 80px;
     53    height: 30px;
     54}
     55 
     56            </xsl:text>
     57      </gsf:style>
     58     
    2259        <xsl:if test="/page/pageRequest/paramList/param[@name = 'loginMessage']/@value">
    2360            <div id="gs_error" class="ui-state-error ui-corner-all">
     
    2663        <br/>
    2764        </xsl:if>
    28         <form method="POST" action="{/page/pageRequest/paramList/param[@name = 'redirectURL']/@value}">
     65        <form method="POST"
     66              id="login-form"
     67              action="{/page/pageRequest/paramList/param[@name = 'redirectURL']/@value}">
    2968            <table id="loginTable">
    30                 <tr><td><xsl:value-of select="util:getInterfaceText($interface_name, /page/@lang, 'authen.username')"/>: </td><td><input type="text" name="username"/></td></tr>
    31                 <tr><td><xsl:value-of select="util:getInterfaceText($interface_name, /page/@lang, 'authen.password')"/>: </td><td><input type="password" name="password"/></td></tr>
    32                 <tr><td><input type="submit"><xsl:attribute name="value"><xsl:value-of select="util:getInterfaceText($interface_name, /page/@lang, 'login_b')"/></xsl:attribute></input></td><td><xsl:text> </xsl:text></td></tr>
     69              <tr>
     70                <td colspan="2">
     71                  <input type="text" name="username" style="width:95%;">
     72                <xsl:attribute name="placeholder">
     73                  <xsl:value-of select="util:getInterfaceText($interface_name, /page/@lang, 'authen.username')"/>
     74                </xsl:attribute>
     75                  </input>
     76                </td>
     77              </tr>
     78              <tr>
     79                <td colspan="2">
     80                  <input type="password" name="password" style="width:95%;">
     81                <xsl:attribute name="placeholder">
     82                  <xsl:value-of select="util:getInterfaceText($interface_name, /page/@lang, 'authen.password')"/>
     83                </xsl:attribute>
     84                </input>
     85                </td>
     86              </tr>
     87              <tr>
     88                <td colspan="2">
     89                  <input type="submit" class="gsloginform"><xsl:attribute name="value"><xsl:value-of select="util:getInterfaceText($interface_name, /page/@lang, 'login_b')"/></xsl:attribute></input>
     90                </td>
     91              </tr>
     92              <xsl:if test="$googlesignin_client_id">
     93                <tr>
     94                  <td colspan="2">
     95                    <div class="hr-with-text">or</div>
     96                  </td>
     97                </tr>
     98                <tr>
     99                  <td colspan="2">
     100                    <input type="hidden" id="googlesignin_id_token" name="googlesignin_id_token"></input>
     101                    <gsf:div id="mygoogle-signin2" />
     102                  </td>
     103                </tr>
     104              </xsl:if>
     105
    33106            </table>
    34107        </form>
    35         <script type="text/javascript">
     108       
     109        <gsf:variable name="googleSigninClientId"><xsl:value-of select="/page/pageResponse/interfaceOptions/option[@name = 'googlesignin_client_id']/@value"/></gsf:variable>
     110
     111        <gsf:script>
     112             
     113          function onGoogleSigninSuccess(googleUser)
     114          {
     115
     116             var google_fullname = googleUser.getBasicProfile().getName();
     117             console.log('Google-authenicated login as: ' + google_fullname);
     118
     119             var googlesignin_id_token = googleUser.getAuthResponse().id_token;
     120             //console.log('Google ID Token: ' + googlesignin_id_token);
     121
     122             $("#googlesignin_id_token").val(googlesignin_id_token);
     123             $("#login-form").submit();
     124          }
     125
     126          function onGoogleSigninFailure(error)
     127          {
     128            console.error(error);
     129          }
     130
     131          function renderButton()
     132          {
     133             gapi.signin2.render('mygoogle-signin2', {
     134               'scope': 'profile email',
     135               'width': 240,
     136               'height': 50,
     137               'longtitle': true,
     138               'theme': 'dark',
     139               'onsuccess': onGoogleSigninSuccess,
     140               'onfailure': onGoogleSigninFailure
     141             });
     142          }
     143
     144          window.onload = function()  {
     145            if (gs.variables['googleSigninClientId']) {
     146              renderButton();
     147            }
     148          }
     149
     150         </gsf:script>
     151
     152         <script type="text/javascript">
    36153            <xsl:text disable-output-escaping="yes">
    37154            {
Note: See TracChangeset for help on using the changeset viewer.