最近学习 Django,作为练手项目写了一个炉石查卡工具——Awesome Deck,后端源码已发布于 Github。
要实现的基本功能就是输入卡组代码,然后将卡组展示出来,效果:
(什么?想看我的卡组?here)
因为实际用到的 SQL 查询并不多,所以图省事没有使用 Django 的数据库中间件,而是使用了 Python 库 MySQLdb(Python3 上包的名字叫 mysqlclient)。基本功能已经实现,其他功能暂时就不想写了。。前端界面非常简洁(继续偷懒)。。bug 什么肯定是有的,把 Django 的 debug 选项关掉就行了。 !
食用方法
服务器端安装方法写在 Github 上了,这里写是 API 的食用指南。
- url:
https://deck.2heng.xin/embed/?name=xxx&code=xxx - 参数:
name: 卡组的名字,比如“奇数法”
code: 卡组代码,注意只要代码,# 号开头的行都删掉 - 举个栗子;
获取你的卡组代码:
之后就可以在 iframe 中引用了。注意引用在 iframe 里时请使用 https://deck.2heng.xin/embed/
接口,从主页获取到的 https://deck.2heng.xin/deck/
路径今后可能会加入菜单等功能,不宜在 iframe 里调用。
iframe 配置
API 返回的界面比例将始终维持在 9:5,并根据窗口宽度调整,所以务必保证你的 iframe 长宽比固定。下面是一个 jQuery 实现的响应式 iframe:
<iframe src="url"
width="100%"
frameborder="0"
scrolling="no"
class="hearthstone-deck">
</iframe>
<script>
if ( $( "iframe" ).hasClass( "hearthstone-deck" ) ) {
$(".hearthstone-deck").each(function () {
$(this).attr('height', $(this).width()*5/9+'px');
});
}
</script>
「樱花庄的白猫」原创文章:《在网页上展示你的炉石卡组吧》,转载请保留出处!https://2heng.xin/2018/12/12/embed-hearthstone-deck-with-iframe/
Q.E.D.
Comments | 28 条评论
博主 跑胡子下载
沙发,坐下
博主 沉
我不小心按了下F9,发现进去了一个似乎只有标题和歌词的页面,这个是什么页面?隐藏的吗?
博主 逐梦之人
瞧瞧我发现了什么
(=・ω・=)
博主 iii
大佬,膜拜…
博主 Yamakaze
白猫有没有兴趣试试我的快乐看脸盗牌贼,只要你够欧,吊打传说不是梦。而且,十分快乐,每次都是完全未知且快乐的打牌体验。
博主 Mashiro
@Yamakaze 再带一把幽灵弯刀是吗
博主 Yamakaze
@Mashiro 不带刀,不带刀,带刀算什么快乐,不回血,赌自己能活到后期,这才叫看脸欧气贼。
博主 983319770
(=・ω・=)
博主 ~~~~~
@983319770 (=・ω・=)
博主 夏和帆
来看看,很厉害的样子
(=・ω・=)
博主 シ御韩四十三
新人报道,炉石好久没玩了呢…以前喜欢玩无限火球法和冰法……….还有就是左下角的那个小人真好玩
博主 演员
来看看
博主 枫林霜叶
大家都喜欢玩这个游戏呀、、、还有你这个自动获取QQ信息的评论方式真棒!!!
博主 mikusa
二十级又多了一名新玩家
( ̄▽ ̄)
博主 Mashiro
@mikusa 喵??
博主 Lesun
这炫技,小白表示打扰了
博主 Mimi
哇哦~如此强大的力量!!
博主 无限麦茶
龙牧呀龙牧呀
博主 Mashiro
@无限麦茶 口袋银河+无限火球
(〜 ̄△ ̄)〜
博主 桜庭夜
竟然更新了
博主 Mashiro
@桜庭夜 坐下坐下
博主 蝉時雨
炉石搓不动搓不动 抱歉~
博主 Mashiro
@蝉時雨