JavaScript reference error can't find variable plus closure blues

2023-03-17 06:22 问答作者：

Just in general I'm getting some errors with this. The major one is in safari and the android browser get the error

JavaScript reference error can't find variable

The variable in question is b2AABB.

Here is the code var worldAABB = new b2AABB();

I am working with box2d JavaScript (the pixel lab variant) for google closure. Also if you can give my closure dependencies and requires a good once over I would appreciate it.

<html>
<title>Tune Tunnels Alpha</title>
<head>
<!--=============================-->
<!-- Copy this part to your app. -->
<!-- START       -->
<!--=============================-->

<!-- libs -->
<!--[if IE]><script type="text/javascript" src="lib/excanvas.js"></script><![endif]-->
<script src="prototype.js"></script>
<!-- <script src="raphael.js"></script> -->
<script src="closure-library/closure/goog/base.js"></script>

<!-- box2djs -->
<script>
goog.addDependency('../common/b2Settings.js', ['box2d.Settings'], []);
goog.addDependency('../common/math/b2Vec2.js', ['box2d.Vec2'], []);
goog.addDependency('../common/math/b2Mat22.js', ['box2d.Mat22'], []);
goog.addDependency('../collision/b2Proxy.js', ['box2d.Proxy'], []);
goog.addDependency('../collision/ClipVertex.js', ['box2d.ClipVertex'], []);
goog.addDependency('../common/math/b2Math.js', ['box2d.Math'], []);
goog.addDependency('../collision/b2AABB.js', ['box2d.AABB'], []);
goog.addDependency('../collision/b2Bound.js', ['box2d.Bound'], []);
goog.addDependency('../collision/shapes/b2ShapeDef.js', ['box2d.ShapeDef'], []);
goog.addDependency('../collision/b2BoundValues.js', ['box2d.BoundValues'], []);
goog.addDependency('../collision/b2Pair.js', ['box2d.Pair'], []);
goog.addDependency('../collision/b2PairCallback.js', ['box2d.Callback'], []);
goog.addDependency('../collision/b2BufferedPair.js', ['box2d.BufferedPair'], []);
goog.addDependency('../collision/b2PairManager.js', ['box2d.PairManager'], []);
goog.addDependency('../collision/b2BroadPhase.js', ['box2d.BroadPhase'], []);
goog.addDependency('../collision/b2Collision.js', ['box2d.Collision'], []);
goog.addDependency('../collision/Features.js', ['box2d.Features'], []);
goog.addDependency('../collision/b2ContactID.js', ['box2d.ContactID'], []);
goog.addDependency('../collision/b2ContactPoint.js', ['box2d.ContactPoint'], []);
goog.addDependency('../collision/b2Distance.js', ['box2d.Distance'], []);
goog.addDependency('../collision/b2Manifold.js', ['box2d.Manifold'], []);
goog.addDependency('../collision/b2OBB.js', ['box2d.OBB'], []);
goog.addDependency('../collision/shapes/b2Shape.js', ['box2d.Shape'], []);
goog.addDependency('../collision/shapes/b2BoxDef.js', ['box2d.BoxDef'], []);
goog.addDependency('../collision/shapes/b2CircleDef.js', ['box2d.CircleDef'], []);
goog.addDependency('../collision/shapes/开发者_高级运维b2CircleShape.js', ['box2d.CircleShape'], []);
goog.addDependency('../collision/shapes/b2MassData.js', ['box2d.MassData'], []);
goog.addDependency('../collision/shapes/b2PolyDef.js', ['box2d.PolyDef'], []);
goog.addDependency('../collision/shapes/b2PolyShape.js', ['box2d.PolyShape'], []);
goog.addDependency('../dynamics/b2Body.js', ['box2d.Body'], []);
goog.addDependency('../dynamics/b2BodyDef.js', ['box2d.BodyDef'], []);
goog.addDependency('../dynamics/b2CollisionFilter.js', ['box2d.CollisionFilter'], []);
goog.addDependency('../dynamics/b2Island.js', ['box2d.Island'], []);
goog.addDependency('../dynamics/b2TimeStep.js', ['box2d.TimeStep'], []);
goog.addDependency('../dynamics/contacts/b2ContactNode.js', ['box2d.ContactNode'], []);
goog.addDependency('../dynamics/contacts/b2Contact.js', ['box2d.Contact'], []);
goog.addDependency('../dynamics/contacts/b2ContactConstraint.js', ['box2d.ContactConstraint'], []);
goog.addDependency('../dynamics/contacts/b2ContactConstraintPoint.js', ['box2d.ContactConstraintPoint'], []);
goog.addDependency('../dynamics/contacts/b2ContactRegister.js', ['box2d.ContactRegister'], []);
goog.addDependency('../dynamics/contacts/b2ContactSolver.js', ['box2d.ContactSolver'], []);
goog.addDependency('../dynamics/contacts/b2CircleContact.js', ['box2d.CircleContact'], []);
goog.addDependency('../dynamics/contacts/b2Conservative.js', ['box2d.Conservative'], []);
goog.addDependency('../dynamics/contacts/b2NullContact.js', ['box2d.NullContact'], []);
goog.addDependency('../dynamics/contacts/b2PolyAndCircleContact.js', ['box2d.PolyAndCircleContact'], []);
goog.addDependency('../dynamics/contacts/b2PolyContact.js', ['box2d.PolyContact'], []);
goog.addDependency('../dynamics/b2ContactManager.js', ['box2d.ContactManager'], []);
goog.addDependency('../dynamics/b2World.js', ['box2d.World'], []);
goog.addDependency('../dynamics/b2WorldListener.js', ['box2d.WorldListener'], []);
goog.addDependency('../dynamics/joints/b2JointNode.js', ['box2d.JointNode'], []);
goog.addDependency('../dynamics/joints/b2Joint.js', ['box2d.Joint'], []);
goog.addDependency('../dynamics/joints/b2JointDef.js', ['box2d.JointDef'], []);
goog.addDependency('../dynamics/joints/b2DistanceJoint.js', ['box2d.DistanceJoint'], []);
goog.addDependency('../dynamics/joints/b2DistanceJointDef.js', ['box2d.DistanceJointDef'], []);
goog.addDependency('../dynamics/joints/b2Jacobian.js', ['box2d.Jacobian'], []);
goog.addDependency('../dynamics/joints/b2GearJoint.js', ['box2d.GearJoint'], []);
goog.addDependency('../dynamics/joints/b2GearJointDef.js', ['box2d.GearJointDef'], []);
goog.addDependency('../dynamics/joints/b2MouseJoint.js', ['box2d.MouseJoint'], []);
goog.addDependency('../dynamics/joints/b2MouseJointDef.js', ['box2d.MouseJointDef'], []);
goog.addDependency('../dynamics/joints/b2PrismaticJoint.js', ['box2d.PrismaticJoint'], []);
goog.addDependency('../dynamics/joints/b2PrismaticJointDef.js', ['box2d.PrismaticJointDef'], []);
goog.addDependency('../dynamics/joints/b2PulleyJoint.js', ['box2d.PulleyJoint'], []);
goog.addDependency('../dynamics/joints/b2PulleyJointDef.js', ['box2d.PulleyJointDef'], []);
goog.addDependency('../dynamics/joints/b2RevoluteJoint.js', ['box2d.RevoluteJoint'], []);
goog.addDependency('../dynamics/joints/b2RevoluteJointDef.js', ['box2d.RevoluteJointDef'], []);
goog.require('goog.dom');
goog.require('box2d.Settings');
goog.require('box2d.Vec2');
goog.require('box2d.Mat22');
goog.require('box2d.Proxy');
goog.require('box2d.ClipVertex');
goog.require('box2d.Math');
goog.require('box2d.AABB');
goog.require('box2d.Bound');
goog.require('box2d.ShapeDef');
goog.require('box2d.RevoluteJoint');
goog.require('box2d.World')
goog.require('box2d.BoundValues');
goog.require('box2d.Pair');
goog.require('box2d.Callback');
goog.require('box2d.BufferedPair');
goog.require('box2d.PairManager');
goog.require('box2d.BroadPhase');
goog.require('box2d.Collision');
goog.require('box2d.Features');
goog.require('box2d.ContactID');
goog.require('box2d.ContactPoint');
goog.require('box2d.Distance');
goog.require('box2d.Manifold');
goog.require('box2d.OBB');
goog.require('box2d.Shape');
goog.require('box2d.BoxDef');
goog.require('box2d.CircleDef');
goog.require('box2d.CircleShape');
goog.require('box2d.MassData');
goog.require('box2d.PolyDef');
goog.require('box2d.PolyShape');
goog.require('box2d.Body');
goog.require('box2d.BodyDef');
goog.require('box2d.CollisionFilter')
goog.require('box2d.Island')
goog.require('box2d.TimeStep');
goog.require('box2d.ContactNode');
goog.require('box2d.Contact');
goog.require('box2d.ContactConstraint');
goog.require('box2d.ContactConstraintPoint');
goog.require('box2d.ContactRegister');
goog.require('box2d.ContactSolver');
goog.require('box2d.CircleContact');
goog.require('box2d.Conservative');
goog.require('box2d.NullContact');
goog.require('box2d.PolyAndCircleContact');
goog.require('box2d.PolyContact');
goog.require('box2d.ContactManager');
goog.require('box2d.WorldListener');
goog.require('box2d.JointNode');
goog.require('box2d.Joint');
goog.require('box2d.JointDef');
goog.require('box2d.DistanceJoint');
goog.require('box2d.DistanceJointDef');
goog.require('box2d.Jacobian');
goog.require('box2d.GearJoint');
goog.require('box2d.GearJointDef');
goog.require('box2d.MouseJoint');
goog.require('box2d.MouseJointDef');
goog.require('box2d.PrismaticJoint');
goog.require('box2d.PrismaticJointDef');
goog.require('box2d.PulleyJoint');
goog.require('box2d.PulleyJointDef');
goog.require('box2d.RevoluteJointDef');
</script>
        <!--=============================-->
        <!-- Copy this part to your app. -->
        <!-- END     -->
        <!--=============================-->
