Updated Search widget

Migrated from 3rd party search service swiftype to open source SOLR due to cost increase.

Change-Id: I57a2b56430c9cf088964c3c48a21144127a01e8c
This commit is contained in:
Sebastian Marcet 2018-07-18 15:10:29 -03:00
parent 77efa0615d
commit 81e6a8ced0
24 changed files with 137 additions and 338 deletions

View File

@ -132,9 +132,9 @@ Here are a few representative files under ``www/``:
* ``script_footer.tmpl``
* ``script_search.tmpl``
* ``series_status.tmpl``
* ``swiftype_search_install.tmpl``
* ``swiftype_search_mobile.tmpl``
* ``swiftype_search.tmpl``
* ``os_search_install.tmpl``
* ``os_search_mobile.tmpl``
* ``os_search.tmpl``
* ``training_guides.tmpl``
* ``user_guides.tmpl``

View File

@ -18,7 +18,7 @@
<a href="#docs-main-body" class="overview-btn docs-btn">Anleitungen lesen <i class="fa fa-arrow-circle-o-down"></i></a>
<a href="https://www.openstack.org/software/start/" class="overview-btn docs-btn">OpenStack holen <i class="fa fa-arrow-circle-o-right"></i></a>
<a href="https://www.openstack.org/marketplace/training" class="overview-btn docs-btn">Trainieren <i class="fa fa-arrow-circle-o-right"></i></a>
{% include 'templates/swiftype_search.tmpl' %}
{% include 'templates/os_search.tmpl' %}
</div>
<div class="col-lg-4 col-md-4 col-sm-4 superuser-wrapper">
<div id="superuser-img"></div>

View File

@ -18,7 +18,7 @@
<a href="#docs-main-body" class="overview-btn docs-btn">Consulter les manuels <i class="fa fa-arrow-circle-o-down"></i></a>
<a href="https://www.openstack.org/software/start/" class="overview-btn docs-btn">Obtenir OpenStack <i class="fa fa-arrow-circle-o-right"></i></a>
<a href="https://www.openstack.org/marketplace/training" class="overview-btn docs-btn">Se former <i class="fa fa-arrow-circle-o-right"></i></a>
{% include 'templates/swiftype_search.tmpl' %}
{% include 'templates/os_search.tmpl' %}
</div>
<div class="col-lg-4 col-md-4 col-sm-4 superuser-wrapper">
<div id="superuser-img"></div>

View File

@ -18,7 +18,7 @@
<a href="#docs-main-body" class="overview-btn docs-btn">Melihat Dokumen <i class="fa fa-arrow-circle-o-down"></i></a>
<a href="https://www.openstack.org/software/start/" class="overview-btn docs-btn">Mendapatkan OpenStack <i class="fa fa-arrow-circle-o-right"></i></a>
<a href="https://www.openstack.org/marketplace/training" class="overview-btn docs-btn">Mendapatkan Pelatihan <i class="fa fa-arrow-circle-o-right"></i></a>
{% include 'templates/swiftype_search.tmpl' %}
{% include 'templates/os_search.tmpl' %}
</div>
<div class="col-lg-4 col-md-4 col-sm-4 superuser-wrapper">
<div id="superuser-img"></div>

View File

@ -18,7 +18,7 @@
<a href="#docs-main-body" class="overview-btn docs-btn">ドキュメントの参照 <i class="fa fa-arrow-circle-o-down"></i></a>
<a href="https://www.openstack.org/software/start/" class="overview-btn docs-btn">OpenStack の取得 <i class="fa fa-arrow-circle-o-right"></i></a>
<a href="https://www.openstack.org/marketplace/training" class="overview-btn docs-btn">トレーニングの受講 <i class="fa fa-arrow-circle-o-right"></i></a>
{% include 'templates/swiftype_search.tmpl' %}
{% include 'templates/os_search.tmpl' %}
</div>
<div class="col-lg-4 col-md-4 col-sm-4 superuser-wrapper">
<div id="superuser-img"></div>

