| | <!DOCTYPE html>
|
| | <html>
|
| | <head>
|
| | <meta charset="utf-8" />
|
| | <meta name="viewport" content="width=device-width" />
|
| | <title>Object Detection with YOLO</title>
|
| | <script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script>
|
| | <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
|
| | <link rel="stylesheet" href="style.css" />
|
| | <link
|
| | rel="stylesheet"
|
| | href="https://cdn.jsdelivr.net/gh/highlightjs/cdn-release/build/styles/default.min.css"
|
| | />
|
| | <script src="https://cdn.jsdelivr.net/gh/highlightjs/cdn-release/build/highlight.min.js"></script>
|
| | <script>
|
| | class BC {
|
| | constructor(elementId) {
|
| | this.container = document.getElementById(elementId);
|
| | this.headings = document.querySelectorAll("h1, h2, h3, h4");
|
| | this.currentHeading = null;
|
| | }
|
| | set_breadcrumb() {
|
| | const headings = document.querySelectorAll("h1, h2, h3, h4");
|
| | let currentHeading = null;
|
| |
|
| |
|
| | for (let i = 0; i < headings.length; i++) {
|
| | const heading = headings[i];
|
| | if (
|
| | heading.getBoundingClientRect().top <
|
| | window.innerHeight * 0.1
|
| | ) {
|
| |
|
| | currentHeading = heading;
|
| | } else {
|
| | break;
|
| | }
|
| | }
|
| |
|
| |
|
| | const breadcrumb = document.getElementById("breadcrumb");
|
| | if (currentHeading) {
|
| | breadcrumb.textContent = currentHeading.textContent;
|
| | }
|
| | }
|
| | }
|
| | console.log(marked);
|
| | document.addEventListener("DOMContentLoaded", function () {
|
| | fetch("object-detection.md")
|
| | .then((response) => response.text())
|
| | .then((text) => {
|
| | const html = marked.marked(text);
|
| | document.getElementById("markdown-container").innerHTML = html;
|
| | document.querySelectorAll("pre code").forEach((block) => {
|
| | hljs.highlightBlock(block);
|
| | });
|
| | const bc = new BC("markdown-container");
|
| | bc.set_breadcrumb();
|
| | document.addEventListener("scroll", bc.set_breadcrumb);
|
| | })
|
| | .catch((error) =>
|
| | console.error("Error loading the Markdown file:", error)
|
| | );
|
| | });
|
| | </script>
|
| | </head>
|
| | <body>
|
| | <div id="breadcrumb"></div>
|
| | <div id="markdown-container"></div>
|
| | </body>
|
| | </html>
|
| |
|