Tool to organize translations in JSON files [closed]

I have not tried it (yet) but this might work: https://github.com/jcbvm/i18n-editor

Written in Java, so will (most probably) work on a Mac.

I needed the same thing myself and so I just wrote it like this:

I had 2 dropdowns with existing languages, from language 1 to language 2 was the idea.

on select both language I read the json files into arrays and displayed it with an ng-repeat using two way bindings so when the content of an input field changed, the array got updated instantly.

The apply method then uploaded the filename and the array towards a php file which wrote it to the document.

eng.json:

{  "ALBUM":{    "TITEL":"album",    "LAAD_MEER":"Load more",    "ALBUMS":"Back to albums"  },  "INFO":{    "TITEL":"information",    "HOTELS":"Hotels",    "SPORTHAL":"Sportscenter",    "INTHISHOTEL":"In this facility"  }}

my html:

<section ng-if="toSelected"         class="bg-g-r bg-u-1 card flyin"         ng-repeat="section in fromContents"         id="{{'trans'+section.TITEL}}"         class="translatorSection">    <p class="paddedText bg-u-1 blueElement">{{section.TITEL}}</p>    <div class="textContainer bg-u-1"         ng-repeat="line in section">        <p style="color:grey">{{line}}</p>        <textarea class="bg-u-1" ng-model="toContents[getKeys(toContents,$parent.$index)][getKeys(section,$index)]"                style="padding: 8px;border-radius: 10px"                ></textarea>    </div></section>

my controller:

//Bound to the dropdowns in my case$scope.fromSelected = null; //language from wich to start$scope.toSelected = null; //language i wish to extend$scope.fromContents = null;$scope.toContents = null;$scope.$watch('fromSelected', function (abbr) {    if(abbr) {        jsonFactory.getLanguageContents(abbr).then(function (data) {            $scope.fromContents = data.data;        });    }});$scope.$watch('toSelected', function (abbr) {    if(abbr) {        jsonFactory.getLanguageContents(abbr).then(function(data){            $scope.toContents = data.data;        });    }});$scope.getKeys = function (array,index){    return Object.keys(array)[index];};$scope.getToValueByKey = function (key){    return $scope.toContents[key];};$scope.apply = function (){                jsonFactory.UploadLanguage($scope.toSelected,$scope.toContents)        .then(function(data){            alert('update succesfull, please reload')        });};

Jsonfactory:

    function getLanguageContents(lang) {        var deferred = $q.defer(),            httpPromise = $http.get('languages/'+lang+'.json');        httpPromise.then(function (response) {            deferred.resolve(response);        }, function (error) {            console.error(error);        });        return deferred.promise;    }       function UploadLanguage(lang,content){            return $q(function(resolve,reject){                var xmlhttp,                    params = 'lang='+lang+'&content='+JSON.stringify(content);                if (window.XMLHttpRequest) { // code for IE7+, Firefox, Chrome, Opera, Safari                    xmlhttp = new XMLHttpRequest();                }                else { // code for IE6, IE5                    xmlhttp = new ActiveXObject('Microsoft.XMLHTTP');                }                xmlhttp.open('POST', 'http://localhost:63342/website/app/php/translator.php', true);                xmlhttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');                xmlhttp.onreadystatechange = function() {                    if (xmlhttp.readyState === 4 && xmlhttp.status === 200) {                        var data = xmlhttp.responseText;                        resolve(data);                    }else if (xmlhttp.readyState === 4){                        reject('not found');                    }                };                xmlhttp.send(params);            });        }

Read you folder with json files in javascript into some arrays, For each array just create an ng-repeat using input fields so you see the key and all you translations with it, when you made changes create a button that sends you array and the language filename to this php script:(i only accept one language at the time)

<?php  header("Access-Control-Allow-Origin: *");  $taal = $_POST["lang"];  $content = $_POST["content"];  $myfile = fopen("../languages/".$taal.".json", "w");  fwrite($myfile, $content);  fclose($myfile);  echo $taal;  echo $content;?>

It was actually very easy to create, I wanted to add it to my site, so everyone could help translating but it never got there.

I cant give all the code, but i thik this should get you started.

Take a look at angular-translate: https://github.com/angular-translate/angular-translate

for all DIY folks:

You can find localized files for angular: here

These files will help you with the build-in angular filters: date, currency and number. Amazing... so far.

Now you want to use your own texts, than all you need is the power of angular.js dependency injection. Create a new file like: "myTexts_en_us.js" and use $provide.value like this:

$provide.value("myTexts", {firstText : "This is my localized text"});

For details: http://jsfiddle.net/4tRBY/24/

For real-world-use, you should add a filter: http://jsfiddle.net/4tRBY/41/

Tips:

• Make sure to insert your new localization-file into your html by hand, JS or Server. (Server is the best choice here!)
• if you include one of the angular-local files, you do not need to set it up in your app module. (you will have $locale automatically - see the fiddle)
• add an id key to your $provide-value - and set the value to a language code you are using in your file - this will be come in handy for testing.