Page MenuHomePhabricator

Support block template adaptation
Closed, ResolvedPublic

Description

As part of the template translation improvements (T139332), this ticket explores how to provide support the translation of block templates such as infoboxes. This involves providing a way to include/remove them as well as editing them in the context of a translation (allowing to compare source and translated content in a fluent experience).

A prototype allows you to try the main concept also captured below:

adapting-infobox.gif (287×480 px, 1 MB)

Design goals

  • Edit as usual. Templates contain content that users want to translate/adapt. Having an initial translation for it, getting links properly adapted and edit content as rich text is expected when manipulating the content inside a template. That is, the editing support that Content Translation provides should still be available when editing content even if it is part of a template.
  • Fluent editing. Editing in place without blocking the user contributes to a more fluent experience.
  • User control. The user should be in charge on deciding which templates to include and how to adapt them.

Proposed solution

block templates - overview.png (1×1 px, 188 KB)

I'm illustrating a solution in three scenarios:

Template cannot be adapted

unadapted-block-template.png (768×1 px, 196 KB)

  • After adding a section to translate, the translation shows a block indicating that the template was not adapted.
  • A template card in the tools panel provides options on how to adapt it:
    • "Keep original template" will keep the source template as is. After publishing, a reminder (guided tour or notification) will encourage the user to adapt the template manually.
    • "Skip template" will remove the template and skip it from being included when publishing.
  • The template card may include a link to "translate missing templates" to lead the user towards the process of providing the mapping information for this kind of templates if such process exist (as part of CSX or separate tool).

Template is adapted

adapted-block-template-selected.png (768×1 px, 296 KB)

  • By default, a block template such as an infobox can be added to the translation as any other paragraph. The equivalent template in the target language will be used and the information will be translated according to the Automatic translation" strategy used by the user (e.g., translated with Apertium or using source text).
  • When the template is added to the translation, it becomes in the selected state (notice the blue highlight), and one more click will trigger the editing mode (more on this later).
  • A special template card will show the corresponding templates and provide control on the template presence (adapt, keep original or skip).

Editing a template

adapted-block-template-hover.png (768×1 px, 194 KB)

  • When the template is not the active paragraph, hovering the template will invite the user to edit its contents. Clicking will change the template to the selected mode.

adapted-block-template-selected.png (768×1 px, 296 KB)

  • The selected mode provides information and actions at the template level, and provides access to the editing mode.
  • The editing mode actions should be accessible though keyboard interactions (delete would change the strategy to "skip template" and enter would go to the editing mode).
  • Clicking outside the paragraph will make the template to become unselected.

adapted-block-template-editing-mode.png (820×1 px, 138 KB)

  • Editing mode a layer under the document to edit the internals of the template.
  • Template content is presented as a connected list of rich text editable sections with a label. Users can edit their content but not the labels.
  • For block templates, the editing mode replaces the rendered template (this is different for inline templates T144004).
  • In editing mode, both source and target templates are presented in this tabular format (only target being editable).
  • Sections are aligned between source and target templates. The equivalent parameters are shown side by side and editing the target content will make both expand to keep them aligned.
  • Only the parameters used in the source will be shown in the target. The target template will have a "View more properties" that will list the remaining parameters for the target template. This allows the user to fill some parameters that do not exist in the source (or were not filled) but are necessary for the target wiki.
  • There will be only one template in edit mode at a time. Moving out of the section or editing a different template will restore the template to display mode. Similarly, editing a template inside a template will replace the whole block (the back action can be used to go back to the previous context).

Event Timeline

The icons used for the templates are the regular and broken puzzle icons:

@Pginer-WMF, a question on

"Keep original template" will keep the source template as is. After publishing, a reminder (guided tour or notification) will encourage the user to adapt the template manually.
"Skip template" will remove the template and skip it from being included when publishing.

I remember you mentioning about "Skip template" is like "Do not use MT" in MT card for paragraphs. The resulting action is an empty section, editable.(Please confirm if this understanding is correct)

If so, a user can switch between the above two options - keep-original, skip . Do we expect the edits to preserved between this switches? Edits can happen to the empty paragraph(if we provide that)

Change 305489 had a related patch set uploaded (by Santhosh):
WIP: Template card

https://gerrit.wikimedia.org/r/305489

I remember you mentioning about "Skip template" is like "Do not use MT" in MT card for paragraphs. The resulting action is an empty section, editable.(Please confirm if this understanding is correct)

If so, a user can switch between the above two options - keep-original, skip . Do we expect the edits to preserved between this switches? Edits can happen to the empty paragraph(if we provide that)

In this context I'd expect "skip template" to just produce an empty non-editable paragraph.

In terms of generated wikitext, this may mean to produce nothing (instead of an empty <p> element), but for the user we are keeping the gap there to indicate that the template they see on the left won't be included in the translation.

If there were a way to add your own template, we may consider providing some editing capabilities but currently keeping an alternate text in the same place as the template seems more likely to bring issues than being of help for users.

Pginer-WMF updated the task description. (Show Details)
Pginer-WMF updated the task description. (Show Details)
Arrbee renamed this task from Designs for block template adaptation to Support block template adaptation.Aug 30 2016, 7:08 AM
Amire80 subscribed.

Re-assigning to Santhosh, because the designs are done, and it's in the implementation phase.

