jQuery Mobile Team Meeting – May 24 2012

link Download builder

link jQM Modularity

  • I’ve heard a bunch of questions recently about how monolithic the library is. I know we’ve done a lot of decoupling work internally and now have the download builder which will help quite a bit.

  • Modularity questions: how much make we break things up for consumption:

    • Only want utilities like touch events, zoom fix, orientation (not yet?)
    • Want a specific subset of widgets and transitions (yes)
    • Only want certain widgets, no nav model (yes)
    • Only want nav model/transitions, no widgets or CSS framework (yes)

  • I’d like to do some analysis for LOE and see if we should focus on this for 1.3.

  • All modules use $.mobile - requires core

  • Also jQ core dependencies to consider - tree shaking to see how much we use

  • What is core? What is a module?

link Timing

1.1.1 rc1 - conference? 1.2.0 alpha/beta - conference?

Need to discuss this more as we get closer.

link Test suite

John Bender - use grunt and now Phantom on swam.jquery.com More stable, consistent, and easy to debug Once we get test swarm running, we’ll be able to test in multiple browsers - that is the next priority for Bender

link Open dev questions

Auto-scroll expandibles - Todd to test https://github.com/jquery/jquery-mobile/pull/3520#issuecomment-5702502

Opera mini bug - text focus https://github.com/jquery/jquery-mobile/issues/4311#issuecomment-5733560

link Multi-view (tablet) layout Q’s from Sven

  • Quick update:

I'm sort of done with my new multiview version. Some minor stuff left to do, but I worked out the main obstalces in tapping into JQM navigation and urlHistory to handle all panel transitions. I tested in IE8 and on iPad iOS 3 yesterday, which both worked, so I'm pretty happy with it. I will try to finish up in the next couple of weeks and set up a new multiview demo, too.

The plugin now only requires 4 changes in JQM. If you have the time and any idea how I could get by without changing the following, I'd try to work this into multiview to stay "JQM tweak free" (I could also do a pull request on Github with the changes, if that's easier than via email...

Thanks & best regards,