View File

@ -18,7 +18,7 @@
<a href="#docs-main-body" class="overview-btn docs-btn">문서보기 <i class="fa fa-arrow-circle-o-down"></i></a>
<a href="https://www.openstack.org/software/start/" class="overview-btn docs-btn">OpenStack 시작하기 <i class="fa fa-arrow-circle-o-right"></i></a>
<a href="https://www.openstack.org/marketplace/training" class="overview-btn docs-btn">배우기 <i class="fa fa-arrow-circle-o-right"></i></a>
{% include 'templates/swiftype_search.tmpl' %}
{% include 'templates/os_search.tmpl' %}
</div>
<div class="col-lg-4 col-md-4 col-sm-4 superuser-wrapper">
<div id="superuser-img"></div>

View File

@ -18,7 +18,7 @@
<a href="#docs-main-body" class="overview-btn docs-btn">Anleitungen lesen <i class="fa fa-arrow-circle-o-down"></i></a>
<a href="https://www.openstack.org/software/start/" class="overview-btn docs-btn">OpenStack holen <i class="fa fa-arrow-circle-o-right"></i></a>
<a href="https://www.openstack.org/marketplace/training" class="overview-btn docs-btn">Trainieren <i class="fa fa-arrow-circle-o-right"></i></a>
{% include 'templates/swiftype_search.tmpl' %}
{% include 'templates/os_search.tmpl' %}
</div>
<div class="col-lg-4 col-md-4 col-sm-4 superuser-wrapper">
<div id="superuser-img"></div>

View File

@ -18,7 +18,7 @@
<a href="#docs-main-body" class="overview-btn docs-btn">Anleitungen lesen <i class="fa fa-arrow-circle-o-down"></i></a>
<a href="https://www.openstack.org/software/start/" class="overview-btn docs-btn">OpenStack holen <i class="fa fa-arrow-circle-o-right"></i></a>
<a href="https://www.openstack.org/marketplace/training" class="overview-btn docs-btn">Trainieren <i class="fa fa-arrow-circle-o-right"></i></a>
{% include 'templates/swiftype_search.tmpl' %}
{% include 'templates/os_search.tmpl' %}
</div>
<div class="col-lg-4 col-md-4 col-sm-4 superuser-wrapper">
<div id="superuser-img"></div>

View File

@ -18,7 +18,7 @@
<a href="#docs-main-body" class="overview-btn docs-btn">Anleitungen lesen <i class="fa fa-arrow-circle-o-down"></i></a>
<a href="https://www.openstack.org/software/start/" class="overview-btn docs-btn">OpenStack holen <i class="fa fa-arrow-circle-o-right"></i></a>
<a href="https://www.openstack.org/marketplace/training" class="overview-btn docs-btn">Trainieren <i class="fa fa-arrow-circle-o-right"></i></a>
{% include 'templates/swiftype_search.tmpl' %}
{% include 'templates/os_search.tmpl' %}
</div>
<div class="col-lg-4 col-md-4 col-sm-4 superuser-wrapper">
<div id="superuser-img"></div>

View File

