moparisthebest
/
app-UI
mirror of https://github.com/moparisthebest/app-UI
1
0
Fork 0
Code Issues Releases Wiki Activity

replaced parameter lists by an options object; minor fixes; 

replaced parameter list by an options object in viewNavigator and
splitNavigator. Also updated examples and replaced spaced by tabs in
examples files.
This commit is contained in:
Andre Meyering 2013-01-23 15:37:46 +01:00
parent 9f26e42049
commit 5f95713d87
17 changed files with 5221 additions and 1079 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4123
samples/01 - viewnavigator/02 - movie reviews/phonegap-1.4.1.js Normal file
View File

File diff suppressed because it is too large Load Diff

4
samples/02 - splitviewnavigator/01 - basic/index.html
View File

@ -34,7 +34,9 @@
//Setup the ViewNavigator
new SplitViewNavigator( 'body', "Menu" );
new SplitViewNavigator( 'body', {
toggleButtonLabel: 'Menu'
});
window.splitViewNavigator.pushSidebarView( sidebarViewDescriptor );
window.splitViewNavigator.pushBodyView( bodyViewDescriptor );

4
samples/02 - splitviewnavigator/02 - movie reviews/index.html
View File

@ -198,7 +198,9 @@
//Setup the ViewNavigator
new SplitViewNavigator( 'body', "Movies" );
new SplitViewNavigator( 'body', {
toggleButtonLabel: 'Movies'
});
window.splitViewNavigator.pushSidebarView( controller.rootView );
window.splitViewNavigator.pushBodyView( defaultView );

4
samples/04 - browser history/index.html
View File

@ -155,7 +155,9 @@
};
//Setup the ViewNavigator
window.viewNavigator = new ViewNavigator( 'body', 'headerButton' );
window.viewNavigator = new ViewNavigator( 'body', {
backLinkCSS: 'headerButton'
});
window.viewNavigator.pushView( defaultViewDescriptor );

6
samples/05 - multi-device form factor/www/index.html
View File

@ -215,13 +215,15 @@
if ( controller.tabletView ) {
//Setup the ViewNavigator
new SplitViewNavigator( 'body', "Movies" );
new SplitViewNavigator( 'body', {
toggleButtonLabel: 'Movies'
});
window.splitViewNavigator.pushSidebarView( controller.rootView );
window.splitViewNavigator.pushBodyView( defaultView );
}
else {
//phone view
window.viewNavigator = new ViewNavigator( 'body', "Movies" );
window.viewNavigator = new ViewNavigator( 'body' );
window.viewNavigator.pushView( controller.rootView );
}
} );

27
src/splitviewnavigator/splitviewnavigator.js
View File