<link href="style/box2d.css" rel="stylesheet" type="text/css" />
</head>
<body>
<script>
document.observe("dom:loaded", function() {
    var worldAABB = new b2AABB();
    worldAABB.minVertex.Set(-1000, -1000);
    worldAABB.maxVertex.Set(1000, 1000);
    var gravity = new b2Vec2(0, 300);
    var doSleep = true;
    var world = new b2World(worldAABB, gravity, doSleep); 
    var circleSd = new b2CircleDef();
    circleSd.density = 1.0;
    circleSd.radius = 20;
    circleSd.restitution = 1.0;
    circleSd.friction = 0;
    var circleBd = new b2BodyDef();
    circleBd.AddShape(circleSd);
    circleBd.position.Set(x,y);
    var circleBody = world.CreateBody(circleBd);

    var jointDef = new b2RevoluteJointDef();
    jointDef.anchorPoint.Set(250, 200);
    jointDef.body1 = world.GetGroundBody();
    jointDef.body2 = circleBody;
    world.CreateJoint(jointDef);
    var timeStep = 1.0/60;
    var iteration = 1;
    world.Step(timeStep, iteration);
    var ctx;
    var canvasWidth; 
    var canvasHeight; 
    function step(cnt) { 
        world.Step(1.0/60, 1);
        ctx.clearRect(0, 0, canvasWidth, canvasHeight);
        drawWorld(world, ctx); // see demos/draw_world.js
        setTimeout('step(' + (cnt || 0) + ')', 10);
    }
    Event.observe(window, 'load', function() {
        setupWorld(world); // as you like
        ctx = $('canvas').getContext('2d');
        var canvasElm = $('canvas');
        canvasWidth = parseInt(canvasElm.width);
        canvasHeight = parseInt(canvasElm.height);
        step();
    });
});
</script>
<canvas> </canvas>
</body>
</html>

