Page MenuHomePhabricator

[M] Image syntax should match project default
Open, MediumPublic

Description

Background

The Add an Image task allows users to insert images into articles that do not have them. Users are not writing the wikitext for the image and its formatting, the feature creates the wikitext automatically and inserts it. The work on how & where the wikitext is inserted was coordinated here: T356819: [M] Image recommendation placement on wikitext.

We received this feedback:

When adding an image using the new edit proposal feature to German Wikipedia, the resulting syntax is not in line with the projects default syntax: | thumb | 220x124px | right
The size limitation results in small previews, there should be no size set as all (as default) as this is defined by the reader’s settings. „Right“ is not needed, as this is done by „thumb“. The syntax should be localised [[Datei:Example.png|mini|Example test]]
Version: WikipediaApp/7.5.0.3563 (iOS 17.4.1; Phone)

Requirements
  • Parity with Android's image recommendations image syntax insertion
    • If size is set as the default (220x124px), we insert it. Instead we should omit it.
    • If basic is chosen, do not insert basic as a parameter.
    • We should localize for namespace, image position (including none), and image type.
  • Image syntax insertion should be updated both in the editor flow, and in Add an Image suggested edit
Nice to have

Event Timeline

HNordeenWMF renamed this task from Image syntax does not match project default on German Wikipedia to Image syntax does not match project default .Tue, May 7, 11:53 PM
HNordeenWMF updated the task description. (Show Details)
HNordeenWMF renamed this task from Image syntax does not match project default to Image syntax should match project default .Tue, May 7, 11:55 PM

@Dbrant @cooltey @HNordeenWMF

Just updating with some quick findings and initial questions - I can do some more digging tomorrow.

iOS should be able to easily localize the syntax and omit 220x124px, sorry about missing that. I do have a question about "each local wiki's default". Where are these default rules documented? Is there a programmatic way to access the format? I'm thinking maybe there's a way to get it similar to the magic words API.

I notice that Android also adds both right and thumb, so I suspect both apps might have some default rule issues.

Example: https://de.wikipedia.org/w/index.php?title=Henry_Fine&curid=4436214&diff=244768342&oldid=243410432

Uses both mini and rechts params (DE equivalent of thumb and right)

Tsevener renamed this task from Image syntax should match project default to [M] Image syntax should match project default .Wed, May 8, 3:16 PM
Tsevener claimed this task.

Changes iOS needs to make to match Android:

  1. If size is set as the default (220x124px), we insert it. Instead we should omit it.
  2. If basic is chosen, do not insert basic as a parameter.
  3. We should localize for namespace, image position (including none), and image type.

Beyond this, I think both apps could use extra logic based on rules mentioned in Help:Images. @cooltey @Dbrant Can you let me know if my thoughts below sound right and if Android is already doing any of this? Thanks!

https://www.mediawiki.org/wiki/Help:Images

Note that when using the frame or thumb[nail] formats, the default horizontal alignment will be right for left-to-right languages, and left for right-to-left languages.

This matches the user's complaint about "right" and "thumb" being redundant. When opening up "Advanced" for the first time on an RTL language, we should be sure "Left" is selected initially instead of "Right". Then if they have chosen both "Frame" or "Thumbnail" and the associated default alignment ("Right" for LTR and "Left" for RTL), we can omit the alignment parameter. By inserting both thumb and right for all languages, we may be breaking RTL default handling.

An image with frame always ignores the size specification; the original image will be reduced if it exceeds the maximum size defined in user preferences, and the page information will display a Linter error.

If "Frame" is specified, we can omit size and prevent the user from specifying size in the UI.

The size of an image with thumb or frameless can be reduced, but cannot be enlarged beyond the original size of the image.

We could pull the image's original size, then limit the UI size selections to the original size or lower.

HNordeenWMF updated the task description. (Show Details)
HNordeenWMF updated the task description. (Show Details)

Hi @Tsevener

As discussed in the Slack/Meeting, it would be great for both apps to align the logic with the desktop visual editor -> Insert image and media -> Advanced in Media settings, and that might meet the following requirements:

If size is set as the default (220x124px), we insert it. Instead we should omit it.
If basic is chosen, do not insert basic as a parameter.

For the localized parameters, the Android app calls siteinfo with siprop=magicwords to get localized parameters.

We should localize for namespace, image position (including none), and image type.

and here is the PR that made the change: https://github.com/wikimedia/apps-android-wikipedia/pull/4074

If you are interested in checking how the Android app does the image insertion to wikitext, here is the code:
https://github.com/wikimedia/apps-android-wikipedia/blob/60da6473a246d2fddfb1d11a269e15902c6c50b1/app/src/main/java/org/wikipedia/edit/insertmedia/InsertMediaViewModel.kt#L167

All good catch(es), @Tsevener

On Android, we are indeed inserting the right parameter as the default, regardless of RTL, which is not correct. We should update our logic to omit this parameter so that it just follows the default, unless the user selects a different alignment explicitly.
As for our other parameters, I believe they are in line with what the user report expects.

Can be tested in TestFlight 7.5.1 (3601).