View on GitHub

internationalisation

Expand your audience

Project status

npmnpm downloads

build

check typeslinttest

code coverage

documentation website

Use case

A jQuery plugin to replace alternate version of text for client side internationalisation.

Installation

Classical dom injection

You can simply download the compiled version as zip file here and inject it after needed dependencies:

<script
    src="https://code.jquery.com/jquery-3.6.0.min.js"
    integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4="
    crossorigin="anonymous"
></script>
<script
    src="https://torben.website/clientnode/data/distributionBundle/index.js"
></script>
<!--Inject downloaded file:
<script src="index.js"></script>
-->
<!--Or integrate via cdn:-->
<script
    src="https://torben.website/internationalisation/data/distributionBundle/index.js"
></script>

The compiled bundle supports AMD, commonjs, commonjs2 and variable injection into given context (UMD) as export format: You can use a module bundler if you want.

Package managed and module bundled

If you are using npm as package manager you can simply add this tool to your package.json as dependency:

...
"dependencies": {
    ...
    "internationalisation": "latest",
    ...
},
...

After updating your packages you can simply depend on this script and let a module bundler do the hard stuff or access it via an exported variable name in given context.

...
import Language from 'internationalisation'
class SpecialLanguage extends Language...
Language({options..})
// or
import {$} from 'internationalisation'
$.Language()
class SpecialLanguage extends $.Language.class ...
// or
Language = require('internationalisation').default
value instanceof Language
// or
$ = require('internationalisation').$
$.Language()
...

Usage

To add two versions of a text string you can simply add your translation directly in markup. See how easy it is:

<p>
    Your englisch version.
    <!--deDE:Ihre deutsche Variante.-->
    <!--frFR:
        Sa version française.
    -->
</p>

Sometime you need to explicit mark a text node as text to replace with next translation node. In this case you can simple wrap a self defined dom node.

<lang-replace>
    Your englisch version with <strong>dom nodes</strong> inside.
</lang-replace>
<!--deDE:
    Ihre deutsche Variante mit eingebetteten <strong>dom Knoten</strong>.
-->
<!--frFR:
    Votre version français <strong>dom nodes</strong> à l'intérieur.
-->

It is also possible to use an alternative replacement node.

<lang-replace>
    Your englisch version with <strong>dom nodes</strong> inside.
</lang-replace>
<lang-replacement>deDE:
    Ihre deutsche Variante mit eingebetteten <strong>dom Knoten</strong>.
</lang-replacement>
<lang-replacement>frFR:
    Votre version français <strong>dom nodes</strong> à l'intérieur.
</lang-replacement>

Usually the language dom node precedes the text node to translate. It is possible to write a special syntax to use a replacement for the next dom node containing text.

<!--|deDE:Ihre deutsche Variante.--><!--|frFR:Votre version français.-->
<p>Your englisch version.</p>

Its possible to save one translation once if you specify the area with known translations.

<!--The "div.toc" selector defines the default known language area.-->
<div class="toc">
  <ul>
    <li><a href="title-1">title 1</a></li>
      <ul>
        <li><a href="title-2">title 2</a></li>
      </ul>
  </ul>
</div>
<h1 id="title-1">title 1<!--deDE:Titel 1--><!--frFR:titre 1--></h1>
<h2 id="title-2">title 2<!--deDE:Titel 2--><!--frFR:titre 2--></h2>

With the below initialisation you can simple add this links everywhere in your page to switch language. On click you will switch the current language interactively. Try it by yourself:

<a href="#language-deDE">de</a>
<a href="#language-enUS">en</a>
<a href="#language-frFR">fr</a>

Here you can see a complete initialisation example with all available options to initialize the plugin with different configuration.

<script
    src="https://code.jquery.com/jquery-3.6.0.min.js"
    integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4="
    crossorigin="anonymous"
></script>
<script
    src="https://torben.website/clientnode/data/distributionBundle/index.js"
></script>
<script
    src="https://torben.website/internationalisation/data/distributionBundle/index.js"
></script>

