tips.js 1.72 KB
/******************
* call $.Tips({title: '一条新消息需要处理', link:'http://baidu.com'});
******************/

(function($){
	"use strict";
	var settings;
	$.Tips = function (opt) {
		settings = {
			title : '',
			content: '',
			type : 'info',
			link:'',
			time : 5000,
			remove:true
		};
		settings = $.extend({}, settings, opt);
		var elem = this,
			tips = new Tips(elem);
		tips.init();
		return tips;
	};
	function Tips(el){
		this.el = el;
		this.title = settings.title;
		this.content = settings.content;
		this.type = ' alert-'+settings.type;
		this.time = settings.time;
		this.link = settings.link;
		this.remove = settings.remove;
	}
	Tips.prototype = {
		timer: null,
		init: function(){
			var that = this;
			$('.ui-alert').remove();
			var tmpl = $('<div class="ui-alert'+this.type+'"><button type="button" class="close" data-dismiss="alert">×</button><p>'+this.title+'</p><a href="'+ this.link +'" target="_blank">查看</a></div>');
			$('body').append(tmpl);
			this.box = tmpl;
			this.box.on('click','.close', function(){
				that.hide();
			});

			this.box.on('transitionend', function(){
				if(that.isOpen){
					return;
				}
				that.remove && that.box.remove();
			});
		},
		show: function(){
			var that = this;
			this.isOpen = true;
			setTimeout(function(){
				that.box.addClass('fn-show');
			}, 50);
			
			clearTimeout(this.timer);
			this.timer = setTimeout(function(){
				that.hide();
			}, this.time);
			return this;
		},
		hide: function(){
			this.isOpen = false;
			this.box.removeClass('fn-show');
			return this;
		},
		setTitle:function(html){
			this.box.find('h4').html(html);
			return this;
		},
		setContent:function(html){
			this.box.find('p').html(html);
			return this;
		}
	};
})(jQuery);