I'm experimenting with Batman.js and I'd like to use jQuery with it for some standard Ajax and animation features.
I'm following the installation instructions located at http://batmanjs.org/download.html and at the bottom of the page there's a short description about how to use the jQuery adapter that I do not really understand how to setup.
I see some of the files listed at https://github.com/Shopify/batman/tree/master/lib but I'm not sure where they go and how to set that up. Any advice on using jQuery with Batman.js the right way is appreciated.
Thanks.
Here's the order of my scripts (stand alone app, not rails) est.js contains my app (which is conveniently named EST):
<script src="/app/vendor/coffee-script.js" type="text/javascript"></script>
<script src="/app/vendor/es5-shim.js" type="text/javascript"></script>
<script src="/app/vendor/batman.js" type="text/javascript"></script>
<script src="/app/vendor/batman.jquery.js" type="text/javascript"></script>
<script src="/app/vendor/jquery-1.7.2.min.js" type="text/javascript"></script>
<script src="est.js" type="text/javascript"></script>
All pulled from batman lib and jquery from the jquery site.
Make sure your app run method is being executed AFTER these have loaded:
<script src="/app/vendor/coffee-script.js" type="text/javascript"></script>
<script src="/app/vendor/es5-shim.js" type="text/javascript"></script>
<script src="/app/vendor/batman.js" type="text/javascript"></script>
<script src="/app/vendor/batman.jquery.js" type="text/javascript"></script>
<script src="/app/vendor/jquery-1.7.2.min.js" type="text/javascript"></script>
<script src="est.js" type="text/javascript"></script>
</head>
<body>
<div id="container" data-yield="main">
</div>
</body>
</html>
<script type="text/javascript">
EST.run();
</script>
Also make sure your app is on the window class other wise the run method will explode:
est.js:
window.EST = class EST extends Batman.App
Batman.ViewStore.prefix = 'app/views'
# loads up controllers
@controller 'app', 'sections', 'sectionrows', 'rows'
@model 'section', 'sectionrow', 'row'
@root 'app#index'
@resources 'sections', 'sectionrows', 'rows'
@on 'run', ->
console?.log "Running ...."
@on 'ready', ->
console?.log "EST ready for use."
Batman depends on adapters to implement Batman.Request and to help with querying the DOM. To use Batman with jQuery, include both libraries and the Batman.jQuery adapter:
<script src='batman.js'></script>
<script src='jquery.js'></script>
<script src='batman.jquery.js'></script>
<script src='your_app.js'></script>
<script>
YourApp.run()
</script>
It's saying that it came with 2 (or more) files, of which are named:
batman.js
and
batman.jquery.js
If you want to use jQuery on your website along with batman, you need to add the adapter, which is included in batman.jquery.js, so then your <head> will look like:
//disclude the following line, and instead, use batman.jquery.js
//<script type="text/javascript" src="/path/to/batman.js"></script>
<script type="text/javascript" src="/path/to/batman.jquery.js"></script>
<script type="text/javascript" src="/path/to/jquery.js"></script>
Good stuff?
