Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/crufter/haquery

jQuery for Haskell
https://github.com/crufter/haquery

Last synced: 1 day ago
JSON representation

jQuery for Haskell

Awesome Lists containing this project

README

        

Haquery
=====

**jQuery selector API for Haskell**, a CSS selector based HTML manipulation and template engine.

### Why?

The advantage is that most web developers already know CSS selectors, and if you are one of them,
you don't have to learn a new template language just to render data as HTML pages.

Also, you can use any data structure, any functions with Haquery.

No more "if there is an if construct why there is no else" moment like with many other template
languages.

### Installation

Using `cabal install haquery` or `stack install haquery`.

### Selectors

Example Name URL
* - All selector http://api.jquery.com/all-selector/
#id - Id selector http://api.jquery.com/id-selector/
.class - Class selector http://api.jquery.com/class-selector/
selector1 selector2 - Descendant selector http://api.jquery.com/descendant-selector/
type - Element selector http://api.jquery.com/element-selector/
selector1 > selector2 - Child selector http://api.jquery.com/child-selector/
[attrName] - Has attribute selector http://api.jquery.com/has-attribute-selector/
[attrName="val"] - Attribute equals selector http://api.jquery.com/attribute-equals-selector/
[attrName*="val"] - Attribute contains selector http://api.jquery.com/attribute-contains-selector/
[attrName^="val"] - Attribute starts with selector http://api.jquery.com/attribute-starts-with-selector/
[attrName$="val"] - Attribute ends with selector http://api.jquery.com/attribute-ends-with-selector/
[attrName~="val"] - Attribute contains word selector http://api.jquery.com/attribute-contains-word-selector/
[attrName!="val"] - Attribute not equals selector http://api.jquery.com/attribute-not-equal-selector/
selector1, selector2 - Multiple selectors selector http://api.jquery.com/multiple-selector/
prev + next - Next adjacent selector http://api.jquery.com/next-adjacent-selector/
prev ~ siblings - Next siblings selector http://api.jquery.com/next-siblings-selector/
:not(selector) - :not() selector http://api.jquery.com/not-selector/
:has(selector) - :has() selector http://api.jquery.com/has-selector/
:eq(3) - :eq() selector http://api.jquery.com/eq-selector/
:lt(3) - :lt() selector http://api.jquery.com/lt-selector/
:gt(3) - :gt() selector http://api.jquery.com/gt-selector/
:even - :even selector http://api.jquery.com/even-selector/
:odd - :odd selector http://api.jquery.com/odd-selector/
:first - :first selector http://api.jquery.com/first-selector/
:last - :last selector http://api.jquery.com/last-selector/
:first-child - :first-child selector http://api.jquery.com/first-child-selector/
:last-child - :last-child selector http://api.jquery.com/last-child-selector/
:nth-child(3) - :nth-child() selector http://api.jquery.com/nth-child-selector/
:nth-last-child(3) - :nth-last-child() selector http://api.jquery.com/nth-last-child-selector/
:empty - :empty selector http://api.jquery.com/empty-selector/
:parent - :parent selector http://api.jquery.com/parent-selector/

### Examples

We can write the HTML data structures in Haskell, or we can parse them from HTML.
We will focus on the former.

An HTML tag is nothing else but a tagname, some key value pairs and children:

```haskell
-- Tagname Attribute 1 Attribute 2 Children
body [at "id" "x", at "class" "y"] [
div' [] [], -- Child 1 with no attributes, no children
div' [] [] -- Child 2 also with no attributes and no children
]
```

'at' means create attribute. Note that the names are not final. Any suggestion is welcome.
div became div', and head is called head' to avoid clash with Prelude.

If you want, you can use the general tag form too:

```haskell
tag "body" [at "id" "x", at "class" "y"] [
tag "div" [] [],
tag "div" [] []
]
```

Now let's look at some complete examples.

```haskell
{-# LANGUAGE OverloadedStrings #-}
import Haquery

example :: Tag
example = html [
head' [] [],
body [] [
div' [at "id" "main", at "class" "c1"] [
div' [at "id" "sub1"] [],
div' [at "id" "sub2"] []
]
]
]
```

The above example is identical to the following HTML snippet:

```html







```

Now we can start querying and manipulating our 'example'.

Let's do a selection.

```haskell
> select "#main" example
[




]
```

A selection returns all tags matching the given selector.
Obviously, we can't modify these values due to Haskell's purity.
If we want to modify tags matching a selector, we can use the alter function.

```haskell
> :t alter
alter :: T.Text -> Tag -> (Tag -> Tag) -> Tag
```

As we can see, the alter functions needs a selector, a tag to search in, and a function which transforms
the matching tags. Let's add a class to every div! We can do this with the addClass method.

```haskell
> :t addClass
addClass :: T.Text -> Tag -> Tag
```

```haskell
> alter "div" example (addClass "hello-class")







```

For parsing HTML into `Tag`s, use `parseHtml`:

```haskell
parseHtml :: T.Text -> [Tag]
```