-- | Bindings to the library, which allows easy formatting of -- numbers, dates, times, relative times, pluralization, and translated messages. This library can -- be used for formatting and pluralization even if you intend to present your application in a single -- language and locale. -- -- These bindings are for the 2.0 version of ReactIntl which is currently as a release candidate -- (I am currently using v2.0.0-rc-1). For temporary documentation, -- see . Because this is a binding to a -- release candidate, the API below might change! I consider it unlikely, but if a change is required -- I will violate the PVP and not increment the major number, just the minor number. -- -- To use these bindings, you need to provide the @ReactIntl@ variable. In the browser you can just -- load the @react-intl.min.js@ script onto the page so that @window.ReactIntl@ exists. If you are -- running in node, execute @ReactIntl = require(\"ReactIntl\");@ so that @global.ReactIntl@ -- exists. When compiling with closure, protect the ReactIntl variable as follows: -- -- >(function(global, React, ReactDOM, ReactIntl) { -- >contents of all.js -- >})(window, window['React'], window['ReactDOM'], window['ReactIntl']); -- -- __Using with a single locale and no translations__. If you intend to present your application in -- a single language, you can still use this module for formatting. Add a call to 'intlProvider_' -- to the top of your app with a hard-coded locale and @Nothing@ for the messages. You can then use -- anything in the /Formatting/ section like 'int_', 'relativeTo_', and 'message', where 'message' -- will just always use the default message provided in the source code (helpful for templating). -- If you want to specify the locale so dates and numbers are formatted in the user's locale, it is -- strongly recommended to set the locale from the server based on the @Accept-Language@ header -- and/or a user setting so that the page as a whole is consistint. I have the server set a -- variable on @window@ for the locale to use, and then pass that locale into 'intlProvider_'. -- -- __Translations__. The react-intl philosophy is that messages should be defined in the source -- code instead of kept in a separate file. To support translations, a tool (in this case Template -- Haskell) is used to extract the messages from the source code into a file given to the -- translators. The result of the translation is then used to replace the default message given in -- the source code. -- -- 1. Use the functions in the /Formatting/ section like 'int_', 'relativeTo_', and 'message' -- inside your rendering functions. -- -- 2. At the bottom of each file which contains messages, add a call to 'writeIntlMessages'. This -- is a template haskell function which during compilation will produce a file containing all the -- messages found within the haskell module. -- -- 3. Give these message files to your translators. The translation results will then need to be -- converted into javascript files in the format expected by ReactIntl, which is a javascript -- object with keys the 'MessageId's and value the translated message. For example, each translation -- could result in a javascript file such as the following: -- -- @ -- window.myMessages = window.myMessages || {}; -- window.myMessages["fr-FR"] = { -- "num_photos": "{name} {numPhotos, plural, =0 {n'a pas pris de photographie.} =1 {a pris une photographie.} other {a pris # photographies.}", -- ... -- }; -- @ -- -- 4. Based on the @Accept-Language@ header and/or a user setting, the server includes the -- appropriate translation javascript file and sets a variable on window containing the locale to -- use. Note that no translation javascript file is needed if the default messages from the -- source code should be used. -- -- @ -- \