Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 1 addition & 4 deletions .editorconfig
Original file line number Diff line number Diff line change
Expand Up @@ -8,8 +8,5 @@ indent_style = space
trim_trailing_whitespace = true
insert_final_newline = true

[{bower,package}.json]
indent_size = 2

[*.md]
[*.{md,html}]
trim_trailing_whitespace = false
5 changes: 0 additions & 5 deletions .gitignore
Original file line number Diff line number Diff line change
@@ -1,9 +1,4 @@
# OS

._*
.DS_Store

# NODEJS

node_modules
npm-debug.log
6 changes: 0 additions & 6 deletions .npmignore
Original file line number Diff line number Diff line change
@@ -1,11 +1,5 @@
# FILES

.editorconfig
npm-debug.log

test.js

# DIRECTORIES

test
node_modules
16 changes: 4 additions & 12 deletions .travis.yml
Original file line number Diff line number Diff line change
@@ -1,14 +1,6 @@
sudo: true
language: node_js
sudo: false
node_js:
- v6
- v4
cache:
directories:
- node_modules
before_script:
- npm i
script:
- npm test
after_success:
- './node_modules/.bin/nyc report --reporter=text-lcov | ./node_modules/.bin/coveralls'
- 6
after_script:
- npm run coveralls
41 changes: 12 additions & 29 deletions CONTRIBUTING.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,11 +4,9 @@ Contributions welcome!

**Before spending lots of time on something, ask for feedback on your idea first!**

Please search issues and pull requests before adding something new to avoid duplicating
efforts and conversations.
Please search issues and pull requests before adding something new to avoid duplicating efforts and conversations.

This project welcomes non-code contributions, too! The following types of contributions
are welcome:
This project welcomes non-code contributions, too! The following types of contributions are welcome:

- **Ideas**: participate in an issue thread or start your own to have your voice heard.
- **Writing**: contribute your expertise in an area by helping expand the included docs.
Expand All @@ -25,51 +23,36 @@ to!

## Project Governance

Individuals making significant and valuable contributions are given commit-access to the
project to contribute as they see fit. This project is more like an open wiki than a
standard guarded open source project.
Individuals making significant and valuable contributions are given commit-access to the project to contribute as they see fit. This project is more like an open wiki than a standard guarded open source project.

### Rules

There are a few basic ground-rules for contributors:

1. **No `--force` pushes** or modifying the Git history in any way.
2. **Non-master branches** should be used for ongoing work.
3. **Significant modifications** like API changes should be subject to a **pull request**
to solicit feedback from other contributors.
4. **Pull requests** are *encouraged* for all contributions to solicit feedback, but left to
the discretion of the contributor.
3. **Significant modifications** like API changes should be subject to a **pull request** to solicit feedback from other contributors.
4. **Pull requests** are *encouraged* for all contributions to solicit feedback, but left to the discretion of the contributor.

### Releases

Declaring formal releases remains the prerogative of the project maintainer.

### Changes to this arrangement

This is an experiment and feedback is welcome! This document may also be subject to pull-
requests or changes by contributors where you believe you have something valuable to add
or change.
This is an experiment and feedback is welcome! This document may also be subject to pull-requests or changes by contributors where you believe you have something valuable to add or change.

## Developer's Certificate of Origin 1.1

By making a contribution to this project, I certify that:

- (a) The contribution was created in whole or in part by me and I have the right to
submit it under the open source license indicated in the file; or
- (a) The contribution was created in whole or in part by me and I have the right to submit it under the open source license indicated in the file; or

- (b) The contribution is based upon previous work that, to the best of my knowledge, is
covered under an appropriate open source license and I have the right under that license
to submit that work with modifications, whether created in whole or in part by me, under
the same open source license (unless I am permitted to submit under a different
license), as indicated in the file; or
- (b) The contribution is based upon previous work that, to the best of my knowledge, is covered under an appropriate open source license and I have the right under that license to submit that work with modifications, whether created in whole or in part by me, under the same open source license (unless I am permitted to submit under a different license), as indicated in the file; or

- (c) The contribution was provided directly to me by some other person who certified
(a), (b) or (c) and I have not modified it.
- (c) The contribution was provided directly to me by some other person who certified (a), (b) or (c) and I have not modified it.

- (d) I understand and agree that this project and the contribution are public and that a
record of the contribution (including all personal information I submit with it,
including my sign-off) is maintained indefinitely and may be redistributed consistent
with this project or the open source license(s) involved.
- (d) I understand and agree that this project and the contribution are public and that a record of the contribution (including all personal information I submit with it, including my sign-off) is maintained indefinitely and may be redistributed consistent with this project or the open source license(s) involved.

[standard-image]: https://cdn.rawgit.com/feross/standard/master/badge.svg
[standard-url]: https://github.com/feross/standard
[standard-image]: https://cdn.rawgit.com/feross/standard/master/badge.svg
[standard-url]: https://github.com/feross/standard
2 changes: 1 addition & 1 deletion LICENSE
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
MIT License (MIT)

Copyright (c) 2016 Michael Ciniawsky
Copyright (c) 2016 Jeff Escalante, Michael Ciniawsky

Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
Expand Down
102 changes: 24 additions & 78 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,34 +1,29 @@
# PostHTML Expressions <img align="right" width="220" height="200" title="PostHTML logo" src="http://posthtml.github.io/posthtml/logo.svg">

