Source

Redbeard / templates / key.html

<article id="key">
	<header>
		<h2>{{ rtype }}: <b>{{ key }}</b></h2>
		{% if ttl %}
		<h3>Key expires in: {{ ttl }} seconds</h3>
		{% endif %}
	</header>
	<form action="{{ url_for('save', key=key) }}" method="post" id="key">
		<textarea name="value" cols="60" rows="20">{{ output }}</textarea>
		<div id="controls">
			<a id="refresh" href="{{ url_for('key', key=key) }}" title="refresh">refresh</a>
			<a id="delete" href="{{ url_for('delete', key=key) }}" title="delete">delete</a>
			<input type="submit" value="save" title="save">
		</div>
	</form>
</article>

<script>
	$(function() {
		var flashes = $("#flashes");

		$("#refresh").live('click', function(e) {
        	var link = $(this).attr('href'),
            	hash = link.replace("/key/", "");
        	e.preventDefault();
        	$.get(link, function(data) {
            	$('#right').html(data);
            	window.location.hash = hash;
        	});
		});

		$("#delete").live('click', function(e) {
			e.stopPropagation();
			e.preventDefault();
			var link = $(this).attr("href");
			$.confirm({
				'title': 'Delete Confirmation',
				'message': 'Are you sure you want to delete this key?',
				'buttons': {
					'Yes': {
						'class': 'go',
						'action': function() {
							$.ajax({
								url: link,
								dataType: "json",
								success: function(data) {
									flashes.empty();
									$("<li>").text(data['flash']).appendTo(flashes);
									$("#refresh_keys").trigger('click');
								}
							});
						}
					},
					'No': {
						'class': 'stop'
					}
				}
			});
		});

    	$("#key").submit(function(e) {
        	e.preventDefault();

			var link = $(this).attr("action"),
				flashes = $("#flashes");

			flashes.empty();

			$.ajax({
				url: link,
				type: "POST",
				data: {
					"value": $(this).find("textarea").val()
				},
				dataType: "json",
				success: function(data) {
					$(this).find("textarea").val(data['value']);
					$("<li>").text(data['flash']).appendTo(flashes);
				}
			});
    	});
	});
</script>