Completed simple day-chaning greeter.
This commit is contained in:
Jonathan Bernard
parent
2fd4ea998f
commit
b0ee73607f
276
css/lightdm-uestibulum.scss
Normal file
276
css/lightdm-uestibulum.scss
Normal file
@ -0,0 +1,276 @@
|
||||
@import url('https://fonts.googleapis.com/css?family=Abel|Aldrich|Audiowide|Black+Ops+One|Cherry+Cream+Soda|Exo|Exo 2|Graduate|Josefin+Sans|Kelly+Slab|Michroma|Monoton|Nixie+One|Open+Sans+Condensed:300|Orbitron|Poiret+One|Press+Start+2P|Prompt|Rajdhani|Raleway|Russo+One|Signika|Syncopate|Teko');
|
||||
|
||||
* { margin: 0; padding: 0; }
|
||||
|
||||
h1 { font-size: 1.5vw; }
|
||||
h2 { font-size: 1vw; }
|
||||
|
||||
$colorFG: white;
|
||||
$colorBG: black;
|
||||
$colorAccent: orange;
|
||||
|
||||
body {
|
||||
color: $colorFG;
|
||||
font-family: 'Exo 2'
|
||||
}
|
||||
|
||||
.bg {
|
||||
display: block;
|
||||
opacity: 0;
|
||||
transition: 1s;
|
||||
|
||||
position: fixed;
|
||||
width: 100%;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
.morning #bg-morning { opacity: 1; }
|
||||
.afternoon #bg-afternoon { opacity: 1; }
|
||||
.evening #bg-evening { opacity: 1; }
|
||||
.night #bg-night { opacity: 1; }
|
||||
|
||||
#ui-container {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
#power-panel {
|
||||
background: rgba(8, 8, 8, 0.3);
|
||||
box-shadow: 0px 0px 0.5vw 0.5vw rgba(8, 8, 8, 0.3);
|
||||
cursor: pointer;
|
||||
opacity: 0.5;
|
||||
|
||||
position: absolute;
|
||||
bottom: 2vw;
|
||||
right: 2vw;
|
||||
z-index: 100;
|
||||
|
||||
#power-options {
|
||||
border-radius: 10px;
|
||||
padding: 0.5vw;
|
||||
transition: 1s;
|
||||
display: none;
|
||||
|
||||
ul {
|
||||
list-style: none;
|
||||
|
||||
li {
|
||||
margin-bottom: 1vw;
|
||||
font-size: 1.5vw;
|
||||
|
||||
i { margin-right: 0.5vw; }
|
||||
|
||||
&:last-child { margin-bottom: 0; }
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
&.active {
|
||||
bottom: 1vw;
|
||||
#power-options { display: block; }
|
||||
#power-button { display: none; }
|
||||
}
|
||||
}
|
||||
|
||||
#clock-panel {
|
||||
background: rgba(0, 0, 0, 0.3);
|
||||
font-size: 6vw;
|
||||
font-weight: 500;
|
||||
padding: 1vw 2vw;
|
||||
width: 100%;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
#login-panel {
|
||||
|
||||
z-index: 2;
|
||||
|
||||
input[type=password] {
|
||||
background: none;
|
||||
border: none;
|
||||
border-bottom: 2px solid $colorFG;
|
||||
color: $colorFG;
|
||||
font-size: 1vw;
|
||||
margin-top: 0.5em;
|
||||
//opacity: 0;
|
||||
transition: 0.5s;
|
||||
width: 20em;
|
||||
|
||||
&.active { opacity: 0.5; }
|
||||
}
|
||||
|
||||
#users {
|
||||
cursor: pointer;
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
|
||||
i {
|
||||
opacity: 0;
|
||||
transition: 0.5s;
|
||||
}
|
||||
|
||||
&:hover i { opacity: 1; }
|
||||
|
||||
#users-list {
|
||||
list-style: none;
|
||||
display: none;
|
||||
}
|
||||
|
||||
&.select-user {
|
||||
#user-display, i { display: none; }
|
||||
#users-list { display: inline-block; }
|
||||
}
|
||||
}
|
||||
|
||||
#fail-msg {
|
||||
color: red;
|
||||
opacity: 0;
|
||||
transition: 0.5s;
|
||||
|
||||
position: relative;
|
||||
left: -1vw;
|
||||
}
|
||||
}
|
||||
|
||||
#session-panel {
|
||||
opacity: 0.2;
|
||||
transition: 0.5s;
|
||||
z-index: 2;
|
||||
&:hover { opacity: 1 };
|
||||
|
||||
#sessions-list li { display: inline-block; }
|
||||
}
|
||||
|
||||
#sessions {
|
||||
cursor: pointer;
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
|
||||
#sessions-list {
|
||||
list-style: none;
|
||||
display: none;
|
||||
}
|
||||
|
||||
&.select-session {
|
||||
#session-display { display: none; }
|
||||
#sessions-list { display: inline-block; }
|
||||
}
|
||||
}
|
||||
|
||||
.failed-auth {
|
||||
input[type=password] {
|
||||
color: red;
|
||||
border-color: red !important;
|
||||
}
|
||||
#fail-msg { opacity: 1 !important; }
|
||||
}
|
||||
|
||||
@keyframes throb {
|
||||
from { opacity: 1; }
|
||||
to { opacity: 0; }
|
||||
}
|
||||
|
||||
.throb { animation: alternate infinite 2s throb; }
|
||||
|
||||
|
||||
.evening {
|
||||
#clock-panel {
|
||||
border-bottom: 2px solid $colorFG;
|
||||
text-align: right;
|
||||
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
#login-panel {
|
||||
position: absolute;
|
||||
bottom: 2vw;
|
||||
left: 1vw;
|
||||
}
|
||||
|
||||
#session-panel {
|
||||
position: absolute;
|
||||
bottom: 0.5vw;
|
||||
left: 1vw;
|
||||
}
|
||||
}
|
||||
|
||||
.morning, .night, .afternoon {
|
||||
#clock-panel {
|
||||
border-top: 2px solid $colorFG;
|
||||
|
||||
position: absolute;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
}
|
||||
|
||||
#login-panel {
|
||||
position: absolute;
|
||||
bottom: 2vw;
|
||||
left: 20vw;
|
||||
}
|
||||
|
||||
#session-panel {
|
||||
position: absolute;
|
||||
bottom: 0.5vw;
|
||||
left: 20vw;
|
||||
}
|
||||
}
|
||||
|
||||
.morning {
|
||||
#clock-panel { text-shadow: 0 0 0.2vw #446688; }
|
||||
#users:hover #user-display, #sessions:hover #session-display,
|
||||
#users-list li:hover, #sessions-list li.session:hover {
|
||||
color: #0088aa;
|
||||
text-shadow: 0 0 0.5vw black;
|
||||
}
|
||||
#power-panel { opacity: 0.7; }
|
||||
}
|
||||
|
||||
.afternoon {
|
||||
#clock-panel { text-shadow: 0 0 2vw #448844; }
|
||||
#users:hover #user-display, #sessions:hover #session-display,
|
||||
#users-list li:hover, #sessions-list li.session:hover {
|
||||
color: #00aa00;
|
||||
text-shadow: 0 0 0.5vw black;
|
||||
}
|
||||
}
|
||||
|
||||
.evening {
|
||||
#clock-panel { text-shadow: 0 0 2vw #faaa3b; }
|
||||
#users:hover #user-display, #sessions:hover #session-display,
|
||||
#users-list li:hover, #sessions-list li.session:hover {
|
||||
color: orange;
|
||||
text-shadow: 0 0 0.5vw black;
|
||||
}
|
||||
#power-panel { opacity: 0.7; }
|
||||
}
|
||||
|
||||
.night {
|
||||
#clock-panel { text-shadow: 0 0 2vw #884488; }
|
||||
#users:hover #user-display, #sessions:hover #session-display,
|
||||
#users-list li:hover, #sessions-list li.session:hover {
|
||||
color: #8822bb;
|
||||
text-shadow: 0 0 0.2vw black;
|
||||
}
|
||||
}
|
||||
|
||||
/*.night {
|
||||
#clock-panel {
|
||||
|
||||
}
|
||||
|
||||
#login-panel {
|
||||
position: absolute;
|
||||
bottom: 2vw;
|
||||
left: 2vw;
|
||||
}
|
||||
}*/
|
||||
BIN
img/afternoon.jpg
Normal file
BIN
img/afternoon.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.6 MiB |
|
Before Width: | Height: | Size: 160 KiB After Width: | Height: | Size: 160 KiB |
BIN
img/morning.jpg
Normal file
BIN
img/morning.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 8.8 MiB |
BIN
img/night.gif
Normal file
BIN
img/night.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 498 KiB |
50
index.html
50
index.html
@ -9,19 +9,57 @@
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<img id=bg src="img/background.jpg">
|
||||
<img id=bg-morning class=bg src="img/morning.jpg">
|
||||
<img id=bg-afternoon class=bg src="img/afternoon.jpg">
|
||||
<img id=bg-evening class=bg src="img/evening.jpg">
|
||||
<img id=bg-night class=bg src="img/night.gif">
|
||||
|
||||
<div id=power-panel onmouseout='hidePowerOptions(event)'>
|
||||
<div id=power-button onclick='showPowerOptions()'><i class="fa fa-power-off fa-3x"></i></div>
|
||||
<div id=ui-container>
|
||||
<div id=power-panel>
|
||||
<div id=power-button><i class="fa fa-power-off fa-3x"></i></div>
|
||||
<div id=power-options class=visible>
|
||||
<ul>
|
||||
<li><i class='fa fa-moon-o'></i> Suspend</li>
|
||||
<li><i class='fa fa-refresh'></i> Restart</li>
|
||||
<li><i class='fa fa-power-off'></i> Shutdown</li>
|
||||
<li id=suspend><i class='fa fa-moon-o'></i> Suspend</li>
|
||||
<li id=restart><i class='fa fa-refresh'></i> Restart</li>
|
||||
<li id=shutdown><i class='fa fa-power-off'></i> Shutdown</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id=login-panel>
|
||||
<h1>
|
||||
<span id=greeting>Good day</span>,
|
||||
<div id=users>
|
||||
<span id=user-display>User</span>
|
||||
<ul id=users-list></ul>
|
||||
<i class='fa fa-user-circle'></i>
|
||||
</div>
|
||||
</h1>
|
||||
<input type=password name=pwd placeholder='password...'>
|
||||
<i class='fa fa-exclamation-circle' id=fail-msg></i>
|
||||
</div>
|
||||
|
||||
<div id=session-panel>
|
||||
<h2>
|
||||
session:
|
||||
<div id=sessions>
|
||||
<span id=session-display>default</span>
|
||||
<ul id=sessions-list></ul>
|
||||
</div>
|
||||
</h2>
|
||||
</div>
|
||||
|
||||
<div id=clock-panel>
|
||||
<span class=hours></span><!--
|
||||
--><span class=throb>:</span><!--
|
||||
--><span class=minutes></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type=application/javascript src=js/jquery-3.1.1.slim.min.js ></script>
|
||||
<script type=application/javascript src=js/underscore-min.js ></script>
|
||||
<script type=application/javascript src=js/backbone-min.js ></script>
|
||||
<script type=application/javascript src=js/lightdm-mock.js ></script>
|
||||
<script type=application/javascript src=js/lightdm-uestibulum.js ></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
5
index.theme
Normal file
5
index.theme
Normal file
@ -0,0 +1,5 @@
|
||||
[theme]
|
||||
name=Uestibulum
|
||||
description=Uestibulum Greeter Theme
|
||||
engine=lightdm-webkit-greeter
|
||||
url=index.html
|
||||
2
js/backbone-min.js
vendored
Normal file
2
js/backbone-min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
4
js/jquery-3.1.1.slim.min.js
vendored
Normal file
4
js/jquery-3.1.1.slim.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
211
js/lightdm-mock.js
Normal file
211
js/lightdm-mock.js
Normal file
@ -0,0 +1,211 @@
|
||||
/*
|
||||
Mock data for testing your LightDM theme in the browser
|
||||
*/
|
||||
if (!('lightdm' in window)) {
|
||||
window.lightdm = {};
|
||||
lightdm.hostname ="test-host";
|
||||
lightdm.languages = [
|
||||
{
|
||||
code: "en_US",
|
||||
name: "English(US)",
|
||||
territory: "USA"
|
||||
},
|
||||
{
|
||||
code: "en_UK",
|
||||
name: "English(UK)",
|
||||
territory: "UK"
|
||||
}
|
||||
];
|
||||
lightdm.default_language = lightdm.languages[0];
|
||||
lightdm.layouts = [
|
||||
{
|
||||
name: "test",
|
||||
short_description: "test description",
|
||||
short_description:"really long epic description"
|
||||
}
|
||||
];
|
||||
lightdm.default_layout = lightdm.layouts[0];
|
||||
lightdm.layout = lightdm.layouts[0];
|
||||
lightdm.sessions = [
|
||||
{
|
||||
key: "key1",
|
||||
name: "session 1",
|
||||
comment: "no comment"
|
||||
},
|
||||
{
|
||||
key: "key2",
|
||||
name: "session 2",
|
||||
comment: "no comment"
|
||||
}
|
||||
];
|
||||
|
||||
lightdm.default_session = lightdm.sessions[0];
|
||||
lightdm.authentication_user = null;
|
||||
lightdm.is_authenticated = false;
|
||||
lightdm.can_suspend = true;
|
||||
lightdm.can_hibernate = true;
|
||||
lightdm.can_restart = true;
|
||||
lightdm.can_shutdown = true;
|
||||
|
||||
lightdm.users = [
|
||||
{
|
||||
name: "clarkk",
|
||||
real_name: "Superman",
|
||||
display_name: "Clark Kent",
|
||||
image: "http://uk.omg.li/VDXV/1756295270.jpg.x160.jpg",
|
||||
language: "en_US",
|
||||
layout: null,
|
||||
session: null,
|
||||
logged_in: false
|
||||
},
|
||||
{
|
||||
name: "brucew",
|
||||
real_name: "Batman",
|
||||
display_name: "Bruce Wayne",
|
||||
image: "http://uk.omg.li/VDHr/OW-blog-Batman.jpg",
|
||||
language: "en_US",
|
||||
layout: null,
|
||||
session: null,
|
||||
logged_in: false
|
||||
},
|
||||
{
|
||||
name: "peterp",
|
||||
real_name:"Spiderman",
|
||||
display_name: "Peter Parker",
|
||||
image: "",
|
||||
language: "en_US",
|
||||
layout: null,
|
||||
session: null,
|
||||
logged_in: true
|
||||
}
|
||||
];
|
||||
|
||||
lightdm.num_users = lightdm.users.length;
|
||||
lightdm.timed_login_delay = 0; // increase to simulate timed_login_delay
|
||||
lightdm.timed_login_user =
|
||||
lightdm.timed_login_delay > 0 ? lightdm.users[0] : null;
|
||||
|
||||
lightdm.get_string_property = function () {};
|
||||
lightdm.get_integer_property = function () {};
|
||||
lightdm.get_boolean_property = function () {};
|
||||
lightdm.cancel_timed_login = function () {
|
||||
_lightdm_mock_check_argument_length(arguments, 0);
|
||||
|
||||
lightdm._timed_login_cancelled= true;
|
||||
};
|
||||
|
||||
lightdm.respond = lightdm.provide_secret = function (secret) {
|
||||
if (typeof lightdm._username == 'undefined' || !lightdm._username) {
|
||||
throw "must call start_authentication first"
|
||||
}
|
||||
_lightdm_mock_check_argument_length(arguments, 1);
|
||||
|
||||
var user = _lightdm_mock_get_user(lightdm.username);
|
||||
|
||||
// That's right, passwords are the same as the username's!
|
||||
if (!user && secret == lightdm._username) {
|
||||
lightdm.is_authenticated = true;
|
||||
lightdm.authentication_user = user;
|
||||
} else {
|
||||
lightdm.is_authenticated = false;
|
||||
lightdm.authentication_user = null;
|
||||
lightdm._username = null;
|
||||
}
|
||||
|
||||
authentication_complete();
|
||||
};
|
||||
|
||||
lightdm.authenticate = lightdm.start_authentication = function (username) {
|
||||
_lightdm_mock_check_argument_length(arguments, 1);
|
||||
|
||||
if (lightdm._username) {
|
||||
throw "Already authenticating!";
|
||||
}
|
||||
var user = _lightdm_mock_get_user(username);
|
||||
if (!user) {
|
||||
show_error(username + " is an invalid user");
|
||||
}
|
||||
show_prompt("Password: ", "password");
|
||||
lightdm._username = username;
|
||||
};
|
||||
|
||||
lightdm.cancel_authentication = function () {
|
||||
_lightdm_mock_check_argument_length(arguments, 0);
|
||||
|
||||
if (!lightdm._username) {
|
||||
throw "we are not authenticating";
|
||||
}
|
||||
lightdm._username = null;
|
||||
};
|
||||
|
||||
lightdm.suspend = function () {
|
||||
alert("System Suspended. Bye Bye");
|
||||
document.location.reload(true);
|
||||
};
|
||||
|
||||
lightdm.hibernate = function () {
|
||||
alert("System Hibernated. Bye Bye");
|
||||
document.location.reload(true);
|
||||
};
|
||||
|
||||
lightdm.restart = function () {
|
||||
alert("System restart. Bye Bye");
|
||||
document.location.reload(true);
|
||||
};
|
||||
|
||||
lightdm.shutdown = function () {
|
||||
alert("System Shutdown. Bye Bye");
|
||||
document.location.reload(true);
|
||||
};
|
||||
|
||||
lightdm.start_session_sync = function (session) {
|
||||
_lightdm_mock_check_argument_length(arguments, 1);
|
||||
|
||||
if (!lightdm.is_authenticated) {
|
||||
throw "The system is not authenticated";
|
||||
}
|
||||
|
||||
alert("logged in successfully!!");
|
||||
document.location.reload(true);
|
||||
};
|
||||
|
||||
lightdm.login = function (user, session) {
|
||||
_lightdm_mock_check_argument_length(arguments, 2);
|
||||
|
||||
if (!lightdm.is_authenticated) {
|
||||
throw "The system is not authenticated";
|
||||
}
|
||||
if (user !== lightdm.authentication_user) {
|
||||
throw "this user is not authenticated";
|
||||
}
|
||||
|
||||
alert("logged in successfully!!");
|
||||
document.location.reload(true);
|
||||
};
|
||||
|
||||
if (lightdm.timed_login_delay > 0) {
|
||||
setTimeout(
|
||||
function () {
|
||||
if (!lightdm._timed_login_cancelled()) timed_login();
|
||||
},
|
||||
lightdm.timed_login_delay
|
||||
);
|
||||
}
|
||||
}
|
||||
// Helper functions
|
||||
var _lightdm_mock_check_argument_length = function (args, length) {
|
||||
if (args.length != length) {
|
||||
throw "incorrect number of arguments in function call";
|
||||
}
|
||||
}
|
||||
|
||||
var _lightdm_mock_get_user = function (username) {
|
||||
var user = null;
|
||||
for (var i = 0; i < lightdm.users.length; ++i) {
|
||||
if (lightdm.users[i].name == username) {
|
||||
user= lightdm.users[i];
|
||||
break;
|
||||
}
|
||||
}
|
||||
return user;
|
||||
}
|
||||
@ -1,12 +1,222 @@
|
||||
var powerOptionsEl = document.getElementById("power-options")
|
||||
var powerPanelClasses = document.getElementById("power-panel").classList;
|
||||
(function() {
|
||||
|
||||
function showPowerOptions() {
|
||||
powerPanelClasses.add('active');
|
||||
}
|
||||
var U = window.uestibulum = {};
|
||||
_.templateSettings = {
|
||||
interpolate: /\{\{(.+?)\}\}/g
|
||||
};
|
||||
|
||||
U.ClockView = Backbone.View.extend({
|
||||
el: '#clock-panel',
|
||||
|
||||
render: function() {
|
||||
var now = new Date();
|
||||
this.$el.find('.hours').text(now.getHours());
|
||||
this.$el.find('.minutes').text(now.getMinutes() < 10 ? "0" + now.getMinutes(): now.getMinutes());
|
||||
},
|
||||
|
||||
initialize: function(options) {
|
||||
_.bindAll(this, 'render');
|
||||
setInterval(this.render, 1000);
|
||||
this.render();
|
||||
}
|
||||
});
|
||||
|
||||
U.PowerView = Backbone.View.extend({
|
||||
el: '#power-panel',
|
||||
events: {
|
||||
'click #power-button': 'showPowerOptions',
|
||||
'mouseout #power-options': 'hidePowerOptions',
|
||||
'click suspend': 'suspend',
|
||||
'click restart': 'restart',
|
||||
'click shutdown': 'shutdown'
|
||||
},
|
||||
|
||||
initialize: function(options) {
|
||||
_.bindAll(this, 'showPowerOptions', 'hidePowerOptions', 'restart', 'shutdown', 'suspend');
|
||||
this.optionsEl = $('#power-options')[0];
|
||||
},
|
||||
|
||||
showPowerOptions: function() { this.$el.addClass('active'); },
|
||||
hidePowerOptions: function(e) {
|
||||
if (e.target != this.optionsEl) return;
|
||||
this.$el.removeClass('active');
|
||||
},
|
||||
|
||||
restart: function() { lightdm.restart(); },
|
||||
shutdown: function() { lightdm.shutdown(); },
|
||||
suspend: function() { lightdm.suspend(); }
|
||||
|
||||
});
|
||||
|
||||
U.LoginView = Backbone.View.extend({
|
||||
el: '#login-panel',
|
||||
events: {
|
||||
'click #user-display': 'showUserSelect',
|
||||
'click li.user': 'selectUser',
|
||||
'keypress input[type=password]': 'enterPassword'
|
||||
},
|
||||
|
||||
initialize: function(options) {
|
||||
_.bindAll(this, 'enterPassword', 'getUserName',
|
||||
'render', 'showPrompt', 'showUserSelect');
|
||||
|
||||
this.uiView = options.uiView;
|
||||
window.show_prompt = this.showPrompt;
|
||||
this.user = lightdm.users[0];
|
||||
|
||||
lightdm.authenticate(this.user.name);
|
||||
//lightdm.start_authentication(this.user.name);
|
||||
},
|
||||
|
||||
getUserName: function(user) {
|
||||
return user.display_name || user.real_name || user.name;
|
||||
},
|
||||
|
||||
render: function() {
|
||||
this.undelegateEvents();
|
||||
var greeting = 'Good ' + this.uiView.timePeriod;
|
||||
|
||||
var $userListEl = this.$el.find('#users-list');
|
||||
$userListEl.html(
|
||||
_.map(lightdm.users, function(user) {
|
||||
return '<li class=user data-username="' + user.name + '">' +
|
||||
this.getUserName(user) + '</li>';
|
||||
}, this).join('\n'));
|
||||
|
||||
if (this.user) {
|
||||
this.$el.find('#greeting').text(greeting);
|
||||
this.$el.find('#user-display').text(this.getUserName(this.user));
|
||||
}
|
||||
this.delegateEvents();
|
||||
},
|
||||
|
||||
showUserSelect: function() {
|
||||
this.$el.removeClass('failed-auth');
|
||||
this.$el.find('#users').addClass('select-user');
|
||||
lightdm.cancel_authentication();
|
||||
this.$el.find('input[type=password]').removeClass('active');
|
||||
this.user = null;
|
||||
},
|
||||
|
||||
selectUser: function(e) {
|
||||
var username = $(e.target).attr('data-username');
|
||||
this.$el.find('#users').removeClass('select-user');
|
||||
this.user = _.find(lightdm.users, function(user) {
|
||||
return user.name == username; });
|
||||
lightdm.authenticate(this.user.name);
|
||||
this.render();
|
||||
},
|
||||
|
||||
showPrompt: function(text, type) {
|
||||
if (type == 'password') {
|
||||
var $pwdInput = this.$el.find('input[type=password]');
|
||||
$pwdInput.addClass('active');
|
||||
$pwdInput.focus();
|
||||
}
|
||||
|
||||
else alert(type + ': ' + text);
|
||||
},
|
||||
|
||||
enterPassword: function(e) {
|
||||
this.$el.removeClass('failed-auth');
|
||||
//if (e.key != 'Enter') return;
|
||||
if (e.keyCode != 13) return;
|
||||
lightdm.respond($(e.target).val());
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
U.SessionView = Backbone.View.extend({
|
||||
el: '#session-panel',
|
||||
events: {
|
||||
'click #session-display': 'showSessionSelect',
|
||||
'click li.session': 'selectSession'
|
||||
},
|
||||
|
||||
initialize: function(options) {
|
||||
_.bindAll(this, 'render', 'showSessionSelect', 'selectSession');
|
||||
|
||||
this.session = lightdm.sessions[0];
|
||||
},
|
||||
|
||||
render: function() {
|
||||
this.$el.find('#sessions-list').html(
|
||||
_.map(lightdm.sessions, function(session) {
|
||||
return '<li class=session data-sessionkey="' + session.key + '">' +
|
||||
session.name + '</li>'; }).join('<li> | </li>'));
|
||||
|
||||
if (this.session) {
|
||||
this.$el.find('#session-display').text(this.session.name); }
|
||||
},
|
||||
|
||||
showSessionSelect: function() {
|
||||
this.$el.find('#sessions').addClass('select-session');
|
||||
},
|
||||
|
||||
selectSession: function(e) {
|
||||
this.$el.find('#sessions').removeClass('select-session');
|
||||
var sessionKey = $(e.target).attr('data-sessionkey');
|
||||
this.session = _.find(lightdm.sessions, function(session) {
|
||||
return session.key == sessionKey; });
|
||||
this.render();
|
||||
}
|
||||
});
|
||||
|
||||
U.UIView = Backbone.View.extend({
|
||||
el: 'body',
|
||||
events: {},
|
||||
|
||||
initialize: function(options) {
|
||||
_.bindAll(this, 'render', 'authComplete', 'checkTimePeriod');
|
||||
|
||||
window.authentication_complete = this.authComplete;
|
||||
|
||||
this.timePeriod = 'day';
|
||||
this.loginView = new U.LoginView({uiView: this});
|
||||
this.sessionView = new U.SessionView();
|
||||
this.clockView = new U.ClockView();
|
||||
this.powerView = new U.PowerView();
|
||||
this.render();
|
||||
},
|
||||
|
||||
authComplete: function() {
|
||||
if (lightdm.is_authenticated) {
|
||||
//lightdm.start_session_sync(this.sessionView.session.key);
|
||||
lightdm.login(this.loginView.user, this.sessionView.session.key);
|
||||
}
|
||||
else {
|
||||
this.$el.find('#login-panel').addClass('failed-auth');
|
||||
lightdm.authenticate(this.loginView.user.name);
|
||||
//lightdm.start_authentication(this.loginView.user.name);
|
||||
}
|
||||
},
|
||||
|
||||
render: function() {
|
||||
var prevTimePeriod = this.timePeriod;
|
||||
this.checkTimePeriod();
|
||||
|
||||
if (this.timePeriod != prevTimePeriod) {
|
||||
this.$el.removeClass(prevTimePeriod);
|
||||
this.$el.addClass(this.timePeriod);
|
||||
this.loginView.render();
|
||||
this.sessionView.render();
|
||||
}
|
||||
},
|
||||
|
||||
checkTimePeriod: function() {
|
||||
var now = new Date();
|
||||
if (now.getHours() >= 21 || now.getHours() < 4) this.timePeriod = 'night';
|
||||
else if (now.getHours() < 12) this.timePeriod = 'morning';
|
||||
else if (now.getHours() < 18) this.timePeriod = 'afternoon';
|
||||
else this.timePeriod = 'evening';
|
||||
}
|
||||
});
|
||||
|
||||
$(document).ready(function() {
|
||||
U.uiView = new U.UIView();
|
||||
});
|
||||
|
||||
|
||||
|
||||
})();
|
||||
|
||||
function hidePowerOptions(e) {
|
||||
console.log(e.target);
|
||||
if (e.target != powerOptionsEl) return;
|
||||
powerPanelClasses.remove('active');
|
||||
}
|
||||
|
||||
6
js/underscore-min.js
vendored
Normal file
6
js/underscore-min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
Loading…
x
Reference in New Issue
Block a user