sIFR text and parse files


(Miriam Clinton) #1

Hi all


I'm using sIFR 3 on a new design of ours - the text loads, but tends only to load once the page is refreshed.



I'm wondering if it is a couple of factors



a) placement of sIFR javascript - I've tried putting it in an associated sifr-config.js file, at the bottom of the parse file before the </body> tag, and at the top of the parse file in the header. None of these seem to make any difference.



b ) Caching - we use some fairly heavy duty squid and Matrix caching on our servers but this is all cleared - I'm still finding I have to hard refresh to see the sIFR in some places.



c) Nested content - this may well be the clincher. The sIFR I've used within the main parse file is showing up fine each time. The sIFR we are having problems with has a different design applied - a trimmed down design because we're using jQuery to display these pages in tabs - see:



http://www.education.tas.gov.au/worksafely/module/automotive#remote-tab-5



I'm hopeful that once it is cached it will show properly but if anyone has any tips they would be greatly appreciated :slight_smile:



Cheers

Miriam


(Ryan Callaghan) #2

Try getting rid of cache first, see if that's the problem you don't want to waste 5hrs if its a 5min fix :slight_smile:


(Rachel Macdonald) #3

I had some issues with SIFR and have found cufon to be easier to get working and stay working. May be worth checking out. http://wiki.github.com/sorccu/cufon/about


(Miriam Clinton) #4

[quote]
Try getting rid of cache first, see if that's the problem you don't want to waste 5hrs if its a 5min fix :slight_smile:

[/quote]



As I mentioned in my original post the cache was already cleared (both Matrix and Squid caches). What I'm thinking about is something I've observed with jQuery lists - once a design goes live and has cached sufficiently performance improves.



Cufon looks interesting and may be possible here but I'd like to get sIFR working first - our main design for www.education.tas.gov.au uses sIFR 1 and needs upgrading to sIFR 2 or 3 to be compatible with the latest version of Firefox.



So far I seem to have narrowed it down to the jQuery content being the problem. The sIFR renders fine on all other parts of the design (the banner header is also sIFR and comes up right away without having to refresh).


(Shane Weddell) #5

Looks like there might be some form of IE shenanigans at play. It renders ok in firefox but checking in IE does what you describe. In IE there are a stack of JS errors for gallery.js and rotator.js coming from the nested asset, firefox seems to handle it ok though.


(Shane Weddell) #6

sorry, my bad. The js files are in the main page too.


(Shane Weddell) #7

And wrong again. First load on firefox works where IE doesn't until a refresh but if you go to a different tab in on the page using firefox you need to refresh to get the text. Firefox error console has the same js issues and a stack more errors that IE doesn't report.


(Anthony Barnes) #8

I get a few errors on the homepage when I view in firefox

    
    uncaught exception: Syntax error, unrecognized expression: [@href$="#remote-tab-5"]


    
    syntax error
    http://www.education.tas.gov.au/worksafely/module/automotive#remote-tab-5
    Line 0


Not sure if that's helpful to you. I've come across issues where 2 js libraries conflict before, it may be that sIFR and jQuery don't play nice together.. although I've not encountered anything conflicting with jQuery code myself.

(Shane Weddell) #9

Check this forum thread http://discuss.joyent.com/viewtopic.php?id=25600


Seems to be some issues with doctype.


(Miriam Clinton) #10

[quote]
Check this forum thread http://discuss.joyent.com/viewtopic.php?id=25600



Seems to be some issues with doctype.

[/quote]





Thanks! I think both of the issues on this page may be relevant - Matrix is tolerant of my beginning the links in sifr-config.js with /__data in the parse file but perhaps needs absolute links in the nested/jquery content.



I’ll try changing the doctype too.


(Shane Weddell) #11

Firefox shows a lot of errors in your sifr css too.


(Miriam Clinton) #12

[quote]
Firefox shows a lot of errors in your sifr css too.

[/quote]





Hmm, thats strange - the sifr css is actually really straightforward and almost vanilla. It is sIFR 3 though. I upgraded for this website as Firefox 3 wasn't reading our sIFR 1 on the main Education site.


(Miriam Clinton) #13

A quick update - it does seem to be an issue with the jQuery tabs and rendering sIFR.


The sIFR will run when the page loads on the first tab but not the following ones: see:



www.education.tas.gov.au/?a=282489


(Duncan Robertson) #14

Related: we did a recent sIFR MySource build and it worked out OK:



(Miriam Clinton) #15

[quote]
Related: we did a recent sIFR MySource build and it worked out OK:



http://www.belushis.com/christmas

[/quote]



sIFR itself works fine for us with MySource - just seems to be failing when it encounters the jQuery tabs in my design.


(Duncan Robertson) #16

Oh, I've seen that before. sIFR uses js to work and I've had loads of problems making js work with DOM manipulated elements like tabs.


(Nic Hubbard) #17

[quote]
Oh, I've seen that before. sIFR uses js to work and I've had loads of problems making js work with DOM manipulated elements like tabs.

[/quote]



Well, JS is not live like CSS is, so you have to manually bind to elements.



Have you looked into the jQuery live event to see if this could help? It watches for dom changes and then binds your event when a change is made. Pretty cool, I use it all the time.


(Duncan Robertson) #18

My Jquery / JS knowledge really isn't up to scratch. How did you go about learning it? Books, sites, recommendations?


(Nic Hubbard) #19

[quote]
My Jquery / JS knowledge really isn't up to scratch. How did you go about learning it? Books, sites, recommendations?

[/quote]



Hmm…pretty much just being forced into situations where I had to learn JS very quickly. Read up a lot on programing, php, etc. PHP and JS are pretty similar, so it was good to learn both at the some time. Honestly, I just studied tons and tons of Matrix .inc files to understand what was going on. Doing that gave me a good understanding of how the internals of Matrix works, and programing in general. I also looked at the W3C schools website, as well as read all the examples on the jQuery website.



What really helps to learn is to build a local test .html file and just start playing around with different jQuery functions. Some things that are important is general JS is to learn about vars, functions, arrays and loops.



Let me know if you have any questions, I would be happy to help.


(Miriam Clinton) #20

[quote]
Hmm…pretty much just being forced into situations where I had to learn JS very quickly. Read up a lot on programing, php, etc. PHP and JS are pretty similar, so it was good to learn both at the some time. Honestly, I just studied tons and tons of Matrix .inc files to understand what was going on. Doing that gave me a good understanding of how the internals of Matrix works, and programing in general. I also looked at the W3C schools website, as well as read all the examples on the jQuery website.



What really helps to learn is to build a local test .html file and just start playing around with different jQuery functions. Some things that are important is general JS is to learn about vars, functions, arrays and loops.



Let me know if you have any questions, I would be happy to help.

[/quote]



Thanks Nic, I'll take a look at the jQuery live event. Do you have any info about this or links? - I'm sorta learning the way you did as well - just needed to do it so jumped in the deep end with some rudimentary grounding in programming. I have to say this stuff is addictive :slight_smile:



Yeah its definately the tabs that are screwing it up. Unfortunately thats a feature we really need so that kids can read through the information while completing the quiz (it's for an OH&S training site). You can see here: http://www.education.tas.gov.au/?a=282489 we're using 'Dirty Headline' as our sIFR font, which runs in the banner, page header and successfully on the first tab, but if you try to get to any of the others it won't render.