javascripts/1115182634.search.js

var queryInputFieldId = "query";
var allguides = new Array();
var guideClassName = "guide";

var elementsClassNames = new Array();
elementsClassNames.push('training');
elementsClassNames.push('latestguides');
elementsClassNames.push('guidegroup');
elementsClassNames.push('tagsbytopic');
elementsClassNames.push('guidesuggestion');

onload = function () {
    var elements = document.getElementsByClassName(guideClassName);
    for ( var i = 0; i < elements.length; i++ ) {
        var element = elements[i];
        var guide = { href: element.getAttribute('href'), title: element.text, tags: tagsAtGuide(element.parentNode)  }; /* */
        allguides.push(guide);
    }

    if ( document.getElementById(queryInputFieldId) ) {
        var e = document.getElementById(queryInputFieldId);
        e.oninput = onQueryChanged;
        e.onpropertychange = e.oninput; // for IE8
    }
};

function hideElementsToDisplaySearchResults() {
    for ( var i = 0; i < elementsClassNames.length; i++) {
        var className = elementsClassNames[i];
        hideElementsByClassName(className);
    }
}

function showElementsToDisplaySearchResults() {
    for (var i = 0; i < elementsClassNames.length; i++) {
        var className = elementsClassNames[i];
        showElementsByClassName(className);
    }
}

function hideElementsByClassName(className) {
    var elements = document.getElementsByClassName(className);
    for ( var i = 0; i < elements.length; i++ ) {
        var element = elements[i];
        element.style.display = "none";
    }
}

function showElementsByClassName(className) {
    var elements = document.getElementsByClassName(className);
    for ( var i = 0; i < elements.length; i++ ) {
        var element = elements[i];
        element.style.display = "block";
    }
}

function tagsAtGuide(element) {
    var tags = new Array();
    for (var y = 0; y < element.childNodes.length; y++) {

        if (element.childNodes[y].className == "tag") {
            var tag = element.childNodes[y];
            tags.push(tag.textContent);
        }
    }
    return tags;
}

function onQueryChanged() {
    var query = queryValue();
    query = query.trim();
    if ( query === '' ) {
        showElementsToDisplaySearchResults();
        document.getElementById("searchresults").innerHTML = "";
        document.getElementById("noresults").innerHTML = "";

        return;
    }

    var matchingGuides = new Array();
    if ( query !== '' ) {
        for (var i = 0; i < allguides.length; i++) {
            var guide = allguides[i];
            if ( doesGuideMatchesQuery(guide, query) ) {
                matchingGuides.push(guide);
            }
        }
    }
    if ( matchingGuides.length > 0 ) {
        hideElementsToDisplaySearchResults();
        var html = renderGuideGroup(matchingGuides);
        document.getElementById("searchresults").innerHTML = html;
        document.getElementById("noresults").innerHTML = "";

    } else {
        document.getElementById("searchresults").innerHTML = "";
        document.getElementById("noresults").innerHTML = '<p>No results found</p>'
    }
}

function doesGuideMatchesQuery(guide, query) {
    if (guide.title.toLowerCase().indexOf(query.toLowerCase()) !== -1) {
        return true;
    }

    for ( var i = 0; i < guide.tags.length; i++) {
        var tag = guide.tags[i];
        if (tag.toLowerCase().indexOf(query.toLowerCase()) !== -1) {
            return true;
        }
    }
    return false;
}

function queryValue() {
    return document.getElementById(queryInputFieldId).value;
}

function renderGuideGroup(guides) {
    var html = "";
    html += "<div class='guidegroup'>";
    html += "  <div class='guidegroupheader'>";
    html += "    <h2>Guides Filtered by: " + queryValue() + "</h2>";
    html += "  </div>";
    html += "  <ul>";
    for ( var i = 0; i < guides.length; i++ ) {
        html += "    " + renderGuideAsHtmlLi(guides[i]);
    }
    html += "  </ul>";
    html += "</div>";
    return html;
}

function renderGuideAsHtmlLi(guide) {
    var html = "<li>";
    html += "<a class='"+guideClassName+"' href='" + guide.href + "'>" + guide.title + "</a>";
    for ( var i = 0; i < guide.tags.length; i++ ) {
        var tag = guide.tags[i];
        html += "<span style='display: none' class='tag'>"+tag+"</span>";
    }
    html += "</li>"
    return html;
}