alexander
/
noticer
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 2 Wiki Activity

Исправлено: при таймауте не выделенных уведомлений исчезает выделенное уведомление

This commit is contained in:
Alexander Zhirov 2023-06-02 01:16:58 +03:00
parent 07d4a45190
commit 00faa70ff0
3 changed files with 25 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
noticer.js
View File

@ -1,10 +1,8 @@
/*! noticer - v0.1.0 - 2023-05-31
/*! noticer - v0.1.1 - 2023-06-02
* https://git.zhirov.kz/alexander/noticer
* Copyright Alexander Zhirov; Licensed GPL-2.0 */
class Noticer {
timer;
constructor() {
this.div = $('<div id="noticer"></div>');
this.div.css({
@ -85,17 +83,17 @@ class Noticer {
newNotice.fadeIn(500).mouseenter(() => {
clearTimeout(opacityTimeout);
this.timer.pause();
timer.pause();
}).mouseleave(() => {
this.timer.resume();
timer.resume();
}).click(() => {
this.timer.dead();
timer.dead();
newNotice.fadeOut(0, function(){
this.remove();
});
});
this.timer = new Timer(() => {
let timer = new Timer(() => {
newNotice.fadeOut(500, function(){
this.remove();
});

4
noticer.min.js vendored
View File

@ -1,4 +1,4 @@
/*! noticer - v0.1.0 - 2023-05-31
/*! noticer - v0.1.1 - 2023-06-02
* https://git.zhirov.kz/alexander/noticer
* Copyright Alexander Zhirov; Licensed GPL-2.0 */
class Noticer{timer;constructor(){this.div=$('<div id="noticer"></div>'),this.div.css({position:"absolute",top:"10px",right:"20px","z-index":"1000"}),$("body").append(this.div)}success(e,t=6e3){this.print(e,t,"#52b818","#bffdc0")}warning(e,t=6e3){this.print(e,t,"#b8ae18","#f8fdbf")}error(e,t=6e3){this.print(e,t,"#b96161","#fddede")}print=function(e,t,n,s){t<6e3&&(t=6e3);let i=function(e,t){let n,s,o=t;this.pause=function(){clearTimeout(n),o-=new Date-s},this.resume=function(){s=new Date,clearTimeout(n),n=setTimeout(e,o)},this.dead=function(){clearTimeout(n)},this.resume()},o=$(`<div class="notice">${e}</div>`);o.css({border:`1px solid ${n}`,"background-color":`${s}`,color:"#333",padding:"10px 30px","text-align":"center",display:"none",margin:"10px 0 0 0",width:"350px",opacity:"1",cursor:"pointer"}),o.hover(function(){$(this).css({opacity:"1"})},function(){$(this).css({opacity:"0.3"})}),this.div.append(o);let a=setTimeout(function(){o.fadeTo(1e3,.3)},2500);o.fadeIn(500).mouseenter(()=>{clearTimeout(a),this.timer.pause()}).mouseleave(()=>{this.timer.resume()}).click(()=>{this.timer.dead(),o.fadeOut(0,function(){this.remove()})}),this.timer=new i(()=>{o.fadeOut(500,function(){this.remove()})},t)}}
class Noticer{constructor(){this.div=$('<div id="noticer"></div>'),this.div.css({position:"absolute",top:"10px",right:"20px","z-index":"1000"}),$("body").append(this.div)}success(e,t=6e3){this.print(e,t,"#52b818","#bffdc0")}warning(e,t=6e3){this.print(e,t,"#b8ae18","#f8fdbf")}error(e,t=6e3){this.print(e,t,"#b96161","#fddede")}print=function(e,t,n,s){t<6e3&&(t=6e3);let a=function(e,t){let n,s,o=t;this.pause=function(){clearTimeout(n),o-=new Date-s},this.resume=function(){s=new Date,clearTimeout(n),n=setTimeout(e,o)},this.dead=function(){clearTimeout(n)},this.resume()},o=$(`<div class="notice">${e}</div>`);o.css({border:`1px solid ${n}`,"background-color":`${s}`,color:"#333",padding:"10px 30px","text-align":"center",display:"none",margin:"10px 0 0 0",width:"350px",opacity:"1",cursor:"pointer"}),o.hover(function(){$(this).css({opacity:"1"})},function(){$(this).css({opacity:"0.3"})}),this.div.append(o);let r=setTimeout(function(){o.fadeTo(1e3,.3)},2500);o.fadeIn(500).mouseenter(()=>{clearTimeout(r),i.pause()}).mouseleave(()=>{i.resume()}).click(()=>{i.dead(),o.fadeOut(0,function(){this.remove()})});let i=new a(()=>{o.fadeOut(500,function(){this.remove()})},t)}}

18
test/index.html Normal file
View File

@ -0,0 +1,18 @@
<!DOCTYPE html>
<html>
<head>
<script src="https://code.jquery.com/jquery-3.7.0.min.js"></script>
<script src="../noticer.js"></script>
</head>
<body>
<button id="test">test</button>
<script>
noticer = new Noticer;
$('#test').click(() => {
noticer.success("This is success notice");
noticer.warning("This is warning notice");
noticer.error("This is error notice");
});
</script>
</body>
</html>