﻿/*

When dynamically changing content on a website with javascript, Sifr will
not render the sifr content when panels are hidden, so when you show the panels
with js, you need to reinitialize sifr to display the content

Some wrapper methods for the sifr activate to get around this

*/

var sIFRUtils = {

    //This will initialize All Sifr objects. Should be called on page load
    initialize: function() {
        this.setH1("h1");
        this.setH2("h2");
        this.setH3("h3");
        this.setH4("h4");
        this.setH5("h5");
    },

    //will initialize any selector to be the style of h1
    setH1: function(selector) {
        sIFR.replace(arial, {
            selector: selector,
            css: ['.sIFR-root { font-size: 20px; color: #414141; font-weight: bold; letter-spacing: -1; leading: -6; }',
			 	        '.greySmall { font-size: 12px; color: #656565; font-weight: normal; }',
			 	        '.grey { font-size: 16px; color: #656565; font-weight: normal; }'],
            transparent: true
        })
    },

    //will initialize any selector to be the style of h2
    setH2: function(selector) {
        sIFR.replace(arial, {
            selector: selector,
            css: '.sIFR-root { font-size: 20px; color: #414141; font-weight: bold; letter-spacing: -1; }',
            transparent: true
        })
    },

    //will initialize any selector to be the style of h3
    setH3: function(selector) {
        sIFR.replace(arial, {
            selector: selector,
            css: ['.sIFR-root { font-size: 15px; color: #414141; font-weight: bold; letter-spacing: -1; text-decoration: none; }',
            'a { text-decoration: none;color:#414141; }',
            'a:link {  text-decoration: none; color: #414141; }',
            'a:hover { text-decoration: none; color: #414141; }',
			 	    '.grey { font-size: 14px; color: #656565; }',
				    '.blue { font-size: 14px; color: #437bb3; }'],
            transparent: true
        })
    },

    //will initialize any selector to be the style of h4
    setH4: function(selector) {
        sIFR.replace(arial, {
            selector: selector,
            css: ['.sIFR-root { font-size: 13px; color: #414141; font-weight: bold; letter-spacing: -1; }',
			 	    '.grey { color: #656565; }',
			 	    '.sIFR-root a { color: #000; text-decoration:none;}',
			 	    '.sIFR-root a:hover { color: #000; text-decoration:none;}',
			 	    ]
	    ,
            transparent: true
        })
    },

    //will initialize any selector to be the style of h5
    setH5: function(selector) {
        sIFR.replace(arial, {
            selector: selector,
            css: ['.sIFR-root { font-size: 11px; color: #fffefe; text-align: center; }',
            'a { text-decoration: none;color:#fffefe; }',
            'a:link {  text-decoration: none; color: #fffefe; }',
            'a:hover { text-decoration: none; color: #fffefe; }']
	    ,
            transparent: true
        })
    }

}