Giter Club home page Giter Club logo

gasp-translator's Introduction

Global-ASP Translator - Translation system for the Global African Storybook Project

The goal of this project is to build an easy-to-use and accessible translation system to automate the process of translating African Storybook Project stories into other languages for Global-ASP.

It has deliberately been kept as minimal as possible to allow translators to focus on the translation with as little distraction as possible.

You can visit the live Translator tool here.

Usage

To begin translating stories, just click on the "Translate!" button at the bottom of the page. This will open up a story from the African Storybook Project collection, with empty space on the right for you to enter your translation.

Make sure to enter your name and the language you are translating into at the top of the page. Your work will be released under the same Creative Commons license as the original story, and you will be credited for attribution using the name you select here. You can edit either field at any time, e.g. if you want to change the way you are attributed or translate into a different language.

Within the main translation area of the page, images from each page of the story will appear on the left side accompanied by the original text of that page. On the far right side is a box where you can input your translation. You can hover over the thumbnails to see larger versions of the images.

If you have completed part of a translation but want to move on to another story or close the window, the text you have entered in each box will be saved automatically on your local machine so you can return to it later. Note that it will NOT be submitted until you click on the "Review Submission" button and then finally click on "Submit Translation" to send it to Global-ASP for inclusion in the project.

When you click on the "Review Submission" button, a new text box will appear at the bottom of the screen containing the entire text of your translation. If there is anything you would like to add or change you can edit the text in the window before submitting. However, please try to avoid changing the layout or markup (e.g., pagebreaks marked by ##).

Once you are satisfied with your translation, click on the "Submit Translation" button to send it for inclusion in the Global-ASP project. You can optionally include your email address in the box above the submit button if you would like to be contacted about your translation.

Navigation

The "Next" and "Previous" buttons can be used to navigate through the available stories in the collection. All work is saved in local storage, so you can feel free to browse the collection for stories you would like to translate, even if you have partly begun another translation.

Click on the "Random Story" button to visit a random story from the collection. There are over 300 stories in the collection, all of different lengths, styles, and subject matter, so browse around until you see something you would be comfortable translating.

API

The Translator features a simple API that allows you to link directly to individual stories for translation. Just add ? and the index number of the story at the end of the url, for example:

  • https://global-asp.github.io/translator/?0030: links to translation template for story #0030

Data format

The file stories.js contains an array of JSON objects, each of which represents a story from the ASP collection. The format is described below. By replacing the data in stories.js with your own data, it is possible to use gasp-translator as a general-purpose translation tool. This has already been done as a way of providing translation from languages other than English, by generating JSON objects from e.g. French, Yoruba, or Norwegian markdown source files.

Here is a simple example from the stories.js file of a storybook represented as a JSON object:

{"i":"0253","t":"My Picture Book","a":"b|Oku Modesto|Rob Owen,Marleen Visser,Katrien Coetzer,Wiehan de Jager,Karen Lilje,Catherine Groenewald,Alice Toich","s":[{"02":"A girl"},{"03":"A bird"},{"04":"A lion"},{"05":"A cat"}]}

This has been compressed (spaces and linebreaks removed) to save space. A more human-readable representation of the same data would look like this:

{
    "i": "0253",
    "t": "My Picture Book",
    "a": "b|Oku Modesto|Rob Owen,Marleen Visser,Katrien Coetzer,Wiehan de Jager,Karen Lilje,Catherine Groenewald,Alice Toich",
    "s": [
        {
            "02": "A girl"
        },
        {
            "03": "A bird"
        },
        {
            "04": "A lion"
        },
        {
            "05": "A cat"
        }
    ]
}

Keys:

  • "i": The index number of the story
  • "t": The title of the story
  • "a": Attribution information for the story, separated by vertical bars (|)
    • A b in the initial position means that the story is licensed "CC-BY", and an n means it is licensed "CC-BY-NC"
    • The author of the story
    • The illustrator(s) of the story images
  • "s": An array of JSON objects representing the full text content of the story, with each object representing a page

License

The code portion of this project is released under the MIT license (see LICENSE file for details).

The full text of the original ASP stories is derived from the asp-source repo. All stories are Creative Commons licensed, either CC-BY or CC-BY-NC. License information is included with each file, and also displayed in gasp-translator during the translation process.

"Next", "previous", and "random" buttons are courtesy of Material Design Icons (CC-BY).

Tacit CSS by Yegor Bugayenko is licensed under MIT.

Submissions are handled by Formspree.

Pure CSS modals within the app are made possible by drublic's css-modal project.

Pure JavaScript lightbox image galleries are thanks to baguetteBox.js.

gasp-translator's People

Contributors

dohliam avatar

Stargazers

 avatar  avatar

Watchers

 avatar  avatar

gasp-translator's Issues

Double metadata in Translator

Moved from an issue reported here by @espensj:

The metadata appears twice in Translator. It can also be a bit spacious, so I suggest making it all on one line. That way the "review" button comes higher up and is more prominent.

Suggestion revision
revised

Current
screen shot 2016-04-04 at 10 45 57 pm

Translation of translator

I think we should go with a translation of the word "translator", otherwise it will break with the flow, and it looks awkward with an English word on the page. It's not like we're translating "Facebook" into Ansiktsbok". (Although some people actually call it "Fjesboka"! :)

Bug in image viewer

(Moved from here)

There is a bug in the translator image viewer for a couple of the stories – Nozibele and the three hairs and The honeyguide's revenge (here might be other stories with this problem). On pages that have more than one line, only the first line appears. it seems the problem is the use of quotation mark, which somehow breaks the text and hides it.

screen shot 2016-10-08 at 08 01 02

screen shot 2016-10-08 at 10 24 49

Andre kilde-språk

Jeg savner muligheten til å velge et annet språk enn engelsk som kildespråk (det er lettere å oversette fra bokmål til svensk enn fra engelsk).

Show/hide translated stories toggle

After some testing with the solution in #16, translator feedback suggests that a toggle to show/hide completed translations would be more effective. The "Skip translated stories" button should be modified to perform this function. It should also be moved up into the toolbar (and the Permalink button removed).

We can use the Material Icons visibility and visibility off icons for the on/off state of this toggle to fit with the rest of the toolbar.

Add images to help dialog

The help text would be easier to follow if it included images demonstrating how to use the Translator application.

URL should reflect permalink of current story

At the moment, the url doesn't change if you link directly to a story with a permalink and then click on the "next" / "previous" or "random" navigation buttons. This should be fixed.

Images flickering on resize

Some images flicker and shift rapidly between full size and thumbnail if they are at the top or bottom of the page when they are resized. The current hover feature should probably be replaced by click to open full size in a lightbox.

First page of story should be focused on navigating to new page

When pressing next/previous/random the new story opens in the same scroll position as the last one. In other words, if the user has scrolled all the way to the bottom of the story and then presses "next", the new story will open up at the bottom (the end of the story), rather than the beginning.

To do: Add focus() to the first page/box of the story when navigating.

Bug with Firefox localStorage

Firefox is not storing the value of the "language" box, and the check_lang() routine doesn't run as a result. This means that the target language entered in the language box disappears as soon as the page changes or is reloaded, and the language is also not passed to the review submission box, or the final submission form. It also means that the translator doesn't get a warning if the story has been translated into their language already. Everything works fine in Chrome and Safari, however.

Purge cached data in translator

Moved from this issue.

@espensj commented:

I would like a button to purge cached text in the translator. Now, if I want to translate a story to two or more languages, I have to delete the text for each text box manually.

I translated this into Spanish, but if I want to translate it into Farsi next, I have to delete box by box:
screen shot 2015-11-14 at 1 32 31 pm

dohliam commented:

Great idea! This should be very simple to add.

Skip translated stories

Moved from here:

I would like to see a button/link for skipping translated stories. I have to flip through 10 stories in Norwegian to get to the first that has not already been translated. Something like this:

screen shot 2016-01-17 at 11 46 51 am

Thank you page should link back to last story

After submitting a translation, the thank you page has a button that takes you back to the Translator app. Right now this just sends you back to the first story in the list and you have to click through until you reach the place where you left off. The button should link back to the story you were previously working on.

Remove "Title: " from source story column

The text "Title: " in the title row beside the actual title is confusing and is sometimes mistakenly translated into the target language. It should be removed, and the original title bolded instead.

Cache on Translator saved across languages

I translated a story from English into Norwegian, and now the same story appears in the cache (or whatever) in my browser when I translate using the Norwegian translator, which makes no sense. The browser cache should be cleared for a new language.

screen shot 2015-10-17 at 11 08 17 am

Store email address in localStorage

Some translators have complained about having to (optionally) fill in their email address each time they submit a story, since the value of the email field is not currently stored. This can be fixed by auto-updating the field in get_storage().

Indicator for whether a story has been translated already

There should be an indicator of some sort to let people know whether a story has been translated into a particular language already, so that they don't accidentally duplicate work that has already been done.

The easiest way to do this might be to import the index of translated stories from the website into a json file and show a list of completed languages at the top of the page for each story.

It probably won't be possible to actually do the comparison between the current language and already translated languages without the language names being standardized. Right now people might fill in the ISO language code, the English name of the language, the local name, or something else. There could be a dropdown menu with a list of languages, but we want to avoid limiting possible target languages to a pre-determined list, so this isn't a good solution.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.