@Pginer-WMF, some details are required:

  • The fields in the editor need to be in HTML and that require API requests to restbase. takes a while to get it filled. Also when you edit and close the editor, it again takes a few seconds to re-render the template in target article. Need some progress indicator
  • Template data gives description for each param fields. I render it like this. sometimes, the description is bit long. Some idea of collapsing it is required. I am using this in the code (WIP)

pasted_file (292×512 px, 86 KB)

@Pginer-WMF, some details are required:

I created separated tickets to explore and provide more details about these and related aspects:

  • The fields in the editor need to be in HTML and that require API requests to restbase. takes a while to get it filled. Also when you edit and close the editor, it again takes a few seconds to re-render the template in target article. Need some progress indicator

T145855: Design loading transitions for template translation

  • Template data gives description for each param fields. I render it like this. sometimes, the description is bit long. Some idea of collapsing it is required. I am using this in the code (WIP)

T145856: Design field editing aids for translation templates

More details to be added next

Change 308559 had a related patch set uploaded (by Santhosh):
Templates: Editing support and adaptation controls.

https://gerrit.wikimedia.org/r/308559

Change 305489 abandoned by Santhosh:
Templates: Do not remove them from source

Reason:
squashing

https://gerrit.wikimedia.org/r/305489

I'm testing the patch now, and I see a problem with section alignment:

תרגום דף – devwiki.png (933×1 px, 347 KB)

I am translating שד טסמני (Tasmanian devil) from Hebrew to English. I adapted the Taxobox (מיון) infobox template at the top, and the sections that include the infobox were not aligned. Notice how the image after the taxobox is much higher up in the translation column than in the source column.

Some comments about Patch set 49. I already posted them in Gerrit, but they may be more easily readable here, so copying:

  1. I need three clicks to actually get to the form. The first does nothing, the second shows the template card on the sidebar, and only the third one shows the form. I find this a bit confusing.
  2. The form is quite narrow vertically. For a template with a lot of parameters, like an infobox, I'd expect it to be much taller.
  3. To actually insert the template I have to press the X button. "X" is "Close". To me, a "Close" action with an "X" usually implies "Cancel", rather than "Apply", "OK" or "Insert". I'd expect to see something like an an "Insert" button, as in the VE template insertion dialog.
  4. The parameter "תמונה" (it means "image") in Hebrew appears as "270pxTemplate:ששד טסמניממלכהבעלי". I'd expect it to appear completely differently, in one of the following two ways:
    1. The wiki syntax "[[קובץ:Sarcophilus harrisii taranna edit.jpg|270px]]{{ש}}<small>שד טסמני</small>" (The word "קובץ" in the beginning is the namespace name for "File". {{ש}} is a template that inserts a line break.)
    2. As a rendered image, with a line break, a caption, etc.

If showing a rendered image is complicated, I'd really prefer the wiki syntax, and I'm sure that most users would prefer the same. Currently it's a confusing and wrong link.

See the screenshot:

צילום מסך 2016.11.02 ב.18.38.51.png (2×3 px, 497 KB)

  1. I need three clicks to actually get to the form. The first does nothing, the second shows the template card on the sidebar, and only the third one shows the form. I find this a bit confusing.

The intended design is as follows:

  • One click on an existing template highlights it in blue and shows the template-level card in the tools panel in order for you to decide how the template is adapted (or being able to delete it).
  • On a highlighted template, another click opens the editing mode where you can modify the different feileds (and a field-level card is shown in the tools panel for you to decide whether to use MT, as with a regular paragraph)
  • For the specific case of inserting the template (when the template is not yet on the translation column), clicking the translation area makes both adding and highlighting it, so you are one click away from editing.

In any case you are supposed to do three clicks. You can try this in the prototype. The last case is also illustrated in this animation:

adapting-infobox.gif (287×480 px, 1 MB)

  1. The form is quite narrow vertically. For a template with a lot of parameters, like an infobox, I'd expect it to be much taller.

The form should not have it's height restricted. It should expand the document as much as it is needed without adding another scrollbar. If it goes out of the viewport we can consider making the top part to become sticky to allow closing it at any point.

  1. To actually insert the template I have to press the X button. "X" is "Close". To me, a "Close" action with an "X" usually implies "Cancel", rather than "Apply", "OK" or "Insert". I'd expect to see something like an an "Insert" button, as in the VE template insertion dialog.

The idea of the isolation mode is to open a view on the template internals that you can modify and close. As explained above, it is not shown for inserting a template, just for modifying its content. I'm not sure how it is working in the current patchset, but let me know whether and what you find confusing in the prototype that captures the intended behaviour.

  1. The parameter "תמונה" (it means "image") in Hebrew appears as "270pxTemplate:ששד טסמניממלכהבעלי". I'd expect it to appear completely differently, in one of the following two ways:

Some template fields ask for an image, others for an image name. I'm not sure what this one does in particular, but the idea is to represent the content in rich text: if the content is an image, show the image; if the content is the image name, show it as text. I think currently we don't support well the case of templates inside other templates (T147428), which may also be related with this case.

Change 308559 merged by jenkins-bot:
Templates: Editing support and adaptation controls

https://gerrit.wikimedia.org/r/308559

Follow up: T152497.

Other than this, it appears to be done, and since that issue appears to be just a minor side idea, this can be marked as resolved.