@Mazevedo

My thinking is to try a simple approach for this round and treat this formatting toolbar as more of a shortcut to insert and display wikitext. I don't want us to actually change the styling of text within the text view at this stage - I just want to prove out some super basic native handling first. This is similar to how Android did their native editing recently.

1. Ideally have this all working self-contained as a subclass of UITextView. Then we just need to change the subclass in the talk page reply and topic locations to get this working. This also means it could be much faster building it first in a separate sample project, then you can move it over once it's working well.
2. Assign the text view's inputAccessoryView to a view containing the Bold, Italic, and Add a link buttons. We currently have a TextFormattingPlainToolbarView that you might be able to lean on from our section editor, but I'm open to creating a new simple view if it's too tricky to remove the extra buttons from this one.

Once the you have this toolbar displaying on top of the keyboard when the text view is focused, then add this logic in reaction to the buttons:

1. If the user has not selected any text and taps the bold button, insert bold wikitext marks (three apostrophes) on either side of the cursor.
2. (Nice-to-have) If the cursor already has bold wikitext marks directly surrounding the cursor and they tap the Bold button, remove the marks.
3. If the user has selected text and taps the bold button, insert bold wikitext marks on either side of the selected text.
4. (Nice-to-have) If the user has selected text and already has bold tick marks directly surrounding the selection, and user taps the bold button, remove bold wikitext tick marks from either side of the selected text.

Do the same logic with the italic button, using italic wikitext tick marks (two apostrophes).

If the user selected the link button, display our existing link wizard flow (currently in the section editor). It's hopefully already set up to construct and send back some link wikitext, where you can insert it at the cursor point.

PR https://github.com/wikimedia/wikipedia-ios/pull/4411

Note: unfortunately, at this moment, we can't add the "add image" button

@cmadeo sneak peek will be in TestFlight Experimental Build 1861. Let us know if you have early thoughts, thanks!

@Tsevener + @Mazevedo thank you so much for the experimental build. So far things are working well with the addition of styling, but the removal and editing has a few small notes:

• Toggling between styled and un-styled (eg. bolding and unbolding text) has a slightly different logic than the article editing view. Currently it works well if the whole styled string is highlighted, but tapping the beginning or end of a string results in just some of the wikitext and tapping in the middle of the string results in nested wikitext.

Tapping bold again at the end of the string	Tapping bold again in the middle of the string

• The search from the link button requires making a change to the text in order to search. If you currently highlight a word in the talk page message it will open the search view, but even after tapping 'search' the search is not run, it requires editing the string to search. Sorry for the subject matter of the search, based on the article of the day on EN wiki.

Link search - please tap on gif if it does not play automatically

In the future it'd be great to preview the styling and have syntax highlighting (similar to our article editor), but I've noted Toni's comment above and so this is not needed for this iteration :)

Hi @cmadeo! Thanks for the feedback.

Toggling between styled and un-styled (eg. bolding and unbolding text) has a slightly different logic than the article editing view.

Got it - we'll see what we can do!

The search from the link button requires making a change to the text in order to search.

Thanks! @Mazevedo noticed that earlier, but I dismissed it when I saw that our current section editor has the same bug. I'll spin off a separate bug task (added here) for it so that we can fix them in both places together.

In the future it'd be great to preview the styling and have syntax highlighting

Definitely agreed - luckily Android has accomplished this already natively, so I'm hopeful that in a later iteration we can see how they did it and follow suit.

Perfect, thanks Toni!

@cmadeo I think we've worked out more of the kinks you found, let us know how it feels in the main app (starting with TestFlight build 7.1.0 2017). I can think of 4 separate Phab tasks that we could add to improve this flow and get closer to the original design - happy to make those if y'all want!

1. Add syntax highlighting (that is, coloring of the wikitext and formatting of the text itself like bold).
2. Add a way to preview the styling of the comment or topic before publishing. There's a discussiontoolspreview API that could help (source).
3. Parse and display images in talk page topics & replies. (pre-requisite to #4).
4. Add insert image button & wizard flow to formatting toolbar.

Looks good to me on 7.2.0 (2028)

Note: I have added followup tasks for some of the original asks in this ticket:

https://phabricator.wikimedia.org/T329843
https://phabricator.wikimedia.org/T329844
https://phabricator.wikimedia.org/T329846
https://phabricator.wikimedia.org/T329841