<h1 class="unboxed">What type of data are you importing?</h1>

<gn-settings-frame section="imports" project="project">
    <div ng-show="!validData" class="alert alert-danger">
        <strong>Cannot read tabular data.</strong> The file you have uploaded cannot 
        be interpreted correctly as tabular data. Please make sure that the data you're 
        submitting is in CSV (comma-separated values) format.
    </div>

    <div ng-show="validData">
        <div class="form-group row" ng-show="canRelationsMode()">
            <label class="col-xs-1 control-label">
                <input type="radio" ng-model="data.mode" value="relations">
            </label>
            <div class="col-xs-11">
                <strong>A list of relations between entities</strong>
                <p class="help-block">
                    The data contains identifiers for two entities, data regarding their 
                    relationship and, optionally, further attributes related to the 
                    entities.
                </p>
            </div>
        </div>

        <div ng-show="data.mode=='relations'">
            <div class="form-group row">
                <label class="col-sm-offset-1 col-sm-2 control-label">
                    Relation schema:
                </label>
                <div class="col-sm-9">
                    <select class="form-control"
                        ng-options="s.name as s.label for s in relationSchemaOptions"
                        ng-model="relationSchema"></select>
                    <p class="help-block">
                        Select the type of relation which you'd like to use for 
                        importing the data. 
                    </p>
                </div>
            </div>

            <div class="form-group row">
                <label class="col-sm-offset-1 col-sm-2 control-label">
                    Source schema:
                </label>
                <div class="col-sm-9">
                    <select class="form-control"
                        ng-options="s.name as s.label for s in entitySchemaOptions"
                        ng-model="sourceSchema"></select>
                    <p class="help-block">
                        Select the type of entity which best describes the source entities
                        contained in the dataset.
                    </p>
                </div>
            </div>

            <div class="form-group row">
                <label class="col-sm-offset-1 col-sm-2 control-label">
                    Target schema:
                </label>
                <div class="col-sm-9">
                    <select class="form-control"
                        ng-options="s.name as s.label for s in entitySchemaOptions"
                        ng-model="targetSchema"></select>
                    <p class="help-block">
                        Select the type of entity which best describes the target entities
                        contained in the dataset.
                    </p>
                </div>
            </div>
        </div>

        <div class="form-group row">
            <label class="col-xs-1 control-label" for="file">
                <input type="radio" ng-model="data.mode" value="entities">
            </label>
            <div class="col-xs-11">
                <strong>A list with details about entities</strong>
                <p class="help-block">
                    Each row contains identifiers for a single entity, as well as other 
                    attributes that help to describe the entity. No information about 
                    their relations to other entities will be imported.
                </p>
            </div>
        </div>

        <div ng-show="data.mode=='entities'">
            <div class="form-group row">
                <label class="col-sm-offset-1 col-sm-2 control-label">
                    Entity schema:
                </label>
                <div class="col-sm-9">
                    <select class="form-control"
                        ng-options="s.name as s.label for s in entitySchemaOptions"
                        ng-model="entitySchema"></select>
                    <p class="help-block">
                        Select the type of entity which you'd like to use for 
                        importing the data. 
                    </p>
                </div>
            </div>
        </div>

        <div class="form-group row">
            <label class="col-xs-1 control-label" for="file">
                <input type="radio" ng-model="data.mode" value="aliases">
            </label>
            <div class="col-xs-11">
                <strong>A list of alternate names for entities</strong>
                <p class="help-block">
                    The data identifies entities and gives alternate names (aliases) for 
                    those entities to improve name-based matching of entities.
                </p>
            </div>
        </div>
    </div>

    <div class="btn-group">
      <button type="button" class="btn btn-default" ng-click="uploadFile()"
        ><i class="fa fa-chevron-circle-left"></i> Upload a different file</button>
      <button type="button" class="btn btn-primary" ng-disabled="!data.mode || !validData" ng-click="defineMapping()">
        Proceed <i class="fa fa-chevron-circle-right"></i></button>
    </div>
</gn-settings-frame>
