[转]逆天的俄罗斯方块,只需要60行代码

知乎上看到这个逆天的代码,感觉我不会写js.

https://www.zhihu.com/question/44213758/answer/97448141?group_id=708529590292713472

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=GBK">
</head>
<body>
    <div id="box" style="width:252px;font:25px/25px 宋体;background:#000;color:#9f9;text-shadow:2px 3px 1px #0f0;"></div>
    <script>
    var map = eval("[" + Array(23).join("0x801,") + "0xfff]");
    var tatris = [
        [0x6600],
        [0x2222, 0xf00],
        [0xc600, 0x2640],
        [0x6c00, 0x4620],
        [0x4460, 0x2e0, 0x6220, 0x740],
        [0x2260, 0xe20, 0x6440, 0x4700],
        [0x2620, 0x720, 0x2320, 0x2700]
    ];
    var keycom = {
        "38": "rotate(1)",
        "40": "down()",
        "37": "move(2,1)",
        "39": "move(0.5,-1)"
    };
    var dia, pos, bak, run;

    function start() {
        dia = tatris[~~(Math.random() * 7)];
        bak = pos = {
            fk: [],
            y: 0,
            x: 4,
            s: ~~(Math.random() * 4)
        };
        rotate(0);
    }

    function over() {
        document.onkeydown = null;
        clearInterval(run);
        alert("GAME OVER");
    }

    function update(t) {
        bak = {
            fk: pos.fk.slice(0),
            y: pos.y,
            x: pos.x,
            s: pos.s
        };
        if (t) return;
        for (var i = 0, a2 = ""; i < 22; i++)
            a2 += map[i].toString(2).slice(1, -1) + "<br/>";
        for (var i = 0, n; i < 4; i++)
            if (/([^0]+)/.test(bak.fk[i].toString(2).replace(/1/g, "\u25a1")))
                a2 = a2.substr(0, n = (bak.y + i + 1) * 15 - RegExp.$_.length - 4) + RegExp.$1 + a2.slice(n + RegExp.$1.length);
        document.getElementById("box").innerHTML = a2.replace(/1/g, "\u25a0").replace(/0/g, "\u3000");
    }

    function is() {
        for (var i = 0; i < 4; i++)
            if ((pos.fk[i] & map[pos.y + i]) != 0) return pos = bak;
    }

    function rotate(r) {
        var f = dia[pos.s = (pos.s + r) % dia.length];
        for (var i = 0; i < 4; i++)
            pos.fk[i] = (f >> (12 - i * 4) & 15) << pos.x;
        update(is());
    }

    function down() {
        ++pos.y;
        if (is()) {
            for (var i = 0; i < 4 && pos.y + i < 22; i++)
                if ((map[pos.y + i] |= pos.fk[i]) == 0xfff)
                    map.splice(pos.y + i, 1), map.unshift(0x801);
            if (map[1] != 0x801) return over();
            start();
        }
        update();
    }

    function move(t, k) {
        pos.x += k;
        for (var i = 0; i < 4; i++)
            pos.fk[i] *= t;
        update(is());
    }
    document.onkeydown = function(e) {
        eval(keycom[(e ? e : event).keyCode]);
    };
    start();
    run = setInterval("down()", 400);
    </script>
</body>
</html>

时间: 2024-10-27 06:39:39

[转]逆天的俄罗斯方块,只需要60行代码的相关文章

GameBuilder开发游戏应用系列之60行代码实现FlappyBird

在线演示:http://osgames.duapp.com/apprun.html?appid=osgames1-911422256817006 在线编辑:http://osgames.duapp.com/gamebuilder.php?appid=osgames1-911422256817006 微信扫描: 运行截图: FlappyBird是2014年爆红的一款游戏,属于经典的重力感应游戏,玩法非常简单同时又非常虐心,正是这样的特点让FlappyBird得以在社交网络病毒式的传播. GameB

60行代码:Javascript 写的俄罗斯方块游戏

