Alex-Devera/3x-ui
1
0
Fork 0
mirror of https://github.com/MHSanaei/3x-ui.git synced 2025-10-13 11:39:13 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

fix: login animation (#3559)

Browse source 
* Add IPv4 for wget in install

* fix: login animation
This commit is contained in:
Tara Rostami 2025-09-25 08:16:50 -05:00 committed by GitHub
parent ee0e3093ba
commit d69af328dc
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
1 changed files with 34 additions and 53 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

75
web/html/login.html
View file

@ -108,17 +108,11 @@
el: '#app',
data: {
themeSwitcher,
loadingStates: {
fetched: false,
spinning: false
},
user: {
username: "",
password: "",
twoFactorCode: ""
},
loadingStates: { fetched: false, spinning: false },
user: { username: "", password: "", twoFactorCode: "" },
twoFactorEnable: false,
lang: ""
lang: "",
animationStarted: false
},
async mounted() {
this.lang = LanguageManager.getLanguage();
@ -127,63 +121,50 @@
methods: {
async login() {
this.loadingStates.spinning = true;
const msg = await HttpUtil.post('/login', this.user);
if (msg.success) {
location.href = basePath + 'panel/';
}
this.loadingStates.spinning = false;
},
async getTwoFactorEnable() {
const msg = await HttpUtil.post('/getTwoFactorEnable');
if (msg.success) {
this.twoFactorEnable = msg.obj;
this.loadingStates.fetched = true;
this.$nextTick(() => {
if (!this.animationStarted) {
this.animationStarted = true;
this.initHeadline();
}
});
return msg.obj;
}
},
initHeadline() {
const animationDelay = 2000;
const headlines = this.$el.querySelectorAll('.headline');
headlines.forEach((headline) => {
const first = headline.querySelector('.is-visible');
if (!first) return;
setTimeout(() => this.hideWord(first, animationDelay), animationDelay);
});
},
});
document.addEventListener("DOMContentLoaded", function () {
var animationDelay = 2000;
initHeadline();
function initHeadline() {
animateHeadline(document.querySelectorAll('.headline'));
}
function animateHeadline(headlines) {
var duration = animationDelay;
headlines.forEach(function (headline) {
setTimeout(function () {
hideWord(headline.querySelector('.is-visible'));
}, duration);
});
}
function hideWord(word) {
var nextWord = takeNext(word);
switchWord(word, nextWord);
setTimeout(function () {
hideWord(nextWord);
}, animationDelay);
}
function takeNext(word) {
return word.nextElementSibling ? word.nextElementSibling : word.parentElement.firstElementChild;
}
function switchWord(oldWord, newWord) {
hideWord(word, delay) {
const nextWord = this.takeNext(word);
this.switchWord(word, nextWord);
setTimeout(() => this.hideWord(nextWord, delay), delay);
},
takeNext(word) {
return word.nextElementSibling || word.parentElement.firstElementChild;
},
switchWord(oldWord, newWord) {
oldWord.classList.remove('is-visible');
oldWord.classList.add('is-hidden');
newWord.classList.remove('is-hidden');
newWord.classList.add('is-visible');
}
},
});
const pm_input_selector = 'input.ant-input, textarea.ant-input';