<div class="row nomargin">
    <div class="col-md-12">
      <div class="col-md-12 gcDatatableCrud marginTop nopadding">
          <div class="row">
              <div class="col-xs-12 nopadding">
                  <div class="btn btn-primary btn-sm pull-right " ng-click="saveParameter()"
                          ng-disabled="!changedParameter('save') || (currentParameter.name && !validName(currentParameter.name))">
                      <translate>hpo.multicritere.parameters.save</translate>
                  </div>

                  <div class="btn btn-default btn-sm  pull-right marginLeft" ng-click="emptyParameter()"
                        ng-disabled="!changedParameter('empty') || (currentParameter.name && !validName(currentParameter.name))">
                      <translate>hpo.multicritere.parameters.empty</translate>
                  </div>

                  <div class="btn btn-sm  pull-right marginLeft {{ extra.class }}"
                            ng-if="extraFunctions && extraFunctions.length > 0"
                            ng-repeat="extra in extraFunctions | orderBy:'label' "
                            ng-click="extra.func(currentParameter)"
                            ng-disabled="!changedParameter('empty')">
                      <translate>{{ extra.label }}</translate>
                  </div>

                  <save-and-get-template-hpo config-name="configName"
                                          data="currentParameter"
                                          run-return="getReturnedTemplate"
                                          save-template-html="saveTemplateHtml"
                                          get-template-html="getTemplateHtml"
                                          exclude-properties="propertiestoexclude"
                                          special-pre-treatement="cleanBranch"
                                          disable-buttons="disableButtons"
                                          icons="true"></save-and-get-template-hpo>

                  <div class="btn btn-default btn-sm pull-left marginLeft"
                            ng-disabled="parameters_data && parameters_data.length > 0 && !parameters_control.collapse_all"
                            title="{{ 'hpo.common.collapse_all' | translate }}"
                            ng-click="parameters_control.collapse_all()">
                      <i class="fa fa-minus"></i>
                  </div>
                  <div class="btn btn-default btn-sm pull-left marginLeft"
                            ng-disabled="parameters_data && parameters_data.length > 0 && !parameters_control.expand_all"
                            title="{{ 'hpo.common.expand_all' | translate }}"
                            ng-click="parameters_control.expand_all()">
                      <i class="fa fa-plus"></i>
                  </div>

                  <div class="btn btn-success btn-sm pull-left marginLeft"
                            ng-disabled="parameters_data && parameters_data.length > 0 && parameters_data[0].isNew"
                            ng-click="addParameter()">
                      <translate>{{ addTitle }}</translate>
                  </div>

                  <div class="btn btn-danger btn-sm pull-left marginLeft"
                          ng-hide="!currentParameter || !currentParameter.uid"
                          ng-disabled="!currentParameter && !currentParameter.uid"
                          ng-click="removeParameter()">
                      <translate ng-show="currentParameter.uid && currentParameter.special !== 'categorie'">{{ removeTitle }}</translate>
                      <translate ng-show="currentParameter.special === 'categorie'">hpo.multicritere.parameters.removecategorie</translate>
                  </div>

                  <div class="label label-info pull-left marginLeft smallmargintop">
                      <span class="badge badge-pill">{{ calcParameters("categorie") }}</span>
                      <translate>hpo.multicritere.parameters.categories</translate>
                  </div>
                  <div class="label label-info pull-left marginLeft smallmargintop">
                      <span class="badge badge-pill">{{ calcParameters("params") }}</span>
                      <translate>{{ elementsNames }}</translate>
                  </div>

              </div>
          </div>
      </div>
    </div>
    <div class="col-md-12 marginTop nopadding">

      <div class="alert alert-info" ng-if="!parameters_data || parameters_data.length == 0">
        <translate>hpo.multicritere.parameters.nodata</translate>
      </div>
      <div class="alert alert-danger" ng-show="currentParameter.name && !validName(currentParameter.name)">
        <span>{{ ('hpo.multicritere.parameters.unacceptedcaracters' | translate ) + " " + attributes.join(", ")}}</span>
     </div>
      <div class="renderedForm" ng-if="parameters_data && parameters_data.length > 0">
          <div class="row wrapper"  style="min-height: {{minheight}}">
              <div class="tree" >
                <abn-tree tree-data="parameters_data"
                          tree-control="parameters_control"
                          initial-selection="undefined"
                          class="full-height"
                          on-select= "tree_handler(branch)"></abn-tree>
          </div>

          <div  class="render" style="min-height: {{minheight}}; overflow-y : auto; float: right;">
            <div class="col-md-12">

                  <div class="col-md-12" ng-if="currentParameter &&
                          currentParameter.special === 'categorie' &&
                          currentParameter.children && currentParameter.children.length > 0 " >
                    <div class="col-md-6 col-md-offset-3 nopadding marginBottom">
                      <div class="col-md-12">
                        <div class="search">
                          <span class="fa fa-filter"></span>
                          <input type="text" ng-model="filtering.filterValue" class="form-control"
                              placeholder="{{ 'hpo.data.prepare.filter' | translate }}"
                          ng-keydown="filtering.filterValue = $event.keyCode === 27 ? '' : filtering.filterValue "/>
                          <a ng-show="filtering.filterValue.length > 0" ng-click="filtering.filterValue = ''">
                            <span class="fa fa-times-circle"></span>
                          </a>
                        </div>
                      </div>
                    </div>
                  </div>
                  <div class="col-md-12 marginTop">
                    <div class="col-md-4 marginBottom" ng-hide="(!filterFunc(filtering.filterValue,result.name) || !result.name) &&
                                            (!filterFunc(filtering.filterValue,result.commentaire) || !result.commentaire)"
                                            ng-repeat="result in currentParameter.children | orderBy:'name'">
                      <div class="col-md-12 nopadding">
                        <div class="card card-hpo-dashboard card-info" ng-class="{ '' : (($index+1) % 10) <= 3 ,
                                              'block-info' : (($index+1) % 10) > 3 && (($index+1) % 10) <= 6 ,
                                              'block-success' : (($index+1) % 10) > 6 && (($index+1) % 10) <= 9  }">
                          <div class="card-block">
                              <h4 class="card-header">
                                <div class="col-md-12">
                                    <button type="button" class="btn btn-default btn-sm pull-right"
                                                          ng-click="selectBranch(result)">
                                          <i class="fa fa-info"></i>
                                    </button>
                                </div>
                              </h4>
                              <div class="card-body marginTop">
                                <div class="form-group clearfix">
                                  <div class="col-xs-12">
                                      <label><translate>model.featuretypes.attributes.name</translate></label>
                                      <input type="text"
                                         class="form-control"
                                         ng-model="result.name"
                                         limit="25" disabled/>
                                  </div>
                                </div>
                                <div class="form-group clearfix" ng-if="types && types.length > 0">
                                  <div class="col-xs-12">
                                    <label><translate>hpo.multicritere.parameters.type.title</translate></label>

                                    <select class="form-control"
                                       ng-init="result.type = result.type || types[0].id"
                                       ng-model="result.type" disabled>
                                       <option ng-value="type.id"
                                                ng-repeat="type in types | orderBy:'label'"
                                                ng-selected="result.type === type.id" >
                                         {{ type.label }}
                                       </option>
                                     </select>
                                  </div>
                                </div>
                                <!-- <div class="form-group clearfix">
                                  <div class="col-xs-12">
                                      <label><translate>hpo.common.commentaire</translate></label>
                                      <textarea type="textarea" class="form-control" id="inputalias"
                                        ng-model="result.commentaire" disabled/>
                                  </div>
                                </div> -->
                              </div>
                            </div>
                          </div>
                      </div>
                    </div>
                  </div>
              </div>

              <div class="col-md-12 marginTop" ng-if="currentParameter &&
                        (currentParameter.type || currentParameter.isNew)">
                <div class="alert alert-danger" ng-if="parameters_data && parameters_data.length > 0 &&
                                    currentParameter && currentParameter.hasOwnProperty('type') &&
                                    nameExistsInData(currentParameter)">
                  <translate>hpo.multicritere.parameters.nameExist</translate>
                </div>

                <div class="form-group clearfix">
                  <div class="nopaddingLeft" ng-class="{ 'col-xs-6' : types && types.length > 0 , 'col-xs-4' : !types || types.length === 0 }">
                      <label class="required"><translate>hpo.multicritere.parameters.categorie</translate></label>

                      <div class="input-group">
                        <input type="text"
                           class="form-control"
                           ng-show="tapecategorie"
                           ng-model="currentParameter.categorie"
                           limit="25" required/>
                       <select
                          class="form-control"
                          ng-show="!tapecategorie"
                          ng-model="currentParameter.categorie"
                          ng-options="categorie for categorie in categories | orderBy:'toString()' "
                          limit="25" required>
                          <option value="" disabled selected hidden translate
                           ng-show="!currentParameter.categorie">model.featuretypes.actions.choisir</option>
                        </select>
                        <span class="input-group-addon btn btn-md btn-primary btn-outline-secondary"
                             ng-click="tapecategorie = !tapecategorie ; changedCategorieSelectionMode(tapecategorie);"
                             title="{{ tapecategorie ?
                                    'hpo.multicritere.parameters.select' :
                                    'hpo.multicritere.parameters.tape' | translate }}" >
                          <i class="fa"
                             ng-class="{'fa-list' : tapecategorie , 'fa-pencil' : !tapecategorie }"></i>
                        </span>
                      </div>
                  </div>

                  <div class="col-xs-6" ng-if="types && types.length > 0">
                      <label class="required"><translate>hpo.multicritere.parameters.type.title</translate></label>

                      <select class="form-control"
                         ng-init="currentParameter.type = currentParameter.type || types[0].id"
                         ng-model="currentParameter.type">
                         <option value="" disabled
                              ng-if="!currentParameter.type"
                              selected
                              hidden translate>model.featuretypes.actions.choisir</option>
                         <option ng-value="type.id"
                                  ng-repeat="type in types | orderBy:'label'"
                                  ng-selected="currentParameter.type === type.id">
                           {{ type.label }}
                         </option>
                       </select>
                  </div>

                  <div class="col-xs-4 nopaddingLeft" ng-if="!types || types.length === 0">
                      <label class="required"><translate>model.featuretypes.attributes.name</translate></label>
                      <input type="text"
                         class="form-control"
                         ng-model="currentParameter.name"
                         limit="25" required/>
                  </div>

                  <div class="col-xs-4" ng-if="!types || types.length === 0">
                      <label><translate>hpo.common.commentaire</translate></label>
                      <textarea type="textarea" class="form-control" id="inputalias"
                        placeholder="{{ 'hpo.common.easycomment' | translate }}"
                        ng-model="currentParameter.commentaire" required/>
                  </div>

                </div>

                <div class="form-group clearfix" ng-if="types && types.length > 0">
                  <div class="col-xs-6 nopaddingLeft">
                      <label class="required"><translate>model.featuretypes.attributes.name</translate></label>
                      <input type="text"
                         class="form-control"
                         ng-model="currentParameter.name"
                         limit="25" required/>
                  </div>

                  <div class="col-xs-6">
                      <label><translate>hpo.common.commentaire</translate></label>
                      <textarea type="textarea" class="form-control" id="inputalias"
                        placeholder="{{ 'hpo.common.easycomment' | translate }}"
                        ng-model="currentParameter.commentaire" required/>
                  </div>
                </div>
              </div>

              <div ng-include="multicritereTemplate"></div>

            </div>
          </div>
        </div>
      </div>
    </div>
</div>
