CBSNexora/cbsnexora
4
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

feat(ui): longer startup splash and updated loading animation

Browse Source 
The startup splash now holds for at least 4 seconds (progress 2% per tick up to 90%)
instead of 2, and the loading animation is updated.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
nitesh
2026-10-16 12:31:24 +05:30
co-authored by Claude Opus 5.5
parent 6507e68203
commit 55f5c1cf32
2 changed files with 48 additions and 46 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/assets/animations/loading_animation.json
+42 -40
View File
@@ -45,15 +45,17 @@
"hasMask": false,
"ao": 0,
"ks": { "a": { "a": 0, "k": [
-17.052704811096184,
-15.0467209815979
0,
0,
0
], "ix": 1 }, "s": { "a": 0, "k": [
362.228,
362.228,
394,
394,
100
], "ix": 6 }, "sk": { "a": 0, "k": 0 }, "p": { "a": 0, "k": [
188.2303284168625,
195.49656352277756
250,
250,
0
], "ix": 2 }, "r": { "a": 0, "k": 0, "ix": 10 }, "sa": { "a": 0, "k": 0 }, "o": { "a": 0, "k": 100, "ix": 11 } },
"shapes": [
{
@@ -341,16 +343,16 @@
"g": { "p": 3, "k": { "a": 0, "k": [
0,
1,
0.4470588235294118,
0,
0.6,
0.2,
0.485,
0.9725490196078431,
0.2235294117647059,
0.5019607843137255,
1,
0.9411764705882353,
0,
1
0.6,
0.2,
1,
1,
0.6,
0.2
], "ix": 8 } },
"t": 1,
"a": { "a": 0, "k": 0 },
@@ -363,7 +365,7 @@
"lj": 1,
"ml": 4,
"o": { "a": 0, "k": 100, "ix": 9 },
"w": { "a": 0, "k": 2, "ix": 10 }
"w": { "a": 0, "k": 2.5, "ix": 10 }
},
{
"ty": "fl",
@@ -402,8 +404,8 @@
"o": {
"a": 1,
"k": [
{ "o": { "x": 0.167, "y": 0.167 }, "i": { "x": 0.833, "y": 0.833 }, "s": [0], "t": 0 },
{ "s": [360], "t": 90.0000036657751 }
{ "o": { "x": 0.167, "y": 0.167 }, "i": { "x": 0.833, "y": 0.833 }, "s": [28], "t": 0 },
{ "s": [388], "t": 90.0000036657751 }
],
"ix": 3
},
@@ -437,7 +439,7 @@
250,
250,
0
], "ix": 2 }, "r": { "a": 0, "k": 60, "ix": 10 }, "sa": { "a": 0, "k": 0 }, "o": { "a": 0, "k": 100, "ix": 11 } },
], "ix": 2 }, "r": { "a": 0, "k": 0, "ix": 10 }, "sa": { "a": 0, "k": 0 }, "o": { "a": 0, "k": 100, "ix": 11 } },
"shapes": [
{
"ty": "gr",
@@ -723,16 +725,16 @@
], "ix": 5 },
"g": { "p": 3, "k": { "a": 0, "k": [
0,
0,
0.7764705882352941,
1,
1,
1,
0.485,
0.24705882352941178,
0.38823529411764707,
1,
1,
0.49411764705882355,
0,
1,
1,
1,
1,
1
], "ix": 8 } },
"t": 1,
@@ -746,7 +748,7 @@
"lj": 1,
"ml": 4,
"o": { "a": 0, "k": 100, "ix": 9 },
"w": { "a": 0, "k": 0.5, "ix": 10 }
"w": { "a": 0, "k": 2.5, "ix": 10 }
},
{
"ty": "fl",
@@ -813,14 +815,14 @@
0,
0
], "ix": 1 }, "s": { "a": 0, "k": [
362.228,
362.228,
330,
330,
100
], "ix": 6 }, "sk": { "a": 0, "k": 0 }, "p": { "a": 0, "k": [
250,
250,
0
], "ix": 2 }, "r": { "a": 0, "k": 30, "ix": 10 }, "sa": { "a": 0, "k": 0 }, "o": { "a": 0, "k": 100, "ix": 11 } },
], "ix": 2 }, "r": { "a": 0, "k": 0, "ix": 10 }, "sa": { "a": 0, "k": 0 }, "o": { "a": 0, "k": 100, "ix": 11 } },
"shapes": [
{
"ty": "gr",
@@ -1106,17 +1108,17 @@
], "ix": 5 },
"g": { "p": 3, "k": { "a": 0, "k": [
0,
1,
0.8235294117647058,
0,
0.0784,
0.7059,
0.2118,
0.485,
0.5019607843137255,
0.8117647058823529,
0.5019607843137255,
0.0784,
0.7059,
0.2118,
1,
0,
0.8,
1
0.0784,
0.7059,
0.2118
], "ix": 8 } },
"t": 1,
"a": { "a": 0, "k": 0 },
@@ -1129,7 +1131,7 @@
"lj": 1,
"ml": 4,
"o": { "a": 0, "k": 100, "ix": 9 },
"w": { "a": 0, "k": 0.5, "ix": 10 }
"w": { "a": 0, "k": 2.5, "ix": 10 }
},
{
"ty": "fl",
@@ -1168,8 +1170,8 @@
"o": {
"a": 1,
"k": [
{ "o": { "x": 0.167, "y": 0.167 }, "i": { "x": 0.833, "y": 0.833 }, "s": [0], "t": 0 },
{ "s": [360], "t": 90.0000036657751 }
{ "o": { "x": 0.167, "y": 0.167 }, "i": { "x": 0.833, "y": 0.833 }, "s": [-28], "t": 0 },
{ "s": [332], "t": 90.0000036657751 }
],
"ix": 3
},
src/index.html
+6 -6
View File
@@ -325,10 +325,10 @@
};
document.head.appendChild(script);
// Progress simulation stages (Guaranteed ~2 seconds duration on refresh)
// Progress simulation stages (Guaranteed ~4 seconds duration on refresh: 2% every 90ms reaches 90% in about 4s)
var interval = setInterval(function () {
if (progress < 90) {
progress += 5;
progress += 2;
} else if (angularReady && progress < 100) {
progress += 5;
}
@@ -351,7 +351,7 @@
}
}, 90);
// Enforce minimum hold time (2000ms = 2 seconds) so refresh always shows the animation
// Enforce minimum hold time (4000ms = 4 seconds) so refresh always shows the animation
setTimeout(function () {
minTimePassed = true;
if (angularReady) {
@@ -359,7 +359,7 @@
if (bar) bar.style.width = '100%';
dismissSplash();
}
}, 2000);
}, 4000);
function dismissSplash() {
if (dismissed) return;
@@ -387,12 +387,12 @@
}
};
// Safety fallback (Max 7s in case of backend network failure)
// Safety fallback (Max 9s in case of backend network failure)
setTimeout(function () {
angularReady = true;
minTimePassed = true;
dismissSplash();
}, 7000);
}, 9000);
})();
</script>