<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN"> <html> <head> <style> html, body { width: 100%; height: 100%; overflow: hidden; margin: 0; } body { background: linear-gradient(white, SlateGray); font-size: 24px; } .container { width: 100%; height: 100%; display: -webkit-flex; display: flex; -webkit-flex-direction: column; flex-direction: column; } .topBox, .inputBox, .messageBox { width: 100%; height: 33.33%; text-align: center; } .inputBox { position: relative; } .wrapper { height: 85px; position: absolute; left: 0; right: 0; top: 0; bottom: 0; margin: auto; } .topBox { text-align: right; padding: 15px; box-sizing: border-box; } .messageBox { text-align: center; visibility: hidden; } </style> </head> <body> <div class="container"> <div class="topBox"> <img onclick="javascript:lightdm.shutdown();" src="power_button.png"/> </div> <div class="inputBox"> <div class="wrapper"> <div id="prompt"></div> <form action="javascript: handle_input()"> <input id="entry" /> </form> </div> </div> <div class="messageBox" id="messages"></div> </div> <script> /*********************************************************************/ /* Callbacks for lightdm-webkit-greeter */ /*********************************************************************/ /** * show_prompt callback. */ function show_prompt(text, type) { // type is either "text" or "password" prompt = document.getElementById("prompt"); prompt.innerHTML = text; entry = document.getElementById("entry"); entry.value = ""; // clear entry entry.type = type; entry.focus(); } /** * show_message callback. */ function show_message(text, type) { if (text.length == 0) return; messages = document.getElementById("messages"); messages.style.visibility = "visible"; // type is either "info" or "error" if (type == "error") { text = "<font color=\"red\">" + text + "</font>"; } text = text + "<br>"; messages.innerHTML = messages.innerHTML + text; } /** * authentication_complete callback. */ function authentication_complete() { if (lightdm.is_authenticated) { lightdm.start_session_sync(); // Start default session } else { show_message("Authentication Failed", "error"); setTimeout(start_authentication, 3000); } } /** * autologin_timer_expired callback. */ function autologin_timer_expired(username) { /* Stub. Does nothing. */ } /*********************************************************************/ /* Functions local to this greeter */ /*********************************************************************/ /** * clear_messages */ function clear_messages() { messages = document.getElementById("messages"); messages.innerHTML = ""; messages.style.visibility = "hidden"; } /** * Kickoff the authentication process */ function start_authentication() { clear_messages(); lightdm.start_authentication(); // start with null userid, have pam prompt for userid. } /** * handle the input from the entry field. */ function handle_input() { entry = document.getElementById("entry"); lightdm.respond(entry.value); } </script> <script src="../antergos/js/mock.js"></script> <script> start_authentication(); </script> </body> </html>