|
태그: 문서를 비웠습니다. 문서 옮기기는 도구-옮기기를 이용하세요. |
| 1번째 줄: |
1번째 줄: |
| /*
| | |
| 마스코트 클래스 및 그 객체를 생성한다. 객체의 이름은 mascot.
| |
| */
| |
| function randomRange(n1, n2) {
| |
| return Math.round( Math.random() * 10000) % (n2 - n1) + n1;
| |
| }
| |
| function BookmarkStorage()
| |
| {
| |
|
| |
| }
| |
| BookmarkStorage.prototype.AddBookmark = function(name, url)
| |
| {
| |
| var pre = localStorage.getItem("hisyokan-bookmark-key");
| |
| var keys = name + ";";
| |
| if(pre != null){
| |
| keys = name + ";" + pre;
| |
| }
| |
| localStorage.setItem("hisyokan-bookmark-key",keys);
| |
| localStorage.setItem("bookmark-" + name,url);
| |
| };
| |
| BookmarkStorage.prototype.GetList = function()
| |
| {
| |
| var keys = localStorage.getItem("hisyokan-bookmark-key").split(";");
| |
| var res_list = [];
| |
|
| |
| for(var i = 0 ; i < keys.length ; i++)
| |
| {
| |
| if(keys[i].length == 0)
| |
| {
| |
| continue;
| |
| }
| |
| res_list.push(
| |
| {
| |
| name:keys[i],
| |
| link:localStorage.getItem("bookmark-" + keys[i])
| |
| }
| |
| );
| |
| }
| |
| return res_list;
| |
| };
| |
| function GetHtmlList(list){
| |
| list_el = document.createElement("ul");
| |
| $(list_el).css({
| |
| "list-style":"none",
| |
| "padding":0,
| |
| "margin":0
| |
| });
| |
| for(var i = 0 ; i < list.length ; i++){
| |
| var li = document.createElement("li");
| |
| var a = document.createElement("a");
| |
| a.href = list[i].link;
| |
| $(a).attr("href",list[i].link);
| |
| $(a).html(list[i].name);
| |
| $(li).html(a);
| |
| $(list_el).append(li);
| |
| }
| |
| return list_el;
| |
| }
| |
| function Mascot()
| |
| {
| |
| this.is_loaded = false;
| |
| this.is_show = false;
| |
| this.mascot_img_list = [];
| |
| this.message_queue = [];
| |
| this.now_balloon = null;
| |
| this.is_small = false;
| |
| }
| |
| 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");
| |
| $(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);
| |
| $("#hisyokan-bookmark").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).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='hisyokan-bookmark' 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);
| |
| document.getElementById("hisyokan-bookmark").obj = this;
| |
| $("#hisyokan-bookmark").click(
| |
| function()
| |
| {
| |
| var menu_list_h = document.createElement("ul");
| |
| $(menu_list_h).css("list-style","none");
| |
| $(menu_list_h).css("margin",0);
| |
| $(menu_list_h).css("padding",0);
| |
|
| |
| var li = document.createElement("li");
| |
| var a_tag = document.createElement("a");
| |
| a_tag.href = "#";
| |
| a_tag.obj = this.obj;
| |
| $(a_tag).css("display","inline-block");
| |
| $(a_tag).css("line-height","16px");
| |
| $(a_tag).css("padding","2px");
| |
| $(a_tag).css("color","#FFF");
| |
| $(a_tag).html("이 페이지 등록");
| |
| $(a_tag).click(
| |
| function()
| |
| {
| |
| var link = document.location.href;
| |
| var name = document.title;
| |
| name = name.replace(" - 리브레 위키","");
| |
| var bookmark = new BookmarkStorage();
| |
| bookmark.AddBookmark(name,link);
| |
| this.obj.CloseMessage();
| |
| this.obj.ShowMessage("등록되었습니다");
| |
| return false;
| |
| }
| |
| );
| |
| $(li).html(a_tag);
| |
| $(menu_list_h).append(li);
| |
|
| |
| li = document.createElement("li");
| |
| a_tag = document.createElement("a");
| |
| a_tag.href = "#";
| |
| a_tag.obj = this.obj;
| |
| $(a_tag).css("display","inline-block");
| |
| $(a_tag).css("line-height","16px");
| |
| $(a_tag).css("padding","2px");
| |
| $(a_tag).css("color","#FFF");
| |
| $(a_tag).html("북마크 리스트");
| |
| $(a_tag).click(
| |
| function()
| |
| {
| |
| var bookmark = new BookmarkStorage();
| |
| this.obj.ShowMessage(GetHtmlList(bookmark.GetList()));
| |
| return false;
| |
| }
| |
| );
| |
| $(li).html(a_tag);
| |
| $(menu_list_h).append(li);
| |
| this.obj.CloseMessage();
| |
| this.obj.ShowMessage(menu_list_h);
| |
| return false;
| |
| }
| |
| );
| |
| };
| |
| 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",96);
| |
| 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);
| |
| $("#hisyokan-bookmark").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",256);
| |
| 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);
| |
| $("#hisyokan-bookmark").css("width",$(this.mascot_img_html).width()/2);
| |
|
| |
| this.is_small = false;
| |
| localStorage.setItem("custom_dmns_is_small",false);
| |
| }
| |
| var mascot = new Mascot();
| |