Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/fiatjaf/tempreites
One-file semantic DSL-free templates direto da roça for the browser and server.
https://github.com/fiatjaf/tempreites
html regular-expression template
Last synced: 12 days ago
JSON representation
One-file semantic DSL-free templates direto da roça for the browser and server.
- Host: GitHub
- URL: https://github.com/fiatjaf/tempreites
- Owner: fiatjaf
- License: mit
- Created: 2013-12-11T21:18:04.000Z (about 11 years ago)
- Default Branch: master
- Last Pushed: 2019-08-07T20:30:00.000Z (over 5 years ago)
- Last Synced: 2025-01-12T13:21:28.284Z (15 days ago)
- Topics: html, regular-expression, template
- Language: JavaScript
- Homepage:
- Size: 2.98 MB
- Stars: 34
- Watchers: 4
- Forks: 2
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
### [DEMO](http://jsfiddle.net/fiatjaf/mSEZ6/)
### [Comparison with Mustache](http://jsperf.com/tempreites-vs-mustache/4)# Tempreites
Crude string templating without any syntax, just semantic HTML.
**Disclaimer**: This is old, slow, buggy and not recommended. It's here just for historical reasons. It was my first public library and published on http://microjs.com/.
## Usage
Get this as a string,
```html
```attach data to it,
```javascript
var data = {
title: 'Austrian economists and their theories',
theories: [
{ author: 'Menger', theory: 'Subjective value', url: '/subj' },
{ author: 'Hayek', theory: 'Austrian Business Cycle Theory', url: '/abct' },
{ author: 'Kirzner', theory: 'Sheer ignorance and entrepreneurship', url: '/entre' },
]
}tempreites.render(template, data)
```get this back:
```html
```## Features
* __Semantic data binding__ - No need for <%=foo%> or {{foo}} assignments
* __Collection rendering__ - No need for hand-written loops
* __Valid HTML templates__ - Write templates as a part of the HTML, in plain HTML
* __View logic in JavaScript__ - No crippled micro-template language, just plain JavaScript functions## TODOs:
* _Basic optmization_
* _Read some `data-` attr to see in which element arrays of data will duplicate_## Installation
```
npm install tempreites
```Or download the [file](https://raw.github.com/fiatjaf/tempreites/master/dist/tempreites.js) and include it anywhere.
---
## Documentation
Considering a `data` object like this:
```javascript
var data = {
name: 'Miyamoto',
link: '/miyamoto',
completeName: {
first: 'Shigeru'
last: 'Miyamoto'
},
sons: [{ name: 'Mario', show: true }, { name: 'Luigi', show: false }]
show: true
}
Tempreites.render(template, data)
```#### Binding values
Use a `class` or an `id` at the target element with the value of the key in your `data` object.
```html
```#### Nested objects
Use a `class` or an `id` at some element with the value of the parent key in your `data` object, then use a `class` or `id` with the child key anywhere inside the parent element.
```html
,
```#### Nested lists
Use a `class` or an `id` at the element immediattely before the element you want to be repeated with the list values, then use a `class` or `id` with the child key anywhere inside it.
```html
```#### Binding values to attributes
Use the `data-bind` attribute with the special syntax "javascriptObjectAttrName - > htmlElementAttrNameToBindTo". If you want to bind to more than one attr, write the other bindings at the same `data-bind`, separated by a `|`:
```html
```
#### Conditional showing of elements
Use the `data-show-if` attr naming a key at the `data` object which will be tested for deciding if the element
will be shown or not.
```html
```#### Pre-compiling templates
Call the `compile` function to get a pre-compiled template to which you can just pass the data later.
')
```javascript
var tpr = Tempreites.compile('
tpr.render({u: 'a'})
tpr.render({u: 'b'})
```---
Inspired by [Plates](https://github.com/flatiron/plates) and [Transparency](https://github.com/leonidas/transparency/), but simplified and more useful.
---
Written with regular expressions, como se fazia antigamente lá na roça.