Search code examples
javascriptsifr

Specifically Don’t Replace Certain Text - not working


First of all, I'm using sIFR3, r419 (I can't upgrade since I don't have access to flash...). I got a webpage where I've replaced all existing H1, H2 and H3 with sIFR - that works like a charm. But I would like to use the YUI Rich Text Editor. The thing with that editor is that it also uses H1, H2 and H3 in it's toolbar thing. Those two things combines is, eh, pretty ugly :) The whole editor is within an div with the class "yui-skin-sam". I have added the suggested code from sIFR's WIKI at the top of my sifr-config.js:

parseSelector.pseudoClasses = {
'not': function(nodes, selector) {
var result = [];
each: for(var i = 0, node; i < nodes.length; i++) {
  node = nodes[i];
  var ignore = parseSelector(selector, node.parentNode);
  for(var j = 0; j < ignore.length; j++) {
    if(ignore[j] == node) continue each;
  }
  result.push(node);
}
return result;
}
}

And my question is: What should i do in the sifr-config.js to select all H1, H2, H3 except from those that are within the div ".yui-sam-skin"? Or more exactly, how should I specify the selector(s)?

Thanks in advance!

Zyber

Added: If I change the selector from h2 to div:not(.yui-toolbar-titlebar)>h2 it sort of works. If i set the selector to div:not(.yui-sam-skin)>h2 it does NOT work - it still changes to the sifr'd text. I said it sort of works because the script still apply the class .sifr-active to that h2 which makes the h2 invisible so I needed to some rows to the sifr-screen.css:

.sIFR-active .yui-toolbar-titlebar h2 {
    visibility: visible;
    font-family: verdana, sans-serif;
}

And that feels annoying! Is this problem solved in newer versions of sIFR3?

Thanks again!


Solution

  • Okay, so I came up with an ugly fix at last. On top of sifr-config.js:

    function sIFRignore(selector) {
        var nodes = sIFR.dom.querySelectorAll(selector);
        for(var i=0; i < nodes.length; i++) {
            var node=nodes[i];
            node.style.visibility  = 'visible';
            node.style.fontFamily  = 'Verdana';
            sIFR.dom.addClass("sIFR-ignore", node);
        }
        return true;                
    }
    

    I needed to add those style-thing because at least firefox still gave it the style as it was named .sIFR-active! That's a known bug, but hey, it works (nearly!).

    So, just before sIFR.activate I added the lines

    sIFRignore(".yui-skin-sam * h2");
    sIFRignore(".yui-skin-sam * h3");