I wrote this small module to add my onload stuff:

function mytheme_onload() {
  return array("MM_preloadImages('myimages.png', 'myimages2.png')");
} 

I get the following error with image/view:

warning: Cannot modify header information - headers already sent by (output started at /home/username/public_html/modules/mytheme.module:1) in /home/username/public_html/includes/file.inc on line 436.

warning: Cannot modify header information - headers already sent by (output started at /home/username/public_html/modules/mytheme.module:1) in /home/username/public_html/includes/file.inc on line 436.

warning: Cannot modify header information - headers already sent by (output started at /home/username/public_html/modules/mytheme.module:1) in /home/username/public_html/includes/file.inc on line 436.

When I check the module and did not find any whitespace. What am I doing wrong?

Comments

gordon’s picture

I wouldn't actually use a module, I would do it in the theme, with a preg_replace to extract the javascript and then put it into my own onload attribute.

so on a basic phptemplate theme the body line will look something like this.

<body<?php print $onload_attributes ?>>

I would use the following to extract the js from the returned value and put it into my own.

<body on_load="MM_preloadImages('myimages.png', 'myimages2.png');<?php print preg_replace('/on_load="(.*)"/i', '\$1', $onload_attributes); ?>">

just remember to remove the _ from on load
--
Gordon Heydon
Heydon Consulting

--
Gordon Heydon

mariagwyn’s picture

Gordon,

I used your snippet above in my phptemplate to add an additional element to by body onload. I am able to get the element added, but I am not able to get the onload_attributes loaded.

Here is what I start with:
<body <?php print theme("onload_attribute"); ?> on_load="Pop_Go();">

The problem with this is that when there are attributes to load, the "pop_go" does not load because there are two onload functions. I then changed it to:

<body on_load="Pop_Go(); <?php print preg_replace('/on_load="(.*)"/i', '\$1', $onload_attributes); ?>">

Which produces this:

<body on_load="Pop_Go(); $1">

So, the Pop_Go functions works. However, the multiple other onloads do not load (in this case, this is the taxonomy_dhtml page, with lots of actuator menus).

What I want is this:

<body on_load="Pop_Go(); initializeMenu('menu_1', 'actuator1'); etc....

Changing the numerical paramater only prints the number in the code.

Any suggestions? I am missing something, but I am not very savvy in JS or PHO, so help would be appreciated.

Thanks,
Maria

rla’s picture

try changing the '\$1' to '\\1'

jessearana’s picture

<body style="background-color:red;" {onload_attributes}>

worked for me, so I expect any CSS attribute of the style tag would also

jessearana’s picture

<body style="background-color:red;" {onload_attributes}>

worked for me, so I expect any CSS attribute of the style tag would also

SteveMatthews’s picture

Sorry CSS doesn't work if you want to include 2 body onload handlers, only other visual attributes.

I use xtemplate, on 4.6.5, and don't want to hack the theme.inc.

Does anyone have a solution similar to the original post? - a small module based solution? It shouldn't be so difficult to have 2 body onload handlers.

Code Rader’s picture

You can add onload event another way and not just in the body tag.

In the head (or in any of the javascript files) you can use this line to get stuff done.

window.onload = function () {
//add your code here
}

Jeff Rader
http;//lubtex.com/OS/

Jeff Rader

Code Rader’s picture

That doesn't work.

That overwrites any onload events as well.

You need to use addLoadEvent. This is included in 4.7 for some pages, but the function can be added anywhere.

See here http://drupal.org/node/45531

And http://simon.incutio.com/archive/2004/05/26/addLoadEvent

I had to add the function to my page because I needed my function loaded on pages where the drupal.js wasn't loaded. It works good.

Jeff Rader
http;//lubtex.com/OS/

Jeff Rader

M@ster’s picture

Replace addLoadEvent in drupal.js

function addLoadEvent(_function) {
	var _onload = window.onload;
	if ( typeof window.onload != 'function' ) {
		if ( window.onload ) {
			window.onload = _function;
		} else {
			var _addEventListener = window.addEventListener || document.addEventListener;
			var _attachEvent = window.attachEvent || document.attachEvent;
			if ( _addEventListener ) {
				_addEventListener('load', _function, true);
				return true;
			} else if ( _attachEvent ) {
				var _result = _attachEvent('onload', _function);
				return _result;
			} else {
				//todo: preloading fix for ie5.2 on mac os
				return false;
			}
		}
	} else {
		window.onload = function() {
			_onload();
			_function();
		}
	}
}

if you want add new function in load

function c() {
 .... same code .....
}
addLoadEvent(c);
Annika’s picture

Hi,

please explain further. I'm horrible at js, but I need to add two javascripts to my page.tpl.php. Right now, one is working but then Drupal's expandable menus are disabled (even though I put all custom stuff BEFORE drupal events load). The other is not working at all, probably because of a conflict.

In the HEAD I need (or have at the moment):

<script type="text/javascript" src="scripts/p7_eqCols2_10.js"></script>
<script type="text/javascript" src="scripts/nifty.js"></script>
<script type="text/javascript">
window.onload=function(){
if(!NiftyCheck())
    return;
Rounded("div#linkbox","all","transparent","#FFF","border #CCC");
}
</script>

