ashatora/openlayers
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Introduces apidoc changes

Browse Source 
- Removes modules from the apidoc navigation
- Adds a weight paramater to the search to be
more accurate on searchresults
This commit is contained in:
Kai Volland
2019-09-27 17:25:01 +02:00
parent b045e4ee5b
commit d08c0baff9
4 changed files with 200 additions and 150 deletions
Download Patch File Download Diff File Expand all files Collapse all files

62
config/jsdoc/api/template/publish.js
View File

@@ -215,39 +215,39 @@ function buildNav(members) {
return 0; return 0;
}); });
function createEntry(type, v) {
return {
type: type,
longname: v.longname,
name: v.name,
classes: find({
kind: 'class',
memberof: v.longname
}).map(createEntry.bind(this, 'class')),
members: find({
kind: 'member',
memberof: v.longname
}),
methods: find({
kind: 'function',
memberof: v.longname
}),
typedefs: find({
kind: 'typedef',
memberof: v.longname
}),
events: find({
kind: 'event',
memberof: v.longname
})
};
}
_.each(merged, function(v) { _.each(merged, function(v) {
// exclude interfaces from sidebar // exclude interfaces from sidebar
if (v.interface !== true) { if (v.interface !== true && v.kind === 'class') {
if (v.kind == 'module') { nav.push({
nav.push(createEntry('module', v)); type: 'class',
} longname: v.longname,
prettyname: v.longname
.substring(0, v.longname.indexOf('~'))
.replace('module:', '')
.replace('ol/', ''),
name: v.name,
module: find({
kind: 'module',
longname: v.memberof
})[0],
members: find({
kind: 'member',
memberof: v.longname
}),
methods: find({
kind: 'function',
memberof: v.longname
}),
typedefs: find({
kind: 'typedef',
memberof: v.longname
}),
fires: v.fires,
events: find({
kind: 'event',
memberof: v.longname
})
});
} }
}); });
return nav; return nav;

237
config/jsdoc/api/template/static/scripts/main.js
View File

