<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>Jaggery - Delicious Javascript</title>
    <meta name="description" content="">
    <meta name="author" content="">

    <!-- Le HTML5 shim, for IE6-8 support of HTML elements -->
    <!--[if lt IE 9]>
    <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->

    <!-- Le styles -->
    <link href="../css/bootstrap.css" rel="stylesheet">
    <style type="text/css">
        body {
            padding-top: 60px;
        }
    </style>
    <link href="../css/prettify.css" rel="stylesheet">
    <!-- Le fav and touch icons -->
    <link rel="shortcut icon" href="../images/favicon.ico">
    <link rel="apple-touch-icon" href="../images/apple-touch-icon.png">
    <link rel="apple-touch-icon" sizes="72x72"
          href="../images/apple-touch-icon-72x72.png">
    <link rel="apple-touch-icon" sizes="114x114"
          href="../images/apple-touch-icon-114x114.png">
</head>

<body>

<%
include('/includes/topnavi.jag');
%>

<div class="container-fluid" style="width: 960px; margin: auto;">
    <div class="row">
        <div class="span16">
            <div class="page-header">
                <h1>
                    Documentation
                    <small>API documentation for Jaggery.js</small>
                </h1>
            </div>
        </div>
    </div>

    <div class="row">
        <div class="span4">
            <div class="well">
                <%
                include('/includes/navi.jag');
                %>

            </div>

        </div>
        <div class="span12">
            <div class="content" id="stringify" name="stringify">
                <h3>i18n</h3>

    <pre class="prettyprint linenums">
&lt%
var i18n = require("i18n");
i18n.init(request);
%&gt
</pre>
<pre class="prettyprint linenums">
&lt%
print(i18n.localize("greetings.local", "Greetings from Jaggery"));
%&gt
</pre>


                <% hasMembers = true; %>
                <div id="pageLinks">
                    <a class="navilink" href="#overview">Overview</a>
                    <%if(hasMembers) {%>
                    <a class="navilink" href="#members">Members</a>
                    <%}%>
                    <%if(hasOps) {%>
                    <a class="navilink" href="#operations">Operations</a>
                    <%}%>
                </div>

                <section id="overview">

                    <h4>Overview</h4>
                    <p class="description"><code>i18n</code> provides the ability to internationalize text in webapps </p>

                    <p class="description">The content related to localization, need to be placed as json files with the name
                     <code>locale_{language_code}.json</code>, i.e french locale file will be <code>locale_fr.json</code>
                        The content is in JSON which will have simple key-vale pairs like follows.
                        <pre class="prettyprint">
{
   "greetings.local": "Français - Démo de l10n.js",
   "info.local": "Vous lisez une localisation en français de cette page."  }
                        </pre>
                    </p>


                </section>
                <section id="members">
                    <h4>Members</h4>


                    <table class="clsStd member-table">

                        <tbody>

                        <tr>

                            <th>Member</th>
                            <th>Type</th>
                            <th>Description</th>

                        </tr>

                        <tr>

                            <td><code>localeResourcesBasePath</code></td>
                            <td>String</td>
                            <td><pre class="prettyprint">i18n.localeResourcesBasePath</pre>
                                Sets base path for locale resources
                            </td>

                        </tr>

                        </tbody>
                    </table>

                </section>
                <section id="operations">
                    <h4>Operations</h4>
                    <table class="clsStd operations-table">

                        <tbody>

                        <tr>

                            <th>Member</th>
                            <th>Returns</th>
                            <th>Description</th>

                        </tr>

                        <tr>
                            <td><code>init(request)</code></td>
                            <td>none</td>
                            <td>initialize i18n object with the request<br><br>
                                <pre class="prettyprint">
var i18n = require("i18n");
i18n.init(request);
</pre>
                            </td>
                        </tr>
                        <tr>

                            <td><code>localize(key, fallback)</code></td>
                            <td>String</td>
                            <td>Returns the localized string, if not provided the fallback text<br><br>
                            <pre class="prettyprint">
print(i18n.localize("greetings.local", "Greetings from Jaggery"));
</pre>

                            </td>

                        </tr>

                        </tbody>
                    </table>
                </section>

            </div>
            <!-- /JSON div -->
            <br>
            <br>
        </div>

    </div>
    <%
    include('/includes/footer.jag');
    %>

</div>
<%
include('/includes/scripts.jag')
%>
<!-- /container -->

<script>
    $(document).ready(function(){
        $('#i18n').toggleClass('active')
        $('#docs').addClass('active')
    })

</script>
</body>
</html>
