I'm having a bit of bother getting sammyjs to play with requirejs. Calling $.sammy
fails and the error says that sammy is not defined in the jQuery namespace.
Here is my require config
require.config
baseUrl: '/Scripts'
waitSeconds: 10
paths:
bootstrap: './lib/bootstrap/bootstrap'
domReady: './lib/domReady/domReady'
knockout: './lib/knockout/knockout-2.2.1.debug'
jquery: './lib/jquery/jquery-1.9.1'
sammy: './lib/sammy/sammy-0.7.4'
myPage: './app/pages/myPage'
myViewModel: './app/viewModels/myViewModel'
shim:
bootstrap:
deps: ["jquery"]
sammy:
deps: ["jquery"]
exports: "Sammy"
Here's my page javascript
require ['knockout', 'myViewModel', 'domReady!' ], ( ko, viewModel ) ->
myViewModel = new viewModel
ko.applyBindings( myViewModel )
Here's my view model
define [ 'jquery', 'sammy', 'knockout' ], ( $, sammy, ko ) ->
class myViewModel
constructor: ( options ) ->
self = @
@sammypath = ko.observable( 1 )
@router = $.sammy( ->
@get '#/', ( data ) ->
self.sammypath( 1 )
)
@router.run()
However I get an error when I try to call $.sammy
Uncaught TypeError: Object function ( selector, context )
{ // The jQuery object is actually just the init constructor 'enhanced'
return new jQuery.fn.init( selector, context, rootjQuery ); }
has no method 'sammy'
I guess it's something that's wrong with the require.config
but to be honest I'm just not sure.
The sammy-0.7.4.js
file is downloaded fine.
The sammy that is passed through to the define in the view model is not null
I stuck a break-point on the sammy file and it gets hit and recognizes that it's an AMD module. I'm just not sure why it doesn't add itself to the jQuery namespace.
I double checked that the page was loaded correctly first but the domReady module takes care of that.
I'm also using coffeescript but I don't think that that should be an issue.
To get sammy to work I just drop the $.
notation since I'm injecting it
@router = sammy( ->
@get( '#/', ( data ) ->
self.sammypath( 1 )
)
)
I can't seem to get $.sammy
to work unfortunately. The RequireJs documentation has some hints as to how to get $.sammy
to work perhaps
var require = {
deps: ["some/module1", "my/module2", "a.js", "b.js"],
callback: function(module1, module2) {
//This function will be called when all the dependencies
//listed above in deps are loaded. Note that this
//function could be called before the page is loaded.
//This callback is optional.
}
};
It looks like I could use the callback to get this to work with something like this
var require = {
deps: ["jquery", "sammy"],
callback: ($, sammy) ->
$.sammy = sammy
}
But I can't get this to play with the require.config
, if someone knows how to sort this let me know! I've seen other people do something like this with knockout
and ko
and the mapping plugin ko.mapping