I don't know your closure/prototype environment, but since it looks like your JS files might be loading asynchronously, is it possible that all your JS files aren't loaded yet before the dom:loaded event fires:

document.observe("dom:loaded", function() {
    var worldAABB = new b2AABB();

The error is occurring on the first line of this function which is pretty suspicious. Is there an event that fires when the JS files are all loaded?

So, I think you need to figure out whether this is a timing issue of script loading or whether it's a dependency problem and the desired scripts are never going to be loaded. You can do that by temporarily replacing the entire document.observe("dom:loaded", function() { with a new function that just tests for the existence of b2AABB after a long timeout:

document.observe("dom:loaded", function() {
  setTimeout(function() {
    if (b2AABB) {
      alert("Found it");
    } else {
      alert("Still not there");
    }
  }, 60 * 1000);  // wait 60 seconds
}

If it's still not present after 60 seconds, then it's probably never going to be available and you probably have a dependency issue. If it is there after 60 seconds, then you probably have a timing issue.

继续阅读：box2d closures javascript variables

JavaScript reference error can't find variable plus closure blues

更多精彩内容

精彩评论

最新问答

央视是哪个频道？

请问买过的朋友，舒提啦旅行箱实际使用体验如何？？

检查不孕不育需要的费用？

海信ULED电视画质有什么不同的地方?？

钉子可以挂的住画框幕布吗？

问答排行榜

王昌瑞《潜梦追凶》剧组庆生新锐演员未来可期？

Is it allowed to ask users to enter credit card details for own payment method?

Escaping "<" in Perl-generated XML

imessage会显示已读吗？

微信重新建群怎么建？