Skip to content
Browse files

Major overhaul of the API docs template. Tested in Firefox and Safari…

…. Expect it to look awful in other browsers right now.
  • Loading branch information...
1 parent a00a574 commit 36392bc0b36792318d3082449eb19ff538bdfd0e @savetheclocktower savetheclocktower committed Apr 12, 2008
View
2 output/.gitignore
@@ -0,0 +1,2 @@
+*
+!.gitignore
View
91 templates/html/application.js.erb
@@ -19,28 +19,79 @@ PDoc.HighlightOptions = {
}
};
-document.observe('dom:loaded', function() {
- function navigate(name) {
- if(name in PDoc.elements) {
- window.location = PDoc.pathPrefix + PDoc.elements[name];
- PDoc.highlightSelected();
+var Filterer = Class.create({
+ initialize: function(element, options) {
+ this.element = $(element);
+ this.options = Object.extend({
+ interval: 0.1,
+ resultsElement: '.search-results'
+ }, options || {});
+
+ this.menu = this.options.menu;
+ this.links = this.menu.select('a');
+
+ this.resultsElement = this.menu.down(this.options.resultsElement);
+
+ this.events = {
+ filter: this.filter.bind(this)
+ };
+
+ this.menu.setStyle({ opacity: 0.9 });
+ this.addObservers();
+ },
+
+ addObservers: function() {
+ this.element.observe('keyup', this.events.filter);
+ },
+
+ filter: function(event) {
+ console.log(event.keyCode);
+
+ if (event.keyCode && event.keyCode === Event.KEY_ESC) {
+ this.element.value = '';
+ this.onEmpty();
+ }
+
+ var value = $F(this.element).strip().toLowerCase();
+ var urls = this.findURLs(value);
+ var match = function(elem) {
+ return urls.any( function(url) { return elem.href.include(url); });
+ };
+
+ var matchingLinks = this.links.select(match);
+ if (matchingLinks.length === 0) {
+ this.onEmpty();
+ return;
}
- }
- var search = $('search');
- search.observe('focus', function() { this.select() });
- search.up('form').observe('submit', function(event) {
- event.stop();
- navigate(search.getValue());
- });
+
+ this.buildResults(matchingLinks);
+ },
+
+ buildResults: function(links) {
+ this.resultsElement.update();
+ var ul = new Element('ul');
+ links.each( function(link) {
+ ul.insert(link.cloneNode(true).wrap('li'));
+ }, this);
+ this.resultsElement.insert(ul);
+ this.resultsElement.show();
+ },
- new Autocompleter.Local('search', 'search_list', Object.keys(PDoc.elements), {
- fullSearch: true,
- partialChars: 1,
- minChars: 1,
- afterUpdateElement: function(element) {
- navigate(element.getValue());
+ findURLs: function(str) {
+ var results = [];
+ for (var i in PDoc.elements) {
+ if (i.toLowerCase().include(str)) results.push(PDoc.elements[i]);
}
- });
+ return results;
+ },
+
+ onEmpty: function() {
+ this.resultsElement.hide();
+ }
+});
+
+document.observe('dom:loaded', function() {
+ new Filterer($('search'), { menu: $('api_menu') });
});
document.observe('click', function(event) {
@@ -52,4 +103,4 @@ document.observe('click', function(event) {
element.highlight(PDoc.HighlightOptions);
});
-document.observe('dom:loaded', PDoc.highlightSelected);
+document.observe('dom:loaded', PDoc.highlightSelected);;
View
BIN templates/html/assets/images/header-logo-small.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
BIN templates/html/assets/images/header-logo.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
BIN templates/html/assets/images/header-stripe-small.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
BIN templates/html/assets/images/header-stripe.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
BIN templates/html/assets/images/tagline.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
36 templates/html/assets/javascripts/mouse_enter_leave.js
@@ -0,0 +1,36 @@
+/*
+ * Fires "mouse:enter" and "mouse:leave" events as a substitute for the
+ * "mouseenter" and "mouseleave" events. Simulates, in effect, the behavior
+ * of the CSS ":hover" pseudoclass.
+ */
+
+
+(function() {
+ function respondToMouseOver(event) {
+ var target = event.originalTarget;
+ // console.log("mouse:enter", "target:", target,
+ // "relatedTarget:", event.relatedTarget);
+ if (event.relatedTarget && !event.relatedTarget.descendantOf(target))
+ target.fire("mouse:enter", { relatedTarget: event.relatedTarget });
+ }
+
+ function respondToMouseOut(event) {
+ var target = event.originalTarget;
+ if (event.relatedTarget && !event.relatedTarget.descendantOf(target))
+ target.fire("mouse:leave", { relatedTarget: event.relatedTarget });
+ }
+
+
+ if (Prototype.Browser.IE) {
+ document.observe("mouseenter", function(event) {
+ event.element().fire("mouse:enter", { relatedTarget: event.relatedTarget });
+ });
+ document.observe("mouseleave", function(event) {
+ event.element().fire("mouse:leave", { relatedTarget: event.relatedTarget });
+ });
+ } else {
+ document.observe("mouseover", respondToMouseOver);
+ document.observe("mouseout", respondToMouseOut);
+ }
+
+})();
View
9 templates/html/assets/javascripts/prototype.js
@@ -1865,8 +1865,13 @@ Element.Methods = {
element = $(element), ancestor = $(ancestor);
var originalAncestor = ancestor;
- if (element.compareDocumentPosition)
- return (element.compareDocumentPosition(ancestor) & 8) === 8;
+ if (element.compareDocumentPosition) {
+ try {
+ return (element.compareDocumentPosition(ancestor) & 8) === 8;
+ } catch(e) {
+ if (!e.startsWith('Permission denied')) throw e;
+ }
+ }
if (element.sourceIndex && !Prototype.Browser.Opera) {
var e = element.sourceIndex, a = ancestor.sourceIndex,
View
108 templates/html/assets/stylesheets/api.css
@@ -0,0 +1,108 @@
+h1, h2, h3, h4, h5, h6 {
+ font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
+ margin: 0;
+ padding: 0;
+}
+
+pre {
+ padding: 0;
+}
+
+code {
+ font-family: Monaco, "Bitstream Vera Sans Mono", "Lucida Console", monospace;
+ font-size: 13px;
+}
+
+div#masthead {
+ background: url(../images/header-stripe-small.png) repeat-x top left;
+ height: 76px;
+}
+
+div#masthead div#masthead_content {
+ margin: 0 auto;
+ width: 835px;
+ position: relative;
+}
+
+div#masthead h1#logo {
+ background: url(../images/header-logo-small.png) no-repeat 0 1px;
+ width: 118px;
+ height: 76px;
+ position: relative;
+ left: 60px;
+}
+
+
+
+#api {
+ width: 840px;
+ margin: 20px auto;
+ position: relative;
+}
+
+ #api h2 {
+ font-size: 22px;
+ padding-left: 65px;
+ }
+
+ #api h3, h4, h5, h6 {
+ padding-left: 5px;
+ }
+
+
+ #api .section {
+ overflow: hidden;
+ padding-left: 65px;
+ padding-bottom: 0;
+ margin: 5px 0 0;
+ }
+
+ #api .section h3 {
+ position: absolute;
+ left: -60px;
+ width: 110px;
+ text-align: right;
+ font-size: 14px;
+ color: #999;
+ }
+
+ #api .section h4 {
+ font-size: 15px;
+ color: #444;
+ margin: 0.4em 0 0.3em;
+ }
+
+ #api p, #api pre {
+ margin: 0 0 1.1em;
+ }
+
+ #api pre {
+ background-color: #000;
+ color: #fff;
+ padding: 5px 10px;
+ }
+
+ #api pre.syntax {
+ background-color: #CEE8C3;
+ color: #000;
+ padding: 3px 5px;
+ }
+
+#api .section p.purpose {
+ background-color: #CDE0FB;
+ padding: 3px 5px;
+}
+
+#api .section p {
+ padding: 0 5px;
+}
+
+#api ul, #api ol {
+ padding-left: 5px;
+ margin: 10px 0;
+}
+
+#api ul, #api ul li {
+ list-style-type: disc;
+}
+
View
13 templates/html/assets/stylesheets/grid.css
@@ -0,0 +1,13 @@
+body.grid {
+ width: 955px;
+ margin: auto;
+}
+
+body.grid div#page {
+ overflow: hidden;
+ background: url(http://prototype.conio.net/new/images/grid-55-5.png);
+}
+
+body.grid div#page * {
+ opacity: .9;
+}
View
116 templates/html/assets/stylesheets/highlighter.css
@@ -0,0 +1,116 @@
+/* See license.txt for terms of usage */
+
+.firebugHighlight {
+ z-index: 2147483647;
+ position: absolute;
+ background-color: #3875d7;
+}
+
+.firebugLayoutBoxParent {
+ z-index: 2147483647;
+ position: absolute;
+ border-right: 1px dashed #BBBBBB;
+ border-bottom: 1px dashed #BBBBBB;
+}
+
+.firebugRulerH {
+ position: absolute;
+ top: -15px;
+ left: 0;
+ width: 100%;
+ height: 14px;
+ background: url(chrome://firebug/skin/rulerH.png) repeat-x;
+ border-top: 1px solid #BBBBBB;
+ border-right: 1px dashed #BBBBBB;
+ border-bottom: 1px solid #000000;
+}
+
+.firebugRulerV {
+ position: absolute;
+ top: 0;
+ left: -15px;
+ width: 14px;
+ height: 100%;
+ background: url(chrome://firebug/skin/rulerV.png) repeat-y;
+ border-left: 1px solid #BBBBBB;
+ border-right: 1px solid #000000;
+ border-bottom: 1px dashed #BBBBBB;
+}
+
+.overflowRulerX > .firebugRulerV {
+ left: 0;
+}
+
+.overflowRulerY > .firebugRulerH {
+ top: 0;
+}
+
+/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
+
+.firebugLayoutBoxOffset {
+ z-index: 2147483647;
+ position: absolute;
+ opacity: 0.8;
+}
+
+.firebugLayoutBoxMargin {
+ background-color: #EDFF64;
+}
+
+.firebugLayoutBoxBorder {
+ background-color: #666666;
+}
+
+.firebugLayoutBoxPadding {
+ background-color: SlateBlue;
+}
+
+.firebugLayoutBoxContent {
+ background-color: SkyBlue;
+}
+
+/*.firebugHighlightGroup .firebugLayoutBox {
+ background-color: transparent;
+}
+
+.firebugHighlightBox {
+ background-color: Blue !important;
+}*/
+
+.firebugLayoutLine {
+ z-index: 2147483647;
+ background-color: #000000;
+ opacity: 0.4;
+}
+
+.firebugLayoutLineLeft,
+.firebugLayoutLineRight {
+ position: fixed;
+ width: 1px;
+ height: 100%;
+}
+
+.firebugLayoutLineTop,
+.firebugLayoutLineBottom {
+ position: absolute;
+ width: 100%;
+ height: 1px;
+}
+
+.firebugLayoutLineTop {
+ margin-top: -1px;
+ border-top: 1px solid #999999;
+}
+
+.firebugLayoutLineRight {
+ border-right: 1px solid #999999;
+}
+
+.firebugLayoutLineBottom {
+ border-bottom: 1px solid #999999;
+}
+
+.firebugLayoutLineLeft {
+ margin-left: -1px;
+ border-left: 1px solid #999999;
+}
View
557 templates/html/assets/stylesheets/main.css
@@ -1,209 +1,404 @@
body {
- font-family: Verdana, sans-serif;
- font-size:100%;
- line-height:1.125em;
+ font-family: Verdana, sans-serif;
}
-a:link {
- color: #000;
-}
-a:visited {
- color: #000;
-}
-a:hover {
- color: #000;
-}
-a:focus {
- color: #000;
-}
-a:active {
- color: #000;
+form {
+ margin: 0;
+ padding: 0;
}
-.deprecated,
-a.deprecated code {
- color: #999;
- text-decoration: line-through;
+a {
+ color: #036;
+ text-decoration: none;
}
-a.deprecated {
- text-decoration: none;
-}
-
-/* --- HEADER --- */
+ p a {
+ border-bottom: 1px solid #999;
+ padding: 0 1px;
+ }
-#header {
- zoom: 1;
-}
+ p a:hover {
+ background-color: #036;
+ color: #fff;
+ border-bottom: 1px solid #036;
+ }
-#header:after {
- content: ".";
- display: block;
- height: 0;
- clear: both;
- visibility: hidden;
-}
-
-/* --- SEARCH --- */
-
-#search {
- width: 300px;
- float: right;
-}
-
-#search_list {
- font: 13px monospace;
- position: absolute;
- width: 400px;
- background-color: #fff;
- border: 1px solid #888;
- margin: 0;
- padding: 0;
-}
-
-#search_list ul {
- list-style-type: none;
- margin: 0;
- padding: 0;
-}
-
-#search_list ul li.selected {
- background-color: #b5d5ff;
-}
-
-#search_list ul li {
- margin: 0;
- padding: 2px;
- height: 13px;
- cursor: pointer;
-}
-
-/* --- LOGO --- */
-
-#header h1 {
- float: left;
- size: 250px;
-}
-
-/* --- MAIN --- */
-
-#main {
- width: 100%;
- zoom: 1;
-}
-
-#main:after {
- content: ".";
- display: block;
- height: 0;
- clear: both;
- visibility: hidden;
-}
-
-/* --- CONTENT --- */
-
-#content {
- font-size: 0.875em;
- float: right;
- width: 75%;
-}
-
-#content h1 {
- font-size: 1.5em;
- height: 34px;
- border-bottom: 2px solid #000;
- margin-bottom: 18px;
-}
-
-#content h1 span {
- font-size: 0.75em;
-}
-
-#content ul.method-list {
- zoom: 1;
-}
-
-#content ul.method-list:after {
- content: ".";
- display: block;
- height: 0;
- clear: both;
- visibility: hidden;
-}
-
-#content ul.method-list li {
- float: left;
- margin-right: 1em;
-}
-
-/* --- CODE HIGHLIGTHING --- */
-
-pre {
- background: #f7f7f7;
- padding: 10px;
- font-size: 90%;
- line-height: 130%;
+h1, h2, h3, h4, h5, h6 {
+ font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
+ margin: 0;
+ padding: 0;
}
pre {
- overflow: auto;
+ padding: 0;
}
-pre code {
- font-family: Monaco, Consolas, "Lucida Console", monospace;
- font-size: 92%;
+code {
+ font-family: Monaco, "Bitstream Vera Sans Mono", "Lucida Console", monospace;
+ font-size: 11px;
}
-.html .tag {
- color:#3344AA /*#BB7711*/
+div#masthead {
+ background: url(../images/header-stripe-small.png) repeat-x top left;
+ height: 76px;
}
-.html .attribute {
- color:#BB7711
+div#masthead div#masthead_content {
+ margin: 0 auto;
+ width: 835px;
+ position: relative;
}
-.keywords {
- color: #f71;
-}
-.comment {
- color: #517;
-}
-.string {
- color: #392;
-}
-.regex {
- background: #D0F0FF;
- color: #27b;
+div#masthead h1#logo {
+ background: url(../images/header-logo-small.png) no-repeat 0 1px;
+ width: 118px;
+ height: 76px;
+ position: relative;
+ left: 60px;
}
-.global {
- color: blue;
-}
-/* --- SIDEBAR --- */
+#main {
+ width: 840px;
+ margin: 20px auto;
+ position: relative;
+}
+
+ #main h2 {
+ color: #444;
+ font-size: 22px;
+ padding-left: 69px;
+ margin-top: 0;
+ }
+
+ #main h2 span {
+ color: #ccc;
+ display: block;
+ text-transform: uppercase;
+ font-size: 13px;
+ margin-bottom: -10px;
+ padding-left: 2px;
+ }
+
+ #main h2 a {
+ color: #444;
+ text-decoration: none;
+ }
+
+ #main h2 a:hover {
+ color: #222;
+ border-bottom: 1px solid #999;
+ }
+
+ #main h4, h5, h6 {
+ padding-left: 4px;
+ }
+
+ #main li h4,
+ #main li h5,
+ #main li h6 {
+ padding-left: 0;
+ }
+
+ #main h4.inherited {
+ color: #888 !important;
+ }
+
+
+ #main .section {
+ overflow: hidden;
+ padding-left: 65px;
+ padding-bottom: 0;
+ margin: 5px 0 0;
+ }
+
+ #main .section h3 {
+ position: absolute;
+ left: -60px;
+ width: 110px;
+ text-align: right;
+ font-size: 13px;
+ padding-top: 3px;
+ color: #999;
+ line-height: 100%;
+ }
+
+ #main .section h4 {
+ font-size: 15px;
+ color: #444;
+ margin: 0 0 0.3em;
+ }
+
+ #main .section h4.inherited {
+ color: #888;
+ }
+
+ #main .section h4.inherited a {
+ color: #49B;
+ }
+
+ #main p {
+ margin: 0 0 1.1em;
+ }
+
+ #main pre {
+ background-color: #000;
+ color: #fff;
+ padding: 5px 10px;
+ margin: 0 0 5px;
+ }
+
+ #main pre.syntax {
+ background-color: #f5f5f5;
+ color: #000;
+ padding: 3px 5px;
+ }
+
+#main .section p.purpose {
+ background-color: #CDE0FB;
+ padding: 3px 5px;
+}
+
+#main .section p {
+ padding: 0 5px;
+}
+
+#main ul, #main ol {
+ padding-left: 5px;
+ margin: 0 0 10px;
+}
+
+#main ul, #main ul li {
+ list-style-type: none;
+}
+
+
+#main #excerpt p {
+ color: #000;
+ border-left: 3px solid #bbb;
+ padding: 0;
+ margin-left: -10px;
+ font-size: 94%;
+ padding-left: 10px;
+}
+
+#main .meta {
+ position: absolute;
+ width: 108px;
+ left: -60px;
+ text-align: right;
+ font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
+ font-size: 14px;
+ font-weight: bold;
+ color: #888;
+}
+
+
+
+#comments {
+}
+
+ #comments h3, #comment-form-cnt h3 {
+ font-size: 19px;
+ margin: 1.0em 0 0.5em 65px;
+ }
+
+ #comments ol, #comments ol li {
+ list-style-type: none;
+ }
+
+ #comments .cmt {
+ position: relative;
+ margin-left: 50px;
+ margin-bottom: 15px;
+ min-height: 80px;
+ border-left: 3px solid #bbb;
+ }
+
+ #comments .cmt cite {
+ display: block;
+ width: 110px;
+ position: absolute;
+ left: -120px;
+ top: 0;
+ text-align: right;
+ font-style: normal;
+ font-size: 14px;
+ font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
+ }
+
+ #comments .cmt cite a {
+ text-decoration: none;
+ color: #666;
+ font-weight: bold;
+ }
+
+ #comments .cmt .cdate {
+ display: block;
+ width: 110px;
+ position: absolute;
+ left: -120px;
+ top: 1.9em;
+ line-height: 120%;
+ font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
+ font-size: 12px;
+ text-align: right;
+ color: #555;
+ }
+
+ #comments .cmt .cbody {
+ padding-left: 10px;
+ }
+
+ .cmt-anchor { display: none; }
+
+#comment-form-cnt form {
+ padding-left: 70px;
+}
+
+ #comment-form-cnt h3 {
+ margin-left: 0;
+ padding-left: 0;
+ }
+
+#comment-form-cnt dl {
+ position: relative;
+ margin-left: -70px;
+ padding-left: 70px;
+ min-height: 21em;
+}
+
+ #comment-form-cnt dt {
+ width: 110px;
+ position: absolute;
+ left: -60px;
+ text-align: right;
+ font-size: 14px;
+ font-weight: bold;
+ color: #555;
+ font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
+ }
+
+ #comment-form-cnt dd {
+ height: 2.5em;
+ padding-left: 0;
+ margin-left: 0;
+ }
+
+#comment-form input.text,
+#comment-form textarea {
+ border: 1px solid #888;
+}
+
+.btns input {
+ font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
+ font-size: 120%;
+ background-color: #eee;
+ border: 2px solid #444;
+ font-weight: bold;
+ padding: 3px 5px;
+}
+
+
+/* SIDEBAR */
#sidebar {
- font-size: 0.875em;
- width: 25%;
- float: left;
+ width: 200px;
+ position: absolute;
+ right: 0;
+ top: 130px;
}
#sidebar ul {
- margin-left: 15px;
-}
-
-#sidebar a.current,
-#sidebar a.current-parent {
- display: block;
- background-color: #f3f3f3;
-}
-
-#sidebar a.current {
- background-color: #e4e4e4;
-}
-
-/* --- FOOTER --- */
-
-#footer {
- font-size: 0.75em;
-}
+ margin-left: 15px;
+}
+
+ #sidebar li .section {
+ display: block;
+ font-weight: bold;
+ font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
+ text-transform: uppercase;
+ border-bottom: 2px solid #ddd;
+ color: #666;
+ }
+
+ #sidebar li {
+ margin: 0;
+ padding: 0;
+ }
+
+/* MENU */
+
+#menu {
+ width: 840px;
+ margin: 0 auto;
+ position: relative;
+ height: 25px;
+}
+
+#menu div {
+ width: 234px;
+ float: right;
+ margin-right: 3px;
+}
+
+#menu h2 {
+ font-size: 13px;
+ font-weight: normal;
+}
+
+ #menu h2 a {
+ display: block;
+ text-align: center;
+ background-color: #CDE0FB;
+ font-family: Verdana, sans-serif;
+ padding: 2px 6px;
+ }
+
+ #menu h2 a:hover {
+ background-color: #a4c8fb;
+ }
+
+ #menu #api_menu {
+ border: 1px solid #ddd;
+ background: #fff;
+ position: absolute;
+ right: 3px;
+ width: 232px;
+ top: 23px;
+ z-index: 1500;
+ }
+
+ #menu #api_menu li {
+ background-color: #fff;
+ }
+
+ #menu #api_menu li a {
+ display: block;
+ color: #333;
+ background-color: #fff;
+ padding: 2px 6px;
+ }
+
+ #menu #api_menu li a:hover {
+ background-color: #eee;
+ }
+
+ #menu #api_menu .search-field {
+ padding: 5px 6px;
+ background-color: #cee8c3;
+ }
+
+ #menu #api_menu input {
+ border: 1px solid #bbb;
+ }
+
+ #menu #api_menu ul {
+ margin: 0;
+ padding: 0;
+ }
+
+ #menu #api_menu .search-results {
+ padding: 0 0 5px;
+ border-bottom: 2px solid #ddd;
+ }
View
316 templates/html/assets/stylesheets/screen.css
@@ -0,0 +1,316 @@
+body {
+ background: #fff;
+ margin: 0;
+ padding: 0;
+ color: #333;
+}
+
+ul, li, p, h1, h2, h3, h4 {
+ margin: 0;
+ padding: 0;
+ font-family: Verdana, sans-serif;
+ font-size: 13px;
+ line-height: 150%;
+}
+
+li {
+ list-style-type: none;
+}
+
+
+/* Link bar */
+
+div#links {
+ margin: 0 auto;
+ width: 835px;
+ padding: 16px 0;
+ height: 16px;
+ overflow: hidden;
+}
+
+div#links_wrapper {
+ background: #fff;
+}
+
+div#links li {
+ display: inline;
+}
+
+div#links li a {
+ color: #666;
+}
+
+div#links li.selected a {
+ color: #000;
+ font-weight: bold;
+ text-decoration: none;
+}
+
+ul#internal_links {
+ float: left;
+}
+
+ul#internal_links li {
+ margin-right: 25px;
+}
+
+ul#external_links {
+ float: right;
+}
+
+ul#external_links li {
+ margin-left: 25px;
+ padding-left: 21px;
+}
+
+li#scripty_link {
+ background: url(http://prototype.conio.net/new/images/link-logo-scripty.png) no-repeat center left;
+}
+
+li#rails_link {
+ background: url(http://prototype.conio.net/new/images/link-logo-rails.png) no-repeat center left;
+}
+
+
+/* Masthead */
+
+div#masthead {
+ background: url(http://prototype.conio.net/new/images/header-stripe.png) repeat-x top left;
+ height: 152px;
+}
+
+div#masthead div#masthead_content {
+ margin: 0 auto;
+ width: 835px;
+ position: relative;
+}
+
+div#masthead h1#logo {
+ background: url(http://prototype.conio.net/new/images/header-logo.png) no-repeat 0 1px;
+ width: 236px;
+ height: 152px;
+}
+
+div#masthead div#pitch {
+ position: absolute;
+ background: url(http://prototype.conio.net/new/images/header-copy.png) no-repeat 0 1px;
+ top: 0;
+ left: 300px;
+ width: 535px;
+ height: 152px;
+}
+
+div#masthead h1#logo *,
+div#masthead div#pitch * {
+ display: none;
+}
+
+
+/* Buttons */
+
+div#buttons, div#more {
+ overflow: hidden;
+ width: 840px;
+ margin: -1px auto 0 auto;
+ padding: 0 0 0 5px;
+}
+
+div#more {
+ margin-top: 35px;
+}
+
+div#buttons li {
+ display: block;
+ float: left;
+ border-top: 1px solid #929fb3;
+ margin: 0 5px 0 0;
+ width: 175px;
+ height: 100px;
+}
+
+div#more li {
+ height: 50px;
+}
+
+div#buttons li a {
+ display: block;
+ position: relative;
+ width: 175px;
+ height: 100px;
+ text-decoration: none;
+ background: #cde0fb no-repeat center 30px;
+}
+
+div#buttons li a:hover {
+ background-color: #a4c8fb;
+}
+
+div#buttons li a span.title {
+ display: none;
+}
+
+div#buttons li a span.description {
+ position: absolute;
+ display: block;
+ width: 175px;
+ top: 55px;
+ text-align: center;
+ color: #666;
+}
+
+div#more li a span.title {
+ position: absolute;
+ display: block;
+ width: 175px;
+ top: 15px;
+ text-align: center;
+ color: #666;
+}
+
+div#buttons li a:hover span.description {
+ color: #333;
+}
+
+div#buttons li#download_button {
+ width: 295px;
+}
+
+div#buttons li#download_button a,
+div#buttons li#download_button a span.description {
+ width: 295px;
+}
+
+div#buttons li#download_button a {
+ background-color: #cee8c3;
+ background-image: url(http://prototype.conio.net/new/images/button-download.png);
+}
+
+div#buttons li#download_button a:hover {
+ background-color: #a4e289;
+}
+
+div#buttons li#learn_button a {
+ background-image: url(http://prototype.conio.net/new/images/button-learn.png);
+}
+
+div#buttons li#discuss_button a {
+ background-image: url(http://prototype.conio.net/new/images/button-discuss.png);
+}
+
+div#buttons li#contribute_button a {
+ background-image: url(http://prototype.conio.net/new/images/button-contribute.png);
+}
+
+div#more {
+ position: relative;
+ height: 400px;
+ margin: 15px 60px;
+ color: #444;
+}
+
+ div#more .column {
+ display: block;
+ float: left;
+ margin: 0 5px 0 0;
+ padding-left: 5px;
+ min-height: 300px;
+ }
+
+ div#more h3 {
+ font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
+ letter-spacing: -1px;
+ font-weight: bold;
+ color: #444;
+ font-size: 18px;
+ margin: 0 0 5px;
+ }
+
+.column {
+ width: 175px;
+}
+
+.wide-column {
+ width: 295px;
+}
+
+.medium-column {
+ width: 235px;
+}
+
+.main-column {
+ width: 530px;
+}
+
+.sidebar-column {
+ width: 290px;
+}
+
+div#more {
+ width: 840px;
+ margin: 25px auto 0;
+}
+
+/*#buttons_wrapper {
+ background-color: #0E4FAF;
+}
+
+#page {
+ background-color: #292929;
+}
+*/
+
+div#more div.main-column p {
+ font-size: 16px;
+ margin-right: 10px;
+}
+
+div#more h3.tagline {
+ height: 23px;
+ background: url(../images/tagline.png) no-repeat top left;
+ width: 530px;
+}
+
+ div#more h3.tagline span { display: none; }
+
+.view-master {
+ text-align: center;
+ font-family: Verdana;
+ color: #ccc;
+ font-size: 18px;
+ padding: 35px 0;
+ margin: 10px 0;
+}
+
+.using-prototype {
+ border-top: 2px solid #ddd;
+ border-bottom: 2px solid #ddd;
+ margin: 25px 10px 10px 0;
+ padding: 5px 0;
+}
+
+.sidebar-column h4 {
+ font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
+ font-size: 14px;
+ font-weight: bold;
+ margin: 0;
+}
+
+.sidebar-column p {
+ margin-bottom: 15px;
+}
+
+ol, ol li {
+ list-style-type: decimal;
+ line-height: 160%;
+}
+
+ ol li {
+ margin: 0 0 2px;
+ }
+
+ol, ul {
+ margin: 0 0 15px;
+ padding-left: 0;
+ font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
+}
+
View
6 templates/html/index.erb
@@ -1,5 +1,7 @@
<% @title = "Home" %>
-<h1>Prototype API</h1>
+<h2>Prototype API</h2>
-<p>Welcome to the new Prototype documentation.</p>
+<div class="section">
+ <p>Welcome to the Prototype API Documentation.</p>
+</div> <!-- .section -->
View
130 templates/html/layout.erb
@@ -1,38 +1,98 @@
-<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
- "http://www.w3.org/TR/html4/strict.dtd">
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+ <head>
+ <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+ <title>Prototype API documentation | <%= @title %></title>
+ <meta name="generator" content="PDoc" />
+
+ <%= javascript_include_tag "prototype", "effects", "controls" %>
+ <%= javascript_include_tag "application", "code_highlighter" %>
+ <%= stylesheet_link_tag "screen", "grid", "highlighter", "main" %>
+
+ <script type="text/javascript" charset="utf-8">
+ function menuButtonMouseOver(event) {
+ var menuButton = $('api_menu_button');
+ var target = event.element();
+ if (target === menuButton || target.descendantOf(menuButton)) {
+ $('api_menu').show();
+ }
+ }
+
+ function menuButtonMouseOut(event) {
+ var menuButton = $('api_menu_button');
+ var menu = $('api_menu');
+ var target = event.element(), related = event.relatedTarget;
+
+ if (related === menu || related.descendantOf(menu)) return;
+ menu.hide();
+ }
+
+ function menuMouseOut(event) {
+ var menu = $('api_menu'), related = event.relatedTarget;
+ if (related && !related.descendantOf(menu)) {
+ arguments.callee.timer = Element.hide.delay(0.5, menu);
+ } else {
+ window.clearTimeout(arguments.callee.timer)
+ }
+ }
+
+ document.observe('dom:loaded', function() {
+ $('api_menu_button').observe('mouseover', menuButtonMouseOver);
+ $('api_menu_button').observe('mouseout', menuButtonMouseOut);
+
+ $('api_menu').observe('mouseout', menuMouseOut);
+ });
+ </script>
+
+ <script type="text/javascript" charset="utf-8">PDoc.pathPrefix = '<%= path_prefix %>';</script>
+ </head>
+ <body class="">
+ <div id="page">
+ <div id="links_wrapper">
+ <div id="links">
+ <ul id="internal_links">
+ <li class="selected"><a href="#">Home</a></li>
+ <li><a href="#">Documentation</a></li>
+ <li><a href="#">Weblog</a></li>
+ </ul>
+ <ul id="external_links">
+ <li id="scripty_link"><a href="http://script.aculo.us/">script.aculo.us</a></li>
+ <li id="rails_link"><a href="http://www.rubyonrails.org/">Ruby on Rails</a></li>
+ </ul>
+ </div> <!-- #links -->
+ </div> <!-- #links_wrapper -->
+
+ <div id="masthead">
+ <div id="masthead_content">
+ <h1 onclick="with (document.body) className = className ? '' : 'grid'" id="logo"><span>Prototype JavaScript framework</span></h1>
+ </div> <!-- #masthead_content -->
+ </div> <!-- #masthead -->
+
+ <div id="menu">
+ <div>
+ <h2><a href="#" id="api_menu_button">Menu &darr;</a></h2>
+
+ <ul id="api_menu" style="display: none">
+ <li class="search-field">
+ <form>
+ <label>Search <input type="text" id="search" size="20" /></label>
+ </form>
+ </li>
+ <li class="search-results" style="display: none"></li>
+ <% @root.sections.each do |section| %>
+ <%= menu(section) %>
+ <% end %>
+ </ul>
+ </div>
+ </div> <!-- #menu -->
+
+ <div id="main">
+
+ <%= @content_for_layout %>
+
+ </div> <!-- #main -->
+
+ </div> <!-- #page -->
-<html lang="en">
-<head>
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
- <title>Prototype API documentation | <%= @title %></title>
- <meta name="generator" content="PDoc">
- <%= javascript_include_tag "prototype", "effects", "controls", "application", "code_highlighter" %>
- <%= stylesheet_link_tag "reset", "main" %>
- <script type="text/javascript" charset="utf-8">PDoc.pathPrefix = '<%= path_prefix %>';</script>
-</head>
-<body>
- <div id="header">
- <h1><a href="<%= path_prefix %>index.html"><%= img_tag("logo.png", :alt => "Prototype API Documentation") %></a></h1>
- <form action="" method="get" accept-charset="utf-8">
- <div><input type="text" value="search" id="search"></div>
- <div id="search_list"></div>
- </form>
- </div>
- <div id="main">
- <div id="content">
- <%= @content_for_layout %>
- </div>
- <div id="sidebar">
- <ul>
- <% @root.sections.each do |section| %>
- <%= menu(section) %>
- <% end %>
- </ul>
- </div>
- </div>
- <div id="footer">
- <p>&copy; 2006-<%= Time.now.year %> Prototype Core Team | Licenses:
- <a rel="license" href="http://dev.rubyonrails.org/browser/spinoffs/prototype/trunk/LICENSE?format=raw">MIT (source code)</a> and <a rel="license" href="http://creativecommons.org/licenses/by-sa/3.0/"><abbr title="Creative Commons Attribution-Share Alike 3.0 License">CC BY-SA</abbr> (documentation)</a>.</p>
- </div>
</body>
</html>
View
109 templates/html/namespace.erb
@@ -1,57 +1,90 @@
-<% @title = "#{@doc_instance.full_name} (#{@doc_instance.type})" %>
+<% d = @doc_instance %>
-<h1 class="<%= class_names_for(@doc_instance) %>"><%= @doc_instance.full_name %> <span>(<%= @doc_instance.type %>)</span></h1>
+<% @title = "#{d.full_name} (#{d.type})" %>
+<h2 class="<%= class_names_for(d) %>">
+ <span><%= d.type %></span>
+ <%= d.full_name %>
+</h2>
+
+
+<% # Is it a CLASS? %>
<% if @doc_instance.is_a?(Documentation::Klass) %>
+
<% if @doc_instance.superklass %>
- <p>Superclass: <%= auto_link(@doc_instance.superklass, false) %></p>
+ <div class="section">
+ <h3>Superclass</h3>
+ <p><%= auto_link(d.superklass, false) %></p>
+ </div> <!-- .section -->
<% end %>
+
<% unless @doc_instance.subklasses.empty? %>
- <p>Subclasses: <%= @doc_instance.subklasses.map {|subklass| auto_link(subklass, false) }.join(", ") %></p>
+ <div class="section">
+ <h3>Subclasses</h3>
+ <p><%= d.subklasses.map { |s| auto_link(s, false) }.join(', ') %></p>
+ </div> <!-- .section -->
<% end %>
+
<% end %>
+<% # Does it have MIXINS? %>
<% unless @doc_instance.mixins.empty? %>
- <p>Includes: <%= @doc_instance.mixins.map {|mixin| auto_link(mixin, false) }.join(", ") %></p>
+ <div class="section">
+ <h3>Includes</h3>
+ <p><%= d.mixins.map { |m| auto_link(m, false) }.join(', ') %></p>
+ </div> <!-- .section -->
<% end %>
-<h2>Methods</h2>
-<ul class="method-list">
- <% @doc_instance.all_methods.each do |method| %>
- <li><%= auto_link(method, true, :class => class_names_for(method)) %></li>
- <% end %>
-</ul>
-
-<% unless @doc_instance.mixins.empty? %>
- <% @doc_instance.mixins.each do |mixin| %>
- <h3>Methods inherited from <%= auto_link(mixin) %>:</h3>
- <ul class="method-list">
+<div class="section">
+ <h3>Methods</h3>
+
+ <ul class="method-list">
+ <% d.all_methods.each do |method| %>
+ <li><%= auto_link(method, true, :class => class_names_for(method)) %></li>
+ <% end %>
+ </ul>
+
+ <% unless @doc_instance.mixins.empty? %>
+ <% d.mixins.each do |mixin| %>
+ <h4 class="inherited">Inherited from <%= auto_link(mixin) %></h4>
+ <ul class="method-list">
<% mixin.all_methods.each do |method| %>
<li><%= auto_link(method, true, :class => class_names_for(method)) %></li>
<% end %>
- </ul>
- <% end %>
-<% end %>
+ </ul>
+ <% end %>
+ <% end %>
+</div> <!-- .section -->
-<% if @doc_instance.is_a?(Documentation::Klass) && @doc_instance.constructor %>
- <h2>Constructor</h2>
- <h3 id="<%= dom_id(@doc_instance.constructor) %>"><code><%= @doc_instance.constructor.full_name %></code></h3>
+<% if d.is_a?(Documentation::Klass) && d.constructor %>
+<div class="section">
+ <h3>Constructor</h3>
+ <p>
+ <pre id="<%= dom_id(d.constructor) %>" class="syntax"><code><%= d.constructor.full_name %></code></pre>
+ </p>
+</div> <!-- .section -->
<% end %>
-<%
- {
- :constants => "Constants",
- :klass_methods => "Class methods",
- :klass_properties => "Class properties",
- :instance_methods => "Instance methods",
- :instance_properties => "Instance properties"
- }.each do |method, title| %>
- <% methods = @doc_instance.send(method)
- unless methods.empty? %>
- <h2><%= title %></h2>
- <ul>
- <%= include "partials/short_description", :collection => methods %>
- </ul>
- <% end %>
- <% end %>
+
+<%
+types = {
+ :constants => "Constants",
+ :klass_methods => "Class methods",
+ :klass_properties => "Class properties",
+ :instance_methods => "Instance methods",
+ :instance_properties => "Instance properties"
+}
+%>
+
+<% types.each do |method, title| %>
+ <% methods = d.send(method) %>
+ <% unless methods.empty? %>
+ <div class="section">
+ <h3><%= title %></h3>
+ <ul>
+ <%= include "partials/short_description", :collection => methods %>
+ </ul>
+ </div> <!-- .section -->
+ <% end %>
+<% end %>
View
7 templates/html/partials/short_description.erb
@@ -1,3 +1,8 @@
-<li><h3 id="<%= dom_id(object) %>"><code><%= object.name %></code></h3>
+<li><h4 id="<%= dom_id(object) %>"><%= object.name %></h4>
+
+ <% if object.is_a?(Documentation::Method) %>
+ <pre class="syntax"><code class="ebnf"><%= object.ebnf_expressions %></code></pre>
+ <% end %>
+
<%= htmlize(object.description) %>
</li>
View
2 templates/html/section.erb
@@ -1,4 +1,4 @@
<% @title = "#{@doc_instance.full_name} section" %>
-<h1><%= @doc_instance.name %></h1>
+<h2><%= @doc_instance.name %></h2>
View
2 templates/html/utility.erb
@@ -1,4 +1,4 @@
<% @title = "#{@doc_instance.full_name} utility" %>
-<h1><%= @doc_instance.name %></h1>
+<h2><%= @doc_instance.name %></h2>

0 comments on commit 36392bc

Please sign in to comment.
Something went wrong with that request. Please try again.