how to show available chrome cast devices when cast icon is clicked? - javascript

I need help on showing list of available chrome cast devices when chrome cast icon is clicked. Just like what youtube does. See image below.
As of now, when I click the cast icon on my HTML5 app, the devices selection pop-ups on Chrome cast extension, see image below.
I want my app to show the cast devices selection like youtube does. Do you have any idea on how to do it?
Let me know. Thanks.

Sample protocol for 'scan' and for 'device' discovery is in this node project
in these classes:
lib/device.js
lib/scanner.js
some sample output:
rob# nodecastor$ bin/chromecast discover
info: + borneoTV (192.168.1.141:8009) [8235f790a1597865d6d2be26728282dc]
Since You use JS, maybe the node stuff helps you??

According to chromecast documentation:
I only can get receiver name after selected the device in chromecast popup, so this function is executed: function onRequestSessionSuccess(e){...}
So, I explored object returned, precisely in attribute: e.receiver.friendlyName
I hope have helped you :)

Related

Disabling mouse acceleration not supported in Chrome v88

So we use the requestPointerLock() function to lock the mouse pointer of users while gaming on our website. Following the web.dev disable-mouse-acceleration article, I tested their pointer lock API sample and discovered that requesting pointer lock with "unadjustedMovement" works on my Chrome browser (v88.0.4324.104).
However, now something strange is happening. I basically just copied the above project by going to the source code link and click on "remix to edit". Then, I opened the sample and did the same test, resulting in the following message:
disabling mouse acceleration not supported
So basically, two identitcal project code where the original works flawlessly, but the copied project says disabling mouse accelaration is not supported.
Also, I've tested the exact same code in a local project, but same error message is returned.
Anyone an idea what's going wrong here?
The original source code
The original live test
The source code copy
The live test copy
UPDATE: It is supported by default in chromium browsers from v92
Old answer:
It is supported but only with flag
Just go to chrome://flags/#enable-pointer-lock-options and select enabled.
After relaunch go to https://unadjusted-movement.glitch.me/ and test it

Personal toolbar button in Forge Viewer not appearing

I followed the tutorial to learn Autodesk Forge. I linked my BIM 360 account to the Forge Viewer. I would now like to add extensions to it and have a button on the toolbar that links to my extensions.
However when I follow the extension tutorial, nothing shows up. I also tried this one https://forge.autodesk.com/en/docs/viewer/v5/tutorials/toolbar-button/#before-you-begin and nothing appear.
I do not know what I am doing wrong since it seems to work if we follow the tutorial...
I am working on VS code
Right now, my code looks like this in the index.html file :
enter image description here
The rest is exactly like the tutorial except that I replaced "MyAwesomeExtension" with "PieChartExtension"
One thing to try will be to switch your var config3d to the following:
var config3d = {extensions: ['PieChartExtension']}
The reason might be, your syntax might be affecting and that is why the Viewer does not understand what to load. Did you check the console for any messaging?

Google Maps having directions doesn't work on mobile : "No Routes Found"

I wanted to have a map having directions set to a static destination.
From what i saw, i gave a link as follows:
link
Which opens up a new page with the map.
I haven't been able to replicate this on mobile (Android/Ios) however.
Following error comes up on the mobile: "No Routes Found" .
Can you explain me what am doing wrong?
PS: Am currently using this on a responsive website adding it as a link. I don't want this embedded either.
Thanks.
Try changing the URL like the below one. It might help you.
http://maps.google.com/maps?saddr=Current+Location&daddr=Kochi+Kerala+India
Thanks
The query string format is an older format, so maybe this newer syntax might work:
link
I've found that sometimes Google likes different phrasings for the current location, so if that doesn't work, you could also try something like Your+Location.
I cannot not use coordinates as source address because I send out a link in an email and my clients can be anywhere in the city when they read it.
For me neither of "My+Location" nor "Current+Location" worked. It always set the source address to the official center coordinates of the current city or the official address of the internet provider. Both on mobile or in desktop browser.
Christian explained here why: https://stackoverflow.com/a/59249673/5356216
The recommended and working solution in 2022 which is language independent is this:
https://www.google.com/maps/dir/?api=1&destination=760+West+Genesee+Street+Syracuse+NY+13204

How do I get Firefox debugger watch's target element?

