correction, ajout gitignore
This commit is contained in:
Thibaud
@@ -0,0 +1,34 @@
|
||||
# Branching Model
|
||||
|
||||
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.
|
||||
|
||||
## Overview
|
||||
````text
|
||||
tag tag tag
|
||||
v v v
|
||||
master #--------------------------------#--------------------#--- stable
|
||||
\ / /
|
||||
(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.
|
||||
@@ -0,0 +1,94 @@
|
||||
# Hyphenation errors
|
||||
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)
|
||||
3. [Improve patterns](#help-to-improve-the-patterns)
|
||||
|
||||
### Fix hyphenation in the text
|
||||
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
|
||||
````javascript
|
||||
<script>
|
||||
var Hyphenopoly = {
|
||||
require: {...},
|
||||
setup: {
|
||||
exceptions: {
|
||||
"en-us": "desert, dic-tion-ary, dic-tion-aries, blog-o-sphere" //language-specific exceptions
|
||||
},
|
||||
selectors: {...}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
````
|
||||
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.
|
||||
@@ -0,0 +1,38 @@
|
||||
# Download for deployment
|
||||
|
||||
## General Notes
|
||||
|
||||
### Minifying
|
||||
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)
|
||||
@@ -0,0 +1,140 @@
|
||||
# Events
|
||||
Hyphenopoly fires a bunch of events while executing. As a user you can extend or overwrite the actions performed by these events.
|
||||
Some events have a default action that may be prevented (if event is cancellable).
|
||||
|
||||
## timeout-Event
|
||||
Fired when the Flash Of Unhyphenated Content-prevention timed out.
|
||||
|
||||
````
|
||||
Default-action: unhides content
|
||||
cancellable: false
|
||||
Fields: `delay` (timeout in ms)
|
||||
````
|
||||
|
||||
## error-Event
|
||||
Fired when an error occurs.
|
||||
|
||||
````
|
||||
Default-action: `window.console.error(e.msg);`
|
||||
cancellable: true
|
||||
Fields: `msg` (error message)
|
||||
````
|
||||
|
||||
To silent errors prevent default of this event:
|
||||
|
||||
````javascript
|
||||
const Hyphenopoly = {
|
||||
require: {
|
||||
//[...]
|
||||
},
|
||||
handleEvent: {
|
||||
error: function (e) {
|
||||
e.preventDefault(); //don't show error messages in console
|
||||
}
|
||||
}
|
||||
}
|
||||
````
|
||||
|
||||
## contentLoaded-Event
|
||||
Handles the DOMContentLoaded internally.
|
||||
Can be manually fired if contentChanges to rehyphenate the document.
|
||||
|
||||
````
|
||||
Default-action: runs Hyphenopoly (together with `engineLoaded` and `hpbLoaded`)
|
||||
cancellable: false
|
||||
Fields: `msg` (list of what has been loaded)
|
||||
````
|
||||
|
||||
_note: use [Hyphenators](./Hyphenators.md) to prevent a costly rehyphenation of the whole document_
|
||||
|
||||
## engineLoaded-Event
|
||||
Fired when the (w)asm-engine is instantiated.
|
||||
|
||||
````
|
||||
Default-action: starts Hyphenopoly (together with `DOMContentLoaded ` and `hpbLoaded`)
|
||||
cancellable: false
|
||||
Fields: `msg` (list of what has been loaded)
|
||||
````
|
||||
|
||||
## hpbLoaded-Event
|
||||
Fired on each load of a patternfile.
|
||||
|
||||
````
|
||||
Default-action: starts Hyphenopoly (together with `DOMContentLoaded ` and `engineLoaded `)
|
||||
cancellable: false
|
||||
Fields: `msg` (list of what has been loaded)
|
||||
````
|
||||
|
||||
## loadError-Event
|
||||
(new in v3.0.0)
|
||||
Fired just before Hyphenopoly is deleted if the browser supports native CSS.
|
||||
|
||||
````
|
||||
Default-action: Remove elements from the internal list of elements to be hyphenated.
|
||||
cancellable: false
|
||||
Fields: `msg` (list of what has not been loaded)
|
||||
````
|
||||
|
||||
## elementsReady-Event
|
||||
Fired when elements are collected and ready for hyphenation.
|
||||
|
||||
````
|
||||
Default-action: Starts hyphenation if pattern file and engine are ready.
|
||||
cancellable: false
|
||||
Fields: null
|
||||
````
|
||||
|
||||
## engineReady-Event
|
||||
Fired when engine and pattern files are ready.
|
||||
|
||||
````
|
||||
Default-action: Starts hyphenation if elements are ready.
|
||||
cancellable: false
|
||||
Fields: msg (language code)
|
||||
````
|
||||
|
||||
## hyphenopolyStart-Event
|
||||
Fired when Hyphenopoly starts.
|
||||
|
||||
````
|
||||
Default-action: null
|
||||
cancellable: true
|
||||
Fields: msg
|
||||
````
|
||||
|
||||
## hyphenopolyEnd-Event
|
||||
Fired when all collected elements are hyphenated.
|
||||
|
||||
````
|
||||
Default-action: clears FOUHC-timeout and unhides elements
|
||||
cancellable: false
|
||||
Fields: null
|
||||
````
|
||||
|
||||
## beforeElementHyphenation-Event
|
||||
Fired before an element gets hyphenated.
|
||||
|
||||
````
|
||||
Default-action: null
|
||||
cancellable: true
|
||||
Fields: `el` (element), `lang` (language-code)
|
||||
````
|
||||
|
||||
## afterElementHyphenation-Event
|
||||
Fired after an element has been hyphenated.
|
||||
|
||||
````
|
||||
Default-action: null
|
||||
cancellable: true
|
||||
Fields: `el` (element), `lang` (language-code)
|
||||
````
|
||||
|
||||
## tearDown-Event
|
||||
(new in v3.0.0)
|
||||
Fired just before Hyphenopoly is deleted if the browser supports native CSS.
|
||||
|
||||
````
|
||||
Default-action: null
|
||||
cancellable: true
|
||||
Fields: null
|
||||
````
|
||||
@@ -0,0 +1,7 @@
|
||||
# frozen_string_literal: true
|
||||
|
||||
source "https://rubygems.org"
|
||||
|
||||
# git_source(:github) {|repo_name| "https://github.com/#{repo_name}" }
|
||||
|
||||
gem 'github-pages', group: :jekyll_plugins
|
||||
@@ -0,0 +1,248 @@
|
||||
GEM
|
||||
remote: https://rubygems.org/
|
||||
specs:
|
||||
activesupport (4.2.11.1)
|
||||
i18n (~> 0.7)
|
||||
minitest (~> 5.1)
|
||||
thread_safe (~> 0.3, >= 0.3.4)
|
||||
tzinfo (~> 1.1)
|
||||
addressable (2.6.0)
|
||||
public_suffix (>= 2.0.2, < 4.0)
|
||||
coffee-script (2.4.1)
|
||||
coffee-script-source
|
||||
execjs
|
||||
coffee-script-source (1.11.1)
|
||||
colorator (1.1.0)
|
||||
commonmarker (0.17.13)
|
||||
ruby-enum (~> 0.5)
|
||||
concurrent-ruby (1.1.5)
|
||||
dnsruby (1.61.2)
|
||||
addressable (~> 2.5)
|
||||
em-websocket (0.5.1)
|
||||
eventmachine (>= 0.12.9)
|
||||
http_parser.rb (~> 0.6.0)
|
||||
ethon (0.12.0)
|
||||
ffi (>= 1.3.0)
|
||||
eventmachine (1.2.7)
|
||||
execjs (2.7.0)
|
||||
faraday (0.15.4)
|
||||
multipart-post (>= 1.2, < 3)
|
||||
ffi (1.11.1)
|
||||
forwardable-extended (2.6.0)
|
||||
gemoji (3.0.1)
|
||||
github-pages (198)
|
||||
activesupport (= 4.2.11.1)
|
||||
github-pages-health-check (= 1.16.1)
|
||||
jekyll (= 3.8.5)
|
||||
jekyll-avatar (= 0.6.0)
|
||||
jekyll-coffeescript (= 1.1.1)
|
||||
jekyll-commonmark-ghpages (= 0.1.5)
|
||||
jekyll-default-layout (= 0.1.4)
|
||||
jekyll-feed (= 0.11.0)
|
||||
jekyll-gist (= 1.5.0)
|
||||
jekyll-github-metadata (= 2.12.1)
|
||||
jekyll-mentions (= 1.4.1)
|
||||
jekyll-optional-front-matter (= 0.3.0)
|
||||
jekyll-paginate (= 1.1.0)
|
||||
jekyll-readme-index (= 0.2.0)
|
||||
jekyll-redirect-from (= 0.14.0)
|
||||
jekyll-relative-links (= 0.6.0)
|
||||
jekyll-remote-theme (= 0.3.1)
|
||||
jekyll-sass-converter (= 1.5.2)
|
||||
jekyll-seo-tag (= 2.5.0)
|
||||
jekyll-sitemap (= 1.2.0)
|
||||
jekyll-swiss (= 0.4.0)
|
||||
jekyll-theme-architect (= 0.1.1)
|
||||
jekyll-theme-cayman (= 0.1.1)
|
||||
jekyll-theme-dinky (= 0.1.1)
|
||||
jekyll-theme-hacker (= 0.1.1)
|
||||
jekyll-theme-leap-day (= 0.1.1)
|
||||
jekyll-theme-merlot (= 0.1.1)
|
||||
jekyll-theme-midnight (= 0.1.1)
|
||||
jekyll-theme-minimal (= 0.1.1)
|
||||
jekyll-theme-modernist (= 0.1.1)
|
||||
jekyll-theme-primer (= 0.5.3)
|
||||
jekyll-theme-slate (= 0.1.1)
|
||||
jekyll-theme-tactile (= 0.1.1)
|
||||
jekyll-theme-time-machine (= 0.1.1)
|
||||
jekyll-titles-from-headings (= 0.5.1)
|
||||
jemoji (= 0.10.2)
|
||||
kramdown (= 1.17.0)
|
||||
liquid (= 4.0.0)
|
||||
listen (= 3.1.5)
|
||||
mercenary (~> 0.3)
|
||||
minima (= 2.5.0)
|
||||
nokogiri (>= 1.8.5, < 2.0)
|
||||
rouge (= 2.2.1)
|
||||
terminal-table (~> 1.4)
|
||||
github-pages-health-check (1.16.1)
|
||||
addressable (~> 2.3)
|
||||
dnsruby (~> 1.60)
|
||||
octokit (~> 4.0)
|
||||
public_suffix (~> 3.0)
|
||||
typhoeus (~> 1.3)
|
||||
html-pipeline (2.11.0)
|
||||
activesupport (>= 2)
|
||||
nokogiri (>= 1.4)
|
||||
http_parser.rb (0.6.0)
|
||||
i18n (0.9.5)
|
||||
concurrent-ruby (~> 1.0)
|
||||
jekyll (3.8.5)
|
||||
addressable (~> 2.4)
|
||||
colorator (~> 1.0)
|
||||
em-websocket (~> 0.5)
|
||||
i18n (~> 0.7)
|
||||
jekyll-sass-converter (~> 1.0)
|
||||
jekyll-watch (~> 2.0)
|
||||
kramdown (~> 1.14)
|
||||
liquid (~> 4.0)
|
||||
mercenary (~> 0.3.3)
|
||||
pathutil (~> 0.9)
|
||||
rouge (>= 1.7, < 4)
|
||||
safe_yaml (~> 1.0)
|
||||
jekyll-avatar (0.6.0)
|
||||
jekyll (~> 3.0)
|
||||
jekyll-coffeescript (1.1.1)
|
||||
coffee-script (~> 2.2)
|
||||
coffee-script-source (~> 1.11.1)
|
||||
jekyll-commonmark (1.3.1)
|
||||
commonmarker (~> 0.14)
|
||||
jekyll (>= 3.7, < 5.0)
|
||||
jekyll-commonmark-ghpages (0.1.5)
|
||||
commonmarker (~> 0.17.6)
|
||||
jekyll-commonmark (~> 1)
|
||||
rouge (~> 2)
|
||||
jekyll-default-layout (0.1.4)
|
||||
jekyll (~> 3.0)
|
||||
jekyll-feed (0.11.0)
|
||||
jekyll (~> 3.3)
|
||||
jekyll-gist (1.5.0)
|
||||
octokit (~> 4.2)
|
||||
jekyll-github-metadata (2.12.1)
|
||||
jekyll (~> 3.4)
|
||||
octokit (~> 4.0, != 4.4.0)
|
||||
jekyll-mentions (1.4.1)
|
||||
html-pipeline (~> 2.3)
|
||||
jekyll (~> 3.0)
|
||||
jekyll-optional-front-matter (0.3.0)
|
||||
jekyll (~> 3.0)
|
||||
jekyll-paginate (1.1.0)
|
||||
jekyll-readme-index (0.2.0)
|
||||
jekyll (~> 3.0)
|
||||
jekyll-redirect-from (0.14.0)
|
||||
jekyll (~> 3.3)
|
||||
jekyll-relative-links (0.6.0)
|
||||
jekyll (~> 3.3)
|
||||
jekyll-remote-theme (0.3.1)
|
||||
jekyll (~> 3.5)
|
||||
rubyzip (>= 1.2.1, < 3.0)
|
||||
jekyll-sass-converter (1.5.2)
|
||||
sass (~> 3.4)
|
||||
jekyll-seo-tag (2.5.0)
|
||||
jekyll (~> 3.3)
|
||||
jekyll-sitemap (1.2.0)
|
||||
jekyll (~> 3.3)
|
||||
jekyll-swiss (0.4.0)
|
||||
jekyll-theme-architect (0.1.1)
|
||||
jekyll (~> 3.5)
|
||||
jekyll-seo-tag (~> 2.0)
|
||||
jekyll-theme-cayman (0.1.1)
|
||||
jekyll (~> 3.5)
|
||||
jekyll-seo-tag (~> 2.0)
|
||||
jekyll-theme-dinky (0.1.1)
|
||||
jekyll (~> 3.5)
|
||||
jekyll-seo-tag (~> 2.0)
|
||||
jekyll-theme-hacker (0.1.1)
|
||||
jekyll (~> 3.5)
|
||||
jekyll-seo-tag (~> 2.0)
|
||||
jekyll-theme-leap-day (0.1.1)
|
||||
jekyll (~> 3.5)
|
||||
jekyll-seo-tag (~> 2.0)
|
||||
jekyll-theme-merlot (0.1.1)
|
||||
jekyll (~> 3.5)
|
||||
jekyll-seo-tag (~> 2.0)
|
||||
jekyll-theme-midnight (0.1.1)
|
||||
jekyll (~> 3.5)
|
||||
jekyll-seo-tag (~> 2.0)
|
||||
jekyll-theme-minimal (0.1.1)
|
||||
jekyll (~> 3.5)
|
||||
jekyll-seo-tag (~> 2.0)
|
||||
jekyll-theme-modernist (0.1.1)
|
||||
jekyll (~> 3.5)
|
||||
jekyll-seo-tag (~> 2.0)
|
||||
jekyll-theme-primer (0.5.3)
|
||||
jekyll (~> 3.5)
|
||||
jekyll-github-metadata (~> 2.9)
|
||||
jekyll-seo-tag (~> 2.0)
|
||||
jekyll-theme-slate (0.1.1)
|
||||
jekyll (~> 3.5)
|
||||
jekyll-seo-tag (~> 2.0)
|
||||
jekyll-theme-tactile (0.1.1)
|
||||
jekyll (~> 3.5)
|
||||
jekyll-seo-tag (~> 2.0)
|
||||
jekyll-theme-time-machine (0.1.1)
|
||||
jekyll (~> 3.5)
|
||||
jekyll-seo-tag (~> 2.0)
|
||||
jekyll-titles-from-headings (0.5.1)
|
||||
jekyll (~> 3.3)
|
||||
jekyll-watch (2.2.1)
|
||||
listen (~> 3.0)
|
||||
jemoji (0.10.2)
|
||||
gemoji (~> 3.0)
|
||||
html-pipeline (~> 2.2)
|
||||
jekyll (~> 3.0)
|
||||
kramdown (1.17.0)
|
||||
liquid (4.0.0)
|
||||
listen (3.1.5)
|
||||
rb-fsevent (~> 0.9, >= 0.9.4)
|
||||
rb-inotify (~> 0.9, >= 0.9.7)
|
||||
ruby_dep (~> 1.2)
|
||||
mercenary (0.3.6)
|
||||
mini_portile2 (2.4.0)
|
||||
minima (2.5.0)
|
||||
jekyll (~> 3.5)
|
||||
jekyll-feed (~> 0.9)
|
||||
jekyll-seo-tag (~> 2.1)
|
||||
minitest (5.11.3)
|
||||
multipart-post (2.1.1)
|
||||
nokogiri (1.10.3)
|
||||
mini_portile2 (~> 2.4.0)
|
||||
octokit (4.14.0)
|
||||
sawyer (~> 0.8.0, >= 0.5.3)
|
||||
pathutil (0.16.2)
|
||||
forwardable-extended (~> 2.6)
|
||||
public_suffix (3.1.0)
|
||||
rb-fsevent (0.10.3)
|
||||
rb-inotify (0.10.0)
|
||||
ffi (~> 1.0)
|
||||
rouge (2.2.1)
|
||||
ruby-enum (0.7.2)
|
||||
i18n
|
||||
ruby_dep (1.5.0)
|
||||
rubyzip (1.2.3)
|
||||
safe_yaml (1.0.5)
|
||||
sass (3.7.4)
|
||||
sass-listen (~> 4.0.0)
|
||||
sass-listen (4.0.0)
|
||||
rb-fsevent (~> 0.9, >= 0.9.4)
|
||||
rb-inotify (~> 0.9, >= 0.9.7)
|
||||
sawyer (0.8.2)
|
||||
addressable (>= 2.3.5)
|
||||
faraday (> 0.8, < 2.0)
|
||||
terminal-table (1.8.0)
|
||||
unicode-display_width (~> 1.1, >= 1.1.1)
|
||||
thread_safe (0.3.6)
|
||||
typhoeus (1.3.1)
|
||||
ethon (>= 0.9.0)
|
||||
tzinfo (1.2.5)
|
||||
thread_safe (~> 0.1)
|
||||
unicode-display_width (1.6.0)
|
||||
|
||||
PLATFORMS
|
||||
ruby
|
||||
|
||||
DEPENDENCIES
|
||||
github-pages
|
||||
|
||||
BUNDLED WITH
|
||||
2.0.2
|
||||
@@ -0,0 +1,148 @@
|
||||
# The global Hyphenopoly object
|
||||
|
||||
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.
|
||||
@@ -0,0 +1,227 @@
|
||||
# Hyphenators
|
||||
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).
|
||||
|
||||
````html
|
||||
<script>
|
||||
var Hyphenopoly = {
|
||||
require: {
|
||||
"en-us": "FORCEHYPHENOPOLY",
|
||||
"de": "Silbentrennungsalgorithmus"
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<script src="./Hyphenopoly_Loader.js"></script>
|
||||
<script>
|
||||
console.log(Hyphenopoly.hyphenators); //{en-us: Promise}
|
||||
</script>
|
||||
````
|
||||
|
||||
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`):
|
||||
|
||||
`function hyphenator({string|DOM-Element}, [Optional: selector=".hyphenate"]) => {string|undefined}`
|
||||
|
||||
````html
|
||||
<script>
|
||||
var Hyphenopoly = {
|
||||
require: {
|
||||
"en-us": "FORCEHYPHENOPOLY",
|
||||
"de": "Silbentrennungsalgorithmus"
|
||||
},
|
||||
paths: {
|
||||
maindir: "../",
|
||||
patterndir: "../patterns/"
|
||||
},
|
||||
setup: {
|
||||
selectors: {
|
||||
".hyphenate": {
|
||||
hyphen: "•"
|
||||
},
|
||||
".hyphenatePipe": {
|
||||
hyphen: "|"
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<script src="./Hyphenopoly_Loader.js"></script>
|
||||
<script>
|
||||
Hyphenopoly.hyphenators["en-us"].then((hyphenator_en) => {
|
||||
console.log(hyphenator_en("Hyphenation")); //Hy•phen•ation
|
||||
console.log(hyphenator_en("Hyphenation", ".hyphenatePipe")); //Hy|phen|ation
|
||||
})
|
||||
</script>
|
||||
````
|
||||
|
||||
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`).
|
||||
|
||||
````html
|
||||
<html>
|
||||
<head>
|
||||
<script>
|
||||
var Hyphenopoly = {
|
||||
require: {
|
||||
"en-us": "FORCEHYPHENOPOLY",
|
||||
"de": "Silbentrennungsalgorithmus"
|
||||
},
|
||||
setup: {
|
||||
selectors: {
|
||||
".hyphenate": {
|
||||
hyphen: "•"
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<script src="./Hyphenopoly_Loader.js"></script>
|
||||
<script>
|
||||
Hyphenopoly.hyphenators["en-us"].then((hyphenator_en) => {
|
||||
hyphenator_en(document.getElementById("hyphenateme"));
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="hyphenateme">Supercalifragilisticexpialidocious</div>
|
||||
<!--becomes -->
|
||||
<!--<div id="hyphenateme">Su•per•cal•ifrag•ilis•tic•ex•pi•ali•do•cious</div>-->
|
||||
</body>
|
||||
</html>
|
||||
````
|
||||
|
||||
## Further notes and compatibility
|
||||
Instead of using `.then` on the Promises we could also use `async/await`:
|
||||
|
||||
````javascript
|
||||
async function runHyphenator(id) {
|
||||
(await Hyphenopoly.hyphenators["en-us"])(document.getElementById(id));
|
||||
}
|
||||
runHyphenator("hyphenateme");
|
||||
````
|
||||
|
||||
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
|
||||
window.Hyphenopoly = {
|
||||
require: {
|
||||
"en-us": "FORCEHYPHENOPOLY"
|
||||
},
|
||||
paths: {
|
||||
maindir: "./hyphenopoly/",
|
||||
patterndir: "./hyphenopoly/patterns/"
|
||||
},
|
||||
setup: {
|
||||
selectors: {
|
||||
".hyphenate": {
|
||||
hyphen: "•"
|
||||
}
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
<script src="./hyphenopoly/min/Hyphenopoly_Loader.js"></script>
|
||||
<title>Use Hyphenopoly in React</title>
|
||||
</head>
|
||||
<body>
|
||||
<!-- We will put our React component inside this div. -->
|
||||
<div id="container"></div>
|
||||
|
||||
<!-- Load React. -->
|
||||
<!-- Note: when deploying, replace "development.js" with "production.min.js". -->
|
||||
<script src="https://unpkg.com/react@16/umd/react.production.min.js" crossorigin></script>
|
||||
<script src="https://unpkg.com/react-dom@16/umd/react-dom.production.min.js" crossorigin></script>
|
||||
|
||||
<!-- Load our React component. -->
|
||||
<script src="hyphenateText.js"></script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
````
|
||||
|
||||
|
||||
3. Define a `React.Component` that triggers Hyphenopoly (if necessary) on `componentDidUpdate`.
|
||||
|
||||
`hyphenateText.js`:
|
||||
````javascript
|
||||
'use strict';
|
||||
|
||||
const e = React.createElement;
|
||||
|
||||
|
||||
class Toggle extends React.Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.state = {isToggleOn: true};
|
||||
|
||||
// This binding is necessary to make `this` work in the callback
|
||||
this.handleClick = this.handleClick.bind(this);
|
||||
}
|
||||
|
||||
handleClick() {
|
||||
this.setState(prevState => ({
|
||||
isToggleOn: !prevState.isToggleOn
|
||||
}));
|
||||
}
|
||||
|
||||
componentDidUpdate(prevProps, prevState, snapshot) {
|
||||
const el = this.el;
|
||||
//if hyphenation is handled by CSS, Hyphenopoly is undefined
|
||||
if (window.Hyphenopoly) {
|
||||
window.Hyphenopoly.hyphenators["en-us"].then(
|
||||
function (enHyphenator) {
|
||||
enHyphenator(el);
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
render() {
|
||||
return e(
|
||||
"p",
|
||||
{
|
||||
class: "hyphenate",
|
||||
onClick: () => this.handleClick(),
|
||||
ref: el => this.el = el
|
||||
},
|
||||
this.state.isToggleOn ? "hyphenation" : "algorithm"
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
const domContainer = document.querySelector('#container');
|
||||
ReactDOM.render(e(Toggle), domContainer);
|
||||
````
|
||||
|
||||
@@ -0,0 +1,153 @@
|
||||
# node.js module
|
||||
|
||||
The Hyphenopoly-package contains a file called `hyphenopoly.module.js`.
|
||||
This module provides hyphenation for node.js applications.
|
||||
|
||||
## Install
|
||||
|
||||
````
|
||||
npm install hyphenopoly
|
||||
````
|
||||
|
||||
## Usage
|
||||
|
||||
One language:
|
||||
|
||||
````javascript
|
||||
const Hyphenopoly = require("hyphenopoly");
|
||||
|
||||
const textHyphenators = Hyphenopoly.config({
|
||||
"require": ["en-us"],
|
||||
"hyphen": "•"
|
||||
});
|
||||
|
||||
textHyphenators.then(
|
||||
function ff(hyphenateText) {
|
||||
console.log(hyphenateText("Hyphenation enhances justification."));
|
||||
}
|
||||
).catch(
|
||||
function err(e) {
|
||||
console.log(e);
|
||||
}
|
||||
);
|
||||
````
|
||||
|
||||
More then one language:
|
||||
|
||||
````javascript
|
||||
const Hyphenopoly = require("hyphenopoly");
|
||||
|
||||
const textHyphenators = Hyphenopoly.config({
|
||||
"require": ["de", "en-us"],
|
||||
"hyphen": "•"
|
||||
});
|
||||
|
||||
textHyphenators.get("de").then(
|
||||
function ff(hyphenateText) {
|
||||
console.log(hyphenateText("Silbentrennung verbessert den Blocksatz."));
|
||||
}
|
||||
);
|
||||
|
||||
textHyphenators.get("en-us").then(
|
||||
function ff(hyphenateText) {
|
||||
console.log(hyphenateText("Hyphenation enhances justification."));
|
||||
}
|
||||
);
|
||||
````
|
||||
|
||||
## Synchronous mode
|
||||
|
||||
By default, `Hyphenopoly.config` returns a promise (or a `Map` of promises). Some code bases are not yet capable of handling async code.
|
||||
By setting `"sync" : true` the hyphenopoly module switches to a sync mode.
|
||||
|
||||
````javascript
|
||||
const hyphenopoly = require("hyphenopoly");
|
||||
|
||||
const hyphenator = hyphenopoly.config({
|
||||
"sync": true,
|
||||
"require": ["de", "en-us"],
|
||||
"hyphen": "•",
|
||||
"exceptions": {
|
||||
"en-us": "en-han-ces"
|
||||
}
|
||||
});
|
||||
|
||||
const hy1 = hyphenator.get("en-us")("hyphenation enhances justification.");
|
||||
const hy2 = hyphenator.get("de")("Silbentrennung verbessert den Blocksatz.");
|
||||
|
||||
|
||||
console.log(hy1);
|
||||
console.log(hy2);
|
||||
````
|
||||
|
||||
## Configuration
|
||||
|
||||
The `.config`-method takes an object as argument:
|
||||
|
||||
Defaults:
|
||||
````javascript
|
||||
{
|
||||
"compound": "hyphen",
|
||||
"exceptions": {},
|
||||
"hyphen": String.fromCharCode(173),
|
||||
"leftmin": 0,
|
||||
"loader": "fs",
|
||||
"minWordLength": 6,
|
||||
"normalize": false,
|
||||
"orphanControl": 1,
|
||||
"paths": {
|
||||
"maindir": `${__dirname}/`,
|
||||
"patterndir": `${__dirname}/patterns/
|
||||
},
|
||||
"require": [],
|
||||
"rightmin": 0,
|
||||
"sync": false
|
||||
}
|
||||
````
|
||||
|
||||
The only option that Must be set is `require` which takes an array of language-tags.
|
||||
|
||||
### loader
|
||||
By default hyphenopoly.module.js loads pattern files and hyphenEnginge by using nodes "fs"-module.
|
||||
This can be changed to the "http"-module by setting the `loader` to "http":
|
||||
````javascript
|
||||
const hyphenator = hyphenopoly.config({
|
||||
"require": […],
|
||||
"loader": "http"
|
||||
});
|
||||
|
||||
````
|
||||
This is useful if the module is transformed to a script used in a webbrowser (e.g. by using [browserify](http://browserify.org)).
|
||||
|
||||
### other options
|
||||
For documentation about the other options see the `Hyphenopoly.js`-documentation:
|
||||
|
||||
- [compound](./Setup.md#compound)
|
||||
- [exceptions](./Setup.md#exceptions)
|
||||
- [hyphen](./Setup.md#hyphen)
|
||||
- [leftmin](./Setup.md#leftmin-and-rightmin)
|
||||
- [minWordLength](./Setup.md#minwordlength)
|
||||
- [normalize](./Setup.md#normalize)
|
||||
- [orphanControl](./Setup.md#orphancontrol)
|
||||
- [paths](./Global-Hyphenopoly-Object.md#paths)
|
||||
- [rightmin](./Setup.md#leftmin-and-rightmin)
|
||||
|
||||
## Supported languages (since Version 2.8.0)
|
||||
A list of supported languages can be programmatically obtained by looking at `Hyphenopoly.supportedLanguages`:
|
||||
````javascript
|
||||
const Hyphenopoly = require("hyphenopoly");
|
||||
Hyphenopoly.supportedLanguages.includes("en-us"); //true
|
||||
Hyphenopoly.supportedLanguages.includes("en"); //false
|
||||
````
|
||||
|
||||
## Performance
|
||||
|
||||
On my machine with node.js 10.0.1:
|
||||
|
||||
| module | setup | hyphenate 100 de words |
|
||||
| ------------- | -------------:| ----------------------:|
|
||||
| _hyphenopoly_ | _12ms_ | _2ms_ |
|
||||
| [hyphen](https://www.npmjs.com/package/hyphen) | 40ms | 370ms |
|
||||
| [hypher](https://www.npmjs.com/package/hypher) | 70ms | 3ms |
|
||||
|
||||
|
||||
@@ -0,0 +1,409 @@
|
||||
# optional fields in `setup`
|
||||
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
|
||||
"en-us": "Web-Assembly, Java-Script" //language-specific exceptions
|
||||
},
|
||||
selectors: {...}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
````
|
||||
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.
|
||||
|
||||
### minWordLength
|
||||
````
|
||||
type: number
|
||||
default: 6
|
||||
````
|
||||
Minimal length of words to be hyphenated.
|
||||
````html
|
||||
<script>
|
||||
var Hyphenopoly = {
|
||||
require: {...},
|
||||
paths: {...},
|
||||
setup: {
|
||||
selectors: {
|
||||
".hyphenate": {
|
||||
minWordLength: 6
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
````
|
||||
|
||||
### orphanControl
|
||||
````
|
||||
type: number (1 | 2 | 3)
|
||||
default: 1
|
||||
````
|
||||
Prevent [orphans](https://en.wikipedia.org/wiki/Widows_and_orphans)
|
||||
````html
|
||||
<script>
|
||||
var Hyphenopoly = {
|
||||
require: {...},
|
||||
paths: {...},
|
||||
setup: {
|
||||
selectors: {
|
||||
".hyphenate": {
|
||||
orphanControl: 1
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
````
|
||||
There are three stages:
|
||||
1. allow orphans
|
||||
2. don't hyphenate the last word of an element
|
||||
3. don't hyphenate the last word of an element and replace the space before with a no-breaking space
|
||||
@@ -0,0 +1,184 @@
|
||||
# Special use cases and how-to's
|
||||
|
||||
1. [Browserify hyphenopoly.module.js](#browserify-hyphenopolymodulejs)
|
||||
2. [Webpack](#webpack)
|
||||
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:
|
||||
````javascript
|
||||
"use strict";
|
||||
|
||||
const hyphenopoly = require("hyphenopoly");
|
||||
|
||||
const hyphenator = hyphenopoly.config({
|
||||
"require": ["de", "en-us"],
|
||||
"paths": {
|
||||
"maindir": "./node_modules/hyphenopoly/",
|
||||
"patterndir": "./node_modules/hyphenopoly/patterns/"
|
||||
},
|
||||
"hyphen": "•",
|
||||
"loader": "http"
|
||||
});
|
||||
|
||||
async function hyphenate_en(text) {
|
||||
const hyphenateText = await hyphenator.get("en-us");
|
||||
console.log(hyphenateText(text));
|
||||
}
|
||||
|
||||
async function hyphenate_de(text) {
|
||||
const hyphenateText = await hyphenator.get("de");
|
||||
console.log(hyphenateText(text));
|
||||
}
|
||||
|
||||
hyphenate_en("hyphenation enhances justification.");
|
||||
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.
|
||||
|
||||
webpack.config.js
|
||||
````javascript
|
||||
module.exports = {
|
||||
node: {
|
||||
fs: "empty" //<- prevent "fs not found"
|
||||
}
|
||||
};
|
||||
````
|
||||
|
||||
index.js
|
||||
````javascript
|
||||
const hyphenopoly = require("hyphenopoly");
|
||||
|
||||
const hyphenator = hyphenopoly.config({
|
||||
"require": ["de", "en-us"],
|
||||
"paths": {
|
||||
"maindir": "../node_modules/hyphenopoly/",
|
||||
"patterndir": "../node_modules/hyphenopoly/patterns/"
|
||||
},
|
||||
"hyphen": "•",
|
||||
"loader": "http"
|
||||
});
|
||||
````
|
||||
|
||||
## Hyphenate depending on media queries
|
||||
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
|
||||
// with the following settings:
|
||||
window.Hyphenopoly = {
|
||||
require: {
|
||||
"en-us": "supercalifragilisticexpialidocious"
|
||||
},
|
||||
paths: {
|
||||
maindir: "../",
|
||||
patterndir: "../patterns/"
|
||||
},
|
||||
setup: {
|
||||
selectors: {
|
||||
".hyphenate": {}
|
||||
}
|
||||
}
|
||||
};
|
||||
const loaderScript = document.createElement("script");
|
||||
loaderScript.src = "../Hyphenopoly_Loader.js";
|
||||
document.head.appendChild(loaderScript);
|
||||
H9YLisLoaded = true;
|
||||
}
|
||||
} else { //i.e. if width > 600px
|
||||
if (H9YLisLoaded) {
|
||||
//remove hyphenation previously applied by Hyphenopoly
|
||||
window.Hyphenopoly.unhyphenate();
|
||||
}
|
||||
}
|
||||
}
|
||||
// Create a Media-Query-List
|
||||
const mql = window.matchMedia("(max-width: 600px)");
|
||||
// Listen to changes
|
||||
mql.addListener(handleSize);
|
||||
// call handleSize on init
|
||||
handleSize(mql);
|
||||
}());
|
||||
</script>
|
||||
````
|
||||
@@ -0,0 +1,56 @@
|
||||
# Usage of devDependencies
|
||||
Hyphenopoly has no dependencies for deployment but relies on other packages for development (devDependencies).
|
||||
|
||||
## Clone and install devDependencies
|
||||
|
||||
You need [git](https://git-scm.com/downloads) and [node.js with npm.js](https://nodejs.org/) installed on your system.
|
||||
|
||||
### Clone repository from GitHub
|
||||
Use
|
||||
|
||||
`git clone https://github.com/mnater/Hyphenopoly.git`
|
||||
|
||||
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`.
|
||||
|
||||
This will install:
|
||||
* [eslint](https://eslint.org)
|
||||
* [eslint-plugin-security](https://github.com/nodesecurity/eslint-plugin-security)
|
||||
* [remark-cli](https://www.npmjs.com/package/remark-cli)
|
||||
* [remark-preset-lint-recommended](https://github.com/remarkjs/remark-lint/tree/master/packages/remark-preset-lint-recommended)
|
||||
* [tap](https://www.npmjs.com/package/tap)
|
||||
* [terser](https://github.com/fabiosantoscode/terser)
|
||||
|
||||
and their dependencies.
|
||||
|
||||
### Install 3rd-party software
|
||||
Some dependencies are not available on npm. Run `npm run-script install3rdparty`. This will install more tools in a directory called `third-party`.
|
||||
|
||||
This will install and compile [binaryen](https://github.com/WebAssembly/binaryen).
|
||||
|
||||
## Use the tools
|
||||
With the tools mentioned above installed you can run the following scripts:
|
||||
|
||||
* `npm prepare` – recreates a minified subset of the files in the `min`-directory.
|
||||
* `npm test` – runs the tap tests for Hyphenopoly.module.js
|
||||
* `npm run testsuite` – opens a browser and runs the test suite
|
||||
* `npm run lint` – runs the linter on all .js files
|
||||
* `npm run compilewasm` - compiles `hyphenEngine.asm.js` to `hyphenEngine.wasm`
|
||||
* `npm run doc` – build and open documentation page locally
|
||||
@@ -0,0 +1 @@
|
||||
theme: jekyll-theme-minimal
|
||||
@@ -0,0 +1,31 @@
|
||||
## In the browser – Hyphenopoly_Loader.js & Hyphenopoly.js
|
||||
* [Download for deployment](./Download,-install-and-setup-for-deployment.md)
|
||||
* [Notes](./Download,-install-and-setup-for-deployment.md#general-notes)
|
||||
* [GitHub](./Download,-install-and-setup-for-deployment.md#using-github)
|
||||
* [npm](./Download,-install-and-setup-for-deployment.md#using-npmjs)
|
||||
* [Global Hyphenopoly Object](./Global-Hyphenopoly-Object.md)
|
||||
* [Mandatory fields](./Global-Hyphenopoly-Object.md#mandatory-fields)
|
||||
* [require](./Global-Hyphenopoly-Object.md#require)
|
||||
* [Optional fields](./Global-Hyphenopoly-Object.md#optional-fields)
|
||||
* [paths](./Global-Hyphenopoly-Object.md#paths)
|
||||
* [setup](./Global-Hyphenopoly-Object.md#setup)
|
||||
* [events](./Events.md)
|
||||
* [cacheFeatureTests](./cacheFeatureTests.md)
|
||||
* [Optional fields in setup](./Setup.md)
|
||||
* [Global Settings](./Setup.md#global-settings)
|
||||
* [Selector Based Settings](./Setup.md#selector-based-settings)
|
||||
* [Events](./Events.md)
|
||||
* [Hyphenators](./Hyphenators.md)
|
||||
* [Hyphenation Errors](./Coping-with-hyphenation-errors.md)
|
||||
|
||||
## In node.js – hyphenopoly.module.js
|
||||
* [hyphenopoly.module](./Node-Module.md)
|
||||
|
||||
## Special use cases
|
||||
* [Browserify hyphenopoly.module.js](./Special-use-cases.md#browserify-hyphenopolymodulejs)
|
||||
* [Webpack](./Special-use-cases.md#webpack)
|
||||
* [Hyphenate depending on media queries](./Special-use-cases.md#hyphenate-depending-on-media-queries)
|
||||
|
||||
## Develop
|
||||
* [Dev Tools (devDeps)](./Usage-of-devDependencies.md)
|
||||
* [Branching Model](./Branching-Model.md)
|
||||
Reference in New Issue
Block a user