I am having a great deal of difficulty getting the childBrowser plugin to work
Currently when I click my link it does nothing on my iOS simulator and when I click it using a browser I get a Web Page Not Found error with the web address looking something like:
file://myapp/www/%C3%A2%E2%82%AC%C2%9D#ￃﾢ￢ﾂﾬￂﾝ
I am really stuck for ideas on whats going on and what is causing this, any advice would be greatly appreciated.
My code is:
<script type="text/javascript" charset="utf-8" src="js/ChildBrowser.js"></script>
<script>
function onDeviceReady() {
childbrowser = ChildBrowser.install();
var root = this;
cb = window.plugins.childBrowser;
if(cb != null) {
cb.onLocationChange = function(loc){ root.locChanged(loc); };
cb.onClose = function(){root.onCloseBrowser(); };
cb.onOpenExternal = function(){root.onOpenExternal(); };
//cb.showWebPage(“http://google.com”);
}
}
function onCloseBrowser() {
console.log(“onCloseBrowser!”);
}
function locChanged(loc) {
console.log(“locChanged!”);
}
function onOpenExternal() {
alert(“onOpenExternal!”);
}
<body onLoad=”onBodyLoad()”>
<a href=”#” onclick=’cb.showWebPage(“http://www.google.com”);’>Click Me</a>
It is difficult to get which part of the app is doing wrong as given source is not enough. I have a small demo application which just uses childbrowser with cordova 1.7.0 which you can check to make sure the source is unaltered.
ios-cordova-childbrowser example
Related
I am working on a tizen web application for a Gear S3 watch and need to implement a time picker to set an alarm. I copied some code from the internet but it creates the entire time picker in js using the inbuilt TAU and I can't seem to access it.
This is the HTML:
<div class="ui-content">
<div class="ui-time-picker"></div>
</div>
This is the JS
(function () {
var page = document.getElementById("number-picker-page"),
element = page.querySelector(".ui-time-picker"),
widget = null;
function init()
{
widget = tau.widget.TimePicker(element);
}
page.addEventListener("pagebeforeshow", init);
}());
Screenshot of the screen:
https://imgur.com/a/SoVbFCh
Edit:
Here is the link which I referred to for the code:
https://docs.tizen.org/application/web/api/latest/ui_fw_api/Wearable_UIComponents/wearable_timepicker.htm
The latest TAU release has fix for this issue.
https://github.com/Samsung/TAU/releases/tag/v1.0.16
widget = tau.widget.TimePicker(element);
widget.value(); // returns Date object
I really need some help, because I'm very new to iOS and Phonegap developing and all topics on my Xcode-warning I could find were about Objective-C.
As my app is mainly written with Cordova (Phonegap) these solutions aren't really helpful.
So, what is there to tell:
I have a simple start screen, where you can start a barcode-scanner. The result (which in the end is always an url) should be displayed in the inAppBrowser of cordova.
If I call the window.open() with "_self" it works, but then it is very difficult to get back to the startscreen, as far as I found out.
So I wanted to call the url with the inAppBrowser so there is a "Done" button, but Xcode screams:
"Warning: Attempt to present <CDVInAppBrowserViewController:
0x1ed97060> on <MainViewController: 0x1ed64730> while a presentation
is in progress!"
Here the JavaScript code where I'm calling the window.open() function...
app.initialize();
function demoScan() {
try {
var scanned = scan();
} catch (e) {
alert('scan failed');
}
}
function scan() {
var scanner = window.cordova.require("cordova/plugin/BarcodeScanner");
scanner.scan( function (result) {
var ref = window.open(encodeURI(result.text),'_blank','location=yes');
},
function (error) {
("Scanning failed: " + error);
});
}
In the end, I only need a (simple) solution, to get back to the start page "index.html" when I'm on the Webpage the Barcode scanner is calling. If it is through the inAppBrowser or with a self-coded "back" button in the WebView, I really don't care.
Thanks in advance! :)
Okay, I found the answer. You have to set a timeout before calling the inAppBrowser:
setTimeout( function() {
var ref = window.open(encodeURI(result.text),'_blank','location=no');
}, 500);
Apparently iOS needs some time to end whatever it was doing, before it can start the inAppBrowser.
In Android it works without the timeout.
I have the following code:
document.addEventListener("deviceready", onDeviceReady, false);
function onDeviceReady() {
document.addEventListener("backbutton", onBackKeyDown, false);
}
function onBackKeyDown() {
if ($.mobile.activePage.attr("id") === "home") {
e.preventDefault();
navigator.app.exitApp(); //not working
}
}
My onBackKeyDown() function is being entered, now I'm getting a series of strange events:
My if condition is never entered, even when my $.mobile.activePage.attr("id") === "home" is true (tested on weinre server)
navigator.app.exitApp never works, this seems to happen across my whole app, not just this one function.
Back button is unresponsive all over my app.
Any idea why I'm getting this strange behavior? Phonegap 2.6, jquery mobile 1.3.0 and testing on an Android 2.3.7.
In my testing here
if ($.mobile.activePage.attr("id") === "home") {
works perfectly.
Already "navigator.app.exitApp ()" will not really work because "navigator" refers to the browser itself, PhoneGap applications do not use browser but a webview.
But how applications behave differently on each OS version, try the following:
if(navigator.app){
navigator.app.exitApp();
}else if(navigator.device){
navigator.device.exitApp();
}
I'm testing html5 app with cordova and jquery mobile - for Android and Blackberry the following code working for me :
var ua = navigator.userAgent;
window.device = {
iphone: ua.match(/(iPhone|iPod|iPad)/),
blackberry7: ua.match(/91|93|97|96|97|9800|9810|9850|9860|99/),
blackberry10: ua.match(/BB|PlayBook|Tablet/),
android: ua.match(/Android/)
}
//window.device ready for blackberry
if (window.device.blackberry7){
document.addEventListener('deviceready', onDeviceReady, false);
}
//window.device ready for android
else {
window.addEventListener('load', onDeviceReady, false);
}
and then :
function onDeviceReady(){
document.addEventListener("backbutton", onBackKeyDown, false);
document.addEventListener("menubutton", onMenuKeyDown, false);
document.addEventListener("searchbutton", onSearchKeyDown, false);
}
function onBackKeyDown(){
if (window.device.blackberry7){blackberry.app.exit();}
if (!window.device.blackberry7){navigator.app.exitApp();}
}
function onMenuKeyDown(){
if (window.device.blackberry7){alert("BB Menu key");}
if (!window.device.blackberry7){alert("Menu key");}
}
function onSearchKeyDown(){
if (window.device.blackberry7){alert("BB Search key");}
if (!window.device.blackberry7){alert("Search key");}
}
I have an iPad app developed using a 3rd party tool called OpenPlug which converts AS3 to C++ and from there on exports to iOS. (Just wanted to note this is not a "native" app using Obj-C in XCode written by me, I wrote AS3)
Now I have this iPad application which displays pictures and video in a slideshow. For the video I'm using a WebView which loads a HTML page where I change the src property of the video object to the location of the video file which was downloaded to my application storage. This is working fine except that the application freezes when it is running for a few hours (3-6).
I searched for this problem and tried the solution in iOS Safari memory leak when loading/unloading HTML5 <video> but that does not seem to change anything for me.
Since the application freezes (right before the HTML page needs to load a video) and does not crash what does that mean? Do I need to destroy the video object? First I was creating a new WebView for each video but now I'm reusing the webview and just changing the src property but that also does not help me.
Can anyone shed some light on this? OpenPlug has discontinued it service and does not offer any support anymore but nevertheless I think it is more of a webview/video problem on iPad (?)
Important to note: The application is freezing but my iPad is not. The application does not generate a crash report and does not execute any code anymore (also no traces). When I push the Home button on my iPad and press the app icon then the application is restarted.
Here is the code of my HTML page which is refreshed every time a new video needs to start (webview.location = ...)
<html>
<head>
<script>
function videoEndedHandler(){
var video = document.getElementById("videoPlayer");
video.src = "";
video.load();
window.location.hash = "ended";
}
function videoErrorHandler(){
window.location.hash = "error";
var video = document.getElementById("videoPlayer");
video.src = "";
video.load();
}
var loop;
function setup(){
var video = document.getElementById("videoPlayer");
video.addEventListener("error", videoErrorHandler,false);
video.addEventListener("ended", videoEndedHandler,false);
video.load();
video.play();
startHashLoop();
}
function startHashLoop(){
if(window.location.hash == "#touched"){
setAsPaused();
}
if(window.location.hash == "#paused"){
//check image
testImage("shouldResume.png?nocache=" + Math.random());
}
if(window.location.hash == "#resume"){
var video = document.getElementById("videoPlayer");
video.play();
}
loop = setTimeout(hashLoop,500);
}
function testImage(url) {
var img = new Image;
img.addEventListener("load",isGood);
img.addEventListener("error",isBad);
img.src = url;
}
function isGood() {
window.location.hash = "resume";
}
function isBad() {
//alert("Image does not exist");
}
function hashLoop(){
startHashLoop();
}
function setAsTouched(){
window.location.hash = "touched";
}
function setAsPaused(){
var video = document.getElementById("videoPlayer");
video.pause();
window.location.hash = "paused";
}
</script>
</head>
<body onload="setup();" style="background-color:#000000;">
<video id="videoPlayer" style="top:0;left:0;position:absolute;" width="100%" height="100%" preload="auto" src="##VIDEO_URL##" autoplay="autoplay" webkit-playsinline />
</body>
</html>
It would be helpful if you'd post your entire code, but I think it's freezing because you're loading a video from web in your main thread, which is also responsible for redrawing UI. By loading a large video inside your thread, your UI freezes as well.
I would recommend moving the code that does video loading into a separate thread (use blocks if you're on iOS5).
I am trying to get a website that runs fullscreen for all pages, I have looked over here: iPad WebApp Full Screen in Safari and followed that and my index page fills the screen just nicely, but whenever I click a link to another page even though that page is all setup with the meta tags it pulls the chrome bar back in and all the alignment goes out.
There must be a way or is that a limitation of safari that will be fixed in a later revision.
I have written a jQuery plugin for this exact purpose: https://github.com/mrmoses/jQuery.stayInWebApp
Include the plugin somehow , then run it like so:
$(function() {
$.stayInWebApp();
});
By default it will attach to all <a /> elements. You can pass a different selector to attach it to specific links. For example, $.stayInWebApp('a.stay'); will attach to all links that have class="stay"
Because its so small, I usually just copy the minified version into one of my other external javascript files to include it, rather than having to add another external js reference.
Also available on plugins.jquery.com
You can try something like this:
if ((navigator.userAgent.indexOf('iPad') != -1)) {
// for standalone (app) fulscreen mode
if (window.innerHeight == 748 || window.innerHeight == 1004) {
var a = document.getElementsByTagName("a");
for (var i = 0, len = a.length; i < len; i++) {
if (a[i].getAttribute("href");) {
a[i].onclick = function() {
window.location = this.getAttribute("href");
return false;
}
}
}
}
}