Y a-t-il un moyen de simuler une coque Bash dans le navigateur avec juste JavaScript / JQuery? J'aimerais avoir une démonstration sur notre site Web où elle simule une personne utilisant notre nouveau système de base de données à partir d'une coque Bash. De préférence, il ressemblerait à une personne tapé dans les commandes Shell et la sortie serait répertorie de la ligne de ligne comme une coque de bash typique. J'ai été googling sans rien trouver, alors comment dois-je la mettre en œuvre - avec ce que JQuery Plug-in pour rendre mon travail plus facile.
3 Réponses :
Jetez un coup d'œil à ASCIINEMA :
Asciinema est une solution source libre et open source pour enregistrer les sessions de terminal et les partager sur le Web.
On dirait très prometteur, je n'ai pas pensé à chercher des enregistreurs de terminaux. Je vais l'essayer.
Si c'est juste à des fins de présentation, il n'est pas si difficile de coder de zéro. Configurez votre page afin qu'il ressemble à une interface de ligne de commande
html: css: et Ensuite, impliquez de fausses actions dans JavaScript / JQuery qui démarrerait lorsque le client charge la page. Par exemple qui semblerait une réponse d'un serveur ou par exemple à saisir la commande , etc. Je suis sûr que vous pouvez jouer avec cela pour le faire paraître mieux, les fonctions ne sont pas testées - c'est juste pour vous aider à obtenir une idée d'une solution possible. J'espère que cela aide!
J'ai fait une solution basée sur le exemple de KOS , vous peut voir la démo entièrement active ici .
HTML CSS jQuery
Ça a l'air génial! :-) Je suis heureux d'aider un peu.
@Kos Oui, c'est cool. Cliquez sur "Afficher l'exemple" pour une démonstration plus avancée de ce que j'ai fini avec Sparkledb.net/sparql-Database-Server/documentation/Guide/...
Donc, il ne devrait pas être interactif? Alors pourquoi ne pas utiliser un gif animé? Ou un style
div avec quelquesSettimeout Fixation de lignes de texte.@DANFROMGERMANY J'espérais rendre les exemples de base de données plus faciles à maintenir sans avoir à refaire un GIF animé à chaque fois que nous changeons quelque chose dans un exemple. Je voudrais également que la page soit rapide pour charger des téléphones portables- Vidéos constitue également une option, mais vous avez également la question de la maintenance. Puisque tout n'est que du texte que j'espérais que je puisse faire un script JS qui a montré l'exemple d'utilisation de la DB, et que l'exemple de texte serait dans un texte HTML
textarea lorsque JS est désactivé - cela le ferait également consultable par les moteurs de recherche.c'est ce que tu veux? compileonline.com/execute_bash_online.php
Mattboldt.com/demos/typed-js
@Velthune Pas vraiment, je ne veux pas réellement exécuter des commandes Bash sur un serveur, je veux simplement démo notre utilisation de la base de données dans les coquillages Bash en tant que tutoriels pour nos utilisateurs.
Que diriez-vous d'utiliser CamtaSia / Screenflow pour vous capturer de taper et de jouer à cela?
Est-ce que je suis parti juste pour le plaisir: Codepen.io/anon/pen/qsidk
@Kos qui est très cool, j'ai fait des changements et le fourriez-le Codepen.io/anon/pen/geldc de sorte qu'il lit désormais tout à partir d'un
textarea uniquement si JS est activé, mais maintenant toutes les lignes semblent venir en même temps. Pourriez-vous avoir un coup d'oeil?@IngeHenriksen parce que vous démarrez toutes les tâches asynchronisées dans une boucle immédiatement, au lieu d'une après l'autre. Lire Github.com/kriskowal/q
@Kos Je ne peux pas obtenir le cadre pour traiter une boucle Codepen.io/anon/pen/ Felck , les tâches asynchronisées ne sont pas nécessaires dans mon cas d'utilisation non plus. Merci quand même.
N'abandonnez pas tôt, la vraie vie JavaScript prend tout un niveau plus amusant une fois que vous obtenez des promesses. (J'ai codé cela pour obtenir un peu de pratique dans les utiliser)
@Kos Voir ma réponse. Merci encore.