
<div class="modal" ng-controller="SaveModelCtrl">
    <div class="modal-dialog">
        <div class="modal-content">
        <div class="modal-header">
            <h2>{{'MODEL.SAVE.TITLE' | translate}}</h2>
        </div>
        <div class="modal-body">
        	<div ng-if="saveDialog.errorMessage && saveDialog.errorMessage.length > 0" class="alert error" style="font-size: 14px; margin-top:20px">
                <div class="popup-error" style="font-size: 14px">
                	<span class="glyphicon glyphicon-remove-circle"></span>
                	<span>{{saveDialog.errorMessage}}</span>
              	</div>
            </div>
        	<div class="form-group">
           		<label for="nameField">{{'MODEL.NAME' | translate}}</label>
        		<input type="text"
                       ng-disabled="status.loading || (error && error.conflictResolveAction == 'saveAs')"
                       id="nameField"
                       class="form-control"
                       ng-model="saveDialog.name"
                       auto-focus />
        	</div>
        	<div class="form-group">
           		<label for="keyField">{{'MODEL.KEY' | translate}}</label>
        		<input type="text"
                       ng-disabled="status.loading || (error && error.conflictResolveAction == 'saveAs')"
                       id="keyField"
                       class="form-control"
                       ng-model="saveDialog.key" />
        	</div>
        	<div class="form-group">
           		<label for="docTextArea">{{'MODEL.DESCRIPTION' | translate}}</label>
           		<textarea id="docTextArea" ng-disabled="status.loading" class="form-control" ng-model="saveDialog.description"></textarea>
        	</div>
        	<div class="checkbox" ng-show="!error && !error.isConflict">
           		<label>
           			<input type="checkbox" ng-disabled="status.loading" ng-model="saveDialog.newVersion" >
           				{{'MODEL.SAVE.NEWVERSION' | translate}}
           		</label>
        	</div>
        	<div class="form-group" ng-if="saveDialog.newVersion">
           		<label for="commentTextArea">{{'MODEL.SAVE.COMMENT' | translate}}</label>
           		<textarea id="commentTextArea" class="form-control" ng-model="saveDialog.comment" ng-disabled="status.loading"></textarea>
        	</div>
        	
        	<div ng-if="saveDialog.validationErrors" class="alert error" style="font-size: 14px; margin-top:20px">
        
                <div class="popup-error" style="font-size: 14px">
                    <span class="glyphicon glyphicon-remove-circle"></span>
                    <span>{{'MODEL.VALIDATIONERRORS' | translate:error}}</span>
                </div>
            </div>
        
            <div ng-if="error && error.isConflict && !status.loading" class="alert error" style="font-size: 14px; margin-top:20px">
        
                <div class="popup-error" style="font-size: 14px">
                    <span class="glyphicon glyphicon-remove-circle"></span>
                    <span>{{'MODEL.CONFLICT.WRITE' | translate:error}}</span>
                </div>
        
                <div>
        
                    <div style="font-size: 14px; margin-bottom: 10px">{{'MODEL.CONFLICT.WRITE.OPTIONS' | translate}}</div>
                    <div class="btn-group" data-toggle="buttons">
                        <label class="btn btn-danger"
                               ng-click="error.conflictResolveAction = 'overwrite'">
                            <input type="radio" name="options" id="option1">
                            {{'MODEL.CONFLICT.WRITE.OPTION.OVERWRITE' | translate}}
                        </label>
                        <label class="btn btn-danger"
                               ng-click="error.conflictResolveAction = 'discardChanges'">
                            <input type="radio" name="options" id="option2">
                            {{'MODEL.CONFLICT.WRITE.OPTION.DISCARDCHANGES' | translate}}
                        </label>
                        <label class="btn btn-danger"
                               ng-click="error.conflictResolveAction = 'saveAs'">
                            <input type="radio" name="options" id="option3" ng-disabled="account.type != 'enterprise'">
                            {{'MODEL.CONFLICT.WRITE.OPTION.SAVEAS' | translate}}
                        </label>
                        <label class="btn btn-danger"
                               ng-click="error.conflictResolveAction = 'newVersion'">
                            <input type="radio" name="options" id="optio43">
                            {{'MODEL.CONFLICT.WRITE.OPTION.NEWVERSION' | translate}}
                        </label>
                    </div>
        
                    <div ng-if="error.conflictResolveAction == 'saveAs'" style="margin-top: 10px">
                        <span>{{'MODEL.CONFLICT.SAVEAS' | translate}}</span>
                        <input type="text" ng-model="error.saveAs" style="width: 300px" auto-focus>
                    </div>
                </div>
        
            </div>
        
        </div>
        <div class="modal-footer">
        
        	<div class="pull-right">
            	<button type="button" class="btn" ng-click="close()" ng-disabled="status.loading" translate>ACTION.CANCEL</button>
            	<button class="btn btn-primary" ng-click="saveAndClose()" ng-disabled="status.loading || saveDialog.name.length == 0 || saveDialog.key.length == 0" ng-show="!error && !error.isConflict" translate>ACTION.SAVE-AND-CLOSE</button>
            	<button class="btn btn-primary" ng-click="save()" ng-disabled="status.loading || saveDialog.name.length == 0 || saveDialog.key.length == 0" ng-show="!error && !error.isConflict" translate>ACTION.SAVE</button>
                <button class="btn btn-primary" ng-click="okClicked()" ng-disabled="isOkButtonDisabled()" ng-show="error && error.isConflict" translate>ACTION.OK</button>
            </div>
        
            <div class="pull-right popup-error" ng-if="error && !error.isConflict">
                <span>{{'MODEL.SAVE.ERROR' | translate}}</span>
            </div>
        
        	<loading></loading>
        
        </div>
    </div>
</div>