<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <meta name="description" content=""> <meta name="author" content=""> <title>Swarmlab.io</title> <!-- Bootstrap core CSS --> <link href="/vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet"> <!-- Custom styles for this template --> <link href="/css/scrolling-nav.css" rel="stylesheet"> </head> <body id="page-top"> <!-- Navigation --> <nav class="navbar navbar-expand-lg navbar-dark bg-dark fixed-top" id="mainNav"> <div class="container"> <a class="navbar-brand js-scroll-trigger" href="#page-top">Swarmlab.io</a> <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button> <div class="collapse navbar-collapse" id="navbarResponsive"> <ul class="navbar-nav ml-auto"> <li class="nav-item"> <a class="nav-link js-scroll-trigger" href="http://docs.swarmlab.io/index.html#about">About</a> </li> <li class="nav-item"> <a class="nav-link js-scroll-trigger" href="http://docs.swarmlab.io/index.html#services">Services</a> </li> <li class="nav-item"> <a class="nav-link js-scroll-trigger" href="http://docs.swarmlab.io/index.html#labrooms">Labrooms</a> </li> <li class="nav-item"> <a class="nav-link js-scroll-trigger" href="http://docs.swarmlab.io/index.html#faq">FAQ</a> </li> <li class="nav-item"> <a class="nav-link js-scroll-trigger" href="https://api-client.swarmlab.io:8088/" target="_blank">Login</a> </li> </ul> </div> </div> </nav> <header class="bg-primary text-white"> <div class="container text-center"> <h1>Welcome to Swarmlab.io</h1> <p class="lead"> Swarmlab is a powerful collaboration tool that connects tutors and students in a unique all-in-one environment that gets work done fast and easily <h2> Ready-to-Use Virtual Labs one click away. </h2> </p> </div> </header> <section id="labrooms"> <div class="container"> <div class="row"> <div class="col-lg-12 mx-auto"> <h2>Swarmlab Docs</h2> <p class="lead"> </p> <p class="lead"> </p> <!-- Search functionality --> <nav class="navbar navbar-light justify-content-center mt-4"> <form class="form-inline"> <button type="button" class="btn btn-primary btn-lg mr-3" id="btnSort">Sort</button> <input class="form-control form-control-lg mr-sm-2" type="search" placeholder="Search: case-sensitive." aria-label="Search" id="search"> <!-- <button class="btn btn-outline-success my-2 my-sm-0" type="submit">Search</button> --> </form> </nav> <!-- Cardsrow 1--> <div class="layout-margin-8 mt-4"> <div class="card-deck"> <!-- start quide --> <div class="card card-shadow text-center"> <div class="card-body"> <h4 class="card-title"><b>Quick-start guide!</b></h4> <p class="card-text"></p> <div class="dropdown-divider"></div> <p class="card-text"> <small class="text-muted"> <ul class="list-group list-group-flush"> <li class="list-group-item"> The first steps </li> <li class="list-group-item"> Register, Login etc </li> <li class="list-group-item"> Main Menou </li> <li class="list-group-item"> Tutor/Student Menou etc </li> </ul> </small></p> <a href="http://docs.swarmlab.io/SwarmLab-HowTos/swarmlab/main.adoc.html#_the_first_steps" target="_blank"> <button type="button" class="btn btn-outline-primary">Read More</button> </a> </div> </div> <!-- start quide --> <!-- Learning Objects Notebooks --> <div class="card card-shadow text-center"> <div class="card-body"> <h4 class="card-title"><b>Learning Objects Notebooks</b></h4> <p class="card-text"></p> <div class="dropdown-divider"></div> <p class="card-text"> <small class="text-muted"> A Swarmlab LearningObject Notebook lets users create and share documents that contain <b>live code</b>, visualisation, and many other types of components. <ul class="list-group list-group-flush"> <li class="list-group-item"> Run, Try </li> <li class="list-group-item"> Create, Publish </li> </ul> </small></p> <a href="http://docs.swarmlab.io/SwarmLab-HowTos/swarmlab/main.adoc.html#_learning_objects_notebooks" target="_blank"> <button type="button" class="btn btn-outline-primary">Read More</button> </a> </div> </div> <!-- Learning Objects Notebooks --> <!-- Get Involved --> <div class="card card-shadow text-center"> <div class="card-body"> <h4 class="card-title"><b>Create Labroom</b></h4> <p class="card-text"></p> <div class="dropdown-divider"></div> <p class="card-text"> <small class="text-muted"> <ul class="list-group list-group-flush"> <li class="list-group-item"> Enter lab room area </li> <li class="list-group-item"> Bootstrap </li> <li class="list-group-item"> Tutor/Student Menou etc </li> </ul> </small></p> <a href="http://docs.swarmlab.io/SwarmLab-HowTos/swarmlab/main.adoc.html#_creating_a_lab" target="_blank"> <button type="button" class="btn btn-outline-primary">Read More</button> </a> </div> </div> <!-- Get Involved --> </div> </div> <!-- Cardsrow 2--> <div class="layout-margin-8 mt-4"> <div class="card-deck"> <!-- SwarmLab with NoVNC --> <div class="card card-shadow text-center"> <div class="card-body"> <h4 class="card-title"><b>SwarmLab with NoVNC!</b></h4> <p class="card-text"></p> <div class="dropdown-divider"></div> <p class="card-text"> <small class="text-muted"> <ul class="list-group list-group-flush"> <li class="list-group-item"> HowTo Use a SwarmLab noVNC Lab. </li> </ul> </small></p> <a href="http://docs.swarmlab.io/SwarmLab-HowTos/swarmlab/howto.adoc.html#_quick_1_minute_demo" target="_blank"> <button type="button" class="btn btn-outline-primary">Read More</button> </a> </div> </div> <!-- SwarmLab with NoVNC --> <!-- gitea --> <div class="card card-shadow text-center"> <div class="card-body"> <h4 class="card-title"><b>SwarmLab gitea!</b></h4> <p class="card-text"></p> <div class="dropdown-divider"></div> <p class="card-text"> <small class="text-muted"> <ul class="list-group list-group-flush"> <li class="list-group-item"> create a new repository </li> <li class="list-group-item"> clone repository </li> <li class="list-group-item"> add & commit, push </li> </ul> </small></p> <a href="http://docs.swarmlab.io/SwarmLab-HowTos/swarmlab/files/help/HowTo-gitea.adoc.html#cheat-CreateRepository" target="_blank"> <button type="button" class="btn btn-outline-primary">Read More</button> </a> </div> </div> <!-- gitea --> </div> </div> <!-- Cardsrow 2--> <!-- Cardsrow 3 contribute--> <div class="layout-margin-8 mt-4"> <div class="card-deck"> <!-- SwarmLab contribute --> <div class="card card-shadow text-center"> <div class="card-body"> <h4 class="card-title"><b>Get Involved!</b></h4> <p class="card-text"></p> <div class="dropdown-divider"></div> <p class="card-text"> <small class="text-muted"> We invite anyone to come and participate in the creation of Swarmlab.io. Regardless of your skillset, we’re sure there is something you can add to our community and project. </small></p> <a href="http://docs.swarmlab.io/SwarmLab-HowTos/swarmlab/main.adoc.html#_get_involved" target="_blank"> <button type="button" class="btn btn-outline-primary">Read More</button> </a> </div> </div> <!-- Swarmlab contribute --> </div> </div> <!-- Cardsrow 3 contribute--> <!-- Cardsrow menouvideo swarmlabvideo--> <div class="layout-margin-12 mt-4 text-center"> <h3 class="mb-2 bg-info text-white text-center"><b>Swarmlab Videos!</b></h3> </div> <!-- Cardsrow menouvideo swarmlabvideo--> <!-- Cardsrow menouvideo swarmlabvideo cards--> <div class="layout-margin-8 mt-4"> <div class="card-deck"> <!-- video 1 --> <div class="card card-shadow text-center"> <div class="card-body"> <h4 class="card-title"><b>Create Git Repo!</b></h4> <p class="card-text"></p> <div class="dropdown-divider"></div> <div class="embed-responsive embed-responsive-16by9"> <iframe class="embed-responsive-item" src="https://player.vimeo.com/video/461064974" allowfullscreen></iframe> </div> </div> </div> <!-- video 1 --> <!-- video 2 --> <div class="card card-shadow text-center"> <div class="card-body"> <h4 class="card-title"><b>Request Tutor Verification!</b></h4> <p class="card-text"></p> <div class="dropdown-divider"></div> <div class="embed-responsive embed-responsive-16by9"> <iframe class="embed-responsive-item" src="https://player.vimeo.com/video/461065878" allowfullscreen></iframe> </div> </div> </div> <!-- vodeo 2 --> </div> </div> <!-- Cardsrow menouvideo swarmlabvideo cards--> <!-- Cardsrow menou it would be useful--> <div class="layout-margin-12 mt-4 text-center"> <h3 class="mb-2 bg-info text-white text-center"><b>It would be useful!</b></h3> </div> <!-- Cardsrow menou it would be useful--> <!-- Cardsrow 3--> <div class="layout-margin-8 mt-4"> <div class="card-deck"> <!-- video 1 --> <div class="card card-shadow text-center"> <div class="card-body"> <h4 class="card-title"><b>Using Asciidoctor!</b></h4> <p class="card-text"></p> <div class="dropdown-divider"></div> <div class="embed-responsive embed-responsive-16by9"> <iframe class="embed-responsive-item" src="https://player.vimeo.com/video/183357606" allowfullscreen></iframe> </div> </div> </div> <!-- video 1 --> <!-- video 2 --> <div class="card card-shadow text-center"> <div class="card-body"> <h4 class="card-title"><b>What is Git?</b></h4> <p class="card-text"></p> <div class="dropdown-divider"></div> <div class="embed-responsive embed-responsive-16by9"> <iframe class="embed-responsive-item" src="https://player.vimeo.com/video/41381741" allowfullscreen></iframe> </div> </div> </div> <!-- vodeo 2 --> </div> </div> <!-- Cardsrow 3--> </div> </div> </div> </div> </section> <!-- Footer --> <footer class="py-5 bg-dark"> <div class="container"> <!-- <p class="m-0 text-center text-white">Copyright © swarmlab.io 2020</p> --> </div> <!-- /.container --> </footer> <!-- Bootstrap core JavaScript --> <script src="/vendor/jquery/jquery.min.js"></script> <script src="/vendor/bootstrap/js/bootstrap.bundle.min.js"></script> <!-- Plugin JavaScript --> <script src="/vendor/jquery-easing/jquery.easing.min.js"></script> <!-- Custom JavaScript for this theme --> <script src="/js/scrolling-nav.js"></script> <script> $('#search').on('keyup keypress', function(e) { var keyCode = e.keyCode || e.which; if (keyCode === 13) { e.preventDefault(); return false; } }); $('#search').keyup(function (){ $('.card').removeClass('d-none'); var filter = $(this).val(); // get the value of the input, which we filter on $('.card-deck').find('.card .card-body h4:not(:contains("'+filter+'"))').parent().parent().addClass('d-none'); }) $('#btnSort').click(function (){ $('.card-deck .card').sort(function(a,b) { return $(a).find(".card-title").text() > $(b).find(".card-title").text() ? 1 : -1; }).appendTo(".card-deck"); }) </script> </body> </html>