diff --git a/manual/new/DocTool.php b/manual/new/DocTool.php index bf77d41f0..18fb5ea53 100644 --- a/manual/new/DocTool.php +++ b/manual/new/DocTool.php @@ -96,9 +96,6 @@ class DocTool $class = ' class="one-page"'; } - echo '' . "\n"; - echo '

Table of Contents

' . "\n"; - $classes[] = 'tree'; } else { @@ -151,9 +148,6 @@ class DocTool echo '' . "\n"; - if ($toc instanceof Sensei_Doc_Toc) { - echo '' . "\n"; - } } public function makeUrl($path) diff --git a/manual/new/scripts/toc.js b/manual/new/scripts/toc.js new file mode 100644 index 000000000..80f90313b --- /dev/null +++ b/manual/new/scripts/toc.js @@ -0,0 +1,95 @@ +function toggleToc() +{ + var toc = document.getElementById('table-of-contents').getElementsByTagName('ul')[0]; + var toggleLink = document.getElementById('toc-collapse-toggle').getElementsByTagName('a')[0]; + var stickySpan = document.getElementById('toc-sticky-toggle'); + + if (toc && toggleLink && toc.style.display == 'none') { + toggleLink.innerHTML = tocHideText; + toc.style.display = 'block'; + if (stickySpan) { + stickySpan.style.display = 'inline'; + } + createCookie('hidetoc', 0, 1000); + } else { + toggleLink.innerHTML = tocShowText; + toc.style.display = 'none'; + if (stickySpan) { + stickySpan.style.display = 'none'; + } + createCookie('hidetoc', 1, 1000); + } +} + +function toggleStickyToc() +{ + var wrap = document.getElementById('wrap'); + var toggleLink = document.getElementById('toc-sticky-toggle').getElementsByTagName('a')[0]; + var collapseSpan = document.getElementById('toc-collapse-toggle'); + + if (wrap && toggleLink && !hasClassName(wrap, 'sticky-toc')) { + toggleLink.innerHTML = tocUnstickyText; + addClassName(wrap, 'sticky-toc'); + if (collapseSpan) { + collapseSpan.style.display = 'none'; + } + createCookie('stickytoc', 1, 1000); + } else { + toggleLink.innerHTML = tocStickyText; + removeClassName(wrap, 'sticky-toc'); + if (collapseSpan) { + collapseSpan.style.display = 'inline'; + } + createCookie('stickytoc', 0, 1000); + } +} + +function createTocToggle() +{ + var container = document.getElementById('toc-toggles'); + + var span = document.createElement('span'); + var link = document.createElement('a'); + var text = document.createTextNode(tocHideText); + + link.appendChild(text); + link.setAttribute('href', 'javascript:toggleToc()'); + + span.setAttribute('id', 'toc-collapse-toggle'); + span.appendChild(link); + + container.appendChild(span); + + if (readCookie('hidetoc') == 1) { + toggleToc(); + } + + if (readCookie('stickytoc') == 1) { + span.style.display = 'none'; + } +} + +function createTocStickyToggle() +{ + var container = document.getElementById('toc-toggles'); + + var span = document.createElement('span'); + var link = document.createElement('a'); + var text = document.createTextNode(tocStickyText); + + link.appendChild(text); + link.setAttribute('href', 'javascript:toggleStickyToc()'); + + span.setAttribute('id', 'toc-sticky-toggle'); + span.appendChild(link); + + container.appendChild(span); + + if (readCookie('stickytoc') == 1) { + toggleStickyToc(); + } + + if (readCookie('hidetoc') == 1) { + span.style.display = 'none'; + } +} diff --git a/manual/new/scripts/tree.js b/manual/new/scripts/tree.js index cc1c7c9bd..a20e4c698 100644 --- a/manual/new/scripts/tree.js +++ b/manual/new/scripts/tree.js @@ -1,14 +1,12 @@ var symbolClosed = '+'; var symbolOpen = '-'; -//var symbolClosed = '▹'; -//var symbolOpen = '▿'; function Tree_AutoInit() { var candidates = document.getElementsByTagName('ul'); for (i in candidates) { - if (HasClassName(candidates[i], 'tree')) { + if (hasClassName(candidates[i], 'tree')) { Tree_Init(candidates[i]); } } @@ -31,7 +29,7 @@ function Tree_Init(element) expander.href = 'javascript:void(0);'; expander.onclick = Tree_Toggle; - if (HasClassName(subTree, 'closed')) { + if (hasClassName(subTree, 'closed')) { expander.innerHTML = symbolClosed; } else { expander.innerHTML = symbolOpen; @@ -62,187 +60,14 @@ function Tree_Toggle() li = expander.parentNode; subTree = Tree_FindChild(li, 'ul'); - if (HasClassName(subTree, 'closed')) { - RemoveClassName(subTree, 'closed'); + if (hasClassName(subTree, 'closed')) { + removeClassName(subTree, 'closed'); expander.innerHTML = symbolOpen; } else { - AddClassName(subTree, 'closed'); + addClassName(subTree, 'closed'); expander.innerHTML = symbolClosed; } } -// ---------------------------------------------------------------------------- -// HasClassName -// -// Description : returns boolean indicating whether the object has the class name -// built with the understanding that there may be multiple classes -// -// Arguments: -// objElement - element to manipulate -// strClass - class name to add -// -function HasClassName(objElement, strClass) - { - - // if there is a class - if ( objElement.className ) - { - - // the classes are just a space separated list, so first get the list - var arrList = objElement.className.split(' '); - - // get uppercase class for comparison purposes - var strClassUpper = strClass.toUpperCase(); - - // find all instances and remove them - for ( var i = 0; i < arrList.length; i++ ) - { - - // if class found - if ( arrList[i].toUpperCase() == strClassUpper ) - { - - // we found it - return true; - - } - - } - - } - - // if we got here then the class name is not there - return false; - - } - -// ---------------------------------------------------------------------------- -// AddClassName -// -// Description : adds a class to the class attribute of a DOM element -// built with the understanding that there may be multiple classes -// -// Arguments: -// objElement - element to manipulate -// strClass - class name to add -// -function AddClassName(objElement, strClass, blnMayAlreadyExist) -{ - // if there is a class - if (objElement.className) { - - // the classes are just a space separated list, so first get the list - var arrList = objElement.className.split(' '); - - // if the new class name may already exist in list - if (blnMayAlreadyExist) { - - // get uppercase class for comparison purposes - var strClassUpper = strClass.toUpperCase(); - - // find all instances and remove them - for (var i = 0; i < arrList.length; i++) { - - // if class found - if (arrList[i].toUpperCase() == strClassUpper) { - - // remove array item - arrList.splice(i, 1); - - // decrement loop counter as we have adjusted the array's contents - i--; - } - } - } - - // add the new class to end of list - arrList[arrList.length] = strClass; - - // add the new class to beginning of list - //arrList.splice(0, 0, strClass); - - // assign modified class name attribute - objElement.className = arrList.join(' '); - - // if there was no class - } else { - // assign modified class name attribute - objElement.className = strClass; - } -} - -// ---------------------------------------------------------------------------- -// RemoveClassName -// -// Description : removes a class from the class attribute of a DOM element -// built with the understanding that there may be multiple classes -// -// Arguments: -// objElement - element to manipulate -// strClass - class name to remove -// -function RemoveClassName(objElement, strClass) - { - - // if there is a class - if ( objElement.className ) - { - - // the classes are just a space separated list, so first get the list - var arrList = objElement.className.split(' '); - - // get uppercase class for comparison purposes - var strClassUpper = strClass.toUpperCase(); - - // find all instances and remove them - for ( var i = 0; i < arrList.length; i++ ) - { - - // if class found - if ( arrList[i].toUpperCase() == strClassUpper ) - { - - // remove array item - arrList.splice(i, 1); - - // decrement loop counter as we have adjusted the array's contents - i--; - - } - - } - - // assign modified class name attribute - objElement.className = arrList.join(' '); - - } - // if there was no class - // there is nothing to remove - - } - - -/* - * Handlers for automated loading - */ - _LOADERS = Array(); - -function callAllLoaders() { - var i, loaderFunc; - for(i=0;i<_LOADERS.length;i++) { - loaderFunc = _LOADERS[i]; - if(loaderFunc != callAllLoaders) loaderFunc(); - } -} - -function appendLoader(loaderFunc) { - if(window.onload && window.onload != callAllLoaders) - _LOADERS[_LOADERS.length] = window.onload; - - window.onload = callAllLoaders; - - _LOADERS[_LOADERS.length] = loaderFunc; -} - appendLoader(Tree_AutoInit); diff --git a/manual/new/scripts/util.js b/manual/new/scripts/util.js new file mode 100644 index 000000000..04e290e02 --- /dev/null +++ b/manual/new/scripts/util.js @@ -0,0 +1,179 @@ +/** + * Checks if the object has the class name. + * + * @param objElement element to manipulate + * @param strClass class name to add + * + * @return boolean indicating whether the object has the class name built with + * the understanding that there may be multiple classes. + */ +function hasClassName(objElement, strClass) +{ + // if there is a class + if (objElement.className) { + + // the classes are just a space separated list, so first get the list + var arrList = objElement.className.split(' '); + + // get uppercase class for comparison purposes + var strClassUpper = strClass.toUpperCase(); + + // find all instances and remove them + for (var i = 0; i < arrList.length; i++) { + // if class found + if (arrList[i].toUpperCase() == strClassUpper) { + // we found it + return true; + } + } + + } + + // if we got here then the class name is not there + return false; +} + +/** + * Adds a class to the class attribute of a DOM element built with the + * understanding that there may be multiple classes. + * + * @param objElement element to manipulate + * @param strClass class name to add + */ +function addClassName(objElement, strClass, blnMayAlreadyExist) +{ + // if there is a class + if (objElement.className) { + + // the classes are just a space separated list, so first get the list + var arrList = objElement.className.split(' '); + + // if the new class name may already exist in list + if (blnMayAlreadyExist) { + + // get uppercase class for comparison purposes + var strClassUpper = strClass.toUpperCase(); + + // find all instances and remove them + for (var i = 0; i < arrList.length; i++) { + + // if class found + if (arrList[i].toUpperCase() == strClassUpper) { + + // remove array item + arrList.splice(i, 1); + + // decrement loop counter as we have adjusted the array's contents + i--; + } + } + } + + // add the new class to end of list + arrList[arrList.length] = strClass; + + // add the new class to beginning of list + //arrList.splice(0, 0, strClass); + + // assign modified class name attribute + objElement.className = arrList.join(' '); + + // if there was no class + } else { + // assign modified class name attribute + objElement.className = strClass; + } +} + +/** + * RemoveClassName + * + * Removes a class from the class attribute of a DOM element built with the + * understanding that there may be multiple classes. + * + * @param objElement element to manipulate + * @param strClass class name to remove + */ +function removeClassName(objElement, strClass) +{ + // if there is a class + if (objElement.className) { + + // the classes are just a space separated list, so first get the list + var arrList = objElement.className.split(' '); + + // get uppercase class for comparison purposes + var strClassUpper = strClass.toUpperCase(); + + // find all instances and remove them + for (var i = 0; i < arrList.length; i++) { + + // if class found + if (arrList[i].toUpperCase() == strClassUpper) { + + // remove array item + arrList.splice(i, 1); + + // decrement loop counter as we have adjusted the array's contents + i--; + + } + + } + + // assign modified class name attribute + objElement.className = arrList.join(' '); + + } + // if there was no class + // there is nothing to remove +} + +/* + * Handlers for automated loading + */ + _LOADERS = Array(); + +function callAllLoaders() { + var i, loaderFunc; + for(i=0;i<_LOADERS.length;i++) { + loaderFunc = _LOADERS[i]; + if(loaderFunc != callAllLoaders) loaderFunc(); + } +} + +function appendLoader(loaderFunc) { + if(window.onload && window.onload != callAllLoaders) + _LOADERS[_LOADERS.length] = window.onload; + + window.onload = callAllLoaders; + + _LOADERS[_LOADERS.length] = loaderFunc; +} + + +function createCookie(name,value,days) { + if (days) { + var date = new Date(); + date.setTime(date.getTime()+(days*24*60*60*1000)); + var expires = "; expires="+date.toGMTString(); + } + else var expires = ""; + document.cookie = name+"="+value+expires+";"; +} + +function readCookie(name) { + var nameEQ = name + "="; + var ca = document.cookie.split(';'); + for(var i=0;i < ca.length;i++) { + var c = ca[i]; + while (c.charAt(0)==' ') c = c.substring(1,c.length); + if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length); + } + return null; +} + +function eraseCookie(name) { + createCookie(name,"",-1); +} + diff --git a/manual/new/styles/basic.css b/manual/new/styles/basic.css index 38a057f2a..47f0ac98b 100644 --- a/manual/new/styles/basic.css +++ b/manual/new/styles/basic.css @@ -2,7 +2,7 @@ body, html { margin: 0; padding: 0; font-family: "Trebuchet MS", sans-serif; - font-size: normal; + font-size: medium; background: white; color: black; } @@ -18,7 +18,7 @@ h1 { margin-top: 0; } -h2, #table-of-contents h1 { +h2 { font-size: 1.5em; text-align: left; margin: 0.67em 0; @@ -41,7 +41,7 @@ h4 { p, ul, ol, dl { line-height: 1.5em; text-align: justify; - font-size: normal; + font-size: medium; } ul { @@ -56,6 +56,7 @@ table { border: 1px solid #aaaaaa; border-collapse: collapse; margin: 0.5em 0; + color: black; background-color: #f9f9f9; line-height: 1.5em; } @@ -66,9 +67,30 @@ td, th { } th { + color: black; background-color: #f2f2f2; } +a:link { + color: #3465a4; + background-color: inherit; + text-decoration: none; +} + +a:visited { + color: #75507b; + background-color: inherit; + text-decoration: none; +} + +a:link:hover, +a:link:active, +a:visited:hover, +a:visited:active { + text-decoration: underline; + color: #555753; + background-color: inherit; +} /*** Code blocks and highlighting**********************************************/ @@ -82,50 +104,50 @@ pre { padding: 1em; margin: 1em 0; line-height: 1.2em; + color: black; background-color: #f6f6f6; border: 1px solid #cccccc; + + /* Pup's Box Flow Hack, Rev 2 */ + overflow/**/: auto; + \height: 1%; +} + +/* This rule applies only to Firefox */ +pre, x:-moz-any-link { + /* overflow: auto causes artefacts */ + overflow: hidden; + + /* prevents text to be hidden by wrapping it */ + white-space: -moz-pre-wrap !important; } pre .default { color: #000000; + background-color: inherit; } pre .keyword { color: #3465a4; + background-color: inherit; } pre .string { color: #ef2929; + background-color: inherit; } pre .comment { color: #888a85; + background-color: inherit; } -a:link { - color: #3465a4; - text-decoration: none; -} +/** Page layout ***************************************************************/ -a:visited { - color: #75507b; - text-decoration: none; -} - -a:link:hover, -a:link:active, -a:visited:hover, -a:visited:active { - text-decoration: underline; - color: #555753; -} - - -#table-of-contents { - border: 1px solid #cccccc; - background-color: #f6f6f6; - padding: 0 1em; - margin: 0; +#sidebar { + float: right; + margin: 1em; + padding: 0; } #wrap { @@ -133,30 +155,22 @@ a:visited:active { padding: 0; } -#sidebar { - float: right; - width: 25%; - margin: 0; +#content { padding: 1em; } -#content { - margin-right: 25%; - padding: 1em; - padding-right: 2em; -} - /** Tree specific styles ******************************************************/ -ul.tree { - font-size: 0.9em; -} - ul.tree, ul.tree ul { list-style-type: none; padding-left: 2em; text-align: left; - margin-left: 0; + margin: 0; + font-size: 1em; +} + +ul.tree { + margin-top: 1em; } .tree a { @@ -167,6 +181,7 @@ ul.tree, ul.tree ul { .tree .expander { color: black; + background-color: inherit; display: block; float: left; margin: 0; @@ -181,9 +196,75 @@ ul.tree, ul.tree ul { .tree .expander:active, .tree .expander:hover { color: black; + background-color: inherit; text-decoration: none; } .tree ul.closed { display: none; } + +/** Table of Contents *********************************************************/ + +#table-of-contents { + border: 1px solid #cccccc; + color: black; + background-color: #f6f6f6; + padding: 1em; + padding-top: 0; + margin: 0; +} + +#table-of-contents p, +#table-of-contents ul.tree, +#table-of-contents span { + font-size: 0.9em; +} + +#table-of-contents p { + margin-bottom: 0; +} + +#table-of-contents h1 { + display: block; + font-size: 1.5em; + margin-right: 0.5em; + margin-bottom: 0; + text-align: left; +} + +#toc-toggles { + margin: 0; + padding: 0; + text-align: right; +} + +#toc-toggles span { + padding-left: 0.5em; +} + +/** Sticky Table of Contents **************************************************/ + +div#wrap.sticky-toc #sidebar { + /* Netscape 4, IE 4.x-5.0/Win and other lesser browsers will use this */ + position: absolute; + top: 0; + right: 0; + bottom: 0; + width: 25%; + overflow: auto; +} + +div#wrap.sticky-toc > #sidebar { + /* used by Opera 5+, Netscape6+/Mozilla, Konqueror, Safari, OmniWeb 4.5+, + iCab, ICEbrowser */ + position: fixed; +} + +.sticky-toc #content { + position: absolute; + top: 0; + left: 0; + right: 25%; + padding-right: 2em; +} diff --git a/manual/new/styles/iefix.css b/manual/new/styles/iefix.css index 7a9049009..c6ee16318 100644 --- a/manual/new/styles/iefix.css +++ b/manual/new/styles/iefix.css @@ -4,4 +4,12 @@ pre { word-wrap: break-word; -} \ No newline at end of file +} + + +div#wrap.sticky-toc #sidebar { + /* IE5.5+/Win - this is more specific than the IE 5.0 version */ + top: expression(eval(document.documentElement.scrollTop)); + height: expression(eval(document.documentElement.clientHeight - 32)); +} + diff --git a/manual/new/template.php b/manual/new/template.php index ee02f91b9..b74f92988 100644 --- a/manual/new/template.php +++ b/manual/new/template.php @@ -16,7 +16,9 @@ + + @@ -24,17 +26,44 @@
+getOption('section') || $tool->getOption('one-page')): ?> +