On the body tag I currently need <body onLoad="P7_equalCols2(1,'main','DIV','sidebar','DIV');<?php print theme("onload_attribute"); ?>">

The php print theme("onload_attribute"); is set by the theme, a modded version of Friends Electric.

I need to either add something to the drupal.js or even better, add the onload stuff to my template.php as I prefer not to hack core if I can avoid it due to easier updates.

With the hack above, I don't understand the second part. Does "....same code..." refer to the one above it, and if so, how much should I copy and paste? Does it include the else statement? Or does it refer to the code I want to insert?

Hope somebody answer quickly! I'm running out of time with my project and the client is getting impatient!

:-)

Ayza

P.S. There is no need to suggest the NiftyCorner module as it runs Nifty Corner Cube that does not provide the rounded borders I'm after. D.S.

Annika’s picture

Hi,

I thought I share the solution I found - or rather that my javascript guru of a friend devised for me:

In the head section of page.tpl.php:

<?php print $head ?>
<?php print $styles ?>

<script type="text/javascript" src="scripts/p7_eqCols2_10.js"></script>
<script type="text/javascript" src="scripts/niftycorners.js"></script>

<script>

function load_nifty() {
	if(!NiftyCheck())
		return;
	Rounded("div#linkbox","all","transparent","#FFF","border #CCC");
}

function load_p7() {
	P7_equalCols2(0,'main','DIV','sidebar','DIV')
}

addLoadEvent(load_nifty)
addLoadEvent(load_p7)

</script>

So,to run it down:

1. Add the links to the scripts as you normally do.

2. Add new script tags.

3. With in them, add "function load_yourtitle(){
- the details of what you want to be loaded (i.e. what the script maker has told you should go inte the head) -
}

4. Finish off with adding "addLoadEvent(load_yourtitle)"

With this method there is no messing around with Drupal.js

I hope it will be useful for somebody else who are as useless when it comes to javascript as moi.

:-)

Ayza

EnekoAlonso-1’s picture

  drupal_set_html_head('<script type="text/javascript">
    window.onload = function() {
      MyOnLoad();
    }   
  </script>');
Annika’s picture

As previously stated, I'm useless when it comes to js, but willing to learn (a bit ;-) ).

With your solution, do you make a special file called "MyOnLoad" or where do you put the links to the scripts and what they're supposed to load?

/ Clueless in Stockholm

mariagwyn’s picture

I was a part of this discussion at one point, and had some success, for reasons I still don't understand. I have a js drop down menu which I use as a part of my site. Here is the code at the top of my page.php.tpl:

<body <?php print theme("onload_attribute"); ?> > 
    <script type='text/javascript'>function Go(){return}</script>  
    <script type='text/javascript' src='/themes/snqphp/menu/snq_menu_var.js'></script> 
    <script type='text/javascript' src='/themes/snqphp/menu/menu131_compact.js'></script> 

So, the js is stored in my particular theme. In addition, this particular JS puts the menu in a div, so I have the empty div in the right spot in my code, and it is all controlled by my theme css sheet.

It may be that using Eneko's php snippet, it should look something like this (though he should confirm, I am a php neophyte):

<?php
  drupal_set_html_head('<script type="text/javascript">
    window.onload = function() {
      MyOnLoad();
    }   
  </script>',
  '<script type='text/javascript' src='/themes/snqphp/menu/snq_menu_var.js'></script>',
  '<script type='text/javascript' src='/themes/snqphp/menu/menu131_compact.js'></script>',
   ');
?>

Hope that helps,
Maria

Annika’s picture

I'm curious if this really works with scripts that need to be loaded in the head part of the html.

Also, you can't have the body tag at the top of your page.tpl.php, doc type , html and head need to be run first. How do you solve that without breaking drupal.js?

Or am I missing something vital?

/ Ayza

mariagwyn’s picture

Sorry for the delay...
I am not sure I can answer your questions Ayza, partly because I don't understand it. However, some co-workers of mine have been trying to solve this problem using PopMenu, a free js dropdown menu (similar to the one I use above...same coder, Gus Verslius I think....). It turns out that you can add a snippet in template.php. The 'drupal_add_js/drupal_call_js' function is mentioned somewhere in the common.inc file. This is what they added, but I can't explain it to you b/c I don't understand it. My friend did mention that it is difficult to get the 'addLoadEvent' part right. However, this still doesn't need to be put in the head tag, so it may not answer your question at all.

<?php
drupal_add_js('PopMenu/site_popmenu_var.js');
drupal_add_js('PopMenu/popmenu_com.js');
drupal_call_js('function Pop_Go(){return}');
drupal_call_js('function PopMenu(x,y){return}');
drupal_call_js('function OutMenu(){return}');
  drupal_set_html_head('
   <script type="text/javascript">
function addLoadEvent(func) {
  var oldOnload = window.onload;
  if (typeof window.onload != \'function\') {
    window.onload = func;
  }
  else {
    window.onload = function() {
      oldOnload();
      func();
    }
  }
}
addLoadEvent(Pop_Go);
addLoadEvent(Pop_Go());
</script>
');
?>