butiran-✗

ta-bu-ta read-line

· 2 mins read · edit

result

26c10.html

<div id="container"><div>

<script src="26b39.js"></script>
<script src="26b41.js"></script>
<script src="26b43.js"></script>
<script src="26b10.js"></script>

<script>
// Instantiate containers, output textarea, and buttons
const cnt = getContainer("container");
const inTxa = createTextarea("text-input");
const outTxa = createTextarea("text-output");
const btnDiv = createDiv("button-container");
const ciBtn = createButton("ci-button", "Clear input");
const coBtn = createButton("co-button", "Clear output");
const deBtn = createButton("de-button", "Default");
const rpBtn = createButton("rp-button", "Read line");

// Append textarea to container
cnt.append(inTxa);
cnt.append(btnDiv);
cnt.append(outTxa);
btnDiv.append(ciBtn);
btnDiv.append(coBtn);
btnDiv.append(deBtn);
btnDiv.append(rpBtn);

// Change elements flex value
changeElementsFlex(
  ["text-input", "3"],
  ["button-container", "3"] , 
  ["text-output", "3"],
);

// Bind consolex output to textarea and set EOL character
consolex.setOutput(outTxa);
consolex.setEOL("");

// Set onclick event to each button
ciBtn.addEventListener("click", () => {
  clearTextarea("text-input");
});
coBtn.addEventListener("click", () => {
  clearTextarea("text-output");
});
deBtn.addEventListener("click", () => {
  inTxa.value = "# params"; 
  inTxa.value += "\n" + "MASS 0.40";
  inTxa.value += "\n" + "DIAM 0.01";
  inTxa.value += "\n" + "POST 0.00";
  inTxa.value += "\n" + "VELO 1.00";
  inTxa.value += "\n" + "ACCL 0.50";
});
rpBtn.addEventListener("click", () => {
  let key, line;
  
  key = "VELO";
  line = readLineFromTextarea("text-input", key);
  outTxa.value += key + "=" + line + "\n";

  key = "MASS";
  line = readLineFromTextarea("text-input", key);
  outTxa.value += key + "=" + line + "\n";

  key = "ACCL";
  line = readLineFromTextarea("text-input", key);
  outTxa.value += key + "=" + line + "\n";
  
  key = "GRAV";
  line = readLineFromTextarea("text-input", key);
  outTxa.value += key + "=" + line + "\n";
});
</script>

26c10.js

/**
 * 26c10.js
 * Helper functions for butiran-x/26c10 note.
 *
 * Author: Sparisoma Viridi (https://github.com/dudung)
 * Created: 2026-03-03
 *
 * Exports:
 * - readLineFromTextarea(id, key)
 */


/**
 * Reads a line from a textarea element that starts with the specified key.
 *
 * @param {string} id - The ID of the textarea element to read from.
 * @param {string} key - The key (first word) identifying the line to retrieve.
 * @returns {string} The content of the line after the specified key.
 *
 * @example
 * const line = readLineFromTextarea("text-input", "KEY");
 */
function readLineFromTextarea(id, key) {
  /** @type {HTMLTextareaElement|null} */
  const el = document.getElementById(id);
  
  if (!(el instanceof HTMLTextAreaElement)) return null;
  
  const lines = el.value.split("\n");
  let line = null;
  for(l of lines) {
    const cols = l.split(" ");
    if(cols[0] == key) {
      line = cols[1];
    }
  }
  return line;
}


// marker: 26c10.js
(() => {
  console.log("[marker] 26c10.js loaded");
})();