Jscex模拟重力场与google苹果logo的比较
来源:广州中睿信息技术有限公司官网
发布时间:2012/10/21 23:25:16 编辑:editor 阅读 423
重力场:地球重力作用的空间。在该空间中,每一点都有惟一的一个重力矢量与之相对应。各种网络游戏,不管是3D的还是第一视角的,或者横版游戏(如冒险岛),模拟一个重力场是必须的。先回顾一下谷歌在牛顿诞辰,

重力场:地球重力作用的空间。在该空间中,每一点都有惟一的一个重力矢量与之相对应。
各种网络游戏,不管是3D的还是第一视角的,或者横版游戏(如冒险岛),模拟一个重力场是必须的。
先回顾一下谷歌在牛顿诞辰,logo换成了自由落体的苹果。

<html>
<script language="javascript">
    var h = 0, v = 1;
    window.setTimeout(aa, 
2000);
    
function aa() {
        
var i = self.setInterval("bb()"25);
    }
    
function bb() {
        
var f = document.getElementById('fall');
        
var r = parseInt(f.style.right) + h;
        
var b = parseInt(f.style.bottom) - v;
        f.style.right 
= r + 'px';
        f.style.bottom 
= b + 'px';
        
if (b > -210) {
            v 
+= 2;
        } 
else {
            h 
= (v > 9? v * 0.1 : 0;
            v 
*= (v > 9? -0.3 : 0;
        }
    }

</script>
<body>
    <div id="fall" style="position: relative; right: -300px; bottom: -46px">
       apple
    
</div>
</body>
</html>

可以看到setTimeout和setInterval!不去仔细琢磨逻辑,光从代码语意上,是非常令人费解的。

在没有口语编程之前,我非常想把代码写成这样:

<html>
<script language="javascript">
        function drop() {
             
//自由落体
             code  here
             
//撞击地面之后
             code  here
             
//苹果摔烂
             code  here
        }
        
</script>
<body>
    <div id="fall" style="position: relative; right: -300px; bottom: -46px">
       apple
    
</div>
<script language="javascript">
drop();
</script>

</body>
</html>

 也只有这样的代码才能调用以后的口语编程接口!那么怎么才能写出这样漂亮的代码?

这个时候【jxcex】 闪亮登场!

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
    <title>Jscex Animation</title>
    <script language="javascript" type="text/javascript" src="lib/uglifyjs-parser.js"></script>
    <script language="javascript" type="text/javascript" src="src/jscex.js"></script>
    <script language="javascript" type="text/javascript" src="src/jscex.builderBase.js"></script>
    <script language="javascript" type="text/javascript" src="src/jscex.async.js"></script>
    <!--[if IE]>
    <script language="javascript" type="text/javascript" src="http://www.cnblogs.com/lib/json2.js"></script>
    <script language="javascript">
        Jscex.config.codeGenerator = function (code) { return "false || " + code; }
    </script>
    <![endif]
-->
    <script type="text/javascript">
        var dropAsync = eval(Jscex.compile("async"function (e, startPos, speedY, duration) {
            $await(Jscex.Async.sleep(
2000));
            
//e.style.left = startPos.x;
            //重力加速度
            var g = 50;
            
var time = 0;
            
var tag = 0;
            
while (time < duration) {
                $await(Jscex.Async.sleep(
25));
                
if (time < 800) {
                    
//自由落体
                    time = time + 50;
                    speedY 
= speedY + g;
                    startPos.y 
+= speedY * 0.05;
                    e.style.top 
= startPos.y;
                }
                
else {
                    
//撞击地面                 
                    if (speedY > 0 && tag == 0) {
                        tag 
= 1;
                        speedY 
= -speedY;
                        speedY 
= speedY / 3;
                    }
                    time 
= time + 50;
                    speedY 
= speedY + g;
                    startPos.y 
+= speedY * 0.05;
                    e.style.top 
= startPos.y;
                }
            }
        }));
        
var changeImageAsync = eval(Jscex.compile("async"function () {
            document.getElementById(
"heart").src = "grieve.gif";
        }));
        
var executeAsync = eval(Jscex.compile("async"
联系我们CONTACT 扫一扫
愿景:成为最专业的软件研发服务领航者
中睿信息技术有限公司 广州•深圳 Tel:020-38931912 务实 Pragmatic
广州:广州市天河区翰景路1号金星大厦18层中睿信息 Fax:020-38931912 专业 Professional
深圳:深圳市福田区车公庙有色金属大厦509~510 Tel:0755-25855012 诚信 Integrity
所有权声明:PMI, PMP, Project Management Professional, PMI-ACP, PMI-PBA和PMBOK是项目管理协会(Project Management Institute, Inc.)的注册标志。
版权所有:广州中睿信息技术有限公司 粤ICP备13082838号-2