plugin: multiview

I'm looking for comments on two possible versions of a multiview-plugin (both based on the original splitview plugin):

Version 1: Detail
Version 2: Detail2

Version 1 is done with unbinding JQM-events, while Version 2 keeps JQM intact, with only minor changes being made to the fixedToolbar function.

Both versions have some additional features compared to the original plugin:

• fullscreen footer
• popovers: unlimited panels, each with JQM pages inside
• fullscreen-mode: on small screens popovers go fullscreen (resize your browser and reload the page)
• unbind from mobileinit to allow to have sites with both splitview and normal pages

Version 1:

• Pages and panels behave nicely and independently from each other
• scrollview is used for all pages

• need to unbind JQM events for fixed toolbars: main and menu panel need absolute positioning
• need to "screen-lock" (fix header to top, footer to bottom, set content height to remaining width), which looks nice on iOS, ok on Android until you change orientation and blank on Blankberry.
• scrollview and device scrolling can be active at the same time, e.g. if URL bar is not hidden

Version 2 (still very buggy, started a few days ago)

• JQM events intact
• by adding ui-element-fixed to the FixedToolbar function and changing $ap to $('body') you can attach the toolbar behavior to any element. This way panels stay in viewport when scrolling.
• fits into JQM docs layout, .type-home = wrapper-panel, .content-primary/secondary act as main/menu panel
• seems to display ok on devices I have (Android, iPad, Blackberry)

• menu scrolls with main-panel
• elements are fixed as ui-header-fixed and ui-footer-fixed.
• (still work in progress)

I'm looking for some feedback, which way you think is better to continue. What's good, what's bad, what should be added, what doesn't go?

Please send feedback to my Github account: frequent

Thanks!

Update 2011-10-02: updated Detail2 version

• upgraded to JQM RC1
• further edited fixedtoolbar function inside JQM to add fixed behavior to menu and popover panels
• now looking for a way to stop resize event from firing continuously inside fixedToolbars
• (current) worked out scrolling when popover panel (menu/popover) is open in fullscreen mode above actual page = set page height to panel height, remove ui-fixed-header/footer on main-page to keep toolbars hidden

Update 2011-10-10: updated Detail2 version

• rewrote plugin - now based on widget-factory-syntax recommended by JQM
• moved overwriting of JQM internalEvents from plugin into JQM-core, cause it's not possible to put a widget-plugin behind JQM.js and overwrite JQM internalEvents on mobileinit. Overwriting needs to be done by separate.js file sitting before JQM or (as is the case now) by overwriting inside JQM.js. Sections marked with "xxx fre"
• rewrote hiding/showing of popover/menu based on attribute status=hidden/visible: now independent of active-button class, which did not always work as it should
• modified page-height in fullscreen mode (smartphone). Popovers are opened in fullscreen mode (sitting as a layer on top of the actual page). In order to avoid needing scrollview, I take POPOVER active-page ui-content.height and set ui-content.height of MAIN active page to be the same until the popover is closed again. This way it looks as if you are scrolling the POPOVER, when in fact you are scrolling the MAIN page behind :-)
• Fixed footer is already behaving correct. Next up is adjusting the fixed header in fullscreen mode = remove fixed-elements from MAIN-page header when POPOVERS are running.