Permalink
Browse files

fixed issues with footer height, temporary code in AppBoilerplate theme

Signed-off-by: Jonathan Fielding <j.fielding@me.com>
  • Loading branch information...
1 parent ab43eba commit dc411398233e1fddb12deca3e6e6597ea3bf1540 @jonathan-fielding committed Mar 21, 2012
Showing with 61 additions and 12 deletions.
  1. +57 −11 assets/js/AppBoilerplate.js
  2. +1 −1 plugins/add_plugins.js
  3. +3 −0 themes/AppBoilerplate/style.css
@@ -37,7 +37,44 @@ var app = function(){
$('.ui-header').removeClass('slidedown');
$('.ui-page-footer-fullscreen.ui-page-header-fullscreen .ui-content').css('padding-bottom',$('.ui-page-footer-fullscreen .ui-footer').height() + 11);
-
+ }
+
+ var loadStyleSheet = function( path, id, fn, scope ) {
+ var head = document.getElementsByTagName( 'head' )[0], // reference to document.head for appending/ removing link nodes
+ link = document.createElement( 'link' ); // create the link node
+ link.setAttribute( 'href', path );
+ link.setAttribute( 'rel', 'stylesheet' );
+ link.setAttribute( 'type', 'text/css' );
+ link.setAttribute( 'id', id);
+
+ var sheet, cssRules;
+ // get the correct properties to check for depending on the browser
+ if ( 'sheet' in link ) {
+ sheet = 'sheet'; cssRules = 'cssRules';
+ }
+ else {
+ sheet = 'styleSheet'; cssRules = 'rules';
+ }
+
+ var interval_id = setInterval( function() { // start checking whether the style sheet has successfully loaded
+ try {
+ if ( link[sheet] && link[sheet][cssRules].length ) { // SUCCESS! our style sheet has loaded
+ clearInterval( interval_id ); // clear the counters
+ clearTimeout( timeout_id );
+ fn.call( scope || window, true, link ); // fire the callback with success == true
+ }
+ } catch( e ) {} finally {}
+ }, 10 ), // how often to check if the stylesheet is loaded
+ timeout_id = setTimeout( function() { // start counting down till fail
+ clearInterval( interval_id ); // clear the counters
+ clearTimeout( timeout_id );
+ head.removeChild( link ); // since the style sheet didn't load, remove the link node from the DOM
+ fn.call( scope || window, false, link ); // fire the callback with success == false
+ }, 15000 ); // how long to wait before failing
+
+ head.appendChild( link ); // insert the link node into the DOM and start loading the style sheet
+
+ return link; // return the link node;
}
return {
@@ -62,7 +99,6 @@ var app = function(){
//Styling
app.updateTheme();
- styleFix();
//Each module should have a javascript file, we pull this in here
require([javascript_required],function(){
@@ -74,21 +110,31 @@ var app = function(){
//load theme
if(app.theme != ''){
if($('head #appTheme').length){
- $('head #appTheme').attr('href',app.url_path + 'themes/' + app.theme + '/style.css');
- }
- else{
- var stylesheet = document.createElement('link');
- stylesheet.href = app.url_path + 'themes/' + app.theme + '/style.css';
- stylesheet.rel = 'stylesheet';
- stylesheet.type = 'text/css';
- stylesheet.id = 'appTheme';
- document.getElementsByTagName('head')[0].appendChild(stylesheet);
+ $('head #appTheme').remove();
}
+
+ loadStyleSheet(app.url_path + 'themes/' + app.theme + '/style.css','appTheme', function( success, link ) {
+ if ( success ) {
+ styleFix();
+ // code to execute if the style sheet was loaded successfully
+ }
+ else {
+ console.log(link)
+ console.log('error');
+ // code to execute if the style sheet failed to successfully
+ }
+ },this);
+
}
+
+
+
}
};
}();
$(document.body).live('pagechange', app.init);
+
+
View
@@ -7,7 +7,7 @@ var add_plugins = function(){
app.sample_plugin.init();
app.theme_switcher.default_theme = 'AppBoilerplate';
app.theme_switcher.android_theme = 'Android';
- app.theme_switcher.iOS_theme = 'AppBoilerplate';
+ app.theme_switcher.iOS_theme = 'iOS';
app.theme_switcher.winmob_theme = 'WindowsMob';
app.theme_switcher.init();
app.notify.init();
@@ -0,0 +1,3 @@
+body{
+ overflow-x: hidden;
+}

0 comments on commit dc41139

Please sign in to comment.