Doc - Add option for making online version of docs with different layout from Assistant version.1.0.0

16 files changed, 823 insertions, 100 deletions

diff --git a/doc/doc.pri b/doc/doc.pri
index 4ba67b8..0c60264 100644
--- a/doc/doc.pri
+++ b/doc/doc.pri
@@ -16,14 +16,26 @@ unix {
 QHP_FILE = $$OUT_PWD/doc/html/simulator.qhp
 QCH_FILE = $$OUT_PWD/doc/simulator.qch
 
+HELP_DEP_FILES = $$PWD/simulator.qdoc \
+                 $$PWD/scripting.qdoc \
+                 $$PWD/simulator.qdocconf
+
 unix {
 html_docs.commands = $$QDOC $$PWD/simulator.qdocconf
 } else {
 html_docs.commands = \"$$QDOC $$PWD/simulator.qdocconf\"
 }
-html_docs.depends += $$PWD/simulator.qdoc $$PWD/scripting.qdoc $$PWD/simulator.qdocconf $$PWD/qt-defines.qdocconf $$PWD/qt-html-templates.qdocconf
+html_docs.depends += $$HELP_DEP_FILES
 html_docs.files = $$QHP_FILE
 
+unix {
+html_docs_online.commands = $$QDOC $$PWD/simulator.qdocconf
+} else {
+html_docs_online.commands = \"$$QDOC $$PWD/simulator-online.qdocconf\"
+}
+html_docs_online.depends += $$HELP_DEP_FILES
+html_docs_online.files = $$QHP_FILE
+
 qch_docs.commands = $$HELPGENERATOR -o $$QCH_FILE $$QHP_FILE
 qch_docs.depends += html_docs
 qch_docs.files = $$QCH_FILE
@@ -34,18 +46,19 @@ unix:!macx {
     INSTALLS += qch_docs
 }
 
+docs_online.depends = html_docs_online
+QMAKE_EXTRA_TARGETS += html_docs_online docs_online
+
 macx {
     DOC_DIR = "$${OUT_PWD}/bin/Simulator.app/Contents/Resources/doc"
     cp_docs.commands = mkdir -p \"$${DOC_DIR}\" ; $${QMAKE_COPY} \"$${QCH_FILE}\" \"$${DOC_DIR}\"
     cp_docs.depends += qch_docs
     docs.depends = cp_docs
-    QMAKE_EXTRA_TARGETS += html_docs qch_docs cp_docs docs
+    QMAKE_EXTRA_TARGETS += html_docs qch_docs cp_docs docs ht
 }
 !macx {
     docs.depends = qch_docs
     QMAKE_EXTRA_TARGETS += html_docs qch_docs docs
 }
 
-OTHER_FILES = $$PWD/simulator.qdoc \
-              $$PWD/scripting.qdoc \
-              $$PWD/simulator.qdocconf
+OTHER_FILES = $$HELP_DEP_FILES
\ No newline at end of file
diff --git a/doc/qt-defines.qdocconf b/doc/qt-defines.qdocconf
index 66b483d..947924e 100644
--- a/doc/qt-defines.qdocconf
+++ b/doc/qt-defines.qdocconf
@@ -20,48 +20,45 @@ codeindent              = 1
 # See also qhp.Qt.extraFiles
 extraimages.HTML        = qt-logo \
                           trolltech-logo \
-			  api_examples.png \
-			  bg_ll.png \
-			  bg_ul_blank.png \
-			  bullet_gt.png \
-			  horBar.png \
-			  qt_ref_doc.png \
-			  api_lookup.png \
-			  bg_ll_blank.png \
-			  bg_ur.png \
-			  bullet_sq.png \
-			  bullet_dn.png \
-			  bullet_up.png \
-			  page_bg.png \
-			  qt_tools.png \
-			  api_topics.png \
-			  bg_lr.png \
-			  bg_ur_blank.png \
-			  content_bg.png \
-			  print.png \
-			  sep.png \
-			  bg_l.png \
-			  bg_r.png \
-			  box_bg.png \
-			  feedbackground.png \
-			  qt_guide.png \
-			  sprites-combined.png \
-			  bg_l_blank.png \
-			  bg_ul.png \
-			  breadcrumb.png \
-			  form_bg.png \
-			  qt_icon.png \
-			  header.png
+                          api_examples.png \
+                          api_lookup.png \
+                          arrow_down.png \
+                          bg_ll.png \
+                          bg_l.png \
+                          bg_lr.png \
+                          bg_r.png \
+                          bg_ul_blank.png \
+                          bg_ll_blank.png \
+                          bg_l_blank.png \
+                          breadcrumb.png \
+                          bullet_dn.png \
+                          bullet_gt.png \
+                          bullet_sq.png \
+                          box_bg.png \
+                          feedbackground.png \
+                          horBar.png \
+                          page_bg.png \
+                          sprites-combined.png
 
 # This stuff is used by the new doc format.
 scriptdirs              = $SRCDIR/templates/scripts
 styledirs               = $SRCDIR/templates/style
 
 scripts.HTML		= functions.js \
+			  shBrushCpp.js \
+			  shCore.js \
+			  shLegacy.js \
+			  narrow.js \
+			  superfish.js \
 			  jquery.js
 
-styles.HTML		= OfflineStyle.css \
-			  style.css \
+styles.HTML		= style.css \
+			  shCore.css \
+			  shThemeDefault.css \
+			  narrow.css \
+			  superfish.css \
+			  superfish_skin.css \
+			  OfflineStyle.css \
 			  style_ie6.css \
 			  style_ie7.css \
 			  style_ie8.css
diff --git a/doc/qt-html-templates.qdocconf b/doc/qt-html-templates.qdocconf
index 7cab396..2595a6c 100644
--- a/doc/qt-html-templates.qdocconf
+++ b/doc/qt-html-templates.qdocconf
@@ -1,14 +1,14 @@
 HTML.stylesheets        =  style/style.css \
-			style/OfflineStyle.css \
-			style/style_ie7.css \
-			style/style_ie8.css \
-			style/style_ie6.css
+                           style/OfflineStyle.css \
+                           style/style_ie7.css \
+                           style/style_ie8.css \
+                           style/style_ie6.css
 
 HTML.postheader         = " <div class=\"header\" id=\"qtdocheader\">\n" \
 			  "    <div class=\"content\"> \n" \
 			  "    <div id=\"nav-logo\">\n" \
 			  "      <a href=\"index.html\">Home</a></div>\n" \
-			  "    <a href=\"index.html\" class=\"qtref\"><span>Qt Creator Documentation</span></a>\n" \
+			  "    <a href=\"index.html\" class=\"qtref\"><span>Qt Simulator Manual</span></a>\n" \
 			  "		<div id=\"narrowsearch\"><form onsubmit=\"return false;\" action=\"\" id=\"qtdocsearch\">\n" \
 			  "		<fieldset>\n" \
               "		<input type=\"text\" value=\"\" id=\"pageType\" name=\"searchstring\">\n" \
@@ -27,7 +27,7 @@ HTML.postheader         = " <div class=\"header\" id=\"qtdocheader\">\n" \
 			  "    </div>\n" \
 			  "    <div id=\"shortCut\">\n" \
 			  "      <ul>\n" \
-			  "        <li class=\"shortCut-topleft-inactive\"><span><a href=\"index.html\">Qt Creator 1.3.84 </a></span></li>\n" \
+			  "        <li class=\"shortCut-topleft-inactive\"><span><a href=\"index.html\">Qt Simulator 1.0.0</a></span></li>\n" \
 			  "        <li class=\"shortCut-topleft-active\"><a href=\"http://qt.nokia.com/doc/\">ALL VERSIONS" \
 			  "        </a></li>\n" \
 			  "      </ul>\n" \
@@ -54,12 +54,12 @@ HTML.postheader         = " <div class=\"header\" id=\"qtdocheader\">\n" \
 			  "            API Lookup</h2>\n" \
 			  "          <div  id=\"list001\" class=\"list\">\n" \
 			  "          <ul id=\"ul001\" >\n" \
-			  "              <li class=\"defaultLink\"><a href=\"classes.html\">Class index</a></li>\n" \
-			  "              <li class=\"defaultLink\"><a href=\"functions.html\">Function index</a></li>\n" \
-			  "              <li class=\"defaultLink\"><a href=\"modules.html\">Modules</a></li>\n" \
-			  "              <li class=\"defaultLink\"><a href=\"namespaces.html\">Namespaces</a></li>\n" \
-			  "              <li class=\"defaultLink\"><a href=\"qtglobal.html\">Global stuff</a></li>\n" \
-			  "              <li class=\"defaultLink\"><a href=\"qdeclarativeelements.html\">QML elements</a></li>\n" \
+			  "              <li class=\"defaultLink\"><a href=\"http://doc.qt.nokia.com/latest/classes.html\">Class index</a></li>\n" \
+			  "              <li class=\"defaultLink\"><a href=\"http://doc.qt.nokia.com/latest/functions.html\">Function index</a></li>\n" \
+			  "              <li class=\"defaultLink\"><a href=\"http://doc.qt.nokia.com/latest/modules.html\">Modules</a></li>\n" \
+			  "              <li class=\"defaultLink\"><a href=\"http://doc.qt.nokia.com/latest/namespaces.html\">Namespaces</a></li>\n" \
+			  "              <li class=\"defaultLink\"><a href=\"http://doc.qt.nokia.com/latest/qtglobal.html\">Global stuff</a></li>\n" \
+			  "              <li class=\"defaultLink\"><a href=\"http://doc.qt.nokia.com/latest/qdeclarativeelements.html\">QML elements</a></li>\n" \
 			  "            </ul> \n" \
 			  "          </div>\n" \
 			  "        </div>\n" \
@@ -68,10 +68,10 @@ HTML.postheader         = " <div class=\"header\" id=\"qtdocheader\">\n" \
 			  "            Qt Topics</h2>\n" \
 			  "          <div id=\"list002\" class=\"list\">\n" \
 			  "            <ul id=\"ul002\" >\n" \
-			  "              <li class=\"defaultLink\"><a href=\"qt-basic-concepts.html\">Basic Qt architecture</a></li>\n" \
-			  "              <li class=\"defaultLink\"><a href=\"declarativeui.html\">Device UI's &amp; Qt Quick</a></li>\n" \
-			  "              <li class=\"defaultLink\"><a href=\"qt-gui-concepts.html\">Desktop UI components</a></li>\n" \
-			  "              <li class=\"defaultLink\"><a href=\"platform-specific.html\">Platform-specific info</a></li>\n" \
+			  "              <li class=\"defaultLink\"><a href=\"http://doc.qt.nokia.com/latest/qt-basic-concepts.html\">Basic Qt architecture</a></li>\n" \
+			  "              <li class=\"defaultLink\"><a href=\"http://doc.qt.nokia.com/latest/declarativeui.html\">Device UI's &amp; Qt Quick</a></li>\n" \
+			  "              <li class=\"defaultLink\"><a href=\"http://doc.qt.nokia.com/latest/qt-gui-concepts.html\">Desktop UI components</a></li>\n" \
+			  "              <li class=\"defaultLink\"><a href=\"http://doc.qt.nokia.com/latest/platform-specific.html\">Platform-specific info</a></li>\n" \
 			  "            </ul>  \n" \
 			  "          </div>\n" \
 			  "        </div>\n" \
@@ -80,11 +80,11 @@ HTML.postheader         = " <div class=\"header\" id=\"qtdocheader\">\n" \
 			  "            Examples</h2>\n" \
 			  "          <div id=\"list003\" class=\"list\">\n" \
 			  "        <ul id=\"ul003\">\n" \
-			  "              <li class=\"defaultLink\"><a href=\"all-examples.html\">Examples</a></li>\n" \
-			  "              <li class=\"defaultLink\"><a href=\"tutorials.html\">Tutorials</a></li>\n" \
-			  "              <li class=\"defaultLink\"><a href=\"demos.html\">Demos</a></li>\n" \
-			  "              <li class=\"defaultLink\"><a href=\"qdeclarativeexamples.html\">QML Examples</a></li>\n" \
-			  "              <li class=\"defaultLink\"><a href=\"qdeclarativeexamples.html#Demos\">QML Demos</a></li>\n" \
+			  "              <li class=\"defaultLink\"><a href=\"http://doc.qt.nokia.com/latest/all-examples.html\">Examples</a></li>\n" \
+			  "              <li class=\"defaultLink\"><a href=\"http://doc.qt.nokia.com/latest/tutorials.html\">Tutorials</a></li>\n" \
+			  "              <li class=\"defaultLink\"><a href=\"http://doc.qt.nokia.com/latest/demos.html\">Demos</a></li>\n" \
+			  "              <li class=\"defaultLink\"><a href=\"http://doc.qt.nokia.com/latest/qdeclarativeexamples.html\">QML Examples</a></li>\n" \
+			  "              <li class=\"defaultLink\"><a href=\"http://doc.qt.nokia.com/latest/qdeclarativeexamples.html#Demos\">QML Demos</a></li>\n" \
 			  "            </ul> \n" \
 			  "          </div>\n" \
 			  "        </div>\n" \
diff --git a/doc/simulator-online.qdocconf b/doc/simulator-online.qdocconf
new file mode 100644
index 0000000..3d783e5
--- /dev/null
+++ b/doc/simulator-online.qdocconf
@@ -0,0 +1,4 @@
+online                  = true
+# Run qdoc from the directory that contains this file.
+include(simulator.qdocconf)
+
diff --git a/doc/simulator.qdocconf b/doc/simulator.qdocconf
index 568cbf0..0053019 100644
--- a/doc/simulator.qdocconf
+++ b/doc/simulator.qdocconf
@@ -56,32 +56,26 @@ qhp.Simulator.extraFiles       = \
                           images/qt-logo.png \
                           scripts/functions.js \
                           scripts/jquery.js \
+						  images/qt-logo \
+                          images/trolltech-logo \
                           images/api_examples.png \
                           images/api_lookup.png \
-                          images/api_topics.png \
+                          images/arrow_down.png \
                           images/bg_ll.png \
-                          images/bg_l_blank.png \
                           images/bg_l.png \
                           images/bg_lr.png \
                           images/bg_r.png \
                           images/bg_ul_blank.png \
-                          images/bg_ul.png \
-                          images/bg_ur_blank.png \
-                          images/bg_ur.png \
+                          images/bg_ll_blank.png \
+                          images/bg_l_blank.png \
                           images/breadcrumb.png \
                           images/bullet_dn.png \
                           images/bullet_gt.png \
+                          images/bullet_sq.png \
+                          images/box_bg.png \
                           images/feedbackground.png \
-                          images/form_bg.png \
                           images/horBar.png \
                           images/page_bg.png \
-                          images/print.png \
-                          images/qt_guide.png \
-                          images/qt-logo.png \
-                          images/qt_ref_doc.png \
-                          images/qt_tools.png \
-                          images/sep.png \
-                          images/header.png \
                           images/sprites-combined.png
 # macros.qdocconf
 
diff --git a/doc/templates/images/arrow_down.png b/doc/templates/images/arrow_down.png
new file mode 100644
index 0000000..9d01e97
--- /dev/null
+++ b/doc/templates/images/arrow_down.png
diff --git a/doc/templates/images/header_bg.png b/doc/templates/images/header_bg.png
new file mode 100644
index 0000000..a436aa6
--- /dev/null
+++ b/doc/templates/images/header_bg.png
diff --git a/doc/templates/images/page.png b/doc/templates/images/page.png
new file mode 100644
index 0000000..1db151b
--- /dev/null
+++ b/doc/templates/images/page.png
diff --git a/doc/templates/images/spinner.gif b/doc/templates/images/spinner.gif
new file mode 100644
index 0000000..1ed786f
--- /dev/null
+++ b/doc/templates/images/spinner.gif
diff --git a/doc/templates/scripts/functions.js b/doc/templates/scripts/functions.js
index 0135427..58a0248 100644
--- a/doc/templates/scripts/functions.js
+++ b/doc/templates/scripts/functions.js
@@ -1,10 +1,8 @@
-
 /* START non link areas where cursor should change to pointing hand */
 $('.t_button').mouseover(function() {
     $('.t_button').css('cursor','pointer');
 		/*document.getElementById(this.id).style.cursor='pointer';*/
 });
-
 /* END non link areas  */
 $('#smallA').click(function() {
 		$('.content .heading,.content h1, .content h2, .content h3, .content p, .content li, .content table').css('font-size','smaller');
@@ -20,6 +18,7 @@ $('#medA').click(function() {
 		$('.content p').css('font','13px/20px Verdana');
 		$('.content li').css('font','400 13px/1 Verdana');
 		$('.content li').css('line-height','14px');
+		$('.content .toc li').css('font', 'normal 10px/1.2 Verdana');
 		$('.content table').css('font','13px/1.2 Verdana');
 		$('.content .heading').css('font','600 16px/1 Arial');
 		$('.content .indexboxcont li').css('font','600 13px/1 Verdana');
@@ -34,27 +33,160 @@ $('#bigA').click(function() {
 		$(this).addClass('active')
 });
 
-function doSearch(str){
-
-if (str.length>3)
-  {
-  alert('start search');
- // document.getElementById("refWrapper").innerHTML="";
-  return;
-  }
- else
-  return;
-    
-//    var url="indexSearch.php";
-//    url=url+"?q="+str;
- //   url=url+"&sid="+Math.random();
-   // var url="http://localhost:8983/solr/select?";
-   // url=url+"&q="+str;
-   // url=url+"&fq=&start=0&rows=10&fl=&qt=&wt=&explainOther=&hl.fl=";
-    
-  //  $.get(url, function(data){ 
-   // alert(data);
-  // document.getElementById("refWrapper").innerHTML=data; 
- //});
-   
-}
\ No newline at end of file
+$('.feedclose').click(function() {
+	$('.bd').show();
+	$('.hd').show();
+	$('.footer').show();
+	$('#feedbackBox').hide();
+	$('#blurpage').hide();
+});
+
+$('.feedback').click(function() {
+	$('.bd').hide();
+	$('.hd').hide();
+	$('.footer').hide();
+	$('#feedbackBox').show();
+	$('#blurpage').show();
+});
+var lookupCount = 0;
+var articleCount = 0;
+var exampleCount = 0;
+var qturl = ""; // change from "http://doc.qt.nokia.com/4.6/" to 0 so we can have relative links
+
+function processNokiaData(response){
+	var propertyTags = response.getElementsByTagName('page');
+	
+ 	for (var i=0; i< propertyTags.length; i++) {
+		var linkStart   = "<li class=\"liveResult\"><a href='"+qturl+"";
+		var linkEnd  = "</a></li>";
+		
+		if(propertyTags[i].getElementsByTagName('pageType')[0].firstChild.nodeValue == 'APIPage'){
+			lookupCount++;
+
+			
+			for (var j=0; j< propertyTags[i].getElementsByTagName('pageWords').length; j++){
+				full_li_element = linkStart + propertyTags[i].getElementsByTagName('pageUrl')[j].firstChild.nodeValue;
+				full_li_element = full_li_element + "'>" + propertyTags[i].getElementsByTagName('pageTitle')[0].firstChild.nodeValue + linkEnd;
+					
+				$('#ul001').append(full_li_element);
+			$('#ul001 .defaultLink').css('display','none');
+
+		   		}
+			}
+	 
+		if(propertyTags[i].getElementsByTagName('pageType')[0].firstChild.nodeValue == 'Article'){
+			articleCount++;
+
+				 
+			for (var j=0; j< propertyTags[i].getElementsByTagName('pageWords').length; j++){
+			    full_li_element = linkStart + propertyTags[i].getElementsByTagName('pageUrl')[j].firstChild.nodeValue;
+				full_li_element =full_li_element + "'>" + propertyTags[i].getElementsByTagName('pageTitle')[0].firstChild.nodeValue + linkEnd ;
+					
+				$('#ul002').append(full_li_element);
+			$('#ul002 .defaultLink').css('display','none');
+
+	   		}
+		}
+		if(propertyTags[i].getElementsByTagName('pageType')[0].firstChild.nodeValue == 'Example'){
+			exampleCount++;
+
+
+			for (var j=0; j< propertyTags[i].getElementsByTagName('pageWords').length; j++){
+			    full_li_element = linkStart + propertyTags[i].getElementsByTagName('pageUrl')[j].firstChild.nodeValue;
+				full_li_element =full_li_element + "'>" + propertyTags[i].getElementsByTagName('pageTitle')[0].firstChild.nodeValue + linkEnd ;
+					
+				$('#ul003').append(full_li_element);
+			$('#ul003 .defaultLink').css('display','none');
+
+	   		}
+		} 
+		if(i==propertyTags.length){$('#pageType').removeClass('loading');}
+
+	}	
+	 
+	if(lookupCount == 0){$('#ul001').prepend('<li class=\"liveResult noMatch\">Found no result</li>');$('#ul001 li').css('display','block');$('.sidebar .search form input').removeClass('loading');}
+    if(articleCount == 0){$('#ul002').prepend('<li class=\"liveResult noMatch\">Found no result</li>');$('#ul002 li').css('display','block');}
+	if(exampleCount == 0){$('#ul003').prepend('<li class=\"liveResult noMatch\">Found no result</li>');$('#ul003 li').css('display','block');}
+	// reset count variables;
+	 lookupCount=0;
+	 articleCount = 0;
+     exampleCount = 0;
+	
+}
+//build regular expression object to find empty string or any number of blank
+var blankRE=/^\s*$/;
+function CheckEmptyAndLoadList()
+{
+	var pageUrl = window.location.href;
+	var pageVal = $('title').html();
+	$('#feedUrl').remove();
+	$('#pageVal').remove();
+	$('#feedform').append('<input id="feedUrl" name="feedUrl" value="'+pageUrl+'" style="display:none;">');
+	$('#feedform').append('<input id="pageVal" name="pageVal" value="'+pageVal+'" style="display:none;">');
+	$('.liveResult').remove();
+    $('.defaultLink').css('display','block');
+	var value = document.getElementById('pageType').value; 
+	if((blankRE.test(value)) || (value.length < 3))
+	{
+	//empty inputbox
+		// load default li elements into the ul if empty
+	//	loadAllList(); // replaced
+	 $('.defaultLink').css('display','block');
+	// $('.liveResult').css('display','none');
+	}else{
+	 $('.defaultLink').css('display','none');
+	}
+}
+/*
+$(window).resize(function(){
+if($(window).width()<400)
+	$('body').addClass('offline');
+else
+	$('body').removeClass('offline');
+	});
+	*/
+// Loads on doc ready
+	$(document).ready(function () {
+	//alert(pageUrl);
+	//$('#pageUrl').attr('foo',pageUrl);
+	var pageTitle = $('title').html();
+          var currentString = $('#pageType').val() ;
+		  if(currentString.length < 1){
+			$('.defaultLink').css('display','block');
+      	   		CheckEmptyAndLoadList();			
+		  }
+
+        $('#pageType').keyup(function () {
+          var searchString = $('#pageType').val() ;
+          if ((searchString == null) || (searchString.length < 3)) {
+				$('#pageType').removeClass('loading');
+				 $('.liveResult').remove(); // replaces removeResults();
+      	   		CheckEmptyAndLoadList();
+				$('.report').remove();
+				// debug$('.content').prepend('<li>too short or blank</li>'); // debug
+				return;
+		   }
+            if (this.timer) clearTimeout(this.timer);
+            this.timer = setTimeout(function () {
+				$('#pageType').addClass('loading');
+				// debug$('.content').prepend('<li>new search started </li>');// debug
+				// debug$('.content').prepend('<p class=\"report\">Search string ' +searchString +'</p>'); // debug
+
+               $.ajax({
+                contentType: "application/x-www-form-urlencoded",
+                url: 'http://' + location.host + '/nokiasearch/GetDataServlet',
+                data: 'searchString='+searchString,
+                dataType:'xml',
+				type: 'post',	 
+                success: function (response, textStatus) {
+
+				$('.liveResult').remove(); // replaces removeResults();
+								$('#pageType').removeClass('loading');
+
+                processNokiaData(response);
+
+ }     
+              });
+            }, 500);
+        });
+      }); 
diff --git a/doc/templates/scripts/narrow.js b/doc/templates/scripts/narrow.js
new file mode 100644
index 0000000..12d0ce8
--- /dev/null
+++ b/doc/templates/scripts/narrow.js
@@ -0,0 +1,78 @@
+var narrowInit = function() {
+  /* TODO:
+  Could probably be more efficient, not hardcoding each element to be created
+  */
+  // 1: Create search form
+  var narrowSearch = $('<div id="narrowsearch"></div>');
+  var searchform = $("#qtdocsearch");
+  narrowSearch.append(searchform);
+  $("#qtdocheader .content .qtref").after(narrowSearch);
+
+  // 2: Create dropdowns
+  var narrowmenu = $('<ul id="narrowmenu" class="sf-menu"></ul>');
+
+  // Lookup
+  var lookuptext = $("#lookup h2").attr("title");
+  $("#lookup ul").removeAttr("id");
+  $("#lookup ul li").removeAttr("class");
+  $("#lookup ul li").removeAttr("style");
+  var lookupul = $("#lookup ul");
+  var lookuplist = $('<li></li>');
+  var lookuplink = $('<a href="#"></a>');
+  lookuplink.append(lookuptext);
+  lookuplist.append(lookuplink);
+  lookuplist.append(lookupul);
+  narrowmenu.append(lookuplist);
+
+  // Topics
+  var topicstext = $("#topics h2").attr("title");
+  $("#topics ul").removeAttr("id");
+  $("#topics ul li").removeAttr("class");
+  $("#topics ul li").removeAttr("style");
+  var topicsul = $("#topics ul");
+  var topicslist = $('<li></li>');
+  var topicslink = $('<a href="#"></a>');
+  topicslink.append(topicstext);
+  topicslist.append(topicslink);
+  topicslist.append(topicsul);
+  narrowmenu.append(topicslist);
+
+  // Examples
+  var examplestext = $("#examples h2").attr("title");
+  $("#examples ul").removeAttr("id");
+  $("#examples ul li").removeAttr("class");
+  $("#examples ul li").removeAttr("style");
+  var examplesul = $("#examples ul");
+  var exampleslist = $('<li></li>');
+  var exampleslink = $('<a href="#"></a>');
+  exampleslink.append(examplestext);
+  exampleslist.append(exampleslink);
+  exampleslist.append(examplesul);
+  narrowmenu.append(exampleslist);
+
+  $("#shortCut").after(narrowmenu);
+  $('ul#narrowmenu').superfish({
+    delay: 100,
+    autoArrows: false,
+    disableHI: true
+  });
+}
+
+$(document).ready(function(){
+  if ($('body').hasClass('narrow')) {
+    narrowInit();
+  }
+});
+
+$(window).bind('resize', function () {
+  if($(window).width()<600) {
+    $('body').addClass('narrow');
+
+    if ($("#narrowsearch").length == 0) {
+      narrowInit();
+    }
+  }
+  else {
+    $('body').removeClass('narrow');
+  }
+});
\ No newline at end of file
diff --git a/doc/templates/scripts/superfish.js b/doc/templates/scripts/superfish.js
new file mode 100644
index 0000000..c6a9c7d
--- /dev/null
+++ b/doc/templates/scripts/superfish.js
@@ -0,0 +1,121 @@
+
+/*
+ * Superfish v1.4.8 - jQuery menu widget
+ * Copyright (c) 2008 Joel Birch
+ *
+ * Dual licensed under the MIT and GPL licenses:
+ * 	http://www.opensource.org/licenses/mit-license.php
+ * 	http://www.gnu.org/licenses/gpl.html
+ *
+ * CHANGELOG: http://users.tpg.com.au/j_birch/plugins/superfish/changelog.txt
+ */
+
+;(function($){
+	$.fn.superfish = function(op){
+
+		var sf = $.fn.superfish,
+			c = sf.c,
+			$arrow = $(['<span class="',c.arrowClass,'"> &#187;</span>'].join('')),
+			over = function(){
+				var $$ = $(this), menu = getMenu($$);
+				clearTimeout(menu.sfTimer);
+				$$.showSuperfishUl().siblings().hideSuperfishUl();
+			},
+			out = function(){
+				var $$ = $(this), menu = getMenu($$), o = sf.op;
+				clearTimeout(menu.sfTimer);
+				menu.sfTimer=setTimeout(function(){
+					o.retainPath=($.inArray($$[0],o.$path)>-1);
+					$$.hideSuperfishUl();
+					if (o.$path.length && $$.parents(['li.',o.hoverClass].join('')).length<1){over.call(o.$path);}
+				},o.delay);	
+			},
+			getMenu = function($menu){
+				var menu = $menu.parents(['ul.',c.menuClass,':first'].join(''))[0];
+				sf.op = sf.o[menu.serial];
+				return menu;
+			},
+			addArrow = function($a){ $a.addClass(c.anchorClass).append($arrow.clone()); };
+			
+		return this.each(function() {
+			var s = this.serial = sf.o.length;
+			var o = $.extend({},sf.defaults,op);
+			o.$path = $('li.'+o.pathClass,this).slice(0,o.pathLevels).each(function(){
+				$(this).addClass([o.hoverClass,c.bcClass].join(' '))
+					.filter('li:has(ul)').removeClass(o.pathClass);
+			});
+			sf.o[s] = sf.op = o;
+			
+			$('li:has(ul)',this)[($.fn.hoverIntent && !o.disableHI) ? 'hoverIntent' : 'hover'](over,out).each(function() {
+				if (o.autoArrows) addArrow( $('>a:first-child',this) );
+			})
+			.not('.'+c.bcClass)
+				.hideSuperfishUl();
+			
+			var $a = $('a',this);
+			$a.each(function(i){
+				var $li = $a.eq(i).parents('li');
+				$a.eq(i).focus(function(){over.call($li);}).blur(function(){out.call($li);});
+			});
+			o.onInit.call(this);
+			
+		}).each(function() {
+			var menuClasses = [c.menuClass];
+			if (sf.op.dropShadows  && !($.browser.msie && $.browser.version < 7)) menuClasses.push(c.shadowClass);
+			$(this).addClass(menuClasses.join(' '));
+		});
+	};
+
+	var sf = $.fn.superfish;
+	sf.o = [];
+	sf.op = {};
+	sf.IE7fix = function(){
+		var o = sf.op;
+		if ($.browser.msie && $.browser.version > 6 && o.dropShadows && o.animation.opacity!=undefined)
+			this.toggleClass(sf.c.shadowClass+'-off');
+		};
+	sf.c = {
+		bcClass     : 'sf-breadcrumb',
+		menuClass   : 'sf-js-enabled',
+		anchorClass : 'sf-with-ul',
+		arrowClass  : 'sf-sub-indicator',
+		shadowClass : 'sf-shadow'
+	};
+	sf.defaults = {
+		hoverClass	: 'sfHover',
+		pathClass	: 'overideThisToUse',
+		pathLevels	: 1,
+		delay		: 800,
+		animation	: {opacity:'show'},
+		speed		: 'normal',
+		autoArrows	: true,
+		dropShadows : true,
+		disableHI	: false,		// true disables hoverIntent detection
+		onInit		: function(){}, // callback functions
+		onBeforeShow: function(){},
+		onShow		: function(){},
+		onHide		: function(){}
+	};
+	$.fn.extend({
+		hideSuperfishUl : function(){
+			var o = sf.op,
+				not = (o.retainPath===true) ? o.$path : '';
+			o.retainPath = false;
+			var $ul = $(['li.',o.hoverClass].join(''),this).add(this).not(not).removeClass(o.hoverClass)
+					.find('>ul').hide().css('visibility','hidden');
+			o.onHide.call($ul);
+			return this;
+		},
+		showSuperfishUl : function(){
+			var o = sf.op,
+				sh = sf.c.shadowClass+'-off',
+				$ul = this.addClass(o.hoverClass)
+					.find('>ul:hidden').css('visibility','visible');
+			sf.IE7fix.call($ul);
+			o.onBeforeShow.call($ul);
+			$ul.animate(o.animation,o.speed,function(){ sf.IE7fix.call($ul); o.onShow.call($ul); });
+			return this;
+		}
+	});
+
+})(jQuery);
diff --git a/doc/templates/style/narrow.css b/doc/templates/style/narrow.css
new file mode 100644
index 0000000..05159aa
--- /dev/null
+++ b/doc/templates/style/narrow.css
@@ -0,0 +1,250 @@
+    /* start narrow mode */
+
+    body.narrow
+    {
+      background-image: none;
+    }
+
+    .narrow a {
+      color: #44a51c;
+    }
+
+    .narrow .header, .narrow .header .content, .narrow .footer, .narrow .wrapper {
+      margin: 0 7px;
+      min-width: 300px;
+    }
+
+    .narrow .footer {
+      margin: 0;
+    }
+    .narrow .header
+    {
+      width: 100%;
+      margin: 0;
+      height: auto;
+      background: #fff url(../images/header_bg.png) repeat-x 0 100%;
+      padding: 10px 0 5px 0;
+      overflow: visible;
+    }
+
+    .narrow .header .content
+    {
+    }
+
+    .narrow .header #nav-logo
+    {
+      display: none;
+    }
+
+    .narrow .header .qtref
+    {
+      width: auto;
+      height: auto;
+      color: #363534;
+      position: static;
+      float: left;
+      margin-left: 25px;
+      font: bold 18px/1 Arial;
+    }
+
+    .narrow .header .qtref a
+    {
+      color: #363534;
+    }
+
+    .narrow .header .qtref span
+    {
+      background-image: none;
+      text-indent: 0;
+    }
+
+    .narrow .header #nav-topright
+    {
+      display: none;
+    }
+
+    .narrow .header #shortCut
+    {
+      clear: both;
+      font-weight: normal;
+      position: static;
+      float: left;
+      margin: 15px 0 0 25px;
+      overflow: hidden;
+      padding: 0;
+      height: auto;
+    }
+
+    .narrow .header #shortCut ul
+    {
+      float: none;
+      margin: 0;
+      width: auto;
+      font-size: 11px;
+    }
+
+    .narrow .header #shortCut ul li
+    {
+      background-image: none;
+    }
+
+    .narrow .header #shortCut ul .shortCut-topleft-active,
+    .narrow .header #shortCut ul .shortCut-topleft-inactive
+    {
+      background-image: none;
+      height: auto;
+      padding: 0;
+      width: auto;
+    }
+    .narrow .header #shortCut ul li a
+    {
+      color: #44a51c;
+    }
+
+    .narrow .wrapper .hd
+    {
+        background: url(../images/bg_ul_blank.png) no-repeat 0 0;
+    }
+
+    .narrow .wrapper .bd
+    {
+        background: url(../images/bg_l_blank.png) repeat-y 0 0;
+    }
+
+    .narrow .wrapper .ft
+    {
+        background: url(../images/bg_ll_blank.png) no-repeat 0 0;
+    }
+
+    .narrow .sidebar
+    {
+        display: none;
+    }
+
+    .narrow .wrap
+    {
+        margin: 0 5px 0 5px;
+    }
+
+    .narrow .wrap .toolbar
+    {
+      border-bottom: none;
+    }
+
+    .narrow .wrap .content
+    {
+        padding-top: 15px;
+    }
+
+    .narrow .wrap .feedback
+    {
+        display: none;
+    }
+
+    .narrow .wrap .breadcrumb ul li {
+      font-weight: normal;
+    }
+
+    .narrow .wrap .breadcrumb ul li a {
+      color: #44a51c;
+    }
+
+    .narrow .wrap .breadcrumb ul li.last a {
+      color: #363534;
+    }
+    
+    #narrowsearch {
+      display: none;
+    }
+
+    .narrow #narrowsearch {
+      display: block;
+      float: right;
+      margin-right: 25px;
+      _position: relative;
+    }
+
+    .narrow #narrowsearch fieldset {
+      _position: absolute;
+      _margin-top: -1px;
+    }
+
+    .narrow #narrowsearch {
+      background: url("http://doc.qt.nokia.com/prototype/html/images/sprites-combined.png") no-repeat scroll -6px -348px transparent;
+      height: 21px;
+      padding: 2px 0 0 5px;
+      width: 167px;
+    }
+
+    .narrow #narrowsearch input {
+      border: none;
+      font: 13px/1.2 Verdana;
+      height: 19px;
+      outline: none;
+      padding: 0;
+      width: 158px;
+      *border: 1px solid #fff;
+      *height: 17px;
+      _height: 18px;
+    }
+
+    .narrow .indexbox .indexIcon {
+      display: none;
+    }
+
+    .narrow .indexboxcont .section {
+      width: 64%;
+      padding-left: 0;
+    }
+    
+    .narrow .indexboxcont .sectionlist {
+      width: 32.5%;
+    }
+
+    #narrowmenu {
+      display: none;
+      float: right;
+      margin: 15px 40px 0 0;
+      font-size: 11px;
+    }
+
+    .narrow #narrowmenu {
+      display: block;
+    }
+
+    #narrowmenu a {
+      line-height: 1.1;
+      background: url(../images/arrow_down.png) no-repeat 100% 50%;
+      white-space: nowrap;
+      padding: 0 16px 0 5px;
+    }
+
+    #narrowmenu li {
+      margin-left: 20px;
+    }
+
+    #narrowmenu li li {
+      margin: 0 0 5px 0;
+    }
+
+    #narrowmenu li li a {
+      padding: 0;
+      background-image: none;
+    }
+
+    #narrowmenu li,
+    #narrowmenu li ul {
+      background-color: #fff;
+	  margin-top:-1px;
+    }
+
+    #narrowmenu li ul {
+      width: auto;
+      padding: 5px;
+    }
+
+    .sf-menu li:hover ul, .sf-menu li.sfHover ul {
+      top: 1.2em;
+    }
+
+    /* end narrow mode */
diff --git a/doc/templates/style/style.css b/doc/templates/style/style.css
index 47fe2e0..28d558f 100644
--- a/doc/templates/style/style.css
+++ b/doc/templates/style/style.css
@@ -678,7 +678,7 @@
         padding-left: 3px;
         background: transparent url( ../images/sprites-combined.png) no-repeat 0px -58px;
         height: 20px;
