- Added Leaf documentation (copied from Leaf README)

- Modified views docs to add Leaf
This commit is contained in:
Nathan Flurry 2016-09-09 23:20:58 -07:00
parent fc67a8f81b
commit 22314737ef
4 changed files with 157 additions and 4 deletions

View File

@ -27,6 +27,7 @@ Here are a list of all the Swift 3, linux-ready packages and modules provided op
- WebSockets: Full-duplex communication channels over a single TCP connection.
- SMTP: Send email using Sendgrid and Gmail.
- Transport: Streams and transfer protocols.
- [Leaf](https://github.com/vapor/leaf): An extensible templating language built for Vapor.
- [JSON](https://github.com/vapor/json): Maps Foundation JSON to Swifty enum.
- [Console](https://github.com/vapor/console): Swift wrapper for console IO and commands.
- [Node](https://github.com/vapor/node): A formatted data encapsulation meant to facilitate the object conversions.

View File

@ -50,6 +50,9 @@ menu:
guide-views:
text: Views
relativeUrl: guide/views.html
guide-leaf:
text: Leaf
relativeUrl: guide/leaf.html
guide-middleware:
text: Middleware
relativeUrl: guide/middleware.html

148
guide/leaf.md Normal file
View File

@ -0,0 +1,148 @@
---
currentMenu: guide-leaf
---
# Leaf
Welcome to Leaf. Leaf's goal is to be a simple templating language that can make generating views easier. There's a lot of great templating languages, use what's best for you, maybe that's leaf! The goals of leaf are as follows:
- Small set of strictly enforced rules
- Consistency
- Parser first mentality
- Extensibility.
## Syntax
Leaf syntax is based around a single token, in this case, the hashtag: `#`.
>It's important to note that _all_ hashtags will be parsed, there is no escaping. Use `#()` to render a plain `#`. `#()Leaf` => `#Leaf`. Or, for larger sections, use the `raw` tag. `#raw() { #Do #whatever #you #want #to #in #here!. }`
#### Structure
Here we see all the components of a Leaf tag.
```leaf
#someTag(parameter.list, goes, "here") {
This is an optional body here
}
```
##### Token
>The `#` token will define we're a tag
##### Name
>In above example, it would be `someTag`. While not strictly enforced, it is HIGHLY encouraged that users only use alphanumeric characters in names. This may be enforced in future versions.
##### Parameter List
> Var(parameter, list), Var(goes), Const("here")
##### Body
> This is an optional body here indicated w/ open and closed curly brackets.
#### Using # in html with Leaf
If you need # to appear alone in your html, simply using `#()` will render as #. Alternatively, the raw tag is available for larger sections of code:
```leaf
#raw() {
Do whatever w/ #'s here, this code
won't be rendered as leaf document.
It's a great place for things like Javascript or large HTML sections.
}
```
## Syntax Highlighting
### Atom
[language-leaf](https://atom.io/packages/language-leaf) by ButkiewiczP
## Examples
#### Variable
Variables are added w/ just a number sign.
```leaf
Hello, #(name)!
```
#### Loop
Loop a variable
```leaf
#loop(friends, "friend") {
Hello, #(friend.name)!
}
```
#### If - Else
```leaf
#if(entering) {
Hello, there!
} ##if(leaving) {
Goodbye!
} ##else() {
I've been here the whole time.
}
```
#### Chaining
The double token, `##` indicates a chain. If the previous tag fails, this tag will be given an opportunity to run. It can be applied to any standard tag, for example, above we chain to else, but we could also chain to loops.
```
#ifEmpty(friends) {
Try adding some friends!
} ##loop(friends, "friend") {
<li> #(friend.name) </li>
}
```
### Custom Tags
Look at the existing tags for advanced scenarios, let's look at a basic example by creating `Index` together. This tag will take two arguments, an array, and an index to access.
```
class Index: BasicTag {
let name = "index"
func run(arguments: [Argument]) throws -> Node? {
guard
arguments.count == 2,
let array = arguments[0].value?.nodeArray,
let index = arguments[1].value?.int,
index < array.count
else { return nil }
return array[index]
}
}
```
Now, after creating our `Stem`, we can register the tag:
```
stem.register(Index())
```
And use it like so:
```
Hello, #index(friends, "0")!
```
We can also chain `else` to this like we did earlier if we want to check existence first:
```
#index(friends, "0") {
Hello, #(self)!
} ##else() {
Nobody's there!
}
```

View File

@ -22,11 +22,11 @@ drop.get("html") { request in
## Templating
Templated documents like mustache or stencil templates can take a `Context`.
Templated documents like [Leaf](./leaf.html), Mustache, or Stencil can take a `Context`.
```swift
drop.get("template") { request in
return try drop.view("index.template", [
return try drop.view("index", [
"message": "Hello, world!"
])
}
@ -41,16 +41,17 @@ Any resources that your views need, such as images, styles, and scripts, should
Any class that conforms to `ViewRenderer` can be set to render views with a given context.
```swift
class MustacheRenderer: RenderDriver {
class LeafRenderer: RenderDriver {
...
}
View.renderers[".mustache"] = MustacheRenderer()
View.renderers[".leaf"] = LeafRenderer()
```
## Available Renderers
These renderers can be added to your application through Providers.
- [Leaf](https://github.com/vapor/leaf)
- [Mustache](https://github.com/vapor/mustache-provider)
- [Stencil](https://github.com/vapor/stencil-provider)