mirror of
https://github.com/Hopiu/angular.js.git
synced 2026-03-16 23:30:23 +00:00
fix(ngdocs): remove the side search bar
BREAKING CHANGE The side search bar on the docs page has been removed in favor of the top search bar.
This commit is contained in:
Matias Niemelä
parent
06557aab44
commit
6c20ec193f
4 changed files with 31 additions and 126 deletions
|
|
@ -37,40 +37,6 @@
|
|||
opacity:1;
|
||||
}
|
||||
|
||||
.expand.ng-enter,
|
||||
.expand.ng-move,
|
||||
.expand.ng-leave {
|
||||
-webkit-transition:0.3s cubic-bezier(0.250, 0.460, 0.450, 0.940) all;
|
||||
-moz-transition:0.3s cubic-bezier(0.250, 0.460, 0.450, 0.940) all;
|
||||
-o-transition:0.3s cubic-bezier(0.250, 0.460, 0.450, 0.940) all;
|
||||
transition:0.3s cubic-bezier(0.250, 0.460, 0.450, 0.940) all;
|
||||
}
|
||||
.expand.ng-move,
|
||||
.expand.ng-enter {
|
||||
opacity:0;
|
||||
line-height:0;
|
||||
height:0!important;
|
||||
}
|
||||
.expand.ng-move.ng-move-active,
|
||||
.expand.ng-enter.ng-enter-active {
|
||||
opacity:1;
|
||||
line-height:20px;
|
||||
height:20px!important;
|
||||
}
|
||||
|
||||
.expand.ng-leave {
|
||||
opacity:1;
|
||||
height:20px;
|
||||
}
|
||||
.expand.ng-leave.ng-leave-active {
|
||||
opacity:0;
|
||||
height:0;
|
||||
}
|
||||
|
||||
.fade-in.ng-enter,
|
||||
.fade-in.ng-move,
|
||||
.fade-in.ng-hide-add,
|
||||
.fade-in.ng-hide-remove,
|
||||
.foldout.ng-enter,
|
||||
.foldout.ng-move,
|
||||
.foldout.ng-hide-add,
|
||||
|
|
@ -81,10 +47,6 @@
|
|||
transition:0.3s cubic-bezier(0.250, 0.460, 0.450, 0.940) all;
|
||||
}
|
||||
|
||||
.fade-in.ng-enter,
|
||||
.fade-in.ng-move,
|
||||
.fade-in.ng-hide-remove,
|
||||
.fade-in.ng-hide-add.ng-hide-active,
|
||||
.foldout.ng-hide-remove,
|
||||
.foldout.ng-hide-add.ng-hide-active,
|
||||
.foldout.ng-enter,
|
||||
|
|
@ -92,10 +54,6 @@
|
|||
opacity:0;
|
||||
}
|
||||
|
||||
.fade-in.ng-enter.ng-enter-active,
|
||||
.fade-in.ng-move.ng-move-active,
|
||||
.fade-in.ng-hide-remove.ng-hide-remove-active,
|
||||
.fade-in.ng-hide-add,
|
||||
.foldout.ng-move.ng-move-active,
|
||||
.foldout.ng-hide-remove.ng-hide-remove-active,
|
||||
.foldout.ng-hide-add,
|
||||
|
|
|
|||
|
|
@ -45,62 +45,62 @@
|
|||
|
||||
/* =============================== */
|
||||
|
||||
.form-search .dropdown-menu {
|
||||
.side-navigation .dropdown-menu {
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
.form-search .code {
|
||||
.side-navigation .code {
|
||||
font-family: monospace;
|
||||
font-weight: bold;
|
||||
font-size: 13px;
|
||||
color: black;
|
||||
}
|
||||
|
||||
.form-search > ul.nav > li.module {
|
||||
.side-navigation > ul.nav > li.module {
|
||||
background-color: #d3d3d3;
|
||||
}
|
||||
|
||||
.form-search > ul.nav > li.section {
|
||||
.side-navigation > ul.nav > li.section {
|
||||
background-color: #ebebeb;
|
||||
min-height: 14px;
|
||||
}
|
||||
|
||||
.form-search > ul.nav > li.last {
|
||||
.side-navigation > ul.nav > li.last {
|
||||
padding-bottom: 1em;
|
||||
}
|
||||
|
||||
.form-search > ul.nav > li.last + li.api-list-item {
|
||||
.side-navigation > ul.nav > li.last + li.api-list-item {
|
||||
margin-top:-1em;
|
||||
padding-bottom: 1em;
|
||||
}
|
||||
|
||||
.form-search .well {
|
||||
.side-navigation .well {
|
||||
border-color: #d3d3d3;
|
||||
padding-top: 0;
|
||||
padding-bottom: 0;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
.form-search .well .nav-header {
|
||||
.side-navigation .well .nav-header {
|
||||
text-transform: none;
|
||||
margin-top: 0;
|
||||
margin-left: -15px;
|
||||
margin-right: -15px;
|
||||
}
|
||||
|
||||
.form-search .well .nav-header a {
|
||||
.side-navigation .well .nav-header a {
|
||||
text-transform: none;
|
||||
color: black;
|
||||
}
|
||||
.form-search .well .nav-header a:hover {
|
||||
.side-navigation .well .nav-header a:hover {
|
||||
background-color: inherit;
|
||||
}
|
||||
|
||||
.form-search .well li {
|
||||
.side-navigation .well li {
|
||||
line-height: 14px;
|
||||
}
|
||||
|
||||
.form-search .well .guide {
|
||||
.side-navigation .well .guide {
|
||||
float: right;
|
||||
padding-top: 0;
|
||||
color: gray;
|
||||
|
|
|
|||
|
|
@ -256,38 +256,24 @@
|
|||
class="docs-version-jump">
|
||||
</select>
|
||||
</div>
|
||||
<form class="form-search" ng-submit="submitForm()">
|
||||
<div class="dropdown search"
|
||||
ng-class="{open: focused && bestMatch.rank > 0 && bestMatch.page != currentPage}">
|
||||
<input type="text" ng-model="search" placeholder="search the docs"
|
||||
tabindex="1" accesskey="s" class="input-medium search-query" />
|
||||
<ul class="dropdown-menu">
|
||||
<li>
|
||||
<a href="{{bestMatch.page.url}}">{{bestMatch.page.shortName}}</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="spacer"></div>
|
||||
<div ng-show="search">Filtered results:</div>
|
||||
|
||||
<div class="side-navigation">
|
||||
<ul class="nav nav-list" ng-hide="page">
|
||||
<li ng-repeat="page in pages track by page.url" ng-class="navClass(page)" class="expand api-list-item">
|
||||
<li ng-repeat="page in pages track by page.url" ng-class="navClass(page)" class="api-list-item">
|
||||
<a href="{{page.url}}" tabindex="2">{{page.shortName}}</a>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<ul class="nav nav-list well api-list-item fade-in" ng-repeat="namespace in namespaces track by namespace.url">
|
||||
<ul class="nav nav-list well api-list-item" ng-repeat="namespace in namespaces track by namespace.url">
|
||||
<li class="nav-header module">
|
||||
<a class="code" href="{{namespace.url}}">{{namespace.name}}</a>
|
||||
</li>
|
||||
|
||||
<li ng-repeat="page in namespace.errors track by page.url" ng-class="navClass(page)" class="expand api-list-item">
|
||||
<li ng-repeat="page in namespace.errors track by page.url" ng-class="navClass(page)" class="api-list-item">
|
||||
<a href="{{page.url}}" tabindex="2">{{page.shortName}}</a>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<ul class="nav nav-list well api-list-item fade-in" ng-repeat="module in modules track by module.url">
|
||||
<ul class="nav nav-list well api-list-item" ng-repeat="module in modules track by module.url">
|
||||
<li class="nav-header module">
|
||||
<a class="guide" href="{{URL.module}}">module</a>
|
||||
<a class="code" href="{{module.url}}">{{module.name}}</a>
|
||||
|
|
@ -296,21 +282,21 @@
|
|||
<li class="nav-header section" ng-show="module.directives">
|
||||
<a href="{{URL.directive}}" class="guide">directive</a>
|
||||
</li>
|
||||
<li ng-repeat="page in module.directives track by page.url" ng-class="navClass(page)" class="expand api-list-item">
|
||||
<li ng-repeat="page in module.directives track by page.url" ng-class="navClass(page)" class="api-list-item">
|
||||
<a href="{{page.url}}" tabindex="2">{{page.shortName}}</a>
|
||||
</li>
|
||||
|
||||
<li class="nav-header section" ng-show="module.filters">
|
||||
<a href="{{URL.filter}}" class="guide">filter</a>
|
||||
</li>
|
||||
<li ng-repeat="page in module.filters track by page.url" ng-class="navClass(page)" class="expand api-list-item">
|
||||
<li ng-repeat="page in module.filters track by page.url" ng-class="navClass(page)" class="api-list-item">
|
||||
<a href="{{page.url}}" tabindex="2">{{page.shortName}}</a>
|
||||
</li>
|
||||
|
||||
<li class="nav-header section" ng-show="module.services">
|
||||
<a href="{{URL.service}}" class="guide">service</a>
|
||||
</li>
|
||||
<li ng-repeat="service in module.services track by service.instance.url" ng-class="navClass(service.instance, service.provider)" class="api-list-item expand">
|
||||
<li ng-repeat="service in module.services track by service.instance.url" ng-class="navClass(service.instance, service.provider)" class="api-list-item">
|
||||
<a ng-show="service.provider" class="pull-right" href="{{service.provider.url}}" tabindex="2"><i class="icon-cog"></i></a>
|
||||
<a href="{{service.instance.url}}" tabindex="2">{{service.name}}</a>
|
||||
</li>
|
||||
|
|
@ -318,7 +304,7 @@
|
|||
<li class="nav-header section" ng-show="module.types">
|
||||
<a href="{{URL.type}}" class="guide">Types</a>
|
||||
</li>
|
||||
<li ng-repeat="page in module.types track by page.url" ng-class="navClass(page)" class="expand api-list-item">
|
||||
<li ng-repeat="page in module.types track by page.url" ng-class="navClass(page)" class="api-list-item">
|
||||
<a href="{{page.url}}" tabindex="2">{{page.shortName}}</a>
|
||||
</li>
|
||||
|
||||
|
|
@ -326,13 +312,13 @@
|
|||
<a href="{{URL.api}}" class="global guide">global APIs</a>
|
||||
|
||||
</li>
|
||||
<li ng-repeat="page in module.globals track by page.url" ng-class="navClass(page)" class="expand api-list-item">
|
||||
<li ng-repeat="page in module.globals track by page.url" ng-class="navClass(page)" class="api-list-item">
|
||||
<a href="{{page.url}}" tabindex="2">{{page.id}}</a>
|
||||
</li>
|
||||
|
||||
</ul>
|
||||
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="span9">
|
||||
|
|
|
|||
|
|
@ -622,10 +622,6 @@ docsApp.controller.DocsController = function($scope, $location, $window, $cookie
|
|||
};
|
||||
};
|
||||
|
||||
$scope.submitForm = function() {
|
||||
$scope.bestMatch && $location.path($scope.bestMatch.page.url);
|
||||
};
|
||||
|
||||
$scope.afterPartialLoaded = function() {
|
||||
var currentPageId = $location.path();
|
||||
$scope.partialTitle = $scope.currentPage.shortName;
|
||||
|
|
@ -660,6 +656,9 @@ docsApp.controller.DocsController = function($scope, $location, $window, $cookie
|
|||
cookbook: 'Examples',
|
||||
error: 'Error Reference'
|
||||
};
|
||||
|
||||
populateComponentsList();
|
||||
|
||||
$scope.$watch(function docsPathWatch() {return $location.path(); }, function docsPathWatchAction(path) {
|
||||
// ignore non-doc links which are used in examples
|
||||
if (DOCS_PATH.test(path)) {
|
||||
|
|
@ -675,9 +674,6 @@ docsApp.controller.DocsController = function($scope, $location, $window, $cookie
|
|||
$scope.partialTitle = 'Error: Page Not Found!';
|
||||
}
|
||||
|
||||
updateSearch();
|
||||
|
||||
|
||||
// Update breadcrumbs
|
||||
var breadcrumb = $scope.breadcrumb = [],
|
||||
match;
|
||||
|
|
@ -717,10 +713,6 @@ docsApp.controller.DocsController = function($scope, $location, $window, $cookie
|
|||
}
|
||||
});
|
||||
|
||||
$scope.$watch('search', updateSearch);
|
||||
|
||||
|
||||
|
||||
/**********************************
|
||||
Initialize
|
||||
***********************************/
|
||||
|
|
@ -752,27 +744,22 @@ docsApp.controller.DocsController = function($scope, $location, $window, $cookie
|
|||
Private methods
|
||||
***********************************/
|
||||
|
||||
function updateSearch() {
|
||||
function populateComponentsList() {
|
||||
var area = $location.path().split('/')[1];
|
||||
area = /^index-\w/.test(area) ? 'api' : area;
|
||||
var moduleCache = {},
|
||||
namespaceCache = {},
|
||||
pages = sections[$location.path().split('/')[1]],
|
||||
pages = sections[area],
|
||||
modules = $scope.modules = [],
|
||||
namespaces = $scope.namespaces = [],
|
||||
globalErrors = $scope.globalErrors = [],
|
||||
otherPages = $scope.pages = [],
|
||||
search = $scope.search,
|
||||
bestMatch = {page: null, rank:0};
|
||||
search = $scope.search;
|
||||
|
||||
angular.forEach(pages, function(page) {
|
||||
var match,
|
||||
id = page.id;
|
||||
|
||||
if (!(match = rank(page, search))) return;
|
||||
|
||||
if (match.rank > bestMatch.rank) {
|
||||
bestMatch = match;
|
||||
}
|
||||
|
||||
if (page.id == 'index') {
|
||||
//skip
|
||||
} else if (page.section != 'api') {
|
||||
|
|
@ -808,10 +795,6 @@ docsApp.controller.DocsController = function($scope, $location, $window, $cookie
|
|||
|
||||
});
|
||||
|
||||
$scope.bestMatch = bestMatch;
|
||||
|
||||
/*************/
|
||||
|
||||
function module(name) {
|
||||
var module = moduleCache[name];
|
||||
|
||||
|
|
@ -852,28 +835,6 @@ docsApp.controller.DocsController = function($scope, $location, $window, $cookie
|
|||
}
|
||||
return namespace;
|
||||
}
|
||||
|
||||
function rank(page, terms) {
|
||||
var ranking = {page: page, rank:0},
|
||||
keywords = page.keywords,
|
||||
title = page.shortName.toLowerCase();
|
||||
|
||||
terms && angular.forEach(terms.toLowerCase().split(' '), function(term) {
|
||||
var index;
|
||||
|
||||
if (ranking) {
|
||||
if (keywords.indexOf(term) == -1) {
|
||||
ranking = null;
|
||||
} else {
|
||||
ranking.rank ++; // one point for each term found
|
||||
if ((index = title.indexOf(term)) != -1) {
|
||||
ranking.rank += 20 - index; // ten points if you match title
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
return ranking;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
|
|
|||
Loading…
Reference in a new issue