How to cast a webpage to chromecast - google-cast

I have a webpage with self-updating news and weather information. Is there an example page that is able to cast it's URL to chromecast? The browser tab casting from within Chrome can stream the content to the TV just fine, but I want to be able to turn off the PC, and leave the news and weather page on my TV.
The Chrome Sender method seems to do this, so I may be just looking for a simple webpage example. Hello world!
References:
https://developers.google.com/cast/docs/chrome_sender
https://www.youtube.com/watch?v=Qsw9Ogb6t4Y

If you're casting from Chrome, closing Chrome (including turning off your PC), will stop the cast, it doesn't matter if it's casting your tab or casting from a cast ready application/webpage.
If you want to cast your webpage, you'll need to write an application that uses a custom receiver. A custom receiver can load webpages. If it's just casting your single webpage, then just have that as the receiver. If you want to use it like a browser and cast different webpages, you can do something like have your sender pass a url to your receiver (maybe use an iframe to load the webpage on the receiver). For the latter, casting a tab is probably far better though.
I suggest you take a look at the Google Cast samples on their Github page. HelloText-Chrome is probably a good place to start, to familiarize yourself with Cast.

The following article answered my question with the CastHelloText-chrome example:
Display web sites and web apps with Chromecast

Related

Problem with insertings gifs (giphy api) in context script popup

I'm working with chrome extension to use giphy API. Basically user from any website point of view can make a request to giphy to get some gifs if he makes double clicks on some words on those websites. For example, the user clicks on 'car' word in some article and then makes a request to giphy, he gets gifs proposals.
Plugin is working as expected for many websites, but not for all. In one (for now) website the request is ok, the response contains gifs, extension background receiving that gifs, but after trying to add these gifs to the DOM (content script popup) network shows (canceled) and src of that files have value = unknown.
I suppose it's related to some security reasons, am I right? I yes, what can I do, to insert gifs to my extension popup safely? Are there any security risks for the user when he gets gifs from giphy?

Method to autoupdate Chrome Extension badge

I'm building a Chrome extension that makes the badge show a number returned from an API. I have the code working fine, but I have it listening for DOMContentLoaded, so it only updates when the user opens up the extension.
I would like the extension to check the API every time the browser loads a page. I do not need to change anything in the page, I just want to use it for timing.
I'm not sure what I should be using, should I be using background pages, event pages, or something else? What would be the best way to go about this?
Thanks in advance!
The api you want for “every time the browser loads a page” is chrome.tabs.onUpdated. You’d have:
chrome.tabs.onUpdated.addListener(function(tabId,changeInfo,tab) {
chrome.browserAction.setBadgeText({"text":"ABCD","tabId":tabId});
});
An easy approach for development is to use a background page, get it working, and then figure out what changes you need to convert it to an event page. With this stub however, nothing is stopping you from making it an event page.

Share via FBSDKShareDialog ignores applink defined on target page

This has been driving me nuts all day:
I have an iOS app with a custom URL scheme defined, and am trying to share a link on FB which points to a page that has this scheme in its applink meta tags, so that tapping it should fire up my app.
Every little piece of it is working just fine. I can enter my URL scheme in safari on the phone and the browser launches my app. I have tested my webpage with the FB debug tool and there are no errors or warnings - it correctly identifies all the meta tags.
If I share the link using FB on the phone or on my laptop, all works fine.
HOWEVER, if I share the exact same link using FBSDKShareDialog, it does not work. It just opens the web page with the meta tags as if it was any regular web page.
Anyone has any idea why these two ways of sharing would be different? They look exactly the same otherwise.
If anyone else runs into this problem, here's the reply from FB:
When you share with mode automatic, the app does a fast app switch over to the FB app to show the native share dialog
The post is cached locally on the device, and it does not know about app links (since only Facebook server side knows about it)
When the user opens the FB, the user sees their cached story (with no app links behavior),
This doesn't manifest with the Web mode since the Facebook app needs
to pull from the server to get the post, in which case it has all the
app links info.
This is unlikely something that we'll fix. However, after a while, the
cache will expire, and Facebook app will re-pull the posts from the
servers, in which case the app link data will be available.
In order to test this, you can share the post on one device, and then
try clicking on the post from another device. The app links should
work at that point.
Which is kind of a lame response IMO - they parse the target page to build the preview, how hard would it be to remember the applink and use it?
There could be two possible issues:
Either the one told by #NJ, i.e. you are just trying to open the link in Facebook app, using the same device from which you posted the link.'
Solution - either open link in other device or cose and re-open your facebook app and do multiple refresh
Or You have some error in your meta tags. There is one important thing though, that Facebook never mentions, i.e. they cache the URL you provide.
So any one used the web link with meta tags the first time in Facebook, Whole meta tags will be cached, and you updated meta tags won't be parsed by facebook.
Solution
To get over with the issue, use below link
Facebook debug tool
Input your meta data included web page URL and
-click on show existing scrape information to find any error
Click on Fetch new scrape information for refreshing your URL on facebook. it will clear the cache for that URL in facebook server.

