3  Interactive Translation

 

Translators are always making choices for their audiences. Normally, these choices are made invisible to facilitate a smoother reading experience, but this practice can give readers the false impression that what they are enjoying is an unmediated “true” expression of the original text. By allowing readers to make translation choices themselves, the complexity and playfulness of texts like Le Roman de Silence may be more fully appreciated.

On this page, you decide.

mykeys = [
  "Line",
  "Roche-Mahdi (2007) OF Edition"
]; 

//create data object that contains only properties wanted
//https://stackoverflow.com/a/56592365/7694963
subset = Object.fromEntries(
  newkeys
  .filter(key => key in data) // line can be removed to make it inclusive
  .map(key => [key, data[key]])
);

//transpose data with selected columns
data_filtered = transpose(subset)

opts = [
    {alias: "Meaning", colname: "Meaning Priority Translation"},
    {alias: "Syntax", colname: "Word Order Priority Translation"},
    {alias: "Sound", colname: "Sound Priority Translation"}
  ]

//create radio button
viewof translationselected = Inputs.radio(
  opts, 
  {
    label: "What do you want to prioritize in the translation?",
    format: x => x.alias,
    value: opts[0]
  }
)

//create new keys based on radio selection
newkeys = {
  var newkeys = []
  newkeys.push(...mykeys)
  newkeys.push(translationselected.colname)
  return newkeys
}

html_table = options => html`<table>
  <thead>
    <tr>${Object.keys(options[0]).map((d, i) => {
      let label = d;
      return `<th>${label}</th>`;
    })}
  </tr>
  </thead>
  <tbody>
    ${options
      <!-- .filter((d, i) => i < 10) -->
      .map(row => {
        return html`<tr>${
        Object.values(row)
        .map(function(element, index, array){
                    if (index == 1){
                        return `<td style="width: 6cm;">${element}</td>`;
                    } else {
                        return `<td>${element}</td>`;
                    }
                })}</tr>`;
      })}
  </tbody>
  </table>
`

html_table(data_filtered)