-        width: 47px;
+        width: 110px;
     }
     .shortCut-topleft-inactive span
     {
diff --git a/doc/templates/style/superfish.css b/doc/templates/style/superfish.css
new file mode 100644
index 0000000..0cf0f7d
--- /dev/null
+++ b/doc/templates/style/superfish.css
@@ -0,0 +1,51 @@
+.sf-menu, .sf-menu * {
+	margin:			0;
+	padding:		0;
+	list-style:		none;
+}
+.sf-menu {
+	line-height:	1.0;
+}
+.sf-menu ul {
+	position:		absolute;
+	top:			-999em;
+	width:			10em; /* left offset of submenus need to match (see below) */
+}
+.sf-menu ul li {
+	width:			100%;
+}
+.sf-menu li:hover {
+	visibility:		inherit; /* fixes IE7 'sticky bug' */
+}
+.sf-menu li {
+	float:			left;
+	position:		relative;
+}
+.sf-menu a {
+	display:		block;
+	position:		relative;
+}
+.sf-menu li:hover ul,
+.sf-menu li.sfHover ul {
+	left:			0;
+	top:			2.5em; /* match top ul list item height */
+	z-index:		99;
+}
+ul.sf-menu li:hover li ul,
+ul.sf-menu li.sfHover li ul {
+	top:			-999em;
+}
+ul.sf-menu li li:hover ul,
+ul.sf-menu li li.sfHover ul {
+	left:			10em; /* match ul width */
+	top:			0;
+}
+ul.sf-menu li li:hover li ul,
+ul.sf-menu li li.sfHover li ul {
+	top:			-999em;
+}
+ul.sf-menu li li li:hover ul,
+ul.sf-menu li li li.sfHover ul {
+	left:			10em; /* match ul width */
+	top:			0;
+}
diff --git a/doc/templates/style/superfish_skin.css b/doc/templates/style/superfish_skin.css
new file mode 100644
index 0000000..8d84827
--- /dev/null
+++ b/doc/templates/style/superfish_skin.css
@@ -0,0 +1,83 @@
+
+/*** DEMO SKIN ***/
+.sf-menu {
+	float:			left;
+	margin-bottom:	1em;
+}
+.sf-menu a {
+	border-left:	1px solid #fff;
+	border-top:		1px solid #CFDEFF;
+	padding: 		.75em 1em;
+	text-decoration:none;
+}
+.sf-menu a, .sf-menu a:visited  { /* visited pseudo selector so IE6 applies text colour*/
+	color:			#13a;
+}
+.sf-menu li {
+	background:		#BDD2FF;
+}
+.sf-menu li li {
+	background:		#AABDE6;
+}
+.sf-menu li li li {
+	background:		#9AAEDB;
+}
+.sf-menu li:hover, .sf-menu li.sfHover,
+.sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active {
+	background:		#CFDEFF;
+	outline:		0;
+}
+
+/*** arrows **/
+.sf-menu a.sf-with-ul {
+	padding-right: 	2.25em;
+	min-width:		1px; /* trigger IE7 hasLayout so spans position accurately */
+}
+.sf-sub-indicator {
+	position:		absolute;
+	display:		block;
+	right:			.75em;
+	top:			1.05em; /* IE6 only */
+	width:			10px;
+	height:			10px;
+	text-indent: 	-999em;
+	overflow:		hidden;
+	background:		url('../images/arrows-ffffff.png') no-repeat -10px -100px; /* 8-bit indexed alpha png. IE6 gets solid image only */
+}
+a > .sf-sub-indicator {  /* give all except IE6 the correct values */
+	top:			.8em;
+	background-position: 0 -100px; /* use translucent arrow for modern browsers*/
+}
+/* apply hovers to modern browsers */
+a:focus > .sf-sub-indicator,
+a:hover > .sf-sub-indicator,
+a:active > .sf-sub-indicator,
+li:hover > a > .sf-sub-indicator,
+li.sfHover > a > .sf-sub-indicator {
+	background-position: -10px -100px; /* arrow hovers for modern browsers*/
+}
+
+/* point right for anchors in subs */
+.sf-menu ul .sf-sub-indicator { background-position:  -10px 0; }
+.sf-menu ul a > .sf-sub-indicator { background-position:  0 0; }
+/* apply hovers to modern browsers */
+.sf-menu ul a:focus > .sf-sub-indicator,
+.sf-menu ul a:hover > .sf-sub-indicator,
+.sf-menu ul a:active > .sf-sub-indicator,
+.sf-menu ul li:hover > a > .sf-sub-indicator,
+.sf-menu ul li.sfHover > a > .sf-sub-indicator {
+	background-position: -10px 0; /* arrow hovers for modern browsers*/
+}
+
+/*** shadows for all but IE6 ***/
+.sf-shadow ul {
+	background:	url('../images/shadow.png') no-repeat bottom right;
+	padding: 0 8px 9px 0;
+	-moz-border-radius-bottomleft: 17px;
+	-moz-border-radius-topright: 17px;
+	-webkit-border-top-right-radius: 17px;
+	-webkit-border-bottom-left-radius: 17px;
+}
+.sf-shadow ul.sf-shadow-off {
+	background: transparent;
+}