@ -752,25 +752,6 @@ span.message {
font-weight: bold;
color: #CE332C; }
.gsc-control-cse {
padding: 0px !important; }
#gcse {
width: 100%;
height: 60px; }
input.gsc-search-button, input.gsc-search-button:hover, input.gsc-search-button:focus {
background: #C43422 !important;
border: none !important; }
table.gsc-search-box td {
padding: 0px !important; }
.gsc-input-box {
border-color: #D3E9EF !important; }
.gs-visibleUrl, .gs-visibleUrl-long {
color: #A5A5A5 !important; }
.roundedButton-margin {
margin-left: 5px; }
@ -1031,175 +1012,6 @@ i.fa-caret-right {
height: 3px;
border-radius: 3px; }
.search-container {
position: relative;
display: none;
float: left;
width: 84%; }
@media (min-width: 768px) and (max-width: 1200px) {
.search-container
{
width: 80%;
}
}
@media (max-width: 767px), only screen and (max-device-width: 1024px) {
.search-container
{
display: none;
}
}
.search-icon {
display: none;
padding: 17px 20px 16px;
float: left;
text-transform: uppercase;
color: #8a959e;
font-size: 12px;
font-weight: 400;
}
.search-icon:hover {
cursor: pointer;
color: #8a959e;
}
.search-icon i {
margin-right: 5px;
color: #8a959e;
}
@media (max-width: 767px), only screen and (max-device-width: 1024px) {
.search-icon
{
display: none !important;
}
}
@media (max-width: 1040px) {
.header-search-text
{
display: none;
}
}
@media (max-width: 767px), only screen and (max-device-width: 1024px) {
.header-search-form
{
display: none;
}
.custom-search-box
{
position: relative !important;
left: 0px !important;;
}
}
.custom-search-box {
color: #30739C !important;
font-size: 12px !important;
text-transform: lowercase !important;
font-weight: 400 !important;
width: 100% !important;
}
.custom-search-box-mobile
{
display: none !important;
position: relative;
width: 100% !important;
}
@media (max-width: 767px), only screen and (max-device-width: 1024px) {
.custom-search-box-mobile
{
display: block !important;
}
.custom-search-box {
display: none !important;
}
}
.header-search, .custom-search-box, .custom-search-box-mobile {
border: 2px solid #dae5ee !important;
border-radius: 4px !important;
height: 37px !important;
margin: 7px 0 0 0 !important;
padding: 0 !important;
padding-left: 10px !important;
background: #fff !important;
width: 100% !important;
-webkit-transition: width 4s !important;
transition: width 4s !important;
-webkit-border-horizontal-spacing: 0 !important;
-webkit-border-vertical-spacing: 0 !important;
}
.header-search contenteditable .custom-search-box-mobile:hover, .custom-search-box-mobile:focus, .custom-search-box:hover, .custom-search-box:focus {
box-shadow: none !important;
}
.header-search::-webkit-input-placeholder, .custom-search-box::-webkit-input-placeholder,custom-search-box-mobile::-webkit-input-placeholder {
color: #C0CDDB;
font-size: 12px;
text-transform: lowercase;
font-weight: 400;
}
.header-search:-moz-placeholder, .custom-search-box-mobile:-moz-placeholder, custom-search-box:-moz-placeholder {
/* Firefox 18- */
color: #C0CDDB;
font-size: 12px;
text-transform: lowercase;
font-weight: 400;
}
.header-search::-moz-placeholder, .custom-search-box::-moz-placeholder, custom-search-box-mobile::-moz-placeholder {
/* Firefox 19+ */
color: #C0CDDB;
font-size: 12px;
text-transform: lowercase;
font-weight: 400; }
.header-search:-ms-input-placeholder, .custom-search-box:-ms-input-placeholder, custom-search-box-mobile:-ms-input-placeholder {
color: #C0CDDB;
font-size: 12px;
text-transform: lowercase;
font-weight: 400; }
.header-search:focus, .custom-search-box:focus, .custom-search-box-mobile:focus {
border-radius: 4px;
outline: none;
border: 2px solid #30739C !important;
box-shadow: none;
}
.close-search {
position: absolute;
top: 20px;
right: 10px;
color: #dae5ee;
z-index: 1001;
font-size: 16px;
}
.close-search:hover
{
color: #30739C;
cursor: pointer;
}
@media (max-width: 767px), only screen and (max-device-width: 1024px) {
.close-search
{
display: none !important;
}
}
.show
{
display: block;
@ -3635,11 +3447,6 @@ a.overview-btn.docs-btn i {
line-height: 50px;
vertical-align: middle; }
.docs-main-search-form {
width: 98%;
margin-top: 10px;
float: left;
position: relative; }
i.docs-search-icon {
position: absolute;

View File

@ -84,7 +84,6 @@ a.deprecated-badge-right {
margin-top: 5px;
left:99%;
cursor: pointer;
}
.deprecated-badge-maintained .deprecated-badge-close-button{
@ -98,3 +97,9 @@ a.deprecated-badge-right {
.deprecated-badge-current .deprecated-badge-close-button{
color: white !important;
}
@media (max-width: 767px), only screen and (max-device-width: 1024px) {
.deprecated-badge .deprecated-badge-close-button{
left:97%;
}
}

View File

@ -0,0 +1,26 @@
/*hide close button*/
.ossw-search-bar-close {
display: none !important;
}
#search-bar-input{
width: 98% !important;
margin-top: 10px !important;
}
.search-container-mobile
{
display: none !important;
position: relative !important;
width: 100% !important;
}
@media (max-width: 767px), only screen and (max-device-width: 1024px) {
.search-container-mobile
{
display: block !important;
}
.search-container {
display: none !important;
}
}

View File

@ -1,21 +1,3 @@
// Open header search bar
$(function() {
$(".search-icon").click(function() {
$(".navbar-main").toggleClass("show");
$(".search-container").toggleClass("show");
$(".search-icon").toggleClass("show");
$('.custom-search-box').focus();
});
});
// Close header search bar
$(function() {
$(".close-search").click(function() {
$(".navbar-main").toggleClass("show");
$(".search-container").toggleClass("show")
$(".search-icon").toggleClass("show");
});
});
// Open header drop downs on hover
jQuery(document).ready(function(){
@ -30,6 +12,7 @@ jQuery(document).ready(function(){
$('ul.navbar-main li ul.dropdown-menu').removeClass('dropdown-hover');
}
});
jQuery(window).resize(function () {
if (jQuery(window).width() > 767) {
$('ul.navbar-main li ul.dropdown-menu').addClass('dropdown-hover');
@ -43,23 +26,5 @@ jQuery(window).resize(function () {
}
});
// Remove Search text in smaller browser windows
jQuery(document).ready(function(){
if (jQuery(window).width() < 1050) {
$('#search-label').text('');
} else {
$('#search-label').text('Search');
}
});
jQuery(window).resize(function () {
if (jQuery(window).width() < 1050) {
$('#search-label').text('');
} else {
$('#search-label').text('Search');
}
});

View File

@ -4,6 +4,9 @@
<!-- Custom CSS -->
<link href="{{ CSSDIR }}combined.css" rel="stylesheet">
<!-- Search CSS -->
<link href="{{ CSSDIR }}search.css" rel="stylesheet">
<!-- Fonts -->
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.css" rel="stylesheet">

View File

@ -1,7 +1,7 @@
<!-- Header -->
<!-- Header Navigation -->
{% include 'templates/swiftype_search_install.tmpl' %}
{% include 'templates/os_search_install.tmpl' %}
<nav class="navbar navbar-default inner" role="navigation">
<div class="container">
@ -17,21 +17,12 @@ data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
<div class="brand-wrapper">
<a class="navbar-brand" href="/"></a>
</div>
<div class="search-icon show"><i class="fa fa-search"></i>
Search</div>
</div>
<!-- Collect the nav links, forms, and other content for toggling
-->
<div class="collapse navbar-collapse"
id="bs-example-navbar-collapse-1">
<div class="search-container tiny">
<i class="fa fa-times close-search"></i>
</div>
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav navbar-main show">
{% include 'templates/swiftype_search_mobile.tmpl' %}
{% include 'templates/os_search_mobile.tmpl' %}
<li>
<a href="https://www.openstack.org/software/" class="drop" id="dropdownMenuSoftware">Software <i class="fa fa-caret-down"></i></a><i class="mobile-expand"></i>
<ul class="dropdown-menu dropdown-hover" role="menu" aria-labelledby="dropdownMenuSoftware">

View File

@ -29,7 +29,7 @@
<a href="#docs-main-body" class="overview-btn docs-btn">View The Docs <i class="fa fa-arrow-circle-o-down"></i></a>
<a href="https://www.openstack.org/software/start/" class="overview-btn docs-btn">Get OpenStack <i class="fa fa-arrow-circle-o-right"></i></a>
<a href="https://www.openstack.org/marketplace/training" class="overview-btn docs-btn">Get Training <i class="fa fa-arrow-circle-o-right"></i></a>
{% include 'templates/swiftype_search.tmpl' %}
{% include 'templates/os_search.tmpl' %}
</div>
<div class="col-lg-4 col-md-4 col-sm-4 superuser-wrapper">
<div id="superuser-img"></div>

View File

@ -0,0 +1,3 @@
<div class="search-container tiny">
<div class="openstack-search-bar" data-baseUrl="search.openstack.org" data-context="docs-openstack"></div>
</div>

View File

@ -0,0 +1,10 @@
<script>
(function (window, document) {
var loader = function () {
var script = document.createElement("script"), tag = document.getElementsByTagName("script")[0];
script.src = "https://search.openstack.org/widget/embed.min.js?t="+Date.now();
tag.parentNode.insertBefore(script, tag);
};
window.addEventListener ? window.addEventListener("load", loader, false) : window.attachEvent("onload", loader);
})(window, document);
</script>

View File

@ -0,0 +1,3 @@
<li class="search-container-mobile">
<div class="openstack-search-bar" data-baseUrl="search.openstack.org" data-context="docs-openstack"></div>
</li>

View File

@ -1,3 +0,0 @@
<form class="docs-main-search-form">
<input type="text" class="st-default-search-input custom-search-box" placeholder="Search OpenStack">
</form>

View File

@ -1,8 +0,0 @@
<script type="text/javascript">
(function(w,d,t,u,n,s,e){w['SwiftypeObject']=n;w[n]=w[n]||function(){
(w[n].q=w[n].q||[]).push(arguments);};s=d.createElement(t);
e=d.getElementsByTagName(t)[0];s.async=1;s.src=u;e.parentNode.insertBefore(s,e);
})(window,document,'script','//s.swiftypecdn.com/install/v2/st.js','_st');
_st('install','aDn5L_vgZ2yzRcE893kK','2.0.0');
</script>

View File

@ -1,3 +0,0 @@
<li>
<input type="text" class="st-default-search-input custom-search-box-mobile" placeholder="Search OpenStack">
</li>

View File

@ -18,7 +18,7 @@
<a href="#docs-main-body" class="overview-btn docs-btn">Belgeleri görüntüleyin <i class="fa fa-arrow-circle-o-down"></i></a>
<a href="https://www.openstack.org/software/start/" class="overview-btn docs-btn">OpenStack Edinin <i class="fa fa-arrow-circle-o-right"></i></a>
<a href="https://www.openstack.org/marketplace/training" class="overview-btn docs-btn">Eğitim Alın <i class="fa fa-arrow-circle-o-right"></i></a>
{% include 'templates/swiftype_search.tmpl' %}
{% include 'templates/os_search.tmpl' %}
</div>
<div class="col-lg-4 col-md-4 col-sm-4 superuser-wrapper">
<div id="superuser-img"></div>

View File

@ -18,7 +18,7 @@
<a href="#docs-main-body" class="overview-btn docs-btn">查看文档 <i class="fa fa-arrow-circle-o-down"></i></a>
<a href="http://www.openstack.org/software/start/" class="overview-btn docs-btn">获取OpenStack <i class="fa fa-arrow-circle-o-right"></i></a>
<a href="http://www.openstack.org/marketplace/training" class="overview-btn docs-btn">获得培训<i class="fa fa-arrow-circle-o-right"></i></a>
{% include 'templates/swiftype_search.tmpl' %}
{% include 'templates/os_search.tmpl' %}
</div>
<div class="col-lg-4 col-md-4 col-sm-4 superuser-wrapper">
<div id="superuser-img"></div>