<commit_before>Creating a pattern in two minutes
=================================

Patterns are implemented as javascript objects that are registered with the
patterns library. This is a minimal skeleton for a pattern:

```javascript
var mypattern = {
    name: "mypattern"
};

window.patterns.register(mypattern);
```

This code does several number of things:

* It creates the ``mypattern`` javascript object which contains the
  implementation of the pattern.
* It registers the pattern with the Patterns framework.

This pattern can be loaded directly in your browser after a standard Patterns
bundle has been loaded.

```html
<html>
  <body>
    ...
    <script src="patterns-2.0.0.js"></script>
    <script src="mypattern.js"></script>
  </body>
</html>
```


Handling DOM elements
----------------------

The minimal pattern shown before works, but does not actually do anything. Lets
extend it to add a CSS class to headers in your document. To do this we need
to do two things: 1) add an ``init`` function to the pattern which will update
the DOM, and 2) specify for which DOM elements our init function must be called.

```javascript
var mypattern = {
    name: "mypattern",
    trigger: "h1.pat-mypattern,h2.pat-mypatterh,h3.pat-mypattern",

    init: function mypattern_init($el) {
        $el.addClass("i-am-a-header");
    }
};
```
<commit_msg>Better text flow<commit_after>Creating a pattern in two minutes
=================================

Patterns are implemented as javascript objects that are registered with the
patterns library. This is a minimal skeleton for a pattern:

```javascript
var mypattern = {
    name: "mypattern"
};

window.patterns.register(mypattern);
```

This code does several number of things:

* It creates the ``mypattern`` javascript object which contains the
  implementation of the pattern.
* It registers the pattern with the Patterns framework.

This pattern can be loaded directly in your browser after a standard Patterns
bundle has been loaded.

```html
<html>
  <body>
    ...
    <script src="patterns-2.0.0.js"></script>
    <script src="mypattern.js"></script>
  </body>
</html>
```


Handling DOM elements
----------------------

The minimal pattern shown before works, but does not actually do anything. Lets
extend it to add a CSS class to headers in your document. To do this we need
to do two things: 1) specify which DOM elements our pattern wants to handle, and
2) add an ``init`` function which will update the DOM.

```javascript
var mypattern = {
    name: "mypattern",
    trigger: "h1.pat-mypattern,h2.pat-mypatterh,h3.pat-mypattern",

    init: function mypattern_init($el) {
        $el.addClass("i-am-a-header");
    }
};
```

{'fraction_non_alphanumeric': 0.13496477567667778, 'fraction_numerical': 0.005932517612161661, 'mean_word_length': 3.700348432055749, 'pattern_counts': {'":': 0, '<': 19, '<?xml version=': 0, '>': 19, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '2725426', 'n_tokens_mistral': 806, 'n_tokens_neox': 741, 'n_words': 319}