+Layout components are used to wrap pages and templates. Layouts should contain components like headers, footers or sidebars that will be used across the site.
+
+Learn more about Layouts: https://gridsome.org/docs/layouts
+Add static files here. Files in this directory will be copied directly to `dist` folder during build. For example, /static/robots.txt will be located at https://yoursite.com/robots.txt.
+* hyphenopoly.module.js is now [easy to use with browserify](https://github.com/mnater/Hyphenopoly/wiki/browserify)
+
+## Version 2.4.0 (Sept 01, 2018)
+* Implement fallback mechanism for language subtags where no patterns are available (e.g. en-au -> en-gb) [#29](https://github.com/mnater/Hyphenopoly/issues/29)
+* updated patterns for Thai [#25](https://github.com/hyphenation/tex-hyphen/pull/25)
+
+## Version 2.3.0 (Juli 26, 2018)
+* Don't use template strings [#28](https://github.com/mnater/Hyphenopoly/issues/28)
+* run feature test for wasm support only if necessary
+* define node >=8.3.0 as requirement (for util.TextDecoder)
+Since Version 3.0.0 a branching model based on [https://nvie.com/posts/a-successful-git-branching-model/](https://nvie.com/posts/a-successful-git-branching-model/) is used.
+(release) \ #--#--# #--# locally prepare merge to master
+ \ / /
+develop ----#--#------#--#--#--#----#-------#--#-------#---------- public dev branch
+ \ /
+(feature) #--# local dev branches
+````
+
+## Branches
+
+### master
+The public `master` branch always reflects the currently released actual version, i.e. a production-ready state.
+Merges to `master` must always cause a new release.
+
+### develop
+The public `develop` branch reflects the state of the latest stable development state. The code here is tested but waiting for more changes to accumulate, before a new release is triggered.
+
+### release
+The `release` branch is a temporary preparation branch. It is always branched from the `develop` branch, when enough changes piled up. This is the last stage where version numbers are updated, final tests are made and changelog is finalised before it is merged to master.
+
+`release`branches are named `release-x.y.z`. In most cases they are not pushed to GitHub.
+
+### feature
+`feature` branches are temporary branches for creating features, that can not be implemented directly in the `develop` branch. `feature` branches are branched/merged from/to `develop`.
+In most cases they are not pushed to GitHub and are named depending on the feature they implement.
+Automatic hyphenation can not be error free! Because ...
+* ... [homographs](https://en.wikipedia.org/wiki/Homograph) may be hyphenated differently.
+ ````
+ desert (arid land) -> des‧ert
+ desert (to leave) -> de‧sert
+ ````
+ In some patterns this is solved by not hyphenating ambiguous words at all.
+* ... [neologisms](https://en.wikipedia.org/wiki/Neologism) that are not in the list of words used for pattern creation may be hyphenated incorrectly.
+ ````
+ blogosphere -> blog·o·sphere (Merriam webster)
+ // bl‧o‧gos‧phere (en-us patterns)
+ // blo‧go‧sphere (en-gb patterns)
+ ````
+* ... the rules for hyphenation may have changed or are not specified unambiguously.
+ ````
+ dictionary -> dic‧tion‧ary (Wiktionary)
+ // dic·tio·nary (Merriam-Webster)
+ ````
+* ... the patterns differ in quality. Some are very new and reflect the current state of the language others are older. Some are based on a very large list of words others are crafted by hand (which is not necessarily bad).
+
+In any case automatic hyphenation needs proofreading and may need some intervention.
+
+## Proofread
+Use a visible hyphen character to display all hyphen opportunities:
+````javascript
+<script>
+var Hyphenopoly = {
+ require: [...],
+ setup: {
+ selectors: {
+ ".hyphenate": {
+ hyphen: "•"
+ }
+ }
+ }
+};
+</script>
+````
+See also [Setup#hyphen](./Setup.md#hyphen)
+
+## Fix hyphenation
+There are three levels of fixing possibilities:
+1. [Directly in the text](#fix-hyphenation-in-the-text)
+2. [Defining hyphenation exceptions for Hyphenopoly](#define-hyphenation-exceptions)
+Words containing a soft hyphen (\­) will not be hyphenated by Hyphenopoly.js. Therefor you can simply add soft hyphens manually to 'overwrite' automatic hyphenation.
+
+__pro:__
+- easy to do
+
+__contra:__
+- needs to be repeated for every occurence of the word
+- has no effect in the long term (others will not benefit)
+
+### Define hyphenation exceptions.
+Hyphenopoly.js has an API for hyphenation exceptions: https://github.com/mnater/Hyphenopoly/wiki/Setup#exceptions
+In the example above Hyphenopoly.js will never hyphenate the word "desert" (exceptions are not case sensitive) and hyphenate the words "dictionary", "dictionaries" and "blogosphere" at the positions marked with a hyphen-minus.
+
+__pro:__
+- one place for all exceptions
+- exceptions apply to all occurences of the words
+
+__contra:__
+- needs carefulness
+- has no effect in the long term (others will not benefit)
+
+### Help to improve the patterns
+Go to [http://www.hyphenation.org/](http://www.hyphenation.org/) and help to improve the patterns.
+
+__pro:__
+- others will benefit (Mozilla, Apple, the whole TeX-community and many others rely on these patterns)
+- the error will be fixed in long term (sometimes, maybe)
+
+__contra:__
+- fixing patterns often takes a long time (not all patterns are actively maintained)
+- fixing the patterns often requires extended knowledge
+
+As an intermediate step to improved patterns, patterns also have the ability to include exceptions. Follow this guide ([todo](todo)) to improve the patterns Hyphenopoly.js uses.
+While the .wasm and .hpb files are already compact by design, the .js files are not minified. I highly recommend to use one of the es6-savy JavaScript minifier tools.
+
+If you [installed Hyphenopoly with npm](#using-npmjs) run `npm run minify` to create a directory called `min` that contains a full set of minified files (and the test suite) minified with `terser`.
+
+### Compression
+All files have good compression rates when using gzip, deflate and the like. You may need to configure your server to be able to compress `.hpb`-files though!
+
+### es6
+Hyphenopoly_Loader.js and Hyphenopoly.js use some basic es6-syntax (`let`, `const`, etc. not the fancy stuff). If for some reason you need es5-syntax use [babel](http://babeljs.io) to transpile the scripts.
+
+### node
+Hyphenopoly_Loader.js and Hyphenopoly.js is designed for use in browsers. For usage in node.js see: [node module](./Node-Module.md)
+
+Let me now, if you have a use case for hyphenation in node.js
+
+## Download
+
+### Using GitHub
+1. Go to [https://github.com/mnater/Hyphenopoly/releases/latest](https://github.com/mnater/Hyphenopoly/releases/latest) and download the latest stable version (don't be afraid of the name `Source code`).
+2. Unpack the package and copy the following files and folders to your server:
+ * `Hyphenopoly_Loader.js`
+ * `Hyphenopoly.js`
+ * `hyphenEngine.asm.js`
+ * `hyphenEnginge.wasm`
+ * `patterns/`
+
+ (Of course you can delete the patterns for the language you won't need.)
+3. Then follow the instructions on [https://github.com/mnater/Hyphenopoly#usage-browser](https://github.com/mnater/Hyphenopoly#usage-browser)
+
+### Using npm.js
+1. Run `npm i hyphenopoly` in your project folder
+2. Tell Hyphenopoly where to find the files: [paths](./Global-Hyphenopoly-Object.md#paths)
+3. Follow the instructions on [https://github.com/mnater/Hyphenopoly#usage-browser](https://github.com/mnater/Hyphenopoly#usage-browser) (don't forget to adapt the paths)
+Before loading Hyphenopoly_Loader.js initial settings must be provided in a global `Hyphenopoly`-object. This is the only place in global space where Hyphenopoly.js puts data.
+
+## Mandatory Fields
+These fields in the `Hyphenopoly`-object must be defined.
+
+### require
+The `require` field must be an object of key-value-pairs, where the keys are language codes and the values are a long word (>=12 characters) in the required language.
+````javascript
+require: {
+ "en-us": "supercalifragilisticexpialidocious",
+ "de": "Silbentrennungsalgorithmus"
+}
+````
+Hyphenopoly_Loader.js feature tests the browser for CSS-hyphenation support of the required languages using the long word.
+If the feature test indicates that the browser doesn't support CSS-hyphenation for at least one language, all necessary ressources will be loaded and Hyphenopoly.js gets executed.
+
+Use this to test support for every language used on the current page. If e.g. the language of the page is `lang="de-DE"` you must require `de-de` (case doesn't matter). For languages that aren't in the patterns directory a fallback must be defined (see below).
+
+To force the usage of Hyphenopoly.js (e.g. for testing or if you prefer to use your own patterns) the special keyword `"FORCEHYPHENOPOLY"` can be used as value. Note: Disable CSS-hyphenation while using `"FORCEHYPHENOPOLY"`.
+
+## Optional Fields
+### paths
+By default Hyphenopoly looks in `../Hyphenopoly/patterns/` for .hpb-files and in `../Hyphenopoly/` for other resources.
+
+These paths can be reconfigured:
+The `paths` field must be an object with two key-value-pairs:
+````javascript
+paths: {
+ "patterndir": "../patterns/", //path to the directory of pattern files
+ "maindir": "../" //path to the directory where the other ressources are stored
+}
+````
+
+### fallbacks
+
+In some cases a fallback-language need to be defined:
+ * patterns for a given language are not (yet) available but patterns of an other language can be used.
+ * the language on the webpage has a region tag.
+
+E.g. you'd like to use `en-gb` patterns for `en-au` and `de` for `de-DE`:
+
+````javascript
+const Hyphenopoly = {
+ require: {
+ "en-au": "FORCEHYPHENOPOLY", //or a long string
+ "de-DE": "FORCEHYPHENOPOLY" //or a long string
+ },
+ fallbacks: {
+ "en-au": "en-gb", //use en-gb for en-au
+ "de-DE": "de". //use de for de-DE
+ },
+ setup: { ... }
+}
+````
+
+### cacheFeatureTests
+On the first run Hyphenopoly_Loader.js does the following feature tests:
+
+* Test if the client supports **WASM**
+* Test for each language in `Hyphenopoly.require` if the client supports **CSS-hyphenation**
+
+The result of these tests is stored in `Hyphenopoly.testResults`. Because these tests take
+some time and may cause a reflow of the document, Hyphenopoly_Loader.js can store their
+result and retrieve these stored results for other pages in the same browsing session.
+
+The test results are stored in sessionStorage to assure that the tests are rerun when
+the browser occasionally gets updated.
+
+Because the law in some contries require a user opt-in or opt-out or whatever if you store
+data on the client, `cacheFeatureTests` is deactivated by default and has to be activated
+explicitely by hand in the [Hyphenopoly global object](./Global-Hyphenopoly-Object.md):
+````javascript
+const Hyphenopoly = {
+ "require": {...},
+ "cacheFeatureTests": true
+}
+````
+It's up to you to comply to the cookie-regulations of your country.
+
+### setup
+By default Hyphenopoly.js hyphenates elements with the classname `.hyphenate` and sets a FOUHC-timeout of 1000ms.
+
+#### selectors
+
+With selectors elements can be selected very precicely without the need of adding classes to the HTML. The selectors-object is a list of key-value-pairs where the key is a selector and the value is an object of settings specific to the selected elements.
+
+````javascript
+setup: {
+ selectors: {
+ "p": {}, // This selects all <p> elements for hyphenation with default settings
+ ".content, .title": { // This selects all elements with class .content and .title and sets minWordLength to 4 for these elements
+ minWordLength: 4
+ }
+ }
+}
+````
+See [CSS-Selectors on MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Selectors) for a complete reference on CSS-Selectors.
+
+Note: There was a field called `classnames` in older versions of Hyphenopoly. `classnames` had been deprecated since v2.6.0 and are completly removed in v3.0.0 in favor of `selectors`.
+
+#### Optional fields in setup
+See [Setup](./Setup.md)
+
+### Events
+See [Events](./Events.md)
+
+### Hyphenate manually
+See [Hyphenators](./Hyphenators.md)
+
+### Unhyphenate
+To remove all hyphenation previously applied by Hyphenopoly call `Hyphenopoly.unhyphenate();`.
+
+## Putting it all together
+A typical init could look like this:
+````javascript
+const Hyphenopoly = {
+ require: {
+ "en-us": "supercalifragilisticexpialidocious"
+ },
+ setup: {
+ selectors: {
+ ".text": {}
+ }
+ },
+ handleEvent: {
+ error: function (e) {
+ e.preventDefault(); //don't show error messages in console
+ }
+ }
+}
+````
+
+## Internal Fields
+If you `console.dir(Hyphenopoly)` you'll see lots of other data that is internally used by Hyphenopoly_Loader.js and Hyphenopoly.js but isn't meant to be changed by the user.
+
+## Reclaim memory
+Hyphenopoly is quite hungry regarding to memory usage: for each language 2MB of wasm/asm memory are allocated. If you're done with Hyphenopoly you can set `window.Hyphenopoly = null` and leave it to the garbage collector to free the memory:
+
+````javascript
+handleEvent: {
+ hyphenopolyEnd: function (e) {
+ window.Hyphenopoly = null;
+ }
+}
+````
+See [Events](./Events.md) for more details about the `hyphenopolyEnd`-event.
+While the main functionality of Hyphenopoly is to just hyphenate your HTML with no further ado, it is sometimes usefull to have a function at hand that hyphenates text.
+
+Possible usecases are:
+* dynamically loaded text
+* hyphenating text provided by the user (e.g. in a preview window of a blogging software)
+* …
+
+Up to version 2.4.0 the only way to hyphenate text after the page has loaded was to [dispatch a `contentLoaded`-Event](./Events.md#contentloaded-event) in order to restart the hyphenation process. This works but is a bit like using a sledgehammer to crack a nut, since the whole page is reprocessed.
+
+_Since Version 2.5.0 Hyphenopoly.js exposes `hyphenators` – language specific functions that hyphenates a string or a DOM-Object._
+
+## Create and access `Hyphenopoly.hyphenators`
+`hyphenators` are language specific functions that hyphenate their input.
+
+Hyphenopoly_Loader.js creates a [Promise](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Using_promises) for a `hyphenator` for each language it loads (i.e. languages the UA doesn't support or languages you "FORCEHYPHENOPOLY"-ied).
+In the example above we enforced Hyphenopoly_Loader.js to use Hyphenopoly.js for `en-us`. Since the UA seems to support CSS3-hyphens for German, `Hyphenopoly.hyphenators` only contain a Promise for a `en-us`-hyphenator.
+
+## Use `Hyphenopoly.hyphenators` for Strings
+`hyphenators` are Promises. They are resolved as soon as everything necessary is loaded and ready (or rejected when something goes wrong). `hyphenators` resolve to a language specific function (a `hyphenator`) that hyphenates its input according to the settings for selectors (default: `.hyphenate`):
+In the example a `string` is handed over to the `hyphenator` which returns a hyphenated string according to the settings for the `selector`. If no `selector` is defined it defaults to `".hyphenate"`.
+
+## Use `Hyphenopoly.hyphenators` for DOM-Elements
+When handing over a HTMLELEMENT instead of a string `hyphenators` directly hyphenate the contents of a HTMLElement and return nothing (`undefined`).
+If Promises are not supported by the browser an error is dispatched.
+
+All modern Browsers [support Promises](https://caniuse.com/#feat=promises) and the [`async/await`-syntax](https://caniuse.com/#feat=async-functions). If you need to support IE11 use a polyfill for promises (e.g. [taylorhakes/promise-polyfill](https://github.com/taylorhakes/promise-polyfill)) and stick to the `.then`-syntax.
+
+# Use case: Hyphenopoly in react
+`hyphenators` are very important in dynamically generated web-content (web-apps). The following describes some first steps in how to use Hyphenopoly in react-apps. Please note that I'm not an expert in react.js If you find a better way I'd highly appreciate your ideas.
+
+1. [download](https://github.com/mnater/Hyphenopoly/releases/latest) and copy the latest version of Hyphenopoly to your react's `public` folder.
+
+2. Configure `window.Hyphenopoly` and load `Hyphenopoly_Loader.js` in your react's index.html:
+
+````html
+<!DOCTYPE html>
+<html>
+ <head>
+ <meta charset="UTF-8" />
+ <script>
+ //attach the global 'Hyphenopoly' object to window
+These page documents the optional fields in `setup`:
+* [Global Settings](#global-settings)
+ * [defaultLanguage](#defaultlanguage)
+ * [dontHyphenate](#donthyphenate)
+ * [dontHyphenateClass](#donthyphenateclass)
+ * [exceptions](#exceptions)
+ * [hide](#hide)
+ * [normalize](#normalize)
+ * [safeCopy](#safecopy)
+ * [timeout](#timeout)
+* [Selector Based Settings](#selector-based-settings)
+ * [compound](#compound)
+ * [hyphen](#hyphen)
+ * [leftmin and rightmin](#leftmin-and-rightmin)
+ * [leftminPerLang and rightminPerLang](#leftminperlang-and-rightminperlang)
+ * [minWordLength](#minwordlength)
+ * [orphanControl](#orphancontrol)
+
+## Global Settings
+These settings apply to Hyphenopoly in general.
+
+### defaultLanguage
+````
+type: String
+default: "en-us"
+````
+Sets a fallback language in case no language is set in HTML.
+````html
+<script>
+var Hyphenopoly = {
+ require: {...},
+ paths: {...},
+ setup: {
+ defaultLanguage: "en-us",
+ selectors: {...}
+ }
+};
+</script>
+````
+To hyphenate a text its language needs to be known to the system (be it native CSS hyphenation or Hyphenopoly.js). Thus the language needs to be set in HTML either for the whole document (`<html lang="...">`) or on the elements.
+Hyphenopoly.js does a good job here: it searches for a `lang`-tag going up all the parentNodes of the DOM-tree and passes the language down to childNodes. But if no such tag can be found it needs `defaultLanguage`-fall back.
+
+_It's strongly recommended to set the language in HTML and use `defaultLanguage` only in cases where this wouldn't be possible!_
+
+### dontHyphenate
+````
+type: Object
+default: {
+ video: true,
+ audio: true,
+ script: true,
+ code: true,
+ pre: true,
+ img: true,
+ br: true,
+ samp: true,
+ kbd: true,
+ var: true,
+ abbr: true,
+ acronym: true,
+ sub: true,
+ sup: true,
+ button: true,
+ option: true,
+ label: true,
+ textarea: true,
+ input: true,
+ math: true,
+ svg: true,
+ style: true
+}
+````
+Elements in this list with a `true`-value and their contents are not hyphenated. Change the value to `false` or delete the line to change this.
+````html
+<script>
+var Hyphenopoly = {
+ require: [...],
+ paths: [...],
+ setup: {
+ dontHyphenate: {
+ video: true,
+ audio: true,
+ script: true,
+ code: true,
+ pre: true,
+ img: true,
+ br: true,
+ samp: true,
+ kbd: true,
+ var: true,
+ abbr: true,
+ acronym: true,
+ sub: true,
+ sup: true,
+ button: false, //<--
+ option: true,
+ label: true,
+ textarea: true,
+ input: true,
+ math: true,
+ svg: true,
+ style: true
+ },
+ selectors: {...}
+ }
+};
+</script>
+````
+
+### dontHyphenateClass
+````
+type: String
+default: "donthyphenate"
+````
+Elements with this class will not be hyphenated by Hyphenopoly.js
+````html
+<script>
+var Hyphenopoly = {
+ require: [...],
+ paths: [...],
+ setup: {
+ dontHyphenateClass: "donthyphenate",
+ selectors: {...}
+ }
+};
+</script>
+````
+Hyphenopoly.js hyphenates all elements that match the selectors defined in `selectors` – and it hyphenates their childElements unless they have the `dontHyphenateClass` set.
+````html
+<div class="hyphenate">
+ <p>This text will be hyphenated by default.</p>
+ <p>This will. <span class="donthyphenate">This will not</span> And this will…</p>
+</div>
+````
+
+### exceptions
+````
+type: Object
+default: undefined
+````
+Provide exceptions for hyphenation.
+````html
+<script>
+var Hyphenopoly = {
+ require: {...},
+ paths: {...},
+ setup: {
+ exceptions: {
+ "global": "FORTRAN", //excpetions for all languages
+The exceptions object must contain language-codes as keys (or "global" for all languages). The values must be words separated by `,⎵` (comma, space), where a hyphen-minus marks the hyphenation points.
+If the word does not contain a hyphen, it will not be hyphenated by Hyphenopoly.js
+
+### hide
+````
+type: string ("all" | "element" | "text")
+default: "all"
+````
+Define if and how elements are made unvisible while being hyphenated.
+````html
+<script>
+var Hyphenopoly = {
+ require: {...},
+ paths: {...},
+ setup: {
+ hide: "element"
+ }
+};
+</script>
+````
+To prevent a flash of unhyphenated content (FOUHC) Hyphenopoly hides the elements being hyphenated. Depending on the structure of your page this can lead to visual flicker. You can change the way Hyphenopoly hides the content:
+
+- `all` hides the whole page by inserting the following CSS-rule `html {visibility: hidden !important}`
+- `element` hides the selected elements by inserting the following CSS-rule for each selector: `<selector> {visibility: hidden !important}`
+- `text` hides only the text of the selected elements by inserting the following CSS-rule for each selector: `<selector> {color: transparent !important}`
+- any other keyword prevents hiding.
+
+These CSS-rules are removed, when Hyphenopoly has finished its job or when the [timeout](#timeout) gets fired.
+
+
+### normalize
+````
+type: boolean
+default: false
+````
+Normalize words before hyphenation.
+````html
+<script>
+var Hyphenopoly = {
+ require: {...},
+ paths: {...},
+ setup: {
+ normalize: true,
+ selectors: {...}
+ }
+};
+</script>
+````
+The pattern files work with _precomposed_ characters. So an `Å` (LATIN CAPITAL LETTER A WITH RING ABOVE) must not be composed of `A` (LATIN CAPITAL LETTER A) and ` ̊` (COMBINING RING ABOVE) to be recognizable by hyphenation-engine.
+If the text contains _composed_ characters they must be normalised to _precomposed_ characters. If `normalize` is activated and the user agent supports `String.prototype.normalize()` this can happen automatically.
+Since this comes with a performance penalty it is deactivated by default and it's recommended to use _precomposed_ characters in HTML.
+
+### safeCopy
+````
+type: boolean
+default: true
+````
+Removes soft hyphens from the clipboard.
+````html
+<script>
+var Hyphenopoly = {
+ require: {...},
+ paths: {...},
+ setup: {
+ safeCopy: true,
+ selectors: {...}
+ }
+};
+</script>
+````
+To prevent soft hyphens from beeing copied to the clipboard, Hyphenopoly.js registers a `onCopy`-Event on hyphenated elements. When text is copied to the clipboard, this event fires and soft hyphens are removed.
+_It does NOT remove other `hyphen`-characters!_
+This feature is on by default, but it's a hack – disable it if you don't like it.
+
+### timeout
+````
+type: number
+default: 1000
+````
+
+Sets a timeout in ms after which in case of a failure Hyphenopoly stops executing and unhides the text.
+````html
+<script>
+var Hyphenopoly = {
+ require: {...},
+ paths: {...},
+ setup: {
+ timeout: 1000,
+ selectors: {...}
+ }
+};
+</script>
+````
+To prevent a _Flash Of Unhyphenated Content (FOUHC)_ Hyphenopoly_Loader.js hides text to be hyphenated until hyphenation is done. If something goes wrong (e.g. a ressource didn't load correctly) this timeout saves us from an empty page. The timeout is cleared when hyphenation succeeds.
+If the timeout kicks in, the `onTimeOut`event is fired.
+
+See [hide](#hide) about different ways of hiding.
+
+## Selector Based Settings
+These settings can be set for each set of elements that are matched by the given selector.
+
+### compound
+````
+type: string ("auto" | "all" | "hyphen")
+default: "hyphen"
+````
+Define how compound words (words containing a hyphen) will be treated.
+````html
+<script>
+var Hyphenopoly = {
+ require: {...},
+ paths: {...},
+ setup: {
+ selectors: {
+ ".hyphenate": {
+ compound: "hyphen"
+ }
+ }
+ }
+};
+</script>
+````
+Not all browsers recognize the hyphen as a possible line-breaking spot. Thus we have to handle this.
+There are three possible values:
+
+**"auto":** leave the hyphen as it is and hyphenate the parts: `com|pu|ter-aid|ed`
+
+**"all":** hyphenate the parts and insert a zero-width space after the hyphen: `com|pu|ter-|aid|ed`
+
+**"hyphen":** don't hyphenate the parts but insert a zero-width space after the hyphen: `computer-|aided`
+
+### hyphen
+````
+type: String (a single character!)
+default: "\u00AD" (­ | ­)
+````
+The hyphen character.
+````html
+<script>
+var Hyphenopoly = {
+ require: {...},
+ paths: {...},
+ setup: {
+ selectors: {
+ ".hyphenate": {
+ hyphen: "\u00AD"
+ }
+ }
+ }
+};
+</script>
+````
+Can be set to something visible for testing and documentation.
+
+### leftmin and rightmin
+````
+type: number
+default: 0
+````
+Minimal number of characters before the first hyphenation point (leftmin). And minimal number of characters after the last hyphenation point (rightmin).
+````html
+<script>
+var Hyphenopoly = {
+ require: {...},
+ paths: {...},
+ setup: {
+ selectors: {
+ ".hyphenate": {
+ leftmin: 0,
+ rightmin: 0
+ }
+ }
+ }
+};
+</script>
+````
+Leftmin and rightmin are provided by the pattern-file but can be overwritten with larger values.
+If the value is smaller than the value from the pattern-file, it has no effect. `leftmin` and `rightmin` have an effect for the whole set of elements, disregarding the language of the subelements.
+
+### leftminPerLang and rightminPerLang:
+````
+type: object | 0
+default: 0
+````
+While `leftmin` and `rightmin` have an effect on all elements that are matched by the selector, `leftminPerLang` and `rightminPerLang` are language specific.
+````html
+<script>
+var Hyphenopoly = {
+ require: {...},
+ paths: {...},
+ setup: {
+ selectors: {
+ ".hyphenate": {
+ leftminPerLang: {
+ "en-us": 3,
+ "de": 4
+ }
+ }
+ }
+ }
+};
+</script>
+````
+If both (left-/rightmin and left-/rightminPerLanguage) are given, the highest value is respectively taken in account.
+3. [Hyphenate depending on media queries](#hyphenate-depending-on-media-queries)
+
+__Note: It's not recommended to use `hyphenopoly.module.js` in a browser environment. See e.g. [this guide](./Hyphenators.md#use-case-hyphenopoly-in-react) on how to use Hyphenopoly in react.__
+
+## Browserify hyphenopoly.module.js
+__Note: A browserifyed hyphenopoly.module.js is by far larger then the Hyphenopoly_Loader.js and Hyphenopoly.js scripts which are optimized for usage in browsers.__
+
+### Basic setup
+Create a npm project:
+````Shell
+npm init
+````
+
+Install browserify as devDependency
+````Shell
+npm install --save-dev browserify
+````
+
+Install hyphenopoly
+````Shell
+npm install hyphenopoly
+````
+
+Setup hyphenopoly in main.js. Make sure to set the loader to "http" since browserify will not shim the "fs" module:
+hyphenate_de("Silbentrennung verbessert den Blocksatz.");
+````
+
+Transform the module
+````Shell
+browserify main.js -o bundle.js
+````
+This will generate the script-file `bundle.js`. Usage of a minifying tool (e.g. [tinyify](https://github.com/browserify/tinyify)) is recommended.
+
+_Note:_ Make sure the directories referenced in `paths` are available.
+
+## Webpack
+__Note: A webpacked hyphenopoly.module.js is by far larger then the Hyphenopoly_Loader.js and Hyphenopoly.js scripts which are optimized for usage in browsers.__
+
+Like `browserify` `webpack` will not shim "fs". Thus we have to tell `webpack` to shim the "fs" module with an empty object and configure `hyphenopoly` to use the "http"-loader.
+In CSS hyphenation can be restricted to special media-queries. If hyphenation on a website must be dependent of e.g. the width of the window and only active on small screens, you'd do somethink like this:
+````css
+@media (max-width: 600px) {
+ .hyphenate {
+ hyphens: auto;
+ -ms-hyphens: auto;
+ -moz-hyphens: auto;
+ -webkit-hyphens: auto;
+ }
+}
+@media (min-width: 601px) {
+ .hyphenate {
+ hyphens: none;
+ -ms-hyphens: none;
+ -moz-hyphens: none;
+ -webkit-hyphens: none;
+ }
+}
+````
+To polyfill hyphenation for browsers that don't support hyphenation (or don't support the required language) we'll have to tell Hyphenopoly to behave the same.
+
+The standard way to enable Hyphenopoly would just hyphenate, regardless of the screen-width. Well have to tell the browser to run Hyphenopoly_Loader.js only for small screens and react to changes of the screen width (e.g. when rotating a mobile device). Therefor, instead of including Hyphenopoly the standard way
+````html
+<script>
+var startTime;
+var Hyphenopoly = {
+ require: {
+ "en-us": "FORCEHYPHENOPOLY"
+ },
+ paths: {
+ maindir: "../",
+ patterndir: "../patterns/"
+ }
+};
+</script>
+<script src="../Hyphenopoly_Loader.js"></script>
+````
+
+ we'll define a `selectiveLoad` IIFE:
+
+````html
+<script>
+(function selectiveLoad() {
+ let H9YLisLoaded = false;
+ function handleSize(mql) {
+ if (mql.matches) { //i.e. if width <= 600px
+ if (H9YLisLoaded) {
+ window.Hyphenopoly.events.dispatch(
+ "contentLoaded",
+ {"msg": ["contentLoaded"]}
+ );
+ } else {
+ // Hyphenopoly isn't loaded yet, so load the Loader
+to [clone](https://git-scm.com/docs/git-clone) the current development status (HEAD) of Hyphenopoly.js (this has the newest features, but is not fully tested).
+
+This will create a directory called `Hyphenopoly` in your current working directory containing all the files on the Hyphenopoly-GitHub-Repository. Those files are 'connected' to the repository: `git pull` will `fetch` and `merge` changes from the repository to the files in your directory.
+
+Use this to create pull-requests or to fork the repository.
+
+### Donwload tagged release
+
+While cloning gives you the most recent status, downloading a tagged release gives you a more thoughtfully tested (but never error free) version of Hyphenopoly.
+
+1. Go to [https://github.com/mnater/Hyphenopoly/releases/latest](https://github.com/mnater/Hyphenopoly/releases/latest) and download the package.
+2. Unpack the package.
+
+This will create a directory called `Hyphenopoly` in your current working directory containing all the files on the Hyphenopoly-GitHub-Repository. Those files are __NOT__ 'connected' to the repository (you can't do `git pull` and a like).
+
+Use this if you don't plan to make changes to Hyphenopoly that need to go upstream.
+
+### Install devDependencies
+In your `Hyphenopoly`-directory run `npm install`. This will install the devDependencies listed in the `package.json`-file to a directory called `node_modules`.
+ <p lang="la">Qua de causa Helvetii quoque reliquos Gallos virtute praecedunt, quod fere cotidianis proeliis cum Germanis contendunt, cum aut suis finibus eos prohibent aut ipsi in eorum finibus bellum gerunt.</p>
+ <p lang="en-us">For which reason the Helvetii also surpass the rest of the Gauls in valor, as they contend with the Germans in almost daily battles, when they either repel them from their own territories, or themselves wage war on their frontiers.</p>
+ <p lang="de">Aus diesem Grund übertreffen auch die Helvetier die übrigen Gallier an Tapferkeit, weil sie sich in fast täglichen Gefechten mit den Germanen messen, wobei sie diese entweder von ihrem Gebiet fernhalten oder selbst in deren Gebiet kämpfen.</p>