<!--
* Licensed to the Apache Software Foundation (ASF) under one
* or more contributor license agreements.  See the NOTICE file
* distributed with this work for additional information
* regarding copyright ownership.  The ASF licenses this file
* to you under the Apache License, Version 2.0 (the
* "License"); you may not use this file except in compliance
* with the License.  You may obtain a copy of the License at
*
*     http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
-->

<div class="clearfix">
  <ol class="breadcrumb pull-left">
    <li><a href="#/stackVersions">{{'common.versions' | translate}}</a></li>
    <li class="active" ng-if="editController">{{displayName}}&nbsp;<span
            class="sub-text">({{repoVersionFullName}})</span></li>
    <li class="active" ng-if="createController">{{'versions.register.title' | translate}}</li>
  </ol>

  <div class="pull-right deregister-button" ng-switch="deleteEnabled"  ng-if="editController">
    <button ng-switch-when="false" class="btn disabled btn-default" tooltip="Cannot delete version already installed.">{{'versions.deregister' | translate}}</button>
    <button ng-switch-when="true" class="btn btn-danger" ng-click="delete()">{{'versions.deregister' | translate}}</button>
  </div>
</div>
<hr>


<form class="form-horizontal register-version-form" role="form" name="versionRegForm" novalidate>
  <!-- left tabs begins --> 
  <div class="col-sm-2" id="list-stack-id" ng-if="createController"> 
    <ul class="nav nav-tabs tabs-left">  
      <li ng-repeat="stack in stackIds" ng-click="onStackIdChange()" ng-class="{'active' : stack.isSelected}">
        <a href="javascript:void(0);">{{stack.stackNameVersion}}</a>
      </li> 
    </ul> 
  </div> 

  <div ng-class="{'col-sm-10': createController}">
    <div class="tab-content">
      <div class="panel panel-default details-panel">
        <div class="panel-body">
          <div class="col-sm-3 .pull-left" id="current-stack-details" ng-if="editController"> 
            <table class='table table-borderless alert alert-info'>
              <tr>
                <td>{{'common.stack' | translate}}</td>
                <td><strong>{{activeStackVersion.stackNameVersion}}</strong></td>
              </tr>
              <tr>
                <td>{{'common.name' | translate}}</td>
                <td><strong>{{activeStackVersion.displayName}}</strong></td>
              </tr>
              <tr>
                <td>{{'common.version' | translate}}</td>
                <td><strong>{{activeStackVersion.actualVersion}}</strong></td>
              </tr>
            </table>
          </div>

          <div class="version-info" ng-if="createController">
            <div class="btn-group" dropdown>
              <button type="button" data-toggle="dropdown" class="btn dropdown-toggle btn-info">
                {{activeStackVersion.stackNameRepositoryVersion}}
                <span class="caret"></span>
              </button>
              <ul class="dropdown-menu">
                <li ng-repeat="version in allVersions" ng-click="setActiveVersion()" ng-if="version.visible">
                  <a href="javascript:void(0);">
                    {{version.stackNameRepositoryVersion}}
                    <span ng-if="version.stackDefault">{{'versions.defaultVersion' | translate}}</span>
                  </a>
                </li>
                <li>
                  <a href="javascript:void(0);" ng-click="addVersion()">
                    {{'versions.addVersion' | translate}} ...
                  </a>
                </li>
              </ul>
            </div>
            <div class="col-sm-7 pull-right form-inline repo-version-inline" ng-if="activeStackVersion.isNonXMLdata">
              <label class="control-label col-sm-1 repo-version-label">Name:</label>
              <div class="col-sm-11">
                <span class="control-label">
                  {{activeStackVersion.stackNameVersion}}
                </span>
                <span class="dot">.</span>
                <div class="form-group" ng-class="{'has-error' : versionRegForm.version.$error.pattern}">
                  <input class="form-control" name="version" type="text" ng-model="activeStackVersion.editableDisplayName" ng-pattern="subversionPattern"
                         placeholder="Version Number (0.0)" ng-change="updateCurrentVersionInput()" required/>
                </div>
                <div class="text-danger" ng-show="versionRegForm.version.$error.pattern">
                    &nbsp{{activeStackVersion.displayName}} Invalid.
                </div>
              </div>
            </div>
          </div>
          <br>
          <div class="version-contents-section" ng-class="{'version-contents-section-register-version': createController}">
            <table class="table table-striped table-condensed">
              <tr ng-repeat="service in activeStackVersion.services">
                <td class="col-sm-4">{{service.displayName}}</td>
                <td class="col-sm-8">{{service.version}}</td>
              </tr>
            </table>
          </div>
        </div>
      </div>
    </div>
  </div>

  <div id="upload-definition-file-panel" ng-if="createController">

    <div class="col-sm-12 big-radio clearfix" ng-class="{'disabled' : networkLost || useRedhatSatellite}">
      <input type="radio" ng-model="selectedOption.index" value="1" ng-change="togglePublicLocalOptionSelect()" ng-disabled="networkLost || useRedhatSatellite">
      <span>{{'versions.usePublic' | translate}}</span>
      <a id="public-disabled-link" href="javascript:void(0);" ng-if="networkLost" ng-click="showPublicRepoDisabledDialog()">{{'versions.networkIssues.networkLost'| translate}}</a>
    </div>
    <div class="col-sm-12 big-radio clearfix">
      <input type="radio" ng-model="selectedOption.index" value="2" ng-change="togglePublicLocalOptionSelect()">
      {{'versions.useLocal' | translate}}
    </div>
  </div>

  <div class="clearfix bottom-margin"></div>

  <form ng-class="{'visible': !allInfoCategoriesBlank()}" class="form-horizontal register-version-form hide-soft"
        role="form" name="repoRegForm" novalidate>
    <div class="panel panel-default repos-panel">
      <div class="panel-heading">
        <h3 class="panel-title">
          {{'versions.repos' | translate}}
          <button ng-show="supports.addingNewRepository" class="btn btn-primary pull-right btn-xs pull-up"
                  ng-click="addRepository()">
            <span class="glyphicon glyphicon-plus"></span>
            {{'common.add' | translate:'{ term: "Repository" }'}}
          </button>
        </h3>
      </div>
      <div class="panel-body">
        <div class="panel-inner">
          <div class="alert alert-info" role="alert">{{'versions.alerts.baseURLs' | translate}}</div>
          <div class="alert alert-warning hide-soft" ng-class="{'visible' : hasValidationErrors()}" role="alert">
            {{'versions.alerts.validationFailed' | translate}}
          </div>
          <div class="clearfix repo-table-title row-fluid">
            <div class="col-sm-2" id="os-label"><label>{{'versions.os' | translate}}</label></div>
            <div class="col-sm-2" id="name-label-adjust"><label>{{'common.name' | translate}}</label></div>
            <div class="col-sm-6" id="repo-base-url-label"><label>{{'versions.baseURL' | translate}} </label></div>
            <div class="btn-group pull-right tooltip-wrapper"
                 tooltip="{{(isAddOsButtonDisabled() && !useRedhatSatellite)? ('versions.alerts.allOsAdded' | translate) : ''}}"
                 dropdown>
              <button class="btn add-os-button dropdown-toggle" ng-disabled="isAddOsButtonDisabled()">
                <i class="fa fa-plus" aria-hidden="true"></i> {{'common.add' | translate}} &nbsp;<span
                      class="caret"></span></button>
              <ul class="dropdown-menu" ng-class="{'hidden': hasNotDeletedRepo()}">
                <li ng-repeat="os in osList"><a ng-if="os.selected==false" ng-click="addOS($event)">{{os.OperatingSystems.os_type}}</a>
                </li>
              </ul>
            </div>

          </div>
          <div class="alert alert-info hide-soft" ng-class="{'visible' : !osList || !osList.length}" role="alert">
            {{'versions.contents.empty' | translate}}
          </div>
          <div class="" ng-repeat="os in osList">
            <div ng-if="os.selected==true">
              <div class="clearfix border-bottom {{os.OperatingSystems.os_type}}">
                <!-- show selected os in list table-->
                <div class="col-sm-2 os-type-label">
                  <label>{{os.OperatingSystems.os_type}}</label>
                </div>
                <div class="col-sm-9">
                  <div class="form-group repo-name-url {{repository.Repositories.repo_name}}"
                       ng-class="{'has-error': repository.hasError }" ng-repeat="repository in os.repositories">
                    <span class="repo-name-label control-label col-sm-3">{{repository.Repositories.repo_id}}</span>
                    <div class="col-sm-7 repo-url">
                      <input type="text" class="form-control"
                             placeholder="{{(repository.Repositories.repo_name.indexOf('UTILS') < 0 )?('versions.repository.placeholder' | translate) : ''}}"
                             ng-model="repository.Repositories.base_url"
                             ng-change="onRepoUrlChange(repository)" ng-disabled="useRedhatSatellite">
                    </div>
                    <i class="fa fa-undo orange-icon cursor-pointer"
                       ng-if="selectedOption.index == 1 && repository.Repositories.base_url != repository.Repositories.initial_base_url
                       || selectedOption.index == 2 && repository.Repositories.base_url != ''
                       || editController && repository.Repositories.base_url != repository.Repositories.initial_base_url"
                       ng-click="undoChange(repository)"
                       tooltip-html-unsafe="{{'common.undo' | translate}}"
                       aria-hidden="true"></i>
                  </div>
                </div>
                <div class="col-sm-1 remove-icon" ng-click="removeOS()" ng-class="{'disabled' : useRedhatSatellite}"><i
                        class="fa fa-minus" aria-hidden="true"></i>{{'common.controls.remove' | translate}}
                </div>
              </div>
            </div>
          </div>
          <div class="clearfix advanced-radio-buttons">
            <div class="col-sm-9" id="skip-validation">
              <div class="checkbox">
                <label>
                  <input type="checkbox" ng-model="skipValidation" ng-change="clearErrors()"
                         ng-disabled="useRedhatSatellite">
                  <span ng-class="{'disabled' : useRedhatSatellite}">{{'versions.skipValidation' | translate}}</span>
                  <i class="fa fa-question-circle"
                     tooltip-html-unsafe="{{'versions.alerts.skipValidationWarning' | translate}}" aria-hidden="true"></i>
                </label>
              </div>
            </div>
            <div class="col-sm-9" id="use-redhat">
              <div class="checkbox">
                <label>
                  <input type="checkbox" ng-model="useRedhatSatellite" ng-change="clearErrors()"
                         ng-disabled="isPublicRepoSelected()">
                  <span ng-class="{'disabled' : isPublicRepoSelected()}"
                        tooltip="{{(isPublicRepoSelected())? ('versions.useRedhatSatellite.disabledMsg' | translate) : ''}}">{{'versions.useRedhatSatellite.title' | translate}}</span>
                  <i class="fa fa-question-circle"
                     tooltip-html-unsafe="{{'versions.alerts.useRedhatSatelliteWarning' | translate}}"
                     aria-hidden="true"></i>
                </label>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="col-sm-12">
      <button class="btn btn-primary pull-right left-margin" ng-click="save()"
              ng-disabled="isSaveButtonDisabled() || (createController && versionRegForm.version.$invalid)">{{'common.controls.save' | translate}}
      </button>
      <button class="btn btn-default pull-right" ng-click="cancel()">{{'common.controls.cancel' | translate}}</button>
    </div>
  </form>
</form>