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 have a question you asked answered by someone - please remember to edit the page and set the status to answered. The status is in a drop-down list 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