Android-app: Show notes and hightlight (annotations support)

[tcitworld]

In the far future.

[gokceozan]

Very important feature for me.

[bdunogier]

Do we have any ideas or experiments on how this could be implemented ?

I have been looking into hypothes.is, and I gotta say that an integration would be really awesome. Given that both the internal annotation system and H do the same thing, their integration into the Android app would share a lot.

[di72nn]

I can probably add annotations sync with server, but the UI part is tricky: the app relies on WebView for displaying article content, so annotations need to be added with JavaScript, which I have limited experience with.

[bdunogier]

@di72nn would you point me to where the javascript black magic is taking place ? I'd like to have a look at it :)

[bdunogier]

I'm browsing about that a bit. First, there doesn't seem to exist _recent_ libraries focusing on that on github. There are a few that haven't moved for 3, 4 years and seem to have issues on recent android versions.

About Javascript, I have found this exchange, directly related to our issue: https://stackoverflow.com/questions/41670806/how-to-highlight-text-permanently-on-android-webview. The main challenge seems to be the storage of the highlight's coordinates (line, character, whatever). The javascript itself looks pretty straightforward.

[jalcine]

@bdunogier It looks like https://developer.mozilla.org/en-US/docs/Web/API/Window/getSelection or https://developer.mozilla.org/en-US/docs/Web/API/DocumentOrShadowRoot/getSelection can help here. I can try experimenting with this to see if we can get that kind of information (re: coordination location).

[Gryphus1ne]

Any word on this? Real note support is the only thing keeping me from being able to really use Wallabag.

[danihodovic]

This is main blocker from switching from Pocket to Wallabag.

[er314]

Same here,
not a wallabag user as the capability to make annotations is mandatory to me.

[er314]

so annotations need to be added with JavaScript, which I have limited experience with.

I think this feature on android doesn't have to follow the same visual paradigm as the wallabag webapp.
It could follow a simpler route, with :

• highlight the text selected for annotation (same rendering as text selection already in place, but with a different color)
• when a hightlighted text is clicked, show a new view (activity), which displays + allows writing/updating the annotation text

[di72nn]

Anyone interested in this feature may check out https://github.com/wallabag/android-app/pull/843#issuecomment-584673766.

[di72nn]

"Experimental" annotations support was released in 2.4.0 a couple of months ago.
Needs to be enabled in "Settings - UI - Annotations support".

One server-related issue is discussed in #1048.
The UI is very clunky, a separate issue may be open for that.