<!DOCTYPE html>



<html>

<head>

<meta charset="utf-8" />

<meta http-equiv="X-UA-Compatible" content="IE=9" />

<title>Edit Aspect</title>

<link href="/content/css/admin.css" rel="Stylesheet" media="all" />

<link href="/content/css/jquery/common.css" rel="Stylesheet" media="all" />

<link href="/content/css/controls/markdown.css" rel="Stylesheet" media="all" />





<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.js"></script>

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.13/jquery-ui.js"></script>



<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.8/jquery.validate.min.js"></script>

<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/mvc/3.0/jquery.validate.unobtrusive.min.js"></script>

<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/mvc/3.0/jquery.unobtrusive-ajax.min.js"></script>



<script type="text/javascript" src="https://github.com/jquery/jquery-tmpl/raw/master/jquery.tmpl.min.js"></script>

<script type="text/javascript" src="http://cloud.github.com/downloads/SteveSanderson/knockout/knockout-1.2.1.debug.js"></script>

<script type="text/javascript" src="https://github.com/SteveSanderson/knockout.mapping/raw/master/build/output/knockout.mapping-latest.debug.js"></script>

<script type="text/javascript" src="/content/scripts/modernizr.js"></script>

<script type="text/javascript" src="/content/scripts/markdown.js"></script>

<script type="text/javascript" src="/content/scripts/jsonview.js"></script>

<script type="text/javascript" src="/content/scripts/lightcast.js"></script>



<script type="text/javascript">
$(document).ready(function () {
$("textarea.mdd_editor").MarkdownDeep({
help_location: "/content/resources/mdd_help.htm",
disableTabHandling: false
});
});

</script>

</head>

<body>

<br class="space" />

<div class="container">

<nav id="menu">

<ul>

<li>

<a href="/Administrator/Home/Aspects">Aspects</a>

</li>

<li>

<a href="/Administrator/Home/Templates">Templates</a>

</li>

<li>

<a href="#">Members</a>

</li>

</ul>

</nav>

<div id="main">





<form action="/Administrator/Aspects/Edit" id="__frmAspect" method="post"><div class="validation-summary-valid" data-valmsg-summary="true"><ul><li style="display:none"></li>

</ul></div>

<input name="__RequestVerificationToken" type="hidden" value="WFAkecHcRzBYa6airaUBj8orKWQNE2wxgOmkRzGkgJgzb+RyMZnHg5C4ETh/dFq4m83lmJAB9L58XDCzTZODWMkjxL6p6sLQZNHmgr7M9HbihIyPMeClFWNnimj2X2wmzzkt1n1ERkq6qgWbRKpkQ7MivxU=" />

<br class="space" />

<ul class="clearfix">

<li>

<label for="Classification">Classification</label>

<span class="input-validation-rules">The classification of the aspect being created. <strong>All aspects must have a classification</strong>.</span>

<select data-bind="value:Classification" data-val="true" data-val-required="The Classification field is required." id="Classification" name="Classification"><option value=""></option><option value="One">One</option><option value="Two">Two</option><option value="Three">Three</option><option value="Four">Four</option><option value="Five">Five</option><option value="Six">Six</option><option value="Seven">Seven</option><option value="Eight">Eight</option></select>

</li>

<li>

<label for="Archetype">Archetype</label>

<span class="input-validation-rules">The primary archetype that the aspect belongs to. Select <em>None</em> if this does not apply.</span>

<select data-bind="value:Archetype" data-val="true" data-val-required="The Archetype field is required." id="Archetype" name="Archetype"><option value=""></option><option value="None">None</option><option value="Physical">Physical</option><option value="Mental">Mental</option><option value="Spirit">Spirit</option></select>

</li>

</ul>

<br class="space" />

<ul class="clearfix">

<li>

<label for="Name">Name</label>

<span class="input-validation-rules">The name of the aspect, you can't use: <em>[ ] | ; , $ \ < > "</em></span>

<input data-bind="value:Name,uniqueName:true" data-val="true" data-val-regex="Invalid name. Names must be between 3 and 64 characters in length, may contain any alphanumeric character and the symbols -&amp;#39;, and whitespace only." data-val-regex-pattern="^(?!.*[ ]{2})(?!.*[&#39;]{2})(?!.*[-]{2})(?:[a-zA-Z0-9 \p{L}&#39;-]{3,64}$)$" data-val-required="The Name field is required." id="Name" name="Name" size="45" type="text" />

</li>

</ul>

<br class="space" />
<br class="space" />

<div>

<label for="Description">Description</label>

<span class="input-validation-rules">A brief description of the aspect.</span>

<div class="mdd_toolbar"></div><textarea cols="50" data-bind="value:Description" data-mdd-preview="#aspectPreview" data-val="true" data-val-required="The Description field is required." id="Description" name="Description" rows="10" class="mdd_editor"></textarea><div id="aspectPreview"></div>

</div>

<h2>Properties</h2>

<hr />

<br class="space" />

<div class="clearfix right">

<button type="submit">Submit</button>

</div>

</form>

<script type="text/javascript">

// Construct knockout view models for persisting the aspect
var viewModel = {
// a GUID that the user will never be able to edit. This
// is assigned, maintained, and persisted by the server.
Id
: ko.observable(),
Name
: ko.observable(),
Description
: ko.observable(),
Archetype
: ko.observable(),
Classification
: ko.observable(),
Properties
: ko.observableArray([]),

Save: function () {
alert('we reached the save function.');

// we will try to send the model to the server.
ko.utils.postJson(
$("#__frmAspect").attr('action'),
{ model: ko.toJS(this) }
);
}
};

// ----------------------------------------------------------------------- //
// **************************** MODEL BINDING **************************** //
// ----------------------------------------------------------------------- //

// apply the knockout binding to the viewModel
ko.applyBindings(viewModel, $("#__frmAspect")[0]);

// attach the jquery unobtrusive validator
$.validator.unobtrusive.parse("#__frmAspect");

// bind the submit handler to unobtrusive validation.
$("#__frmAspect").validate({
submitHandler: function (form) {
viewModel.Save();
}
});

</script>

</div>

</div>

</body>

</html>