先看效果图: 游戏结束图: javascript实现源码: <!doctype html> <html><head><title>俄罗斯方块</title> <meta name="Description" content="俄罗斯方块Javascript实现"> <meta name="Keywords" content="俄罗斯方块,Javascript,

【分享】60行代码:Javascript 写的俄罗斯方块游戏

效果如下,可测试: javascript实现源码: <!doctype html> <html><head><title>俄罗斯方块</title> <meta name="Description" content="俄罗斯方块Javascript实现"> <meta name="Keywords" content="俄罗斯方块,Javascript,实现,短

TangIDE游戏开发之60行代码实现打地鼠

对于没有接触过html的朋友,要实现一个最简单的html5打地鼠游戏,也是不知道从何下手的.就算是html高手,没有上千行代码,也完不成一个像样的打地鼠游戏. 网上找到一个开源的打地鼠游戏(参见下载地址),粗略看了一下代码,代码行数1000+. 今天我要介绍的打地鼠游戏,主要逻辑代码,也就60多行,所有的代码加起来也就100多行,是为某客户定制的一款比较完整的商业游戏,大部分的功能也就只是一下午的时间就能完成. 先看一下实际的成果: PC点击这里玩 手机下方扫描二维码玩 如果你想在本游戏上进行改

HTML5游戏实战(3): 60行代码实现水平跑酷游戏

跑酷游戏无疑是目前最受欢迎的游戏类型之一,3D跑酷游戏可能比较难做一点(这个我不懂),2D跑酷却是非常容易的,只要有美术资源,做一个<天天酷跑>这类流行游戏也并非是什么难事. 这里通过一个松鼠跑酷的游戏介绍一下用Gamebuilder+CanTK开发游戏的方法,这个游戏的主场景仅用了60来行代码. CanTK(Canvas ToolKit)是一个开源的游戏引擎和APP框架,是开发HTML5游戏和APP的利器,如果你喜欢它,请在github上给它加星,您的支持是我们努力的动力:https://g

60行代码俄罗斯方块

原文链接:http://www.sanerliu.com/showtopic-121.page 前几天看了论坛中以前的一个俄罗斯方块小游戏,觉得有些意思,一时手痒也写了一个.代码不长,不到2kb,大家看看. <!doctype html><html><head></head><body> <div id="box" style="width:252px;font:25px/25px 宋体;background:

GJM : AlloyTouch实战--60行代码搞定QQ看点资料卡

原文链接:https://github.com/AlloyTeam/AlloyTouch/wiki/kandian 先验货 访问DEMO你也可以点击这里 源代码可以点击这里 如你体验所见,流程的滚动的同时还能支持头部的动画?不断地加载新数据还能做到流畅的滑动!怎么做得的?使用AlloyTouch CSS 0.2.0及以上版本便可! 头部动画 加载更多 实现代码 var infoList = document.getElementById("infoList"), mockHTML =

Android省市县三级联动 真实项目抽出 调用只需3行代码 源码免积分下载

写在前面:没想到短短一夜之间就有910次阅读量,迄今为止最高阅读量的一篇,小激动! 项目源码:包含日期.省市县两种选择器[资源积分:0分] ,APK安装包下载,没有CSDN账户的的点此下载源码 fastjson:自己复制博客里源码的小伙伴,注意导入fastjson框架哦!阿里巴巴出品的最快json解析框架 日期选择器:效果图中的选择年月日的日期选择器 任何问题,欢迎评论:源码下载不成功的留下邮箱:文章我还在维护,持续优化,有问题的小伙伴积极评论哈. 先上效果图: 样式可以修改xml文件 省市县三

天底下最简单的QT画图板,就一个类,60行代码

简单直观.但是我有个问题是,这实际上不是在绘制直线,而是几千几万个超级短的“直线”,这样会不会效率很低呢? 注意,每次绘制的时候,需要一支笔,这支笔需要设置颜色和宽度(就像我们平时写字也要稍微挑一下笔). http://files.cnblogs.com/files/findumars/QtPainter.rar http://download.csdn.net/detail/kfy2011/9063043