<div class="umb-dialog umb-pane umb-dialog-datatype-delete" ng-controller="Umbraco.Editors.DataType.DeleteController as vm">
    <div class="umb-dialog-body">

        <ng-switch on="currentNode.nodeType">
            <div ng-switch-when="container">

                <p class="abstract">
                    <localize key="defaultdialogs_confirmdelete">Are you sure you want to delete</localize>&nbsp;<strong>{{currentNode.name}}</strong>?
                </p>
                <umb-confirm on-confirm="vm.performContainerDelete"
                             on-cancel="vm.cancel"
                             confirm-button-style="danger"
                             confirm-label-key="general_delete">
                </umb-confirm>
            </div>

            <div ng-switch-default>


                    <umb-load-indicator ng-if="vm.loading === true"></umb-load-indicator>

                    <div ng-if="vm.loading === false && vm.hasReferences === false">
                        <p class="abstract">
                            <localize key="defaultdialogs_confirmdelete">Are you sure you want to delete</localize>&nbsp;<strong>{{currentNode.name}}</strong>?
                        </p>
                    </div>

                    <div ng-if="vm.loading === false && vm.hasReferences === true">

                        <p class="abstract">
                            <localize key="editdatatype_hasReferencesDeleteConsequence" tokens="[currentNode.name]">Deleting <strong>{{currentNode.name}}</strong> will have the following consequence</localize>
                        </p>

                        <hr/>

                        <!-- Document Types -->

                        <div ng-if="vm.references.documentTypes.length > 0">

                            <h5 class="mt4" style="margin-bottom: 20px;">
                                <localize key="treeHeaders_documentTypes">Document Types</localize>
                            </h5>

                            <table class="table table-condensed table-bordered">
                                <thead>
                                    <tr>
                                        <th class="umb-dialog-datatype-delete__table-head-column-name"><localize key="general_name">Name</localize></th>
                                        <th><localize key="general_properties">Properties</localize></th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <tr ng-repeat="relation in vm.references.documentTypes">
                                        <td>
                                            <a title="{{::relation.name}}({{::relation.alias}})" href="#/settings/documentTypes/edit/{{::relation.id}}" ng-click="vm.onReferenceClicked($event)">
                                                <umb-icon icon="{{relation.icon}}" class="umb-table-body__icon"></umb-icon> {{::relation.name}}
                                            </a>
                                        </td>
                                        <td>
                                            <div>
                                                <p class="red" ng-repeat="property in relation.properties">
                                                    <umb-icon icon="icon-alert" class="icon red"></umb-icon> {{::property.name}}
                                                </p>
                                            </div>
                                        </td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>


                        <!-- Media Types -->
                        <div ng-if="vm.references.mediaTypes.length > 0">

                            <h5 class="mt4" style="margin-bottom: 20px;">
                                <localize key="treeHeaders_mediaTypes">Media Types</localize>
                            </h5>

                            <table class="table table-condensed table-bordered">
                                <thead>
                                    <tr>
                                        <th class="umb-dialog-datatype-delete__table-head-column-name"><localize key="general_name">Name</localize></th>
                                        <th><localize key="general_properties">Properties</localize></th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <tr ng-repeat="relation in vm.references.mediaTypes">
                                        <td>
                                            <a title="{{::relation.name}}({{::relation.alias}})" href="#/settings/documentTypes/edit/{{::relation.id}}" ng-click="vm.onReferenceClicked($event)">
                                                <umb-icon icon="{{relation.icon}}" class="umb-table-body__icon"></umb-icon> {{::relation.name}}
                                            </a>
                                        </td>
                                        <td>
                                            <div>
                                                <p class="red" ng-repeat="property in relation.properties">
                                                    <umb-icon icon="icon-alert" class="icon red"></umb-icon> {{::property.name}}
                                                </p>
                                            </div>
                                        </td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>


                        <!-- Member Types -->
                        <div ng-if="vm.references.memberTypes.length > 0">

                            <h5 class="mt4" style="margin-bottom: 20px;">
                                <localize key="treeHeaders_memberTypes">Member Types</localize>
                            </h5>

                            <table class="table table-condensed table-bordered">
                                    <thead>
                                        <tr>
                                            <th class="umb-dialog-datatype-delete__table-head-column-name"><localize key="general_name">Name</localize></th>
                                            <th><localize key="general_properties">Properties</localize></th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        <tr ng-repeat="relation in vm.references.memberTypes">
                                            <td>
                                                <a title="{{::relation.name}}({{::relation.alias}})" href="#/settings/documentTypes/edit/{{::relation.id}}" ng-click="vm.onReferenceClicked($event)">
                                                    <umb-icon icon="{{relation.icon}}" class="umb-table-body__icon"></umb-icon> {{::relation.name}}
                                                </a>
                                            </td>
                                            <td>
                                                <div>
                                                    <p class="red" ng-repeat="property in relation.properties">
                                                        <umb-icon icon="icon-alert" class="icon red"></umb-icon> {{::property.name}}
                                                    </p>
                                                </div>
                                            </td>
                                        </tr>
                                    </tbody>
                                </table>

                        </div>

                        <umb-checkbox model="vm.confirmed" text="{{vm.labels.deleteConfirm}}"></umb-checkbox>

                    </div>


                <umb-confirm confirm-disabled="!(vm.confirmed || vm.hasReferences === false)"
                             on-confirm="vm.performDelete"
                             on-cancel="vm.cancel"
                             confirm-button-style="danger"
                             confirm-label-key="general_delete">
                </umb-confirm>
            </div>
        </ng-switch>

    </div>
</div>
