사용자:Utolee90/Secretary.js 문서 원본 보기

/*
사용자:다메즈마님의 기본 코드를 바탕으로한 스크립트 사용자:Skim/Secretary.js를 바탕으로 사용자:Utolee90이 재조합했습니다.

코드의 기능을 하나하나 설명할려고 합니다.
*/

function randomRange(n1, n2) {
  return Math.round(Math.random()  * 10000) % (n2 - n1) + n1;
} //새로고침 할 때마다 비서의 모습을 바꿉니다.

function Mascot()
{
	this.is_loaded = false;
	this.is_show = false;
	this.mascot_img_list = [];
	this.message_queue =  [];
	this.now_balloon = null;
	this.is_small = true;
} //마스코트 함수. 
/*
*/

Mascot.prototype.AddImage = function(img)
{
	this.mascot_img_list.push(img);
}; //마스코트 이미지 객체 지정

Mascot.prototype._show_balloon = function()
{
	this.now_balloon = document.createElement("div");
	$(this.now_balloon).css("position","fixed");
	$(this.now_balloon).css("display","none");
	$(this.now_balloon).html(this.message_queue[0]);
	$(this.now_balloon).css("background-color","#000");
	$(this.now_balloon).css("color","#FFF");
	$(this.now_balloon).css("max-width","225px");
	$(this.now_balloon).css("padding","16px");
	$(this.now_balloon).css("z-index","1000");
	$(document.body).append(this.now_balloon);
 
	$(this.now_balloon).css("bottom",$(this.mascot_img_html).height()/2 +16 - $(this.now_balloon).height()/2 + 32);
 
	$(this.now_balloon).css("right",$(this.mascot_img_html).width() + 32);
	$(this.now_balloon).css("border-radius",5);
	$(this.now_balloon).fadeIn(1000);
	this.message_queue.shift();
	this.now_balloon.obj = this;
	$(this.now_balloon).click
	(
	function()
	{
		var obj = this.obj;
		$(obj.now_balloon).fadeOut(1000).delay(1000,function(){$(this).remove();});
		obj.now_balloon = null;
		if(obj.message_queue.length !== 0)
		{
			obj._show_balloon();
		}
	}
	);
}; //마스코트의 코멘트를 만드는 함수

Mascot.prototype.Show = function()
{
	if(this.is_show) return;
	this.is_show = true;
	var select = this.mascot_img_list[randomRange(0,this.mascot_img_list.length)];
	var wrap_div = document.createElement("div");
	this.mascot_img_html = document.createElement("img");
	this.mascot_img_html.obj = this;
	if(localStorage.getItem("custom_dmns_is_small") == "true")
	{
		this.ToSmall();
	}
	else
	{
		this.ToBig();
	}
	this.mascot_img_html.onload = function()
	{
		var obj = this.obj;
		if(localStorage.getItem("custom_dmns_is_small") == "true")
		{
			obj.ToSmall();
		}
		else
		{
			obj.ToBig();
		}
		if(obj.message_queue.length !== 0)
		{
			obj._show_balloon();
		}
		$(".top_s_btn").css("display","none");
		$("#to-top-btn").css("width",$(this).width()/2);
		$("#to-bottom-btn").css("width",$(this).width()/2);
		obj.is_loaded = true;
	};
	$(this.mascot_img_html).click(
	function()
	{
		if(this.obj.is_small === false)
		{
			this.obj.ToSmall();
		}
		else
		{
			this.obj.ToBig();
		}
	});
 
	this.mascot_img_html.src = select;
 
	$(this.mascot_img_html).css("display","block");
	$(wrap_div).css("position","fixed");
	$(wrap_div).css("right","16px");
	$(wrap_div).css("bottom","16px");
	$(wrap_div).css("z-index","1000");
	$(wrap_div).append(this.mascot_img_html);
	$(wrap_div).append("<ul style='list-style:none;padding: 0px;margin:0px;display:inline;'><li style='float:left;'><a id='to-top-btn' href='#' style='text-align:center;display:inline-block;line-height:32px;width:100%;background-color:#000;color:#FFF;font-weight:bold;'>위로</a></li><li style='float:left;'><a id='to-bottom-btn' href='#' style='text-align:center;display:inline-block;line-height:32px;width:100%;background-color:#000;color:#FFF;font-weight:bold;'>아래로</a></li></ul>");
	$(document.body).append(wrap_div);
	$("#to-top-btn").click(
	function()
	{$('html, body').animate({scrollTop:0}, 'slow');}
	);

	$("#to-bottom-btn").click(
	function()
	{$('html, body').animate({scrollTop:document.body.scrollHeight}, 'slow');}
	);
};

Mascot.prototype.ShowMessage = function(msg)
{
	this.message_queue.push(msg);
 
	if(this.is_show === false)
	{
		this.Show();
	}
	else{
		this.CloseMessage();
	}
 
	if(this.now_balloon === null && this.is_loaded === true)
	{
		this._show_balloon();
	}
};

