// ========== SEARCH TIPS
// This code creates the Search Tips button (on the search bar) and div that slides out from
// the right side of the page when the button is clicked.

//Search Tips Button
$('.wh_search_button').wrap('<div id="SearchButtons"></div>');
$('.wh_search_button').before('<a href="#" id="btnSearchTips" title="Search tips" onclick="showSearchTips()">' +
                // '<i class="glyphicon glyphicon-question-sign" id="SearchTipsGlyph"></i></a>');
                '<img id="searchTipsIcon" class="sidebar-icon" src="/resources/img/icons/white/help.png" /></a>');
        
// Search Tips Slideout 
$('body').append('<div class="SearchTipsContainer">' +
'<div class="st-one" onclick="hideSearchTips()"><i class="glyphicon glyphicon-question-sign"></i></a></div>' +
    '<div class="st-two">' +
    '<div id="st-twotitlebar">' +
        '<div id="st-twotitle">Search Tips</div>' +
        '<div id="st-close" onclick="hideSearchTips()">' +
            '<a href="#"><i class="glyphicon glyphicon-remove" style="color:#fff;"></i></a>' +
        '</div>' +
    '</div>' +
    '<div id="st-twobody">' +
        '<div id="st-main">' +
            '<div class="st-tip">' +
                '<p class="st-tiptitle">Search relevance</p>' +
                '<p class="st-tipbody">The most relevant results are presented at the beginning.</p>' +
            '</div>' +
            '<div class="st-tip">' +
                '<p class="st-tiptitle">Highlighting your results</p>' +
                '<p class="st-tipbody">Use the Toggle Highlights button to toggle the highlighting of your search results within the page.<br/>'+
                '<img src="/resources/img/toggle-search-highlight.png" style="width:150px;" />' +
                '</p>' +
            '</div>' +
            '<div class="st-tip">' +
                '<p class="st-tiptitle">Searching for phrases</p>' +
                '<p class="st-tipbody">Searching for a phrase such as "cash to close" displays '+
                'results including the phrase <i>and</i> the individual words</p>' +
                '<p class="st-tipbody">If your search yields too many matches for the individual '+
                'words, use the browser\'s page search (Ctrl+F) to locate the phrase. Tip: the '+
                'browser page search highlights its results in a different color.</p>' +
            '</div>' +
            '<div class="st-tip">' +
                '<p class="st-tiptitle">'+
                '<!--<span class="glyphicon glyphicon-info-sign st-tipicon"></span> -->'+
                'Autocomplete</p>' +
                '<p class="st-tipbody">You can see a list of keywords and topic titles while you are typing in the Search bar.</p>' +
            '</div>' +
            '<div id="st-main">' +
            '<div class="st-tip">' +
                '<p class="st-tiptitle">'+
                '<!--<span class="glyphicon glyphicon-info-sign st-tipicon"></span> -->'+
                'Don\'t worry about capitalization</p>' +
                '<p class="st-tipbody">A search for <b>DocViewer</b> is the same as a search for <b>docviewer</b>.</p>' +
            '</div>' +
            // '<div class="st-tip">' +
            // 	'<p class="st-tiptitle">Search for an exact match</p>' +
            // 	'<p class="st-tipbody">Put a word or phrase inside quotes.<br/>Example: "closing costs".</p>' +
            // '</div>' +
            '<div class="st-tip">' +
                '<p class="st-tiptitle">Combine searches</p>' +
                '<p class="st-tipbody">Placing <b>AND</b> between words or phrases combines the searches into one.'+
                '<br/>Example: static documents AND advance.</p>' +
            '</div>' +
            // '<div class="st-tip">' +
            // 	'<p class="st-tiptitle">Documentation search</p>' +
            // 	'<p class="st-tipbody">Chrome users can easily access the search bar using <b>Ctrl+Shift+F</b>.</p>' +
            // '</div>' +
            // '<div class="st-tip">' +
            // 	'<p class="st-tiptitle">Default browser search</p>' +
            // 	'<p class="st-tipbody">Don\'t forget! You can access your browser\'s search feature to search within a single page. Access it using <b>Ctrl+F</b>.</p>' +
            // '</div>' +
            '<div class="st-tip">' +
                '<hr class="st-hr">' +
            '</div>' +
            '<button type="button" id="st-send" class="btn btn-primary" onclick="hideSearchTips();">Close</button>' +
        '</div>' +
    '</div>' +
'</div>' +
'</div>');




function SearchTipsContainer() {
    $('.sea').css("display", "block");
    // $('.wth-one').trigger('click');
    $(".SearchTipsContainer").animate({right: '400px'});
    $(".wth-one").css("display", "block");
}
function showSearchTips() {
    $('.SearchTipsContainer').css("display", "block");
    $('.wth-one').trigger('click');
    $(".SearchTipsContainer").animate({right: '400px'});
    $(".wth-one").css("display", "block");
}
function hideSearchTips() {
    $(".SearchTipsContainer").animate({right: '-400px'});
    $(".wth-one").css("display", "none");
}

