This is my index.html file
<html>
<head>
<title>VR Sample</title>
<script src="//storage.googleapis.com/vrview/2.0/build/vrview.min.js"></script>
</head>
<body>
<div id="vrview">
<iframe width="100%"
height="300px"
allowfullscreen
frameborder="0"
src="http://storage.googleapis.com/vrview/index.html?image=ffff.jpg&is_stereo=true">
</iframe>
</div>
</body>
</html>
And this is the structure of the website folder
I tried hosting it in Webserver for chrome as per the instructions in the google codelabs. But I clicked the 127.0.0.1.8887 url, I got a blank page with no files or folders. Then I tried hosting it on XAMPP and It did work. However, I did not get the panaroma image. Instead I got this error
I took the 360 image with google camera app and converted it to stereo with the google's online converter but got the same error. I also tried downloading the VRView repo from github and modified the code as
src="vrview/index.html?image=ffff.jpg&is_stereo=true"
that too didn't work.
You are using the iframe version of vrview meaning when you request "ffff.jpg", you are actually requesting:
http://storage.googleapis.com/ffff.jpg
Try using the javascript version
Try this:
<html>
<head>
<script src="http://storage.googleapis.com/vrview/2.0/build/vrview.min.js"></script>
<script>
window.addEventListener('load', onVrViewLoad);
function onVrViewLoad() {
var vrView = new VRView.Player('#vrview', {
image: 'http://storage.googleapis.com/vrview/examples/coral.jpg',
is_stereo: true,
width: '100%',
height: 300
});
}
</script>
</head>
<body>
<div id="vrview"></div>
</body>
</html>
Note: chrome cannot access files off a harddrive.
EDIT: This is due to CORS.
Cross-origin resource sharing (CORS) is a mechanism that allows restricted resources on a web page to be requested from another domain outside the domain from which the first resource was served.
Thanks to #Eleanor Zimmermann for noting this.
Related
When i open an swf file, Google Chrome downloads it, when it's already downloaded.
And then says "this kind of file can harm your computer", and it just wont play it.
I'm a sysadmin and today a user brought this to my attention. It seems that Chrome no longer supports the direct opening of these file types. Make sure you have the relevant adobe flash version installed and then use IE11 or Firefox. For more info see here: https://bugs.chromium.org/p/chromium/issues/detail?id=767342
Mike
Imbed the swf files in HTML and then load the html page. Note that you wont be able to directly access the HTML page, put the html folder structure in local tomcat and then access the content and obviously enable the flash player on chrome.
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<body>
<div id="CaptivateContent">
</div>
<script type="text/javascript">
var so = new SWFObject("viewer.swf", "Captivate", "1025", "810", "10", "#CCCCCC"); //change the swf file name
so.addParam("quality", "high");
so.addParam("name", "Captivate");
so.addParam("id", "Captivate");
so.addParam("wmode", "window");
so.addParam("bgcolor","#f5f4f1");
so.addParam("menu", "false");
so.addParam("AllowScriptAccess","always");
so.addVariable("variable1", "value1");
so.setAttribute("redirectUrl", "http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash");
so.write("CaptivateContent");
</script>
<script type="text/javascript">
document.getElementById('Captivate').focus();
document.Captivate.focus();
</script>
</body>
</html>
try to streaming video from my Amazon Cloudfront. I have created a bucket with html page (jwplayer.html), video (process.mp4) and jwplayer (uploaded from official website). Also I create a CloudFront web distribution and CloudFront RTMP distribution.
Add to jwplayer.html next code:
<HTML>
<HEAD>
<TITLE>Amazon CloudFront Streaming with JW Player 6</TITLE>
<script type='text/javascript' src='https://d7io7dti9fwp9.cloudfront.net/video/jwplayer-7.2.4/jwplayer.js'></script>
<script type="text/javascript">jwplayer.key = "AHKJ8oqvx6qWX8d9RY00tDP7VTETGz814NNzLw==";</script>
</HEAD>
<BODY>
<H1>This video is streamed by CloudFront and played by JW Player 6.</H1>
<div id='mediaplayer'></div>
<script type="text/javascript">
jwplayer('mediaplayer').setup({
file: "rtmp://s2z3jy56jskpuw.cloudfront.net/cfx/st/mp4:process.mp4",
width: "720",
height: "480"
});
</script>
</BODY>
</HTML>
Here is my result:
http://d7io7dti9fwp9.cloudfront.net/jwplayer.html
This solution does not work in my browser.
I think you are taking help from this tutorial
http://docs.aws.amazon.com/AmazonCloudFront/latest/DeveloperGuide/TutorialStreamingJWPlayer.html
They have explained everything. there might be file permission issues.
Take a look there once.
Thanks
I am trying to test Ooyala HTML5 Player using Google Chrome v45.0.2454.85 m. I signed in using a trial account of Ooyala and uploaded one video in the Backlot UI that has .mp4 extension.
There is one Basic HTML5 tutorial to view the Ooyala player. I followed that tutorial but I am getting the below error when I am trying to test the webpage:-
"Invalid Content Specified. Error #2048".
I am using Tomcat as local server on my machine.
Here is the code
<!DOCTYPE html>
<html>
<head>
<title>My Test Player V3 Web Page </title>
</head>
<body>
<script src='http://player.ooyala.com/v3/a163e2d9a4b6427e9baad33e86d94136'></script>
<div id='ooyalaplayer' style='width:640px;height:360px'></div>
<script>
OO.ready(function() {
OO.Player.create('ooyalaplayer', 'psOWwzeDqaYbIx19WKyhGMigX7uyg_yS');
});
</script>
<noscript>
<div>
Please enable Javascript to watch this video
</div>
</noscript>
</body>
</html>
Can anybody help to solve this?
Thanks.
In one of my Windows Phone application I am using webbrowser to display the html content. I am getting the html content by making post request to server. Here I am getting the response correctly.Then I am displaying this response in webbrowser by,
webBrowser.IsScriptEnabled = true;
webBrowser.NavigateToString(responseString);
The response is:
<html>
<HEAD>
<script language='JavaScript'>
</script>
<SCRIPT language='JavaScript' src='script/page.js'></SCRIPT>
<script type="text/javascript" charset="UTF-8" src="js/page2.js"></script>
</HEAD>
<BODY onload='someFunction()'>
<div>
--
<img src='Images/loader.gif' /><br /><br />
--
</div>
</BODY>
</HTML>
From here I am not able to call the page.js file, page2.js file and not able get the loader.gif image also. I think this is because the files are not locally stored.
I also tried by saving the response in Isolatedstorage as .html file. and displaying it
by using,
webBrowser.IsScriptEnabled = true;
webBrowser.Navigate(uri);
but here also I am getting same thing.
Please help me to get resolve this issue. Thanks in adcvance
The scripts and images aren't loaded, because paths to it in the html are relative. When you save it to a file, the scripts and image should be in relative locations to that file.
You should use webBrowser.Navigate with the Uri of the web page on the net (don't download it yourself, let the browser do it). Or the html has to have the full paths, like: <img src='http://contoso.com/Images/loader.gif' />.
I have a simple bit of HTML code:
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>iframe Practice</title>
</head>
<body>
<div>
<iframe src="//embed.gettyimages.com/embed/183351352?et=dbA2ZDFzQUqFbu8nRMfGww&sig=ozPqnsmwjm88sptsMM2UVS70lzd2ci-9q27BF6R0TzU=" width="507" height="407" frameborder="0" scrolling="no"></iframe>
</div>
</body>
</html>
When saved with .html extension and opened in a multiple browsers, I get a message saying "The file or directory could not be found." This is a very silly question, can somebody help me out with this?
Thanks!
You are using a scheme relative URI (one that begins with //).
This preserves the current scheme, so the content will load if you view it in a document hosted on http: or https: (normally you would get a security error if you tried to load an https: document into an http: document or vice versa).
You appear to not be using a web server, so you are trying to access the document via file: where it is not available.
You can either use an explicit scheme (replace // with http://) or do your testing on a web server (you can install one on your development system).
I'd generally recommend picking the latter option, there are many issues that crop up when you are testing documents on file: and using a development server bypasses them all.
Simply "//embed... in the iframe element's src property to http://embed....
<iframe src="http://embed.gettyimages.com/embed/183351352?et=dbA2ZDFzQUqFbu8nRMfGww&sig=ozPqnsmwjm88sptsMM2UVS70lzd2ci-9q27BF6R0TzU=" width="507" height="407" frameborder="0" scrolling="no"></iframe>
Are you trying to load the file locally with file://xxxxxxx You can not load and iframe this way you need to run it with a web server