1.0.4 • Published 6 years ago
juclientlang v1.0.4
ju Client Language
For client-side language text.
Installation
$ npm install juclientlangUsage
Example File Tree
├── node_modules
│ ├── juclientlang
├── page.build.js
├── locales
│ ├── tr.js
│ └── en.js
├── page.html
└── page.jspage.html file
<!-- lang attribute is required! -->
<!DOCTYPE html>
<html lang="tr">
<head>
<meta charset="utf-8" />
</head>
<body>
<julang text="language"></julang>
<button id="changeBtn" julang="title:title;">
<julang text="title"></julang>
</button>
<script src="./page.build.js"></script>
</body>
</html>page.js file
const juLang = require("juclientlang");
const langPath = './locales';
juLang(langPath)
.then(function () {
console.log("language loaded.");
}).catch(function (err) {
console.log(err.message);
});
document.addEventListener("juLangChanged", function (e) {
console.log(e.detail);
});
document.getElementById("changeBtn").addEventListener("click", function (e) {
var html = document.getElementsByTagName("html")[0];
if (html.attributes.lang.value == "en")
html.setAttribute("lang", "tr");
else
html.setAttribute("lang", "en");
});page.build.js file
page.build.js file is generated from page.js with libraries like browserify or babel or parcel or webpack.
Building Sample
tr.js file
var juLangObject = {
language: "Türkçe",
title: "Değiştir"
}Methods
juLang(languageScriptPath)
With the return of the Promise object, you can capture the completion of the process and errors.
Parameters:
languageScriptPath: Path of language javascript files.
juLangChanged Event
If you want to catch events after each change, use
document.addEventListener("juLangChanged", function handle(e) { ... }) handle Function Parameters:
e.detail: Event result.
Examples
Basic Usage
This example shows the most basic way of usage.
License
This software is free to use under the JosephUz. See the LICENSE file for license text and copyright information.