Skip to main content

This site requires you to update your browser. Your browsing experience maybe affected by not having the most up to date version.

General Questions /

General questions about getting started with SilverStripe that don't fit in any of the categories above.

Moderators: martimiz, Sean, biapar, Willr, Ingo, swaiba, simon_w

JavaScript Includes


Reply


4 Posts   2325 Views

Avatar
Johan

Community Member, 49 Posts

20 May 2010 at 9:42pm

Edited: 20/05/2010 9:50pm

1) If I want to include my own JavaScript files I have to include them in the footer becuase silverstripe does not display the <script> tags after the CSS in the header. Is there a way of including <script> tags correctly in the header or at lest just my <script> tags?

2) I also see prototype.js has been snuck in for the latest release. Shame as jQuery has larger support and growing user base. Using jQuery scripts together with Prototype needs a no conflict (and a larger down load times). Not a major issue but a bit of pain to get working with all jQuery plugins.

Or maybe I am just having a bad day :-)

Avatar
Johan

Community Member, 49 Posts

21 May 2010 at 1:23am

Edited: 21/05/2010 1:30am

Oh it gets worse.

When I move my JS includes to the footer Sapphire inserts it's script (includes prototype.js that clashes $ with jQuery) in between my files. This is terrible if your using jQuery. Why does Silverstripe make this such a pain in the ass?

Source order of JS is such an overlooked factor in Silverstripe and one the dev team fail to understand hence why dumping scripts before the </body> tag.

Oh it gets even worse.

Same issue with Style sheets. Say you want to insert this in the header:

<!--[if IE 6]><style type="text/css">@import url(/themes/flipside/css/ie6.css);</style><![endif]-->

but it appears before the standard CSS includes in the source.

Avatar
Willr

Forum Moderator, 5513 Posts

21 May 2010 at 9:06pm

The Requirements engine in SS writes all JS (unless write_js_to_body is set to false) before the closing </head> in the order

JS Files
JS Custom Scripts
CSS
Other Header Element

This is terrible if your using jQuery. Why does Silverstripe make this such a pain in the ass?

We use jQuery on mostly all of our sites without any issues - you can wrap the jquery in a closure see http://doc.silverstripe.org/javascript. You can also configure SS to disable the prototype form validation and block prototype files if needed. To disable prototype validation you can set

Validator::set_javascript_validation_handler('none');

in you _config file and block any files that try and sneak through by using Requirements::block('path/to/file'); In the next major version of SilverStripe we will have hopefully got rid of all this prototype code. We're still going through the transition phase so its a tad messy at the moment (2.4 has a bit of JS cleanup in it).

As for including conditional stylesheets - my work around is just use a more specific css selector in the ie stylesheet. A wrapper for conditional stylesheets is pending some more enhancements to the template engine http://open.silverstripe.org/ticket/4153. I doubt the SSViewer tweaks will happen very soon but you should be able to use more specific selectors for now. If you don't like that then bypass the css requirements style and just use link tags :D

Avatar
Johan

Community Member, 49 Posts

25 May 2010 at 2:56am

Thanks for the work arounds.