Js41637 / Overwatch-Item-Tracker

Overwatch Item Tracker - Track what event items you have unlocked
https://js41637.github.io/Overwatch-Item-Tracker/
Other
242 stars 58 forks source link

Translation for other languages #24

Open Shinigami92 opened 7 years ago

Shinigami92 commented 7 years ago

Hi, I love what you have done
I'm a german native and I play Overwatch also in german.
My problem is/was that I need to translate in mind the Itemname from left screen to right screen ^^
So I started at supporting you -> https://github.com/Shinigami92/Overwatch-Item-Tracker and implement angular translate

Halloween 2016 + Settings change language already working :) But now I'm tired and go to bed ^^' I think I can complete it tomorrow Have a greate day

Js41637 commented 7 years ago

Hey this is a great idea and i'm all for it, slight problem however is the way my data is setup does not allow for this. All data in updates.json and ./js/data.js are automatically generated so they cannot be edited or it will get overwritten. Unfortunately I probably won't be able to get this resolved for this event however I will definitely look into my scripts that generate the data to allow for translations and to automatically generate a language file.

Shinigami92 commented 7 years ago

I use the following script to generate the language-files:

<pre id="output"></pre>

<script>
var output = document.getElementById("output");
console.log(output);

var data = {
  "HALLOWEEN_2016": {
    "skinsEpic": [
      {
        "hero": "Reinhardt",
        "name": "Coldhardt",
        "id": "reinhardt-coldhardt",
        "quality": "epic",
        "img": "./resources/updates/HALLOWEEN_2016/skinsEpic/reinhardt-coldhardt.jpg"
      }
    ]
  }
};

String.prototype.replaceAll = function(target, replacement) {
  return this.split(target).join(replacement);
};

output.innerHTML = '{\n';
Object.keys(data).forEach(event => {
  Object.keys(data[event]).forEach(type => {
    data[event][type].forEach(item => {
      var langKey = event + '.' + type + '.' + item.id;
      var translation = item.name.replaceAll('"', '\\\"');
      output.innerHTML += '  "' + langKey + '": "' + translation + '",\n';
    });
    output.innerHTML += '\n';
  });
});
output.innerHTML += '}\n';
</script>

So currently I use the name-key as the langKey
Maybe we can generate the data later with this langKey

In the html views the langKey is translated with {{skin.name|translate}}

... I'm in school XD, see you tonight

Shinigami92 commented 7 years ago

I have setup a merge request. So next steps: How do you generate the updates.json? Do you have a way to do this in the same way for german? Otherwise I have to write all the translations manually :(

also other languages can be added with the script in /locales/language-generator.html this script only writes every langkey:translation onto the screen -> then copy this to editor, format it and make some spaces between each itemtype (output is sorted!)

when other langKey-file was added, don't forget to add a langKey to $rootScope.languages = [{ id: 'de_DE', label: 'German' }, { id: 'en_US', label: 'English US' }]; main.js#75

Shinigami92 commented 7 years ago

Added translation for:

Link to pull request: #35

Shinigami92 commented 7 years ago

I will wait with the regular items until you have added them to the app-view

you can now merge this to master if you want, I will support the language feature in the future for english and german (also for new events)

also I can help you with some other stuff if you want :)

P.S. can you answer my question of the static binding? (#35 commit:2164734) so I can revert the changes or let them as they are now -> you decide, its your project :)

Shinigami92 commented 7 years ago

Ok, I give up. I have reverted to static binding and hard-reload when selecting language. Perhaps language translation can still seen during this event on the website.

Js41637 commented 7 years ago

Ok so I will look into translations after the event ends, I have been looking into better ways to do this and while I won't be able to do everything, I SHOULD be able to extract the name of the items in the game for every language the game is in. Similar to how I generate my item lists based on data I extract from the game, I should be able to do the same thing but for every language and store them in JSON files. All that will be needed is for someone to translate other parts of the UI.

Shinigami92 commented 7 years ago

You dont need to do everything by yourself, we will help you with this and work as a team. Also I have build a generator for the translation files already located in the locales folder. When there is no translation for a key in german or french it always fall back to englisch (and I will take care of it, that the englisch translation is generateable with on single file call).

Second thing is: we dont need to translate the whole UI, only the itemnames are needed!

manuelcanepa commented 7 years ago

How can i help you guys? I can translate to spanish

Shinigami92 commented 7 years ago

@pythonizo thanks for your help :) But currently we have some problems here with this feature... Please read all the discussion in this merge request: #35

So now we have 4 different languages that wants to be supported! But @Js41637 has not shown much interest to merge it finally, so that we can start to create merge request related to each language or to solve upcomming bugs in this main branch.

So in the hole time, noone in the world has seen in the frontend that there is an option to switch the language :/ this isn't really motivating...

so today I will look into my merge request and I will resolve all the conflicts and make it work again. Hopfully @Js41637 will merge it then and any item that isn't translated yet will fallback to english.

Edit:

Js41637 commented 7 years ago

Hey guys sorry about this issue but there are some underlying issues that are preventing me from considering this.

So I can extract item names from the game in every language that it is available in, there's not much issue there. While I appreciate the method you used to generate the language data I already use a lot of internal tools that automatically generate my data. I would need to save a rawData file for every language, process them all into locale files and for the actual item data save the name as a language key.

