@(runningExtractors: List[ExtractorInfo], selectedExtractors: List[String])(implicit user: Option[models.User])
@import _root_.util.Formatters._
@import helper._

@main("Extractors") {
    <div>
        <ol class="breadcrumb">
            <li><span class="glyphicon glyphicon-fullscreen"></span> Extractors</li>
        </ol>
    </div>
    @if(runningExtractors.size == 0) {
        <div class="page-header">
            <h1> No extractors running</h1>
        </div>
    } else {
        <div class="page-header">
            <h1> Update Extractors </h1>
        </div>

        @form(action = routes.Extractors.updateExtractors(), 'id -> "formOne", 'enctype -> "multipart/form-data", 'class -> "form-horizontal") {

            <table class="table">
                <thead>
                    <tr>
                        <th>Enabled</th>
                        <th>Name</th>
                        <th>Description</th>
                        <th>Author</th>
                        <th>Process Triggers</th>
                    </tr>
                </thead>
                <tbody>

                        <!-- Display all running extractors. If extractor already in this space, check the box. -->
                    @runningExtractors.map { extractor =>
                        <tr>
                            <td><input type="checkbox" name="extractors" value="@extractor.name"
                                @if(selectedExtractors.contains(extractor.name)) {checked} else {unchecked}></td>
                            <td>@extractor.name</td>
                            <td>@extractor.description</td>
                            <td>@extractor.author</td>
                            <td>
                                    <!-- TODO: Hide full text behind a modal? Possible to show truncated preview here? -->
                                <p @if(extractor.process.dataset.isEmpty) {hidden}>
                                Datasets:
                                <span @if(extractor.process.dataset.length > 1) {hidden}>@extractor.process.dataset</span>
                                <ul @if(extractor.process.dataset.length == 1) {hidden}>
                                @extractor.process.dataset.map { eventName =>
                                    <li>@eventName</li>
                                }
                                </ul>
                                </p>
                                <p @if(extractor.process.file.isEmpty) {hidden}>
                                Files:
                                <span @if(extractor.process.file.length > 1) {hidden}>@extractor.process.file</span>
                                <ul @if(extractor.process.file.length == 1) {hidden}>
                                @extractor.process.file.map { fileType =>
                                    <li>@fileType</li>
                                }
                                </ul>
                                </p>
                                <p @if(extractor.process.metadata.isEmpty) {hidden}>
                                Metadata:
                                <span @if(extractor.process.metadata.length > 1) {hidden}>@extractor.process.metadata</span>
                                <ul @if(extractor.process.metadata.length == 1) {hidden}>
                                @extractor.process.metadata.map { eventName =>
                                    <li>@eventName</li>
                                }
                                </ul>
                                </p>
                                <p @if(!extractor.process.metadata.isEmpty
                                    || !extractor.process.file.isEmpty
                                    || !extractor.process.dataset.isEmpty) {hidden}>
                                None
                                </p>
                            </td>
                        </tr>
                    }
                </tbody>
            </table>
            <div class="form-actions">
                <button type="submit" class="btn btn-primary" name = "submitValue" value="Update"><span class='glyphicon glyphicon-send'></span> Update</button>
                <a class="btn btn-default" id="cancel_space"><span class="glyphicon glyphicon-remove" ></span> Cancel</a>
            </div>
            } <!-- end of form -->
    }
}