https://ml-visualized.com/_static/sphinx-thebe.js?v=c100c467

1/**
2 * Add attributes to Thebe blocks to initialize thebe properly
3 */
4var configureThebe = () => {
5  // Load thebe config in case we want to update it as some point
6  console.log("[sphinx-thebe]: Loading thebe config...");
7  thebe_config = document.querySelector("script[type=\"text/x-thebe-config\"]");
8
9  // If we already detect a Thebe cell, don't re-run
10  if (document.querySelectorAll("div.thebe-cell").length > 0) {
11    return;
12  }
13
14  // Update thebe buttons with loading message
15  document.querySelectorAll(".thebe-launch-button").forEach((button) => {
16    button.innerHTML = `
17        <div class="spinner">
18            <div class="rect1"></div>
19            <div class="rect2"></div>
20            <div class="rect3"></div>
21            <div class="rect4"></div>
22        </div>
23        <span class="loading-text"></span>`;
24  });
25
26  // Set thebe event hooks
27  var thebeStatus;
28  thebelab.on("status", function (evt, data) {
29    console.log("Status changed:", data.status, data.message);
30
31    const button = document.querySelector(".thebe-launch-button ");
32    button.classList.replace(
33	    `thebe-status-${thebeStatus}`, 
34	    `thebe-status-${data.status}`
35    )
36    button.querySelector(".loading-text")
37      .innerHTML = (
38        `<span class='launch_msg'>Launching from mybinder.org: </span>
39	 <span class='status'>${data.status}</span>`
40      );
41
42    // Now update our thebe status
43    thebeStatus = data.status;
44
45    // Find any cells with an initialization tag and ask thebe to run them when ready
46    if (data.status === "ready") {
47      var thebeInitCells = document.querySelectorAll(
48        ".thebe-init, .tag_thebe-init"
49      );
50      thebeInitCells.forEach((cell) => {
51        console.log("Initializing Thebe with cell: " + cell.id);
52        cell.querySelector(".thebelab-run-button").click();
53      });
54    }
55  });
56};
57
58/**
59 * Update the page DOM to use Thebe elements
60 */
61var modifyDOMForThebe = () => {
62  // Find all code cells, replace with Thebe interactive code cells
63  const codeCells = document.querySelectorAll(thebe_selector);
64  codeCells.forEach((codeCell, index) => {
65    const codeCellId = (index) => `codecell${index}`;
66    codeCell.id = codeCellId(index);
67    codeCellText = codeCell.querySelector(thebe_selector_input);
68    codeCellOutput = codeCell.querySelector(thebe_selector_output);
69
70    // Clean up the language to make it work w/ CodeMirror and add it to the cell
71    dataLanguage = detectLanguage(kernelName);
72
73    // Re-arrange the cell and add metadata
74    if (codeCellText) {
75      codeCellText.setAttribute("data-language", dataLanguage);
76      codeCellText.setAttribute("data-executable", "true");
77
78      // If we had an output, insert it just after the `pre` cell
79      if (codeCellOutput) {
80        codeCellOutput.setAttribute("data-output", "");
81        codeCellText.insertAdjacentElement('afterend', codeCellOutput);
82      }
83    }
84
85    // Remove sphinx-copybutton blocks, which are common in Sphinx
86    codeCell.querySelectorAll("button.copybtn").forEach((el) => {
87      el.remove();
88    });
89  });
90};
91
92var initThebe = () => {
93  // Load thebe dynamically if it's not already loaded
94  if (typeof thebelab === "undefined") {
95    console.log("[sphinx-thebe]: Loading thebe from CDN...");
96    document.querySelector(".thebe-launch-button ").innerText = "Loading thebe from CDN...";
97
98    const script = document.createElement("script");
99    script.src = `${THEBE_JS_URL}`;
100    document.head.appendChild(script);
101
102    // Runs once the script has finished loading
103    script.addEventListener("load", () => {
104      console.log("[sphinx-thebe]: Finished loading thebe from CDN...");
105      configureThebe();
106      modifyDOMForThebe();
107      thebelab.bootstrap();
108    });
109  } else {
110    console.log(
111      "[sphinx-thebe]: thebe already loaded, not loading from CDN..."
112    );
113    configureThebe();
114    modifyDOMForThebe();
115    thebelab.bootstrap();
116  }
117};
118
119// Helper function to munge the language name
120var detectLanguage = (language) => {
121  if (language.indexOf("python") > -1) {
122    language = "python";
123  } else if (language === "ir") {
124    language = "r";
125  }
126  return language;
127};