Skip to content

enable search on docs #99

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 1 commit into from
May 8, 2025
Merged

enable search on docs #99

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 2 additions & 1 deletion package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -39,11 +39,12 @@
"scripts": {
"spin": "nodemon --watch content --watch static --watch templates --watch spin-up-hub --ext html,md,rhai,hbs,css,js --verbose --legacy-watch --signal SIGINT --exec 'npm run build-index && npm run build-hub-index && spin up --file spin.toml --quiet --env PREVIEW_MODE=$PREVIEW_MODE'",
"bundle-scripts": "parcel watch static/js/src/main.js --dist-dir static/js --no-source-maps",
"bundle-scripts-ci": "parcel build static/js/src/main.js --dist-dir static/js --no-source-maps",
"styles": "parcel watch static/sass/styles.scss --dist-dir static/css",
"lint-markdown": "npx markdownlint-cli2 content/**/*.md \"#node_modules\"",
"test": "npm run check-broken-links",
"build-index": "node md_parser.mjs --dir=content/ --out=./static/data.json --ignore=./content/api/**/*",
"check-broken-links": ".build/check-broken-links.sh",
"build-hub-index": "node hub_index_generator.mjs --dir=content/api/hub/ --out=./static/hub-index-data.json --ignore=./content/api/hub/get_list.md,"
}
}
}
4 changes: 3 additions & 1 deletion spin.toml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -62,6 +62,8 @@ watch = ["content/**/*", "templates/*"]
[component.fileserver-static]
source = "modules/spin_static_fs.wasm"
files = [{ source = "static/", destination = "/" }]
[component.fileserver-static.build]
command = ["npm run bundle-scripts-ci"]

[component.fileserver-downloads]
source = "modules/spin_static_fs.wasm"
Expand Down Expand Up @@ -121,4 +123,4 @@ route = "/kubernetes"

[component.redirect-kubernetes]
source = "modules/redirect.wasm"
environment = { DESTINATION = "/deploying", STATUSCODE = "301" }
environment = { DESTINATION = "/deploying", STATUSCODE = "301" }
151 changes: 108 additions & 43 deletions static/js/main.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -601,7 +601,6 @@ var _utils = require("./modules/utils");
var _multiTab = require("./modules/multiTab");
var _feedback = require("./modules/feedback");
const { mount } = redom;

