@* <meta charset="utf-8" /> *@
@()

@headerContent = {
<script>
function getLogs() {
	$('#logs').load( '/log/' ,  function() {
	});
}
function setupLog(logId) {
	var wlogId = logId
	var logElmId = "#log-" + logId
	var logElm = $(logElmId)
	logElm.find(".post-comment-btn").click(function(obj){
		var disupdateFlag = logElm.find("input[name=disupdate-flag]").is(':checked');
		var content = logElm.find("textarea[name=content]").val();
		var name = logElm.find("input[name=name]").val();
		data = {
				name:name,
				content:content,
				disupdateFlagLog:disupdateFlag
			};
	    var url = "/log/" + wlogId + "/comment/"
		$.ajax({
			type:'POST',
			url: url,
			cache: false,
			data: data
		}).done(function( result ) {
			getLogs();
		}).fail(function(result) {
			if(result.status == 500) {
				window.alert("not found(bug?)");
			} else {
				var errors = $.parseJSON(result.responseText)
				var message = "";
				for(var prop in errors) {
					message += prop + " : "+ errors[prop] + "\n";
				} 
				window.alert(message);
			}
		});		
	})
}
$(document).ready( function() {	
	$("#loader").ajaxStart(function() {
        $(this).show(200);
    }).ajaxStop(function() {
        $(this).hide(200);
    });
	$('#post-log-btn').click(function(obj){
		data = {
			title:$('#log-title-input').val(),
			name:$('#name-input').val(),
			logBody:$('#log-body-textarea').val()
		};
		$.ajax({
			type:'POST',
			url: "/log/",
			cache: false,
			data: data
		}).done(function( result ) {
			$('#log-title-input').val("")
			$('#name-input').val("")
			$('#log-body-textarea').val("")			
			getLogs();
		}).fail(function(result) {
			var errors = $.parseJSON(result.responseText)
			var message = "";
			for(var prop in errors) {
				message += prop + " : "+ errors[prop] + "\n";
			} 
			window.alert(message);
		});
	});
	
	getLogs();
});
</script>
<style>
div#loader{
	position:absolute;
	display:none;
	}
</style>	
}

@main("Origami Simple App", headerContent) {
<div class="row-fluid" style="margin-top:10px;margin-bottom:10px;">
  <div class="span1" style=""></div>
  <div class="span11" style="">
	[<a href="http://localhost:2480/studio/" target="_blank">Open OrientDB Studio</a>](user:admin/password:admin)&nbsp;<img id="loader" src="@routes.Assets.at("img/loading.gif")" width="15" height="15"/>
  </div>
</div>

<div class="row-fluid">
  <div class="span1" style=""></div>
  <div class="span10" style="">
    <div class="row-fluid" style="margin-bottom:10px;">
	  	<div class="span2" style="text-align:right;"><label>Title:</label></div>
	  	<div class="span10">
			<div class="span12" style="text-align:right;">
				<input type="text" id="log-title-input" class="span12" style="" />
			</div>
	  	</div>
    </div>
    <div class="row-fluid" style="margin-bottom:10px;">
	  	<div class="span2" style="text-align:right;"><label>Your Name:</label></div>
	  	<div class="span10">
			<div class="span12" style="text-align:right;">
				<input type="text" id="name-input" class="span12" style="" />
			</div>
	  	</div>
    </div>      
    <div class="row-fluid" >
	  	<div class="span2" style="text-align:right;"><label>Message:</label></div>
	  	<div class="span10">
			<div class="span12" style="text-align:right;">
				<textarea id="log-body-textarea" class="span12" style="resize:vertical;"></textarea>
			</div>
	  	</div>
    </div>
    <div class="row-fluid" >
	  	<div class="span12">
	  		<div class="span10" style="text-align:left;"></div>
			<div class="span2" style="text-align:right;">
				<span id="post-log-btn" class="btn btn-success"><span>POST</span></span>						
			</div>		
	  	</div>  	
  	</div>
  </div>
  <div class="span1" style=""></div>  
</div>

<br/>

<ul id="logs"></ul>

}