-
Notifications
You must be signed in to change notification settings - Fork 0
/
login.html
139 lines (129 loc) · 7.63 KB
/
login.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
<!DOCTYPE html>
<html lang="en-US">
<head>
<meta property="og:image" content="http://alloymessenger.github.io/site-preview.png"/>
<meta property="og:type" content="website"/>
<meta property="og:url" content="https://alloymessenger.github.io/"/>
<meta property="og:title" content="Alloy Messenger"/>
<meta property="og:description" content="Find, create, and converse with communities you care about on campus."/>
<link rel="stylesheet" href="login-stylesheet.css">
<meta name="google-signin-client_id" content="346925839515-g5rho0muuob69h91ivpeh6nrvho870ii.apps.googleusercontent.com">
<link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet" type="text/css">
<script>
const devServerURL = "http://localhost:8000";
const prodServerURL = "https://alloy-backend.herokuapp.com";
let serverURL = document.location.href.includes("localhost") ? devServerURL : prodServerURL;
</script>
<script src="https://apis.google.com/js/api:client.js"></script>
<script type="text/javascript" src="/cookies.js"></script>
<link rel="apple-touch-icon" sizes="180x180" href="./icons/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="./icons/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="./icons/favicon-16x16.png">
<link rel="manifest" href="./icons/site.webmanifest">
<link rel="mask-icon" href="./icons/safari-pinned-tab.svg" color="#5bbad5">
<meta name="msapplication-TileColor" content="#2b5797">
<meta name="theme-color" content="#ffffff">
<title>Alloy — Login</title>
<script>
var googleUser = {};
var startApp = function() {
gapi.load('auth2', function() {
auth2 = gapi.auth2.init({
client_id: '346925839515-g5rho0muuob69h91ivpeh6nrvho870ii.apps.googleusercontent.com'});
attachSignIn(document.getElementById('customBtn'));
});
};
function attachSignIn(element) {
auth2.attachClickHandler(element, {},
function(googleUser) {
let profile = googleUser.getBasicProfile();
let id_token = googleUser.getAuthResponse().id_token;
// Sending id token to backend server for authentication
let params = {
'platform': 'web',
'idtoken': id_token
}
var req = new XMLHttpRequest();
req.open('POST', `${serverURL}/api/tokensignin`, true);
req.setRequestHeader('Content-Type', 'application/json');
req.onreadystatechange = (e) => {
if (req.readyState == 4 && req.status == 200) {
console.log('Signed in successfully.');
console.log(id_token);
console.log('ID: ' + profile.getId());
console.log('Name: ' + profile.getName());
console.log('Image URL: ' + profile.getImageUrl());
console.log('Email: ' + profile.getEmail());
let response = JSON.parse(req.responseText);
setSessionToken(response.session_token)
setUpdateToken(response.update_token)
window.location = `/`;
}
else if (req.readyState == 4 && req.status == 400) {
console.log(req.responseText)
}
};
req.send(JSON.stringify(params));
}, function(error) {
console.log(error);
}
);
}
</script>
<script>
function showModal() {
document.getElementById("modal").style.display = "block"
}
function hideModal() {
document.getElementById("modal").style.display = "none";
}
</script>
</head>
<body>
<div class="top-left">
<img src="./icons/logo-shadow.svg" id="logo"><h1 id="title">alloy</h1>
<script>startApp();</script>
</div>
<div class="top-right" id="learn-more">Learn more</div>
<div id="on-screen">
<div id="site-description">
<div class="large-header">Find, create, and converse with communities you care about.</div>
<div class="subheader">Work through problem sets, prepare for interviews, find concerts, sell sports tickets, and create a community for anything you care about at Cornell. </div>
<div id="customBtn" class="customGPlusSignIn">
<span class="icon"></span>
<span class="buttonText">Sign in with Google</span>
</div>
</div>
<img src="./screenshot.png" id="site-screenshot">
</div>
<div id="scroll-down-portion">
<div id="info-box">
<div id="info-box-content">
<div class="header">What is Alloy?</div>
<div class="info-text">Alloy is a messaging platform with chat rooms for all of your classes and interest groups.
The purpose of Alloy is to make it easier to meet and work with people you wouldn’t otherwise know—in other words,
to create new social and educational communities, all digitally.</div>
<div class="header">What can you do with Alloy?</div>
<div class="info-text">In every class, you can create rooms about whatever you want: working through lab reports,
studying for a prelim, getting help with problem sets, and more.
You can even talk about things you wouldn’t want to talk about on something like Piazza:
which professors are good to take the class with, what you missed in class, or how you thought a prelim or final went.</div>
<div class="info-text">You can also find and create channels for any interests you have: find other people going to local concerts,
share and read interesting articles from other people, and get career advice. Alloy isn’t like Slack or GroupMe where you need to be invited to a group to participate;
you can explore them by yourself, create them and watch as other people join and form natural communities.</div>
<div class="header">How do I use Alloy?</div>
<div class="info-text">Using Alloy is as simple as logging in with your Cornell email and joining a class or channel. You don’t need to fill out any information about yourself; we don’t keep track of it.</div>
<div class="header">How do you deal with moderation issues (e.g. spam or academic integrity violations)?</div>
<div class="info-text">Because Alloy is limited to Cornell, users can only contribute with one account connected to their netID.
Alloy is not moderated by Cornell, but all messages (even ones sent in anonymous mode) are linked to a netID and can be reported by users for violations of site rules.
We don’t condone any form of cheating; anonymity is encouraged only to make you feel more comfortable sharing and talking to others, not spamming or giving people an unfair advantage.</div>
</div>
</div>
</div>
<script>
document.getElementById("learn-more").addEventListener("click", () => {
window.scrollTo(0, 500000);
})
</script>
</body>
</html>