CODEWITHSUNDEEP
javascriptimagecoffeescriptplayframework-2.0
user2466999
user2466999

Reputation: 107

Accessing Play Framework Template attributes from separate JS files

I am completely new to the Play Framework and don't consider myself too talented at front end development, so I was having a great deal of trouble with this...

I want to be able to have a button that changes an image's source back and forth. The images are rather large, so I was thinking of preloading the images in the Javascript, but in order to do that I have to access this Assets controller in order to grab the different images from the public images directory. The trouble is I am trying to keep everything neat and want to try to keep the Javascript (in my case I'm using Coffeescript) in separate files. The problem here is that I can't access this Assets controller from the Coffeescript (or any of the values passed from the Java to the template for that matter). So when I try to change the source of the image, it just gives me a 404.

Upvotes: 0

Views: 204

Answers (1)

kipsigman
kipsigman

Reputation: 296

There's a way in Play to create a global javascript object that has access to reverse routing for controllers, including Assets if you configure that. First read this page:

http://www.playframework.com/documentation/2.3.x/ScalaJavascriptRouting

After reading, set up your javascript routes to include this resource (see embedded router or router resource in docs):

routes.javascript.Assets.at

Then you'll be able to access assets throughout your javascript as follows:

console.log(jsRoutes);
console.log(jsRoutes.controllers.Assets.at("images/favicon.png").url);

Upvotes: 2

Related Questions