Use modal panel instead of prompt() when creating folders

This commit is contained in:
Pierre-Olivier Latour
2014-04-02 09:41:07 -07:00
parent e27fd601a8
commit ccfb4f0b54
3 changed files with 38 additions and 2 deletions

View File

@@ -64,6 +64,11 @@
float: right;
}
#create-input {
width: 250px;
height: 20px;
}
/* Bootstrap overrides */
.btn:focus {

View File

@@ -95,6 +95,27 @@
</div>
<div class="modal fade" id="create-modal" tabindex="-1">
<div class="modal-dialog">
<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">
<p>Please enter the name of the folder to be created:</p>
<form onsubmit="return false">
<input type="text" autocomplete="off" id="create-input">
</form>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
<button type="button" class="btn btn-primary" id="create-confirm">Create</button>
</div>
</div>
</div>
</div>
<script type="text/x-tmpl" id="template-listing">
<tr class="row-file" data-path="{%=o.path%}" data-name="{%=o.name%}">
<td class="column-icon">

View File

@@ -203,8 +203,18 @@ $(document).ready(function() {
});
$("#create-folder").click(function(event) {
var name = prompt("Please enter folder name:", "Untitled folder");
if ((name != null) && (name != "")) {
$("#create-input").val("Untitled folder");
$("#create-modal").modal("show");
$("#create-modal").on("shown.bs.modal", function(event) {
$("#create-input").focus();
$("#create-input").select();
})
});
$("#create-confirm").click(function(event) {
$("#create-modal").modal("hide");
var name = $("#create-input").val();
if (name != "") {
$.ajax({
url: 'create',
type: 'POST',