mdebray/tvl-depot
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add boilerplate for Google sign-in

Browse source 
For more information, read:
https://developers.google.com/identity/sign-in/web/sign-in?authuser=1

TODO: Use Elm ports or something similar to properly interop with the onSignIn
and signOn functions defined in index.html.
This commit is contained in:
William Carroll 2020-07-29 10:13:19 +01:00
parent 289cae2528
commit 9f70cb2c61
3 changed files with 23 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

18
client/index.html
View file

@ -2,13 +2,31 @@
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<meta name="google-signin-client_id" content="580018768696-4beppspj6cu7rhjnfgok8lbmh9a4n3ok.apps.googleusercontent.com">
<title>Elm SPA</title> <title>Elm SPA</title>
<link rel="stylesheet" href="./output.css" /> <link rel="stylesheet" href="./output.css" />
<script src="https://apis.google.com/js/platform.js" async defer></script>
<script src="./Main.min.js"></script> <script src="./Main.min.js"></script>
</head> </head>
<body class="font-serif"> <body class="font-serif">
<div id="mount"></div> <div id="mount"></div>
<script> <script>
function onSignIn(googleUser) {
var profile = googleUser.getBasicProfile();
console.log('ID: ' + profile.getId());
console.log('Name: ' + profile.getName());
console.log('Image URL: ' + profile.getImageUrl());
console.log('Email: ' + profile.getEmail());
}
function signOut() {
console.log('Signing out!');
var auth2 = gapi.auth2.getAuthInstance();
auth2.signOut().then(function() {
console.log('User signed out.');
});
}
Elm.Main.init({node: document.getElementById("mount")}); Elm.Main.init({node: document.getElementById("mount")});
</script> </script>
</body> </body>

5
client/src/Login.elm
View file

@ -5,9 +5,12 @@ import Html.Attributes exposing (..)
import Html.Events exposing (..) import Html.Events exposing (..)
import State import State
googleSignIn : Html State.Msg
googleSignIn =
div [ class "g-signin2", attribute "onsuccess" "onSignIn" ] []
render : State.Model -> Html State.Msg render : State.Model -> Html State.Msg
render model = render model =
div [ class "pt-10 pb-20 px-10" ] div [ class "pt-10 pb-20 px-10" ]
[ p [] [ text "Please authenticate" ] [ googleSignIn
] ]

2
client/src/State.elm
View file

@ -22,7 +22,7 @@ type alias Model =
init : Model init : Model
init = init =
{ isLoading = False { isLoading = False
, view = Landing , view = Login
} }