Tiny terminal Emulator-termynal. js

Vista prévia

Descripción

termynal. js es una biblioteca de JavaScript ligera e independiente que agrega un terminal animado y configurable a la aplicación Web. Tiene soporte para la función ' Async ' y la expresión ' Await '.

¿Cómo funciona?

Incluye la hoja de estilo del termynal para estila el terminal.

<link rel="stylesheet" href="termynal.css">

Crear un contenedor terminal y config el terminal con los siguientes atributos ' Data ':

• Data-Ty-typeDelay: retardo entre cada carácter con tipo
• Data-Ty-lineDelay: retardo entre cada línea mecanografiada
• Data-Ty-startDelay: demora antes de escribir
• Data-Ty-prompt: estilo de solicitud
• Data-Ty-progressChar: carácter que se utilizará para la barra de progreso
• Data-Ty-progressLength: número de caracteres mostrados como barra de progreso
• Data-Ty-cursor: carácter que se utilizará para parpadear el cursor

<div id="termynal" data-termynal data-ty-typeDelay="40" data-ty-lineDelay="700">

<span data-ty="input" data-ty-prompt="â–²">npm uninstall react</span>

<span data-ty>Are you sure you want to uninstall 'react'?</span>

<span data-ty="input" data-ty-typeDelay="1000" data-ty-prompt="(y/n)">y</span>

<span data-ty="progress" data-ty-progressChar="·"></span>

<span data-ty>Uninstalled 'react'</span>

<span data-ty="input" data-ty-prompt="â–²">node</span>

<span data-ty="input" data-ty-prompt=">">Array(5).fill('???? ')</span>

<span data-ty>['????', '????', '????', '????', '????']</span>

<span data-ty="input" data-ty-prompt="â–²">cd ~/repos</span>

<span data-ty="input" data-ty-prompt="â–² ~/repos"> git checkout branch master</span>

<span data-ty="input" data-ty-prompt="â–² ~/repos (master)">git commit -m "Fix things"</span>
</div>

Incluya el JavaScript principal en la parte inferior de la Página Web. Hecho.

<script src="termynal.js" data-termynal-container="#termynal"></script>