Add login fallback
Erik Johnston
parent
fa1cf5ef34
commit
87961d8dcf
|
|
@ -0,0 +1,50 @@
|
|||
<html>
|
||||
<head>
|
||||
<title> Login </title>
|
||||
<meta name='viewport' content='width=device-width, initial-scale=1, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0'>
|
||||
<link rel="stylesheet" href="style.css">
|
||||
<script src="js/jquery-2.1.3.min.js"></script>
|
||||
<script src="js/login.js"></script>
|
||||
</head>
|
||||
<body onload="matrixLogin.onLoad()">
|
||||
<center>
|
||||
<br/>
|
||||
<h1>Log in with one of the following methods</h1>
|
||||
|
||||
<span id="feedback" style="color: #f00"></span>
|
||||
<br/>
|
||||
<br/>
|
||||
|
||||
<div id="loading">
|
||||
<img src="spinner.gif" />
|
||||
</div>
|
||||
|
||||
<div id="cas_flow" class="login_flow" style="display:none"
|
||||
onclick="gotoCas(); return false;">
|
||||
CAS Authentication: <button id="cas_button" style="margin: 10px">Log in</button>
|
||||
</div>
|
||||
|
||||
<br/>
|
||||
|
||||
<form id="password_form" class="login_flow" style="display:none"
|
||||
onsubmit="matrixLogin.password_login(); return false;">
|
||||
<div>
|
||||
Password Authentication:<br/>
|
||||
|
||||
<div style="text-align: center">
|
||||
<input id="user_id" size="32" type="text" placeholder="Matrix ID (e.g. bob)" autocapitalize="off" autocorrect="off" />
|
||||
<br/>
|
||||
<input id="password" size="32" type="password" placeholder="Password"/>
|
||||
<br/>
|
||||
|
||||
<button type="submit" style="margin: 10px">Log in</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
<div id="no_login_types" type="button" class="login_flow" style="display:none">
|
||||
Log in currently unavailable.
|
||||
</div>
|
||||
</center>
|
||||
</body>
|
||||
</html>
|
||||
File diff suppressed because one or more lines are too long
|
|
@ -0,0 +1,169 @@
|
|||
window.matrixLogin = {
|
||||
endpoint: location.origin + "/_matrix/client/api/v1/login",
|
||||
serverAcceptsPassword: false,
|
||||
serverAcceptsCas: false
|
||||
};
|
||||
|
||||
var submitPassword = function(user, pwd) {
|
||||
console.log("Logging in with password...");
|
||||
var data = {
|
||||
type: "m.login.password",
|
||||
user: user,
|
||||
password: pwd,
|
||||
};
|
||||
$.post(matrixLogin.endpoint, JSON.stringify(data), function(response) {
|
||||
show_login();
|
||||
matrixLogin.onLogin(response);
|
||||
}).error(errorFunc);
|
||||
};
|
||||
|
||||
var submitCas = function(ticket, service) {
|
||||
console.log("Logging in with cas...");
|
||||
var data = {
|
||||
type: "m.login.cas",
|
||||
ticket: ticket,
|
||||
service: service,
|
||||
};
|
||||
$.post(matrixLogin.endpoint, JSON.stringify(data), function(response) {
|
||||
show_login();
|
||||
matrixLogin.onLogin(response);
|
||||
}).error(errorFunc);
|
||||
};
|
||||
|
||||
var errorFunc = function(err) {
|
||||
show_login();
|
||||
|
||||
if (err.responseJSON && err.responseJSON.error) {
|
||||
setFeedbackString(err.responseJSON.error + " (" + err.responseJSON.errcode + ")");
|
||||
}
|
||||
else {
|
||||
setFeedbackString("Request failed: " + err.status);
|
||||
}
|
||||
};
|
||||
|
||||
var getCasURL = function(cb) {
|
||||
$.get(matrixLogin.endpoint + "/cas", function(response) {
|
||||
var cas_url = response.serverUrl;
|
||||
|
||||
cb(cas_url);
|
||||
}).error(errorFunc);
|
||||
};
|
||||
|
||||
|
||||
var gotoCas = function() {
|
||||
getCasURL(function(cas_url) {
|
||||
var this_page = window.location.origin + window.location.pathname;
|
||||
|
||||
var redirect_url = cas_url + "/login?service=" + encodeURIComponent(this_page);
|
||||
|
||||
window.location.replace(redirect_url);
|
||||
});
|
||||
}
|
||||
|
||||
var setFeedbackString = function(text) {
|
||||
$("#feedback").text(text);
|
||||
};
|
||||
|
||||
var show_login = function() {
|
||||
$("#loading").hide();
|
||||
|
||||
if (matrixLogin.serverAcceptsPassword) {
|
||||
$("#password_form").show();
|
||||
}
|
||||
|
||||
if (matrixLogin.serverAcceptsCas) {
|
||||
$("#cas_flow").show();
|
||||
}
|
||||
|
||||
if (!matrixLogin.serverAcceptsPassword && !matrixLogin.serverAcceptsCas) {
|
||||
$("#no_login_types").show();
|
||||
}
|
||||
};
|
||||
|
||||
var show_spinner = function() {
|
||||
$("#password_form").hide();
|
||||
$("#cas_flow").hide();
|
||||
$("#no_login_types").hide();
|
||||
$("#loading").show();
|
||||
};
|
||||
|
||||
|
||||
var fetch_info = function(cb) {
|
||||
$.get(matrixLogin.endpoint, function(response) {
|
||||
var serverAcceptsPassword = false;
|
||||
var serverAcceptsCas = false;
|
||||
for (var i=0; i<response.flows.length; i++) {
|
||||
var flow = response.flows[i];
|
||||
if ("m.login.cas" === flow.type) {
|
||||
matrixLogin.serverAcceptsCas = true;
|
||||
console.log("Server accepts CAS");
|
||||
}
|
||||
|
||||
if ("m.login.password" === flow.type) {
|
||||
matrixLogin.serverAcceptsPassword = true;
|
||||
console.log("Server accepts password");
|
||||
}
|
||||
}
|
||||
|
||||
cb();
|
||||
}).error(errorFunc);
|
||||
}
|
||||
|
||||
matrixLogin.onLoad = function() {
|
||||
fetch_info(function() {
|
||||
if (!try_cas()) {
|
||||
show_login();
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
matrixLogin.password_login = function() {
|
||||
var user = $("#user_id").val();
|
||||
var pwd = $("#password").val();
|
||||
|
||||
setFeedbackString("");
|
||||
|
||||
show_spinner();
|
||||
submitPassword(user, pwd);
|
||||
};
|
||||
|
||||
matrixLogin.onLogin = function(response) {
|
||||
// clobber this function
|
||||
console.log("onLogin - This function should be replaced to proceed.");
|
||||
console.log(response);
|
||||
};
|
||||
|
||||
var parseQsFromUrl = function(query) {
|
||||
var result = {};
|
||||
query.split("&").forEach(function(part) {
|
||||
var item = part.split("=");
|
||||
var key = item[0];
|
||||
var val = item[1];
|
||||
|
||||
if (val) {
|
||||
val = decodeURIComponent(val);
|
||||
}
|
||||
result[key] = val
|
||||
});
|
||||
return result;
|
||||
};
|
||||
|
||||
var try_cas = function() {
|
||||
var pos = window.location.href.indexOf("?");
|
||||
if (pos == -1) {
|
||||
return false;
|
||||
}
|
||||
var qs = parseQsFromUrl(window.location.href.substr(pos+1));
|
||||
|
||||
var ticket = qs.ticket;
|
||||
|
||||
if (!ticket) {
|
||||
return false;
|
||||
}
|
||||
|
||||
getCasURL(function(url) {
|
||||
submitCas(ticket, url);
|
||||
});
|
||||
|
||||
return true;
|
||||
};
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 1.8 KiB |
|
|
@ -0,0 +1,57 @@
|
|||
html {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
body {
|
||||
height: 100%;
|
||||
font-family: "Myriad Pro", "Myriad", Helvetica, Arial, sans-serif;
|
||||
font-size: 12pt;
|
||||
margin: 0px;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: 20pt;
|
||||
}
|
||||
|
||||
a:link { color: #666; }
|
||||
a:visited { color: #666; }
|
||||
a:hover { color: #000; }
|
||||
a:active { color: #000; }
|
||||
|
||||
input {
|
||||
width: 90%
|
||||
}
|
||||
|
||||
textarea, input {
|
||||
font-family: inherit;
|
||||
font-size: inherit;
|
||||
margin: 5px;
|
||||
}
|
||||
|
||||
.smallPrint {
|
||||
color: #888;
|
||||
font-size: 9pt ! important;
|
||||
font-style: italic ! important;
|
||||
}
|
||||
|
||||
.g-recaptcha div {
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
.login_flow {
|
||||
text-align: left;
|
||||
padding: 10px;
|
||||
margin-bottom: 40px;
|
||||
display: inline-block;
|
||||
|
||||
-webkit-border-radius: 10px;
|
||||
-moz-border-radius: 10px;
|
||||
border-radius: 10px;
|
||||
|
||||
-webkit-box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.15);
|
||||
-moz-box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.15);
|
||||
box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.15);
|
||||
|
||||
background-color: #f8f8f8;
|
||||
border: 1px #ccc solid;
|
||||
}
|
||||
Loading…
Reference in New Issue