open ID realm is hostname only, not uri_for(/)
[scpubgit/stemmaweb.git] / root / src / auth / login.tt
index 61575b1..8193e80 100644 (file)
@@ -2,9 +2,29 @@
        pagetitle = "Stemmaweb - Sign in"
        applicationstyle = c.uri_for('/css/auth.css')
 %]
-    <script type="text/javascript">
-$(document).ready(function() {
-    // call out to load the directory div
+
+<meta name="google-signin-clientid" content="[% google_client_id %]" />
+<meta name="google-signin-scope" content="https://www.googleapis.com/auth/plus.profile.emails.read" />
+<meta name="google-signin-requestvisibleactions" content="http://schema.org/AddAction" />
+<meta name="google-signin-cookiepolicy" content="single_host_origin" />
+<meta name="google-signin-openidrealm" content="[% 'http://' _ c.uri_for('/').host_port %]" />
+<script src="https://apis.google.com/js/client:platform.js?onload=render" async defer>
+</script>
+<script>
+ /* Executed when the APIs finish loading */
+ function render() {
+
+    document.getElementById('signinButton').disabled = false;
+   var additionalParams = {
+     'callback': googleSignIn
+   };
+
+   // Attach a click listener to a button to trigger the flow.
+   var signinButton = document.getElementById('signinButton');
+   signinButton.addEventListener('click', function() {
+     gapi.auth.signIn(additionalParams); // Will use page level configuration
+   });
+
     $('#login_actions').accordion();
     $('.login_button').button();
     $('#submit').button();
@@ -17,7 +37,39 @@ $(document).ready(function() {
                e.preventDefault();
        }, 2000 );
     }
-});
+ }
+</script>
+    <script type="text/javascript">
+
+       function googleSignIn(authResult) {
+               if (authResult['status']['signed_in']) {
+                       document.getElementById('signinButton').disabled = true;
+                       gapi.client.load('plus', 'v1', function apiClientLoaded() {
+                               gapi.client.plus.people.get({ userId: 'me'}).execute(function infoRetrieved(resp) {
+                                       var primaryEmail;
+                                       for (var i = 0; i < resp.emails.length; i++) {
+                                               if (resp.emails[i].type === 'account') {
+                                                       primaryEmail = resp.emails[i].value;
+                                               }
+                                       }
+
+                                       dataRetrieved(authResult, primaryEmail);
+                               });
+                       });
+               } else {
+                       console.log("Error", authResult);
+               }
+       }
+
+       function dataRetrieved(login, email) {
+               console.log(email);
+               console.log(login.id_token);
+
+               document.getElementById('email').value = email;
+               document.getElementById('id_token').value = login.id_token;
+               document.getElementById('google_form').submit();
+       }
+
     </script>
 [% END %]
        <div id="topbanner">
@@ -47,20 +99,21 @@ $(document).ready(function() {
        <h3><a href="#">Sign in with Google</a></h3>
        <div>
                <p>If you have a Google account, you may use it to sign into Stemmaweb.</p>
-               <form method="post" action="[% c.uri_for_action('/users/login') | html %]" autocomplete="off">
-                       <input type="hidden" name="realm" value="openid"/>
-                       <input type="hidden" name="openid_identifier" value="https://www.google.com/accounts/o8/id"/>
-                       <input type="submit" class="login_button" id="#login_google" value="Sign in with Google"></input>
+
+        <button disabled id="signinButton">Sign in with Google</button>
+               <form id="google_form" action="[% c.uri_for_action('/users/login') | html %]" method="post">
+                       <input id='email' name='email' value='' type='hidden' />
+                       <input id='id_token' name='id_token' value='' type='hidden' />
                </form>
        </div>
 
        <h3><a href="#">Sign in with OpenID</a></h3>
        <div>
                <p>If you have an account with an <a href="http://openid.net/get-an-openid/" target="_blank">OpenID provider</a> (e.g. WordPress, Blogger, Flickr, Yahoo), you may use it to sign into Stemmaweb.
-               <form method="post" action="[% c.uri_for_action('/users/login') | html %]" autocomplete="off">
+               <form class="openid_form" method="post" action="[% c.uri_for_action('/users/login') | html %]" autocomplete="off">
                        <input type="hidden" name="realm" value="openid"/>
-                       <input type="text" name="openid_identifier"/>
-                       <input type="submit" class="login_button" id="#login_openid" value="Sign in with OpenID"/>
+                       <input type="text" name="openid_identifier" id="openid_input"/>
+                       <input type="submit" class="login_button" id="login_openid" value="Sign in with OpenID"/>
                </form>
        </div>
 
@@ -84,4 +137,4 @@ $(document).ready(function() {
 [% END %]
 </div>
 [% END %]
-[% PROCESS footer.tt %]
\ No newline at end of file
+[% PROCESS footer.tt %]