<script>
    $(($) => $.Language({
        domNodeSelectorPrefix: 'body',
        default: 'enUS',
        selection: [],
        initial: null,
        templateDelimiter: {pre: '{{', post: '}}'},
        fadeEffect: true,
        textNodeParent: {
            showAnimation: [{opacity: 1}, {duration: 'fast'}],
            hideAnimation: [{opacity: 0}, {duration: 'fast'}]
        },
        preReplacementLanguagePattern: '^\\|({1})$',
        replacementLanguagePattern: '^([a-z]{2}[A-Z]{2}):((.|\\s)*)$',
        currentLanguagePattern: '^[a-z]{2}[A-Z]{2}$',
        replacementDomNodeName: ['#comment', 'lang-replacement'],
        replaceDomNodeNames: ['#text', 'lang-replace'],
        toolsLockDescription: '{1}Switch',
        languageHashPrefix: 'language-',
        currentLanguageIndicatorClassName: 'current',
        sessionDescription: '{1}',
        languageMapping: {
            deDE: ['de', 'de_de', 'de-de', 'german', 'deutsch'],
            enUS: ['en', 'en_us', 'en-us'],
            enEN: ['en_en', 'en-en', 'english'],
            frFR: ['fr', 'fr_fr', 'fr-fr', 'french']
        },
        onSwitched: $.noop(),
        onEnsured: $.noop(),
        onSwitch: $.noop(),
        onEnsure: $.noop(),
        domNode: {knownTranslation: 'div.toc'}
    }))
</script>

About this website

Provider of https://torben.website/internationalisation :
Torben Sickert
Waldstraße 29
791194 Gundelfingen i.Br.
Phone: +49 (0) 176 / 10 248 185
Email:
info@torben.website
Website: https://torben.website
home

Disclaimer

Liability for content

Die Inhalte unserer Seiten wurden mit größter Sorgfalt erstellt. Für die Richtigkeit, Vollständigkeit und Aktualität der Inhalte können wir jedoch keine Gewähr übernehmen. Als Diensteanbieter sind wir gemäß § 7 Abs.1 TMG für eigene Inhalte auf diesen Seiten nach den allgemeinen Gesetzen verantwortlich. Nach §§ 8 bis 10 TMG sind wir als Diensteanbieter jedoch nicht verpflichtet, übermittelte oder gespeicherte fremde Informationen zu überwachen oder nach Umständen zu forschen, die auf eine rechtswidrige Tätigkeit hinweisen. Verpflichtungen zur Entfernung oder Sperrung der Nutzung von Informationen nach den allgemeinen Gesetzen bleiben hiervon unberührt. Eine diesbezügliche Haftung ist jedoch erst ab dem Zeitpunkt der Kenntnis einer konkreten Rechtsverletzung möglich. Bei Bekannt werden von entsprechenden Rechtsverletzungen werden wir diese Inhalte umgehend entfernen.

Liability for links

Unser Angebot enthält Links zu externen Webseiten Dritter, auf deren Inhalte wir keinen Einfluss haben. Deshalb können wir für diese fremden Inhalte auch keine Gewähr übernehmen. Für die Inhalte der verlinkten Seiten ist stets der jeweilige Anbieter oder Betreiber der Seiten verantwortlich. Die verlinkten Seiten wurden zum Zeitpunkt der Verlinkung auf mögliche Rechtsverstöße überprüft. Rechtswidrige Inhalte waren zum Zeitpunkt der Verlinkung nicht erkennbar. Eine permanente inhaltliche Kontrolle der verlinkten Seiten ist jedoch ohne konkrete Anhaltspunkte einer Rechtsverletzung nicht zumutbar. Bei Bekanntwerden von Rechtsverletzungen werden wir derartige Links umgehend entfernen.

Copyright

