quangv / hulk-hogan

Hogan.js for Express with support for Template Partials.
MIT License
37 stars 2 forks source link

Rendered partials' HTML is encoded?! #3

Closed tbergeron closed 12 years ago

tbergeron commented 12 years ago

Hi,

First good job, hulk-hogan is working fine except for one thing.

I don't know if it's my app's config or something else but when I try to render a partial, all I receive is entities encoded HTML like this:

<input id="username" class="input-medium" placeholder="Username" type="text" name="username">

Do you know any reasons to this?

Thanks!

Also, bonus question! How can I use helpers with hogan/mustache? I'd like to use HTML helpers. I tried this: {{ form_tag('/users/login', { method: 'post' }) }}

But it does not work :S Could you help me please? Thanks!

tbergeron commented 12 years ago

Also I'd like to add that I tried the mustache's suggested ways:

{{{ }}} and {{? }}

None of them fixes the problem.

quangv commented 12 years ago

Hey tbergeron,

Thanks for enjoying Hulk-Hogan,

Can you give me a more detailed exampled on what it is you are doing? (So I can emulate problem over here.) I'm not exactly sure where you are passing the variables or partials, and where you are reading the output from...

Also what is these HTML helpers that you speak? :)

tbergeron commented 12 years ago

I'm simply doing a: {{> partials/login}}

In login.hulk I have (some testing crap in there)

{{^session.is_logged}}
<p>Please enter your connection informations before proceeding.</p>

    {{ form_tag('/users/login', { method: 'post' }) }}

        <input id="username" class="input-medium" placeholder="Username" type="text" name="username">

        <br />

        <input id="password" class="input-medium" placeholder="Password" type="password" name="password">

        <br />

            {{ submit_tag('Login', { class: 'btn btn-primary'}) }}

    {{ form_end_tag() }}
{{/session.is_logged}}

which gets the partials, but when it gets rendered, the html gets escaped. I tried bypassion hogan.js' html escape function and everything is fine. For some reason it gets called...

What gets rendered is:

    &lt;p&gt;Please enter your connection informations before proceeding.&lt;/p&gt;

        &lt;input id=&quot;username&quot; class=&quot;input-medium&quot; placeholder=&quot;Username&quot; type=&quot;text&quot; name=&quot;username&quot;&gt;

        &lt;br /&gt;

        &lt;input id=&quot;password&quot; class=&quot;input-medium&quot; placeholder=&quot;Password&quot; type=&quot;password&quot; name=&quot;password&quot;&gt;

        &lt;br /&gt;

The helpers libs I'm talking about are expressjs' helpers: https://github.com/masahiroh/express-helpers

I don't know if it's possible to call them from hogan/mustache.

Thanks!

quangv commented 12 years ago

hmm, I'm using partials just fine over here, it doesn't output html entities for me... , is your server setup the same as the readme?

  app.set 'views', __dirname+'/views'  # Directory of your views
  app.set 'view options', layout:false
  app.set 'view engine', 'hulk'  # use the .hulk file extensions for your views
  app.register '.hulk', hulk  # register to render .hulk with Hulk-Hogan

Try it without express-helpers see what happens, I suspect it's causing the issue... (hulk-hogan wasn't tested with express-helpers)

How does express-helpers even work? The example you give me seems like it's getting rendered like

res.render 'login', {form_tag:(action, options)-> ... }  # or something like that?
quangv commented 12 years ago

Okay I'm looking into helpers, I've never used them before... seems pretty cool,

It just basically passes the helpers onto render, so these two codes are for all intent and purposes the same

app.helpers
  test : ->
    return 'TEST'

# Is equivalent to

res.render 'login', {test : -> return 'TEST'}

How to use Helpers within Mustach/Hulk-Hogan templates is the question...

tbergeron commented 12 years ago

Yes, they are very useful. I'm currently experimenting with this right now. If I find a way, I'll let you know.

What we are looking for is a way to use server-side javascript inside our views, we can do it with Jade and EJS so I can't see why wouldn't we with Hogan :-/

quangv commented 12 years ago

I don't think express-helper works natively with hulk-hogan, reason being is that Mustache/Hogan.js doesn't call functions/helpers directly, but instead uses lambda's

So for example test above needs to be written

app.helpers
  test : ->
    return ->
      return 'TEST'

And then you can call it within the template like

blah blah
{{#test}}{{/test}}
blah blah

What do you mean by:

What we are looking for is a way to use server-side javascript inside our views

Running javascript inside of views? If that's the case, if you haven't already, you should check out, HandleBars and HBS, which I think has support for helpers... Mustache I think tries to keep logic outside templates as much as possible...

quangv commented 12 years ago

Just learned that you can just write lambdas like

app.helpers
  test : ->
      return 'TEST'

So the above example can be written like

blah blah
{{test}}
blah blah