https://github.com/gimenete/jade-interactive

Feel like Neo when coding jade templates
https://github.com/gimenete/jade-interactive

Last synced: 3 days ago
JSON representation

Feel like Neo when coding jade templates

• Host: GitHub
• URL: https://github.com/gimenete/jade-interactive
• Owner: gimenete
• License: mit
• Created: 2015-03-06T11:09:54.000Z (almost 10 years ago)
• Default Branch: master
• Last Pushed: 2015-03-06T11:32:50.000Z (almost 10 years ago)
• Last Synced: 2024-11-21T20:22:37.203Z (2 months ago)
• Language: JavaScript
• Homepage:
• Size: 110 KB
• Stars: 1
• Watchers: 1
• Forks: 1
• Open Issues: 0
• Metadata Files:
  • Readme: Readme.md
  • License: LICENSE

Awesome Lists containing this project

README

        
## Instalation

Include `jade-interactive` in your express application:

```

npm install jade-interactive --save

```

And in your main file (usually `app.js`):

```javascript

var interactive = require('jade-interactive')

app.set('view engine', 'jade')

// these lines configure jade-interactive in an express app

app.engine('jade', require('jade-debug').__express)

if (not_in_production) {

  interacive.configureApp({

    app: app,

    // Set the command to open your text editor

    // For SublimteText  :

    cmd: '/Applications/Sublime\\ Text\\ 2.app/Contents/SharedSupport/bin/subl %s:%s',

  })

}

// --

```

Then in your main `jade` template (`layout.jade` for example)

```

script !{interactiveScript}

```

## Not using express?

Take a look to the `index.js` file and you will see that the module provides some functionality to integrate `jade-interactive` in any framework.

- You need to create a `/open` endpoint that receives a `file` and a `line` query parameter. Then call `interactive.openFile(file, line)`

- Include `interactive.interactiveScript` when rendering a `jade` template.

- Set `debugLines` to `true` in the options passed to the render function.

## Usage

- In a desktop browser use cmd/ctrl+shift+m to enable / disable the debug mode and then click on any DOM node to open the text editor

- In a touch device long press anywhere and the node will be highlighted. Tap on it again to open the text editor

## Help us :)

As you can see `jade-interactive` requires `jade-debug` which is a fork of jade. If you like `jade-interactive` please upvote this pull request https://github.com/jadejs/jade/pull/1879 and we no longer will need to use the fork :)