[![NPM][npm]][npm-url]
[![Deps][deps]][deps-url]
[![Tests][travis]][travis-url]
[![Coverage][cover]][cover-url]
[![Standard Code Style][style]][style-url]

<div align="center">
<img width="220" height="150" title="PostHTML" src="http://posthtml.github.io/posthtml/logo.svg">
<h1>Expressions Plugin</h1>
<p>Local variables, expressions, loops, conditionals and unicorns 👍</p>
</div>

<h2 align="center">Install</h2>
Local variables, expressions, loops, and conditionals in your html.

```bash
npm i -D posthtml-exp
```
## Installation

<h2 align="center">Usage</h2>
First, install from npm with `npm i posthtml-exp --save`, then add it as a plugin to your posthtml pipeline:

```js
const { readFileSync } = require('fs')

const posthtml = require('posthtml')
const exp = require('posthtml-exp')
const {readFileSync} = require('fs')

posthtml(exp({ locals: { foo: 'bar' } }))
.process(readFileSync('index.html', 'utf8'))
.then((result) => console.log(result.html))
.process(readFileSync('exampleFile.html', 'utf8'))
.then(console.log)
```

## Usage

This plugin provides a syntax for including local variables and expressions in your templates, and also extends custom tags to act as helpers for conditionals and looping.

You have full control over the delimiters used for injecting locals, as well as the tag names for the conditional and loop helpers, if you need them. All options that can be passed to the `exp` plugin are shown below:
Expand All @@ -47,22 +42,22 @@ You can inject locals into any piece of content in your html templates, other th

```js
exp({
locals: { class: 'intro', name: 'Jeff' }
locals: { myClassName: 'introduction', myName: 'Jeff' }
})
```

And compiled with the following template:

```html
<div class="{{class}}">
My name is {{name}}
<div class="{{ myClassName }}">
My name is {{ myName }}
</div>
```

You would get this as your output:

```html
<div class="intro">
<div class="introduction">
My name is Jeff
</div>
```
Expand All @@ -73,14 +68,14 @@ By default, special characters will be escaped so that they show up as text, rat

```js
exp({
locals: { statement: '<strong>wow!</strong>' }
locals: { strongStatement: '<strong>wow!</strong>' }
})
```

And you rendered it into a tag like this:

```html
<p>The fox said, {{ statement }}</p>
<p>The fox said, {{ strongStatement }}</p>
```

You would see the following output:
Expand All @@ -92,8 +87,7 @@ You would see the following output:
In your browser, you would see the angle brackets, and it would appear as intended. However, if you wanted it instead to be parsed as html, you would need to use the `unescapeDelimiters`, which by default are three curly brackets, like this:

```html
<p>The fox said, {{{ statement }}}</p>

<p>The fox said, {{{ strongStatement }}}</p>
```

In this case, your code would render as html:
Expand All @@ -112,7 +106,6 @@ You are not limited to just directly rendering local variables either, you can i

With this in mind, it is strongly recommended to limit the number and complexity of expressions that are run directly in your template. You can always move the logic back to your config file and provide a function to the locals object for a smoother and easier result. For example:


```js
exp({
locals: {
Expand Down Expand Up @@ -159,7 +152,7 @@ Your result would be only this:

Anything in the `condition` attribute is evaluated directly as an expression.

It should be noted that this is slightly cleaner-looking if you are using the [SugarML](https://github.com/posthtml/sugarml). But then again so is every other part of html.
It should be noted that this is slightly cleaner-looking if you are using the [SugarML parser](https://github.com/posthtml/sugarml). But then again so is every other part of html.

```sml
if(condition="foo === 'bar'")
Expand All @@ -177,8 +170,8 @@ You can use the `each` tag to build loops. It works with both arrays and objects
```js
exp({
locals: {
array: ['foo', 'bar'],
object: { foo: 'bar' }
anArray: ['foo', 'bar'],
anObject: { foo: 'bar' }
}
})
```
Expand All @@ -199,7 +192,7 @@ Output:
And an example using an object:

```html
<each loop="key, value in anObject">
<each loop="value, key in anObject">
<p>{{ key }}: {{ value }}</p>
</each>
```
Expand All @@ -222,57 +215,10 @@ So this would also be fine:

So you don't need to declare all the available variables (in this case, the index is skipped), and the expression after `in` doesn't need to be a local variable, it can be any expression.

<h2 align="center">Example</h2>

```js
const { readFileSync } = require('fs')

const posthtml = require('posthtml')
const exp = require('posthtml-exp')

const html = readFileSync('./index.html', 'utf8')

posthtml([ exp ])
.process(html)
.then(result => console.log(result.html))
```

###### Input

```html

```

###### Output

```html

```

<h2 align="center">LICENSE</h2>

> MIT License (MIT)

> Copyright (c) 2016 PostHTML Jeff Escalante
Michael Ciniawsky <michael.ciniawsky@gmail.com>

> Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:

> The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
### License & Contributing

> THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
- Licensed under [MIT](LICENSE)
- See [guidelines for contribution](CONTRIBUTING.md)

[npm]: https://img.shields.io/npm/v/posthtml-exp.svg
[npm-url]: https://npmjs.com/package/posthtml-exp
Expand Down
Loading