Skip to content

Commit

Permalink
Added New Algolia Search (#68)
Browse files Browse the repository at this point in the history 
* Added New Algolia Search

This search app is made as an independent module from Antora, so you can just copy the elements inside /gcx/algoliaSearch to another site and it should work

* Changing search resources paths

* Removed unused asstes folder

The search site will reuse the assets folder located in /en/home/

* Changed search path

* rebuilt ui-bundle.zip

* Update 404.hbs

Fixed realtive path to new search

* rebuilt ui-bundle with 404 update

---------

Co-authored-by: Kenni Martínez <57879404+KenniM@users.noreply.github.com>
Co-authored-by: John Smart <john.smart@datastax.com>
  • Loading branch information
@KenniMartinezM @KenniM @johnsmartco
3 people authored Apr 13, 2023
1 parent dcc46f2 commit d536bcd
Show file tree
Hide file tree
Showing 6 changed files with 1,302 additions and 2 deletions.
255 changes: 255 additions & 0 deletions gcx/algoliaSearch/index.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,255 @@
<!DOCTYPE html>
<html lang="en">

<head>
<link rel="icon" href="https://www.datastax.com/favicon.ico" type="image/x-icon">
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<link rel="stylesheet" href="../home/assets/css/site.css">
<link rel="stylesheet" type="text/css" href="../home/assets/css/siteSearch.css">
<link href="https://fonts.googleapis.com/css2?family=Sora&display=swap" rel="stylesheet">
<title>Search</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/instantsearch.css@8.0.0/themes/reset-min.css" integrity="sha256-2AeJLzExpZvqLUxMfcs+4DWcMwNfpnjUeAAvEtPr0wU=" crossorigin="anonymous">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200" />
</head>

<body>
<header class="header">
<nav class="navbar">
<div class="navbar-brand">
<!-- <a href="{{{or site.url (or siteRootUrl siteRootPath)}}}"> -->
<a href="https://docs.datastax.com">
<img src="../home/assets/img/logo.svg" alt="">
</a>
<button class="navbar-burger" data-target="topbar-nav">
<span></span>
<span></span>
<span></span>
</button>
</div>
<div id="topbar-nav" class="navbar-menu">
<div class="navbar-end">
<div class="doc-link">
<ul id="ds_sites_list">
<li><a href="https://docs.datastax.com/en/glossary/docs" target="_blank">Glossary</a></li>
<li><a href="https://support.datastax.com/" target="_blank">Support</a></li>
<li><a href="https://downloads.datastax.com/" target="_blank">Downloads</a></li>
<li><a href="https://www.datastax.com/" target="_self">DataStax Home</a></li>
</ul>
<div class="navbar-end navbar-switch">
<label class="switch_label" for="switch">
<input type="checkbox" name="switch" class="switch" id="switch">
<span class="slider">
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path
d="M12 9C13.65 9 15 10.35 15 12C15 13.65 13.65 15 12 15C10.35 15 9 13.65 9 12C9 10.35 10.35 9 12 9ZM12 7C9.24 7 7 9.24 7 12C7 14.76 9.24 17 12 17C14.76 17 17 14.76 17 12C17 9.24 14.76 7 12 7ZM2 13H4C4.55 13 5 12.55 5 12C5 11.45 4.55 11 4 11H2C1.45 11 1 11.45 1 12C1 12.55 1.45 13 2 13ZM20 13H22C22.55 13 23 12.55 23 12C23 11.45 22.55 11 22 11H20C19.45 11 19 11.45 19 12C19 12.55 19.45 13 20 13ZM11 2V4C11 4.55 11.45 5 12 5C12.55 5 13 4.55 13 4V2C13 1.45 12.55 1 12 1C11.45 1 11 1.45 11 2ZM11 20V22C11 22.55 11.45 23 12 23C12.55 23 13 22.55 13 22V20C13 19.45 12.55 19 12 19C11.45 19 11 19.45 11 20ZM5.99 4.58C5.6 4.19 4.96 4.19 4.58 4.58C4.19 4.97 4.19 5.61 4.58 5.99L5.64 7.05C6.03 7.44 6.67 7.44 7.05 7.05C7.43 6.66 7.44 6.02 7.05 5.64L5.99 4.58ZM18.36 16.95C17.97 16.56 17.33 16.56 16.95 16.95C16.56 17.34 16.56 17.98 16.95 18.36L18.01 19.42C18.4 19.81 19.04 19.81 19.42 19.42C19.81 19.03 19.81 18.39 19.42 18.01L18.36 16.95ZM19.42 5.99C19.81 5.6 19.81 4.96 19.42 4.58C19.03 4.19 18.39 4.19 18.01 4.58L16.95 5.64C16.56 6.03 16.56 6.67 16.95 7.05C17.34 7.43 17.98 7.44 18.36 7.05L19.42 5.99ZM7.05 18.36C7.44 17.97 7.44 17.33 7.05 16.95C6.66 16.56 6.02 16.56 5.64 16.95L4.58 18.01C4.19 18.4 4.19 19.04 4.58 19.42C4.97 19.8 5.61 19.81 5.99 19.42L7.05 18.36Z"
fill="#20293A" />
</svg>
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path
d="M9.37 5.51C9.19 6.15 9.1 6.82 9.1 7.5C9.1 11.58 12.42 14.9 16.5 14.9C17.18 14.9 17.85 14.81 18.49 14.63C17.45 17.19 14.93 19 12 19C8.14 19 5 15.86 5 12C5 9.07 6.81 6.55 9.37 5.51ZM12 3C7.03 3 3 7.03 3 12C3 16.97 7.03 21 12 21C16.97 21 21 16.97 21 12C21 11.54 20.96 11.08 20.9 10.64C19.92 12.01 18.32 12.9 16.5 12.9C13.52 12.9 11.1 10.48 11.1 7.5C11.1 5.69 11.99 4.08 13.36 3.1C12.92 3.04 12.46 3 12 3Z"
fill="#20293A" />
</svg>
</span>
</label>
</div>
</div>
<div class="navbar-end__group">
<form id="alg-search-form" class="ds-search-form" action="https://docs.datastax.com/en/search/index.html" target="_blank" method="GET">
<div>
<div class="ds-search-input-icon">
<svg width="16" height="16" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M10.0719 11.1326C9.04048 11.9373 7.74289 12.4167 6.33333 12.4167C2.9736 12.4167 0.25 9.69307 0.25 6.33333C0.25 2.9736 2.9736 0.25 6.33333 0.25C9.69307 0.25 12.4167 2.9736 12.4167 6.33333C12.4167 7.74289 11.9373 9.04048 11.1326 10.0719L13.5303 12.4696C13.8232 12.7625 13.8232 13.2374 13.5303 13.5303C13.2374 13.8232 12.7625 13.8232 12.4696 13.5303L10.0719 11.1326ZM1.75 6.33333C1.75 3.80203 3.80203 1.75 6.33333 1.75C8.86464 1.75 10.9167 3.80203 10.9167 6.33333C10.9167 7.56591 10.4301 8.68485 9.63861 9.50857C9.6147 9.52728 9.59166 9.54763 9.56965 9.56965C9.54763 9.59166 9.52728 9.6147 9.50857 9.63861C8.68485 10.4301 7.56591 10.9167 6.33333 10.9167C3.80203 10.9167 1.75 8.86464 1.75 6.33333Z" fill="#5C6A85"/>
</svg>
<input id="alg-search-input" class="ds-datastax-search-input" type="text" name="query" placeholder="Search"/>
</div>
<button id="alg-search-button" class="ds-search-button" type="submit" style="display: none"></button>
<input id="dataset" type="hidden" name="dataset" value="docs"/>
</div>
</form>
<span onclick="window.Intercom('show');" class="ds_buttons_button get-started">Get Live Help</span>
</div>
</div>
</div>
</nav>
</header>
<h1 class="searchTitle">What can we help you find?</h1>
<div id="algoliaSearchContainer">
<main class="search-container">
<div class="left-panel hidden">
<div id="categories">
<div class="control">
<a id="closeFilter">X</a>
</div>
<div class="title">
<h3>Filter by product</h3>
</div>

<ul>
<li><label><input class="alg-filter" type="radio" name="index_filter" value="crawler_docs-v2-astra-serverless"> Astra DB Serverless</label></li>
<li><label><input class="alg-filter" type="radio" name="index_filter" value="crawler_docs-v2-astra-classic"> Astra DB Classic</label></li>
<li><label><input class="alg-filter" type="radio" name="index_filter" value="crawler_docs-v2-astra-streaming"> Astra Streaming</label></li>
<li><label><input class="alg-filter" type="radio" name="index_filter" value="crawler_docs-v2-streaming"> Streaming</label></li>
<li><label><input class="alg-filter" type="radio" name="index_filter" value="crawler_docs-v2-streaming-connectors"> Streaming Connectors</label></li>
<li><label><input class="alg-filter" type="radio" name="index_filter" value="crawler_docs-v2-luna-streaming"> Luna Streaming</label></li>
<li><label><input class="alg-filter" type="radio" name="index_filter" value="crawler_docs-v2-dse-current"> DataStax Enterprise 6.8</label></li>
<li><label><input class="alg-filter" type="radio" name="index_filter" value="crawler_docs-v2-dse-older"> DataStax Enterprise 5.1</label></li>
<li><label><input class="alg-filter" type="radio" name="index_filter" value="crawler_docs-v2-opscenter-current"> OpsCenter 6.8</label></li>
<li><label><input class="alg-filter" type="radio" name="index_filter" value="crawler_docs-v2-cassandra-current"> Apache Cassandra 3.x</label></li>
<li><label><input class="alg-filter" type="radio" name="index_filter" value="crawler_docs-v2-CQL-current"> CQL</label></li>
<li><label><input class="alg-filter" type="radio" name="index_filter" value="crawler_docs-v2-studio-current"> Studio 6.8</label></li>
<li><label><input class="alg-filter" type="radio" name="index_filter" value="crawler_docs-v2-docker"> Docker</label></li>

<!--li><label><input class="alg-filter" type="radio" name="index_filter" value="crawler_docs.datastax.com"> DataStax</label></li-->
<!-- li><label><input class="alg-filter" type="radio" name="index_filter" value="crawler_docs_ja_docs.datastax.com"> Japanese</label></li -->
<!--li><label><input class="alg-filter" type="radio" name="index_filter" value="crawler_docs-v2-streaming.tmp"> Streaming (old)</label></li-->
<!--li><label><input class="alg-filter" type="radio" name="index_filter" value="crawler_docs-v2-luna-streaming.bak"> Luna Streaming (old)</label></li-->
</ul>
<button id="clearFilters">Clear</button>
</div>
</div>
<div class="right-panel">
<div id="searchbox"></div>
<div id="stats"></div>
<div class="controlFilters">
<a id="openFilter">Filter <span class="material-symbols-outlined">
filter_alt
</span></a>
</div>
<div id="hits"></div>
<div id="pagination"></div>
</div>
</main>
<footer class="wh_footer">
<div class="container-fluid">
<div class="footer-container">
<div class="bottom-icons">
<a href="https://www.facebook.com/datastax" target="_blank" class="facebook-icon" title="Go to DataStax Facebook"></a>
<a href="https://twitter.com/datastax" target="_blank" class="twitter-icon" title="Go to DataStax Twitter"></a>
<a href="https://github.com/datastax/" target="_blank" class="git-icon" title="Go to DataStax GitHub"></a>
<a href="https://datastax.medium.com/" target="_blank" class="medium-icon" title="Go to DataStax Medium"></a>
<a href="https://www.twitch.tv/datastaxdevs" target="_blank" class="twitch-icon" title="Go to DataStax Twitch"></a>
<a href="https://www.linkedin.com/company/datastax/" target="_blank" class="linkedin-icon" title="Go to DataStax Linkedin"></a>
</div>
<div class="contact-us">
<div><a href="https://www.datastax.com" target="_blank" class="ds-bottom-logo-img" title="Go to the DataStax Website"></a></div>
<div>
<p style="margin:0;">General Inquiries: <a href="tel:+1-650-389-6000">+1 (650) 389-6000</a> <a href="mailto:info@datastax.com">info@datastax.com</a></p>
</div>
</div>
<div class="copyright-line">
<p>
<span>©</span>
<span id="copyrightdate"></span>
<script type="text/javascript">document.getElementById("copyrightdate").innerHTML = new Date().getFullYear();</script>
<span>DataStax | <a href="https://www.datastax.com/legal/datastax-website-privacy-policy" target="_blank">Privacy policy</a>
|
<a href="https://www.datastax.com/legal/datastax-website-terms-use" target="_blank">Terms of use</a>

</p>
</div>
<div>
<p>DataStax, Titan, and TitanDB are registered trademarks of DataStax, Inc. and its
subsidiaries in the United States and/or other countries.</p>
<p>Apache, Apache Cassandra, Cassandra, Apache Tomcat, Tomcat, Apache Lucene,
Apache Solr, Apache Hadoop, Hadoop, Apache Pulsar, Pulsar, Apache Spark, Spark, Apache TinkerPop, TinkerPop,
Apache Kafka and Kafka are either registered trademarks or trademarks of the Apache Software Foundation or its subsidiaries in Canada, the United States and/or
other countries.</p>
<p>Kubernetes is the registered trademark of the Linux Foundation.</p>
</div>
<!-- product and doc name for dsInit -->
<div id="ds-params" style="display: none;">
<span id="ds-product">landing_page</span>
<span id="ds-docname">landingpage</span>
</div>
</div>
<!-- Digital Attribution Code -->
<script type="text/javascript">
var bfId="xx4vaCYlG5ayt04m", bfSession = 0.041666666666666664;
(function() {
var script = document.createElement('script');
script.type = 'text/javascript';
script.async = true;
script.src = ('https:' === document.location.protocol ? 'https://' : 'http://' ) + 'munchkin.brightfunnel.com/js/build/bf-munchkin.min.js?tstamp=' + new Date().getTime();
var top = document.getElementsByTagName('script')[0];
top.parentNode.insertBefore(script, top);
})();
</script>
<!-- end Digital Attribution Code -->
</div>
</footer>
<script type="text/javascript" src="../home/assets/js/site404.js"></script>
<script>
!function () {
var theme = window.localStorage.getItem('theme');
var root = document.getElementsByTagName('html')[0];
if (theme) {
root.classList.add('dark-mode');
}
}();
window.addEventListener('DOMContentLoaded', (event) => {
var theme = window.localStorage.getItem('theme')

var path = window.location.pathname
var page = path.split('/').pop()
var name = page.replace('.html', '')
console.log(name)
const sidebar = document.querySelector('.sidebar')
const col = document.getElementById('collapse')
var checkbox = document.getElementById('switch')
if (theme) {
checkbox.checked = true
} else {
checkbox.checked = false
}

if (name === 'landing' && !isMobile()) {
col.checked = true
sidebar.classList.add('small-container')
}

var elements = document.body.getElementsByTagName('pre')
for (var i = 0; i < elements.length; i++) {
for (const child of elements[i].children) {
if (child.tagName === 'CODE') {
elements[i].classList.add('has-code')
}
}
}

document.addEventListener('click', function (event) {
//No es un clic en el sidebar
//if (!event.target.matches('li[data-depth="1"]') && !event.target.matches('.switch')) return;
/* if (event.target.closest('li.nav-item.toggler')) {
console.log(event.target)
event.target.closest('li.nav-item.toggler').classList.toggle('is-active')
}
/*if ((event.target.matches('span.nav-text') ||
event.target.matches('button.nav-item-toggle')) &&
(event.target.offsetParent.matches('li[data-depth="1"]') ||
event.target.offsetParent.matches('li[data-depth="0"]'))) {
event.target.offsetParent.classList.toggle('is-active');
}
if (event.target.matches('li[data-depth="1"]') ||
event.target.matches('li[data-depth="0"]')) {
event.target.classList.toggle('is-active');
}*/
if (event.target.matches('.switch')) {
var root = document.getElementsByTagName('html')[0]
if (event.target.checked) {
window.localStorage.setItem('theme', 'dark')
root.classList.add('dark-mode')
} else {
window.localStorage.removeItem('theme')
root.classList.remove('dark-mode')
}
}
}, false)
})
</script>
<script src="https://cdn.jsdelivr.net/npm/algoliasearch@4.14.3/dist/algoliasearch-lite.umd.js" integrity="sha256-dyJcbGuYfdzNfifkHxYVd/rzeR6SLLcDFYEidcybldM=" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/instantsearch.js@4.51.1/dist/instantsearch.production.min.js" integrity="sha256-y6I4MY/blLHk4a7G33zp97DcnBFRY2iMId4FObo8toI=" crossorigin="anonymous"></script>
<script src="../home/assets/js/siteSearch.js"></script>
</body>


Loading

0 comments on commit d536bcd

Please sign in to comment.