diff options
5 files changed, 276 insertions, 166 deletions
diff --git a/src/compiler/scala/tools/nsc/doc/html/page/Index.scala b/src/compiler/scala/tools/nsc/doc/html/page/Index.scala index 346780147e..f8fffdc726 100644 --- a/src/compiler/scala/tools/nsc/doc/html/page/Index.scala +++ b/src/compiler/scala/tools/nsc/doc/html/page/Index.scala @@ -44,7 +44,7 @@ class Index(universe: doc.Universe, index: doc.Index) extends HtmlPage { </div> { browser } <div id="content" class="ui-layout-center"> - <iframe name="template" src={ relativeLinkTo{List("package.html")} }/> + <iframe id="template" src={ relativeLinkTo{List("package.html")} }/> </div> </body> diff --git a/src/compiler/scala/tools/nsc/doc/html/page/Template.scala b/src/compiler/scala/tools/nsc/doc/html/page/Template.scala index 220321d225..49cd17c176 100644 --- a/src/compiler/scala/tools/nsc/doc/html/page/Template.scala +++ b/src/compiler/scala/tools/nsc/doc/html/page/Template.scala @@ -87,7 +87,7 @@ class Template(universe: doc.Universe, tpl: DocTemplateEntity) extends HtmlPage { memberToCommentHtml(tpl, true) } <div id="mbrsel"> - <div id='textfilter'><span class='pre'/><span class='input'><input type='text' accesskey='/'/></span><span class='post'/></div> + <div id='textfilter'><span class='pre'/><span class='input'><input id='mbrsel-input' type='text' accesskey='/'/></span><span class='post'/></div> { if (tpl.linearizationTemplates.isEmpty && tpl.conversions.isEmpty) NodeSeq.Empty else <div id="order"> <span class="filtertype">Ordering</span> diff --git a/src/compiler/scala/tools/nsc/doc/html/resource/lib/index.css b/src/compiler/scala/tools/nsc/doc/html/resource/lib/index.css index c6136c508e..2a8f9b570a 100644 --- a/src/compiler/scala/tools/nsc/doc/html/resource/lib/index.css +++ b/src/compiler/scala/tools/nsc/doc/html/resource/lib/index.css @@ -1,23 +1,32 @@ * { - color: inherit; - font-size: 10pt; - text-decoration: none; + color: inherit; + font-size: 10pt; + text-decoration: none; font-family: Arial, sans-serif; - border-width: 0px; - padding: 0px; - margin: 0px; + border-width: 0px; + padding: 0px; + margin: 0px; } a { - cursor: pointer; + cursor: pointer; } a:hover { - text-decoration: underline; + text-decoration: underline; } h1 { - display: none; + display: none; +} + +.selected { + -moz-box-shadow: inset 0px 5px 10px rgba(58, 88, 97, .36); + -webkit-box-shadow: inset 0px 5px 10px rgba(58, 88, 97, .36); + border-top: solid 1px rgba(119, 138, 153, 0.8); + border-bottom: solid 1px rgba(151, 173, 191, 0.4); + background-color: #ced2d9; + margin: -1px 0px; } /*.letters { @@ -33,81 +42,81 @@ h1 { } #browser { - top: 0px; - left: 0px; - bottom: 0px; - width: 100%; - display: block; - position: fixed; + top: 0px; + left: 0px; + bottom: 0px; + width: 100%; + display: block; + position: fixed; } #filter { - position: absolute; - display: block; -/* padding: 5px;*/ - right: 0; - left: 0; - top: 0; - background-image:url('filterbg.gif'); - background-repeat:repeat-x; - background-color: #ededee; /* light gray */ - /*background-color: #DADADA;*/ - border:1px solid #bbbbbb; - border-top:0; - border-left:0; - border-right:0; + position: absolute; + display: block; +/* padding: 5px;*/ + right: 0; + left: 0; + top: 0; + background-image:url('filterbg.gif'); + background-repeat:repeat-x; + background-color: #ededee; /* light gray */ + /*background-color: #DADADA;*/ + border:1px solid #bbbbbb; + border-top:0; + border-left:0; + border-right:0; } #textfilter { - position: relative; - display: block; - height: 20px; - margin-top: 5px; - margin-bottom: 5px; + position: relative; + display: block; + height: 20px; + margin-top: 5px; + margin-bottom: 5px; } #textfilter > .pre { - display: block; - position: absolute; - top: 0; - left: 0; - height: 23px; - width: 21px; - background: url("filter_box_left.png"); + display: block; + position: absolute; + top: 0; + left: 0; + height: 23px; + width: 21px; + background: url("filter_box_left.png"); } #textfilter > .input { - display: block; - position: absolute; - top: 0; - right: 20px; - left: 20px; + display: block; + position: absolute; + top: 0; + right: 20px; + left: 20px; } #textfilter > .input > input { - height: 20px; - padding: 1px; - font-weight: bold; - color: #000000; - background: #ffffff url("filterboxbarbg.png") repeat-x bottom left; - width: 100%; + height: 20px; + padding: 1px; + font-weight: bold; + color: #000000; + background: #ffffff url("filterboxbarbg.png") repeat-x bottom left; + width: 100%; } #textfilter > .post { - display: block; - position: absolute; - top: 0; - right: 0; - height: 23px; - width: 21px; - background: url("filter_box_right.png"); + display: block; + position: absolute; + top: 0; + right: 0; + height: 23px; + width: 21px; + background: url("filter_box_right.png"); } /*#textfilter { - position: relative; - display: block; + position: relative; + display: block; height: 20px; - margin-bottom: 5px; + margin-bottom: 5px; } #textfilter > .pre { @@ -121,7 +130,7 @@ h1 { } #textfilter > .input { - display: block; + display: block; position: absolute; top: 0; right: 20px; @@ -129,11 +138,11 @@ h1 { } #textfilter > .input > input { - height: 16px; - padding: 2px; - font-weight: bold; - color: darkblue; - background-color: white; + height: 16px; + padding: 2px; + font-weight: bold; + color: darkblue; + background-color: white; width: 100%; } @@ -148,22 +157,22 @@ h1 { }*/ #focusfilter { - position: relative; - text-align: center; - display: block; - padding: 5px; - background-color: #fffebd; /* light yellow*/ - text-shadow: #ffffff 0 1px 0; + position: relative; + text-align: center; + display: block; + padding: 5px; + background-color: #fffebd; /* light yellow*/ + text-shadow: #ffffff 0 1px 0; } #focusfilter .focuscoll { - font-weight: bold; - text-shadow: #ffffff 0 1px 0; + font-weight: bold; + text-shadow: #ffffff 0 1px 0; } #focusfilter img { - bottom: -2px; - position: relative; + bottom: -2px; + position: relative; } #kindfilter { @@ -182,10 +191,9 @@ h1 { } #kindfilter > a:hover { - color: #4C4C4C; - text-decoration: none; - text-shadow: #ffffff 0 1px 0; - + color: #4C4C4C; + text-decoration: none; + text-shadow: #ffffff 0 1px 0; } #letters { @@ -208,117 +216,117 @@ h1 { } #tpl { - display: block; - position: fixed; - overflow: auto; - right: 0; - left: 0; - bottom: 0; - top: 5px; - position: absolute; - display: block; + display: block; + position: fixed; + overflow: auto; + right: 0; + left: 0; + bottom: 0; + top: 5px; + position: absolute; + display: block; } #tpl .packhide { - display: block; - float: right; - font-weight: normal; - color: white; + display: block; + float: right; + font-weight: normal; + color: white; } #tpl .packfocus { - display: block; - float: right; - font-weight: normal; - color: white; + display: block; + float: right; + font-weight: normal; + color: white; } #tpl .packages > ol { - background-color: #dadfe6; - /*margin-bottom: 5px;*/ + background-color: #dadfe6; + /*margin-bottom: 5px;*/ } /*#tpl .packages > ol > li { - margin-bottom: 1px; + margin-bottom: 1px; }*/ #tpl .packages > li > a { - padding: 0px 5px; + padding: 0px 5px; } #tpl .packages > li > a.tplshow { - display: block; - color: white; - font-weight: bold; - display: block; - text-shadow: #000000 0 1px 0; + display: block; + color: white; + font-weight: bold; + display: block; + text-shadow: #000000 0 1px 0; } #tpl ol > li.pack { - padding: 3px 5px; - background: url("packagesbg.gif"); - background-repeat:repeat-x; - min-height: 14px; - background-color: #6e808e; + padding: 3px 5px; + background: url("packagesbg.gif"); + background-repeat:repeat-x; + min-height: 14px; + background-color: #6e808e; } #tpl ol > li { - display: block; + display: block; } #tpl .templates > li { - padding-left: 5px; - min-height: 18px; + padding-left: 5px; + min-height: 18px; } #tpl ol > li .icon { - padding-right: 5px; - bottom: -2px; - position: relative; + padding-right: 5px; + bottom: -2px; + position: relative; } #tpl .templates div.placeholder { - padding-right: 5px; - width: 13px; - display: inline-block; + padding-right: 5px; + width: 13px; + display: inline-block; } #tpl .templates span.tplLink { - padding-left: 5px; + padding-left: 5px; } #content { - border-left-width: 1px; - border-left-color: black; - border-left-style: white; - right: 0px; - left: 0px; - bottom: 0px; - top: 0px; - position: fixed; - margin-left: 300px; - display: block; + border-left-width: 1px; + border-left-color: black; + border-left-style: white; + right: 0px; + left: 0px; + bottom: 0px; + top: 0px; + position: fixed; + margin-left: 300px; + display: block; } #content > iframe { - display: block; - height: 100%; - width: 100%; + display: block; + height: 100%; + width: 100%; } .ui-layout-pane { - background: #FFF; - overflow: auto; + background: #FFF; + overflow: auto; } .ui-layout-resizer { - background-image:url('filterbg.gif'); - background-repeat:repeat-x; - background-color: #ededee; /* light gray */ - border:1px solid #bbbbbb; - border-top:0; - border-bottom:0; - border-left: 0; + background-image:url('filterbg.gif'); + background-repeat:repeat-x; + background-color: #ededee; /* light gray */ + border:1px solid #bbbbbb; + border-top:0; + border-bottom:0; + border-left: 0; } .ui-layout-toggler { diff --git a/src/compiler/scala/tools/nsc/doc/html/resource/lib/index.js b/src/compiler/scala/tools/nsc/doc/html/resource/lib/index.js index b767722b8c..eb7f752440 100644 --- a/src/compiler/scala/tools/nsc/doc/html/resource/lib/index.js +++ b/src/compiler/scala/tools/nsc/doc/html/resource/lib/index.js @@ -15,10 +15,10 @@ var lastHash = ""; $(document).ready(function() { $('body').layout({ west__size: '20%' }); - $('#browser').layout({ - center__paneSelector: ".ui-west-center" + $('#browser').layout({ + center__paneSelector: ".ui-west-center" //,center__initClosed:true - ,north__paneSelector: ".ui-west-north" + ,north__paneSelector: ".ui-west-north" }); $('iframe').bind("load", function(){ var subtitle = $(this).contents().find('title').text(); @@ -260,18 +260,95 @@ function prepareEntityList() { .prepend("<a class='packfocus'>focus</a>"); } +/* Handles all key presses while scrolling around with keyboard shortcuts in left panel */ +function keyboardScrolldownLeftPane() { + scheduler.add("init", function() { + $("#textfilter input").blur(); + var $items = $("#tpl li"); + $items.first().addClass('selected'); + + $(window).bind("keydown", function(e) { + var $old = $items.filter('.selected'), + $new; + + switch ( e.keyCode ) { + + case 9: // tab + $old.removeClass('selected'); + break; + + case 13: // enter + $old.removeClass('selected'); + var $url = $old.children().filter('a:last').attr('href'); + $("#template").attr("src",$url); + break; + + case 27: // escape + $old.removeClass('selected'); + $(window).unbind(e); + $("#textfilter input").focus(); + + break; + + case 38: // up + $new = $old.prev(); + + if (!$new.length) { + $new = $old.parent().prev(); + } + + if ($new.is('ol') && $new.children(':last').is('ol')) { + $new = $new.children().children(':last'); + } else if ($new.is('ol')) { + $new = $new.children(':last'); + } + + break; + + case 40: // down + $new = $old.next(); + if (!$new.length) { + $new = $old.parent().parent().next(); + } + if ($new.is('ol')) { + $new = $new.children(':first'); + } + break; + } + + if ($new.is('li')) { + $old.removeClass('selected'); + $new.addClass('selected'); + } else if (e.keyCode == 38) { + $(window).unbind(e); + $("#textfilter input").focus(); + } + }); + }); +} + /* Configures the text filter */ function configureTextFilter() { scheduler.add("init", function() { - $("#filter").append("<div id='textfilter'><span class='pre'/><span class='input'><input type='text' accesskey='/'/></span><span class='post'/></div>"); + $("#filter").append("<div id='textfilter'><span class='pre'/><span class='input'><input id='index-input' type='text' accesskey='/'/></span><span class='post'/></div>"); printAlphabet(); var input = $("#textfilter input"); resizeFilterBlock(); - input.bind("keyup", function(event) { + input.bind("keydown", function(event) { if (event.keyCode == 27) { // escape input.attr("value", ""); } - textFilter(); + if (event.keyCode == 9) { // tab + $("#template").contents().find("#mbrsel-input").focus(); + input.attr("value", ""); + return false; + } + if (event.keyCode == 40) { // down arrow + $(window).unbind("keydown"); + keyboardScrolldownLeftPane(); + return false; + } + textFilter(); }); input.focus(function(event) { input.select(); }); }); diff --git a/src/compiler/scala/tools/nsc/doc/html/resource/lib/template.js b/src/compiler/scala/tools/nsc/doc/html/resource/lib/template.js index fd5a981cb0..33fbd83bee 100644 --- a/src/compiler/scala/tools/nsc/doc/html/resource/lib/template.js +++ b/src/compiler/scala/tools/nsc/doc/html/resource/lib/template.js @@ -25,9 +25,37 @@ $(document).ready(function(){ // Member filter box var input = $("#textfilter input"); input.bind("keyup", function(event) { - if (event.keyCode == 27) - input.val(""); // escape key - filter(true); + + switch ( event.keyCode ) { + + case 27: // escape key + input.val(""); + filter(true); + break; + + case 38: // up + input.val(""); + filter(false); + window.scrollTo(0, $("body").offset().top); + input.focus(); + break; + + case 33: //page up + input.val(""); + filter(false); + break; + + case 34: //page down + input.val(""); + filter(false); + break; + + default: + window.scrollTo(0, $("#mbrsel").offset().top); + filter(true); + break; + + } }); input.focus(function(event) { input.select(); @@ -37,13 +65,13 @@ $(document).ready(function(){ filter(); }); $(document).keydown(function(event) { - if(!event.altKey && !event.ctrlKey && - (event.keyCode == 27 || (event.keyCode >= 48 && event.keyCode <= 90)) && - document.activeElement != $("#textfilter input")[0]) { - $("#textfilter input").focus(); + + if (event.keyCode == 9) { // tab + $("#index-input", window.parent.document).focus(); + input.attr("value", ""); + return false; } }); - $("#textfilter input").focus(); $("#linearization li").click(function(){ if ($(this).hasClass("in")) { @@ -251,7 +279,8 @@ function initInherit() { }); }; -function filter(scrollToMember) { +/* filter used to take boolean scrollToMember */ +function filter() { var query = $.trim($("#textfilter input").val()).toLowerCase(); query = query.replace(/[-[\]{}()*+?.,\\^$|#]/g, "\\$&").replace(/\s+/g, "|"); var queryRegExp = new RegExp(query, "i"); @@ -327,10 +356,6 @@ function filter(scrollToMember) { members.hide(); }; - if (scrollToMember) { - window.scrollTo(0, $("#mbrsel").offset().top); - } - return false; }; |