Commit 77f6b328 authored by 神楽坂玲奈's avatar 神楽坂玲奈

image

parent 4cbc79c8
...@@ -12,9 +12,9 @@ class Card extends Spine.Model ...@@ -12,9 +12,9 @@ class Card extends Spine.Model
@url: "https://api.mongolab.com/api/1/databases/mycard/collections/cards?apiKey=508e5726e4b0c54ca4492ead" @url: "https://api.mongolab.com/api/1/databases/mycard/collections/cards?apiKey=508e5726e4b0c54ca4492ead"
@locale_url: "https://api.mongolab.com/api/1/databases/mycard/collections/lang_#{locale}?apiKey=508e5726e4b0c54ca4492ead" @locale_url: "https://api.mongolab.com/api/1/databases/mycard/collections/lang_#{locale}?apiKey=508e5726e4b0c54ca4492ead"
image_url: -> image_url: ->
"http://images.my-card.in/#{@id}.jpg" "http://my-card.in/images/cards/ygocore/#{@id}.jpg"
image_thumbnail_url: -> image_thumbnail_url: ->
"http://images.my-card.in/thumbnail/#{@id}.jpg" "http://my-card.in/images/cards/ygocore/thumbnail/#{@id}.jpg"
@fetch_by_name: (name, callback)-> @fetch_by_name: (name, callback)->
$.getJSON "#{@locale_url}&q=#{JSON.stringify {name: {$regex: name.replace(/([.?*+^$[\]\\(){}|-])/g, '\\$1'), $options: 'i'}}}", (langs) => $.getJSON "#{@locale_url}&q=#{JSON.stringify {name: {$regex: name.replace(/([.?*+^$[\]\\(){}|-])/g, '\\$1'), $options: 'i'}}}", (langs) =>
alert langs alert langs
......
...@@ -39,11 +39,11 @@ ...@@ -39,11 +39,11 @@
Card.locale_url = "https://api.mongolab.com/api/1/databases/mycard/collections/lang_" + locale + "?apiKey=508e5726e4b0c54ca4492ead"; Card.locale_url = "https://api.mongolab.com/api/1/databases/mycard/collections/lang_" + locale + "?apiKey=508e5726e4b0c54ca4492ead";
Card.prototype.image_url = function() { Card.prototype.image_url = function() {
return "http://images.my-card.in/" + this.id + ".jpg"; return "http://my-card.in/images/cards/ygocore/" + this.id + ".jpg";
}; };
Card.prototype.image_thumbnail_url = function() { Card.prototype.image_thumbnail_url = function() {
return "http://images.my-card.in/thumbnail/" + this.id + ".jpg"; return "http://my-card.in/images/cards/ygocore/thumbnail/" + this.id + ".jpg";
}; };
Card.fetch_by_name = function(name, callback) { Card.fetch_by_name = function(name, callback) {
......
...@@ -29,7 +29,7 @@ ...@@ -29,7 +29,7 @@
<script id="card_template" type="text/x-jquery-tmpl"> <script id="card_template" type="text/x-jquery-tmpl">
<div id="card_name" class="card_name">${name}</div> <div id="card_name" class="card_name">${name}</div>
<div class="card_img line floatleft"> <div class="card_img line floatleft">
<img id="card_image" height="187px" width="130px" src="http://images.my-card.in/${id}.jpg" alt="card_name"/> <img id="card_image" height="187px" width="130px" src="http://my-card.in/images/cards/ygocore/${id}.jpg" alt="card_name"/>
</div> </div>
<div class="card_info floatleft"> <div class="card_info floatleft">
<div id="card_card_type_title" class="attr_name floatleft">${$.i18n.prop('card_type')}</div> <div id="card_card_type_title" class="attr_name floatleft">${$.i18n.prop('card_type')}</div>
...@@ -205,7 +205,7 @@ ...@@ -205,7 +205,7 @@
<script id="search_card_graphic_template" type="text/x-jquery-tmpl"> <script id="search_card_graphic_template" type="text/x-jquery-tmpl">
<div> <div>
<div> <div>
<img src="http://images.my-card.in/thumbnail/2009101.jpg" width="44" height="64"/> <img src="http://my-card.in/images/cards/ygocore/thumbnail/2009101.jpg" width="44" height="64"/>
<span>黑羽-疾风之盖尔</span><br/> <span>黑羽-疾风之盖尔</span><br/>
<span></span> <span></span>
<span>鸟兽</span> <span>鸟兽</span>
...@@ -213,7 +213,7 @@ ...@@ -213,7 +213,7 @@
<span>1300</span>/<span>400</span> <span>1300</span>/<span>400</span>
</div> </div>
<div> <div>
<img src="http://images.my-card.in/thumbnail/2009101.jpg" width="44" height="64"/> <img src="http://my-card.in/images/cards/ygocore/thumbnail/2009101.jpg" width="44" height="64"/>
<span>黑羽-疾风之盖尔</span><br/> <span>黑羽-疾风之盖尔</span><br/>
<span></span> <span></span>
<span>鸟兽</span> <span>鸟兽</span>
......
card_type = 卡类 card_type = 卡类
type = 种族 type = 种族
attribute = 属性 attribute = 属性
atk = 攻击 atk = 攻击
def = 守备 def = 守备
level = 星阶 level = 星阶
type.Aqua = type.Aqua =
type.Beast = type.Beast =
type["Beast-Warrior"] = 兽战士 type["Beast-Warrior"] = 兽战士
type.Creator_God = 创造神 type.Creator_God = 创造神
type.Dinosaur = 恐龙 type.Dinosaur = 恐龙
type["Divine-Beast"] = 幻神兽 type["Divine-Beast"] = 幻神兽
type.Dragon = type.Dragon =
type.Fairy = 天使 type.Fairy = 天使
type.Fiend = 恶魔 type.Fiend = 恶魔
type.Fish = type.Fish =
type.Insect = 昆虫 type.Insect = 昆虫
type.Machine = 机械 type.Machine = 机械
type.Plant = 植物 type.Plant = 植物
type.Psychic = 念动力 type.Psychic = 念动力
type.Pyro = type.Pyro =
type.Reptile = 爬虫 type.Reptile = 爬虫
type.Rock = 岩石 type.Rock = 岩石
type["Sea_Serpent"] = 海龙 type["Sea_Serpent"] = 海龙
type.Spellcaster = 魔法使 type.Spellcaster = 魔法使
type.Thunder = type.Thunder =
type.Warrior = 战士 type.Warrior = 战士
type.Winged_Beast = 鸟兽 type.Winged_Beast = 鸟兽
type.Zombie = 不死 type.Zombie = 不死
attribute.DARK = attribute.DARK =
attribute.DIVINE = attribute.DIVINE =
attribute.EARTH = attribute.EARTH =
attribute.FIRE = attribute.FIRE =
attribute.LIGHT = attribute.LIGHT =
attribute.WATER = attribute.WATER =
attribute.WIND = attribute.WIND =
/* /*
http://www.rjboy.cn http://www.rjboy.cn
By sean at 2010.06 - 2011.03 By sean at 2010.06 - 2011.03
Demo: Demo:
$(".container").hScrollPane({ $(".container").hScrollPane({
mover:".press", //指定container对象下的哪个元素需要滚动位置 | 必传项; mover:".press", //指定container对象下的哪个元素需要滚动位置 | 必传项;
moverW:function(){return $(".press").width();}(), //传入水平滚动对象的长度值,不传入的话默认直接获取mover的宽度值 | 可选项; moverW:function(){return $(".press").width();}(), //传入水平滚动对象的长度值,不传入的话默认直接获取mover的宽度值 | 可选项;
handleMinWidth:300, //指定handle的最小宽度,要固定handle的宽度请在css中设定handle的width属性(如 width:28px!important;),不传入则不设定最小宽度 | 可选项; handleMinWidth:300, //指定handle的最小宽度,要固定handle的宽度请在css中设定handle的width属性(如 width:28px!important;),不传入则不设定最小宽度 | 可选项;
showArrow:true, //指定是否显示左右箭头,默认不显示 | 可选项; showArrow:true, //指定是否显示左右箭头,默认不显示 | 可选项;
dragable:false, //指定是否要支持拖动效果,默认可以拖动 | 可选项; dragable:false, //指定是否要支持拖动效果,默认可以拖动 | 可选项;
handleCssAlter:"draghandlealter", //指定拖动鼠标时滚动条的样式,不传入该参数则没有变化效果 | 可选项; handleCssAlter:"draghandlealter", //指定拖动鼠标时滚动条的样式,不传入该参数则没有变化效果 | 可选项;
easing:true, //滚动是否需要滑动效果,默认有滑动效果 | 可选项; easing:true, //滚动是否需要滑动效果,默认有滑动效果 | 可选项;
mousewheel:{bind:true,moveLength:500} //mousewheel: bind->'true',绑定mousewheel事件; ->'false',不绑定mousewheel事件;moveLength是指定鼠标滚动一次移动的距离,默认值:{bind:true,moveLength:300} | 可选项; mousewheel:{bind:true,moveLength:500} //mousewheel: bind->'true',绑定mousewheel事件; ->'false',不绑定mousewheel事件;moveLength是指定鼠标滚动一次移动的距离,默认值:{bind:true,moveLength:300} | 可选项;
}); });
*/ */
(function($){ (function($){
$.extend(jQuery.easing,{ $.extend(jQuery.easing,{
easeOutQuint: function (x, t, b, c, d) { easeOutQuint: function (x, t, b, c, d) {
return c*((t=t/d-1)*t*t*t*t + 1) + b; return c*((t=t/d-1)*t*t*t*t + 1) + b;
} }
}); });
$.fn.hScrollPane=function(settings){ $.fn.hScrollPane=function(settings){
settings=$.extend(true,{},$.fn.hScrollPane.defaults,settings); settings=$.extend(true,{},$.fn.hScrollPane.defaults,settings);
this.each(function(){ this.each(function(){
var container=$(this), var container=$(this),
mover=container.find(settings.mover), mover=container.find(settings.mover),
w=container.width(), w=container.width(),
c=settings.moverW || mover.width(), c=settings.moverW || mover.width(),
dragbar=(container.find(".hScrollPane_dragbar").length==0 && c>w ) ? container.append('<div class="hScrollPane_dragbar"><div class="hScrollPane_draghandle"></div></div>').find(".hScrollPane_dragbar") : container.find(".hScrollPane_dragbar"),//避免多次初始化时的重复append; dragbar=(container.find(".hScrollPane_dragbar").length==0 && c>w ) ? container.append('<div class="hScrollPane_dragbar"><div class="hScrollPane_draghandle"></div></div>').find(".hScrollPane_dragbar") : container.find(".hScrollPane_dragbar"),//避免多次初始化时的重复append;
handle=dragbar.find(".hScrollPane_draghandle"); handle=dragbar.find(".hScrollPane_draghandle");
if(settings.showArrow){ if(settings.showArrow){
container.append('<a href="###" class="hScrollPane_leftarrow"></a><a href="###" class="hScrollPane_rightarrow"></a>'); container.append('<a href="###" class="hScrollPane_leftarrow"></a><a href="###" class="hScrollPane_rightarrow"></a>');
leftArrow=container.find(".hScrollPane_leftarrow"); leftArrow=container.find(".hScrollPane_leftarrow");
rightArrow=container.find(".hScrollPane_rightarrow"); rightArrow=container.find(".hScrollPane_rightarrow");
dragbar.css({ dragbar.css({
width:container.width()-leftArrow.outerWidth()*2, width:container.width()-leftArrow.outerWidth()*2,
left:leftArrow.outerWidth() left:leftArrow.outerWidth()
}); });
leftArrow.unbind(); leftArrow.unbind();
rightArrow.unbind(); rightArrow.unbind();
}else{ }else{
dragbar.css("width",container.width()); dragbar.css("width",container.width());
} }
mover.stop().css("left","0px"); mover.stop().css("left","0px");
container.unbind();//避免多次初始化时的事件重复绑定; container.unbind();//避免多次初始化时的事件重复绑定;
handle.unbind(); handle.unbind();
dragbar.unbind(); dragbar.unbind();
handle.stop().css({ handle.stop().css({
width:(w/c)*w >settings.handleMinWidth ? (w/c)*w : settings.handleMinWidth, width:(w/c)*w >settings.handleMinWidth ? (w/c)*w : settings.handleMinWidth,
left:0 left:0
}); });
if(c<w){ if(c<w){
dragbar.hide(); dragbar.hide();
return false; return false;
}else{ }else{
dragbar.show(); dragbar.show();
} }
var maxlen=parseInt(dragbar.width())-parseInt(handle.outerWidth()); var maxlen=parseInt(dragbar.width())-parseInt(handle.outerWidth());
dragbar.bind("click",function(e){ dragbar.bind("click",function(e){
var flag=e.pageX>handle.offset().left+handle.outerWidth() ? -1 : 1; var flag=e.pageX>handle.offset().left+handle.outerWidth() ? -1 : 1;
$.fn.hScrollPane.move(settings,mover,handle,w,c,maxlen,flag); $.fn.hScrollPane.move(settings,mover,handle,w,c,maxlen,flag);
}); });
handle.bind("mousedown",function(e){ handle.bind("mousedown",function(e){
var x=e.pageX; var x=e.pageX;
var hx=parseInt(handle.css("left")); var hx=parseInt(handle.css("left"));
if(settings.handleCssAlter){$(this).addClass(settings.handleCssAlter);} if(settings.handleCssAlter){$(this).addClass(settings.handleCssAlter);}
$(document).bind("mousemove",function(e){ $(document).bind("mousemove",function(e){
var left=e.pageX-x+hx<0?0:(e.pageX-x+hx>=maxlen?maxlen:e.pageX-x+hx); var left=e.pageX-x+hx<0?0:(e.pageX-x+hx>=maxlen?maxlen:e.pageX-x+hx);
handle.stop().css({left:left}); handle.stop().css({left:left});
if(settings.easing){ if(settings.easing){
mover.stop().animate({ mover.stop().animate({
left:-left/maxlen*(c-w) left:-left/maxlen*(c-w)
},{duration:1500,easing:'easeOutQuint',queue:false}); },{duration:1500,easing:'easeOutQuint',queue:false});
}else{ }else{
mover.css({left:-left/maxlen*(c-w)}); mover.css({left:-left/maxlen*(c-w)});
} }
return false; return false;
}); });
$(document).bind("mouseup",function(){ $(document).bind("mouseup",function(){
if(settings.handleCssAlter){handle.removeClass(settings.handleCssAlter);} if(settings.handleCssAlter){handle.removeClass(settings.handleCssAlter);}
$(this).unbind("mousemove"); $(this).unbind("mousemove");
}) })
return false; return false;
}).click(function(){ }).click(function(){
return false; return false;
}) })
if(settings.dragable){ if(settings.dragable){
mover.bind("mousedown",function(e){ mover.bind("mousedown",function(e){
var x=e.pageX; var x=e.pageX;
$(this).bind("mousemove",function(e){ $(this).bind("mousemove",function(e){
$.fn.hScrollPane.move(settings,mover,handle,w,c,maxlen,x,e.pageX); $.fn.hScrollPane.move(settings,mover,handle,w,c,maxlen,x,e.pageX);
return false; return false;
}) })
$(document).bind("mouseup",function(){ $(document).bind("mouseup",function(){
mover.unbind("mousemove"); mover.unbind("mousemove");
}) })
}) })
} }
if(settings.mousewheel.bind){ if(settings.mousewheel.bind){
container.bind("mousewheel",function(event, delta){ container.bind("mousewheel",function(event, delta){
$.fn.hScrollPane.move(settings,mover,handle,w,c,maxlen,delta); $.fn.hScrollPane.move(settings,mover,handle,w,c,maxlen,delta);
return false; return false;
}); });
} }
if(settings.showArrow){ if(settings.showArrow){
leftArrow.click(function(){ leftArrow.click(function(){
$.fn.hScrollPane.move(settings,mover,handle,w,c,maxlen,1); $.fn.hScrollPane.move(settings,mover,handle,w,c,maxlen,1);
return false; return false;
}).focus(function(){this.blur();}); }).focus(function(){this.blur();});
rightArrow.click(function(){ rightArrow.click(function(){
$.fn.hScrollPane.move(settings,mover,handle,w,c,maxlen,-1); $.fn.hScrollPane.move(settings,mover,handle,w,c,maxlen,-1);
return false; return false;
}).focus(function(){this.blur();}); }).focus(function(){this.blur();});
} }
this.ondragstart=function(){return false;} this.ondragstart=function(){return false;}
this.onselectstart=function(){return false;} this.onselectstart=function(){return false;}
}) })
} }
$.fn.hScrollPane.defaults = { $.fn.hScrollPane.defaults = {
showArrow:false, showArrow:false,
handleMinWidth:0, handleMinWidth:0,
dragable:true, dragable:true,
easing:true, easing:true,
mousewheel:{bind:true,moveLength:300} mousewheel:{bind:true,moveLength:300}
}; };
$.fn.hScrollPane.move=function(settings,mover,handle,w,c,maxlen,x,nx){ $.fn.hScrollPane.move=function(settings,mover,handle,w,c,maxlen,x,nx){
if(arguments.length==7){ if(arguments.length==7){
var left=parseInt(mover.css("left"))+x*settings.mousewheel.moveLength; var left=parseInt(mover.css("left"))+x*settings.mousewheel.moveLength;
}else{ }else{
var left=parseInt(mover.css("left"))+((nx-x)/w)*(c-w); var left=parseInt(mover.css("left"))+((nx-x)/w)*(c-w);
} }
left=left.toFixed(0); left=left.toFixed(0);
left=left>0?0:left<w-c?w-c:left; left=left>0?0:left<w-c?w-c:left;
var handle_left=(left/(w-c))*maxlen; var handle_left=(left/(w-c))*maxlen;
if(settings.easing){ if(settings.easing){
mover.stop().animate({ mover.stop().animate({
left:left left:left
},{duration:1500,easing:'easeOutQuint',queue:false}); },{duration:1500,easing:'easeOutQuint',queue:false});
handle.stop().animate({ handle.stop().animate({
left:handle_left left:handle_left
},{duration:1500,easing:'easeOutQuint',queue:false}); },{duration:1500,easing:'easeOutQuint',queue:false});
}else{ }else{
mover.stop().animate({ mover.stop().animate({
left:left left:left
},{duration:5,queue:false}); },{duration:5,queue:false});
handle.css({left:handle_left}); handle.css({left:handle_left});
} }
} }
})(jQuery); })(jQuery);
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment