<div class="editVersion tagManagerManageEdit"
     piwik-content-block
     feature="Tag Manager"
     content-title="{{ editVersion.editTitle }}">

    <p ng-show="editVersion.model.isLoading">
        <span class="loadingPiwik"><img src="plugins/Morpheus/images/loading-blue.gif"/> {{ 'General_LoadingData'|translate }}</span>
    </p>

    <p ng-show="editVersion.model.isUpdating">
        <span class="loadingPiwik"><img src="plugins/Morpheus/images/loading-blue.gif"/> {{ 'TagManager_UpdatingData'|translate }}</span>
    </p>

    <form ng-submit="editVersion.edit ? editVersion.updateVersion() : editVersion.createVersion()">

        <div id="versionNameHelpText" class="inline-help-node">
            {{ 'TagManager_VersionNameHelp'|translate }}
            <br /><br />
            <span ng-show="editVersion.lastVersion" ng-bind-html="'TagManager_NameOfLatestVersion'|translate:'<strong>' + editVersion.lastVersion + '</strong>'"></span>
        </div>

        <div>
            <div piwik-field uicontrol="text" name="name"
                 ng-model="editVersion.version.name"
                 maxlength="30"
                 ng-change="editVersion.setValueHasChanged()"
                 title="{{ 'TagManager_VersionName'|translate }}"
                 inline-help="#versionNameHelpText">
            </div>

            <div piwik-field uicontrol="text" name="description"
                 ng-model="editVersion.version.description"
                 ng-change="editVersion.setValueHasChanged()"
                 title="{{ 'TagManager_VersionDescription'|translate }}"
                 inline-help="{{ 'TagManager_VersionDescriptionHelp'|translate }}">
            </div>

            <div piwik-save-button
                 class="createButton"
                 onconfirm="editVersion.edit ? editVersion.updateVersion() : editVersion.createVersion()"
                 data-disabled="editVersion.model.isUpdating || !editVersion.isDirty"
                 value="{{ editVersion.edit ? ('CoreUpdater_UpdateTitle'|translate) : ('TagManager_CreateVersionWithoutPublishing'|translate) }}"
                 saving="editVersion.model.isUpdating">
            </div>

            <div id="selectTagManagerEnvironmentHelp" class="inline-help-node">
                <div>{{ 'TagManager_VersionEnvironmentHelp'|translate }}</div>
                <div ng-show="!editVersion.canPublishToLive"
                     class="alert alert-info"
                     style="margin-bottom: 0;padding-bottom: 0;">
                    {{ 'TagManager_PublishLiveEnvironmentCapabilityRequired'|translate:('TagManager_CapabilityPublishLiveContainer'|translate) }}
                </div>
            </div>

            <div piwik-field uicontrol="select" name="environment"
                 ng-show="editVersion.create && editVersion.environments.length"
                 ng-model="editVersion.version.environment"
                 ng-change="editVersion.setValueHasChanged()"
                 introduction="{{ 'TagManager_OrCreateAndPublishVersion'|translate }}"
                 title="{{ 'TagManager_Environment'|translate }}"
                 options="editVersion.environments"
                 inline-help="#selectTagManagerEnvironmentHelp">
            </div>


            <div piwik-save-button
                 ng-show="editVersion.create && editVersion.environments.length"
                 class="publishButton"
                 onconfirm="editVersion.createVersionAndPublish()"
                 data-disabled="editVersion.model.isUpdating || !editVersion.isDirty"
                 value="{{ 'TagManager_CreateVersionAndPublishRelease'|translate }}"
                 saving="editVersion.model.isUpdating">
            </div>

            <div class="versionChanges" ng-if="editVersion.lastVersion">
                <h3>{{ 'TagManager_ChangesSinceLastVersion'|translate }}:</h3>
                <table piwik-content-table>
                    <thead>
                        <tr><th>{{ 'SitesManager_Type'|translate }}</th>
                            <th>{{ 'General_Name'|translate }}</th>
                            <th>{{ 'TagManager_Change'|translate }}</th>
                            <th>{{ 'TagManager_LastUpdated'|translate }}</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr ng-if="editVersion.isLoadingVersionChanges">
                            <td colspan="4"><div piwik-activity-indicator loading-message="'TagManager_DetectingChanges'|translate" loading="true"></div></td>
                        </tr>
                        <tr ng-if="!editVersion.versionChanges.length && !editVersion.isLoadingVersionChanges">
                            <td colspan="4">{{ 'UserCountryMap_None'|translate }}</td>
                        </tr>
                        <tr
                            ng-repeat="versionChange in editVersion.versionChanges">
                            <td>{{ versionChange.entityType|translate }}</td>
                            <td>{{ versionChange.name }}</td>
                            <td>{{ versionChange.type|translate }}</td>
                            <td class="lastUpdated"><span>{{ versionChange.lastChanged }}</span></td>
                        </tr>
                    </tbody>
                </table>
            </div>

            <div class='entityCancel' ng-show="!editVersion.isEmbedded">
                <a ng-click="editVersion.cancel()">{{ 'General_Cancel'|translate }}</a>
            </div>
        </div>
    </form>
</div>