document.querySelectorAll('.modal-button').forEach(function(el) {
el.addEventListener('click', function() {
var target = document.querySelector(el.getAttribute('data-target'));
Expand All @@ -628,6 +627,7 @@ document.addEventListener("DOMContentLoaded", function() {
(0, _utils.header).init();
hljs.highlightAll();
if (navigator && navigator.clipboard) (0, _utils.addCopyButtons)(navigator.clipboard);
(0, _utils.removeExpiredEvents)();
(0, _utils.addAnchorLinks)();
(0, _utils.scrollSideMenu)();
// changelogFilter()
Expand All @@ -638,30 +638,30 @@ document.addEventListener("DOMContentLoaded", function() {
}, 150);
(0, _utils.header).unpin();
}
// (async function() {
// try {
// await (0, _search.setupSearch)();
// mount(document.getElementById("search-button-container"), (0, _search.searchButton));
// mount(document.getElementById("search-modal-container"), (0, _search.searchModal));
// document.onkeydown = function(e) {
// if (e.key == "Escape") (0, _search.searchModal).close();
// if ((e.key == "k" || e.key == "K") && (e.metaKey || e.ctrlKey)) {
// e.preventDefault();
// e.stopPropagation();
// (0, _search.searchModal).open();
// }
// if (e.key == "s" || e.key == "S") {
// let searchBar = document.getElementById("hub-search-input");
// if (searchBar && document.activeElement != searchBar) {
// e.preventDefault();
// searchBar.focus();
// }
// }
// };
// } catch (err) {
// console.error("Could not setup search");
// }
// })();
(async function() {
try {
await (0, _search.setupSearch)();
mount(document.getElementById("search-button-container"), (0, _search.searchButton));
mount(document.getElementById("search-modal-container"), (0, _search.searchModal));
document.onkeydown = function(e) {
if (e.key == "Escape") (0, _search.searchModal).close();
if ((e.key == "k" || e.key == "K") && (e.metaKey || e.ctrlKey)) {
e.preventDefault();
e.stopPropagation();
(0, _search.searchModal).open();
}
if (e.key == "s" || e.key == "S") {
let searchBar = document.getElementById("hub-search-input");
if (searchBar && document.activeElement != searchBar) {
e.preventDefault();
searchBar.focus();
}
}
};
} catch (err) {
console.error("Could not setup search");
}
})();
// Init feedback on docs pages
let feedback = document.getElementById("feedback-wrapper");
if (feedback) (0, _feedback.createFeedbackElement)(feedback);
Expand Down Expand Up @@ -912,25 +912,25 @@ class ModalSuggest {
project: "Spin",
link1: [
"Install",
"/spin/install"
"/install"
],
link2: [
"Quickstart",
"/spin/quickstart/"
"/quickstart"
],
link3: [
"Develop",
"/spin/developing"
"/writing-apps"
],
link4: [
"Deploy",
"/spin/deploying-to-fermyon/"
"/deploying"
]
}
];
this.projectRecommendations = list("div.result-section", ProjectRecommendations);
this.projectRecommendations.update(this.projectData);
this.el = el("div.result-section-container", "Suggested Projects", this.projectRecommendations);
this.el = el("div.result-section-container", this.projectRecommendations);
}
}
class SearchModal {
Expand All @@ -939,7 +939,7 @@ class SearchModal {
this.modalSearchBar = el("input.modal-search-bar", {
type: "text",
spellcheck: false,
placeholder: "Search Fermyon Developer Home",
placeholder: "Search Spin Docs",
oninput: (function(e) {
this.updateSearch();
}).bind(this)
Expand Down Expand Up @@ -1069,15 +1069,18 @@ parcelHelpers.defineInteropFlag(exports);
parcelHelpers.export(exports, "scrollSideMenu", ()=>scrollSideMenu);
parcelHelpers.export(exports, "addCopyButtons", ()=>addCopyButtons);
parcelHelpers.export(exports, "addAnchorLinks", ()=>addAnchorLinks);
parcelHelpers.export(exports, "changelogFilter", ()=>changelogFilter);
parcelHelpers.export(exports, "removeExpiredEvents", ()=>removeExpiredEvents);
parcelHelpers.export(exports, "header", ()=>header);

// init headroom for sticky menu on upscroll
parcelHelpers.export(exports, "blogAd", ()=>blogAd);
var header = new Headroom(document.querySelector("#topbar"), {
tolerance: 5,
offset: 80
});

// init side menu accordions
var blogAd = new Headroom(document.querySelector("#blogSlogan"), {
tolerance: 5,
offset: 300
});
function scrollSideMenu() {
let sidemenu = document.querySelector("aside.menu");
if (sidemenu) {
Expand All @@ -1095,8 +1098,6 @@ function scrollSideMenu() {
}
}
}

// copy to clipboard
const svgCopy = '<svg xmlns="http://www.w3.org/2000/svg" height="24" width="24"viewBox="0 0 448 512"><!-- Font Awesome Free 5.15.4 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) --><path d="M433.941 65.941l-51.882-51.882A48 48 0 0 0 348.118 0H176c-26.51 0-48 21.49-48 48v48H48c-26.51 0-48 21.49-48 48v320c0 26.51 21.49 48 48 48h224c26.51 0 48-21.49 48-48v-48h80c26.51 0 48-21.49 48-48V99.882a48 48 0 0 0-14.059-33.941zM266 464H54a6 6 0 0 1-6-6V150a6 6 0 0 1 6-6h74v224c0 26.51 21.49 48 48 48h96v42a6 6 0 0 1-6 6zm128-96H182a6 6 0 0 1-6-6V54a6 6 0 0 1 6-6h106v88c0 13.255 10.745 24 24 24h88v202a6 6 0 0 1-6 6zm6-256h-64V48h9.632c1.591 0 3.117.632 4.243 1.757l48.368 48.368a6 6 0 0 1 1.757 4.243V112z"/></svg>';
const svgCheck = '<svg aria-hidden="true" height="24" viewBox="0 0 16 16" version="1.1" width="24" data-view-component="true"><path fill-rule="evenodd" fill="#18d1a5" d="M13.78 4.22a.75.75 0 010 1.06l-7.25 7.25a.75.75 0 01-1.06 0L2.22 9.28a.75.75 0 011.06-1.06L6 10.94l6.72-6.72a.75.75 0 011.06 0z"></path></svg>';
const addCopyButtons = (clipboard)=>{
Expand Down Expand Up @@ -1139,8 +1140,6 @@ const addCopyButtons = (clipboard)=>{
pre.appendChild(button);
});
};

// add clickable #anchors to markdown titles
const addAnchorLinks = ()=>{
const elementsToProcess = document.querySelectorAll(".content h1, .content h2, .content h3, .content h4, .content tr");
elementsToProcess.forEach((element)=>{
Expand Down Expand Up @@ -1173,9 +1172,77 @@ const addAnchorLinks = ()=>{
});
});
};
function removeExpiredEvents() {
let events = document.querySelectorAll(".community-highlight .carousel-cell");
let eventsNumber = events.length;
if (eventsNumber) events.forEach((k)=>{
if (k.dataset.expirydate) {
let eventExpiryDate = new Date(k.dataset.expirydate);
if (eventExpiryDate < Date.now()) {
k.remove();
eventsNumber--;
}
}
});
else return;
if (eventsNumber) {
var elem = document.querySelector('.main-carousel');
var flkty = new Flickity(elem, {
// options
cellAlign: 'left',
contain: true
});
// element argument can be a selector string
// for an individual element
var flkty = new Flickity('.main-carousel', {
});
} else {
let eventsCarousel = document.querySelector(".community-highlight");
eventsCarousel.innerHTML = `
<article class="community-highlight carousel-cell">
<a href="#">
<event>
<date>
</date>
<eventtitle>No upcoming Events
</eventtitle>
<p></p>
<img class="event-logo" />
</event>
</a>
</article>
`;
}
}
function changelogFilter() {
let changelogItems = Array.from(document.querySelectorAll(".changelog-item-title"));
if (changelogItems.length) {
let changelogTags = new Set([
"all_features"
]);
changelogItems.map((k)=>{
JSON.parse(k.dataset.tags).forEach((item)=>changelogTags.add(item));
});
changelogTags = Array.from(changelogTags);
let changelogSelect = document.getElementById("changelog-select");
changelogTags.map((k)=>{
let opt = document.createElement('option');
opt.value = k;
opt.innerHTML = k;
changelogSelect.appendChild(opt);
});
changelogSelect.addEventListener("change", ()=>{
let selected = changelogSelect.value;
changelogItems.map((k)=>{
if (selected != "all_features" && !k.dataset.tags.includes(selected)) {
console.log(k.parentElement);
k.parentElement.style.display = "none";
} else k.parentElement.style.display = "flex";
});
});
}
}


// tabs for multiple languages
},{"@parcel/transformer-js/src/esmodule-helpers.js":"j7FRh"}],"1bdXi":[function(require,module,exports,__globalThis) {
var parcelHelpers = require("@parcel/transformer-js/src/esmodule-helpers.js");
parcelHelpers.defineInteropFlag(exports);
Expand Down Expand Up @@ -1318,8 +1385,6 @@ function filterMultitabQuery() {
return multitabQuery;
}


// user feedback thumbsup/down vote
},{"@parcel/transformer-js/src/esmodule-helpers.js":"j7FRh"}],"c5ZDr":[function(require,module,exports,__globalThis) {
var parcelHelpers = require("@parcel/transformer-js/src/esmodule-helpers.js");
parcelHelpers.defineInteropFlag(exports);
Expand Down
11 changes: 5 additions & 6 deletions static/js/src/modules/search.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -272,10 +272,10 @@ class ModalSuggest {
this.projectData = [
{
project: "Spin",
link1: ["Install", "/spin/install"],
link2: ["Quickstart", "/spin/quickstart/"],
link3: ["Develop", "/spin/developing"],
link4: ["Deploy", "/spin/deploying-to-fermyon/"],
link1: ["Install", "/install"],
link2: ["Quickstart", "/quickstart"],
link3: ["Develop", "/writing-apps"],
link4: ["Deploy", "/deploying"],
}
];
this.projectRecommendations = list(
Expand All @@ -285,7 +285,6 @@ class ModalSuggest {
this.projectRecommendations.update(this.projectData);
this.el = el(
"div.result-section-container",
"Suggested Projects",
this.projectRecommendations,
);
}
Expand All @@ -297,7 +296,7 @@ class SearchModal {
this.modalSearchBar = el("input.modal-search-bar", {
type: "text",
spellcheck: false,
placeholder: "Search Fermyon Developer Home",
placeholder: "Search Spin Docs",
oninput: function (e) {
this.updateSearch();
}.bind(this),
Expand Down
Loading