nano-tetra-modules/Cabinet/module.html

180 lines
7.4 KiB
HTML

<div class="row" ng-controller="CabinetController">
<div class="col-md-12">
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">{{ currentDirectory }}</h3>
</div>
<div class="panel-body">
<form class="form-inline pull-right" role="form">
<div class="input-group">
<input type="text" placeholder="Change Directory" class="form-control" ng-model="userDirectory">
<span class="input-group-btn">
<button type="submit" class="btn btn-default" ng-click="getDirectoryContents(userDirectory)">Go</button>
</span>
</div>
</form>
<span class="input-group-btn pull-left">
<button type="button" class="btn btn-default btn-sm" ng-show="currentDirectory == '/'" disabled>Back</button>
<button type="button" class="btn btn-default btn-sm" ng-click="goToParentDirctory()" ng-hide="currentDirectory == '/'">Back</button>
<button type="button" class="btn btn-default btn-sm" data-toggle="modal" data-target="#fileModal">New File</button>
<button type="button" class="btn btn-default btn-sm" data-toggle="modal" data-target="#folderModal">New Folder</button>
<button type="button" class="btn btn-default btn-sm" ng-click="getDirectoryContents(currentDirectory)">Refresh</button>
</span>
<br />
<hr/>
<div class="table-responsive">
<table class="table table-striped" align="center">
<thead>
<th>File Name</th>
<th>Location</th>
<th>Permissions</th>
<th>Size</th>
<th>Delete</th>
<th>Edit</th>
</thead>
<tbody>
<tr ng-repeat="item in directoryContents">
<td ng-hide="item.directory">{{ item.name }}</td>
<td ng-show="item.directory"><a href="javascript:;" ng-click="getDirectoryContents(item.path)">{{ item.name }}</a></td>
<td class="text-muted"><i>{{ item.path }}</i></td>
<td class="text-muted"><i>{{ item.permissions }}</i></td>
<td class="text-muted"><i>{{ item.size }}</i></td>
<td><a href="" data-toggle="modal" data-target="#deleteModal" ng-click="requestDeleteFile(item)">Delete</a></td>
<td><a href="" ng-hide="item.directory" ng-click="requestEditFile(item)" data-toggle="modal" data-target="#fileModal">Edit</a></td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
<!-- Edit file Modal -->
<div id="fileModal" class="modal fade" role="dialog">
<script type="text/javascript">
// Thanks to sud0nick on forums.hak5.org for this snippet
$(document).delegate('#cabinetEditor', 'keydown', function(e) {
var keyCode = e.keyCode || e.which;
if (keyCode == 9) {
for (var i = 0; i < 4; i++) {
// get caret position/selection
var start = this.selectionStart;
var end = this.selectionEnd;
var $this = $(this);
var value = $this.val();
// set textarea value to: text before caret + tab + text after caret
$this.val(value.substring(0, start)
+ " "
+ value.substring(end));
// put caret at right position again (add one for the tab)
this.selectionStart = this.selectionEnd = start + 1;
// prevent the focus lose
e.preventDefault();
}
}
});
</script>
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" ng-click="editFile = {}">&times;</button>
<h4 class="modal-title">File Editor {{ editFile.name }}</h4>
</div>
<div class="modal-body">
<label class="control-label">File Name</label>
<input type="text" class="form-control" ng-model="editFile.name" placeholder="Notes.txt">
<br />
<label class="control-label">File Contents</label>
<a href="javascript:;" ng-click="editFile.content = ''" class="pull-right">Clear</a>
<textarea class="form-control" rows="10" id="cabinetEditor" ng-model="editFile.content" placeholder="Write some text here"></textarea>
<label class="control-label pull-right">File Size: {{ editFile.size }}</label>
<a href="javascript:;" class="pull-left" ng-click="download(editFile.path)">Download</a>
<br />
</div>
<div class="modal-footer">
<button type="button" ng-click="sendEditFile()" class="btn btn-success pull-right" data-dismiss="modal">Save</button>
<button type="button" class="btn btn-default pull-left" data-dismiss="modal" ng-click="editFile = {}">Cancel</button>
</div>
</div>
</div>
</div>
<!-- Delete file Modal -->
<div id="deleteModal" class="modal fade" role="dialog">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" ng-click="deleteFile = {}">&times;</button>
<h4 class="modal-title">Delete File {{ deleteFile.name }}</h4>
</div>
<div class="modal-body">
<p>You are about to delete {{ deleteFile.name }}. Once you do this it can not be undone.</p>
<p ng-show="deleteFile.directory">{{ deleteFile.name }} is a directory. Deleteing it will also delete all files and folders contained inside.</p>
<p><b>Are you absolutely sure you want to delete {{ deleteFile.name }} located at {{ deleteFile.path }}?</b></p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-primary pull-right" data-dismiss="modal" ng-click="deleteFile = {}">Cancel</button>
<button type="button" class="btn btn-danger pull-left" data-dismiss="modal" ng-click="sendDeleteFile()">Delete</button>
</div>
</div>
</div>
</div>
<!-- Create directory Modal -->
<div id="folderModal" class="modal fade" role="dialog">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">&times;</button>
<h4 class="modal-title">Create Folder</h4>
</div>
<div class="modal-body">
<form class="form-inline" role="form">
<label class="control-label">Folder Name</label>
<input type="text" class="form-control" ng-model="newFolder.name" placeholder="Notes.txt">
</form>
</div>
<div class="modal-footer">
<button type="button" ng-click="createFolder()" class="btn btn-success pull-left" data-dismiss="modal">Create</button>
<button type="button" class="btn btn-default pull-right" data-dismiss="modal">Cancel</button>
</div>
</div>
</div>
</div>
<!-- Create Message Modal -->
<div id="messageModal" class="modal fade" role="dialog">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">&times;</button>
<h4 class="modal-title">{{ message.title }}</h4>
</div>
<div class="modal-body">
<p>{{ message.body }}</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default pull-right" data-dismiss="modal">Dismiss</button>
</div>
</div>
</div>
</div>
</div>