Add documentation for translations

Author: filips123

contributing.md

@@ -11,6 +11,7 @@ If these doesn't answer your question
 * Use [our Slack](https://bit.ly/plyr-chat) if you need help using Plyr or have questions about Plyr.
 
 ## Commenting
+
 When commenting, keep a civil tone and stay on topic. Don't ask for [support](#support), or post "+1" or "I agree" type of comments. Use the emojis instead.
 
 Asking for the status on issues is discouraged. Unless someone has explicitly said in an issue that it's work in progress, most likely that means no one is working on it. We have a lot to do, and it may not be a top priority for us.
@@ -38,3 +39,15 @@ Please follow the instructions in our issue templates. Don't use github issues t
 * When finished, push the changes to your GitHub repository and send a pull request to **develop**. Describe what your PR does.
 
 * If the Travis build fails, or if you get a code review with change requests, you can fix these by pushing new or rebased commits to the branch.
+
+## Contributing translations
+
+* Fork Plyr, and create a new branch in your fork, based on the **develop** branch
+
+* Make and translate language file `src/locales/{lang}.js`, where `{lang}` is two-letter language code from [ISO 639-1](https://en.wikipedia.org/wiki/List_of_ISO_639-1_codes). It is recommended to copy and edit English translation.
+
+* Add your language to `src/locales/index.js`. Make sure to import your file and follow the file format. The entry `name` should be native name of language.
+
+* Test your changes.
+
+* When finished, commit and push the changes to your GitHub repository and send a pull request to **develop**.

readme.md

@@ -21,11 +21,11 @@ A simple, lightweight, accessible and customizable HTML5, YouTube and Vimeo medi
 -   **[Events](#events)** - no messing around with Vimeo and YouTube APIs, all events are standardized across formats
 -   **[Fullscreen](#fullscreen)** - supports native fullscreen with fallback to "full window" modes
 -   **[Shortcuts](#shortcuts)** - supports keyboard shortcuts
+-   **[Internationalization (i18n)](#internationalization)** - supports internationalization of controls
 -   **Picture-in-Picture** - supports Safari's picture-in-picture mode
 -   **Playsinline** - supports the `playsinline` attribute
 -   **Speed controls** - adjust speed on the fly
 -   **Multiple captions** - support for multiple caption tracks
--   **i18n support** - support for internationalization of controls
 -   **No dependencies** - written in "vanilla" ES6 JavaScript, no jQuery required
 -   **SASS** - to include in your build processes
 
@@ -286,6 +286,7 @@ Note the single quotes encapsulating the JSON and double quotes on the object ke
 | `debug`              | Boolean                    | `false`                                                                                                                        | Display debugging information in the console                                                                                                                                                                                                                                                                                                                           |
 | `controls`           | Array, Function or Element | `['play-large', 'play', 'progress', 'current-time', 'mute', 'volume', 'captions', 'settings', 'pip', 'airplay', 'fullscreen']` | If a function is passed, it is assumed your method will return either an element or HTML string for the controls. Three arguments will be passed to your function; `id` (the unique id for the player), `seektime` (the seektime step in seconds), and `title` (the media title). See [controls.md](controls.md) for more info on how the html needs to be structured. |
 | `settings`           | Array                      | `['captions', 'quality', 'speed', 'loop']`                                                                                     | If you're using the default controls are used then you can specify which settings to show in the menu                                                                                                                                                                                                                                                                  |
+| `language`           | String                     | `en`                                                                                                                           | Language code (ISO 639-1) for UI internationalization.                                                                                                                                                                                                                                                                                                                 |
 | `i18n`               | Object                     | See [defaults.js](/src/js/config/defaults.js)                                                                                  | Used for internationalization (i18n) of the text within the UI.                                                                                                                                                                                                                                                                                                        |
 | `loadSprite`         | Boolean                    | `true`                                                                                                                         | Load the SVG sprite specified as the `iconUrl` option (if a URL). If `false`, it is assumed you are handling sprite loading yourself.                                                                                                                                                                                                                                  |
 | `iconUrl`            | String                     | `null`                                                                                                                         | Specify a URL or path to the SVG sprite. See the [SVG section](#svg) for more info.                                                                                                                                                                                                                                                                                    |
@@ -619,6 +620,12 @@ document then the shortcuts will work when any element has focus, apart from an
 
 Fullscreen in Plyr is supported by all browsers that [currently support it](http://caniuse.com/#feat=fullscreen).
 
+## Internationalization
+
+Internationalization (i18n) language could be specified with `language` option. It will translate all controls in Plyr. If the language is not specified, it will default to English.
+
+If you want custom internationalization values, you should specify them to `i18n` option.
+
 ## Browser support
 
 Plyr supports the last 2 versions of most _modern_ browsers.