<!DOCTYPE html>
<!--
Copyright (C) 2025 twagoo

This program is free software: you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.

This program is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
GNU General Public License for more details.

You should have received a copy of the GNU General Public License
along with this program.  If not, see <http://www.gnu.org/licenses/>.
-->
<html>
    <head> 
        <title>CLARIN Tool Portal</title> 
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1" />
        <link rel="icon" href="data:," />
        <link href="/webjars/font-awesome/7.0.1/css/fontawesome.css" rel="stylesheet" />
        <link href="/webjars/font-awesome/7.0.1/css/solid.css" rel="stylesheet" />
        <link href="/webjars/bootstrap/5.3.8/css/bootstrap.min.css" rel="stylesheet" />
        <link href="/css/style.css" rel="stylesheet" />
        <script src="/webjars/bootstrap/5.3.8/js/bootstrap.bundle.min.js" defer></script>
        <script src="/webjars/htmx.org/2.0.7/dist/htmx.min.js" defer></script>
        <script src="/webjars/alpinejs/3.15.0/dist/cdn.min.js" defer></script>
        
<script type="text/javascript" src="//script.crazyegg.com/pages/scripts/0132/2204.js" async="async" ></script>


<script type="text/javascript">
    document.addEventListener("DOMContentLoaded", function () {
        const
                MODAL_SHOW_INTERVAL_MS = 60 * 60 * 1000, //do not show modal more than once per hour
                MODAL_ID = '#testInfoModal',
                STORAGE_PROP = 'testInfoModalShown',
                now = new Date(),
                isHomePage = (document.getElementById('homePageMain') !== null);

        var showTestInfoModal = true;
        if (localStorage) {
            const lastShown = localStorage.getItem(STORAGE_PROP);
            if (lastShown !== null) {
                if (!isHomePage) {
                    //show only if on home page unless never shown before
                    showTestInfoModal = false;
                } else if ((now - Date.parse(lastShown)) < MODAL_SHOW_INTERVAL_MS) {
                    //don't show modal if already shown recently
                    console.log('Not showing info modal, already shown on/at', lastShown);
                    showTestInfoModal = false;
                }
            }
        }

        if (showTestInfoModal) {
            const modal = new bootstrap.Modal(MODAL_ID);
            modal.show();
            if (localStorage) {
                localStorage.setItem(STORAGE_PROP, now);
            }
        }
    });