Display web sites and web apps with Chromecast

Can Chromecast be used to display a web site or web app? All the sample sender/receivers I've seen so far show how to play videos. The docs posted so far are minimal as best, just an API reference with little explanation what any of it does. I just want to send a URL of my choosing and have that page displayed on the TV. There's no user interaction required past that point. Assuming that's possible, does anyone have sample Chrome sender and receiver code for that?
I was able to modify the Github sample Project > googlecast/CastHelloText-chrome
to show a web page.
In the receiver.html file, I replaced the DIV with an IFRAME and styled it for 100% width and height.
Then in the displayText() function I changed innerHTML to src.
The only modification made to the sender chromehellotext.html was to replace YOUR_APPLICATION_ID with the app id created by registering the receiver.
Note that some sites like Google and Yahoo will not display inside an iframe. If you really needed to do that you could skip the iframe and just set window.location.href to the URL. That, of course, will overwrite your receiver code so the only way to change URLs would be to manually disconnect first and reload. I tried using window.open instead but that did not work.
One could imagine writing a Custom Receiver that has an iframe that wraps any website. Your sender would could then send webpages to your receiver, and the onLoad would set the the URL of the iframe. Don't have any code, but it's fairly simple to write.
There is a simple way to do that with the hellotext sample. You can send the html by typing that into the text field.
<iframe src="http://mywebpage.com" style="width:1280px;height:720px"></iframe>
To provide extra info from the current answer, as this post comes up near top on most searches.
Thing to search for is Digital Signage, this is the sort of industry word.
following GreenScreen Chromecast works okay. Greenscreen
host solution is Sign Simple - which looks to be same approach as Greenscreen without you needing to host the receiver web page.
Similar hosted solutions using Raspberry Pi can be found.
Of note: with GreenScreen and the CastHelloText, I could not get 1080p only 720p, some comments mention Video only in 1080p, but Images in 720p, which I take to mean html pages aswell.
Chromecast can indeed be used to display an arbitrary URL.
This can be done from plain old Chrome, using 'url-cast-receiver'. (Usable 'demo' page, GitHub project page.)

Showing a YouTube video in a Google Chrome extension

I would like to embed a YouTube player onto a page and show it to a user. If a foreground popup is used to host the player then, when the popup loses focus, the player is destroyed because the entire popup is removed.
I was hoping to use webKitNotifications.createHTMLNotification() and embed a player inside of an HTML Notification, but the spec has since been deprecated.
Just curious if anyone has any really crafty ideas on how to achieve this? I suspect hosting the YouTube player on a background page is a violation of YouTube's Terms of Service.
Looking through the dev. channel APIs:
http://developer.chrome.com/extensions/notifications.html - Too restrictive compared to HTML Notification. Doesn't look like I can embed a YouTube player inside one of these guys.
and... that's really about it.
Advice appreciated. Thanks.
You can simply have an HTML file in your extension for your page, for instance video.html, list it in your manifest under web_accesible_resources, and show it using:
chrome.tabs.create({url: chrome.extension.getURL('video.html')});
Inside your page you can use whatever method you want to embed the YouTube player.

Resources