Creative technologist and democracy activist
Published
Edited
Mar 31, 2022
Importers
println = (string) => string
print = (string) => string
function prompt(question) {
return Inputs.text({label: question})
}
readNumber = (question) => {
let number = prompt(question)
return number
}
readLine = (question) => {
let line = prompt(question)
return line
}
readBoolean = (question) => {
let bool = prompt(question)
return bool
}
readInt = (question) => {
let int = prompt(question)
return int
}
class AlertBox extends HTMLElement {
connectedCallback() {
this.innerHTML = `<div style="min-width: 15rem; min-height: 8rem; padding: 2rem; border-radius: 10px; color: white; width: max-content; height: max-content; background-color: darkorange;">
<h2 style="color: white; padding-bottom: 1rem;">Alert:</h2>
<p>
${this.getAttribute("data-text")}
</p>
</div>`
}
}
defineCustomElements()
function alert(string) {
const regex = /[\r\n\x0B\x0C\u0085\u2028\u2029]+/g;
const parsedString = string.replace(regex, "<br><br>");
return html`
<alert-box data-text="${parsedString}"></alert-box>
`
}
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
