I am newbie to phonegap. In a project I am currently working on, I wanted to play a video on the home screen the first time the application launches.
My approach was to use html5 localstorage. I put a specific value for a key. If I can't retrieve expected value for the key "firstLaunch", I play the video and set the value of "firstLaunch".
Here is the piece of code (in the backbone view js file).
var pref = localStorage.getItem("firstLaunch");
if(pref == null || pref != "0"){
$("#player")[0].src += "&autoplay=1";
localStorage.setItem("firstLaunch", "0");
} else {
$("#player")[0].src += "&autoplay=0";
}
The video is displayed with the following HTML fragment:
<div id="introvid" style="width:100%; height: 45%; ">
<iframe id="player" type="text/html" width="100%" height="100%"
src="http://www.youtube.com/embed/u1zgFlCw8Aw?enablejsapi=1&origin=http://example.com&autoplay=0" frameborder="0"></iframe>
</div>
I tried it on an external browser and worked fine i.e. the first time I render the page , it plays the video but not for subsequent renderings. So my question is
1 )what could be the problem?
2) If there is a better approach you recommend . Thank you .
Related
Scenario:
I'm using Android Robotium Solo (v5.6.3) to automate web page interactions within my app. I need to automate data entry into INPUT fields that are contained within an IFRAME but I do not have much luck!
The Problem:
When I attempt to use, for example, solo.waitForWebElement(By.id("room-number", 5000, true) and solo.typeTextInWebElement(By.id("room-number", "101"), solo is unable to locate the element.
The discussion on this related issue "Accessing an iFrame inside a WebView #794" (https://github.com/RobotiumTech/robotium/issues/794), suggests that it's possible to use "solo.getConfig().webFrame = XXX" to focus solo on the content of a specific IFRAME and then access the WebElements. Unfortunately, I've not been able to get it to work and haven't been able to find any full examples. I assume XXX might need to be the "id" of the IFRAME but in my scenario (where I don't have control of the source code for the web pages being automated) the IFRAME tag has no id assigned.
I've created a simple example test scenario:
index.html - the main page that hosts the IFRAME
<html>
<body bgcolor="#AA3333">
<div id="wrapper">
<iframe src="embed.html" width="100%" height="100%" frameborder="0"></iframe>
</div>
</body>
</html>
embed.html - the source for the IFRAME that contains the INPUT element.
<html>
<body bgcolor="#3333AA">
<div id="page-container" style="height:100vh; width:100%;">
<label>Room Number</label>
<input type="text" name="ROOM_NUMBER" id="room-number">
</div>
</body>
</html>
After reviewing the source code for Robotium in more detail I confirmed that using
solo.getConfig().webFrame = ['id' of IFRAME as a String]
allows subsequent calls to solo.typeTextInWebElement etc. to work OK as expected.
The trick in my scenario is that the parent page assigned no id to the IFRAME so I programatically assign one at runtime using the following javascript
document.getElementsByTagName("iframe")[0].id = "test";
and then use
solo.getConfig().webFrame = "test"
I'm having an issue making the Volume to 0 when the deviceready is triggered. Currently my codes are
<div id="dvVideo">
<video webkit-playsinline playsinline id="videoPlayback" poster="#">
<source src="#" type="video/mp4">
</video>
</div>
and scripts are
var vidcont = document.getElementById('dvVideo');
document.addEventListener('deviceready', function() {
vidcont.style.display = "none";
vid.src = "http://linktovideo.com/test.mp4";
vid.load();
vid.play();
vid.volume = 0.0;
});
What am I trying to achieve is that the video should preload before a button is clicked to play the video and it has to be hidden. What I'm currently doing is playing the video in the background, while the it is displayed as none, then when the button is pressed, it will displayed as block and video.currentTime is set to 0.0. Which makes the video seems to load fast.
Is there any alternative way to do this? I'm thinking of the preload="metadata" etc. but can't seem to get it to work. Can someone explain on the preload thing?
Edit: It works fine on any browsers but I just can't make it work on Android.
In an Android Webview I'm displaying a page with an HTML button that only works fine when it makes a GET request. This button loads a PDF document in the browser when it's working correctly.
I need this to be a POST request, however, because I was passing a lot of data in the query string, but when making a POST request nothing happens at all (on a smartphone) or the downloaded file is corrupted (on a tablet). The same button works perfectly fine when clicked on a Windows browser, whichever of GET or POST is used.
Here's the JS code and the HTML that makes the call:
function ExportPDF()
{
var name = document.getElementById('lblName').innerHTML;
var surname = document.getElementById('lblSurname').innerHTML;
var div = '<form id="myform" method="post" action="URL"><input type="hidden" name="Name" value="'+name+'"><input type="hidden" name="Surname" value="'+surname+'"></form>';
jQuery('#divExportPDF').append(div);
jQuery('#myform').submit();
}
<button class="btnExport" onclick="ExportPDF()">EXPORT TO PDF</button>
<div id="divExportPDF"></div>
i'm developing an app for iOS and Android with Phonegap 2.1.0 and jQuery Mobile 1.2.0. iOS version is already finished but we are experimenting some problems with the Android one...
One of the app sections is a list of videos and they are opened in a iframe inside a pop up, in iOS works well but if we try this in an Android device (Nexus 7 with Android 4.2) we only get the fist screenshot and when we press play only sound is played, without video. We've tryed to open the iframe url with childbrowser in a webview and the result is the same. Only if we open it in an external browser (openExternal) it seems to work.
I think maybe is Vimeo's player problem, but when we try to play the videos, we see this errors in the log:
01-08 22:45:12.084: E/libEGL(26580): call to OpenGL ES API with no current context (logged once per thread)
01-08 22:45:12.094: D/MediaPlayer(26580): Couldn't open file on client side, trying server side
I've been searching for hours without success, so i expect someone may know how to make it works... :/
For the iFrame, we are using the code Vimeo's giving us from the embed section of each video (i can´t post them here cause theyre private), and... Vimeo's option to make video compatible with mobile devices is marked as well.
Thanks!
HTML
<head>
<meta charset="utf-8">
<!--
| WARNING:
| For iOS 7, remove the width=device-width and height=device-height attributes.
| #see https://issues.apache.org/jira/browse/CB-4323
'-->
<meta name="viewport" content="width=device-width,height=device-height,target-densitydpi=device-dpi,user-scalable=no,initial-scale=1,minimum-scale=1,maximum-scale=1,minimal-ui">
</head>
<body>
<div class="close">
fechar
</div>
<script id="tmpl-player" type="text/template">
<iframe id="video" src="https://player.vimeo.com/video/[[video]]?autoplay=1&autopause=1&byline=0&badge=0&title=0&portrait=1&color=333&loop=0" width="100%" height="100%" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
</script>
<script>
var bodyEl = document.querySelector('body');
var tmplPlayerEl = window.document.getElementById('tmpl-player');
var tmplPlayer = template(tmplPlayerEl.innerHTML, getURLParams());
function getURLParams() {
var query = location.search.substr(1);
var result = {};
query.split('&').forEach(function(part) {
var item = part.split('=');
result[item[0]] = decodeURIComponent(item[1]);
});
return result;
}
function template(raw, data, keep404) {
return raw.replace(/\[{2,}[(\s\uFEFF\xA0a-zA-Z0-9_\./]+\]{2,}/gi, function(match, value) {
value = match.replace(/^\[{2,}|\s+|\]{2,}$/g, '');
return typeof data[value] !== 'undefined' ? data[value] : (keep404 ? match : '');
});
}
var newNode = window.document.createElement('div');
newNode.innerHTML = tmplPlayer;
bodyEl.appendChild(newNode);
</script>
</body>
JAVASCRIPT:
var fsVideo = window.open('vimeo.html?video='+video, '_blank', 'location=no,zoom=no');
fsVideo.addEventListener('loaderror', onLoadError);
fsVideo.addEventListener('loadstop', onLoadStop);
fsVideo.addEventListener('exit', onExit);
function onLoadError(evt){
fsVideo.close();
}
function onLoadStop(evt){
evt.url.match('cordova:close') && fsVideo.close();
}
function onExit(evt){
fsVideo.removeEventListener('loaderror', onLoadError);
fsVideo.removeEventListener('loadstop', onLoadStop);
fsVideo.removeEventListener('exit', onExit);
fsVideo = null;
}
Don't forget https://github.com/apache/cordova-plugin-inappbrowser
I was wondering if someone could point me to what I am doing wrong exactly. I am trying to access an iframe using Android WebDriver. The iframe opens up when I click on a Sign in link on the home page. Below is a snippet of the src code that has the iframe id that I am trying to access-
<div class="dialog" style="background-color: rgb(232, 235, 238); color: rgb(51, 51, 51);">
<iframe id="registration-dialog-frame" scrolling="no" frameborder="0" src="http://test.com" border="0" allowtransparency="true" style="width: 235px;">
<html>
</iframe>
<span id="signin-cancel" class="cancelButton">Cancel</span>
I wait till the iframe opens up, check if the frame id is present and then use switchTo() to switch to that iframe like this
driver.switchTo().frame("registration-dialog-frame");
I get a
org.openqa.selenium.WebDriverException: Error: {"message":"Cannot read property 'document' of undefined"}
When I try this
driver.switchTo().frame(driver.findElement(By.id("registration-dialog-frame")));
I get a
org.openqa.selenium.WebDriverException: java.util.ArrayList cannot be cast to org.openqa.selenium.android.library.DomWindow
Is this a Android WebDriver thing? Has anyone else come across this similar kind of errors when switching to iframe? Does anyone know how I can do this?
Check the number of frames present in that page by looking at code and use index to switch into that particular frame as shown below.
driver.switchTo().frame(frameindex);
Ex: To Switch to the first frame, use below line.
driver.switchTo().frame(0);