1 | /**
|
---|
2 | * Miscellaneous js functions for WebHelp
|
---|
3 | * Kasun Gajasinghe, http://kasunbg.blogspot.com
|
---|
4 | * David Cramer, http://www.thingbag.net
|
---|
5 | *
|
---|
6 | */
|
---|
7 |
|
---|
8 | //Turn ON and OFF the animations for Show/Hide Sidebar. Extend this to other anime as well if any.
|
---|
9 | var noAnimations=false;
|
---|
10 |
|
---|
11 | $(document).ready(function() {
|
---|
12 | // When you click on a link to an anchor, scroll down
|
---|
13 | // 105 px to cope with the fact that the banner
|
---|
14 | // hides the top 95px or so of the page.
|
---|
15 | // This code deals with the problem when
|
---|
16 | // you click on a link within a page.
|
---|
17 | $('a[href*=#]').click(function() {
|
---|
18 | if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'')
|
---|
19 | && location.hostname == this.hostname) {
|
---|
20 | var $target = $(this.hash);
|
---|
21 | $target = $target.length && $target
|
---|
22 | || $('[name=' + this.hash.slice(1) +']');
|
---|
23 | if (!(this.hash == "#searchDiv" || this.hash == "#treeDiv" || this.hash == "") && $target.length) {
|
---|
24 | var targetOffset = $target.offset().top - 120;
|
---|
25 | $('html,body')
|
---|
26 | .animate({scrollTop: targetOffset}, 200);
|
---|
27 | return false;
|
---|
28 | }
|
---|
29 | }
|
---|
30 | });
|
---|
31 |
|
---|
32 | // $("#showHideHighlight").button(); //add jquery button styling to 'Go' button
|
---|
33 | //Generate tabs in nav-pane with JQuery
|
---|
34 | $(function() {
|
---|
35 | $("#tabs").tabs({
|
---|
36 | cookie: {
|
---|
37 | expires: 2 // store cookie for 2 days.
|
---|
38 | }
|
---|
39 | });
|
---|
40 | });
|
---|
41 |
|
---|
42 | //Generate the tree
|
---|
43 | $("#ulTreeDiv").attr("style", "");
|
---|
44 | $("#tree").treeview({
|
---|
45 | collapsed: true,
|
---|
46 | animated: "medium",
|
---|
47 | control: "#sidetreecontrol",
|
---|
48 | persist: "cookie"
|
---|
49 | });
|
---|
50 |
|
---|
51 | //after toc fully styled, display it. Until loading, a 'loading' image will be displayed
|
---|
52 | $("#tocLoading").attr("style", "display:none;");
|
---|
53 | // $("#ulTreeDiv").attr("style","display:block;");
|
---|
54 |
|
---|
55 | //.searchButton is the css class applied to 'Go' button
|
---|
56 | $(function() {
|
---|
57 | $("button", ".searchButton").button();
|
---|
58 |
|
---|
59 | $("button", ".searchButton").click(function() {
|
---|
60 | return false;
|
---|
61 | });
|
---|
62 | });
|
---|
63 |
|
---|
64 | //'ui-tabs-1' is the cookie name which is used for the persistence of the tabs.(Content/Search tab)
|
---|
65 | if ($.cookie('ui-tabs-1') === '1') { //search tab is active
|
---|
66 | if ($.cookie('textToSearch') != undefined && $.cookie('textToSearch').length > 0) {
|
---|
67 | document.getElementById('textToSearch').value = $.cookie('textToSearch');
|
---|
68 | Verifie('searchForm');
|
---|
69 | searchHighlight($.cookie('textToSearch'));
|
---|
70 | $("#showHideHighlight").css("display", "block");
|
---|
71 | }
|
---|
72 | }
|
---|
73 |
|
---|
74 | syncToc(); //Synchronize the toc tree with the content pane, when loading the page.
|
---|
75 | //$("#doSearch").button(); //add jquery button styling to 'Go' button
|
---|
76 |
|
---|
77 | // When you click on a link to an anchor, scroll down
|
---|
78 | // 120 px to cope with the fact that the banner
|
---|
79 | // hides the top 95px or so of the page.
|
---|
80 | // This code deals with the problem when
|
---|
81 | // you click on a link from another page.
|
---|
82 | var hash = window.location.hash;
|
---|
83 | if(hash){
|
---|
84 | var targetOffset = $(hash).offset().top - 120;
|
---|
85 | $('html,body').animate({scrollTop: targetOffset}, 200);
|
---|
86 | return false;
|
---|
87 | }
|
---|
88 | });
|
---|
89 |
|
---|
90 |
|
---|
91 | /**
|
---|
92 | * If an user moved to another page by clicking on a toc link, and then clicked on #searchDiv,
|
---|
93 | * search should be performed if the cookie textToSearch is not empty.
|
---|
94 | */
|
---|
95 | function doSearch() {
|
---|
96 | //'ui-tabs-1' is the cookie name which is used for the persistence of the tabs.(Content/Search tab)
|
---|
97 | if ($.cookie('textToSearch') != undefined && $.cookie('textToSearch').length > 0) {
|
---|
98 | document.getElementById('textToSearch').value = $.cookie('textToSearch');
|
---|
99 | Verifie('searchForm');
|
---|
100 | }
|
---|
101 | }
|
---|
102 |
|
---|
103 | /**
|
---|
104 | * Synchronize with the tableOfContents
|
---|
105 | */
|
---|
106 | function syncToc() {
|
---|
107 | var a = document.getElementById("webhelp-currentid");
|
---|
108 | if (a != undefined) {
|
---|
109 | //Expanding the child sections of the selected node.
|
---|
110 | var nodeClass = a.getAttribute("class");
|
---|
111 | if (nodeClass != null && !nodeClass.match(/collapsable/)) {
|
---|
112 | a.setAttribute("class", "collapsable");
|
---|
113 | //remove display:none; css style from <ul> block in the selected node.
|
---|
114 | var ulNode = a.getElementsByTagName("ul")[0];
|
---|
115 | if (ulNode != undefined) {
|
---|
116 | if (ulNode.hasAttribute("style")) {
|
---|
117 | ulNode.setAttribute("style", "display: block; background-color: #D8D8D8 !important;");
|
---|
118 | } else {
|
---|
119 | var ulStyle = document.createAttribute("style");
|
---|
120 | ulStyle.nodeValue = "display: block; background-color: #D8D8D8 !important;";
|
---|
121 | ulNode.setAttributeNode(ulStyle);
|
---|
122 | } }
|
---|
123 | //adjust tree's + sign to -
|
---|
124 | var divNode = a.getElementsByTagName("div")[0];
|
---|
125 | if (divNode != undefined) {
|
---|
126 | if (divNode.hasAttribute("class")) {
|
---|
127 | divNode.setAttribute("class", "hitarea collapsable-hitarea");
|
---|
128 | } else {
|
---|
129 | var divClass = document.createAttribute("class");
|
---|
130 | divClass.nodeValue = "hitarea collapsable-hitarea";
|
---|
131 | divNode.setAttributeNode(divClass);
|
---|
132 | } }
|
---|
133 | //set persistence cookie when a node is auto expanded
|
---|
134 | // setCookieForExpandedNode("webhelp-currentid");
|
---|
135 | }
|
---|
136 | var b = a.getElementsByTagName("a")[0];
|
---|
137 |
|
---|
138 | if (b != undefined) {
|
---|
139 | //Setting the background for selected node.
|
---|
140 | var style = a.getAttribute("style", 2);
|
---|
141 | if (style != null && !style.match(/background-color: Background;/)) {
|
---|
142 | a.setAttribute("style", "background-color: #D8D8D8; " + style);
|
---|
143 | b.setAttribute("style", "color: black;");
|
---|
144 | } else if (style != null) {
|
---|
145 | a.setAttribute("style", "background-color: #D8D8D8; " + style);
|
---|
146 | b.setAttribute("style", "color: black;");
|
---|
147 | } else {
|
---|
148 | a.setAttribute("style", "background-color: #D8D8D8; ");
|
---|
149 | b.setAttribute("style", "color: black;");
|
---|
150 | }
|
---|
151 | }
|
---|
152 |
|
---|
153 | //shows the node related to current content.
|
---|
154 | //goes a recursive call from current node to ancestor nodes, displaying all of them.
|
---|
155 | while (a.parentNode && a.parentNode.nodeName) {
|
---|
156 | var parentNode = a.parentNode;
|
---|
157 | var nodeName = parentNode.nodeName;
|
---|
158 |
|
---|
159 | if (nodeName.toLowerCase() == "ul") {
|
---|
160 | parentNode.setAttribute("style", "display: block;");
|
---|
161 | } else if (nodeName.toLocaleLowerCase() == "li") {
|
---|
162 | parentNode.setAttribute("class", "collapsable");
|
---|
163 | parentNode.firstChild.setAttribute("class", "hitarea collapsable-hitarea ");
|
---|
164 | }
|
---|
165 | a = parentNode;
|
---|
166 | } } }
|
---|
167 | /*
|
---|
168 | function setCookieForExpandedNode(nodeName) {
|
---|
169 | var tocDiv = document.getElementById("tree"); //get table of contents Div
|
---|
170 | var divs = tocDiv.getElementsByTagName("div");
|
---|
171 | var matchedDivNumber;
|
---|
172 | var i;
|
---|
173 | for (i = 0; i < divs.length; i++) { //1101001
|
---|
174 | var div = divs[i];
|
---|
175 | var liNode = div.parentNode;
|
---|
176 | }
|
---|
177 | //create a new cookie if a treeview does not exist
|
---|
178 | if ($.cookie(treeCookieId) == null || $.cookie(treeCookieId) == "") {
|
---|
179 | var branches = $("#tree").find("li");//.prepareBranches(treesettings);
|
---|
180 | var data = [];
|
---|
181 | branches.each(function(i, e) {
|
---|
182 | data[i] = $(e).is(":has(>ul:visible)") ? 1 : 0;
|
---|
183 | });
|
---|
184 | $.cookie(treeCookieId, data.join(""));
|
---|
185 |
|
---|
186 | }
|
---|
187 |
|
---|
188 | if (i < divs.length) {
|
---|
189 | var treeviewCookie = $.cookie(treeCookieId);
|
---|
190 | var tvCookie1 = treeviewCookie.substring(0, i);
|
---|
191 | var tvCookie2 = treeviewCookie.substring(i + 1);
|
---|
192 | var newTVCookie = tvCookie1 + "1" + tvCookie2;
|
---|
193 | $.cookie(treeCookieId, newTVCookie);
|
---|
194 | }
|
---|
195 | } */
|
---|
196 |
|
---|
197 | /**
|
---|
198 | * Code for Show/Hide TOC
|
---|
199 | *
|
---|
200 | */
|
---|
201 | function showHideToc() {
|
---|
202 | var showHideButton = $("#showHideButton");
|
---|
203 | var leftNavigation = $("#sidebar"); //hide the parent div of leftnavigation, ie sidebar
|
---|
204 | var content = $("#content");
|
---|
205 | var animeTime=75
|
---|
206 |
|
---|
207 | if (showHideButton != undefined && showHideButton.hasClass("pointLeft")) {
|
---|
208 | //Hide TOC
|
---|
209 | showHideButton.removeClass('pointLeft').addClass('pointRight');
|
---|
210 |
|
---|
211 | if(noAnimations) {
|
---|
212 | leftNavigation.css("display", "none");
|
---|
213 | content.css("margin", "125px 0 0 0");
|
---|
214 | } else {
|
---|
215 | leftNavigation.hide(animeTime);
|
---|
216 | content.animate( { "margin-left": 0 }, animeTime);
|
---|
217 | }
|
---|
218 | showHideButton.attr("title", "Show Sidebar");
|
---|
219 | } else {
|
---|
220 | //Show the TOC
|
---|
221 | showHideButton.removeClass('pointRight').addClass('pointLeft');
|
---|
222 | if(noAnimations) {
|
---|
223 | content.css("margin", "125px 0 0 280px");
|
---|
224 | leftNavigation.css("display", "block");
|
---|
225 | } else {
|
---|
226 | content.animate( { "margin-left": '280px' }, animeTime);
|
---|
227 | leftNavigation.show(animeTime);
|
---|
228 | }
|
---|
229 | showHideButton.attr("title", "Hide Sidebar");
|
---|
230 | }
|
---|
231 | }
|
---|
232 |
|
---|
233 | /**
|
---|
234 | * Code for search highlighting
|
---|
235 | */
|
---|
236 | var highlightOn = true;
|
---|
237 | function searchHighlight(searchText) {
|
---|
238 | highlightOn = true;
|
---|
239 | if (searchText != undefined) {
|
---|
240 | var wList;
|
---|
241 | var sList = new Array(); //stem list
|
---|
242 | //Highlight the search terms
|
---|
243 | searchText = searchText.toLowerCase().replace(/<\//g, "_st_").replace(/\$_/g, "_di_").replace(/\.|%2C|%3B|%21|%3A|@|\/|\*/g, " ").replace(/(%20)+/g, " ").replace(/_st_/g, "</").replace(/_di_/g, "%24_")
|
---|
244 | searchText = searchText.replace(/ +/g, " ");
|
---|
245 | searchText = searchText.replace(/ $/, "").replace(/^ /, "");
|
---|
246 |
|
---|
247 | wList = searchText.split(" ");
|
---|
248 | $("#content").highlight(wList); //Highlight the search input
|
---|
249 |
|
---|
250 | if (typeof stemmer != "undefined") {
|
---|
251 | //Highlight the stems
|
---|
252 | for (var i = 0; i < wList.length; i++) {
|
---|
253 | var stemW = stemmer(wList[i]);
|
---|
254 | sList.push(stemW);
|
---|
255 | }
|
---|
256 | } else {
|
---|
257 | sList = wList;
|
---|
258 | }
|
---|
259 | $("#content").highlight(sList); //Highlight the search input's all stems
|
---|
260 | }
|
---|
261 | }
|
---|
262 |
|
---|
263 | function searchUnhighlight() {
|
---|
264 | highlightOn = false;
|
---|
265 | //unhighlight the search input's all stems
|
---|
266 | $("#content").unhighlight();
|
---|
267 | $("#content").unhighlight();
|
---|
268 | }
|
---|
269 |
|
---|
270 | function toggleHighlight() {
|
---|
271 | if (highlightOn) {
|
---|
272 | searchUnhighlight();
|
---|
273 | } else {
|
---|
274 | searchHighlight($.cookie('textToSearch'));
|
---|
275 | }
|
---|
276 | } |
---|