Using haml with spine.js

[Felix Gläske]

Hey,

I want to use haml as my templating engine in my spine.js app

I already installed haml via npm but how can I tell hem to use it to compile my templates?

I saved my template under views/test.haml

and in my controller i tried @html require('views/test')

I just tried it analogue to eco... but every time i see "Uncaught module views/test not found"  in my js console

Can someone help me?

[Vojto Rinik]

You need to tell node.js how to compile .haml file first.

This should help you: https://github.com/maccman/hem/issues/25

[Felix Gläske]

Thanks for the link... i can use the code form the fork

but i don't really get the point from 

just make a custom slug.js file and load hem

i already tried to add "haml-coffee" into the dependencies of my slug.json and restart hem but it didn't worked

[Daniel Holmes]

Just checking but have you required it in your scripts?

[Felix Gläske]

i have to require "haml-coffee" in my controllers? do you mean that?

[Daniel Holmes]

Im not entirely sure how it works specifically but yes. Also in setup.coffee :-)

[Felix Gläske]

hmm i added

require('haml/lib/haml')

to setup.coffee and my controller but on require('views/test') I still get the error that this module doesn't exist

[Daniel Holmes]

You can't require a view unless its inside a module.

You'd have to wrap the output of your template and place a modules.export call expoting the templates out put from my understanding.

If I could have a link to a URL repository I could give you a more detailed example.

On Dec 25, 2011 7:40 PM, "Felix Gläske" <ske...@gmail.com> wrote:

[Felix Gläske]

and why is it possible to load *.eco files via require() ?

my target was to load my haml files in the same way

[Daniel Holmes]

I think from memory the build of hem compiles templates at run time.

[Felix Gläske]

aren't all the templates compiled into my application.js?

[Daniel Holmes]

Yes, but by default they are sandboxed. As I said if you have a report URL I can help you more.

[Daniel Holmes]

Sorry I mean repository

[Felix Gläske]

Right now there isn't much more than one controller (users) and the basic app

I've put the stuff on github so you can see all the files

My test call is: http://localhost:9294/#/users/show

https://github.com/soupdiver/spine.js-and-haml

[Daniel Holmes]

Felix, I don't know if you understand much of this but basically hem creates the ability to precompile eco files when you require files. To do what your doing, you would have to fork hem's repository and add your own code to ./src/compilers.coffee and compile your own custom version of hem.

I found it easier to create a template master class which dealt with adding vars and rendering templates. That meant that the views became classes which extended the template class.

That means I could do this theoretically in the controller:

@html require('views/home').render data

The home template file would look like this:

Template = require('helpers/Template')
class home:
  @extends Template

  constructor:
    super
    #overide existing template var
    @template = '''
      %h1
    '''

    #overide existing data var with default data related to template
    @data:
      h1: "Hello World"

So the function to render the template with the data would already be defined in helpers/Template.coffee

Hope that helps you out :-)

- Daniel J Holmes
www.djcentric.com

[Felix Gläske]

Yeah.. that's exactly what I want to do ...

I added the changes from https://github.com/vojto/hem/commit/e0e5b33fda24a92014262b566429bb6688a4bbf6

into my local installation and made a new built from hem with cake

Then I tried to require my 'views/test.haml' via require('views/test') but I still get the same error as before

[Daniel Holmes]

I noticed you haven't compiled hem into a bin format. Are you loading hem using its executable or using "node ./node_modules/hem/lib/hem.js server"?

Also I am not entirely sure why you are parsing your templates in coffeescript?

[Felix Gläske]

ah ok... I see

currently I just type hem server... so I think I'm using the "old" executable

but when I try "node ./node_modules/hem/lib/hem.js server" just nothing happens

[Alex MacCaw]

./node_modules/.bin/hem server

--

Alex MacCaw

+12147175129
@maccman

http://alexmaccaw.co.uk

[Daniel Holmes]

Alex does that exec run the compiled js files under lib? Or do you need to recompile the exec?

[Felix Gläske]

awesome... it works now :D

thank you guys! :)

@maccman are you planning to integrate an easier way for changing the template engine?

[Felix Gläske]

a last question...

what do i have to do that i can still can use hem server instead "./node_modules/.bin/hem server"

[Daniel Holmes]

Depending on how it works you'd probably have to replace the executable on your system and replace your global copies of the hem scripts as well.

This means that running npm might override your changes.

[Alex MacCaw]

Felix: The usual way is to create a slug.js file, containing code which adds your template, then loads Hem. It looks a bit like this: https://gist.github.com/1324427

[Felix Gläske]

super!

works perfectly :)

[Vojto Rinik]

I added this to my profile to start hem server:

alias hs="[ -f ./node_modules/hem/bin/hem ] && ./node_modules/hem/bin/hem server || hem server"

NPM should have something like bundle exec for this exact purpose -- to execute binary from project, not system global. 

Also, note that in this case the correct way is writing mentioned slug.js, not using the fork.