@ -11,7 +11,16 @@ ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
*/
var SplitViewNavigator = function( target, toggleButtonLabel, backLinkCSS, bindToWindow ) {
var SplitViewNavigator = function( target, options ) {
var defaults = {
CSSNamespace: 'splitViewNavigator_',
toggleButtonLabel: 'Menu',
backLinkCSS: 'viewNavigator_backButton',
bindToWindow: true
};
this.options = options = $.extend( {}, defaults, options );
this.animating = false;
this.animationDuration = 350;
@ -23,18 +32,16 @@ var SplitViewNavigator = function( target, toggleButtonLabel, backLinkCSS, bindT
var regexp = new RegExp('Windows Phone OS 7');
this.winPhone = (navigator.userAgent.search(regexp) >= 0);
this.rootElement = $('<div class="splitViewNavigator_root"></div>');
this.sidebarContainer = $('<div class="splitViewNavigator_sidebar"></div>');
this.rootElement = $('<div class="' + options.CSSNamespace + 'root"></div>');
this.sidebarContainer = $('<div class="' + options.CSSNamespace + 'sidebar"></div>');
this.contentOverlay = $('<div class="content_overlay_hidden" id="overlay'+this.uniqueId+'"></div>');
this.bodyContainer = $('<div class="splitViewNavigator_body"></div>');
this.bodyContainer = $('<div class="' + options.CSSNamespace + 'body"></div>');
this.sidebarViewNavigator = new ViewNavigator( this.sidebarContainer.get()[0], backLinkCSS, false );
this.sidebarViewNavigator = new ViewNavigator( this.sidebarContainer.get()[0], options.backLinkCSS, false );
this.bodyViewNavigator = new ViewNavigator( this.bodyContainer.get()[0], backLinkCSS, false );
this.bodyViewNavigator = new ViewNavigator( this.bodyContainer.get()[0], options.backLinkCSS, false );
this.backLinkCSS = backLinkCSS ? backLinkCSS : 'viewNavigator_backButton';
this.toggleSidebarButton = $('<li class="viewNavigator_backButton viewNavigator_backButtonPosition ' + backLinkCSS + '" id="toggle' + this.uniqueId + '" onclick="window.splitViewNavigator.showSidebar()">'+toggleButtonLabel+'</li>');
this.toggleSidebarButton = $('<li class="viewNavigator_backButton viewNavigator_backButtonPosition ' + options.backLinkCSS + '" id="toggle' + this.uniqueId + '" onclick="window.splitViewNavigator.showSidebar()">' + options.toggleButtonLabel + '</li>');
this.rootElement.append( this.bodyContainer );
this.rootElement.append( this.contentOverlay );
@ -52,7 +59,7 @@ var SplitViewNavigator = function( target, toggleButtonLabel, backLinkCSS, bindT
this.parent.resize( function(event){ self.resizeContent() } );
//}
if ( bindToWindow != false ) {
if ( options.bindToWindow != false ) {
$(window).resize( function(event){ self.resizeContent() } );
}
else {

30
src/viewnavigator/viewnavigator.js
View File

@ -11,7 +11,15 @@ ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
*/
var ViewNavigator = function( target, backLinkCSS, bindToWindow ) {
var ViewNavigator = function( target, options ) {
var defaults = {
CSSNamespace: 'viewNavigator_',
backLinkCSS: 'viewNavigator_backButton',
bindToWindow: true
};
this.options = options = $.extend( {}, defaults, options );
this.supportsBackKey = true; //phonegap on android only
this.animating = false;
@ -26,22 +34,20 @@ var ViewNavigator = function( target, backLinkCSS, bindToWindow ) {
var regexp = new RegExp('Windows Phone OS 7');
this.winPhone = (navigator.userAgent.search(regexp) >= 0);
this.rootElement = $('<div class="viewNavigator_root"></div>');
this.header = $('<div class="viewNavigator_header"></div>');
this.content = $('<div class="viewNavigator_content" id="contentRoot"></div>');
this.rootElement = $('<div class="' + this.options.CSSNamespace + 'root"></div>');
this.header = $('<div class="' + options.CSSNamespace + 'header"></div>');
this.content = $('<div class="' + options.CSSNamespace + 'content" id="contentRoot"></div>');
this.rootElement.append( this.header );
this.rootElement.append( this.content );
this.parent = $( target );
this.backLinkCSS = backLinkCSS ? backLinkCSS : 'viewNavigator_backButton';
var self = this;
//$(window).resize( function(event){ self.resizeContent() } );
//alert( this.parent.toString() );
//this.parent.resize( function(event){ self.resizeContent() } );
if ( bindToWindow != false ) {
if ( options.bindToWindow != false ) {
$(window).resize( function(event){ self.resizeContent() } );
}
else {
@ -106,19 +112,17 @@ ViewNavigator.prototype.updateView = function( viewDescriptor ) {
this.animating = true;
this.contentPendingRemove = this.contentViewHolder;
this.headerContentPendingRemove = this.headerContent;
this.headerContent = $('<div class="viewNavigator_headerContent"></div>');
this.headerContent = $('<div class="' + this.options.CSSNamespace + 'headerContent"></div>');
this.headerTitle = $('<div class="viewNavigator_header_title">' + viewDescriptor.title + '</div>');
this.headerTitle = $('<div class="' + this.options.CSSNamespace + 'header_title">' + viewDescriptor.title + '</div>');
this.headerContent.append( this.headerTitle );
var linkGuid = this.guid();
if ( viewDescriptor.backLabel ) {
this.headerBacklink = $('<li class="viewNavigator_header_backlink viewNavigator_backButtonPosition ' + this.backLinkCSS +'" id="link' + linkGuid + '" onclick="window.viewNavigators[\'' + this.uniqueId + '\'].popView()">'+ viewDescriptor.backLabel + '</li>');
this.headerBacklink = $('<li class="' + this.options.CSSNamespace + 'header_backlink ' + this.options.CSSNamespace + 'backButtonPosition ' + this.options.backLinkCSS +'" id="link' + linkGuid + '" onclick="window.viewNavigators[\'' + this.uniqueId + '\'].popView()">'+ viewDescriptor.backLabel + '</li>');
this.headerContent.append( this.headerBacklink );
//this is for proper handling in splitviewnavigator
@ -126,7 +130,7 @@ ViewNavigator.prototype.updateView = function( viewDescriptor ) {
}
var id = this.guid();
this.contentViewHolder = $('<div class="viewNavigator_contentHolder" id="' + id + '"></div>');
this.contentViewHolder = $('<div class="' + this.options.CSSNamespace + 'contentHolder" id="' + id + '"></div>');
this.contentViewHolder.append( viewDescriptor.view );
this.resizeContent();