@@ -1,121 +1,158 @@
$(function () { $(function () {
// Search Items // Search Items
$('#search').on('keyup', function (e) { $('#include_modules').change(function (e) {
var value = $(this).val(); console.log('change');
var $el = $('.navigation'); if ($(this).is(':checked')) {
if (value) { } else {
var regexp = new RegExp(value, 'i');
$el.find('li, .itemMembers').hide();
$el.find('li').each(function (i, v) { }
var $item = $(v); });
if ($item.data('name') && regexp.test($item.data('name'))) { var getSearchWeight = function (searchTerm, $matchedItem) {
const container = $item.parent().parent().parent(); let weight = 0;
container.show(); // We could get smarter on the weight here
container.closest('.itemMembers').show(); if ($matchedItem.data('shortname')
container.closest('.item').show(); && $matchedItem.data('shortname').toLowerCase() === searchTerm.toLowerCase()) {
$item.show(); weight++;
$item.closest('.itemMembers').show(); }
$item.closest('.item').show(); return weight;
} };
});
} else { // sort function callback
$el.find('.item, .itemMembers').hide(); var weightSorter = function (a, b) {
$('.navigation>ul>li').show(); var aW = $(a).data('weight') || 0;
var bW = $(b).data('weight') || 0;
return bW - aW;
};
// Search Items
$('#search').on('keyup', function (e) {
var value = $(this).val();
var $el = $('.navigation');
if (value && value.length > 1) {
var regexp = new RegExp(value, 'i');
$el.find('li, .itemMembers').hide();
$el.find('li').each(function (i, v) {
const $item = $(v);
const name = $item.data('name');
if (name && regexp.test(name)) {
const $classEntry = $item.closest('.item');
const $members = $item.closest('.itemMembers');
// Do the weight thing
$classEntry.removeData('weight');
$classEntry.show();
const weight = getSearchWeight(value, $classEntry);
$classEntry.data('weight', weight);
$members.show();
$classEntry.show();
$item.show();
} }
});
$el.find('.list').scrollTop(0); $(".navigation ul.list li.item:visible")
}); .sort(weightSorter) // sort elements
.appendTo(".navigation ul.list"); // append again to the list
// Toggle when click an item element } else {
$('.navigation').on('click', '.title', function (e) { $el.find('.item, .itemMembers').show();
$(this).parent().find('.itemMembers').toggle();
});
// Show an item related a current documentation automatically
var filename = $('.page-title').data('filename')
.replace(/\.[a-z]+$/, '')
.replace('module-', 'module:')
.replace(/_/g, '/')
.replace(/-/g, '~');
var $currentItem = $('.navigation .item[data-name*="' + filename + '"]:eq(0)');
if ($currentItem.length) {
$currentItem
.remove()
.prependTo('.navigation .list')
.show()
.find('.itemMembers')
.show();
} }
// Auto resizing on navigation $el.find('.list').scrollTop(0);
var _onResize = function () { });
var height = $(window).height();
var $el = $('.navigation');
$el.height(height).find('.list').height(height - 133); // Toggle when click an item element
}; $('.navigation').on('click', '.title', function (e) {
$(this).parent().find('.itemMembers').toggle();
});
$(window).on('resize', _onResize); // Show an item related a current documentation automatically
_onResize(); var filename = $('.page-title').data('filename')
.replace(/\.[a-z]+$/, '')
.replace('module-', 'module:')
.replace(/_/g, '/')
.replace(/-/g, '~');
var $currentItem = $('.navigation .item[data-name*="' + filename + '"]:eq(0)');
var currentVersion = document.getElementById('package-version').innerHTML; if ($currentItem.length) {
$currentItem
.remove()
.prependTo('.navigation .list')
.show()
.find('.itemMembers')
.show();
}
// warn about outdated version // Auto resizing on navigation
var packageUrl = 'https://raw.githubusercontent.com/openlayers/openlayers.github.io/build/package.json'; var _onResize = function () {
fetch(packageUrl).then(function(response) { var height = $(window).height();
return response.json(); var $el = $('.navigation');
}).then(function(json) {
var latestVersion = json.version; $el.height(height).find('.list').height(height - 133);
document.getElementById('latest-version').innerHTML = latestVersion; };
var url = window.location.href;
var branchSearch = url.match(/\/([^\/]*)\/apidoc\//); $(window).on('resize', _onResize);
var cookieText = 'dismissed=-' + latestVersion + '-'; _onResize();
var dismissed = document.cookie.indexOf(cookieText) != -1;
if (!dismissed && /^v[0-9\.]*$/.test(branchSearch[1]) && currentVersion != latestVersion) { var currentVersion = document.getElementById('package-version').innerHTML;
var link = url.replace(branchSearch[0], '/latest/apidoc/');
fetch(link, {method: 'head'}).then(function(response) { // warn about outdated version
var a = document.getElementById('latest-link'); var packageUrl = 'https://raw.githubusercontent.com/openlayers/openlayers.github.io/build/package.json';
a.href = response.status == 200 ? link : '../../latest/apidoc/'; fetch(packageUrl).then(function(response) {
}); return response.json();
var latestCheck = document.getElementById('latest-check'); }).then(function(json) {
latestCheck.style.display = ''; var latestVersion = json.version;
document.getElementById('latest-dismiss').onclick = function() { document.getElementById('latest-version').innerHTML = latestVersion;
latestCheck.style.display = 'none'; var url = window.location.href;
document.cookie = cookieText; var branchSearch = url.match(/\/([^\/]*)\/apidoc\//);
} var cookieText = 'dismissed=-' + latestVersion + '-';
var dismissed = document.cookie.indexOf(cookieText) != -1;
if (!dismissed && /^v[0-9\.]*$/.test(branchSearch[1]) && currentVersion != latestVersion) {
var link = url.replace(branchSearch[0], '/latest/apidoc/');
fetch(link, {method: 'head'}).then(function(response) {
var a = document.getElementById('latest-link');
a.href = response.status == 200 ? link : '../../latest/apidoc/';
});
var latestCheck = document.getElementById('latest-check');
latestCheck.style.display = '';
document.getElementById('latest-dismiss').onclick = function() {
latestCheck.style.display = 'none';
document.cookie = cookieText;
} }
}); }
});
// create source code links to github // create source code links to github
var srcLinks = $('div.tag-source'); var srcLinks = $('div.tag-source');
srcLinks.each(function(i, el) { srcLinks.each(function(i, el) {
var textParts = el.innerHTML.trim().split(', '); var textParts = el.innerHTML.trim().split(', ');
var link = 'https://github.com/openlayers/openlayers/blob/v' + currentVersion + '/src/ol/' + var link = 'https://github.com/openlayers/openlayers/blob/v' + currentVersion + '/src/ol/' +
textParts[0]; textParts[0];
el.innerHTML = '<a href="' + link + '">' + textParts[0] + '</a>, ' + el.innerHTML = '<a href="' + link + '">' + textParts[0] + '</a>, ' +
'<a href="' + link + textParts[1].replace('line ', '#L') + '">' + '<a href="' + link + textParts[1].replace('line ', '#L') + '">' +
textParts[1] + '</a>'; textParts[1] + '</a>';
}); });
// Highlighting current anchor // Highlighting current anchor
var anchors = $('.anchor'); var anchors = $('.anchor');
var _onHashChange = function () { var _onHashChange = function () {
var activeHash = window.document.location.hash var activeHash = window.document.location.hash
.replace(/\./g, '\\.') // Escape dot in element id .replace(/\./g, '\\.') // Escape dot in element id
.replace(/\~/g, '\\~'); // Escape tilde in element id .replace(/\~/g, '\\~'); // Escape tilde in element id
anchors.removeClass('highlighted'); anchors.removeClass('highlighted');
if (activeHash.length > 0) { if (activeHash.length > 0) {
anchors.filter(activeHash).addClass('highlighted'); anchors.filter(activeHash).addClass('highlighted');
} }
}; };
$(window).on('hashchange', _onHashChange); $(window).on('hashchange', _onHashChange);
_onHashChange(); _onHashChange();
}); });

23
config/jsdoc/api/template/static/styles/jaguar.css
View File

@@ -36,7 +36,7 @@
.navbar-inverse .navbar-nav>li>a:hover, .navbar-inverse .navbar-nav>li>a:hover,
.navbar-inverse .navbar-nav>li>a:focus, .navbar-inverse .navbar-nav>li>a:focus,
.navbar-inverse .navbar-nav>li>a.active .navbar-inverse .navbar-nav>li>a.active
{ {
outline:0; outline:0;
color: #fff; color: #fff;
background-color: #268591; background-color: #268591;
@@ -106,6 +106,15 @@ li {
.navigation .applicationName a { .navigation .applicationName a {
color: #fff; color: #fff;
} }
.navigation .include-modules {
color: #e1e1e1;
float: right;
font-size: 0.75em;
padding: 5px 15px;
}
.navigation .include-modules input {
vertical-align: text-bottom;
}
.navigation .search { .navigation .search {
padding: 10px 15px; padding: 10px 15px;
} }
@@ -125,6 +134,11 @@ li {
padding-bottom: 8px; padding-bottom: 8px;
border-bottom: 1px solid #333; border-bottom: 1px solid #333;
} }
.navigation li.perfect-match {
border: 5px solid orange;
}
.navigation li.item a { .navigation li.item a {
color: #bbb; color: #bbb;
} }
@@ -158,6 +172,12 @@ li {
color: #1F6B75; color: #1F6B75;
display: block; display: block;
} }
.navigation li.item .modulelink {
position: relative;
font-size: 0.75em;
padding-left: 5px;
top: -5px;
}
.navigation li.item ul > li { .navigation li.item ul > li {
font-size: 0.75em; font-size: 0.75em;
padding-left: 8px; padding-left: 8px;
@@ -165,6 +185,7 @@ li {
} }
.navigation li.item .itemMembers { .navigation li.item .itemMembers {
display: none; display: none;
padding-left: 8px;
} }
.main { .main {
padding: 20px 20px; padding: 20px 20px;

28
config/jsdoc/api/template/tmpl/navigation.tmpl
View File

@@ -1,7 +1,7 @@
<?js <?js
var self = this; var self = this;
function toShortName(name) { function toShortName(name) {
return name.indexOf('module:') === 0 ? name.split('/').pop() : name; return name.indexOf('module:') === 0 ? name.split('/').pop() : name;
} }
?> ?>
<div class="navigation"> <div class="navigation">
@@ -10,29 +10,21 @@ function toShortName(name) {
</div> </div>
<ul class="list"> <ul class="list">
<?js <?js
let navbuilder; this.nav.forEach(function (item) {
this.nav.forEach(navbuilder = function (item) {
?> ?>
<li class="item" data-name="<?js= item.longname ?>"> <li class="item" data-name="<?js= item.longname ?>" data-shortname="<?js= item.name.toLowerCase() ?>">
<span class="title"> <span class="title">
<?js= self.linkto(item.longname, item.type === 'module' ? item.longname.replace('module:', '') : item.name) ?> <?js= self.linkto(item.longname, item.prettyname) ?>
<?js if (item.type === 'namespace' && <?js if (item.type === 'namespace' &&
(item.members.length + item.typedefs.length + item.methods.length + (item.members.length + item.typedefs.length + item.methods.length +
item.events.length > 0)) { ?> item.events.length > 0)) { ?>
<?js } ?> <?js } ?>
</span> </span>
<ul class="members itemMembers"> <?js if (item.module && item.module.longname) { ?>
<?js <span class="modulelink">
if (item.classes.length) { <?js= self.linkto(item.module.longname, '↳ module') ?>
?> </span>
<span class="subtitle">Classes</span> <?js } ?>
<?js
item.classes.forEach(function (v) {
navbuilder(v);
});
}
?>
</ul>
<ul class="members itemMembers"> <ul class="members itemMembers">
<?js <?js
if (item.members.length) { if (item.members.length) {