Implement tweet embeds

[LainLayer]

Add /embed to tweet links like this http://localhost:8080/SpaceX/status/1481699225675067395/embed

made twitter embed links redirect to nitter embed links for easy replacement
/embed/Tweet.html?id=... -> i/status/.../embed

picture uses

<iframe src="http://localhost:8080/SpaceX/status/1481699225675067395/embed" width="500px" height="500px" scrolling="no" ></iframe>

[acarasimon96]

I'm sure we've noticed for so long that Nitter is lacking support for embeds. It's great to see that being implemented with this PR!

However, I have one question about this: when the hide tweet stats option is enabled in settings, would that setting affect embeds like the rest of the site?

[LainLayer]

@acarasimon96

when the hide tweet stats option is enabled in settings, would that setting affect embeds like the rest of the site?

Currently, the only thing it should support is overriding the theme through the url with ?theme=Twitter for example
We are looking into cookie bullshit to let iframes see nitter cookies and apply them inside too. currently its waiting on dom96/jester#290

[zedeus]

Future work includes an embed "builder" page accessible via the upcoming tweet context menu.

[KazamaSion]

Seems like there are still some issues here.
Corrupted page which use embed: https://conoha.mikumo.com/comic/page/17/#comic-3

Nitter version: Version 2022.01.20-d77d591 (nitter.net)
Using redirector to rewrite the requests by the following rules:
Include pattern: http(s)?:\/\/platform\.twitter\.com/embed/Tweet.html\?((.*)(&))?id=([0-9]+)(&?(.*))
Redirect to: https://nitter.net/i/status/$5/embed?$3$6
Apply to: Main window, iFrames, Scripts

Meanwhile:
I suggest implementing the widget, which is also a common case.
For example: https://wacca.marv.jp

[LainLayer]

@KazamaSion This is a closed pull request. If you found a bug please open an issue at https://github.com/zedeus/nitter/issues

This is not "corrupted". you cannot replace twitter embeds that easily. Twitter embeds are evil, and works as follows:

1. The developer pastes this into their site:

<blockquote class="twitter-tweet">
<p lang="en" dir="ltr">Falcon 9 launches 105 spacecraft to orbit and lands at Landing Zone 1 <a href="https://t.co/JapUxU6oMU">pic.twitter.com/JapUxU6oMU</a></p>
&mdash; SpaceX (@SpaceX) <a href="https://twitter.com/SpaceX/status/1481699225675067395?ref_src=twsrc%5Etfw">January 13, 2022</a>
</blockquote> 

<script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script> 

2. When the user loads the page, it loads some stinky Twitter OS on the page which unfolds into:

<iframe id="twitter-widget-0" scrolling="no" allowtransparency="true" allowfullscreen="true" class="" style="position: static; visibility: visible; width: 550px; height: 552px; display: block; flex-grow: 1;" title="Twitter Tweet" src="https://platform.twitter.com/embed/Tweet.html?dnt=false&amp;embedId=twitter-widget-0&amp;features=e30%3D&amp;frame=false&amp;hideCard=false&amp;hideThread=false&amp;id=1481699225675067395&amp;lang=en&amp;origin=file%3A%2F%2F%2Fhome%2Fanko%2Fgarbage%2Fnitter%2Fcrap%2Fembed.html&amp;theme=light&amp;widgetsVersion=75b3351%3A1642573356397&amp;width=550px" data-tweet-id="1481699225675067395" frameborder="0"></iframe>

<script async="" src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
<iframe id="rufous-sandbox" scrolling="no" allowtransparency="true" allowfullscreen="true" style="position: absolute; visibility: hidden; display: none; width: 0px; height: 0px; padding: 0px; border: medium none;" title="Twitter analytics iframe" frameborder="0"></iframe>

Basically the iframe is generated at runtime alongside deploying their analytics on the site.

The redirector probably breaks this process, is my guess, since just replacing the domain in the iframe by hand works for me.
(note that nitter embeds dont automatically adjust to height yet)

As for the widget, we are currently reworking some of nitter and waiting on a fix with Jester, before we implement more embeds.