TW5 preview of URL

[andrew levy]

If linking to a URL is it possible to generate a preview in the tiddler of the webpage it is linking to?

thanks

andrew

[Thomas Woite]

Hi Andrew,

Not sure if this is excatctly what you are looking for:

Already checked out https://tobibeer.github.io/tw5-plugins/#preview?

Best,

Thomas

[Mat]

If linking to a URL is it possible to generate a preview in the tiddler of the webpage it is linking to?

Yes, you can use an iframe - but I don't know if there is a ready made solution for it. It would probably not be very difficult to put together, using standard html (i.e the iframe) and a TW widget or two (revealwidget) so maybe a little experimentation would be rewarding.

<:-)

[Eric Shulman]

On Friday, February 5, 2016 at 11:50:48 AM UTC-8, Thomas Woite wrote:

Not sure if this is excatctly what you are looking for:

Already checked out https://tobibeer.github.io/tw5-plugins/#preview?

The documentation for that plugin specifically says:

"...enhances the core LinkWidget to display a preview of tiddlers when hovering an internal link."

In other words, it only applies to links to other tiddlers in the document.... not to links to external URLs.

-e

[Eric Shulman]

On Friday, February 5, 2016 at 12:43:12 PM UTC-8, Mat wrote:

If linking to a URL is it possible to generate a preview in the tiddler of the webpage it is linking to?

Yes, you can use an iframe - but I don't know if there is a ready made solution for it. It would probably not be very difficult to put together, using standard html (i.e the iframe) and a TW widget or two (revealwidget) so maybe a little experimentation would be rewarding.

Although an iframe seems like it might offer a solution, it might not be suitable for a "preview" of a remote site.  Some of the factors to consider:

* the response time of the remote server

* the size of the response itself (it could be a HUGE page with lots of heavy graphics)

* rendering issues (i.e., static page layouts might not fit well in the iframe)

* "iframe bustout" methods (i.e., remote page detects iframe and forces "page takeover" instead)

* the "preview" would be *live*... allowing full interaction just by mousing inside the preview.

* if the preview is supposed to happen "on hover", and the user simply passes over a link on the way to something else, it would still trigger the iframe, even momentarily... and, since XMLHttpRequest() is asynchronous, the request would still be in process even long after the mouse has moved on from the link.

It seems to me that an iframe is entirely too much like actually clicking the link, in terms of costs and overhead.  I think a more modern approach would be to use something like meta tags with Open Graph Protocol (http://ogp.me) to fetch a remote og:image "thumbnail" to be displayed.  Note: Open Graph Protocol is used by Facebook, Twitter, Google+, LinkedIn, Pinterest, and many other sites.

The basic processing:

* on hover, make an XMLHttpRequest for the *HEAD* of the remote URL (not the body content)

* when the head of the remote URL is returned, parse it for an "og:image" meta tag

* extract the image URL from the tag

* create a popup for the link you are hovering

* render the remote image URL into the popup

While this still has some overhead for processing the XMLHttpRequest, it is considerably less data (just a few lines of text from the head of the file).

-e