Mascot.prototype.CloseMessage = function()
{
	$(this.now_balloon).fadeOut(1000).delay(1000,function(){$(this).remove();});
	this.now_balloon = null;
	if(this.message_queue.length !== 0)
	{
		this._show_balloon();
	}
};

Mascot.prototype.ToSmall = function()
{
	$(this.mascot_img_html).css("width",80);
	if(this.now_balloon !== null)
	{
		$(this.now_balloon).css("bottom",$(this.mascot_img_html).height()/2 +16 - $(this.now_balloon).height()/2 + 32);
		$(this.now_balloon).css("right",$(this.mascot_img_html).width() + 32);
	}
	$("#to-top-btn").css("width",$(this.mascot_img_html).width()/2);
	$("#to-bottom-btn").css("width",$(this.mascot_img_html).width()/2);
	this.is_small = true;
	localStorage.setItem("custom_dmns_is_small",true);
};

Mascot.prototype.ToBig = function()
{
	$(this.mascot_img_html).css("width",160);
	if(this.now_balloon !== null)
	{
		$(this.now_balloon).css("bottom",$(this.mascot_img_html).height()/2 +16 - $(this.now_balloon).height()/2 + 32);
		$(this.now_balloon).css("right",$(this.mascot_img_html).width() + 32);
	}
	$("#to-top-btn").css("width",$(this.mascot_img_html).width()/2);
	$("#to-bottom-btn").css("width",$(this.mascot_img_html).width()/2);
	this.is_small = false;
	localStorage.setItem("custom_dmns_is_small",false);
};

var mascot = new Mascot();

$(document).ready(function(){

var secretary1 = "http://openclipart.org/download/232741/1448191395.svg"; // 비서의 이미지1,기본 얼굴
var secretary2 = "http://openclipart.org/download/183961/Silly-Face.svg"; //비서의 이미지2, 메롱 얼굴.
var secretary3 = "http://openclipart.org/download/202341/Happy-Face.svg"; //비서의 이미지3, 웃는 얼굴

var comment1 = 
[
"안녕들 하신지",
"어휴... 피곤해...",
"다들 잘 있지?"
]; //비서1의 코멘트들
 
var comment2 =
[
"뭬~롱",
"너 힘들지 않니???",
"너도 한번 외쳐봐!"
]; //비서 2의 코멘트

var comment3 =
[
"웃으면 복이 와요.",
"하하하 오늘도 좋은 날이죠?",
"얼굴 찡그리지 말죠?",
]; //비서3의 코멘트

var secretaries = [secretary1, secretary2, secretary3]; //비서 목록-비서 숫자만큼 나열하세요.
var comments = [comment1, comment2, comment3]; //코멘트 목록 - 역시 코멘트 숫자만큼 나열하세요.
var index = randomRange(0,secretaries.length);

mascot.AddImage(secretaries[index]);
mascot.ShowMessage(comments[index][randomRange(0,comments[index].length)]);

var temp = function(){
	var param = 
	{
		"action":"query",
		"meta":"notifications",
		"notlimit":10,
		"format":"json"
	};
	$.ajax("/api.php",
	{
		data:param,
		dataType:"json"
	})
	.done(function(res)
	{
		var list_o = res.query.notifications.list;
		var list = [];
		for(var key in list_o)
		{
			list.push(list_o[key]);
		}
		var unread_message = [];
		for(var i = 0 ; i < list.length ; i++)
		{
			if(list[i].read === null && list[i].type != "page-linked")
			{
				unread_message.push(list[i]);
			}
		} //새로운 메시지가 없을 때는 코멘트 없음.
		if(unread_message.length !== 0)
		{
			if(index === 0)
			{
			mascot.ShowMessage("<a style='color:#FFF;' href='/wiki/"+ encodeURIComponent(unread_message[unread_message.length - 1].title.full)  + "'>메시지~ 왔어요!</a>");
			} //메시지가 왔을 때 마스코트1이 내뱉는 코멘트. 덤으로 클릭하면 메시지 링크로 연결된다.

			if(index == 1)
			{
			mascot.ShowMessage("<a style='color:#FFF;' href='/wiki/"+ encodeURIComponent(unread_message[unread_message.length - 1].title.full)  + "'>어랏! 네 메시지 확인해봐! </a>");
			} //메시지가 왔을 때 마스코트2가 내뱉는 코멘트

			if(index == 2)
			{
			mascot.ShowMessage("<a style='color:#FFF;' href='/wiki/"+ encodeURIComponent(unread_message[unread_message.length - 1].title.full)  + "'>좋은 소식이에요. 메시지 확인하세요.</a>");
			}

		
		}
	});
};
temp();
setInterval(temp,1000 * 20);
}
});