Seasoft Corporation
slang.js
slang.js is a javascript that supports the internationalization of websites.
Overview
- Feature
- How to write HTML
- Translation file
- Exchange image file
- Download
- Technical document
Copyright
The copyright of slang.js and family scripts belong to Seasoft Corporation.
This software is released under the MIT License, see License.txt.
Feature
slang.js translates and displays the contents of the homepage written in English according to the language setting of the browser.
Instead of automatic translation, if the target text is prepared in advance, the target string in HTML is replaced and displayed.
Unlike HTML, which is based on the native language, it is important that the language set in the browser to view the page is initially displayed.
The writer himself is responsible for the content of the translation.
Maintenance is also improved by separating translation file resources.
How to write HTML
The HTML description method may be easy to understand if you display the source program of this page in a browser.
Please specify HTML language.
<html lang="ja">
slang.js assumes that English(en) is specified if there is no language setting.
The following files are required to specify javascript.
<script type="text/javascript" charset="utf-8" src="/js/jquery-3.4.1.min.js"></script>
<script type="text/javascript" charset="utf-8" src="/js/RedBlackNode.js"></script>
<script type="text/javascript" charset="utf-8" src="/js/RedBlackTree.js"></script>
<script type="text/javascript" charset="utf-8" src="/js/slang_img.js"></script>
<script type="text/javascript" charset="utf-8" src="/js/slang_tree.js"></script>
<script type="text/javascript" charset="utf-8" src="/js/slang.js"></script>
Specify the 'slang' class in the body or the tag inside the body.
<body class="slang">
</body>
When grouping blocks in HTML, add id to slang-group class.
<div id='content' class="slang-group">
</div>
Translation file
The translation file is an XML format file with a language extension added to the HTML file name.
The language extension uses the first two characters of the browser language setting.
For example, the Japanese translation file name for this sentence is 'slang.html.ja'.
If you look at the actual file at the link below, you can see its structure.
https://document.seasoft.co.jp/translation/tech/slang/slang.html.ja
XML tags may not be displayed depending on the browser.
The format of the translation file is simple, just prepare the translation contents for each sentence with Group, String, Source and Dest tags.
Exchange image file
To change the image according to the language, change the folder name.
In slang_img.js, refer to the image with the same name by replacing the 'images/' folder name with the 'images_' + 'language extension'.
For example, the top image on this page is 'https://document.seasoft.co.jp/images/tech/slang/translate.png', but in Japanese, 'https://document.seasoft.co.jp/images_ja/tech/slang/translate.png'.
Download
You can download the file used on this page.
| slang.js | Seasoft language translator main body |
| slang_tree.js | Translation tree node definitions |
| slang_img.js | Image replacement script |
| RedBlackTree.js | Red-black tree script |
| RedBlackNode.js | Node definition of red-black tree |
Technical document
slang.js converts the HTML description written in English into another language, but the internal structure is string search and replacement, so it can also be used to convert from other languages to English.
If you already have a website written in Japanese, you can convert it to a site in English or another language simply by inserting the slang.js script and adding a translation file for replacement.
By specifying the language in the URL parameter lang, the page translation can be specified language.
To display this page in the specified language, write as follows.
| Japanese | https://document.seasoft.co.jp/tech/slang/slang.html?lang=ja |
|---|---|
| English | https://document.seasoft.co.jp/tech/slang/slang.html?lang=en |
For the internal structure and technical information, see the next page.