How to load javascript globally on a web-based Rhomobile application - rhomobile

We are looking at transferring our web-based app from Naurtech CETerm to Rhomobile. We can change javascript functions/meta tags to use the methods of Rhomobile instead of CETerm, but due to the poor hardware performance of our devices the slow down caused by the overhead of loading jQuery and other files is significant. (Prior to this we had no requirement for jQuery, although it would have been nice to have it). We also now need the rhoapi javascript which is significant.
Is there a way to include these "framework" javascript files in the Rhomobile container app and have them available to all pages loaded without them needing to be re-parsed on each page load?
It is currently a web based app loaded using something like the following in our rhoconfig.txt file as opposed to a local file:
start_path = 'http://xxxxxx.co.uk/login.php'
My current understanding is that this means the app/layout.erb file cannot be used to solve this problem?
Thanks

More than RhoMobile Suite (and it's RhoElements enterprise device framework) you can take a look at Zebra Technologies' Enterprise Browser that is intended to be used as a stand-alone industrial browser, targeting Windows Mobile/Windows CE and Android devices manufactured by Motorola Solutions (now Zebra Technologies).
On "not too old" Windows CE/ Windows Mobile devices Zebra's Enterprise Browser uses a webkit derived HTML5 capable renderer engine so, to answer your question, you can use HTML5 application cache to download the JavaScript libraries only if there's an update, in this way you can remove any network delay.
I've seen some project using giant JavaScript files (well above 1MB compressed) on old WinCE 6.0 devices, the startup time is clearly the biggest problem, with the risk to look at a white page for 5-7s. This can be alleviated with an async loader and a splash screen. It's not going to make your page faster, but the user will know what is going on.
You can find more information about Enterprise Browser on Zebra Technologies developer website, the Launchpad, inside Enterprise Browser area.
If you build your custom RhoMobile web-app container with the idea to use in server pages, local resources, you can hit some issues around cross-site scripting prevention policies.

Related

Using XDK, how do I link to another page? Hyperlinks are disabled

Edit: so apparently adding class="button" make it work... Can someone provide a reference on what other classes are there? We can't find any information on this.. Thanks
We are making an app in HTML5 using XDK, it has quite a few different views. We were planning to just link to another html page each time we want to go to a different view. But we quickly found out that hyperlinking does not work, is disabled, and button does not link either.
One of the people in my group said she saw an example about having a bunch of and then just show and hide them and use that as UI navigation... is that the only way?
Thanks in advance!
The Intel XDK doesn't insert any class definitions or require that you use a specific framework. It is a tool for assembling an HTML5 hybrid mobile app using the CSS, HTML and JS files that you supply.
If you look at the samples and the default "blank" project that is created when you create a new project you'll see that there may be references to one or more of the following "phantom" JS files:
intelxdk.js
cordova.js
xhr.js
The first two (intelxdk.js and cordova.js) are special "device API" JavaScript libraries. You won't actually find them in your project directory, they are automatically included when you use the emulator and when you build your project (which "wraps up" your HTML5 code and assets into a native wrapper that is specific to the target you are building -- it does not compile anything, it just converts it into a hybrid native/HTML5 container app that can be installed on the target platform that you built for).
The third one is a special helper JS library for dealing with CORS issues from within your app.
None of these three JS files define any classes or HTML tags, etc. They simply implement target-specific device APIs that consist of JavaScript on the "top end" and native code on the "bottom end." Your application only sees and interacts with the JavaScript interface, and only with the APIs that you need to use (which is totally optional).
For an intro to all of this, please see the Intel XDK Documentation page.
So, that means you determine which frameworks and structure your app takes. In other words, if you want to use Bootstrap and jQuery you can do so. If you decide to use the App Designer or the App Starter tools, they will define some classes that impact your layout. However, you are not required to use these tools to define your HTML and CSS, you can do it by hand or use your favorite UI framework library.
Keep in mind that your code is not being rendered by a desktop browser but the embedded "webview" that is part of the device. These webviews don't have the same memory and CPU resources that you're used to working with in a desktop browser, so you need to learn to be "lean and mean" for the best results. You are using HTML5 technologies to build a mobile app -- not creating a web site on a phone.
Hope this helps, please see our HTML5 web site for more background material. It's a little slim right now, but we're adding examples and background material as time and resources permit.
Hope that helps...

Combine JQM, MVC and PhoneGap together

I have a site which uses microsoft mvc 3 on the server side, jQuery Mobile on the client side and I want to combine it with PhoneGap and produce executes for Android and iOS.
Is it possible?
How?
Thanks
Yes, it is possible.
If you must use Phonegap, there are a couple of things to do:
First, you must create a project corresponding to each platform , following these instructions. Once you do that, you basically copy all the client side code (js, html, css) to the www folder of your project. This is one of the reasons, the app could load faster, since it's reading its resources from the local filesystem, and not receiving them from an http connection each time.
Second, you must find a way to provide your server side data to your app. If you are already using REST services or RPC methods to populate your website, then that's done, but if not, you must start by building them, and then calling them from your client (through ajax calls from jQUery most likely), and then rendering them through javascript (you can use the multiple templating libraries out there or just plain javascript, I recommend the latter only if the UI updates are minimal).
As you can see, the second part requires quite a little bit more work. Especially if you haven't built web services before.
The other option ,which does not require phonega/cordova is to use an embedded webview. Then you wouldn't have to do anything. It would work similarly to a browser (Loading the remote URL of your site), with the added advantage of being inside and android/ios app, and you could add other views or communicate with the embedded webview using native code. If you are planning to load html files from the filesystem and not from your server, you would have to do the same thing you have to do with phonegap.
It happened to me, if you have a web app depending on server code I would go with a WebView based app, and not a Cordova app.
It's really simple to create those webviews apps for Android or IPhone.
Here you have an example for building a webview based app on android
Here you have an example for building a webview based app on IOS
Hope it helps.
If you want to reuse your site you'll need a webview that browses it.
Phonegap wouldn't be needed if you use this approach, but the application will not be as responsive as a native app, and the IPhone moderators may reject your app for that reason (it happened to me).
Another approach would be that you recreate your site as a pure Javascript application and only communicate with your servers to execute some REST Services. In this case Apache Cordova makes sense.

How to call Java EE SOAP or REST services from mobile platform. etc Dxtreme, Jquery Mobile, Icenium

I want to develop mobile apps based on HTML, JS. It must work on any device etc iphone, ipad, android and windows phone...
I must use JAVA EE on server side. First I choosed Dxtreme. after I learned dxtreme, it is possible REST Service using ASP.NET Web API. But it is inpossible on Java EE. following error :
But call along #POST, #PUT and #DELETE methods throws error
"XMLHttpRequest cannot load http://www.restserver/Service/item. Origin
http://www.localhost:51140 is not allowed by Access-Control-Allow-Origin".
I believe there must be something that people must be using SOAP or REST Service on Mobile.
Which mobile framework is it possible ?
Please help me.
Thanks.
have You read About Phonegap?U can use phonegap to build application that can work around different Mobile platform.Its uses HTML5,CSS3,Javascript.Hope this helps you......
Generally, people access web services using RESTful interfaces on the server end. You can create that with ASP.NET Web API and many other server side frameworks of course. Your error, I'm guessing, but not sure, is from your client application. If I'm correct, you are probably running some simulator or the app within a browser client, and not one of the mobile framework simulators, and are running into the problem where the browser restricts your access to services on systems other than the site your started with. I.e. if you got to myboringwebpage.com and try to look up something on api.twitter.com within the app, the browser will stop you unless you add certain things to your web server/page telling the browser that that is OK. Look up "CORS". With Icenium, if you use the browser development environment "Mist" you will get those issues. If you use the Windows environment "Graphite" there is no such restriction. If you use the Intel HTML5 XDK at http://html5m.com/, it runs some process to get around those issues, while running a simulator in a browser. If you end up building PhoneGap apps, which you can using Icenium, appery.io, Intel HTML5 XDK, PhoneGap Build and others, the built app, installed on the phone, will not be restricted as an in-browser "app" would. However, I had problems with the Intel framework's XHR code handling all the different methods. Sorry this probably doesn't cover everything you need - you'll have to live and learn a lot of this.

Setting up a CMS for a Phonegap / Cordova iphone app

When making a iphone app with Phonegap / Cordova is it possible to attach a web based CMS to it, to pull the data down from, so that a non technical user could update the app ?
Usualy you'd just build them using html, css, jquery/js but i wandered if there was an easier way to update them ?
Rather than a CMS, you should look into static site generators. I use Jekyll for all my PhoneGap apps, including one that has a non-technical user updating the content.
Content pages are set up as markdown files with a yaml header - not quite as user friendly as a full CMS, but still pretty easy to edit.
I have jekyll set up as a build step, so all the generated html files get packaged and deployed to the device as part of a single click build process.
You could export static html from a web based CMS, but that will likely be more trouble than it is worth by the time you debug all the bits that were designed to work online only.
Loading the pages directly from the web will work just fine technically, but runs into several of the app store rules - no significant added functionality, no offline access and possibly downloading executable code.
You could use a normal cms on a server like a webpage so normal joomla wordpress etc.
Then you add the url to the phonegap whitelist and load it like the normal phonegap html url.
With DrupalGap, it is possible to create iOS (and Android, etc) mobile applications using PhoneGap and a Drupal powered website.
What is Drupal?
Drupal is an open source content management platform powering millions
of websites and applications. It’s built, used, and supported by an
active and diverse community of people around the world.
Why Drupal?
Use Drupal to build everything from personal blogs to enterprise
applications. Thousands of add-on modules and designs let you build
any site you can imagine.
What is DrupalGap?
DrupalGap is an open source mobile application development kit for
Drupal websites. It uses Drupal, PhoneGap, jQuery Mobile and jDrupal.
With the DrupalGap Mobile Application Development Kit and API,
developers can create custom multi-platform mobile applications that
communicate with their Drupal websites.
Helpful Links
DrupalGap Getting Started Guide
DrupalGap SDK on GitHub

Using Phonegap as a native container for a Rails 3 App

I'm looking into using PhoneGap for an iOS app so that I can utilize the camera API. The plan is to use Rails to manage the entire experience. At this point, I'm not particularly concerned about performance. If it wasn't for the need for the camera, I would simply design it as a true web app.
Most of the answers and tutorials I have found suggest using ajax to the backend server to render the frontend. At this point in the app development, I'm not sure I want to build so much of the view in JS and would prefer to use Rails to render the views. I have seen a few very brief references to use PhoneGap as a container to literally render the Rails app. Performance aside, is this possible and how would I set up the core html file in PhoneGap to let the mobile app run normally?
I do not believe such a container exists to run on the client side but it is possible to dynamically serve a PhoneGap app (i.e. the app acts as a web browser with native functionality available via javascript commands).
Here is code which demonstrate exactly what you are describing.
Here is a screen cast I did associated with demo.
NOTE: The demo is using an out 3.2.1, and is broken as of the latest version Xcode and/or PhoneGap but it is possible, and apps of this nature are valid in the the various app stores, (Linkedin alongwith many others are already doing it.) The logic is there I just haven't had the time to fix the bug with the new version of Xcode, or update the PhoneGap code (doing the update may actually fix the bug in one quick work session).
Maybe you can also check my example app that is exported to Phoengap. It doesn't use camera but it is possible to combine native parts with Phonegap.
https://github.com/joscas/base_app/tree/devel (currently in the devel branch for the exportable version)
Life deploy: https://starter-app-staging.herokuapp.com (the desktop version)
It is based on rails / ember.js plus with token authentication (ember-auth) + OAuth (Google, LinkedIn,..) and Devise.
It uses the (phonegap-rails) gem I've created to export assets, fix paths etc.

Resources