Welcome!

Welcome to the official BlackBerry Support Community Forums.

This is your resource to discuss support topics with your peers, and learn from each other.

inside custom component

Web and WebWorks Development

Reply
New Contributor
napat_tang
Posts: 7
Registered: ‎12-26-2011
My Device: BlackBerry Torch 9800, BlackBerry Playbook

Please help: Using Jquery Mobile and zrssfeed plugin to insert feeds in the apps, invoke browser.

Hi,

 

I'm a newbie and trying to develop my first app. I am trying using Jquery Mobile HTML5/Webworks with zrssfeed plugin to load rss feeds on my app. Right now the feeds were loaded perfectly both on internet explorer browser and Ripple emulator already.

 

The problem I found is that normally when you click on the articles in the feed, in the internet explorer, it will redirect you to the source website of the feeds to read the full article. However, on PlayBook browser I know that I have to invoke browser first so that it can load, but I was unable to do that. So I just wonder if anyone can help and have a correction? 

 

My thought is that I need to add the webwork browser invoke script into the .js file below.  

 

This is zrssfeed js file

 

(function(h){h.fn.rssfeed=function(q,f,r){f=h.extend({limit:10,header:!0,titletag:"h4",date:!0,content:!0,snippet:!0,media:!0,showerror:!0,errormsg:"",key:null,ssl:!1,linktarget:"_self"},f);return this.each(function(s,l){var p=h(l),d="";f.ssl&&(d="s");p.hasClass("rssFeed")||p.addClass("rssFeed");if(null==q)return!1;d="http"+d+"://ajax.googleapis.com/ajax/services/feed/load?v=1.0&callback=?&q="+encodeURIComponent(q);null!=f.limit&&(d+="&num="+f.limit);null!=f.key&&(d+="&key="+f.key);h.getJSON(d+"&output=json_xml",
function(b){if(200==b.responseStatus){var e=b.responseData,b=f,g=e.feed;if(g){var a="",d="odd";if(b.media){var j=e.xmlString;"Microsoft Internet Explorer"==navigator.appName?(e=new ActiveXObject("Microsoft.XMLDOM"),e.async="false",e.loadXML(j)):e=(new DOMParser).parseFromString(j,"text/xml");j=e.getElementsByTagName("item")}b.header&&(a+='<div class="rssHeader"><a href="'+g.link+'" title="'+g.description+'">'+g.title+"</a></div>");a+='<div class="rssBody"><ul>';for(e=0;e<g.entries.length;e++){var c=
g.entries[e],i;c.publishedDate&&(i=new Date(c.publishedDate),i=i.toLocaleDateString()+" "+i.toLocaleTimeString());a+='<li class="rssRow '+d+'"><'+b.titletag+'><a href="'+c.link+'" title="View this feed at '+g.title+'">'+c.title+"</a></"+b.titletag+">";b.date&&i&&(a+="<div>"+i+"</div>");b.content&&(a+="<p>"+(b.snippet&&""!=c.contentSnippet?c.contentSnippet:c.content)+"</p>");if(b.media&&0<j.length){c=j[e].getElementsByTagName("enclosure");if(0<c.length){for(var a=a+'<div class="rssMedia"><div>Media files</div><ul>',
k=0;k<c.length;k++)var m=c[k].getAttribute("url"),n=c[k].getAttribute("type"),o=c[k].getAttribute("length"),m='<li><a href="'+m+'" title="Download this media">'+m.split("/").pop()+"</a> ("+n+", ",n=Math.floor(Math.log(o)/Math.log(1024)),o=(o/Math.pow(1024,Math.floor(n))).toFixed(2)+" "+"bytes,kb,MB,GB,TB,PB".split(",")[n],a=a+(m+o+")</li>");a+="</ul></div>"}a+="</li>"}d="odd"==d?"even":"odd"}h(l).html(a+"</ul></div>");h("a",l).attr("target",b.linktarget)}h.isFunction(r)&&r.call(this,p)}else f.showerror&&
(g=""!=f.errormsg?f.errormsg:b.responseDetails),h(l).html('<div class="rssError"><p>'+g+"</p></div>")})})}})(jQuery);

 

or you can see the code also on here

 

https://code.google.com/p/thaiopensource/source/browse/trunk/mobileapps/openoffice-tutorial-app/asse...

 

I have seen the thread with the same issue as mine here

 

http://supportforums.blackberry.com/t5/Web-and-WebWorks-Development/Push-every-href-link-to-PlayBook...

 

So I try to do follow the suggestion by adding 

 

$('a').click(function(e){
e.preventDefault(); 
href = $(this).attr('href');
var args = new blackberry.invoke.BrowserArguments(href);
blackberry.invoke.invoke(blackberry.invoke.APP_BROWSER, args);
return false;
});

 

into the upper zrssfeed .js at the 2 positions I highlighed in bold by using the onclick syntax like this

 

b.header&&(a+='<div class="rssHeader"><a href="'+g.link+'" onclick="

function(e){
e.preventDefault(); 
href = $(this).attr('href');
var args = new blackberry.invoke.BrowserArguments(href);
blackberry.invoke.invoke(blackberry.invoke.APP_BROWSER, args);
return false;
"title="'+g.description+'">'+g.title+"</a></div>");

 

The response when I test sideloaded is that everytime I enter my application, the PlayBook browser opens up automatically to the url of the feed(not the article) and then the feed wasn't loaded correctly on the app like before. I tried to change the position and change to <a href="#" also but nothing change. So I think that I'm now doing something wrong with that.

 

So please if anyone have any suggestions so that when I press on the article the app will open the browser and then load that full article pages would be a very great pleasure for a newbie T T. Thank you!!