Mirror/squeezelite-esp32
1
0
Fork 0
mirror of https://github.com/sle118/squeezelite-esp32.git synced 2026-01-30 22:37:21 +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

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

@@ -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);
}