JQuery Mobile and Encapsulator

JQuery Mobile and Encapsulator

Ritratto di Arnaud Delcasse
Arnaud Delcasse
Lun, 10/10/2011 - 11:52
Hi, I tried to use the encapsulator to create an HTML5 application using Jquery Mobile 1.0rc1 (with JQuery 1.6.4) and it doesn't work. The transitions between pages fail. I tried the same code with QtWebkit directly from the QtSDK and it works. I tried this on a MeeGo Tablet, installing the RPM file through rpm -i. Is there any issue with JQuery Mobile ? Or anything that I've missed when creating my app ? Best Regards. A. Delcasse
RSS In cima
11 post / 0 new
Ultimo contenuto
Per informazioni complete sulle ottimizzazioni del compilatore, consultare l'Avviso sull'ottimizzazione
Ritratto di Rene Dudfield
Rene Dudfield
Mar, 11/10/2011 - 01:02

Hi,

I think the version of QtWebKit used is very old, and doesn't support many modern features. I wrote a more detailed post about QtWebKit where you can find information about features supported, and bugs etc.
http://appdeveloper.intel.com/en-us/forums/qtwebkit-roadmap-and-encapsulator-roadmap

Hopefully an upgrade of QtWebKit used by the encapsulator will fix the problem.

cheers,

In cima
Ritratto di Arnaud Delcasse
Arnaud Delcasse
Mar, 11/10/2011 - 01:50

Hello,

Thanks for the reply.
I saw your post and wanted to point again on that issue which is quite annoying. I think, the Appup Encapsulator should be a way to make HTML5 development and packaging easier, but it's becoming more difficult than if we decide to package it ourself. JQuery Mobile works well with QtWebkit and on the Nokia N9's MeeGo 1.2 Harmattan. It shouldn't be so difficult to make the encapsulator functional and up-to-date as well, especially when Intel is pushing HTML5 and organizes a contest to get apps.

So yes, hopefully an upgrade would fix all the issues you mentioned, to be able to use modern HTML5 frameworks and features ...

Actually, concerning my issue (to help people facing the same problem), there is a workaround to make Jquery mobile transitions functional : if all the pages are described within the same file (index.html), the transitions work. But it's becoming quite quickly a mess when we have lots of pages.

Regards

A. Delcasse

In cima
Ritratto di Andy Idsinga (Intel)
Andy Idsinga (Intel)
Mer, 12/10/2011 - 15:40

Hey Arnaud - are there any errors in the inspector / javascript console?

I'm loading the jquery mobile site (this url : http://jquerymobile.com/demos/1.0rc1/docs/pages/page-transitions.html ) ..inside an iframe ..in a test app.

each of the transitions seems to be working.

In cima
Ritratto di Arnaud Delcasse
Arnaud Delcasse
Gio, 13/10/2011 - 01:43

Hello Andy,

Thanks for the reply.

I've tested my app locally only. All the pages should have been handled inside the encapsulator files paths and not through HTTP. I tried without JQuery Mobile and relative (and local) work fine, but not when I'm loading my app with Jquery Mobile.

JQuery mobile is using AJAX requests to make transitions through pages : maybe there is a specificity with the encapsulator to handle local AJAX requests and file paths ? I''ll give it a try later : for the moment, I've regrouped all my pages inside the same index.html and transitions are working that way.

If you want to make tests, I can send you a previous version of my code, when I had not only one html file (It will be open source anyway). I will try it both through HTTP using an iframe and with encapsulator to see if there are differences.

Best Regards.

Arnaud Delcasse

In cima
Ritratto di Andy Idsinga (Intel)
Andy Idsinga (Intel)
Gio, 13/10/2011 - 11:24

Hey Arnaud - please let me know how your tests go..

Re etst code just show me a code snippet here on the forum (can be pseudo code) that shows the basic logic you are using for two pages. (dont send whole code).

Thanks - hopefully we can help find a way to get you going again :)

In cima
Ritratto di Arnaud Delcasse
Arnaud Delcasse
Sab, 15/10/2011 - 13:26

Hello Andy,

I investigated a little more and it looks like the encapsulator is blocking Ajax requests from a file encapsulated to another, similarly to what Google Chrome does when you get an error "Origin null is not allowed by Access-Control-Allow-Origin.", which happens as the default behavior with file:// protocol.
I will retry it with a "classic" QtWebkit (from a recent QtSDK) but it was working last time I tried my code on it.

How does the encapsulator handle security concerning Ajax requests on local filesystems ? Does that mean that we can't send ajax requests between 2 pages in our local code ?

If you want to try, you can just make a basic page :

[!DOCTYPE html]


[head]

[!-- Includes of JQuery and JQuery Mobile scripts and styles --]

[link rel="stylesheet" href="jquery.mobile-1.0rc1.min.css" /]

[script src="jquery-1.6.4.min.js"][/script]

[script src="jquery.mobile-1.0rc1.min.js"][/script]

[/head]

[body]

[a href="index2.html"]Link to page 2[/a]

[/body]

(I replaced all < and > by [ and ] ...)

(index2.html being a page similar, in the same directory)

By the way, if I put rel="external" in my links, which deactivate ajax transitions from JQuery Mobile, links work correctly (but without fancy transitions from JQuery Mobile ;)).

In cima
Ritratto di Arnaud Delcasse
Arnaud Delcasse
Dom, 16/10/2011 - 15:14

I tried again with a QtWebkit from the last QtSDK, and transitions work.

In cima
Ritratto di Andy Idsinga (Intel)
Andy Idsinga (Intel)
Lun, 17/10/2011 - 10:12

Hey Arnaud - thanks for the updates. Can you give me the specific version number and URLs of the QtSDK that you used to make it work?

In cima
Ritratto di Arnaud Delcasse
Arnaud Delcasse
Lun, 17/10/2011 - 10:48

Hello Andy,

I used the latest QtSDK, version 1.1.3 (Qt version is 4.7.4, from the official website : http://qt.nokia.com/downloads/sdk-linux-x11-32bit-cpp
I will disable JQuery Mobile effects anyway as it's quite slow on MeeGo ...

Best Regards.

A. Delcasse

In cima
Ritratto di rzr
rzr
Gio, 10/11/2011 - 16:18

I just created a sample test kalkulilo you can install on harmattan/GNU/Linux for now using emacs that run in native browser but I feel its not as usable as qml app ...

Can you avoid those blinking effets and slowness ? and please suggest how to create crossplatform html apps ?

Regards

-- http://rzr.online.fr/q/intel# Please support TiZen, native TiZen (qt,efl), android-x86, MeeGo, and other opensource projets...
In cima

Accedere per lasciare un commento.