<div class="section data relative" ng-class="{closed: !inputData}">
    <a href="javascript:;" ng-init="inputData=true" ng-click="inputData=!inputData">
        Input data
    </a>
    <button ng-disabled="editInput || !input || !moduleAdded || unsupportedType" ng-click="editInput=true" class="btn btn-info edit-input">Edit</button>
    <div ng-if="inputData">
        <div class="build-input-form" ng-switch on="item.type" ng-repeat="item in input" ng-init="itemIndx=$index">
            <div ng-switch-when="list">
                <div><b>{{ item.label }}</b></div>
                <div ng-init="multiresponse = item.subtype.constructor.name === 'Array'" class="responses">
                    <div class="response response-list" ng-class="{multiresponse}" ng-repeat="response in item.response track by $index">
                        <div ng-if="multiresponse">
                            <div ng-switch on="subitem.type" ng-repeat="subitem in item.subtype">
                                <div ng-switch-when="string">
                                    <label ng-class="{editInput}">
                                        <span>{{ subitem.label }}:</span>
                                        <input ng-if="editInput"
                                               placeholder="{{ subitem.question }}"
                                               ng-model="response[subitem.key]"/>
                                        <span class="text-input-value" ng-if="!editInput">
                                            {{ response[subitem.key] }}
                                        </span>
                                    </label>
                                </div>
                                <div ng-switch-default>
                                    <h4 ng-init="setUnsupportedType()" class="margin-top">This module uses input type(s) which are not yet supported in Mission Portal</h4>
                                </div>
                            </div>
                        </div>
                        <div ng-if="!multiresponse" class="single-list">
                            <div ng-switch on="item.subtype.type">
                                <div ng-switch-when="string">
                                    <label ng-class="{editInput}">
                                        <input ng-if="editInput" placeholder="{{ item.subtype.question }}"
                                               ng-model="item.response[$index]"
                                        />
                                        <span class="text-input-value" ng-if="!editInput">
                                            {{ item.response[$index] }}
                                        </span>
                                    </label>
                                </div>
                            </div>
                        </div>
                        <i ng-if="editInput" class="bi bi-x remove-item"
                           ng-click="removeResponse(itemIndx, $index)"></i>
                    </div>
                </div>
                <h5 class="muted" ng-if="!item.response.length && !editInput">
                    (Not set)
                </h5>
                <button ng-if="editInput" class="btn btn-link add-item" ng-click="addResponse($index)"><i
                            class="bi bi-plus"></i> Add
                </button>
            </div>
            <div ng-switch-when="string">
                <label ng-class="{editInput}">
                    <span>{{ item.label }}:</span>
                    <input ng-if="editInput" placeholder="{{ item.question }}" ng-model="item.response"/>
                    <span ng-if="item.response && !editInput" class="text-input-value" >{{item.response}}</span>
                    <span ng-if="!item.response && !editInput" class="text-input-value muted" >{{item.question}}</span>
                </label>
            </div>
            <div ng-switch-default>
                <h4 ng-init="setUnsupportedType()" class="margin-top">This module uses input type(s) which are not yet supported in Mission Portal</h4>
            </div>
        </div>
        <div ng-if="editInput" class="input-buttons">
            <button ng-click="cancel()" class="btn btn-small btn-info">Cancel</button>
            <button ng-click="save()" class="btn btn-small btn-primary">Save</button>
        </div>
        <h4 class="no-supported-input" ng-show="!input && inputLoaded" class="margin-top">This module does not support
            input data</h4>
    </div>
</div>