Die durch die Seitenbetreiber erstellten Inhalte und Werke auf diesen Seiten unterliegen dem deutschen Urheberrecht. Die Vervielfältigung, Bearbeitung, Verbreitung und jede Art der Verwertung außerhalb der Grenzen des Urheberrechtes bedürfen der schriftlichen Zustimmung des jeweiligen Autors bzw. Erstellers. Downloads und Kopien dieser Seite sind nur für den privaten, nicht kommerziellen Gebrauch gestattet. Soweit die Inhalte auf dieser Seite nicht vom Betreiber erstellt wurden, werden die Urheberrechte Dritter beachtet. Insbesondere werden Inhalte Dritter als solche gekennzeichnet. Sollten Sie trotzdem auf eine Urheberrechtsverletzung aufmerksam werden, bitten wir um einen entsprechenden Hinweis. Bei Bekanntwerden von Rechtsverletzungen werden wir derartige Inhalte umgehend entfernen.

Privacy Policy

Die Nutzung unserer Webseite ist in der Regel ohne Angabe personenbezogener Daten möglich. Soweit auf unseren Seiten personenbezogene Daten (beispielsweise Name, Anschrift oder E-Mail-Adressen) erhoben werden, erfolgt dies, soweit möglich, stets auf freiwilliger Basis. Diese Daten werden ohne Ihre ausdrückliche Zustimmung nicht an Dritte weitergegeben. Wir darauf hin, dass die Datenübertragung im Internet (z.B. bei der Kommunikation per E-Mail) Sicherheitslücken aufweisen kann. Ein lückenloser Schutz der Daten vor dem Zugriff durch Dritte ist nicht möglich. Der Nutzung von im Rahmen der Impressumspflicht veröffentlichten Kontaktdaten durch Dritte zur Übersendung von nicht ausdrücklich angeforderter Werbung und Informationsmaterialien wird hiermit ausdrücklich widersprochen. Die Betreiber der Seiten behalten sich ausdrücklich rechtliche Schritte im Falle der unverlangten Zusendung von Werbeinformationen, etwa durch Spam-Mails, vor.

Privacy Statement for using Google Analytics

Diese Website benutzt Google Analytics, einen Webanalysedienst der Google Inc. ("Google"). Google Analytics verwendet sog. "Cookies", Textdateien, die auf Ihrem Computer gespeichert werden und die eine Analyse der Benutzung der Website durch Sie ermöglichen. Die durch den Cookie erzeugten Informationen über Ihre Benutzung dieser Website werden in der Regel an einen Server von Google in den USA übertragen und dort gespeichert. Im Falle der Aktivierung der IP-Anonymisierung auf dieser Webseite wird Ihre IP-Adresse von Google jedoch innerhalb von Mitgliedstaaten der Europäischen Union oder in anderen Vertragsstaaten des Abkommens über den Europäischen Wirtschaftsraum zuvor gekürzt. Nur in Ausnahmefällen wird die volle IP-Adresse an einen Server von Google in den USA übertragen und dort gekürzt. Im Auftrag des Betreibers dieser Website wird Google diese Informationen benutzen, um Ihre Nutzung der Website auszuwerten, um Reports über die Websiteaktivitäten zusammenzustellen und um weitere mit der Websitenutzung und der Internetnutzung verbundene Dienstleistungen gegenüber dem Websitebetreiber zu erbringen. Die im Rahmen von Google Analytics von Ihrem Browser übermittelte IP-Adresse wird nicht mit anderen Daten von Google zusammengeführt. Sie können die Speicherung der Cookies durch eine entsprechende Einstellung Ihrer Browser-Software verhindern; wir weisen Sie jedoch darauf hin, dass Sie in diesem Fall gegebenenfalls nicht sämtliche Funktionen dieser Website vollumfänglich werden nutzen können. Sie können darüber hinaus die Erfassung der durch das Cookie erzeugten und auf Ihre Nutzung der Website bezogenen Daten (inkl. Ihrer IP-Adresse) an Google sowie die Verarbeitung dieser Daten durch Google verhindern, indem Sie das unter dem folgenden Link verfügbare Browser-Plugin herunterladen und installieren.

Copyright Statement

Unless noted otherwise, all artwork on this website is protected property of the website author. Any use for commercial purpose, reproduction and publication requires the author's written permission. Commercial work created in cooperation or bound by contract with third parties are specifically marked. Respective copyrights apply.

top