Use jQuery (UI) to show/hide the upload dialog

This commit is contained in:
Paul van Tilburg 2012-01-11 17:04:20 +01:00
parent 41bd8dbdb4
commit 2143fc6d72
2 changed files with 19 additions and 2 deletions

14
public/dragreg.js Normal file
View file

@ -0,0 +1,14 @@
$(document).ready(function() {
$("#add").click(show_add_dialog);
$("#add_form #cancel").click(hide_add_dialog);
});
function show_add_dialog() {
$('#add_dialog').show(1);
};
function hide_add_dialog() {
$("#add_dialog").hide(.5, function() {
$("#add_form")[0].reset();
});
};

View file

@ -4,6 +4,9 @@
<title>Plemp!</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link type="text/css" media="screen" href="/plemp.css" rel="stylesheet">
<script type="text/javascript" src="/jquery.js" rel="stylesheet"></script>
<script type="text/javascript" src="/jquery-ui.min.js" rel="stylesheet"></script>
<script type="text/javascript" src="/dragreg.js" rel="stylesheet"></script>
</head>
<body>
<div id="header">
@ -15,7 +18,7 @@
<div id="add">+</div>
</h1>
</div>
<div id="add_dialog">
<div id="add_dialog" style="display:none;">
<div class="background"></div>
<form method="post" action="/upload" enctype="multipart/form-data" id="add_form">
<h2>Plemp it!</h2>
@ -26,7 +29,7 @@
<input type="file" name="file" id="file"/>
</p>
<div class="right">
<input type="button" value="Cancel"/>
<input type="button" id="cancel" value="Cancel"/>
<input type="submit" value="Upload!"/>
</div>
</form>