Update notify version to 1.2.

This commit is contained in:
Kenshin 2017-01-02 18:40:17 +08:00
parent 3d4a515489
commit 382c9b4b76
2 changed files with 32 additions and 31 deletions

View File

@ -3,16 +3,14 @@
* Notify Group
*/
.ks-notify-gp {
display: -webkit-flex;
flex-flow: column nowrap;
position: fixed;
top: 0;
right: 0;
height: 100%;
/*width: 400px;*/
display: -webkit-box;
-webkit-box-align: end;
-webkit-box-orient: vertical;
-webkit-box-pack: start;
/*height: 100%;
width: 400px;*/
margin: 15px;
@ -30,17 +28,15 @@
* Notify item
*/
.ks-notify-gp .notify {
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-box-pack: start;
-webkit-box-align: start;
display: -webkit-flex;
flex-flow: column nowrap;
background: #555;
-webkit-border-radius: 5px;
padding: 10px;
margin-bottom: 10px;
min-width: 100px;
min-width: 250px;
max-width: 400px;
opacity: .9;
@ -48,7 +44,8 @@
pointer-events: auto;
}
.ks-notify-gp .notify notify-div {
.ks-notify-gp notify-title,
.ks-notify-gp notify-content {
padding: 3px;
}
@ -56,19 +53,20 @@
color: #fff;
}
.ks-notify-gp .notify .close {
.ks-notify-gp .notify notify-a {
position: absolute;
right: 10px;
cursor: pointer;
}
.ks-notify-gp .notify .close notify-span {
.ks-notify-gp .notify notify-a notify-span {
display: block;
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAMAAAAoLQ9TAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAABpFBMVEUAAADl5eXj4+NSVFRTVVVaXFxLTU1hY2NdX18pLCwhJCSdnp5sbm6HiYmjpKSDhYX///+rrKytrq6XmJgzNTUoKyt3eXlydHRlZ2dbXV1ucHB4enrv7++KjIyIiort7e1oamosLy8aHR0VGBgUFxcbHh4rLi5oamprbGwgIyMKDQ0KDQ0iJSVjZWWfoaEkJiYICwsLDg4KDQ0MDw8iJSWMjo41ODgMDw8JDAw2OTkvMTELDg4LDg4xMzM1NzcJDAwLDg40NjYeISEHCgoeISFkZmYtLy8yNDRvcXEWGRkHCgoaHR3///8RFBQHCgohJCShoqLIyMgaHR0HCgoZGxv4+PgRFBQLDg4xMzOWl5eam5ssLi4bHh7///8fIiIJDAwwMzNzdHQXGhoeISFlZmYsLi4KDQ0gIiI6PDwOEREuMDAXGhoHCgodHx8pLCwNEBA1ODj///8nKSkICwsICwsJDAwnKSnZ2dl9fn4pKysNDw8OEREpLCxyc3ORkpIzNTUjJSUVGBgUFxcgIyM5PDyanJwEBwcDBwcDBgYFCAgGCQn///+5RDDmAAAAhnRSTlMAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAQUFAQU+i7S0jkAGEYrw8Y8SBIn++Pr3jQQ67fx8dvX6iWr27z+B/YsOcoMPdPiEAaL7iAgEcfWsA6D7iAkGcawDef2LDnOFD3T4gTLnfHb6iWrqNQJ4+ff7fQILd+ToewsCLHWZmXUwAyFsKwcAAAABYktHRBCVsg0sAAAAzElEQVQY02NgwAoYZWTl5JngXGYFRSVlFVU1dRYIn1VDU6sNCLR1dNlAfHY9fQNDw/YOI2MDE1MOoACnmbmFpZW1ja2dvYMjFwMDN4NTp7OLq5u7h6dXpzcDDwOvj29bm59/QGBQcFtbSCgfA79AWFtHeERkVLR1W1tMrCCDEENcZ3xCYlJySmpaZzqDMAODSEamRVZ2cE5unn1+gSjQFrHCIqNir7a2nJLSsnJxkEMkKiqrutrauqpraiUhTpWqq29obGpuaZVmIAYAAO06McffKEk8AAAAJXRFWHRkYXRlOmNyZWF0ZQAyMDEzLTA0LTAzVDE3OjE4OjAzKzA4OjAwRdgB9wAAACV0RVh0ZGF0ZTptb2RpZnkAMjAxMS0wNS0xOFQyMDowMTowMCswODowMB0r3XkAAABNdEVYdHNvZnR3YXJlAEltYWdlTWFnaWNrIDYuOC44LTcgUTE2IHg4Nl82NCAyMDE0LTAyLTI4IGh0dHA6Ly93d3cuaW1hZ2VtYWdpY2sub3JnWaRffwAAABh0RVh0VGh1bWI6OkRvY3VtZW50OjpQYWdlcwAxp/+7LwAAABh0RVh0VGh1bWI6OkltYWdlOjpIZWlnaHQAMTI4Q3xBgAAAABd0RVh0VGh1bWI6OkltYWdlOjpXaWR0aAAxMjjQjRHdAAAAGXRFWHRUaHVtYjo6TWltZXR5cGUAaW1hZ2UvcG5nP7JWTgAAABd0RVh0VGh1bWI6Ok1UaW1lADEzMDU3MjAwNjArP9HVAAAAE3RFWHRUaHVtYjo6U2l6ZQAxLjAzS0JCZtQvXwAAAFx0RVh0VGh1bWI6OlVSSQBmaWxlOi8vL2hvbWUvZnRwLzE1MjAvZWFzeWljb24uY24vZWFzeWljb24uY24vY2RuLWltZy5lYXN5aWNvbi5jbi9wbmcvMTcvMTc4Ni5wbmcRsze7AAAAAElFTkSuQmCC);
width: 16px;
height: 16px;
}
.ks-notify-gp .notify .title {
.ks-notify-gp .notify notify-title {
font-weight: bolder;
font-size: 13px;
}
}

View File

@ -47,12 +47,20 @@ var Notify = ( function () {
$container,
TMPL = '\
<notify-div class="notify">\
<notify-a href="#" class="close"><notify-span></notify-span></notify-a>\
<notify-div class="title">SimpTab has update.</notify-div>\
<notify-div class="content">New version changlog here.</notify-div>\
<notify-a href="#"><notify-span></notify-span></notify-a>\
<notify-title>SimpTab has update.</notify-title>\
<notify-content>New version changlog here.</notify-content>\
</notify-div>',
prefix = function( value ) {
return name + "-" + value;
},
registyElement = function( name, elements ) {
elements.forEach( function( item ) {
document.createElement( prefix( item ));
});
},
closeHandle = function( event ) {
$container.undelegate( "." + event.data + " .close", "click", closeHandle );
$container.undelegate( "." + event.data + " notify-a", "click", closeHandle );
hidden( $(this).parent() );
},
delay = function( item ) {
@ -68,15 +76,15 @@ var Notify = ( function () {
},
render = function() {
var $tmpl = $( TMPL ),
$title = $tmpl.find(".title"),
$content = $tmpl.find(".content"),
$close = $tmpl.find(".close"),
$title = $tmpl.find(prefix( "title" )),
$content = $tmpl.find(prefix( "content" )),
$close = $tmpl.find(prefix( "a" )),
item = "notify-item-" + num++;
this.title ? $title.text( this.title ) : $title.hide();
this.content ? $content.html( this.content ) : $content.hide();
if ( this.closed ) {
$container.delegate( "." + item + " .close", "click", item, closeHandle );
$container.delegate( "." + item + " notify-a", "click", item, closeHandle );
}
else {
$close.hide();
@ -85,15 +93,10 @@ var Notify = ( function () {
$tmpl.addClass( item );
$container.append( $tmpl ).css( "z-index", 2147483647 );
},
registyElement = function( name, elements ) {
elements.forEach( function( item ) {
document.createElement( name + '-' + item );
});
};
function Notify() {
registyElement( name, [ "div", "a", "span" ] );
registyElement( name, [ "div", "a", "span", "title", "content" ] );
if ( $( "body" ).find ( rootcls ).length == 0 ) {
$( "body" ).append( roottmpl );
$container = $( rootcls );