jQueryMobile / bootstrap / both - jquery-mobile

Today we got one version of the system for desktop and we got one version with jQueryMobile.
The goal is to only have one system/page for desktop, tablets and mobiles.
I know that bootstrap is a good css/js framework and it is responsive. That will soulve the todays problem with the desktop version of our system.
As I said we have one mobile version as well. But today it gives us some "double work". And it is made in webforms.
My thought was to use bootstrap for both desktop and mobile. But my boss like jQuerymobile look and functionality.
We belive that our main users will be mobile/tablet users. So the best solution will perhaps be to remake the jquerymobile page and build it with MVC?
The main content of the system is for eployees to check their scheme, accept work-suggestions from their bosses and so on... This is in a calender.
There will be some more functionality in this calendar futher on.
Ofc there is some other stuff in the system but this calendar is the biggest.
My question is what direction we will go with this. The goal is to have one page/system for both mobile and desktop users.

If you are using JqueryMobile, I normally use another kind of windows events, but i have tried those events in normal pc browser and they tend to work okay. So why dont you build the system base on jquery mobile and just change the layout depending on who is making the request with a agent request.

Related

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.

Meteor + jQuery Mobile + Phonegap

How to connect jQuery Mobile (meteor add ...)? I understand that you can connect by adding the head, but I do not want to.
I know about how to use Meteor + Phonegap, however, advise which option is better?
Outdated information:
jQuery-Mobile Meteor sample integration and/or integration guidelines
I created a new jQuery mobile (jqm) demo app at jqmdemo.meteor.com
because the "old" demo app (jqm.meteor.com) wasn't working as expected.
You can create a package in your local lib folder to use jqm in meteor (see source code on bitbucket, link is on the demo page).
There's no meteorite package for this at atmosphere yet (mrt add ...). I haven't created one, because I think there are still many things that can be improved in the demo (e.g. popups are not working in the demo).
Also event binding needs to be re-checked because I added the event to the rendered function of the templates with jQuery.on(...).
Attaching the jquery mobile events to the template.[yourtemplate].events({}) handler would be better, but I don't know how to do this.
I can not say anything to phonegap at the moment. Because I haven't tested it.
But at the moment I think that jqm and meteor is a bit slow in performance. If you have a look at the fontawesome-demo inside of the jqm demo you'll notice that it takes quite long to render the >300 icons. Maybe a server side rendering would be better, but I think that's not ready in meteor.

Twitter Bootstrap for mobile

If I want to develop an web application on mobile, so should I use Twitter Bootstrap or Jquery Mobile? Twitter Bootstrap good for mobile or not?
As of version 2.0, Bootstrap is fully mobile compatible. There actually has been another question about it.
One thing you may want to keep in mind, is the purpose they're build for. jQuery mobile was created and is maintained with mobile compatibility in mind whereas Bootstrap offers it as an addition (meaning that it won't be it's main priority). If there is nothing in bootstrap that you are particularly interested in, I would go for jQuery mobile.
Depends what you want to do..
Twitter bootstrap is a CSS framework with some javascripts on it. While jquery Mobile is javascript to create native mobile feel..
So basically they are quite different..
Bootstrap 3 is built group up for mobile first, you may want to take a look at the 3.0 branch on GitHub. I didn't use jquery mobile in my app Django Market b/c I would have to change the backend and didn't want to invest. Bootstrap 3.0 IMHO will provide a lot of "competition" for other frameworks due to its power and simplicity
From my experience, i've using jQuery Mobile for a simple informative application. I spent some days on the base code, then i tested it on tablets, handsets using PhoneGap and the results wasn't good. There are still some troubles on transitions for Android and iOS devices.

What JavaScript framework do you use with trigger.io? (backbone, knockout, ember, angular)

What JavaScript framework do you use successfully with Trigger.io? I mean client side JS app frameworks like backbone, knockout, ember, angular?
We use angular.js here but have some significant problems when using router for our app ... see details here https://groups.google.com/forum/?fromgroups#!topic/angular/XGDRAskA8qs .
Trigger.io and using angular.js router doesnt work together.(at least we could not get it to work)
Do you use some other JS framework you can recommend as working fine with trigger.io using application router capability? (I could see similar router feature in ember or backbone for example)
Although we don't endorse one particular library, and our goal is to be compatible with them all, I normally reach for Backbone first when starting a Trigger app. It's simple, lightweight but powerful and has a bunch of nice extensions.
Apart from the issues with Angular which we aim to have fixed as part of our next major release (probably end of July '12), we've not had reports of any snags with other libraries apart from Amber Smalltalk, which should be fixed in the same release.
We have demo apps using Backbone and Sencha here and here, and our initial demo app is written using jQuery Mobile.
I'm using jQuery, Backbonejs, Handlebars, Coffeescript, LESS as my framework - they are pretty much all from my Web development effort. Didn't have to change too much.
In fact, so far, I'm finding I have to simplify a LOT of things to get it down to a level where it fits the mobile environment.
Angular JS is one of the best contenders out there as far as JavaScript Frameworks. I ran all the way through the Angular tutorial, created a new Trigger app, and dropped in the tutorial app in place of the default scaffolding.
RAN NO PROBLEM WHAT SO EVER!!! IOS, Android, and WEB
Interestingly enough, I adapted the Angular tutorial with my own data from a server. Even works using XHR requests, and Cross Origin Resource Sharing.
In my opinion, build your app using Angular.JS + Zepto/Jquery.
Use either of those frameworks to add CSS Transitions to your app for your UI.
The reason I recommend making your own UI rather than using something like JQuery Mobile, or Sencha Touch 2 is for the past 3 days I have been doing extensive research and testing on numerouse JS Mobile UI Frameworks, and JQmobi is the only one that came close to being fast but it didnt look vary nice.
Making your own will reduce size of the app, give you full control, and keep the app running smooth..your using will never know its not native ;P

What jQuery mobile build is running at http://jquerymobile.com/test?

It seems that the jQuery Mobile test site at http://jquerymobile.com/test is not really running alpha 2 (despite of what is written on the first page).
It definitely shows different (and perhaps less?) bugs than the alpha 2 demo at http://jquerymobile.com/demos/1.0a2/
Does that mean that the test site is running the latest nightly build? If not, what version is that?
As I just found out it is the daily build of jQuery Mobile. Which (as I hoped) makes it the easiest way to stay up to date with the latest development version.
if you view source on the page. and then click the link to the 'js' file (script src="js/" ) this then links to here.
http://jquerymobile.com/test/js/
v 1.4.4?
edit: it looks like the mobile script may be combined with the jQuery script.
search for * jQuery Mobile Framework : widget factory extentions for mobile in the js and that may be the start of it.
cant see a version number though :(

Resources