
As you can see in sample projects and templates, for using this search engine you need to add at least two javascript files (jsg_search.js and jsg_searchindex.js) to your application, as well as you need to include some additional code to your main application file. The required additional code is clearly identified in examples, so you will not have a trouble finding it.
Codes of the scripts and pages may vary, depending on used template or application. It is obvious that the different kinds of applications will require a different implementations of the search algorithm.
Search script (jsg_search.js)
This file includes all the necessary search engine code, except the form for entering the searched text.
Script contents:
function doSearch(srchexpr) { // method for searching the words (passed in a srchexpr parameter) in the index file // and for filling the results list } function showtopic() { // method for navigating to the target page } function checkHighlight() { // method for highlighting all the searched terms in a displayed target page } function highlight(aWord, container) function makeHighlightedNode(aChild) { // supporting methods to highlight the terms on a page }
Search index file (jsg_searchindex.js)
This is the generated search index data file, that contains the arrays of target pages and the search terms, that refer to them.
Sample script contents:
var stopics = [ ["Home page","topics/home.htm",0],["Example 1","topics/example1.htm",0], ... ]; var sindex = [ ["welcome",[0]],["line",[0,10,14,38]],["parameters",[0,6,10]],... ];
These above scripts are linked from the "search page" (or from the other pages) as follows:
<script type="text/javascript" src="js/jsg_search.js"></script> <script type="text/javascript" src="js/jsg_searchindex.js"></script>
A search form and results (jsg_search.htm)
This html page represents a search form and the search results list. It calls doSearch() and showtopic() methods from "jsg_search.js" script. The following example shows the fragments of code from one of the possible implementations of search page:
<html> <head> <!-- BEGIN -- JavaScript SiteSearch Generator --> <script type="text/javascript" src="js/jsg_search.js"></script> <script type="text/javascript" src="js/jsg_searchindex.js"></script> <!-- END -- JavaScript SiteSearch Generator --> </head> <body> <!-- BEGIN -- JavaScript SiteSearch Generator --> <form name="SearchForm" onSubmit="javascript:return doSearch(document.SearchForm.searchtext.value);" style="padding:0px;margin:0px;"> <table> <tr> <td style="height:32px;padding-bottom:0px;"> <input name="searchtext" type="text" id="searchtext" style="width:100%;border:1px solid #999999;"> </td> <td style="height:32px;width:80px; padding:0px; padding-top:6px;"> <input type="submit" name="searchbutton" value="Search"> </td> </tr> <tr> <td colspan="2"> <select name="Results" ondblclick="javascript:showtopic();" onchange="javascript:showtopic();" size="2"> </select> </td> </tr> </table> </form> <!-- END -- JavaScript SiteSearch Generator --> </body> </html>
In the example above, you can see the comments, that identifies the "JavaScript SiteSearch Engine" fragments of code. These are the codes that you need to pay attention, if you will implement your own search template or application.
Highlighting support (jsg_index.htm, jsg_search.htm, etc.)
Highlighting the searched words in a displayed target page should be called from an onload() event of the parent frame or after filling the results list in a search page. Here is an example of calling the checkHighlight() method from the main page of the site:
<HTML> <HEAD> <meta HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=utf-8"> <TITLE>Precision Helper WebHelp Template</TITLE> <!-- BEGIN -- JavaScript SiteSearch Generator --> <script type="text/javascript" language="JavaScript"> // Use an onload event to support highlighting of searched text in currently displayed page function DoOnLoad() { var filename = left.location.pathname.substring(left.location.pathname.lastIndexOf('/')+1); if (filename == 'jsg_search.htm') left.checkHighlight(); } </script> <!-- END -- JavaScript SiteSearch Generator --> </HEAD> <frameset rows="27,*" framespacing="0"> <frame name="head" scrolling="no" noresize="noresize" src="jsg_head.htm" frameborder="0"> <frameset cols="25%,*" framespacing="1"> <frame name="left" src="jsg_search.htm" frameborder="0"> <frame name="right" src="topics/default.htm" frameborder="0" onload="DoOnLoad()"> <noframes> Your browser does not handle frames! This feature is needed to view this site. </noframes> </frameset> </frameset> </HTML>
Note for the developers
If you have purchased a license of "JavaScript SiteSearch Generator" and you will distribute its results along with your products, you may modify the names of script files, you may extend the supplied code, you may even reorganize the files and the code to fit your needs, as long as you leave the copyright and license information at the beginning of these scripts. See the License agreement for more info.