Sven

  • JQM changes:
  1. createHandler - cleanform function = need to add an if-clause to prevent JQM from dropping active class on the wrong page.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
 
    ...
 
    if ( $to.parents('.ui-page-active').length == 0  && $from.parents('.ui-page-active').length == 0 ) {                    
 
           $from.closest(':jqmData(wrapper="true")').removeClass( $.mobile.activePageClass );    
 
           return;
 
            }
 
    ...
 
    $from
 
          .removeClass( $.mobile.activePageClass + " out in reverse " + name )
  1. urlHistory - store pageContainer in URL history
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
 
    ....
 
    addNew: function( url, transition, title, pageUrl, role, pageContainer ) {
 
    ...
 
       urlHistory.stack.push( {url : url, transition: transition, title: title, pageUrl: pageUrl, role: role, pageContainer: pageContainer } );
 
    ...
 
    $.mobile.changePage(
 
    ...
 
       if( !historyDir ) {
 
           urlHistory.addNew( url, settings.transition, pageTitle, pageUrl, settings.role, settings.pageContainer );
 
            }
  1. transitionPages - promise.done(function() - add if-clause to prevent removing the wrapper page
1
2
3
4
5
6
7
8
9
 
    if( fromPage ) {
 
           if ( $(fromPage).jqmData('internal-page') != true && (fromPage).jqmData('data-dom-cache') != true ) {
 
                   fromPage.data( "page" )._trigger( "hide", null, { nextPage: toPage } );
 
                    }
 
            }
  1. Plugin init - $.extend - set a flag to allow deeplinking on panels
1
2
3
4
5
6
7
8
9
 
    // if hashchange listening is disabled or there's no hash deeplink, change to the first page in the DOM
 
    if ( !$.mobile.hashListeningEnabled || !$.mobile.path.stripHash( location.hash ) || $( window.location.hash ).closest('div:jqmData(role="panel")').length > 0 ) {
 
          $('html').data("deep", window.location.hash);
 
          $.mobile.changePage( $.mobile.firstPage, { transition: "none", reverse: true, changeHash: false, fromHashChange: true } );
 
           }

link 1.1.1 Planning

link Pull requests

link PhoneGap blinky transitions

link Fixed toolbars / updatePagePadding / header and content switched

  • Many related issues

link Re-enhancement after manipulation

link Button/form consistency

  • Should we add styles to protect buttons from a: basic styles?

  • https://github.com/jquery/jquery-mobile/issues/3444

  • PR #4385 commit 8509d57

  • Cascade issue bar link colors + reorder pseudo classes (also PR #4385)

  • TR issue #73 - links in bar not themable, always same as JQM default theme (Tyler Benziger)

link 2.3 nav issues

link 1.2 Features

Issues: https://github.com/jquery/jquery-mobile/issues?milestone=13&page=1&state=open

link Read-only lists

  • New styling including removal smaller font-size and padding of ui-li-static for 1.2 #4347

link 1.3 Features

###Fetchlink - Needs API design

###Tabs - standalone widget or just a fetchlink demo?

###Library modularity?

###Themes: Multiple active states

  • Support active state per swatch instead of a global active (Tyler - LOE?)
  • If we make it a full button state class (.ui-btn-active-a) what to do with ui-focus box-shadow color?

###Grid widget?

  • have the framework adding the ui-block classes (same as navbar widget) data attribute # columns

link 1.future

Prioritize and start sequencing the next few releases for the remainder of the year

  • Tablet responsive layout patterns - YES!

  • Overflow regions - overthrow.js, be very defensive here to not break platforms

  • Performance optimizations to speed up rendering and interactions, enhancement - if you’re building a dynamic app, writing out the enhanced markup directly instead of starting with basic then enhancing via create makes more sense

  • Slider lag (look at UI?)

  • Pre-enhance markup

  • Carousel?

  • Pull in autocomplete from UI?

  • Pull in position from UI?

  • Pull in progressbar from UI?

  • Light calendar picker?

  • Scan wiki/feature-request and jQuery forum/ideas for interesting new features

link Infrastructure

###Migration to Grunt (Bender) Migration to Grunt in progress - JS and CSS only, not docs or zip because they aren’t public targets. Need to check with team on this. DONE

link Sort out Test / TestSwarm issues

  • Migrated existing tests to Phantomjs. Need to setup multiple jquery versions. Fixing existing build issues. Soon.

link Redirects for Branch Preview / Test to new server (per D. Heberden)

  • Looking into this.

link Plugin site requirements

  • Package JSON file for our plugins

link UI Integration

  • Test port of mobile TR framework onto a UI widget (TBD) as a POC - Scott/Mat
  • Download builder - status of UI’s tool?

link 3rd Party Widgets

  • Think about how to curate semi-official widgets that we recommend to offload some of the dev work. Bender wants to think about how to register and init widgets to make this easier.

link ThemeRoller - 3rd party tools

  • All sorts of web apps or software tools may want to integrate ThemeRoller functionality - how to make this as seamless as possible w/o hooking in too deeply?

  • Current idea: Support a lightweight round trip theme solution that lets a 3rd party tool have a button that would launch TR in a new window/iframe. This could either be a default TR theme (Create new theme) or it could support editing by pushing in a theme (via the import mechanism) so the theme would appear in TR, ready for modification. In TR, allow the Download button to be customized in appearance (Save to App X + icon) and the 3rd party tool would write a handler to manage the manipulation and saving of the TR output on their side. We'd just provide the hooks in and out so this would be a new API for developers to use TR without forking it and making a custom build.

  • Tyler needs to do more work on the versioning side of things to support this. The guys from Codiqa have volunteered to help with some of the engineering and to be the test case for this to help us work out the kinks. This would launch as an open platform and others tools can help participate in shaping this as we go.

  • Help test the new ThemeRoller versioning: http://jquerymobile.com/themeroller-test/

link Download builder