I've been trying to add the highlighting feature to the Firefox DevTools debugger, so it will highlight the element instead of only showing [HTMLAnchorElement] or similar. I know it's possible, since you can set someElement.style.border='1px solid blue' or similar as a watch, and it hightlights the element. So why not let it store current border, and show it on mouseover using element.style.border='1px solid blue', and restore it on mouseout?
While debugging in Firefox devtools, I noticed the element in the right watch panel has rows with the variable names, which are actually given odd ids like "46439", under parent element with "document.getelementsbytagname('a')36" id. What do these ids signify? Can they map a display element to its target element in the page? I tried window.DebuggerView.WatchExpressions.getItemForElement from Venkman but it returns null. Is there another function from this source file that will give the target element of debugger watch?
Ideally, I should be able to 'watch' items such as document.getElementsByTagName('a'), or local variable in the debug context, and highlight the items in the page like Chromium/Firebug. Yet I'm not sure how to add this feature from a Firefox extension.
Update:
After further work, it would seem to be possible to use the DebuggerView.StackFrames.evaluate to run code while stopped at a breakpoint, like what chrome://browser/content/devtools/debugger-controller.js is doing with watches. Unfortunately when stopped at a breakpoint I run this code, and DebuggerView.StackFrames.evaluate is [void] void in Venkman. Is this evaluate command hidden or private somehow, or not initialized?
You can't really use the highlighter from the Debugger directly yet. We have a bug open (https://bugzilla.mozilla.org/show_bug.cgi?id=653545) to make the highlighter more generally-available to our other tools.
If you have a unique selector, you can use the command line (Shift-F2 to open the Developer Toolbar) to inspect an element via:
inspect unique-selector
We intend to make DOM objects highlightable everywhere in upcoming versions of the Firefox Developer Tools.
edit - This feature has been landed and now works from the Variables View and the Console. Landed in March of 2014 in Firefox 30.
https://hacks.mozilla.org/2014/03/box-model-highlighter-web-console-improvements-firefox-os-hud-more-firefox-developer-tools-episode-30/
I think you are putting too much efforts in inbuilt debugger,
to debug javascript you must use fireBug its best tool,
This Link is for the addon of firebug, download and install the add-on its hardly 2 MB and then you will enjoy debugging.. :)
Edit: Selector in Debugger
I was searching answer for your specific question, and found out this
Web Console Method
Now here you are able to debug, get element and get selector details too..
(Refer Basic Usage)
You can directly access variables defined on the page:
> $ function(selector, context){
return new jQuery.fn.init(selector,context);
}
please refer the above link for more details..
If native console is not available refer this link, this says,
Under Microsoft Windows you additionally need to start Firefox via the following command to have a native console :
firefox.exe -console
so that will enable firefox to start with console..
Edit: Log
To log the element tested>> refere this link in that refer pprint() that will also behave in the same way.
Also Console API there refer console.log
I hope this will help..

Programmatically "open in Adobe Reader" from JavaScript

The iOS safari browser has a handy option that appears whenever you open a PDF page in the browser
If you have Adobe Reader installed, a button will appear that says:
Open in "Adobe Reader"...
However, if you open up the PDF document where the HUD (address bar, etc) is hidden, like in a phone gap application, or a quick and dirty "Add to Home Screen app" using the following meta:
<meta name="apple-mobile-web-app-capable" content="yes" />
then, obviously, the button will not appear.
I want to still open the PDF document in Adobe Reader. Does anyone know a way to do this programmatically?
I want to include jsPDF in a phonegap application, and save the results, and this would be the easiest way to do that.
Thanks in advance!
With some fantastic help from Vince Parsons (and others), I've solved this problem.
Using a PhoneGap Plugin, you can create / expose a JavaScript call, which is then processed in Objective-c.
Here's the two lines you need (yes, only two lines!), and a subsequent explanation:
self.docInteractionController = [UIDocumentInteractionController interactionControllerWithURL:[NSURL fileURLWithPath:myDocumentPath]];
[self.docInteractionController presentOpenInMenuFromRect:CGRectMake(0,100,1,1) inView:UIApplication.sharedApplication.keyWindow animated:YES];
Explanation
Your input will be the file location.
In my case it's inside the app sandbox, so it looks something like:
/var/mobile/Applications/B16-HU83-GU1D-1D3NT1F13R/Documents/DocumentToExport.pdf
If you want to use an external URL, you can (with adjustments), but for my purposes it was internal.
So, with my file location as an input (let's call my input variable myDocumentPath), you just need to declare a document controller:
self.docInteractionController = [UIDocumentInteractionController interactionControllerWithURL:[NSURL fileURLWithPath:myDocumentPath]];
this creates a UIDocumentInteractionController using the interactionControllerWithURL method, which needs an NSURL variable.
We create that NSURL variable using the fileURLWithPath method, passing it our myDocumentPath.
The next line calls presentOpenInMenuFromRect Which takes a rectangle and a viewport:
[self.docInteractionController presentOpenInMenuFromRect:CGRectMake(0,0,1,1) inView:UIApplication.sharedApplication.keyWindow animated:YES];
the rectangle is created at position 0,0 with a width and height of 0,0 (GCRectMake(0,0,1,1))
and the viewport is taken from the PhoneGap application: UIApplication.sharedApplication.keyWindow
I'm reeling with joy and amazement that this only took two lines of code to fix. Granted, there's not a way to do it with JavaScript only, but it's still pretty elegant, and works great.
You can open your PDF using PhoneGap InAppBrowser(http://docs.phonegap.com/en/2.5.0/cordova_inappbrowser_inappbrowser.md.html#InAppBrowser) if the PDF is opend from the server using a URL or if its from local device, you can use the PDFViewer plugin: https://github.com/phonegap/phonegap-plugins/tree/master/iOS/PDFViewer.
Bothways the native default PDF reader will be used to open the PDF.
I really searched for an ready-to-use solution and gave up at one point. There are a few old repositories on GitHub and some articles building on the two lines of the green marked answer - but nothing works satisfying for me.
That's why i forked the cordova-plugin-file-opener2 to change the iOS behavior and this works perfect for me. To allow also parallel usage of the forked plugin, i've renamed it creatively to cordova-plugin-file-opener3. It provides the same features as version 2.0.1 of the forked plugin except that on iOS the "Open In"-Dialog is shown.
The change to the plugin was trivial. Just replaced one method call and did some renaming. Don't know why it was so hard to find a working solution - but maybe that i didn't search the right way.
You can find the repository here:
https://github.com/napolitano/cordova-plugin-file-opener3
Feel free to use it.

Categories

Resources