Mirror/squeezelite-esp32
1
0
Fork 0
mirror of https://github.com/sle118/squeezelite-esp32.git synced 2026-01-31 14:51:11 +03:00
Code Issues Packages Projects Releases Wiki Activity

add message bubble

Browse Source
This commit is contained in:
Christian Herzog
2019-10-02 20:20:57 +02:00
parent 860c6c72de
commit c7ddbfbb4b
3 changed files with 288 additions and 258 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
components/wifi-manager/code.js
View File

@@ -448,10 +448,10 @@ function checkStatus(){
if (blockAjax) return;
blockAjax = true;
$.getJSON( "/status.json", function( data ) {
if(data.hasOwnProperty('ssid') && data['ssid'] != ""){
if(data["ssid"] === selectedSSID){
if (data.hasOwnProperty('ssid') && data['ssid'] != ""){
if (data["ssid"] === selectedSSID){
//that's a connection attempt
if(data["urc"] === 0){
if (data["urc"] === 0){
//got connection
$("#connected-to span").text(data["ssid"]);
$("#connect-details h1").text(data["ssid"]);
@@ -473,7 +473,7 @@ function checkStatus(){
enableAPTimer = false;
if (!recovery) enableStatusTimer = false;
}
else if(data["urc"] === 1){
else if (data["urc"] === 1){
//failed attempt
$("#connected-to span").text('');
$("#connect-details h1").text('');
@@ -497,7 +497,7 @@ function checkStatus(){
enableStatusTimer = true;
}
}
else if(data.hasOwnProperty('urc') && data['urc'] === 0){
else if (data.hasOwnProperty('urc') && data['urc'] === 0){
//ESP32 is already connected to a wifi without having the user do anything
if( !($("#wifi-status").is(":visible")) ){
$("#connected-to span").text(data["ssid"]);
@@ -512,7 +512,7 @@ function checkStatus(){
if (!recovery) enableStatusTimer = false;
}
}
else if(data.hasOwnProperty('urc') && data['urc'] === 2){
else if (data.hasOwnProperty('urc') && data['urc'] === 2){
//that's a manual disconnect
if($("#wifi-status").is(":visible")){
$("#wifi-status").slideUp( "fast", function() {});
@@ -546,19 +546,19 @@ function checkStatus(){
enableStatusTimer = false;
}
}
if(data.hasOwnProperty('project_name') && data['project_name'] != ''){
if (data.hasOwnProperty('project_name') && data['project_name'] != ''){
pname = data['project_name'];
}
if(data.hasOwnProperty('version') && data['version'] != ''){
if (data.hasOwnProperty('version') && data['version'] != ''){
ver = data['version'];
$("span#foot-fw").html("fw: <strong>"+ver+"</strong>, mode: <strong>"+pname+"</strong>");
}
if(data.hasOwnProperty('ota_pct') && data['ota_pct'] != 0){
if (data.hasOwnProperty('ota_pct') && data['ota_pct'] != 0){
otapct = data['ota_pct'];
$('.progress-bar').css('width', otapct+'%').attr('aria-valuenow', otapct);
$('.progress-bar').html(otapct+'%');
}
if(data.hasOwnProperty('ota_dsc') && data['ota_dsc'] != ''){
if (data.hasOwnProperty('ota_dsc') && data['ota_dsc'] != ''){
otadsc = data['ota_dsc'];
$("span#flash-status").html(otadsc);
if (otadsc.match(/Error:/) || otapct > 95) {
@@ -568,6 +568,14 @@ function checkStatus(){
} else {
$("span#flash-status").html('');
}
if (data.hasOwnProperty('message') && data['message'] != ''){
$('#message').html(data['message']);
$("#content").fadeTo("slow", 0.3, function() {
$("#message").show(500).delay(5000).hide(500, function() {
$("#content").fadeTo("slow", 1.0);
});
});
}
blockAjax = false;
})
.fail(function() {
@@ -598,7 +606,6 @@ function getConfig() {
"</tr>"
);
$("input#"+key).val(data[key]);
console.log(key+": "+data[key]); //TODO
}
}
$("tbody#nvsTable").append(

4
components/wifi-manager/index.html
View File

@@ -44,8 +44,9 @@
<a class="nav-link" data-toggle="tab" href="#tab-credits">Credits</a>
</li>
</ul>
<div id="mode"></div>
<div id="message"></div>
<div id="content">
<div id="myTabContent" class="tab-content">
<div class="tab-pane fade active show" id="tab-wifi">
<div id="wifi">
@@ -315,5 +316,6 @@
</div>
<footer class="footer"><span id="foot-fw"></span><span id="foot-wifi"></span></footer>
<iframe width="0" height="0" border="0" name="dummyframe" id="dummyframe"></iframe>
</div>
</body>
</html>

21
components/wifi-manager/style.css
View File

@@ -331,3 +331,24 @@ td.value {
#boot-div {
float: right;
}
iframe#dummyframe {
float: right;
}
div#message {
display: none;
color: #000;
background: #f00;
position:fixed;
padding: 8px;
top: 20%;
left: 50%;
width:20em;
height:4em;
text-align: center;
margin-left: -10em; /*set to a negative number 1/2 of your width*/
margin-top: -2em; /*set to a negative number 1/2 of your height*/
border-radius: 8px;
box-shadow: 0px 5px 2px -5px rgba(255, 255, 255, 0.5) inset, 0px 10px 20px -5px rgba(255, 255, 255, 0.1) inset, 0 0px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 3px 1px rgba(0, 0, 0, 0.12), 0 1px 10px 0 rgba(0, 0, 0, 0.3);
}