Spaces:
Runtime error
Runtime error
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta property="og:title" content="MIRACL 🌍🙌🌏"> | |
| <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-Zenh87qX5JnK2Jl0vWa8Ck2rdkQ2Bzep5IDxbcnCeuOxjzrPF/et3URy9Bv1WTRi" crossorigin="anonymous"> | |
| <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.9.1/font/bootstrap-icons.css"> | |
| <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-OERcA2EqjJCMA+/3y+gxIOqMEjwtxJY7qPCqsdltbNJuaOe923+mo//f6V8Qbsw3" crossorigin="anonymous"></script> | |
| <script src="https://cdn.jsdelivr.net/npm/jquery@3.6.1/dist/jquery.min.js"></script> | |
| <script> | |
| $SCRIPT_ROOT = {{ request.script_root|tojson }}; | |
| $( document ).ready(function() { | |
| $("#loading").hide(); | |
| $('#language').val("{{lang}}"); | |
| }); | |
| $(function() { | |
| $('#language').on('change', function() { | |
| $.getJSON($SCRIPT_ROOT + '/lang', { | |
| new_lang: this.value, | |
| }, function(data) { | |
| $("#language").removeAttr('disabled'); | |
| $("#loading").hide(); | |
| }); | |
| $(this).attr('disabled','disabled'); | |
| $("#loading").show(); | |
| return false; | |
| }); | |
| }); | |
| </script> | |
| <title>MIRACL 🌍🙌🌏 Demo</title> | |
| </head> | |
| <body> | |
| <h2>MIRACL 🌍🙌🌏 Demo</h2> | |
| <h4>Multilingual Information Retrieval Across a Continuum of Languages</h4> | |
| <br/> | |
| <p class="lead"> | |
| <a href="http://miracl.ai/">MIRACL</a> is a multilingual dataset for ad hoc retrieval that consists of 18 different languages, collectively encompassing over three billion native speakers around the world. | |
| </p> | |
| <div class="row g-3 align-items-center"> | |
| <label class="col-auto" for="language">This demo running on the language</label> | |
| <div class="col-auto"> | |
| <select class="form-select form-select-sm" aria-label=".form-select-sm" id="language"> | |
| <option value="ar">Arabic</option> | |
| <option value="bn">Bengali</option> | |
| <option value="en">English</option> | |
| <option value="es">Spanish</option> | |
| <option value="fa">Persian</option> | |
| <option value="fi">Finnish</option> | |
| <option value="fr">French</option> | |
| <option value="hi">Hindi</option> | |
| <option value="id">Indonesian</option> | |
| <option value="ja">Japanese</option> | |
| <option value="ko">Korean</option> | |
| <option value="ru">Russian</option> | |
| <option value="sw">Swahili</option> | |
| <option value="te">Telugu</option> | |
| <option value="th">Thai</option> | |
| <option value="zh">Chinese</option> | |
| </select> | |
| </div> | |
| <div class="col-auto"> | |
| <div class="spinner-border text-secondary" role="status" id="loading"> | |
| <span class="visually-hidden">Loading...</span> | |
| </div> | |
| </div> | |
| <div class="col-auto"> | |
| <span> | |
| retrieves passages using <em>{{retriever}}</em>. | |
| </span> | |
| </div> | |
| </div> | |
| <br/> | |
| <div class="container text-center"> | |
| {% for message in get_flashed_messages() %} | |
| <div class="alert">{{ message }}</div> | |
| {% endfor %} | |
| <form action="/search" method="post"> | |
| <div class="row-cols-3"> | |
| <div class="input-group mb-3"> | |
| <input type="text" class="form-control" placeholder="Enter a Question" aria-label="Question" name="q" aria-describedby="button-addon2" value="{{query if query else ''}}"> | |
| <button class="btn btn-outline-secondary" type="submit" id="button-addon2"><i class="bi bi-search"></i></button> | |
| </div> | |
| </div> | |
| </form> | |
| {% if search_results %} | |
| <div class="row"> | |
| <table class="table"> | |
| <thead> | |
| <tr> | |
| <th scope="col">#</th> | |
| <th scope="col">Score</th> | |
| <th scope="col">Passage ID</th> | |
| <th scope="col">Title</th> | |
| <th scope="col">Content</th> | |
| </tr> | |
| </thead> | |
| <tbody class="table-group-divider"> | |
| {% for res in search_results %} | |
| <tr class="{{'table-secondary' if res['rank'] % 2 else 'table-light'}}"> | |
| <th scope="row">{{res["rank"]}}</th> | |
| <td>{{"%.2f"|format(res["score"])}}</td> | |
| <td>{{res["docid"]}}</td> | |
| <td>{{res["title"]}}</td> | |
| <td style="word-wrap: break-word;min-width: 600px;max-width: 600px;" class="text-{{'end' if lang in ('ar', 'fa') else 'start'}}"> | |
| <small>{{res["doc"]}}</small> | |
| </td> | |
| </tr> | |
| {% endfor %} | |
| </tbody> | |
| </table> | |
| </div> | |
| {% endif %} | |
| </div> | |
| </body> | |
| </html> |