</script>


    </head>

    <body>
        <div class="container-xl">

            <nav class="navbar navbar-expand-lg bg-body-tertiary">
            <div class="container-fluid">
                <a class="navbar-brand" href="/">CLARIN Tool Portal <span class="fs-6 text-danger">prototype</span></a>
                <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
                    <span class="navbar-toggler-icon"></span>
                </button>
                <div class="collapse navbar-collapse" id="navbarSupportedContent">
                    <ul class="navbar-nav me-auto mb-2 mb-lg-0">
                        <li class="nav-item">
            <a class="nav-link" 
               href="/search">Search</a>
        </li>
                        <!--                        <li th:replace="~{::top-navigation-item('contributors','/contributors',${current})}">
                                                    [Contributors]
                                                </li>-->
                        <li class="nav-item">
            <a class="nav-link" 
               href="/help">Help</a>
        </li>
                    </ul>
                </div>
            </div>
        </nav>

            <main>


                <div class="mt-3">
                    <form action="/search">
                        <div class="d-flex">
                            <div class="ms-auto w-50 p-2">
                                <input type="search" class="form-control"
                                       name="q" value="" />
                                
                            </div>
                            <div class="p-2">
                                <input type="submit" class="btn btn-primary"
                                       value="Search" />
                            </div>
                        </div>
                    </form>
                </div>

                <nav aria-label="breadcrumb">
                    <ol class="breadcrumb">
                        <li class="breadcrumb-item"><a href="/">Home</a></li>
                        <li class="breadcrumb-item"><a href="/search?q=&amp;fq=organisation:Utrecht%20University">Search</a></li>
                        <li class="breadcrumb-item active" aria-current="page">Record</li>
                    </ol>
                </nav>

                <div class="container-md">
                    <div class="row mt-md-2">
                        <div class="col-md-8">
                            <h1>Automatic Transcription of Oral History Interviews</h1>
                        </div>

                        <div class="col-md-4">
                            <div class="mt-2 mb-2">
                                
                            </div>
                        </div>
                    </div>

                    <div class="row">
                        <div class="col-md-8">

                            <div>

        <ul id="mainContentTabsNav" class="nav nav-underline border-bottom" 
            hx-boost="true"
            hx-target="#recordTabsContent"
            hx-swap="innerHTML show:none">

            <li class="nav-item">
        <a class="nav-link active"
           hx-select-oob="#mainContentTabsNav"
           aria-current="page"
           href="/records/CSD_32_Tools_47_OralHistory.cmdi.xml"
           hx-select="#recordOverview">Overview</a>



            <li class="nav-item">
        <a class="nav-link"
           hx-select-oob="#mainContentTabsNav"
           href="/records/CSD_32_Tools_47_OralHistory.cmdi.xml/metadata"
           hx-select="#recordAllMetadata">Detailed metadata</a>



            <li class="nav-item">
        <a class="nav-link"
           hx-select-oob="#mainContentTabsNav"
           href="/records/CSD_32_Tools_47_OralHistory.cmdi.xml/links"
           hx-select="#recordLinks">Links</a>


        </ul>

        <div id="recordTabsContent" class="pt-2">

            

            

            <div>
                <div class="pt-2" id="recordOverview">
                <div class="mb-2" >
                    <p>This webservice and web application uses automatic speech recognition to provide the transcriptions of recordings spoken in Dutch. You can upload and process only one file per project. For bulk processing and other questions, please contact Henk van den Heuvel at h.vandenheuvel@let.ru.nl.</p>
                </div>
            </div>
            </div>
        </div>
    </div>

                        </div>
                        <div class="col-md-4">

                            <div class="me-2">
                                <div class="mb-2">
                                    
                                </div>
                                <div class="mb-2">
                                    
                                        <strong>Organisation:</strong><br />
                                        <ul class="list-group list-group-flush">
                                            <li class="list-group-item">Utrecht University</li>
                                            <li class="list-group-item">Radboud University Nijmegen</li>
                                        </ul>
                                    
                                </div>
                                <div class="mb-2">
                                    
                                </div>
                            </div>

                            <div class="mt-2 mb-2">
                                <h2 class="h5">Resources:</h2>
                                <div class="card mb-2">
                                    <div class="card-body">
                                        <h3 class="h5 card-title">Resource</h3>
                                        <div class="h6 card-subtitle mb-2 text-body-secondary">audio/wav</div>
                                        
                                        <div>
                                            <a class="btn btn-outline-secondary btn-sm" href="https://webservices-lst.science.ru.nl/oral_history">
                                                <i class="fa-solid fa-cloud-arrow-down"></i>
                                                Access
                                            </a>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </main>

            
            <footer class="row row-cols-1 row-cols-md-3 py-4 my-5 text-bg-light">
                <div class="col mb-3">
                    <p class="text-body-secondary"><a href="/help">About</a></p>
                    <p class="text-body-secondary">vdevelop</p>
                </div>
                <div class="col mb-3 text-md-center">
                    <p>Service provided by <a href="https://www.clarin.eu">CLARIN</a></p>
                    <p class="text-body-secondary">
                        <span class="text-light footer-hidden-info">
                            built: 2026-03-10T17:19:26Z; revision: da2b1be
                        </span>
                    </p>
                </div>
                <div class="col mb-3 text-md-end">
                    <p><a href="mailto:toolportal@clarin.eu">Contact</a></p>
                </div>
            </footer>
            

<div id="testInfoModal" class="modal" tabindex="-1">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title">Session recording</h5>
      </div>
      <div class="modal-body">
        <p>
            The version of the Tool Portal that you are currently using
            is <strong>recording the behaviour of its user for testing purposes.</strong>
            By pressing "Continue" below, you agree to the recording of your
            actions while using this site. If you do not wish to agree to this,
            please navigate away from this site.
        </p>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-primary" data-bs-dismiss="modal">Continue</button>
        <a class="btn btn-secondary" href="https://www.clarin.eu">Leave</a>
      </div>
    </div>
  </div>
</div>


        

        </div>
    </body>
</html>
