Geek asks and answers

How to include Javascript objects in a Jade template before compiling Jade

I have been working with a website created using Jade / Express in a few weeks. I recently organized an image folder for a website, so all the images were transferred between several folders in order to simplify their use and sorting.

To simplify making changes to the hierarchy of images (and other such files), I wrote a script that contains some global variables for file paths. Now I'm trying to run a script so that I can call functions inside the jade template to automatically use these global variables.

For instance. Now the images are sorted into several folders:

File hierarchy

img/
    glyphs/
    interactivity/
        buttons/
    ...

In my path manager script, I created several functions, including the following:

: path-manager.js

 images_root_path = "/img/";
 glyph_path = images_root_path + "glyphs/";
 function getGlyph(color, name) {
     return glyph_path + color + "/" + name;
 }

, script . :

page.jade

include ../../../public/js/lib/path-manager.js
=NamespacePathManager();

js, , , .

Jade, :

page.jade script

span.challenge-time
   img(src=getGlyph("black","stopwatch.png"), style="margin-right:5px;")

: "/img/glyphs/black/stopwatch.png"

, , , , . , , , , , getGlyph , NamespacePathManager

: , javascript , jade -, javascript . , , , javascript Jade.

, , , javascript , . , ,

- some code
- more code

. , - , .

+3
1

Express , .

, path-manager.js , , :

var images_root_path = "/img/";
var glyph_path = images_root_path + "glyphs/";

exports.helpers = {
  getGlyph: function (color, name) {
    return glyph_path + color + "/" + name;
  }

  // Other helper methods here..
};

-

var app = express.createServer();

// app.configure here...
//   app.use ...

app.helpers(require('./path-manager.js').helpers);

// Routes set up here ..

, Jade :

span.challenge-time
  img(src='#{getGlyph("black","stopwatch.png")}', style='margin-right:5px;')

DailyJS http://dailyjs.com/2011/01/03/node-tutorial-8/

+2

More articles:


All Articles