markow
/
web-greeter-theme-basealt
1
0
Fork 0
Code Issues Pull Requests Projects Releases 5 Wiki Activity

Compare commits

base: markow:1.0.3
Branches Tags
markow:master
...
compare: markow:master
Branches Tags
markow:master

8 Commits
1.0.3 ... master

Author SHA1 Message Date
Марков Сергей Викторович 250ef48928 allow to set user wallpapper
2 years ago
Sergey Markov c1241e72b0 readme fix
2 years ago
Sergey Markov a7e699e3ec bug fix with defaults updating storage
2 years ago
Sergey Markov f935c6404e some fixes
2 years ago
markow 2b7de57272 Update 'README.md'
2 years ago
markow b72bcd867e style update
2 years ago
markow 263a8c8d06 Readme update
2 years ago
markow db89c20e99 new waiting state while authentificating
2 years ago
9 changed files with 158 additions and 38 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats
  1. 8
      README.md
  2. 8
      index.html
  3. 2
      index.yml
  4. 57
      main.js
  5. 20
      secondary.html
  6. 56
      style.css
  7. 30
      wallpapper.js
  8. BIN
      wallpappers/Space_Launch.jpg
  9. 15
      web-greeter-theme-basealt.spec

8
README.md
Unescape View File

@ -1,11 +1,11 @@
# Basealt web-greeter-theme # Basealt web-greeter-theme
The lightdm web-greeter theme for altlinux OSes The lightdm web-greeter theme for altlinux OSes<br/>
![](https://git.markow.su/markow/git-utils/raw/branch/master/screenshots/web-greeter-theme-basealt-1.png) ![](https://git.markow.su/markow/git-utils/raw/branch/master/screenshots/web-greeter-theme-basealt.gif)
# Install # Install
``` ```
# echo "rpm http://packages.markow.su/altlinux p10/branch/x86_64 classic" > /etc/apt/sources.list.d/markow.list # apt-repo add rpm http://packages.markow.su/altlinux p10/branch/x86_64 classic
# echo "rpm http://packages.markow.su/altlinux p10/branch/noarch classic" >> /etc/apt/sources.list.d/markow.list # apt-repo add rpm http://packages.markow.su/altlinux p10/branch/noarch classic
# apt-get update # apt-get update
# apt-get install web-greeter-theme-basealt # apt-get install web-greeter-theme-basealt

8
index.html
Unescape View File

@ -3,7 +3,8 @@
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<link rel="stylesheet" href="style.css" class="style"> <link rel="stylesheet" href="style.css" class="style">
<script type="text/javascript" src="main.js"></script> <script type="text/javascript" src="wallpapper.js"></script>
<script type="text/javascript" src="main.js"></script>
<title>Example Theme</title> <title>Example Theme</title>
</head> </head>
<body> <body>
@ -32,6 +33,7 @@
<option value="Elbrus1.jpg">Эльбрус - 1</option> <option value="Elbrus1.jpg">Эльбрус - 1</option>
<option value="Elbrus2.jpg">Эльбрус - 2</option> <option value="Elbrus2.jpg">Эльбрус - 2</option>
<option value="Elbrus3.jpg">Эльбрус - 3</option> <option value="Elbrus3.jpg">Эльбрус - 3</option>
<option value="User">Пользовательский</option>
</select> </select>
</dev> </dev>
</td> </td>
@ -46,7 +48,9 @@
<p id="user" /> <p id="user" />
<form onSubmit="doLogin()"> <form onSubmit="doLogin()">
<table> <table>
<tr><td colspan="2"><div id="underline"><input type="password" name="password" id="password" autocomplete="off" placeholder="Введите пароль" autofocus /><img src="images/eye.png" id="eye" onClick="togglePasswordVisibility()" style="width:18px;height:18px;vertical-align: middle" /></div></td></tr> <tr><td colspan="2"><div class="view_port"><div id="underline"><input type="password" name="password" id="password" autocomplete="off" placeholder="Введите пароль" autofocus /><img src="images/eye.png" id="eye" onClick="togglePasswordVisibility()" style="width:18px;height:18px;vertical-align: middle" /></div>
<div id="cylon_eye"/></div>
</td></tr>
<tr><td><select name="sessions" id="sessions" /></td><td align="right"><button type="submit" id="submit" class='input_submit'>Поехали!</button></td></tr> <tr><td><select name="sessions" id="sessions" /></td><td align="right"><button type="submit" id="submit" class='input_submit'>Поехали!</button></td></tr>
</table> </table>
</form> </form>

2
index.yml
Unescape View File

@ -0,0 +1,2 @@
primary_html: "index.html"
secondary_html: "secondary.html"

57
main.js
Unescape View File

@ -1,7 +1,6 @@
const DEFAULT_USER = "defaultUser"; const DEFAULT_USER = "defaultUser";
const DEFAULT_SESSION = "defaultSession"; const DEFAULT_SESSION = "defaultSession";
const DEFAULT_WALLPAPPER = "defaultWallpapper"; const WAITING_CLASS = "waiting";
const WALLPAPPER_ELEMENT = "wallpappers";
function togglePasswordVisibility() { function togglePasswordVisibility() {
var passwd = document.getElementById("password"); var passwd = document.getElementById("password");
@ -15,15 +14,43 @@ function togglePasswordVisibility() {
} }
} }
function toggleWaitingState(waiting) {
var cylon_eye = document.getElementById("cylon_eye");
var passwd = document.getElementById("password");
passwd.disabled = waiting;
var submit = document.getElementById("submit");
// submit.disabled = waiting;
if (waiting) {
cylon_eye.classList.add(WAITING_CLASS);
} else {
cylon_eye.classList.remove(WAITING_CLASS);
}
}
function updateDefaults(user, session) { function updateDefaults(user, session) {
localStorage.setItem(DEFAULT_USER, user) console.log(user)
localStorage.setItem(DEFAULT_SESSION, session) console.log(session)
window.localStorage.setItem(DEFAULT_USER, user)
window.localStorage.setItem(DEFAULT_SESSION, session)
var wallpapper = document.getElementById(WALLPAPPER_ELEMENT).value var wallpapper = document.getElementById(WALLPAPPER_ELEMENT).value
if(wallpapper) { if(wallpapper) {
localStorage.setItem(DEFAULT_WALLPAPPER, wallpapper) console.log(wallpapper)
window.localStorage.setItem(DEFAULT_WALLPAPPER, wallpapper)
}
}
function updateDefaultsInLocalstorage() {
var user = document.getElementById("user").textContent
var session = document.getElementById("sessions").value
if (!user || !session) {
return false;
} }
updateDefaults(user, session);
} }
function dateFormat(date) { function dateFormat(date) {
@ -56,7 +83,7 @@ function doLogin() {
lightdm.cancel_authentication(); lightdm.cancel_authentication();
updateDefaults(user, session); toggleWaitingState(true);
lightdm.authenticate(user) lightdm.authenticate(user)
return false; return false;
} }
@ -75,17 +102,14 @@ function updateUser(username) {
} }
} }
}); });
}
function updateWallpapper(wallpapper) { updateDefaultsInLocalstorage();
var body = document.getElementsByTagName('body')[0];
body.style.backgroundImage = `url(wallpappers/${wallpapper})`;
} }
function initGreeter() { function initGreeter() {
let users = lightdm.users let users = lightdm.users
let defaultUser = localStorage.getItem(DEFAULT_USER) || users[0].username; let defaultUser = window.localStorage.getItem(DEFAULT_USER) || users[0].username;
updateUser(defaultUser); updateUser(defaultUser);
let select = document.getElementById('user-dropdown-content') let select = document.getElementById('user-dropdown-content')
@ -103,16 +127,18 @@ function initGreeter() {
wallpappers.addEventListener('change', (event) => { wallpappers.addEventListener('change', (event) => {
updateWallpapper(event.target.value); updateWallpapper(event.target.value);
updateDefaultsInLocalstorage();
}); });
let defaultWallpapper = localStorage.getItem(DEFAULT_WALLPAPPER); let defaultWallpapper = window.localStorage.getItem(DEFAULT_WALLPAPPER);
if(defaultWallpapper) { if(defaultWallpapper) {
selectItemByValue(wallpappers, defaultWallpapper); selectItemByValue(wallpappers, defaultWallpapper);
updateWallpapper(defaultWallpapper); updateWallpapper(defaultWallpapper);
updateDefaultsInLocalstorage();
} }
let sessions = lightdm.sessions let sessions = lightdm.sessions
let defaultSession = localStorage.getItem(DEFAULT_SESSION) || sessions[0].key; let defaultSession = window.localStorage.getItem(DEFAULT_SESSION) || sessions[0].key;
let sessionsSelect = document.getElementById('sessions') let sessionsSelect = document.getElementById('sessions')
for (let i = 0; i < sessions.length; i++) { for (let i = 0; i < sessions.length; i++) {
var opt = document.createElement('option') var opt = document.createElement('option')
@ -126,6 +152,10 @@ function initGreeter() {
} }
sessionsSelect.value = defaultSession; sessionsSelect.value = defaultSession;
sessionsSelect.addEventListener('change', (event) => {
updateDefaultsInLocalstorage();
});
document.getElementById("date").textContent=dateFormat(theme_utils.get_current_localized_date()); document.getElementById("date").textContent=dateFormat(theme_utils.get_current_localized_date());
document.getElementById("time").textContent=theme_utils.get_current_localized_time(); document.getElementById("time").textContent=theme_utils.get_current_localized_time();
@ -134,6 +164,7 @@ function initGreeter() {
lightdm.respond(password); lightdm.respond(password);
}); });
lightdm.authentication_complete.connect(() => { lightdm.authentication_complete.connect(() => {
toggleWaitingState(false);
if (lightdm.is_authenticated) { if (lightdm.is_authenticated) {
var session = document.getElementById("sessions").value var session = document.getElementById("sessions").value
lightdm.start_session(session); lightdm.start_session(session);

20
secondary.html
Unescape View File

@ -0,0 +1,20 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="style.css" class="style">
<script type="text/javascript" src="wallpapper.js"></script>
<script type="text/javascript">
function initGreeter() {
let defaultWallpapper = window.localStorage.getItem(DEFAULT_WALLPAPPER);
if(defaultWallpapper) {
updateWallpapper(defaultWallpapper);
}
}
window.addEventListener("GreeterReady", initGreeter)
</script>
<title>Example Theme</title>
</head>
<body />
</html>

56
style.css
Unescape View File

@ -1,9 +1,11 @@
* { * {
--bg: rgb(255,165,0); --bg: rgb(255,165,0);
--btbg: gray; --btbg: gray;
--main-buttons-color: rgb(255, 154, 0);
--opacity: 0.9; --opacity: 0.9;
--color: white; --color: white;
--color-wait : var(--btbg);
} }
html, body { html, body {
@ -14,11 +16,11 @@ html, body {
body { body {
background-image: url("wallpappers/Rosatomflot.jpg"); background-image: url("wallpappers/Rosatomflot.jpg");
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: 100% 100%; background-size: 100% 100%;
} }
#submit { #submit {
background-color: rgba(255, 140, 0, 1); background-color: var(--main-buttons-color);
border: 0; border: 0;
color: var(--color); color: var(--color);
font-weight:bold; font-weight:bold;
@ -118,7 +120,7 @@ table, tr, td {
} }
#buttons { #buttons {
background-color: gray; background-color: var(--btbg);
opacity: var(--opacity); opacity: var(--opacity);
width: 150px; width: 150px;
margin: 0; margin: 0;
@ -146,7 +148,7 @@ table, tr, td {
} }
#sessions, #sessions option { #sessions, #sessions option {
background-color: rgba(255, 140, 0, 1); background-color: var(--main-buttons-color);
opacity: 1; opacity: 1;
border: 0; border: 0;
width: 150px; width: 150px;
@ -182,8 +184,8 @@ table, tr, td {
} }
.user-dropdown { .user-dropdown {
display: inline-block; display: inline-block;
position: relative; position: relative;
background-color: var(--bg); background-color: var(--bg);
opacity: var(--opacity); opacity: var(--opacity);
} }
@ -195,23 +197,23 @@ table, tr, td {
font-weight:bold; font-weight:bold;
} }
.user-dropdown-content { .user-dropdown-content {
display: none; display: none;
position: absolute; position: absolute;
width: 100%; width: 100%;
overflow: auto; overflow: auto;
box-shadow: 0px 10px 10px 0px rgba(0,0,0,0.4); box-shadow: 0px 10px 10px 0px rgba(0,0,0,0.4);
background-color: var(--bg); background-color: var(--bg);
opacity: var(--opacity); opacity: var(--opacity);
} }
.user-dropdown:hover .user-dropdown-content { .user-dropdown:hover .user-dropdown-content {
display: block; display: block;
} }
.user-dropdown-content button { .user-dropdown-content button {
border: 0; border: 0;
width:100%; width:100%;
display: block; display: block;
padding: 5px; padding: 5px;
text-decoration: none; text-decoration: none;
text-align: start; text-align: start;
background-color: var(--bg); background-color: var(--bg);
opacity: var(--opacity); opacity: var(--opacity);
@ -233,3 +235,25 @@ table, tr, td {
100% { right: -5px; } 100% { right: -5px; }
} }
.view_port {
overflow: hidden;
}
#cylon_eye {
position: relative;
top: -7px;
left: 0px;
color: white;
height: 2px;
width: 30%;
}
.waiting {
background-color: var(--color-wait);
background-image: linear-gradient(to right, var(--color) 15%, var(--color-wait) 50%, var(--color) 85%);
animation: 4s linear 0s infinite alternate move_eye;
}
@keyframes move_eye { from { margin-left:-30%; } to { margin-left:100%; } }

30
wallpapper.js
Unescape View File

@ -0,0 +1,30 @@
const DEFAULT_WALLPAPPER = "defaultWallpapper";
const WALLPAPPER_ELEMENT = "wallpappers";
function setWallpapper(wallpapper) {
console.log(wallpapper)
var body = document.getElementsByTagName('body')[0];
body.style.backgroundImage = wallpapper;
}
function updateWallpapper(wallpapper) {
let wall_file = `url(wallpappers/${wallpapper})`
if (wallpapper === 'User') {
setWallpapper(`url(wallpappers/Rosatomflot.jpg)`)
theme_utils.dirlist(`/usr/share/web-greeter/themes/basealt/wallpappers`, true, (images) => {
if(images) {
console.log(images)
for (let i = 0; i < images.length; i++) {
let image = images[i]
if(image.indexOf("/wallpapper.png") == image.length - 15) {
setWallpapper(`url(${image})`)
console.log(wall_file)
}
}
}
});
} else {
setWallpapper(`url(wallpappers/${wallpapper})`)
}
}

BIN
wallpappers/Space_Launch.jpg
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 275 KiB

After

Width:  |  Height:  |  Size: 1.6 MiB

15
web-greeter-theme-basealt.spec
Unescape View File

@ -1,8 +1,8 @@
%define shortname basealt %define shortname basealt
Name: web-greeter-theme-basealt Name: web-greeter-theme-basealt
Version: 1.0.2 Version: 1.0.5
Release: alt3 Release: alt1
Summary: A theme for web-greeter on AltLinux Summary: A theme for web-greeter on AltLinux
License: MIT License: MIT
@ -11,7 +11,7 @@ Group: System/Configuration/Boot and Init
Url: https://git.markow.su/markow/web-greeter-theme-basealt Url: https://git.markow.su/markow/web-greeter-theme-basealt
Source: %name-%version.tar Source: %name-%version.tar
Packager: Sergey-V Markov <sergey@markow.su> Packager: Sergey-V Markov <markow@altlinux.org>
Requires: lightdm lightdm-webkit2-greeter Requires: lightdm lightdm-webkit2-greeter
@ -34,6 +34,15 @@ rsync -rv --exclude-from=./.copyignore ./* %buildroot%_datadir/web-greeter/theme
%_datadir/web-greeter/themes/%shortname/* %_datadir/web-greeter/themes/%shortname/*
%changelog %changelog
* Mon Apr 3 2023 Sergey-V Markov <markow@altlinux.org> 1.0.5-alt1
- Allow to set user wallpapper
* Sun Jan 8 2023 Sergey-V Markov <sergey@markow.su> 1.0.4-alt1
- Bug fix with defaults updating storage
* Tue Oct 25 2022 Sergey-V Markov <sergey@markow.su> 1.0.3-alt1
- New feature to wait authentication
* Sat Oct 22 2022 Sergey-V Markov <sergey@markow.su> 1.0.2-alt3 * Sat Oct 22 2022 Sergey-V Markov <sergey@markow.su> 1.0.2-alt3
- Add shortname usage - Add shortname usage

Write Preview
Loading…
Cancel
Save