Skip to content

Commit 36392bc

Browse files
savetheclocktowersavetheclocktower
committed
Major overhaul of the API docs template. Tested in Firefox and Safari. Expect it to look awful in other browsers right now.
1 parent a00a574 commit 36392bc

20 files changed

+1223
-281
lines changed

‎output/.gitignore

+2
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
*
2+
!.gitignore

‎templates/html/application.js.erb

+71-20
Original file line numberDiff line numberDiff line change
@@ -19,28 +19,79 @@ PDoc.HighlightOptions = {
1919
}
2020
};
2121

22-
document.observe('dom:loaded', function() {
23-
function navigate(name) {
24-
if(name in PDoc.elements) {
25-
window.location = PDoc.pathPrefix + PDoc.elements[name];
26-
PDoc.highlightSelected();
22+
var Filterer = Class.create({
23+
initialize: function(element, options) {
24+
this.element = $(element);
25+
this.options = Object.extend({
26+
interval: 0.1,
27+
resultsElement: '.search-results'
28+
}, options || {});
29+
30+
this.menu = this.options.menu;
31+
this.links = this.menu.select('a');
32+
33+
this.resultsElement = this.menu.down(this.options.resultsElement);
34+
35+
this.events = {
36+
filter: this.filter.bind(this)
37+
};
38+
39+
this.menu.setStyle({ opacity: 0.9 });
40+
this.addObservers();
41+
},
42+
43+
addObservers: function() {
44+
this.element.observe('keyup', this.events.filter);
45+
},
46+
47+
filter: function(event) {
48+
console.log(event.keyCode);
49+
50+
if (event.keyCode && event.keyCode === Event.KEY_ESC) {
51+
this.element.value = '';
52+
this.onEmpty();
53+
}
54+
55+
var value = $F(this.element).strip().toLowerCase();
56+
var urls = this.findURLs(value);
57+
var match = function(elem) {
58+
return urls.any( function(url) { return elem.href.include(url); });
59+
};
60+
61+
var matchingLinks = this.links.select(match);
62+
if (matchingLinks.length === 0) {
63+
this.onEmpty();
64+
return;
2765
}
28-
}
29-
var search = $('search');
30-
search.observe('focus', function() { this.select() });
31-
search.up('form').observe('submit', function(event) {
32-
event.stop();
33-
navigate(search.getValue());
34-
});
66+
67+
this.buildResults(matchingLinks);
68+
},
69+
70+
buildResults: function(links) {
71+
this.resultsElement.update();
72+
var ul = new Element('ul');
73+
links.each( function(link) {
74+
ul.insert(link.cloneNode(true).wrap('li'));
75+
}, this);
76+
this.resultsElement.insert(ul);
77+
this.resultsElement.show();
78+
},
3579

36-
new Autocompleter.Local('search', 'search_list', Object.keys(PDoc.elements), {
37-
fullSearch: true,
38-
partialChars: 1,
39-
minChars: 1,
40-
afterUpdateElement: function(element) {
41-
navigate(element.getValue());
80+
findURLs: function(str) {
81+
var results = [];
82+
for (var i in PDoc.elements) {
83+
if (i.toLowerCase().include(str)) results.push(PDoc.elements[i]);
4284
}
43-
});
85+
return results;
86+
},
87+
88+
onEmpty: function() {
89+
this.resultsElement.hide();
90+
}
91+
});
92+
93+
document.observe('dom:loaded', function() {
94+
new Filterer($('search'), { menu: $('api_menu') });
4495
});
4596

4697
document.observe('click', function(event) {
@@ -52,4 +103,4 @@ document.observe('click', function(event) {
52103
element.highlight(PDoc.HighlightOptions);
53104
});
54105

55-
document.observe('dom:loaded', PDoc.highlightSelected);
106+
document.observe('dom:loaded', PDoc.highlightSelected);;

‎templates/html/assets/images/header-logo-small.png

4.03 KB
Loading

‎templates/html/assets/images/header-logo.png

18 KB
Loading

‎templates/html/assets/images/header-stripe-small.png

1.61 KB
Loading

‎templates/html/assets/images/header-stripe.png

3.93 KB
Loading

‎templates/html/assets/images/tagline.png

1.92 KB
Loading

‎templates/html/assets/javascripts/mouse_enter_leave.js

+36
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
/*
2+
* Fires "mouse:enter" and "mouse:leave" events as a substitute for the
3+
* "mouseenter" and "mouseleave" events. Simulates, in effect, the behavior
4+
* of the CSS ":hover" pseudoclass.
5+
*/
6+
7+
8+
(function() {
9+
function respondToMouseOver(event) {
10+
var target = event.originalTarget;
11+
// console.log("mouse:enter", "target:", target,
12+
// "relatedTarget:", event.relatedTarget);
13+
if (event.relatedTarget && !event.relatedTarget.descendantOf(target))
14+
target.fire("mouse:enter", { relatedTarget: event.relatedTarget });
15+
}
16+
17+
function respondToMouseOut(event) {
18+
var target = event.originalTarget;
19+
if (event.relatedTarget && !event.relatedTarget.descendantOf(target))
20+
target.fire("mouse:leave", { relatedTarget: event.relatedTarget });
21+
}
22+
23+
24+
if (Prototype.Browser.IE) {
25+
document.observe("mouseenter", function(event) {
26+
event.element().fire("mouse:enter", { relatedTarget: event.relatedTarget });
27+
});
28+
document.observe("mouseleave", function(event) {
29+
event.element().fire("mouse:leave", { relatedTarget: event.relatedTarget });
30+
});
31+
} else {
32+
document.observe("mouseover", respondToMouseOver);
33+
document.observe("mouseout", respondToMouseOut);
34+
}
35+
36+
})();

‎templates/html/assets/javascripts/prototype.js

+7-2
Original file line numberDiff line numberDiff line change
@@ -1865,8 +1865,13 @@ Element.Methods = {
18651865
element = $(element), ancestor = $(ancestor);
18661866
var originalAncestor = ancestor;
18671867

1868-
if (element.compareDocumentPosition)
1869-
return (element.compareDocumentPosition(ancestor) & 8) === 8;
1868+
if (element.compareDocumentPosition) {
1869+
try {
1870+
return (element.compareDocumentPosition(ancestor) & 8) === 8;
1871+
} catch(e) {
1872+
if (!e.startsWith('Permission denied')) throw e;
1873+
}
1874+
}
18701875

18711876
if (element.sourceIndex && !Prototype.Browser.Opera) {
18721877
var e = element.sourceIndex, a = ancestor.sourceIndex,

‎templates/html/assets/stylesheets/api.css

+108
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,108 @@
1+
h1, h2, h3, h4, h5, h6 {
2+
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
3+
margin: 0;
4+
padding: 0;
5+
}
6+
7+
pre {
8+
padding: 0;
9+
}
10+
11+
code {
12+
font-family: Monaco, "Bitstream Vera Sans Mono", "Lucida Console", monospace;
13+
font-size: 13px;
14+
}
15+
16+
div#masthead {
17+
background: url(../images/header-stripe-small.png) repeat-x top left;
18+
height: 76px;
19+
}
20+
21+
div#masthead div#masthead_content {
22+
margin: 0 auto;
23+
width: 835px;
24+
position: relative;
25+
}
26+
27+
div#masthead h1#logo {
28+
background: url(../images/header-logo-small.png) no-repeat 0 1px;
29+
width: 118px;
30+
height: 76px;
31+
position: relative;
32+
left: 60px;
33+
}
34+
35+
36+
37+
#api {
38+
width: 840px;
39+
margin: 20px auto;
40+
position: relative;
41+
}
42+
43+
#api h2 {
44+
font-size: 22px;
45+
padding-left: 65px;
46+
}
47+
48+
#api h3, h4, h5, h6 {
49+
padding-left: 5px;
50+
}
51+
52+
53+
#api .section {
54+
overflow: hidden;
55+
padding-left: 65px;
56+
padding-bottom: 0;
57+
margin: 5px 0 0;
58+
}
59+
60+
#api .section h3 {
61+
position: absolute;
62+
left: -60px;
63+
width: 110px;
64+
text-align: right;
65+
font-size: 14px;
66+
color: #999;
67+
}
68+
69+
#api .section h4 {
70+
font-size: 15px;
71+
color: #444;
72+
margin: 0.4em 0 0.3em;
73+
}
74+
75+
#api p, #api pre {
76+
margin: 0 0 1.1em;
77+
}
78+
79+
#api pre {
80+
background-color: #000;
81+
color: #fff;
82+
padding: 5px 10px;
83+
}
84+
85+
#api pre.syntax {
86+
background-color: #CEE8C3;
87+
color: #000;
88+
padding: 3px 5px;
89+
}
90+
91+
#api .section p.purpose {
92+
background-color: #CDE0FB;
93+
padding: 3px 5px;
94+
}
95+
96+
#api .section p {
97+
padding: 0 5px;
98+
}
99+
100+
#api ul, #api ol {
101+
padding-left: 5px;
102+
margin: 10px 0;
103+
}
104+
105+
#api ul, #api ul li {
106+
list-style-type: disc;
107+
}
108+

‎templates/html/assets/stylesheets/grid.css

+13
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
body.grid {
2+
width: 955px;
3+
margin: auto;
4+
}
5+
6+
body.grid div#page {
7+
overflow: hidden;
8+
background: url(http://prototype.conio.net/new/images/grid-55-5.png);
9+
}
10+
11+
body.grid div#page * {
12+
opacity: .9;
13+
}

0 commit comments

Comments
 (0)