The issues I have at the moment is dynamically loading the language in the app will be a significant performance hit, even if it's only loaded once using translateOnce. The app already has some performance issues and is not very well optimized like I'm already mildly annoyed and the general 'latency' that happens just when interacting with the page.

The other issue is the languages themselves. Different languages have widely ranging lengths of names which will make some things a lot longer than anticipated. The heroes page likely won't have an issue as there is a lot of spare room (apart from Sprays) however the event pages lately only just fit and are obviously designed for English, any longer and the wrapping will completely ruin the layout and look horrible.

Now I've said for a while that I want to change the way the event pages look so it can support this better and overall feel better but I've got a new job for the past few months and it hasn't left me much motivation to work on this much (as it works mostly in it's current state).

In a perfect world I would rewrite the whole app as it is quite un-optimized now as it deals with a lot of data and it just doesn't feel very responsive. I really doubt I'd get around to doing that especially with Summer Games 2017 coming up which i'm not sure how to handle that yet and probably need to do a lot of layout changes to how events look. If I used the same layout as the heroes view it would allow for a lot of variation in item names as well as some of the features the heroes pages have however I'm not sure if everyone would like it.

Sorry for rambling on, I just wanted you guys to know what was going on and i'm sorry I haven't made much work towards this.

Shinigami92 commented 7 years ago

So a nice thing by you would be to open your project so that everyone can create feature_branches and not forks this improves the ability to help your project write a CONTRIBUTING.md and start manage your project instead of doing everything by yourself ^^ (little example: https://github.com/atom/atom/blob/master/CONTRIBUTING.md) make a better workflow, use github's power you already do this a little with your mate @DirtDiglett

also explain to us how you can receive the other languages from whereever you get your data and maybe we can create together this feature dynamically

also maybe someone can redesign the hole application to component oriented design and use angular2+ or something else i'm also interested in doing something like this!

Js41637 commented 7 years ago

I really definitely cannot be bothered learning Angular 2, I only chose Angular initially because it is very simple for small applications and I wouldn't say this is a large application but there is a lot of data and angular looses performance very quickly when not done right.

All the tools I use to generate the data are in the repo under helpers. All I do is npm run gen-data. The only thing I don't commit is the rawData file. However I use Overtool to generate that. The main code is in helpers/dataMapper.js and is decently documented. It's a bit chaotic and i'd like to make it a bit more modular as there is some hardcoded stuff but it gets the job done.

Shinigami92 commented 7 years ago

@Js41637 so i think you mean this: https://github.com/overtools/OWLib/tree/master/OverTool is there anyway to download this as .exe and don't compile it by myself with VS2015?

only some thoughts: and another problem is, that everytime a new update comes out, you have to run this tool? maybe there is another way, maybe we can write something like a module to get all the data from overwatch via internet dynamically and everytime uptodate

and also very cool would be to get the players info automatically this would be result in a complete new project... doesn't have blizzard an api for this? :/ has blizzard only an api for stats? (overbuff.com, masteroverwatch.com, overwatchtracker.com ...)

Js41637 commented 7 years ago

There is no way to get a users item data from the game, I doubt there ever will be. Loading item data dynamically for updates is not going to work either as there is always some variation. While most of my tools are automated, there is usually always some manual work involved.

There are downloads for Overtool in the readme of that repo, well, just click the Build Passing which will take you to appveyor which has compiled binaries.

Shinigami92 commented 7 years ago

Oh cool, didn't know about appveyor respectively build passing

Shinigami92 commented 7 years ago

After a long search I found this one: https://github.com/jamesmcfadden/overwatch-api https://overwatch-api.net

so I think we are looking for rewards

only cons are that this isn't up to date, but when you team up with the creator maybe you can push up your two repos

Js41637 commented 7 years ago

I'd much rather be in control of the data, I can change it to suit my needs and there isn't even any problem with how it works at the moment.

VeggieGamer commented 7 years ago

Hi Shinigami (du magst Äpfel? ;-) ), Kann ich dir bei der Übersetzung helfen? Ich habe eine Aufstellung bzw. Gegenüberstellung aller Sprays, Icon, Emote, Erfolge usw. als Exceltabelle.

Shinigami92 commented 7 years ago

@VeggieGamer naja ich müsste Äpfel mögen, tu ich aber nicht ^^ Hattest du dir hier alles durchgelesen? Das aktuelle Problem ist das Js41637 der Aufwand zu viel ist. Außerdem möchte er das komplett automatisiert haben. Also generiert aus den Spieledaten. Daher ist nahezu alles was ich bisher für die Übersetzung getan habe für die Katz :/ Bei der Exceltabelle müsste man ebenfalls ein Script schreiben das die Daten benutzbar macht. Wenn du in irgendeiner weise Interesse daran hast, dann guck dir mal in meinem Fork die Dateien in /locales/ an.

palex00 commented 5 years ago

Any update on this?

Shinigami92 commented 5 years ago

@palex00 Did you translate my comment above yours for you? My interest to support this project is gone :( It also seems that this repo is based on AngularJS and support for it has been discontinued by Google for several years :/