Question

I haven't found a way to add Javascript to the HEAD section of a generated webpage.

Such as, if I wanted to use Behaviour.js, which won't work right unless it's included in the HEAD section.

I'm using the pattern skin and in WebPreferences, there are a few means to add overrides to the CSS. Is there such a mechanism for adding SCRIPT tags?

Environment

-- MatthewKoundakjian - 05 Jul 2007

Answer

If you answer a question - or someone answered one of your questions - please remember to edit the page and set the status to answered. The status selector is below the edit box.

What problem do you get with behaviour.js in the topic?

Otherwise create a skin template for view, see PatternSkinCustomization for examples.

-- ArthurClemens - 06 Jul 2007

Hi Arthur... if I put a script into a topic, that's equivalent to putting a script tag in the body section, right?

What what I've been led to believe, a script in the body doesn't define a callback function. Such as an on-click-able action.

I'm able to put <script> sections defining behaviors and those seem to work so long as I put a TWISTY in my topic. I have TWISTY-ENDTWISTY in with nothing between them and surround them with HTML comment tags.

Works, but seems a little wasteful.

-- MatthewKoundakjian - 08 Jul 2007

It should work though. Using the example from BehaviourContrib, the following link should open in a new window.

<script type="text/javascript" src="%PUBURLPATH%/%TWIKIWEB%/TWikiJavascripts/twikilib.js"></script>
<script type="text/javascript" src="%PUBURLPATH%/%TWIKIWEB%/BehaviourContrib/behaviour.compressed.js"></script>
<script type="text/javascript" src="%PUBURLPATH%/%TWIKIWEB%/TWikiJavascripts/twikiWindow.js"></script>
<script type="text/javascript">
// <![CDATA[
var myrules = {
   '.popupLink a' : function(el){
      el.onclick = function() {
         // open in a popup with no other attributes than template 'viewplain'
         twiki.Window.openPopup(this.href,{template:"viewplain"});
         return false;
      }
   }
};
Behaviour.register(myrules);
// ]]>
</script>

<span class="link%TWIKIWEB%%HOMETOPIC%">[[%TWIKIWEB%.%HOMETOPIC%][TWiki Web Home]]</span>

TWiki Web Home

-- ArthurClemens - 08 Jul 2007

Looky there, it does work. Now I'm wondering whether there is any standardization in <script> behavior on the browser side. IE6 and FF2 are ok with it.

If you will forgive me, I wanted to ask two tangential questions... 1) why is the CDATA form of the script body used? 2) What happens if you multiply include a js file (and is the script src= just doing a client-sidze text include?)

-- MatthewKoundakjian - 09 Jul 2007

1. CDATA: plain text is not allowed inside script tags, so the page won't validate otherwise
2. multiple includes: nothing special, unless there is initialization code going on in the script that should not be run twice

Note: please update to the BehaviourContrib version 1.2.3 to prevent this multiple initialization (the added code for speed was obviously not written with multiple instances in mind).

-- ArthurClemens - 09 Jul 2007

Is the CDATA-in-script tags restriction a HTML Body thing? A TWiki thing?

-- MatthewKoundakjian - 10 Jul 2007

http://www.codehouse.com/javascript/tips/xhtml/

-- ArthurClemens - 10 Jul 2007

http://www.w3schools.com/js/js_whereto.asp was what I was looking at....

-- MatthewKoundakjian - 10 Jul 2007

thanks for the CDATA explanation ... makes perfect sense.

-- MatthewKoundakjian - 10 Jul 2007

I think I was looking for something like the Extending to include custom javascripts part of Codev.UsingTopicToDefineCSS

-- MatthewKoundakjian - 10 Oct 2007