can webview links trigger a function?
I'm trying something a bit weird in order to incorporate admob (I understand there's stuff coming for that, but for now I thought I'd try this…)
I've got an app with traditional windows, views and scrollViews. At the top, I've placed a small webview which loads a php page from my server with the admob code in it, and displays the ad. so far so good.
But of course, when a user clicks on anything in that small webview, it opens in the same small webview, which is useless for surfing in…
So I'm trying to find an event handler, or something I can embed in the php page that the webview loads, that will recognize the a-href click, but (ideally) also trigger something which opens the link in a new webview, or resizes the existing one, to make it usable.
I've tried a simple click-listener on the webview object, and that works fine, but doesn't allow the 'click' through to the actual link (ie. the ad never receives the click, I guess)
I know a few people are looking for admob solutions, so if I can figure this out with some help it'd be good for many.
Thanks!
David
5 Answers
-
You need to use
Ti.App.fireEvent(...)to fire a custom event from the webview so that your app can open the URL in a new window.See:
http://developer.appcelerator.com/question/911/what-is-fireevent-how-do-i-use-it
-
I am having the same problem. I have embedded the admob js into a Webview but cant seem to capture the click on the ad. If i can capture the click and then pass it to the fireevent, i can have it open in a new window…
Did you have any luck getting it to work? Thanks.
-
I got something working… but it's not too glamorous :-)
I use the .fireEvent call to a function in my app.js file that opens a webview with the url passed to it.
The trick was getting the html link that admob sends me and inserting the 'fireEvent' bit into it. So what I've got is:an empty webview is placed in my app
the app opens an xhr request to…
a php page on my server with the admob code in it (surrounded by <html> and <body> tags, 'cause the webview needs these)
the returned admob code is 'processed' using regex and matching to pull out the admob url, and rebuild the link to include the fireEvent code (that's the real ugly part)
the cleaned html code is sent to the webview.
It seems to work fairly well unless admob doesn't give me anything, or the xhr times out…
hope that helps someone…
(here's the cleanup code:)
function tweak_html(html_code){ //var new_html = ''; var linkpattern =/href=".*">/; var link = []; try{ link = html_code.match(linkpattern); Ti.API.info('number of links found: ' + link.length); } catch(err){ Ti.API.info('no links found'); return html_code; } link[0] = link[0].substring(6,link[0].length-2); //trim out everything but the actual url from the first link only Ti.API.info('link: ' + link[0]); //var pattern=/href="/; Ti.API.info('doing code replace'); var newstring = 'href="#" onClick="Ti.App.fireEvent('openWebView', {url:'' + link[0] + ''});return false">'; var cleaned_code = html_code.replace(linkpattern, newstring); Ti.API.info(cleaned_code); return cleaned_code; } -
I'm using David's approach above but I always get "no links found" and the responseText shows that admob is serving up a 1x1 pixel image instead of a link. Is admob somehow blocking this approach now or am I missing something else?
-
Maby this wil help somebody:
function myBrowserLinkConverter(html_code){ //replace(/[^<]*(<a href="([^"]+)">([^<]+)<\/a>)/g html_code = html_code.replace(/<a /gi, "<a onClick='Ti.App.fireEvent(\"openMyBrower\", {url: this.href}); return false;'"); return html_code; } Titanium.App.addEventListener('openMyBrower',function(e){ createMyBrower(e.url); });